[ { "path": ".changeset/README.md", "content": "# Changesets\n\nHello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works\nwith multi-package repos, or single-package repos to help you version and publish your code. You can\nfind the full documentation for it [in our repository](https://github.com/changesets/changesets)\n\nWe have a quick list of common questions to get you started engaging with this project in\n[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)\n" }, { "path": ".changeset/config.json", "content": "{\n \"$schema\": \"https://unpkg.com/@changesets/config@2.2.0/schema.json\",\n \"changelog\": \"@changesets/cli/changelog\",\n \"commit\": false,\n \"fixed\": [],\n \"linked\": [[\"solid-js\", \"babel-preset-solid\"]],\n \"access\": \"public\",\n \"baseBranch\": \"main\",\n \"updateInternalDependencies\": \"patch\",\n \"ignore\": []\n}\n" }, { "path": ".editorconfig", "content": "root = true\n\n[*]\nindent_style = space\nindent_size = 2\nend_of_line = LF\ncharset = utf-8\ninsert_final_newline = true" }, { "path": ".github/FUNDING.yml", "content": "open_collective: solid\n" }, { "path": ".github/ISSUE_TEMPLATE/bug_report.yml", "content": "name: '🐛 Bug report'\ndescription: Create a report to help us improve\nbody:\n - type: markdown\n attributes:\n value: |\n Thank you for reporting an issue :pray:.\n\n This issue tracker is for reporting bugs found in `solid` (https://github.com/solidjs/solid).\n If you have a question about how to achieve something and are struggling, please post a question\n inside of `solid` Discussions tab: https://github.com/solidjs/solid/discussions\n\n Before submitting a new bug/issue, please check the links below to see if there is a solution or question posted there already:\n - `solid` Issues tab: https://github.com/solidjs/solid/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc\n - `solid` closed issues tab: https://github.com/solidjs/solid/issues?q=is%3Aissue+sort%3Aupdated-desc+is%3Aclosed\n - `solid` Discussions tab: https://github.com/solidjs/solid/discussions\n\n The more information you fill in, the better the community can help you.\n - type: textarea\n id: description\n attributes:\n label: Describe the bug\n description: Provide a clear and concise description of the challenge you are running into.\n validations:\n required: true\n - type: input\n id: link\n attributes:\n label: Your Example Website or App\n description: |\n Which website or app were you using when the bug happened?\n Note:\n - Your bug will may get fixed much faster if we can run your code and it doesn't have dependencies other than the solid-js npm package.\n - To create a shareable code example you can use Stackblitz (https://stackblitz.com/). Please no localhost URLs.\n - Please read these tips for providing a minimal example: https://stackoverflow.com/help/mcve.\n placeholder: |\n e.g. https://stackblitz.com/edit/...... OR Github Repo\n validations:\n required: true\n - type: textarea\n id: steps\n attributes:\n label: Steps to Reproduce the Bug or Issue\n description: Describe the steps we have to take to reproduce the behavior.\n placeholder: |\n 1. Go to '...'\n 2. Click on '....'\n 3. Scroll down to '....'\n 4. See error\n validations:\n required: true\n - type: textarea\n id: expected\n attributes:\n label: Expected behavior\n description: Provide a clear and concise description of what you expected to happen.\n placeholder: |\n As a user, I expected ___ behavior but i am seeing ___\n validations:\n required: true\n - type: textarea\n id: screenshots_or_videos\n attributes:\n label: Screenshots or Videos\n description: |\n If applicable, add screenshots or a video to help explain your problem.\n For more information on the supported file image/file types and the file size limits, please refer\n to the following link: https://docs.github.com/en/github/writing-on-github/working-with-advanced-formatting/attaching-files\n placeholder: |\n You can drag your video or image files inside of this editor ↓\n - type: textarea\n id: platform\n attributes:\n label: Platform\n value: |\n - OS: [e.g. macOS, Windows, Linux]\n - Browser: [e.g. Chrome, Safari, Firefox]\n - Version: [e.g. 91.1]\n validations:\n required: true\n - type: textarea\n id: additional\n attributes:\n label: Additional context\n description: Add any other context about the problem here.\n" }, { "path": ".github/ISSUE_TEMPLATE/config.yml", "content": "blank_issues_enabled: true\ncontact_links:\n - name: 🤔 Long question or idea\n url: https://github.com/solidjs/solid/discussions\n about: Ask long-form questions and discuss ideas.\n - name: 💬 Community Chat\n url: https://discord.com/invite/solidjs\n about: Ask quick questions or simply chat on the SolidJS Discord server.\n - name: 💬 New Updates (Twitter)\n url: https://twitter.com/solid_js\n about: Link to our twitter account if you want to follow us and stay up to date with news\n - name: 💬 New Updates (Reddit)\n url: https://www.reddit.com/r/solidjs/\n about: Link to our twitter account if you want to follow us and stay up to date with news\n - name: 🍿 YouTube Channel\n url: https://www.youtube.com/c/RyanCarniato9\n about: Are you a techlead or wanting to learn more about SolidJS? Watch Ryan Carniato (creator of solidJS) share detailed technical deep dives into topics like how SolidJS, Server Side Rendering (SSR), ReactJS, Svelte, MarkoJS & Partial Hydration works under the hood and so much more\n" }, { "path": ".github/PULL_REQUEST_TEMPLATE.md", "content": "\n\n## Summary\n\n\n\n## How did you test this change?\n\n\n" }, { "path": ".github/workflows/main-ci.yml", "content": "name: 'Solid CI'\n\non:\n pull_request:\n branches:\n - '*'\n push:\n branches:\n - main\n\njobs:\n job:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v4\n - uses: pnpm/action-setup@v4\n - uses: actions/setup-node@v4\n with:\n node-version-file: \".nvmrc\"\n registry-url: \"https://registry.npmjs.org\"\n cache: \"pnpm\"\n\n - name: Installing deps\n run: pnpm install\n\n - name: Building\n run: pnpm run build\n\n - name: Testing & Coverage\n run: |\n pnpm run test\n pnpm run coverage\n\n - name: Coveralls\n uses: coverallsapp/github-action@v2\n with:\n base-path: packages/solid\n path-to-lcov: \"./packages/solid/coverage/lcov.info\"\n github-token: ${{ secrets.GITHUB_TOKEN }}\n\n - name: Archive production artifacts\n uses: actions/upload-artifact@v4\n with:\n name: dist-folder\n path: |\n '*/dist'\n '*/types'\n" }, { "path": ".gitignore", "content": "node_modules/\ndist/\nlib/\n.vscode/\n.idea/\ncoverage/\ntypes/\n.DS_Store\n.turbo/\n\npackages/solid/src/jsx.d.ts\npackages/solid/h/jsx-runtime/src/jsx.d.ts\npackages/solid/web/server/server.d.ts\npackages/solid/web/src/client.d.ts\npackages/solid/universal/src/universal.d.ts\n\n# vscode devcontainers see issues #419 and #421 for context\n/.devcontainer.json\n/devcontainer\n" }, { "path": ".gitpod.yml", "content": "tasks:\n - init: pnpm install && pnpm run build\nvscode:\n extensions: [\"esbenp.prettier-vscode\"]\n" }, { "path": ".nvmrc", "content": "22.13.1\n" }, { "path": ".prettierrc", "content": "{\n \"trailingComma\": \"none\",\n \"tabWidth\": 2,\n \"semi\": true,\n \"singleQuote\": false,\n \"arrowParens\": \"avoid\",\n \"printWidth\": 100\n}" }, { "path": "CHANGELOG.md", "content": "# Changelog\n\n## 1.8.0 - 2023-10-09\n\nI admit this is not the most exciting release from a feature standpoint. We are in that holding pattern between the end of 1.x and the start of 2.0. We recently made our new reactive experiments public and continue to build those out in public with [@solidjs/signals](https://github.com/solidjs/signals).\n\nThis version is more about addressing some of the fundamentals that will help us in other projects like SolidStart while we do the transition. A big part of this is applying what we have learned when doing performance benchmarks for the work that has been funded by [Google Chrome Aurora](https://www.solidjs.com/blog/chrome-supports-solidjs).\n\nAsync and Resources need work and are too all in. It is great to have a solution but now that we have a better understanding we need to start breaking things apart into their fundamental pieces.\n\n### De-duping Streaming Serialization\n\nThis is the marquee feature of this release and is largely the work of @lxsmnsyc. Solid has been able to serialize promises and do streaming for a couple of years now, but it was very special-cased. Now it is a generic mechanism.\n\nThis matters because it means that we have decoupled the promise serialization from Resources, and in so decoupled the whole when the stream is done from them. This opens up things like nested promises.\n\nMore so we have a mechanism now that deeply de-dupes data serialized across flushes. This is important for features like Islands where you might pass the same props to multiple Islands across different Suspense boundaries and don't want to send the data more than once. And even examples where that data can be accessed at varying depths (recursive comments in say a Hackernews site).\n\n### Hydration Improvements\n\nFragments for Hydration have been a bit of a pain and we keep seeming to have different issues reported around element duplication. Most commonly this has been around where there are `lazy` component siblings or where the fragment is top-level. After looking into and fixing an [issue for Astro](https://github.com/withastro/astro/pull/8365) I decided to look at some of the oldest bugs in Solid and found it was a similar bug.\n\nIn many cases, the DOM can change throughout Hydration while doing things like streaming but we need to pause and resume hydration because code isn't available yet. While we don't create elements during hydration, getting an accurate snapshot of the DOM for the current state for future list reconciliation is a process we've had a few tries at but in 1.8 we update this in a way that makes sure it doesn't get out of date.\n\nAlso in 1.8, we have added some performance improvements to hydration in the form of not redundantly setting attributes or props as the page hydrates similar to how we don't update text. This is all migration towards a future where we don't need to do as much hydration, but it is important to note that values will be kept as they were on the server rather than how they may compute at runtime during hydration.\n\n### Smaller Templates\n\nIn 1.7 we removed unnecessary closing tags from template strings. It was a bit painful because we were a bit overzealous at first. While I believe in the end we got to a good place, ultimately all but the simplest reductions have been hidden behind a compiler flag(`omitNestedClosingTags`). Thanks to work from @intrnl we are implementing another template size reduction technique of removing unnecessary quotes. Quotes are actually not required by HTML in some cases and it can add up.\n\n### Other\n\n#### Fix NGINX Server Side Includes\n\nComments led with `#` are treated as special directives for a few different servers so we've needed to change our open hydration markers to `$`. As usual, your version of Solid and the Babel Plugin should be the same to ensure this matches up.\n\n#### Better Guards on Global Scripts\n\nSolid uses an inline HydrationScript as a way to do processing before the framework and code have loaded. To handle things like event capture and streaming. However, we didn't do a good job of guarding the right thing when multiple were added to the same page, a situation that can happen in Micro-frontends or 3rd party Islands solutions. Now the script guards against duplicate inclusion.\n\n## 1.7.0 - 2023-03-30\n\nSolid has experienced incredible growth in usage the last 6 months. Companies are using it to power production applications and SolidStart Beta has been a big part of that. As a natural part of this growth and increased use at scale we are continuing to learn what works well and what the rough edges in Solid are today.\n\nThis v1.7 release marks the beginning of the migration roadmap to v2.0. We are beginning to re-evaluate core APIs and will begin introducing new ones while reasonably deprecating older ones in a manner that eases breaking changes. Our intention is to ease the broader ecosystem into preparing for improvements that a major 2.0 will unlock for the whole community.\n\n### Improved TypeScript\n\n#### Null-Asserted Control Flow\n\nOne of the pains of using Solid with TypeScript has been that JSX control flows can't really type narrow. This is true, but starting with the migration to explicit `keyed` in v1.5 we now complete this story by introducing callback forms for `` and `` that work when non-keyed.\n\nThe main difference is the callback form instead of passing in the value as it does when `keyed`, passes in a function that is type narrowed.\n\n```js\n// keyed w/ callback - reruns full callback on change\n\n {nonNullUser =>
{nonNullUser.name}
}\n\n\n// non-keyed w/o callback... - only updates the one expression, needs ! assertion\n\n
{user()!.name}
\n\n\n// NEW!\n// non-keyed w/ callback - only updates the one expression\n\n {nonNullUser =>
{nonNullUser().name}
}\n\n```\n\nKeep in mind because we are non-null asserting the input signal so it won't expect null in closures that execute when the condition is no longer satisfied. For this reason the accessor from the callback is special and will throw when attempted to be accessed when the condition is no longer true. This may be unexpected but it is our best attempt to keep TypeScript strict and not present inconsistency in reactivity. Luckily this only applies to things like timers which you should be cleaning up anyway and not things like event handlers. We recommend using the original conditions source in those closures if you must.\n\n#### Better Event Types for Input Elements\n\nThis has irked people for a while but we come by it honestly, `target` is gives you a type of `Element` rather than the specific element that is the target. That means no access to `.value` or `.checked`. The reason is there is no way to know at compile time what the target of an event will be. The `currentTarget` will be the element you attach the event to but the target can be anything.\n\nThere is a way to work around this though, in that if we know the `currentTarget` is of type that generates the event and that the `currentTarget` is the the type of this element we can assume it is the `target` as well. Not perfect logic but it is what React does and we do too.\n\nNow `onInput`, `onChange`, `onBlur`, `onFocus`, `onFocusIn`, and `onFocusOut` all support more detailed `target` when applied to `HTMLInputElement`, `HTMLTextAreaElement`, and `HTMLSelectElement`.\n\n#### Stricter JSX Elements\n\nStrict JSX elements have been tricky because we have to acknowledge at a certain point that TypeScript is to serve our purposes rather than to represent all possible values that could work. For us the ambiguity lies in functions.\n\nSolid's JSX needs to accept functions to handle dynamic insertion. However, in authoring it leads to awkward situations.\n\nThe first you hit the first time use Solid. You create that counter and don't call `count` as a function and it works.\n\n```js\nfunction Counter() {\n const [count, setCount] = createSignal(1);\n\n return ;\n}\n```\n\nThis example works in some places and not others which might lead to the wrong conclusions.\n\nThe second place you might hit this is when you get a little further on your journey and decide you need a component to re-render and decide that you can just wrap the whole thing in a function:\n\n```js\nfunction MyComp(props) {\n return () => {\n // look working early returns\n if (props.count > 5) {\n return
Maximum Tries
;\n }\n\n return
Attempt {props.count}
;\n };\n}\n```\n\nAgain this seems fine, except the fact that every time `count` changes you are recreating all the DOM Elements even when it resolves to the same conditional.\n\nEventually you might even not think twice about passing functions into children of arbitrary components:\n\n```js\n\n \n {() =>
{resource()}
}\n \n\n```\n\nBut what does this do? When is the function called?\n\nAs it turns out removing functions from `JSX.Element` type makes all of these scenarios error. Components only expect the values dictated by their types.\n\n```js\nfunction MyLayout(props: { children: JSX.Element }): JSX.Element;\n\nfunction MyFor(props: { each: T[], children: (item: T) => U }): JSX.Element;\n\n// valid\nHello\n

Hello

\n{name()}\n{name() &&

Hello

}\n{(() => {\n return \n})()}\n{untrack(() => {\n return

{name()}

\n})}\n{(user) =>
{user.name}
}\n\n// invalid\n{name}\n{() =>

Hello

}\n{() => \"Hello\"}\n{() => name() &&

Hello

}\n{(user) =>
{user.name}
}\n
Not a Function
\n```\n\nThe tradeoff here is that authoring components you can no longer just return a Signal or Memo without casting. If using JSX you can always return a Fragment.\n\nIf not you will need to cast to `unknown as JSX.Element`.\n\n### Better Errors and Cleanup\n\n#### `catchError` replaces `onError`\n\nError Handling is complicated enough without having to try to guess how they propagate. `onError` admittedly is a lower level primitive but fundamentally had this flaw. It worked by registering an error handler on the parent scope, but left it ambiguous how to handle siblings. Is it a queue? Are they independent?\n\nAs a result we are introducing `catchError` in this release which introduces its own scope to catch any errors below it. The first argument in the primitive is similar to the try and the second argument is the catch.\n\n```js\ncatchError(\n () => {\n // do stuff\n throw new Error(\"I've Errored\");\n },\n err => console.log(err)\n);\n```\n\n`onError` will still be present until it can be removed in a future major version.\n\n#### Standardized Errors\n\nError Handling has had many weird edge cases introduced by applications throwing unusual values. In v1.7 we wrap all thrown values that aren't of type `Error` in a `new Error` and attach the original thrown value as `.cause`.\n\n### More Performant Dev Tools\n\nNow that [Solid Dev Tools](https://github.com/thetarnav/solid-devtools) have been stabilizing, we have a much better idea what support we need for them. In so we were able to remove the very costly serialization we were doing for generating unique identifiers. Conventions around naming and exports were streamlined and standardized as well.\n\n### Others\n\n- Smaller compiled output, remove auxilary closing tags\n- Support for `prop:` and `attr:` in Spreads\n- Don't apply special props (like `readonly`) to custom elements\n- Introduced improved serializer, [seroval](https://github.com/lxsmnsyc/seroval)\n- Fixed quirks in Solid's treeshaking in Rollup\n- Minify inline class and style attributes\n- Update `solid-ssr` to type `\"module\"`\n\n## 1.6.0 - 2022-10-20\n\nSolid v1.6 doesn't bring a ton of new features but brings some big improvements in existing ones.\n\n### Highlights\n\n#### Official Partial Hydration Support\n\nSolid has worked for quite some time in partial hydrated (\"Islands\") frameworks like Astro, Iles, Solitude, etc.. but now we have added core features to support this effort better. These features are mostly designed for metaframework authors rather than the end user they are exposed through a couple APIs.\n\n`` joins `` as being a way to resume hydration and hydration ids during server rendering. Now we can stop and start hydratable sections. This is important because it opens up a new optimization.\n\n`createResource` calls under non-hydrating sections do not serialize. That means that resources that are server only stay on the server. The intention is that hydrating Islands can then serialize their `props` coming in. Essentially only shipping the JSON for data actually used on the client.\n\nThe power here is static markup can interview dynamic components.\n\n```js\n

Server Rendered Header

\n\n

Server Rendered Sub Header

\n

{serverOnlyResource().text}

\n \n

More server-renderd content

\n \n\n```\n\nKeep in mind Server rendered content like this can only be rendered on the server so to maintain a client navigation with this paradigm requires a special router that handles HTML partials.\n\nSimilarly we want the trees to talk to each other so `hydrate` calls now have been expanded to accept a parent `Owner` this will allow Islands to communicate through Contex without shipping the whole tree to browser.\n\n```js\n

Server Rendered Header

\n\n

Server Rendered Sub Header

\n \n\n```\n\nThese improvements make it easier to create Partial Hydration solutions on top of Solid, and serve to improve the capabilities of the ones we already have.\n\n#### Native Spread Improvements\n\nNative spreads are something we started at very naively. Simply just iterating an object that has some reactive properties and updating the DOM element. However, this didn't take into consideration two problems.\n\nFirst properties on objects can change, they can be added or removed, and more so the object itself can be swapped. Since Solid doesn't re-render it needs to keep a fixed reference to the merged properties. Secondly, these are merged. Properties override others. What this means is we need to consider the element holistically to know that the right things are applied.\n\nFor Components this was a never a problem since they are just function calls. Unfortunately for native elements this means all those compiler optimizations we do for specific bindings now need to get pulled into this. Which is why we avoided it in the past. But the behavior was too unpredictable.\n\nIn 1.6 we have smartened spread to merge properly using similar approach to how process Components. We've also found new ways to optimize the experience. (See below).\n\n### Other Improvements\n\n#### Deproxification\n\nWorking on new Spread behavior we realized that while we can't tell from compilation which spreads can change. We can tell at runtime which are proxies. And in so if we only need to merge things which don't swap, and aren't proxies we can avoid making a Proxy.\n\nWhat is great about this is it has a cascading effect. If component props aren't a proxy, then `splitProps` and `mergeProps` don't need to create them, and so on. While this requires a little extra code it is a real win.\n\nWe get a lot request for low end IoT devices because of Solid's incredible performance. In tests Solid outperforms many of the Virtual DOM solutions in this space. However most of them don't support proxies.\n\nSo now if you don't use a `Store` or swap out the props object:\n\n```js\n// this is fine\n
\n\n// these could swap out the object so they make proxies\n
\n// or\n
\n```\n\nWe don't need to introduce any proxy the user didn't create. This makes Solid a viable option for these low-end devices.\n\n## 1.5.0 - 2022-08-26\n\n### Key Highlights\n\n#### New Batching Behavior\n\nSolid 1.4 patched a long time hole in Solid's behavior. Until that point Stores did not obey batching. However, it shone a light on something that should maybe have been obvious before. Batching behavior which stays in the past is basically broken for mutable data, No Solid only has `createMutable` and `produce` but with these sort of primitives the sole purpose is that you perform a sequence of actions, and batching not making this properly was basically broken. Adding an element to an array then removing another item shouldn't just skip the first operation.\n\n```js\nconst store = createMutable([\"a\", \"b\", \"c\"]);\n\nconst move = store.splice(1, 1);\nstore.splice(0, 0, ...move);\n\n// solid 1.4\n// [\"b\", \"a\", \"b\", \"c\"];\n\n// solid 1.5\n// [\"b\", \"a\", \"c\"];\n```\n\nAfter a bunch of careful thought and auditting we decided that Solid's `batch` function should behave the same as how reactivity propagates in the system once a signal is set. As in we just add observers to a queue to run, but if we read from a derived value that is stale it will evaluate eagerly. In so signals will update immediately in a batch now and any derived value will be on read. The only purpose of it is to group writes that begin outside of the reactive system, like in event handlers.\n\n#### More Powerful Resources\n\nResources continue to get improvements. A common pattern in Islands frameworks like Astro is to fetch the data from the out side and pass it in. In this case you wouldn't want Solid to do the fetching on initial render or the serialization, but you still may want to pass it to a resource so it updates on any change. For that to work reactivity needs to run in the browser. The whole thing has been awkward to wire up but no longer.\n\n`ssrLoadFrom` field lets you specify where the value comes from during ssr. The default is `server` which fetches on the server and serializes it for client hydration. But `initial` will use the `initialValue` instead and not do any fetching or addtional serialization.\n\n```js\nconst [user] = createResource(fetchUser, {\n initialValue: globalThis.DATA.user,\n ssrLoadFrom: \"initial\"\n});\n```\n\nWe've improved TypeScript by adding a new `state` field which covers a more detailed view of the Resource state beyond `loading` and `error`. You can now check whether a Resource is `\"unresolved\"`, `\"pending\"`, `\"ready\"`, `\"refreshing\"`, or `\"error\"`.\n\n| state | value resolved | loading | has error |\n| ---------- | -------------- | ------- | --------- |\n| unresolved | No | No | No |\n| pending | No | Yes | No |\n| ready | Yes | No | No |\n| refreshing | Yes | Yes | No |\n| errored | No | No | Yes |\n\nA widely requested feature has been allowing them to be stores. While higher level APIs are still being determined we now have a way to plugin the internal storage by passing something with the signature of a signal to the new _Experimental_ `storage` option.\n\n```js\nfunction createDeepSignal(value: T): Signal {\n const [store, setStore] = createStore({\n value\n });\n return [\n () => store.value,\n (v: T) => {\n const unwrapped = unwrap(store.value);\n typeof v === \"function\" && (v = v(unwrapped));\n setStore(\"value\", reconcile(v));\n return store.value;\n }\n ] as Signal;\n}\n\nconst [resource] = createResource(fetcher, {\n storage: createDeepSignal\n});\n```\n\n#### Consolidated SSR\n\nThis release marks the end of years long effort to merge async and streaming mechanism. Since pre 1.0 these were seperate. Solid's original SSR efforts used reactivity on the server with different compilation. It was easiest to migrate synchronous and streaming rendering and for a time async had a different compilation. We got them on the same compilation 2 years ago but runtimes were different. Piece by piece things have progressed until finally async is now just streaming if flushed at the end.\n\nThis means some things have improved across the board. Async triggered Error Boundaries previously were only ever client rendered (throwing an error across the network), but now if they happen any time before sending to the browser they are server rendered. `onCleanup` now runs on the server if a branch changes. Keep in mind this is for rendering effects (like setting a status code) and not true side effects as not all rendering cleans up.\n\nFinally we've had a chance to do a bunch of SSR rendering performance improvements. Including replacing our data serializer with an early copy of Dylan Piercey from [Marko](https://markojs.com)'s upcoming serializer for Marko 6. Which boasts performance improvements of up to 6x `devalue` which we used previously.\n\n#### Keyed Control Flow\n\nSolid's `` and `` control flow originally re-rendered based on value change rather than truthy-ness changing. This allowed the children to be \"keyed\" to the value but lead to over rendering in common cases. Pre 1.0 it was decided to make these only re-render when statement changed from `true` to `false` or vice versa, except for the callback form that was still keyed.\n\nThis worked pretty well except it was not obvious that a callback was keyed. So in 1.5 we are making this behavior explicit. If you want keyed you should specify it via attribute:\n\n```js\n// re-render whenever user changes\n\n// normal\n\n
{user().name}
\n\n\n// callback\n\n {user =>
{user.name}
}\n\n```\n\nHowever, to not be breaking if a callback is present we will assume it's keyed. We still recommend you start adding these attributes (and TS will fail without them).\n\nIn the future we will introduce a non-keyed callback form as well so users can benefit from type narrowing in that case as well.\n\n### Other Improvements\n\n### `children.toArray`\n\nChildren helper now has the ability to be coerced to an array:\n\n```js\nconst resolved = children(() => props.children);\nresolved.toArray(); // definitely an array\n```\n\n#### Better SSR Spreads\n\nFinally fixed spread merging with non-spread properties during SSR, including the ability to merge children.\n\n#### Better Error Handling\n\nWe weren't handling falsey errors previously. Now when Solid receives an error that isn't an `Error` object or a string it will coerce it into an `Unknown Error`.\n\n## 1.4.0 - 2022-05-12\n\n### New Features\n\n#### Resource Deferred Streaming\n\nStreaming brings a lot of performance benefits but it also comes with the tradeoff we need to respond with the headers before we can send any content. This means we must set the Response headers early if we want to benefit from streaming. While it's always possible to fetch first and delay rendering that slows down everything. Even our async server rendering doesn't block rendering but instead just waits to respond to the end.\n\nBut what if you want to stream but also want to wait on some key data loading so you still have an opportunity to handle the response on the server before sending it to the browser?\n\nWe now have the ability to tell Solid's stream renderer to wait for a resource before flushing the stream. That you can opt in by setting `deferStream` option.\n\n```js\n// fetches a user and streams content as soon as possible\nconst [user] = createResource(() => params.id, fetchUser);\n\n// fetches a user but only streams content after this resource has loaded\nconst [user] = createResource(() => params.id, fetchUser, { deferStream: true });\n```\n\n#### Top Level Arrays in Stores\n\nSince Stores were first introduced it has always bugged me that the most common case, creating a list required nesting it under a property to track properly. Thanks to some exploration into proxy traps and iteration we now support top level arrays. In addition to its other modes, the Store setter will accept an array which allows for common operations.\n\n```js\nconst [todos, setTodos] = createStore([\n { id: 1, title: \"Thing I have to do\", done: false },\n { id: 2, title: \"Learn a New Framework\", done: false }\n]);\n\n// set at an index\nsetTodos(1, done, true);\n\n// use an array\nsetTodos([...todos, { id: 3, title: \"New Todo\", done: false }])\n\n// iterate over it with \n{todo => };\n```\n\nThrough this change we also stopped over execution when listening to specific properties. To support iteration Solid previously would notify the owning object of any array when an was index added/removed or object new property created or deleted on any object.\n\nThe one caveat is downstream optimized control flow that untrack index reads on arrays will now need to track the iterated object explicity. Solid exports a `$TRACK` symbol used to subscribe to the object and all its properties.\n\n#### Stale Resource Reads\n\nSuspense and Transitions are amazingly powerful feature but occasionally you want to opt out of the consistency and show things out of date because it will show up faster and some of things you are waiting for are not as high priority. In so you want the Transition to end sooner, but not necessarily stop showing the stale data for part of the screen. It is still preferable to receding back to loading spinner state.\n\nSolid's Resources now support being able to read the value without triggering Suspense. As long as it has loaded previously `latest` property won't cause fallback appear or Transitions to hold. This will always return the `latest` value regardless whether it is stale (ie.. a new value is being fetched) and will reactively update. This is super powerful in Transitions as you can use the Resources own `loading` state to know if it is stale. Since the Transition will hold while the critical data is loading, the loading state will not be applied to the in view screen until that Transition has ended. If the resource is still loading now you can show that it is stale.\n\n```js\nconst [resource] = createResource(source, fetcher);\n\n// read it as usual\nresource();\n\n// read the latest (don't suspend if loaded at least once)\nresource.latest;\n```\n\nExample: https://codesandbox.io/s/solid-stale-resource-y3fy4l\n\n#### Combining multiple Custom Renderers\n\nThe Babel plugin now allows configuring multiple custom renderers at the same time. The primary case it is so a developer can still lever Solid's optimized DOM compilation while using their custom renderer. To make this work specify the tags each renderer is reponsible for. It will try to resolve them in order.\n\n```js\nimport { HTMLElements, SVGElements } from \"solid-js/web\";\nlet solidConfig = {\n moduleName: \"solid-js/web\",\n // @ts-ignore\n generate: \"dynamic\",\n renderers: [\n {\n name: \"dom\",\n moduleName: \"solid-js/web\",\n elements: [...HTMLElements, ...SVGElements]\n },\n {\n name: \"universal\",\n moduleName: \"solid-three\",\n elements: []\n }\n ]\n};\n```\n\n### Improvements/Fixes\n\n#### Synchronous Top Level `createEffect`\n\nThese were originally deferred to a microtask to resemble how effects are queued under a listener. However it is more correct to run immediate like everything else top level.\n\n#### Better Types around Components\n\nThis one took the effort of many resident TypeScript experts, but we've now landed on some better types for components. The biggest change is `Component` no longer has an opinion on whether it should have `children` or not. We've added supplementary types `ParentComponent` and `FlowComponent` to denote Components that may have `children` or always have `children`. And we've added `VoidComponent` for those which may never have children.\n\n#### Sources in `createResource` are now Memos\n\nA small change but it was unusual to have refetching trigger a reactive expression outside of a reactive context. Now on refetch it grabs the last source value rather than re-running it.\n\n#### `createMutable` batches array methods like push, pop, etc..\n\nNow these built-ins are batched and more performant. We've also add `modifyMutable` that applies modifiers batched to stores created with `createMutable`.\n\n```js\nmodifyMutable(state.data.user, reconcile({ firstName: \"Jake\", middleName: \"R\" }));\n```\n\n#### Stores and mutables now respect batch\n\nWriting to a store or mutable within `batch` (including effects) no longer immediately updates the value, so reading within the same batch gives the old value. This guarantees consistency with memos and other computations, just like signals.\n\n#### Better Support for React JSX transform\n\nWe have added support to `solid-js/h` to support the new React JSX transform. You can use it directly in TypeScript by using:\n\n```json\n{\n \"jsx\": \"react-jsx\",\n \"jsxImportSource\": \"solid-js/h\"\n}\n```\n\nKeep in mind this has all the consequences of not using the custom transform. It means larger library code, slower performance, and worse ergonomics. Remember to wrap your reactive expressions in functions.\n\n#### HyperScript now returns functions\n\nThis one is a potentially breaking change, but the current behavior was broken. It was possible(and common) for children to be created before the parents the way JSX worked. This was an oversight on my original design that needs to be fixed, as it breaks context, and disposal logic. So now when you get your results back from `h` you need to call it. Solid's `render` function will handle this automatically.\n\n```js\nconst getDiv = h(\"div\", \"Hello\");\n\ndocument.body.appendChild(getDiv()); // call as a function to have it create the element.\n```\n\n### Removals and Deprecations\n\n#### `className`, `htmlFor` deprecated\n\nWhile they still work for now, Solid will remove support for these React-isms in a future version. They leave us with multiple ways to set the same attribute. This is problematic for trying to merge them. Solid updates independently so it is too easy for these things to trample on each other. Also when optimizing for compilation since with things like Spreads you can't know if the property is present, Solid has to err on the side of caution. This means more code and less performance.\n\n#### Experimental `refetchResources` removed\n\nThis primitive ended up being too general to be useful. There are enough cases we can't rely on the refetch everything by default mentality. For that reason we are dropping support of this experimental feature.\n\n## 1.3.0 - 2022-01-05\n\n### New Features\n\n#### HTML Streaming\n\nThis release adds support for HTML streaming. Now we not only stream data after the initial shell but the HTML as it finishes. The big benefit is that now for cached results, or times when the network are slow we no longer have to show the placeholder while waiting for JavaScript bundle to load. As soon as the HTML is available it will be streamed and inserted.\n\nWith it comes new streaming API `renderToStream`. This is a universal API designed to handle both Node and Web writable streams. It returns an object that mirrors a Readable stream on both platforms that has both `pipe` (node) and `pipeTo` (web). The benefit of this `pipe` API is the user can choose when to insert the content in the output stream whether soon as possible, or `onCompleteShell`, or `onCompleteAll`. This decouples Solid's rendering a from the stream a bit but leaves things open to performance improvements in the future.\n\n```js\n// node\nconst stream = renderToStream(() => ).pipe(res);\n\n// web\nconst stream = renderToStream(() => ).pipeTo(writable);\n```\n\n#### Error Boundaries on the Server\n\nWe've added support for Error Boundaries on the Server for all rendering methods(`renderToString`, `renderToStringAsync`, `renderToStream`). Errors can be caught both from synchronous rendering and from errors that happen in Resource resolution. However, Our approach doesn't guarentee all errors are handled on the server as with streaming it is possible that the Error Boundary has already made it to the browser while a nested Suspense component hasn't settled. If an Error is hit it will propagate up to the top most Suspense Boundary that hasn't been flushed yet. If it is not handled by an Error Boundary before that it will abort rendering, and send the Error to the browser to propagate up to the nearest Error Boundary.\n\nThis works now but there is more to explore here in improving Error handling in general with SSR. So look forward to feedback on the feature.\n\n#### Isolated Server Render/Hydration Contexts\n\nSometimes you want to server render and hydrate multiple Solid apps on the same page. Maybe you are using the Islands architecture with something like [Astro](https://astro.build). We now have the ability to pass a unique `renderId` on all our server rendering methods and to the `hydrate` function. This will isolate all hydration and resource resolution. This means we can use things like server side Suspense in these solutions.\n\nAlso now you only need to include the Hydration Script once on the page. Each Island will be responsible for initializing it's own resources.\n\n```js\n// on the server\nconst html = renderToString(() => , { renderId: \"island1\" });\n\n// for the browser\nhydrate(() => , mountEl, { renderId: \"island1\" });\n```\n\n#### `createReaction`\n\nThis new primitive is mostly for more advanced use cases and is very helpful for interopt with purely pull based systems (like integrating with React's render cycle). It registers an untracked side effect and returns a tracking function. The tracking function is used to track code block, and the side effect is not fired until the first time any of the dependencies in the tracking code is updated. `track` must be called to track again.\n\n```js\nconst [s, set] = createSignal(\"start\");\n\nconst track = createReaction(() => console.log(\"something\"));\n\n// next time s changes run the reaction\ntrack(() => s());\n\nset(\"end\"); // \"something\"\n\nset(\"final\"); // no-op as reaction only runs on first update, need to call track again.\n```\n\nThis primitive is niche for certain use cases but where it is useful it is indispensible (like the next feature which uses a similar API).\n\n#### External Sources (experimental)\n\nEver wanted to use a third party reactive library directly in Solid, like MobX, Vue Reactivity, or Kairo. We are experimenting with adding native support so reactive atoms from these libraries can be used directly in Solid's primitives and JSX without a wrapper. This feature is still experimental since supporting Transitions and Concurrent Rendering will take some more effort. But we have added `enableExternalSource` enable this feature. Thanks @3Shain for designing this solution.\n\n```js\nimport { Reaction, makeAutoObservable } from \"mobx\";\nimport { enableExternalSource } from \"solid-js\";\nimport { render } from \"solid-js/web\";\n\nlet id = 0;\nenableExternalSource((fn, trigger) => {\n const reaction = new Reaction(`externalSource@${++id}`, trigger);\n return {\n track: x => {\n let next;\n reaction.track(() => (next = fn(x)));\n return next;\n },\n dispose: () => {\n reaction.dispose();\n }\n };\n});\n\nclass Timer {\n secondsPassed = 0;\n\n constructor() {\n makeAutoObservable(this);\n }\n\n increase() {\n this.secondsPassed += 1;\n }\n\n reset() {\n this.secondsPassed = 0;\n }\n}\n\n// component driven directly off MobX\nfunction App() {\n const timer = new Timer();\n setInterval(() => {\n timer.increase();\n }, 1000);\n\n return ;\n}\n\nrender(() => , document.getElementById(\"app\"));\n```\n\n#### `refetchResources` (experimental)\n\nIn efforts to allow for scaling from simple resources up to cached solutions we are adding some experimental features to `createResource` to work with library writers to develop the best patterns. Caching is always a tricky problem and with SSR and streaming being part of the equation the core framework needs at minimum to provide some hooks into orchestrating them.\n\nSometimes it's valuable to trigger `refetch` across many resources. Now you can.\n\n```js\nimport { createResource, refetchResources } from \"solid-js\";\n\nconst userCache = {};\n\nfunction MyComponent(props) {\n const [data] = createResource(\n () => props.id,\n (userId, { refetching }) => {\n const cached = userCache[userId];\n\n // return cached value if available and not refetching\n if (cached && !refetching) return cached;\n return fetchUser(userId);\n }\n );\n}\n\n// somewhere else\nrefetchResources();\n```\n\nYou can also pass a parameter to `refetchResources` to provide additional information to the `refetching` info of the fetcher. This could be used for conditional cache invalidation. Like only refetch resources related to `users`. This mechanism requires a bit of wiring but the idea is you'd wrap `createResource` in maybe a `createQuery` and implement your own conventions around resource cache management. Still working out how this should work best, but the goal is to provide the mechanisms to support resource caches without being responsible for their implementation.\n\nTo opt-out being part of the global refetch createResource now takes a `globalRefetch` option that can be set to false. In addition to a new option to disable `refetchResources` there is no an `onHydrated` callback that takes the same arguments as the fetcher. When a resource is restored from the server the fetcher is not called. However, this callback will be. This is useful for populating caches.\n\n### Improvements\n\n#### Better TypeScript Support\n\nThanks to the tireless efforts of several contributors we now have significantly better types in Solid. This was a huge effort and involved pulling in maintainers of TypeScript to help us work through it. Thank you @trusktr for spearheading the effort.\n\n#### Better SourceMaps\n\nWork has been done to improve sourcemaps by updating `babel-plugin-dom-expressions` to better preserve identifiers from the JSX. Thanks to @LXSMNSYC for exploring and implementing this.\n\n### Breaking Changes/Deprecations\n\n#### `startTransition` no longer takes callback as a second argument\n\nInstead it returns a promise you can await. This works better for chaining sequences of actions.\n\n```js\nconst [start, isPending] = useTransition();\n\nstart(() => doSomething()).then(() => allDone());\n```\n\n#### Resource fetcher info object replaces `getPrev`\n\nTo streamline API for refetch we are slightly updating the `createResource`:\n\n```js\nconst [data] = createResource(sourceSignal, (source, { value, refetching }) => {});\n```\n\nFor those using existing 2nd argument:\n\n```js\nconst [data] = createResource(sourceSignal, (source, getPrev) => {\n const value = getPrev();\n});\n\n// becomes\nconst [data] = createResource(sourceSignal, (source, { value }) => {});\n```\n\n#### Deprecating Legacy Streaming APIs\n\n`pipeToNodeWritable` and `pipeToWritable` are deprecated. They will still work for now with basic usage but some of the more advanced options didn't map over to the new APIs directly and have been removed. Move to using `renderToStream`.\n\n### Bug Fixes\n\n- Fixed browser extensions modifying the head breaking hydration.\n- Fixed reinserting `` on hydration from document.\n- Fixed over-executing on multi-select with `createSelector`.\n- Fixed event delegation conflicting with document event listeners.\n- Fixed self owning source infinite recursion.\n- Fixed faulty treesplitting for hydration in client only render.\n- Fixed return type of `preload` on lazy components to always be a promise.\n- Fixed compile error with leading white space after opening tags when generating ssr.\n\n## 1.2.0 - 2021-10-25\n\n### New Features\n\n#### Custom Renderers\n\nThis release adds support custom renderers through a new \"universal\" transform. Solid now provides a sub module `solid-js/universal` that exports a `createRenderer` method that allows you to create your own runtimes. This will enable things like native mobile and desktop, canvas and webgl, or even rendering to the terminal. This is still new so very much looking for feedback.\n\n#### Spreads Added to Solid's `html`\n\nIt's been a long time coming but Solid's Tagged Template Literals now support element and component spreads using htm inspired syntax.\n\n```js\nhtml`
`;\n```\n\n### Fixes\n\n#### Dynamic Spreads now work on Components\n\nPreviously spreads on components would only track property changes on bound objects and not when the whole object changed. This now works:\n\n```js\n\n```\n\n#### ClassList properly merges multiple classnames in the key\n\nIt is common in libraries like Tailwind to apply multiple classes at the same time. There was an issue where true and false resolutions were cancelling each other out. This would only set `text-sm`.\n\n```js\n\n```\n\n#### Consistent handling of HTMLEntities\n\nThings like ` ` used to render differently depending if in elements or components(or fragments). This has been made consistent across all three.\n\n#### Various improvements to Types and Transitions\n\nA lot of bugs from the last minor release were around Transitions that have been addressed. And as always Types have been gradually improving.\n\n## 1.1.0 - 2021-08-09\n\nExpanding Solid's concurrency to include scheduling. Bug fixes around Types and around reactive execution order guarantees.\n\n### New Features\n\n#### `createUniqueId`\n\nA universal id generator that works across server/browser.\n\n```js\nconst id = createUniqueId();\n```\n\n> **Note** on the server this only works under hydratable components\n\n#### `from`\n\nA simple helper to make it easier to interopt with external producers like RxJS observables or with Svelte Stores. This basically turns any subscribable (object with a `subscribe` method) into a Signal and manages subscription and disposal.\n\n```js\nconst signal = from(obsv$);\n```\n\nIt can also take a custom producer function where the function is passed a setter function returns a unsubscribe function:\n\n```js\nconst clock = from(set => {\n const t = setInterval(() => set(1), 1000);\n return () => clearInterval(t);\n});\n```\n\n> Note: Signals created by `from` have equality checks turned off to interface better with external streams and sources.\n\n#### `enableScheduling` (experimental)\n\nBy default Solid's concurrent rendering/Transitions doesn't schedule work differently and just runs synchronously. Its purpose is to smooth out IO situations like Navigation. However now you can opt into interruptible scheduling similar to React's behavior by calling this once at your programs entry. I've yet to see a realworld scenario where this makes a big difference but now we can do cool demos too and start testing it.\n\n#### `startTransition`\n\nWorks like its counterpart in `useTransition`, this useful when you don't need pending state.\n\n```js\nimport { createSignal, startTransition } from \"solid-js\";\n\nfunction App() {\n const [signal, setSignal] = createSignal(\"Howdy\");\n function clickHandler(e) {\n startTransition(() => setSignal(\"Holla\"));\n }\n\n /* ...stuff */\n}\n```\n\n## 1.0.0 - 2021-06-27\n\n### Breaking Changes\n\n### setSignal now supports function form\n\nWhile that in itself is a great new feature as you can do:\n\n```js\nconst [count, setCount] = createSignal(0);\n\nsetCount(c => c + 1);\n```\n\nThis promotes immutable patterns, let's you access the previous value without it being tracked, and makes Signals consistent with State.\n\nIt means that when functions are stored in signals you need to use this form to remove ambiguity\n\n```js\nconst [count, setCount] = createSignal(ComponentA);\n\n// Do this:\nsetCount(() => ComponentB);\n\n// Don't do this as it will call the function immediately:\nsetCount(ComponentB);\n```\n\n#### `createState` moved and renamed\n\n`createState` has been renamed to `createStore` and moved to `solid-js/store`. Also moved to `solid-js/store`: `createMutable`, `produce`, `reconcile`\n\n#### SSR Entry points\n\n`renderToString` and `renderToStringAsync` now only return their stringified markup. To insert scripts you need to call `generateHydrationScript` or use the new `` component.\n\n`renderToNodeStream` and `renderToWebStream` have been replaced with `pipeToNodeWritable` and `pipeToWritable`, respectively.\n\n#### Options Objects\n\nMost non-essential arguments on reactive primitives are now living on an options object. This was done to homogenize the API and make it easier to make future additions while remaining backwards compatible.\n\n#### on\n\nNo longer uses rest parameters for multiple dependencies. Instead pass an array. This facilitates new option to defer execution until dependencies change.\n\n#### Actions renamed to Directives\n\nTo remove future confusion with other uses of actions the `JSX.Actions` interace is now the `JSX.Directives` interface.\n\n## 0.26.0 - 2021-04-09\n\nThis release is about finalizing some API changes on the road to 1.0. This one has one breaking change and not much else.\n\n#### Signals no longer always notify by default\n\nSolid's original behavior has been to always notify on signal change even if the value hasn't changed. The idea was to simulate stream behavior. However, this has some downsides:\n\n1. Inconsistent with State.. I made the decision to make state equality check by default, it is weird signals and memo's do not.\n2. More likely to hit infinite loops. Equality check naturally stops infinite loops in some cases. While infinite loops aren't good and code that produces them suspect, it is nice to keep things clean.\n3. It is consistent with other modern reactive libraries like MobX and Vue.\n\nThe API has not changed. You can opt out of the default behavior by passing in your own comparator or false to the 2nd parameter of `createSignal` and the 3rd parameter of `createMemo`.\n\nMy hope this is the last release before I start making 1.0 RC's. This one has big enough impact I want to get this out first. I imagine the remaining changes will be just syntax.\n\n## 0.25.0 - 2021-03-28\n\nThis release is about refining the APIs as we approach the our release candidate for 1.0.\n\n### Breaking Changes\n\n#### Resource API\n\nMinor difference to allow the first argument to be optional and support more features in the future. New full signature is:\n\n```ts\nexport function createResource(\n fn: U | false | (() => U | false),\n fetcher: (k: U, getPrev: () => T | undefined) => T | Promise,\n options?: { initialValue?: T }\n): ResourceReturn;\n```\n\n3rd argument is now an options object instead of just the initial value. This breaking. But this also allows the first argument to be optional for the non-tracking case. Need a promise that only loads once? Don't have need to re-use the fetcher. Do this:\n\n```js\nconst [data] = createResource(async () => (await fetch(`https://someapi.com/info`)).json());\n```\n\n#### on/onCapture\n\nThese are an escape hatch for unusual events. Previously these were custom attributes but now they are namespaced like:\n\n```jsx\n
console.log(e.target)} />\n```\n\n#### change `main` field to be node\n\nNow that we are supporting SSR for legacy(non-ESM) systems I need to use the main field to indicate a node env. We will be using the \"browser\" field for the client build in Solid. This straight up breaks Jest which doesn't respect that. I've created `solid-jest` to handle this.\n\nhttps://github.com/solidjs/solid-jest\n\n### New Features\n\n#### Namespace Types\n\nTypes added for Namespace attributes. You probably won't need most of these because they are for more advanced usage. However to use them you need to extend the JSX Namespace:\n\n```ts\ndeclare module \"solid-js\" {\n namespace JSX {\n interface Directives {\n // use:____\n }\n interface ExplicitProperties {\n // prop:____\n }\n interface ExplicitAttributes {\n // attr:____\n }\n interface CustomEvents {\n // on:____\n }\n interface CustomCaptureEvents {\n // oncapture:____\n }\n }\n}\n```\n\n#### Lazy component preload\n\nLazy components now have a preload function so you can pre-emptively load them.\n\n```js\nconst LazyComp = lazy(() => import(\"./some-comp\"));\n\n// load ahead of time\nLazyComp.preload();\n```\n\n#### Error Boundary reset\n\nError boundaries now have the ability to reset themselves and try again. It is the second argument to the fallback.\n\n```js\n {\n if (count++ < 3) return reset();\n return \"Failure\";\n }}\n>\n \n\n```\n\n## 0.24.0 - 2021-02-03\n\nThis release is the start of the rework of the SSR solution. Consolidating them under a single method. Unfortunately this one comes with several breaking changes.\n\n### Breaking Changes\n\n#### Removed `solid-js/dom`\n\nIt's been a few versions deprecated. It's gone.\n\n#### Updated Resource API\n\nChanged to more resemble SWR and React Query. Needed to remove `createResourceState`so now need to use a getter over `createResource` to get same effect. See updated documentation.\n\n#### Change SSR render call signatures\n\nThey now return results objects that include the generated hydration script. No more need to generate it separately. Also comes autowrapped in the `script` tag now.\n\n#### `assignProps` to `mergeProps`\n\nWhile you use them the same way mostly it no longer has `Object.assign` semantics and always returns a new object. This is important as in many cases we need to upgrade to a Proxy.\n\n#### Renamed `getContextOwner` to `getOwner`\n\nRemoves confusion around context and consistent with new helper `runWithOwner`.\n\n#### Solid Element no longer uses State for props\n\nThis reduces the size of the library especially for those not using state. It also should slightly increase performance as no need for deep nesting of proxies. It also makes things behave more consistently avoided unintended deep wrapping.\n\n### Non-breaking Changes\n\n#### New non-reactive Async SSR\n\nI have now combined sync/streaming/async SSR into the same compiler output. To do so I have developed a new non-reactive Async SSR approach. After realizing how fast Solid renders, it occurred to me on the server we could do a much simpler approach if we were willing to re-render all content in Suspense boundaries. While that is some wasted work, compared to including the reactive system it's a killing.\n\n#### Increase SSR Performance\n\nThrough reusing static strings in the template we reduce repeated creation costs. This small improvement can make 5-8% improvements where you have many rows.\n\n#### Event Delegation\n\nSolid is now being more strict on what events it delegates. Limiting to standard pointer/touch/mouse/keyboard events. Custom events will no longer be delegated automatically. This increases compatibility for Web Component users who don't compose their events. Non-delegated events will still work and binding array syntax with them.\n\n#### State getters no longer memos\n\nAutomatic memos put some constraints on the disposal system that get in the way of making the approach flexible to hold all manner of reactive primitives. Some previous limitations included not being able to have nested getters. You can still manually create a memo and put it in a getter but the default will not be memoized.\n\n### New Features\n\n#### `children` helper\n\nResolves children and returns a memo. This makes it much easier to deal with children. Using same mechanism `` can now have dynamic children like `` inside.\n\n#### \"solid\" Export Conidition\n\nThis is the way to package the JSX components to be compiled to work on server or client. By putting the \"solid\" condition the source JSX will be prioritized over normal browser builds.\n\n### Bug Fixes\n\n- Top level primitive values not working with `reconcile`\n- Fix Dynamic Components to handle SVG\n- Rename potentially conflicting properties for event delegtion\n- Fixed State spreads to not loose reactiviy. Added support for dynamically created properties to track in spreads and helpers\n- TypeScript, always TypeScript\n\n## 0.23.0 - 2020-12-05\n\nThis release is mostly bug fixes. Breaking change for TS users. JSX types no longer pollutes global namespace. This means you need to update your projects to import it.\n\nFor users TS 4.1 or above add to your tsconfig to have JSX types in all your TSX files:\n\n```js\n\"compilerOptions\" {\n \"jsx\": \"preserve\",\n \"jsxImportSource\": \"solid-js\",\n}\n```\n\nOr mixing and matching? You can set JSX types per file using the pragma at the top of each file:\n\n```js\n/* @jsxImportSource solid-js */\n```\n\nYou can now import `JSX` types directly from Solid as neccessary:\n\n```js\nimport { JSX } from \"solid-js\";\n```\n\n## 0.22.0 - 2020-11-14\n\n### Unified Exports (Deprecation `solid-js/dom`)\n\nSolid now has streamlined exports for isomorphic development. This means from now on using `solid-js/web` instead of `solid-js/dom`. Based on compiler options it will swap out the appropriate packages for web. You should only ever import `solid-js`, `solid-js/h`, `solid-js/html`, and `solid-js/web` directly in your code.\n\n`solid-js/web` now exports an `isServer` field which indicates whether the code is executed for server rendering. This is constant in the respective packages meaning it can allow for powerful treeshaking/dead code elimination in final bundles even when used directly in end user code or 3rd party libraries.\n\n### Dev Mode\n\nAliasing `solid-js` to `solid-js/dev` in your bundler links in a Dev mode of Solid. It's still a WIP process but it introduces some new APIs. First signals and state (and resources) have the ability to set a name for debug purposes as an options argument.\n\nWe also export a `serializeGraph` method which will serialize all the signals below the executing context in the reactive graph.\n\nFinally there is a new `globalThis._$afterUpdate` hook that can be assigned that will be called after every render that can be used for tracking purposes.\n\nThis is just the start but it is my intention to develop these features to allow for better HMR and DevTools.\n\n> Note: If the libraries are not being pulled into your bundle and are treated as external you may need to alias `solid-js` to `solid-js/dev` in your bundler in order to use dev mode.\n\n### Self contained HyperScript/Lit Modules\n\nWe now ship the respective DOM expressions code. This makes it much easier to use directly from a CDN like Skypack. You literally can develop with Solid in the old school write it in notepad before npm was a thing sort of way.\n\n```html\n\n \n \n \n\n```\n\nSave this in a text file called \"site.html\" and double click it and instant Solid in your browser.\n\n### renderToWebStream\n\nNew `renderToWebStream` for synchronous SSR mode. This allows us to stream from things like Cloudflare Workers.\n\n### createMutable\n\nNew mutable state primitive. Useful for interopt with other libraries. We can use this potentially for things like Vue/MobX compat. Or when we need to interact with libraries that can't be aware of Solid's reactive system, yet we want to capture updates. It supports getters and setters.\n\nUse with caution as it can promote difficult to reason about code, anti-patterns, and unexpected performance cliffs. Keep in mind Vue and MobX care less about these inefficient patterns since they have a VDOM safety net. We do not. For advanced users only.\n\n```js\nconst user = createMutable({\n firstName: \"John\",\n lastName: \"Smith\",\n get fullName() {\n return `${this.firstName} ${this.lastName}`;\n },\n set fullName(value) {\n const parts = value.split(\" \");\n batch(() => {\n this.firstName = parts[0];\n this.lastName = parts[1];\n });\n }\n});\nconsole.log(user.fullName); // John Smith\nuser.fullName = \"Jake Murray\";\nconsole.log(user.firstName); // Jake\n```\n\n### State Getter/Setters are now Wrapped\n\nGetters are now wrapped in `createMemo` and setters in `batch`. However, this introduces a new limitation that they can only be top level to have this behavior.\n\n### State compatible with Prop Helpers\n\nYou can now use state with `assignProps` and `splitProps` helpers.\n\n### Removed DOM SSR\n\nNo longer supporting hydratable DOM SSR in patched(ie... JSDOM) node environments. Use the standard SSR methods instead. Can still run Solid in JSDOM for things like Jest, but can't be used for isomorphic development.\n\n## 0.21.0 - 2020-10-17\n\n### Attribute and Prop changes\n\nWe will now default to using Attributes where possible to be consistent. Solid is aiming to generally reflect the case insensitiveness of HTML. Custom Elements remain the one place that defaults to property setters on Dynamic elements.\n\nWhile TypeScript 4.2 is yet to be released, we are introduce `attr`, `prop`, `use` and `style` namespace directives. To allow more expressiveness in binding syntax.\n\n### Other Changes\n\n- New `on` and `onMount` helpers\n- More performant SSR escaping\n- Lazy eval SSR Component props (fix SSR Context API)\n- Add support for SSR with Solid Styled Components\n- Fix Lit Dom Expressions style in Template tags\n- Fix JSX Types\n\n## 0.20.0 - 2020-09-24\n\n### Re-scheduling Reactivity.\n\nThis release makes large changes to the Reactive System. Key changes are deferring `createEffect` to be after rendering and introducing `createComputed` do reactive graph updates like loading async data.\n\n### Concurrency\n\nIn addition the reactive model brings updates to Suspense and Transitions. Solid now has true concurrent rendering at a granular level. This mechanism does differ from React as it currently only supports a single future.\n\n### Removed APIs\n\n`afterEffects`, `createDependentEffect`, and `suspend` have been removed as they no longer make sense with the new reactive system timing.\n\n## 0.19.0 - 2020-08-23\n\nAPI Changes to support better SSR\n\n### Breaking Changes:\n\n#### Set State\n\nMutable form is no longer a default. It was strangely inconsistent as you could accidentally mutate in immutable forms. No indicator why it should behave differently and work. Increased the size of `state` for everyone and added performance overhead with additional proxy wrapping. Also it was based on returning undefined meaning function forms could never return undefined to blank a vlue. Solid has changed it into a state setter modifier `produce` after ImmerJS naming.\n\n```js\n// top level\nsetState(produce(s => (s.name = \"John\")));\n\n// nested\nsetState(\n \"user\",\n produce(s => (s.name = \"John\"))\n);\n```\n\n#### Prop APIs\n\nAfter writing `setDefaults`, `cloneProps`, and about to introduce `mergeProps` it became clear we can do this all with a single `assignProps` helper. So the former has been removed and now we have:\n\n```js\n// default props\nprops = assignProps({}, { name: \"Smith\" }, props);\n\n// clone props\nnewProps = assignProps({}, props);\n\n// merge props\nassignProps(props, otherProps);\n```\n\nIt follows the same pattern as ES `Object.assign` adding properties to the first argument and returning it. Except this method copies property descriptors without accessing them to preserve reactivity.\n\n#### `freeze` & `sample` have been renamed\n\nThese APIs never had the most obvious naming, borrowing from SRP and digital circuit concepts rather than common english. They are now `batch` and `untrack` respectively which better reflect their purpose. These are now deprecated and will be removed in next minor version.\n\n#### Resource API\n\nFor better automatic hydration support it is prudent to change resource signatures to take functions that return promises rather than promises themselves. This factory function has a lot advantages. This allows the library to decide whether to execute it or not. In certain cases we can choose skipping creating the promise altogether. It also leaves the door open for things like retry.\n\nWe use this mechanism to wire up streamed data from the server and automatic data hydration for resources rendered into the page in async SSR.\n\n#### SSR Improvements\n\nNew experimental support for Suspense aware synchronous, asynchronous, and streaming SSR with hydration, progressive hydration, and automatic isomorphic data serialization. Completely removed what was there before with a simple static generator and more examples, so all existing projects using `solid-ssr` package will break with this release. This is a much better foundation, and I hope to build better things on top.\n\n### New\n\n#### State Getters\n\nFor convenience of passing derived values or external reactive expressions through Solid's state initializer you can now add `getter`'s.\n\n```jsx\nconst [state, setState] = createState({\n firstName: \"Jon\",\n lastName: \"Snow\",\n get greeting() {\n return `You know nothing ${state.firstName} ${state.lastName}`;\n }\n});\n\nreturn
{state.greeting}
;\n```\n\n#### Control Flow\n\nDynamic allows swapping Component dynamically.\n\n```jsx\n// element tag name\nconst [comp, setComp] = createSignal(\"h1\");\n\n;\n\n// Component\nsetComp(MyComp);\n```\n\nErrorBoundary catches uncaught downstream errors and shows a fallback.\n\n```jsx\nSomething went terribly wrong
}>\n \n\n```\n\n#### Portals render in the Head\n\nYou can now render portals in the head with no additional div element.\n\n#### Multi-version detection\n\nCommon hard to track issue with Solid is when multiple versions of the library are running on the same page. It breaks reactivity, and is sometimes difficult to notice. Solid now detects if a version has already been loaded at runtime and complains.\n\n### Bug Fixes & Updates\n\nArguably a new feature but Solid now detects computation owners with pending dependency changes when trying to resolve nested computations. In so it will resolve those dependencies first. This fixes a long time issue with conditional processing with not directly related reactive atoms.\n\nImproved TypeScript Types.\n\n## 0.18.0 - 2020-05-01\n\nA lot of bug fixes, and introduction of string based SSR.\nBreaking Changes:\n\n- Removal of `forwardRef`. Value and function handled by just `ref`.\n- Change to how TypeScript is managed. Brought all JSX types inside the repo, and improved Component typing.\n- Changed default renderer in `solid-ssr` to string renderer.\n\n## 0.17.0 - 2020-03-24\n\nA lot of consolidation in preparation for release candidate\n\n- Big refactor of core reactive system and render list reconciler\n - Significantly smaller reducing core by atleast 3kb minified\n- Better handling of nested reactive nodes in Fragments\n- Update SSR mechanisms, added progressive event hydration, created repo for SSR environment (`solid-ssr`)\n- `@once` compiler hint to statically bind values\n- Better wrapping hueristics for booleans and ternaries in JSX\n\nBreaking Changes\n\n- Removed `transform` prop from control flow. Idiomatic approach is to make a HOC for transformations of this nature.\n- Removed selectWhen/selectEach control flow transforms.\n- Changed event system\n - `on____` prop to stop differentiating on case. Super confusing.Instead will try to delegate unless unable. Made TypeScript all CamelCase (although technically both forms behave identically)\n - Removed `model` event delegation approach. Instead to create bound event use array: `onClick={[handler, row.id]}`. Inspired by Inferno's `linkEvent` helper.\n - Renamed `events` prop to `on` prop\n - Added `onCapture` prop for capture events\n\n## 0.16.0 - 2020-01-14\n\nBig changes to experimental features:\n\n- New resource API `createResource` and `createResourceState` to replace `loadResource`. These are built to prioritize read capabilities and simplify implementation.\n- Support for Async SSR `renderToString` now returns a promise. Uses Suspense to know when it is done.\n- Progressive Hydration with code splitting support. Ability to track events and replay as hydration completes to reduce \"uncanny valley\". Components can be lazily loaded even during hydration. **No support for async data on hydration yet**, so render it from server and load into state synchronously.\n- New error boundary api with `onError`. If an error occurs in context or child context the nearest handler/s will be called.\n- Deprecating the `force` `setState` modifier as it is confusing.\n\n## 0.15.0 - 2019-12-16\n\nA lot fixes and new features:\n\n- Suspense improvements: `SuspenseList`, `useTransition`, trigger on read. Update API, and added `reload` and retry capability. Removed need for `awaitSuspense` by making `Show` and `Switch` control flows `Suspense` aware.\n- Deprecate `selectWhen` and `selectEach`.\n- Untrack all Components. No more fear of nesting Components in JSX expressions. Top level in a Component will always be inert now.\n- Support for safe boolean and logical operators. This allows for the same optimization as the `Show` control flow for simple inline JSX conditionals like `
{state.count > 5 && }
`.\n- Support for non-curried operator forms. All operators now support an accessor first form as well as the functional curried form. Ex `map(() => state.list, item => item)`\n- Fix issues with spreading over `children` props.\n- Better Type Definitions.\n\n## 0.14.0 - 2019-11-16\n\nv0.14.0 brings changes to the render runtime and `setState` API\n\n- Adds diffing to batched computations to improve update performance\n- Supports support for mutable(TypeScript safe) `setState` API inspired by Immer. Function setters in Solid now pass a mutable version of state. Modifying will schedule updates. This form must not return a value. It can still be used immutably simply by returning the new value.\n- Changes how `force` and `reconcile` helpers work. They can now be used on nested paths.\n- Removes support for multi-path `setState`.\n\n## 0.13.0 - 2019-10-27\n\nv0.13.0 contains large changes to the reactive system and compiler.\n\nThe main update is to simplify reactivity by removing computation recycling. While this was a useful feature to avoid unnecessary computation nodes, Solid now uses batching as a different approach to get similar results. Most templating libraries can offer breakneck update speeds without fine grained updates. The real cost of these top down approaches is the need to redo structural reconciliation. The current approach is that different computations will be created for each:\n\n- Dynamic insert expression (any expression between tags)\n- Spread operator\n- JSX template entry point(Top level tag, Fragment, or Component Children)\n\nTo aid in performance simple text inserts the `textContent` binding is now optimized so they can be batched.\n\nIn addition there are some improvements to template cloning and SVG handing in SSR.\n\n## 0.12.0 - 2019-10-18\n\nv0.12.0 contains a breaking change to the reactive rendering system\n\n- Removal of explicit dynamic binding, bindings will default to reactive unless impossible to be so (literal, function declaration, simple variable)\n- SVG Camelcase attribute Support\n- Prettier now supported!\n\n## 0.11.0 - 2019-09-27\n\nv0.11.0 continues to add updates to the reactive system as well as some new features:\n\n- Fix reactivity resolution ordering on downstream conditionals\n- Add basic (non-namespaced) SVG support\n- Add experimental Server Side Rendering and Client Side Hydration capabilities\n- Add Suspense aware control flow transformation (`awaitSuspense`)\n- Allow state objects to track functions\n- More TypeScript definition improvments and fixes\n\n## 0.10.0 - 2019-08-11\n\nv0.10.0 makes significant changes to the reactive system. Key updates:\n\n- Fixed synchronicity on all hooks/control flows.\n- Adds the ability to use comparators on `createMemo`.\n- Fixes bugs with nested control flows.\n- Fixes bugs with Suspense.\n- Update Suspense `delayMs` to `maxDuration` to match React. (Usage of `maxDuration` still experimental)\n\n## 0.9.0 - 2019-07-20\n\nv0.9.0 makes signifigant changes to underlying reconciler.\n\n- New Control Flow\n- Removes Custom Directives\n- New Functional Operators\n\n## 0.8.0 - 2019-06-14\n\nv0.8.0 brings further improvements in reducing bundle size and optimizations in reactivity. New Features:\n\n- Universal loadResource API\n- afterEffects hook\n- Switch Control Flow\n\n## 0.7.0 - 2019-05-25\n\nv0.7.0 brings further improvements in tree shaking, Context API including Provide control flow, and suspense helpers for loading Async Components and Data.\n\nThis is a breaking change as in order to support this version, Solid has forked S.js the underlying library and now ships with it built in. This means Solid will no longer be compatible other S.js libraries. It is a turning point but enables the powerful new features.\n\n## 0.6.0 - 2019-05-07\n\nv0.6.0 brings a Tree Shakeable runtime. This means when Solid used with JSX the compiler can intelligently only include the code that is being used.\n\nThis is a breaking change in that:\n\n- No longer need to import 'r' and selectWhen and selectEach directives have been moved to solid-js from solid-js/dom. You should not need to import from 'solid-js/dom' directly anymore as your compiled code will do it automatically.\n- HyperScript and Lit imports have been made the default import now.. ex:\n\n```js\nimport html from \"solid-js/html\";\n```\n\n- Tidied up the compiled template code. This should make it much nicer to debug when not minified.\n\n## 0.5.0 - 2019-04-14\n\n- Add support for multiple renderers (JSX, Tagged Template Literals, HyperScript). Added direct imports or 'solid-js/dom' alternatives 'solid-js/html' and 'solid-js/h'.\n- Reorganized dependencies work.\n\n## 0.4.2 - 2019-03-18\n\n- Add fallbacks for control flow\n- Add new Portal Control Flow - This allows nodes to be rendered outside of the component tree with support for satelite ShadowRoots.\n- Add new Suspend Control Flow - This renders content to a isolated document and display fallback content in its place until ready. Good for nested Async Data Fetching.\n- Default node placeholders to comments (improved text interpolation)\n- Added events binding for irregular event names\n\n## 0.4.0 - 2019-02-16\n\n- Rename API to create\\_\\_ to be semantically correct\n- Added implicit event delegation\n\n## 0.3.8 - 2019-01-31\n\n- Add support for HyperScript\n\n## 0.3.7 - 2019-01-16\n\n- Improved data reconciler performance\n- Added data reconciler options\n\n## 0.3.4 - 2019-01-04\n\n- Added optional comparator for signals.\n- Removed redundant type checks and extra function calls.\n- Changed S.js to a dependency instead of a peer dependency.\n\n## 0.3.2 - 2018-12-30\n\n- Separated useSignal getter/setters for clearer more consistent API\n\n## 0.3.1 - 2018-12-29\n\n- Remove operators from core package since are auxilliary with new API.\n- Updated JSX Dom Expressions to use new control flow JSX and JSX Fragment support.\n\n## 0.3.0 - 2018-12-25\n\n- New setState API inspired by Falcor paths to handle ranges.\n- Reduction in API to remove State object functions and change to explicit methods.\n- Expose reconcile method to do deep differences against immutable data sources (previously automatically done for selectors).\n- Removed 'from' operators as limited usefulness with new patterns.\n\n## 0.2.0 - 2018-11-13\n\n- Large simplifications to remove inconsistency around wrapping and unwrapping values. State values are always wrapped get, and fully unwrapped on set.\n- Updated binding syntax. Dynamic expressions are now bound with an inner parenthesis `{( )}`js\n- Removed Immutable State object. May attempt something similar in the future but at this time it wasn't worth the effort trying to attempt both. There are better approaches to Proxy Immutable data structures.\n" }, { "path": "CODE_OF_CONDUCT.md", "content": "# Contributor Covenant Code of Conduct\n\n## Our Pledge\n\nWe as members, contributors, and leaders pledge to make participation in our community a harassment-free experience for everyone, regardless of age, body size, visible or invisible disability, ethnicity, sex characteristics, gender identity and expression, level of experience, education, socio-economic status, nationality, personal appearance, race, religion, or sexual identity and orientation.\n\nWe pledge to act and interact in ways that contribute to an open, welcoming, diverse, inclusive, and healthy community.\n\n## Our Standards\n\nExamples of behavior that contributes to a positive environment for our community include:\n\n- Demonstrating empathy and kindness toward other people\n- Being respectful of differing opinions, viewpoints, and experiences\n- Giving and gracefully accepting constructive feedback\n- Accepting responsibility and apologizing to those affected by our mistakes, and learning from the experience\n- Focusing on what is best not just for us as individuals, but for the overall community\n\nExamples of unacceptable behavior include:\n\n- The use of sexualized language or imagery, and sexual attention or\n advances of any kind\n- Trolling, insulting or derogatory comments, and personal or political attacks\n- Public or private harassment\n- Publishing others' private information, such as a physical or email\n address, without their explicit permission\n- Other conduct which could reasonably be considered inappropriate in a\n professional setting\n\n## Enforcement Responsibilities\n\nCommunity leaders are responsible for clarifying and enforcing our standards of acceptable behavior and will take appropriate and fair corrective action in response to any behavior that they deem inappropriate, threatening, offensive, or harmful.\n\nCommunity leaders have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, and will communicate reasons for moderation decisions when appropriate.\n\n## Scope\n\nThis Code of Conduct applies within all community spaces, and also applies when an individual is officially representing the community in public spaces. Examples of representing our community include using an official e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event.\n\n## Enforcement\n\nInstances of abusive, harassing, or otherwise unacceptable behavior may be reported to the community leaders responsible for enforcement at community@solidjs.com. All complaints will be reviewed and investigated promptly and fairly.\n\nAll community leaders are obligated to respect the privacy and security of the reporter of any incident.\n\n## Enforcement Guidelines\n\nCommunity leaders will follow these Community Impact Guidelines in determining the consequences for any action they deem in violation of this Code of Conduct:\n\n### 1. Correction\n\n**Community Impact**: Use of inappropriate language or other behavior deemed unprofessional or unwelcome in the community.\n\n**Consequence**: A private, written warning from community leaders, providing clarity around the nature of the violation and an explanation of why the behavior was inappropriate. A public apology may be requested.\n\n### 2. Warning\n\n**Community Impact**: A violation through a single incident or series of actions.\n\n**Consequence**: A warning with consequences for continued behavior. No interaction with the people involved, including unsolicited interaction with those enforcing the Code of Conduct, for a specified period of time. This includes avoiding interactions in community spaces as well as external channels like social media. Violating these terms may lead to a temporary or permanent ban.\n\n### 3. Temporary Ban\n\n**Community Impact**: A serious violation of community standards, including sustained inappropriate behavior.\n\n**Consequence**: A temporary ban from any sort of interaction or public communication with the community for a specified period of time. No public or private interaction with the people involved, including unsolicited interaction with those enforcing the Code of Conduct, is allowed during this period. Violating these terms may lead to a permanent ban.\n\n### 4. Permanent Ban\n\n**Community Impact**: Demonstrating a pattern of violation of community standards, including sustained inappropriate behavior, harassment of an individual, or aggression toward or disparagement of classes of individuals.\n\n**Consequence**: A permanent ban from any sort of public interaction within the project community.\n\n## Attribution\n\nThis Code of Conduct is adapted from the [Contributor Covenant][homepage], version 2.0,\navailable at https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.\n\nCommunity Impact Guidelines were inspired by [Mozilla's code of conduct enforcement ladder](https://github.com/mozilla/diversity).\n\nFor answers to common questions about this code of conduct, see the FAQ at\nhttps://www.contributor-covenant.org/faq. Translations are available at https://www.contributor-covenant.org/translations.\n\n[homepage]: http://contributor-covenant.org\n" }, { "path": "CONTRIBUTING.md", "content": "# Contributing to SolidJS\n\nThank you for investing your time in contributing to our project! ✨.\n\nRead our [Code of Conduct](https://github.com/solidjs/solid/blob/main/CODE_OF_CONDUCT.md) to keep our community approachable and respectable. Solid accepts a number of contributions from the broader community. More hands indeed make lighter work. We're however selective of the types of contributions we receive.\n\nThis usually involves vetting code quality, current focus, alignment with team philosophies etc. It's typically a good idea to submit a proposal for a change before spending time implementing it. This is to ensure that your efforts align with the current needs or more practically that work isn't completed by multiple contributors.\n\nNote: If you would like your project listed here please submit a PR or contact a core/ecosystem member on Discord.\n\n## Team Structure & Organization\n\nThere are a lot of opportunities to get involved. We organize Solid community efforts via Discord and typically onboard dedicated contributors into focused teams:\n\n- Docs (headed by [@LadyBluenotes](https://github.com/ladybluenotes))\n- Infrastructure (headed by [@davedbase](https://github.com/davedbase))\n- Advocacy (headed by [@hindsight](https://github.com/eslachance))\n- Growth (headed by [@davedbase](https://github.com/davedbase))\n- Translators (headed by [@davedbase](https://github.com/davedbase))\n\nMost team members are part of the Ecosystem Team or Core Team. Entry into these groups is selected by Core Members only. We do not accept applications or requests for entry. Selections are made ad-hoc according to internal needs. Selections are typically announced at Community Meetings which occur quarterly.\n\n## Meetings and Schedules\n\nSolidJS team members organize via Discord chat and audio channels. Channels exist to manage these conversations and threads within channels are used to focus on specific topics. A number of meetings occur weekly between each group however there is no set cadence or recurring schedule. Typically attendance for team members is requested to maintain membership, however we respect and recognize OSS contributions are typically ad hoc and as can be given by our members and generous donors.\n\n## Official Opportunities\n\nAs a growing community, Solid has an on-going need for developers, writers, designers and general thought leaders. The following is a list of openings and tasks that Core attempts to maintain often.\n\n### Docs Team\n\n To get involved, check out our [Contributing Guide](https://github.com/solidjs/solid-docs-next/blob/main/CONTRIBUTING.md) in the new docs repository!\n \n- General/Core Docs\n - Write new drafts for the new docs repo\n - Work on the infrastructure for the new docs site\n - Create videos, diagrams, and other multimedia content\n- Solid Start 1.0 API\n - Draft an initial, comprehensive set of docs for Solid Start\n - This currently takes place in [this subfolder](https://github.com/solidjs/solid-docs-next/tree/main/content/start) on `solid-docs-next`\n\n### Infrastructure Team\n\n- Solid Site\n - Help maintain the current Solid website by implementing bugs, testing and reporting issues\n - Port the current website from being an SPA to Solid Start\n - Website redevelopment project for 2.0\n- Solid Service API\n - Help implement our API service that powers solid REPL\n - Test, validate and implement security and bug fixes\n - Add new missing features\n- Develop new Solid Docs platform and website\n - Help coordinate creating MDX components\n - Developer infrastructure for delivering future community documentation platform\n- Solidex (our ecosystem directory)\n - How maintain a list of ecosystem projects and resources (articles, podcasts etc.)\n - Vet incoming PR from submissions and merge + deploy updated the directory\n - Improve workflow and systems for managing Solidex\n - Implement an API (via Solid Service API) to search and filter resources\n- Solid Dev Tools\n - We're actively looking for individuals to prototype and experiment on a set of developer tools.\n\n### Solid Start Team\n\nSolid Start is our new meta framework that focuses on enhancing Solid's DX story and general usability. Similar to SvelteKit, Next and other meta frameworks, this project is considered a primary core supported effort. Solid Start is approaching its beta release and we're looking for developers to test, validate and build on top of it. Join the #solid-start channel on Discord or the [solid-start](https://github.com/solidjs/solid-start) to learn more.\n\n## Ecosystem Opportunities\n\nSolidJS core members maintain a separate project called [SolidJS Community](https://github.com/solidjs-community). This is a large and lush ecosystem community project that encompasses a number of critical core tooling such as Solid Primitives, Solid Aria (similar to React Aria) etc.\n\nThe following are projects looking for leaders or support:\n\n- [**Solid Aria**](https://github.com/solidjs-community/solid-aria) (lead by [@fabien-ml](https://github.com/fabien-ml)): A port of React Aria.\n- [**Solid Examples**](https://github.com/solidjs-community/solid-examples) (lead by [@foolswisdom](https://github.com/mosheduminer)): A list of examples, patterns and app implementations.\n- [**Solid Codemod**](https://github.com/solidjs-community/solid-codemod) (lead by [@trivikr](https://github.com/trivikr)): Convert React or other libraries to Solid automatically.\n- [**Solid Snippets**](https://github.com/solidjs-community/solid-snippets) (lead by [@thetarnav](https://github.com/thetarnav)): VSCode snippet library.\n- [**Solid DSL**](https://github.com/solidjs-community/solid-dsl) (lead by [@davedbase](https://github.com/davedbase)): A project to explore enhancing JSX or other DSL options.\n- [**Solid Primitives**](https://github.com/solidjs-community/solid-primitives) (lead by [@davedbase](https://github.com/davedbase)): A large primitives (hooks) library.\n\nContributing to ecosystem projects is just as important as contributing to Solid core projects. As Solid grows a lush, well supported and high-quality set of packages and learning materials will benefit it's users and future viability.\n\n## Where do I start?\n\nIf you haven't found any interesting information on this page then we encourage you to start hacking at a Solid related utility or package that does. Building useful tools for fellow OSS ecosystem and Solid users enhances the whole platform.\n\nWe can't wait to see what you build!\n\n## Building Solid\n\nThis repository uses [pnpm](https://pnpm.io/) and\n[Turborepo](https://turborepo.org/).\nIf you want to build Solid from scratch, use the following steps:\n\n1. `corepack enable` (use the correct version of PNPM, https://nodejs.org/api/corepack.html#enabling-the-feature)\n2. `pnpm install` (install all dependencies)\n3. `pnpm build`\n\nYou can then run all tests via `pnpm test`.\n" }, { "path": "LICENSE", "content": "MIT License\n\nCopyright (c) 2016-2025 Ryan Carniato\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n" }, { "path": "README.md", "content": "

\n \"SolidJS\"\n

\n\n[![Build Status](https://img.shields.io/github/actions/workflow/status/solidjs/solid/main-ci.yml?branch=main&logo=github&style=for-the-badge)](https://github.com/solidjs/solid/actions/workflows/main-ci.yml)\n[![Coverage Status](https://img.shields.io/coveralls/github/solidjs/solid.svg?style=for-the-badge)](https://coveralls.io/github/solidjs/solid?branch=main)\n\n[![NPM Version](https://img.shields.io/npm/v/solid-js.svg?style=for-the-badge)](https://www.npmjs.com/package/solid-js)\n[![](https://img.shields.io/npm/dm/solid-js.svg?style=for-the-badge)](https://www.npmjs.com/package/solid-js)\n[![Discord](https://img.shields.io/discord/722131463138705510?style=for-the-badge)](https://discord.com/invite/solidjs)\n[![Subreddit subscribers](https://img.shields.io/reddit/subreddit-subscribers/solidjs?style=for-the-badge)](https://www.reddit.com/r/solidjs/)\n\n**[Website](https://www.solidjs.com/) • [API Docs](https://docs.solidjs.com/) • [Features Tutorial](https://www.solidjs.com/tutorial/introduction_basics) • [Playground](https://playground.solidjs.com/?version=1.3.13#NobwRAdghgtgpmAXGGUCWEwBowBcCeADgsrgM4Ae2YZA9gK4BOAxiWGjIbY7gAQi9GcCABM4jXgF9eAM0a0YvADo1aAGzQiAtACsyAegDucAEYqA3EogcuPfr2ZCouOAGU0Ac2hqps+YpU6DW09CysrGXoIZlw0WgheAGEGCBdGAAoASn4rXgd4sj5gZhTcLF4yOFxkqNwAXV4AXgcnF3cvKDV0gAZMywT8iELeDEc4eFSm3iymgD4KqprU9JLamYBqXgBGPvCBoVwmBPTcvN4AHhN6XFx43gJiRpUrm-iVXnjEjWYAa0aQUZCCa4SSzU5nfirZaZSTgi76F63CBgga7CCwiBWISicTpGaNebnJZpXj6WblES0Zj0YEAOg8VQAompxsJcAAhfAASREJzAUEIhBUmTRYEkdSAA) • [Discord](https://discord.com/invite/solidjs)**\n\nSolid is a declarative JavaScript library for creating user interfaces. Instead of using a Virtual DOM, it compiles its templates to real DOM nodes and updates them with fine-grained reactions. Declare your state and use it throughout your app, and when a piece of state changes, only the code that depends on it will rerun.\n\n## At a Glance\n```tsx\nimport { createSignal } from \"solid-js\";\nimport { render } from \"solid-js/web\";\n\nfunction Counter() {\n const [count, setCount] = createSignal(0);\n const doubleCount = () => count() * 2;\n \n console.log(\"The body of the function runs once...\");\n\n return (\n <>\n \n \n );\n}\n\nrender(Counter, document.getElementById(\"app\")!);\n```\n\nTry this code in our [playground](https://playground.solidjs.com/anonymous/0c88df54-91b0-4c88-bd20-e962bde49725)!\n\n
\nExplain this!\n\n```tsx\nimport { createSignal } from \"solid-js\";\nimport { render } from \"solid-js/web\";\n\n// A component is just a function that returns a DOM node\nfunction Counter() {\n // Create a piece of reactive state, giving us an accessor, count(), and a setter, setCount()\n const [count, setCount] = createSignal(0);\n \n //To create derived state, just wrap an expression in a function\n const doubleCount = () => count() * 2;\n \n console.log(\"The body of the function runs once...\");\n\n // JSX allows you to write HTML within your JavaScript function and include dynamic expressions using the { } syntax\n // The only part of this that will ever rerender is the doubleCount() text.\n return (\n <>\n \n \n );\n}\n\n// The render function mounts a component onto your page\nrender(Counter, document.getElementById(\"app\")!);\n```\n\nSolid compiles your JSX down to efficient real DOM updates. It uses the same reactive primitives (`createSignal`) at runtime but making sure there's as little rerendering as possible. Here's what that looks like in this example:\n\n```js\nimport { template as _$template } from \"solid-js/web\";\nimport { delegateEvents as _$delegateEvents } from \"solid-js/web\";\nimport { insert as _$insert } from \"solid-js/web\";\n//The compiler pulls out any static HTML\nconst _tmpl$ = /*#__PURE__*/_$template(`
\n\n## Key Features\n\n- Fine-grained updates to the real DOM\n- Declarative data: model your state as a system with reactive primitives\n- Render-once mental model: your components are regular JavaScript functions that run once to set up your view\n- Automatic dependency tracking: accessing your reactive state subscribes to it\n- [Small](https://dev.to/this-is-learning/javascript-framework-todomvc-size-comparison-504f) and [fast](https://krausest.github.io/js-framework-benchmark/current.html)\n- Simple: learn a few powerful concepts that can be reused, combined, and built on top of\n- Provides modern framework features like JSX, fragments, Context, Portals, Suspense, streaming SSR, progressive hydration, Error Boundaries and concurrent rendering.\n- Naturally debuggable: A `
` is a real div, so you can use your browser's devtools to inspect the rendering\n- [Web component friendly](https://github.com/solidjs/solid/tree/main/packages/solid-element#readme) and can author custom elements\n- Isomorphic: render your components on the client and the server\n- Universal: write [custom renderers](https://github.com/solidjs/solid/releases/tag/v1.2.0) to use Solid anywhere\n- A growing community and ecosystem with active core team support\n\n
\n \nQuick Start\n\nYou can get started with a simple app by running the following in your terminal:\n\n```sh\n> npx degit solidjs/templates/js my-app\n> cd my-app\n> npm i # or yarn or pnpm\n> npm run dev # or yarn or pnpm\n```\n\nOr for TypeScript:\n\n```sh\n> npx degit solidjs/templates/ts my-app\n> cd my-app\n> npm i # or yarn or pnpm\n> npm run dev # or yarn or pnpm\n```\n\nThis will create a minimal, client-rendered application powered by [Vite](https://vitejs.dev/).\n\nOr you can install the dependencies in your own setup. To use Solid with JSX (_recommended_), run:\n\n```sh\n> npm i -D babel-preset-solid\n> npm i solid-js\n```\n\nThe easiest way to get set up is to add `babel-preset-solid` to your `.babelrc`, babel config for webpack, or rollup configuration:\n\n```js\n\"presets\": [\"solid\"]\n```\n\nFor TypeScript to work, remember to set your `.tsconfig` to handle Solid's JSX:\n\n```js\n\"compilerOptions\": {\n \"jsx\": \"preserve\",\n \"jsxImportSource\": \"solid-js\",\n}\n```\n\n
\n\n## Why Solid?\n\n### Performant\n\nMeticulously engineered for performance and with half a decade of research behind it, Solid's performance is almost indistinguishable from optimized vanilla JavaScript (See Solid on the [JS Framework Benchmark](https://krausest.github.io/js-framework-benchmark/current.html)). Solid is [small](https://bundlephobia.com/package/solid-js@1.3.15) and completely tree-shakable, and [fast](https://levelup.gitconnected.com/how-we-wrote-the-fastest-javascript-ui-framework-again-db097ddd99b6) when rendering on the server, too. Whether you're writing a fully client-rendered SPA or a server-rendered app, your users see it faster than ever. ([Read more about Solid's performance](https://dev.to/ryansolid/thinking-granular-how-is-solidjs-so-performant-4g37) from the library's creator.)\n\n### Powerful\n\nSolid is fully-featured with everything you can expect from a modern framework. Performant state management is built-in with Context and Stores: you don't have to reach for a third party library to manage global state (if you don't want to). With Resources, you can use data loaded from the server like any other piece of state and build a responsive UI for it thanks to Suspense and concurrent rendering. And when you're ready to move to the server, Solid has full SSR and serverless support, with streaming and progressive hydration to get to interactive as quickly as possible. (Check out our full [interactive features walkthrough](https://www.solidjs.com/tutorial/introduction_basics).)\n\n### Pragmatic\n\nDo more with less: use simple, composable primitives without hidden rules and gotchas. In Solid, components are just functions - rendering is determined purely by how your state is used - so you're free to organize your code how you like and you don't have to learn a new rendering system. Solid encourages patterns like declarative code and read-write segregation that help keep your project maintainable, but isn't opinionated enough to get in your way.\n\n### Productive\n\nSolid is built on established tools like JSX and TypeScript and integrates with the Vite ecosystem. Solid's bare-metal, minimal abstractions give you direct access to the DOM, making it easy to use your favorite native JavaScript libraries like D3. And the Solid ecosystem is growing fast, with [custom primitives](https://github.com/solidjs-community/solid-primitives), [component libraries](https://kobalte.dev), and build-time utilities that let you [write Solid code in new ways](https://github.com/LXSMNSYC/solid-labels).\n\n## More\n\nCheck out our official [documentation](https://docs.solidjs.com) or browse some [examples](https://github.com/solidjs/solid/blob/main/documentation/resources/examples.md)\n\n## Browser Support\n\nSolidJS Core is committed to supporting the last 2 years of modern browsers including Firefox, Safari, Chrome and Edge (for desktop and mobile devices). We do not support IE or similar sunset browsers. For server environments, we support Node LTS and the latest Deno and Cloudflare Worker runtimes.\n\n\"Testing\n\n## Community\n\nCome chat with us on [Discord](https://discord.com/invite/solidjs)! Solid's creator and the rest of the core team are active there, and we're always looking for contributions.\n\n### Contributors\n\n\n\n### Open Collective\n\nSupport us with a donation and help us continue our activities. [[Contribute](https://opencollective.com/solid)]\n\n\n\n\n\n\n\n\n\n\n\n\n\n### Sponsors\n\nBecome a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor](https://opencollective.com/solid#sponsor)]\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n" }, { "path": "documentation/resources/examples.md", "content": "# Examples\n\n## Online\n- [Counter](https://codesandbox.io/s/8no2n9k94l) Simple Counter\n- [Simple Todos](https://codesandbox.io/s/lrm786ojqz) Todos with LocalStorage persistence\n- [Simple Routing](https://codesandbox.io/s/jjp8m8nlz5) Use 'switch' control flow for simple routing\n- [Scoreboard](https://codesandbox.io/s/solid-scoreboard-sjpje) Make use of hooks to do some simple transitions\n- [Tic Tac Toe](https://playground.solidjs.com/anonymous/335adbcd-289e-42f8-9a9c-152a96277747) Simple Example of the classic game\n- [Form Validation](https://codesandbox.io/s/solid-form-validation-2cdti) HTML 5 validators with custom async validation\n- [CSS Animations](https://codesandbox.io/s/basic-css-transition-36rln?file=/index.js) Using Solid Transition Group\n- [Styled Components](https://codesandbox.io/s/solid-styled-components-yv2t1) A simple example of creating Styled Components.\n- [Styled JSX](https://codesandbox.io/s/solid-styled-jsx-xgx6b) A simple example of using Styled JSX with Solid.\n- [Counter Context](https://codesandbox.io/s/counter-context-gur76) Implement a global store with Context API\n- [Async Resource](https://codesandbox.io/s/2o4wmxj9zy) Ajax requests to SWAPI with Promise cancellation\n- [Async Resource GraphQL](https://codesandbox.io/s/async-resource-graphql-r4rcx?file=/index.js) Simple resource for handling graphql request.\n- [Suspense](https://codesandbox.io/s/5v67oym224) Various Async loading with Solid's Suspend control flow\n- [Suspense Tabs](https://codesandbox.io/s/solid-suspense-tabs-vkgpj) Deferred loading spinners for smooth UX.\n- [SuspenseList](https://codesandbox.io/s/solid-suspenselist-eorvk) Orchestrating multiple Suspense Components.\n- [Redux Undoable Todos](https://codesandbox.io/s/pkjw38r8mj) Example from Redux site done with Solid.\n- [Simple Todos Template Literals](https://codesandbox.io/s/jpm68z1q33) Simple Todos using Lit DOM Expressions\n- [Simple Todos HyperScript](https://codesandbox.io/s/0vmjlmq94v) Simple Todos using Hyper DOM Expressions\n\n## Demos\n- [TodoMVC](https://github.com/solidjs/solid-todomvc) Classic TodoMVC example\n- [Real World Demo](https://github.com/solidjs/solid-realworld) Real World Demo for Solid\n- [Hacker News](https://github.com/solidjs/solid-hackernews) Hacker News Clone for Solid\n- [Storybook](https://github.com/rturnq/storybook-solid) Solid with Storybook\n\n## Benchmarks\n- [JS Framework Benchmark](https://github.com/krausest/js-framework-benchmark/tree/master/frameworks/keyed/solid) The one and only\n- [Sierpinski's Triangle Demo](https://github.com/ryansolid/solid-sierpinski-triangle-demo) Solid implementation of the React Fiber demo.\n- [WebComponent Todos](https://github.com/shprink/web-components-todo/tree/main/solid) Showing off Solid Element\n- [UIBench Benchmark](https://github.com/ryansolid/solid-uibench) a benchmark tests a variety of UI scenarios.\n- [DBMon Benchmark](https://github.com/ryansolid/solid-dbmon) A benchmark testing ability of libraries to render unoptimized data.\n" }, { "path": "package.json", "content": "{\n \"name\": \"solid-js\",\n \"description\": \"A declarative JavaScript library for building user interfaces.\",\n \"version\": \"1.0.0\",\n \"author\": \"Ryan Carniato\",\n \"license\": \"MIT\",\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/solidjs/solid\"\n },\n \"private\": true,\n \"scripts\": {\n \"preinstall\": \"npx only-allow pnpm\",\n \"postinstall\": \"simple-git-hooks\",\n \"test\": \"turbo run test test-types\",\n \"coverage\": \"turbo run coverage\",\n \"build\": \"turbo run build\",\n \"types\": \"turbo run types\",\n \"publish\": \"pnpm run build && pnpm run types && pnpm run release:only\",\n \"bump\": \"changeset add\",\n \"release:only\": \"changeset publish\",\n \"format\": \"prettier --write --cache \\\"**/*.[tj]s?(x)\\\"\"\n },\n \"devDependencies\": {\n \"@babel/cli\": \"^7.18.9\",\n \"@babel/core\": \"^7.20.12\",\n \"@babel/preset-env\": \"^7.18.9\",\n \"@babel/preset-typescript\": \"^7.18.6\",\n \"@changesets/cli\": \"^2.25.2\",\n \"@rollup/plugin-babel\": \"^6.0.3\",\n \"@rollup/plugin-commonjs\": \"^24.0.0\",\n \"@rollup/plugin-json\": \"^6.0.0\",\n \"@rollup/plugin-node-resolve\": \"^15.0.1\",\n \"@rollup/plugin-replace\": \"^5.0.2\",\n \"@types/node\": \"^22.7.5\",\n \"@vitest/coverage-v8\": \"^2.1.2\",\n \"babel-plugin-jsx-dom-expressions\": \"^0.40.3\",\n \"coveralls\": \"^3.1.1\",\n \"csstype\": \"^3.1.0\",\n \"dom-expressions\": \"0.40.4\",\n \"hyper-dom-expressions\": \"0.40.4\",\n \"jsdom\": \"^25.0.1\",\n \"lit-dom-expressions\": \"0.40.4\",\n \"ncp\": \"^2.0.0\",\n \"npm-run-all\": \"^4.1.5\",\n \"prettier\": \"^3.6.2\",\n \"rimraf\": \"^3.0.2\",\n \"rollup\": \"^4.24.0\",\n \"rollup-plugin-cleanup\": \"^3.2.1\",\n \"rollup-plugin-copy\": \"^3.4.0\",\n \"seroval\": \"~1.5.0\",\n \"simple-git-hooks\": \"^2.8.1\",\n \"symlink-dir\": \"^5.0.1\",\n \"tsconfig-replace-paths\": \"^0.0.11\",\n \"turbo\": \"^1.3.1\",\n \"typescript\": \"~5.7.2\",\n \"vite-plugin-solid\": \"^2.6.1\",\n \"vitest\": \"^2.1.2\"\n },\n \"simple-git-hooks\": {\n \"pre-commit\": \"pnpm run format\"\n },\n \"pnpm\": {\n \"overrides\": {\n \"babel-preset-solid\": \"workspace:*\"\n }\n },\n \"engines\": {\n \"pnpm\": \"^9.15.0\"\n },\n \"packageManager\": \"pnpm@9.15.0\"\n}\n" }, { "path": "packages/babel-preset-solid/CHANGELOG.md", "content": "# babel-preset-solid\n\n## 1.9.10\n\n### Patch Changes\n\n- 6c92555: Update dom-expressions, seroval plugins, optional chaining ref, style optimization\n- Updated dependencies [2270ae9]\n- Updated dependencies [94d87f1]\n- Updated dependencies [3114302]\n- Updated dependencies [6c92555]\n - solid-js@1.9.10\n\n## 1.9.9\n\n### Patch Changes\n\n- c07887c: fix #2524 closedby types, fix regression inlining style/classList\n- Updated dependencies [f59ee48]\n- Updated dependencies [62c5a98]\n- Updated dependencies [62c5a98]\n- Updated dependencies [c07887c]\n - solid-js@1.9.9\n\n## 1.9.8\n\n### Patch Changes\n\n- 2cd810f: compiler and jsx type updates\n - fix: ssr style undefined\n - fix: ssr double escaped array\n - fix: skip jsxImportSource skipping transform\n - fix: @once on style, classlist\n - JSX type updates\n - Update Universal Renderer Types\n\n## 1.9.6\n\n### Patch Changes\n\n- 8356213: update compiler config, fix boolean attribute regression, update JSX types\n\n## 1.9.5\n\n### Patch Changes\n\n- 35266c1: JSX type updates, preliminary MathML support, fix spread overescaping\n\n## 1.9.3\n\n### Patch Changes\n\n- 9b70a15: validation fixes, type updates, ssr attribute fix\n\n## 1.9.2\n\n### Patch Changes\n\n- 22aff14: update validation: smaller lib, opt out, better table handling\n add `on:` event types for native events\n\n## 1.9.0\n\n### Minor Changes\n\n- 2a3a1980: update dom-expressions\n - Improved Custom Element/Shadow DOM traversal - @olivercoad\n - Better heuristic to determine when to importNode - @titoBouzout\n - handleEvent syntax to allow custom event properties when not delegated - @titoBouzout\n - support for bool: attribute namespace - @titoBouzout\n - add \"is\" as detection for custom element - @titoBouzout\n - fix missing exports in different envs - @trusktr\n - better hydration mismatch errors - @ryansolid\n - improved HTML validation of JSX partials - @titoBouzout\n\n## 1.8.22\n\n### Patch Changes\n\n- 26128ec0: fix #2259 attr: in ssr, updates some types\n\n## 1.8.19\n\n### Patch Changes\n\n- 816a5c61: fix #2209 processing parent before child value binding in select\n- 424a31a3: optimize hydration keys\n\n## 1.8.18\n\n### Patch Changes\n\n- 6693b56f: update TS, custom elements, and a lot compiler fixes\n fixes #2144, #2145, #2178, #2192\n\n## 1.8.17\n\n### Patch Changes\n\n- 72c5381d: fix #2134, merge dom expressions fix #2136, fix #2137, fix #2110\n\n## 1.8.16\n\n### Patch Changes\n\n- 071cd42f: fix #2100, fix #2102 - hydration errors due to over optimization\n\n## 1.8.15\n\n### Patch Changes\n\n- 4ee461dc: improve template escaping, fragment hydration, SVG use types\n\n## 1.8.12\n\n### Patch Changes\n\n- 85b26c36: fix #2041, fix #2043 - async renderer timing, numeric prop literals\n\n## 1.8.9\n\n### Patch Changes\n\n- 80d4830f: fix #2016 value spread, smaller build output\n\n## 1.8.8\n\n### Patch Changes\n\n- 968e2cc9: update seroval, fix #1972, fix #1980, fix #2002, support partial ALS\n\n## 1.8.6\n\n### Patch Changes\n\n- 54e1aecf: update seroval, fix this, optimize star imports, fix #1952 hydration race condition\n\n## 1.8.4\n\n### Patch Changes\n\n- cf0542a4: fix #1927, fix #1929, fix #1931, update storage API\n\n## 1.8.2\n\n### Patch Changes\n\n- dd492c5e: fix #1917, fix #1918 error handling with serialization\n\n## 1.8.0\n\n### Minor Changes\n\n- 2c087cbb: update to seroval streaming serializer, change ssr markers\n- 2c087cbb: hydration perf improvement, fix #1849\n\n### Patch Changes\n\n- 2c087cbb: remove attribute quotes in template, batch serialization\n- 2c087cbb: improved serialization/guards, fix #1413, fix #1796 hydration with lazy\n\n## 1.8.0-beta.2\n\n### Minor Changes\n\n- e3a97d28: hydration perf improvement, fix #1849\n\n## 1.8.0-beta.1\n\n### Patch Changes\n\n- f6d511db: remove attribute quotes in template, batch serialization\n\n## 1.8.0-beta.0\n\n### Minor Changes\n\n- d8e0e8e8: update to seroval streaming serializer, change ssr markers\n\n### Patch Changes\n\n- bf09b838: improved serialization/guards, fix #1413, fix #1796 hydration with lazy\n\n## 1.7.12\n\n### Patch Changes\n\n- 10ac07af: update jsx types, iife compiler optimization\n\n## 1.7.7\n\n### Patch Changes\n\n- e660e5a3: add prettier code format in git-commit-hook\n\n## 1.7.4\n\n### Patch Changes\n\n- 91110701: fix element/test mismatch issues #1684, #1697, #1707\n fix solid-ssr types\n add missing JSX types #1690\n fix firefox iframe #1688\n\n## 1.7.3\n\n### Patch Changes\n\n- 655f0b7e: fix attr in ssr spread, fix static undefined classList values, fix #1666 directives in TTLs\n\n## 1.7.2\n\n### Patch Changes\n\n- 699d88eb: More thorough close tag ommission fix\n\n## 1.7.1\n\n### Patch Changes\n\n- d4087fe7: fix 1663: template element closing errors\n\n## 1.7.0\n\n### Minor Changes\n\n- f7dc355f: Remove FunctionElement from JSX.Element types\n- 940e5745: change to seroval serializer, better ssr fragment fixes\n- 2b80f706: Reduce DOM compiler output size\n Remove auxilary closing tags and lazy evaluate templates\n- 74f00e15: Support prop/attr directives in spreads, apply prop aliases only to specific elements\n\n### Patch Changes\n\n- 41ca6522: fixes around templates and hydration\n- 3de9432c: Better Input Event Types, Template Pruning, Universal Renderer Fixes\n- a382c0c5: minify inline style, class\n- 6a4fe46c: fix #1553 improper html entity encoding in literal expressions\n\n## 1.7.0-beta.5\n\n### Patch Changes\n\n- a382c0c5: minify inline style, class\n\n## 1.7.0-beta.4\n\n### Patch Changes\n\n- 3de9432c: Better Input Event Types, Template Pruning, Universal Renderer Fixes\n\n## 1.7.0-beta.3\n\n### Patch Changes\n\n- 41ca6522: fixes around templates and hydration\n\n## 1.7.0-beta.2\n\n### Minor Changes\n\n- 940e5745: change to seroval serializer, better ssr fragment fixes\n\n## 1.7.0-beta.1\n\n### Minor Changes\n\n- 2b80f706: Reduce DOM compiler output size\n Remove auxilary closing tags and lazy evaluate templates\n- 74f00e15: Support prop/attr directives in spreads, apply prop aliases only to specific elements\n\n## 1.7.0-beta.0\n\n### Minor Changes\n\n- f7dc355: Remove FunctionElement from JSX.Element types\n\n### Patch Changes\n\n- 6a4fe46: fix #1553 improper html entity encoding in literal expressions\n\n## 1.6.16\n\n### Patch Changes\n\n- d10da016: Fix #1651 hydration markers introduced too early\n\n## 1.6.13\n\n### Patch Changes\n\n- 60f8624d: fix #1596 ssr fragment text merge, fix #1599 ssr onCleanup\n\n## 1.6.12\n\n### Patch Changes\n\n- 676ed331: docs: fix typos\n- 081ca06c: fix #1553 html encoding for native strings on components\n- 4fdec4f9: fix #1564, fix #1567 template literal bugs\n\n## 1.6.10\n\n### Patch Changes\n\n- 7ab43a4: fix #1492 SSR Spread Breaks Hydration\n fix #1495 runWithOwner not clearing listener\n fix #1498 unrecoverable error in async batch\n\n## 1.6.9\n\n### Patch Changes\n\n- a572c12: Streaming without a wrapper and compile time JSX validation\n\n## 1.6.7\n\n### Patch Changes\n\n- 89baf12: fix boolean escaping, improve ssr performance\n\n## 1.6.6\n\n### Patch Changes\n\n- 2119211: fix #1423 - inlined arrow functions in SSR and update rollup\n\n## 1.6.3\n\n### Patch Changes\n\n- e95e95f: Bug fixes and testing changelog\n" }, { "path": "packages/babel-preset-solid/README.md", "content": "# babel-preset-solid\r\nBabel preset to transform JSX into Solid runtime calls.\r\n\r\n### Install\r\n\r\nVia NPM\r\n\r\n```javascript\r\nnpm install babel-preset-solid --save-dev\r\n```\r\n\r\nor Yarn\r\n\r\n```javascript\r\nyarn add babel-preset-solid --dev\r\n```\r\n\r\n### Usage\r\n\r\nMake or update your .babelrc config file with the preset:\r\n\r\n```javascript\r\n{\r\n \"presets\": [\r\n \"solid\"\r\n ]\r\n}\r\n```\r\n\r\nVia package.json\r\n\r\n```javascript\r\n ...\r\n \"babel\": {\r\n \"presets\": [\r\n \"es2015\",\r\n \"solid\"\r\n ],\r\n \"plugins\": [\r\n ]\r\n },\r\n ...\r\n```\r\n\r\n### Usage for SSR code\r\nWhen need to transform JSX code to be used on the server, pass the following options\r\n\r\n```javascript\r\n{\r\n \"presets\": [\r\n [\"solid\", { \"generate\": \"ssr\", \"hydratable\": true }]\r\n ]\r\n}\r\n```\r\nAnd for the browser build pass the hydratable option as well:\r\n```javascript\r\n{\r\n \"presets\": [\r\n [\"solid\", { \"generate\": \"dom\", \"hydratable\": true }]\r\n ]\r\n}\r\n```\r\n" }, { "path": "packages/babel-preset-solid/index.js", "content": "const jsxTransform = require(\"babel-plugin-jsx-dom-expressions\");\n\nmodule.exports = function (context, options = {}) {\n const plugins = [\n [\n jsxTransform,\n Object.assign(\n {\n moduleName: \"solid-js/web\",\n builtIns: [\n \"For\",\n \"Show\",\n \"Switch\",\n \"Match\",\n \"Suspense\",\n \"SuspenseList\",\n \"Portal\",\n \"Index\",\n \"Dynamic\",\n \"ErrorBoundary\"\n ],\n contextToCustomElements: true,\n wrapConditionals: true,\n generate: \"dom\"\n },\n options\n )\n ]\n ];\n\n return {\n plugins\n };\n};\n" }, { "path": "packages/babel-preset-solid/package.json", "content": "{\n \"name\": \"babel-preset-solid\",\n \"version\": \"1.9.10\",\n \"description\": \"Babel preset to transform JSX for Solid.js\",\n \"author\": \"Ryan Carniato \",\n \"homepage\": \"https://github.com/solidjs/solid/blob/main/packages/babel-preset-solid#readme\",\n \"license\": \"MIT\",\n \"repository\": \"https://github.com/solidjs/solid/blob/main/packages/babel-preset-solid\",\n \"main\": \"index.js\",\n \"files\": [\n \"index.js\"\n ],\n \"scripts\": {\n \"test\": \"node test.js\"\n },\n \"dependencies\": {\n \"babel-plugin-jsx-dom-expressions\": \"^0.40.3\"\n },\n \"peerDependencies\": {\n \"@babel/core\": \"^7.0.0\",\n \"solid-js\": \"^1.9.10\"\n },\n \"peerDependenciesMeta\": {\n \"solid-js\": {\n \"optional\": true\n }\n }\n}\n" }, { "path": "packages/babel-preset-solid/test.js", "content": "const babel = require(\"@babel/core\");\nconst preset = require(\".\");\nconst assert = require(\"assert\");\n\nconst { code } = babel.transformSync(\"const v =
;\", {\n presets: [preset],\n babelrc: false,\n compact: true\n});\n\nassert.equal(\n code,\n 'import{template as _$template}from\"solid-js/web\";var _tmpl$=/*#__PURE__*/_$template(`
`);const v=_tmpl$();'\n);\nconsole.log(\"passed\");\n" }, { "path": "packages/solid/.npmignore", "content": "types/tsconfig.tsbuildinfo\n" }, { "path": "packages/solid/CHANGELOG.md", "content": "# solid-js\n\n## 1.9.11\n\n### Patch Changes\n\n- 6628d9f: Update dom-expressions/seroval to latest\n\n## 1.9.10\n\n### Patch Changes\n\n- 2270ae9: Fix: Collision during SSR in createResource due to `loading` property.\n- 94d87f1: Update `build:clean` and `types:clean` script to include missing paths\n- 3114302: Improve `splitProps` performance\n- 6c92555: Update dom-expressions, seroval plugins, optional chaining ref, style optimization\n\n## 1.9.9\n\n### Patch Changes\n\n- f59ee48: fix dynamic overtracking\n- 62c5a98: Update `SuspenseList` to handle hydration context\n- 62c5a98: Add unit tests for `resolveSSRNode` and `createResource` functions\n- c07887c: fix #2524 closedby types, fix regression inlining style/classList\n\n## 1.9.8\n\n### Patch Changes\n\n- 09a9c1d: Export RendererOptions and Renderer types from solid-js/universal\n- 472c007: fix(scheduler): adjust yield timing logic to improve task scheduling …\n- 3d3207d: fix #2491 no key on merge false\n- 2cd810f: compiler and jsx type updates\n - fix: ssr style undefined\n - fix: ssr double escaped array\n - fix: skip jsxImportSource skipping transform\n - fix: @once on style, classlist\n - JSX type updates\n - Update Universal Renderer Types\n- cbff564: feat: createMutable support for class inheritance\n- e056eab: add support for `is` in `Dynamic`, closes #2413\n- bdba4dc: Fix resource instances always getting cached on SSR\n- Updated dependencies [2cd810f]\n - babel-preset-solid@1.9.8\n\n## 1.9.7\n\n### Patch Changes\n\n- 84ca952: Fix hydration issues caused by seroval update.\n- 4cd7eb1: Catch synchronous errors in `createResource`.\n\n## 1.9.6\n\n### Patch Changes\n\n- 362e99f: fix #2444 prev value in memo messing with reactive rendering\n- 8356213: update compiler config, fix boolean attribute regression, update JSX types\n- c65faec: fix #2428 - owner always present in resource fetcher\n- 6380b01: fix #2399: novalidate, #2460 spellcheck types\n\n## 1.9.5\n\n### Patch Changes\n\n- 86ae8a9: add optional initalValue argument to `from` helper\n- 89e016d: dev: Add `internal` flag to signal\n- 9431b88: Mirror createDynamic for SSR\n- 35266c1: JSX type updates, preliminary MathML support, fix spread overescaping\n- 0eab77d: Removed unnecessary evaluations of and conditions.\n- fff8aed: Update typescript to 5.7\n- f9ef621: dev: Add afterRegisterGraph hook replacing afterCreateSignal\n\n## 1.9.4\n\n### Patch Changes\n\n- b93956f: fix escaping in resolution done outside of DOM Expressions\n- 199dd69: fix reconcile null guard\n- 7f9cd3d: lazy image, tagged template detection, security fixes\n- 32aa744: Improve resolving arguments in createResource\n\n## 1.9.3\n\n### Patch Changes\n\n- bb6ce8b: Reordering setter overloads\n- 9b70a15: validation fixes, type updates, ssr attribute fix\n\n## 1.9.2\n\n### Patch Changes\n\n- 22aff14: update validation: smaller lib, opt out, better table handling\n add `on:` event types for native events\n- e2e2a03: Fix setter type compatibility with kobalte select and add tests\n\n## 1.9.1\n\n### Patch Changes\n\n- fb67b687: fix anchor host interfering with event delegation\n- 7ecf92d3: fix #2304 component props can be string, explicit imports in tests\n\n## 1.9.0\n\n### Minor Changes\n\n- 4f8597dc: better handling of exports client/server\n- 120bf06d: fix!: Remove browser field from package.json\n- 2a3a1980: update dom-expressions\n - Improved Custom Element/Shadow DOM traversal - @olivercoad\n - Better heuristic to determine when to importNode - @titoBouzout\n - handleEvent syntax to allow custom event properties when not delegated - @titoBouzout\n - support for bool: attribute namespace - @titoBouzout\n - add \"is\" as detection for custom element - @titoBouzout\n - fix missing exports in different envs - @trusktr\n - better hydration mismatch errors - @ryansolid\n - improved HTML validation of JSX partials - @titoBouzout\n\n### Patch Changes\n\n- 80b09589: Improve signal setter type for code completion of string literal unions.\n- 51bec61a: update TS to NodeNext\n\n## 1.8.23\n\n### Patch Changes\n\n- bc20a4ce: update types, fix hydration cancel timing error, sync ssr script appending\n- 9697c94b: jsdoc: Fix incorrect links of reactive utility `on`\n- 9e192d7e: fix #2282: Add Check for Proxy support\n- 379293d9: use correct hydration id in server lazy\n- 73c00927: Fix missing code block end in `useTransition`'s jsdoc comment\n- e4b2c668: fix missing disposal of nested transition nodes\n- 94929afa: fix wrapping of object with `null` prototype\n\n## 1.8.22\n\n### Patch Changes\n\n- f8ae663c: Fix broken links in Readme\n- 19d0295f: fix stranded effects during hydration cancelation\n- 26128ec0: fix #2259 attr: in ssr, updates some types\n\n## 1.8.21\n\n### Patch Changes\n\n- a036a63a: shortcut hydrate call when hydration is done\n\n## 1.8.20\n\n### Patch Changes\n\n- c8fe58e9: fix #2250 hydration error, fix lazy component loading, better hydration cancelation\n- 80dd2769: fix #2236 improper shortcircuit in resource hydration\n\n## 1.8.19\n\n### Patch Changes\n\n- 3fc015c2: track length in array helpers, fix mobx external source\n- f909c1c1: fix #2228 - chained resources with initial values\n- 816a5c61: fix #2209 processing parent before child value binding in select\n- 424a31a3: optimize hydration keys\n\n## 1.8.18\n\n### Patch Changes\n\n- 6693b56f: update TS, custom elements, and a lot compiler fixes\n fixes #2144, #2145, #2178, #2192\n- a8c2a8f3: remove weird server resource hack, fix hydrated resource state\n\n## 1.8.17\n\n### Patch Changes\n\n- 72c5381d: fix #2134, merge dom expressions fix #2136, fix #2137, fix #2110\n- e065e475: fix #2135 ssr of top level fragments under Suspense\n\n## 1.8.16\n\n### Patch Changes\n\n- 8de75a47: fix #2065 forward initial value to `on`\n- 071cd42f: fix #2100, fix #2102 - hydration errors due to over optimization\n- 3212f74d: Adjust some JSDocs\n\n## 1.8.15\n\n### Patch Changes\n\n- 829af663: fix #2047 early interaction/multiple resources\n- 4ee461dc: improve template escaping, fragment hydration, SVG use types\n\n## 1.8.14\n\n### Patch Changes\n\n- 4b76be80: fix storage export in top-level package.json\n\n## 1.8.13\n\n### Patch Changes\n\n- 3ac8210c: fix storage export\n\n## 1.8.12\n\n### Patch Changes\n\n- aba5de08: fix #1746 class properties not working getters in createMutable\n- 85b26c36: fix #2041, fix #2043 - async renderer timing, numeric prop literals\n\n## 1.8.11\n\n### Patch Changes\n\n- 1ec67f15: fix #2028, fix #2029 revert spread value bypass, and guard multi-text\n\n## 1.8.10\n\n### Patch Changes\n\n- 169d23b4: fix disposal timing when streaming\n\n## 1.8.9\n\n### Patch Changes\n\n- 80d4830f: fix #2016 value spread, smaller build output\n- 918586fb: fix #2017 object replacing array in `reconcile`\n- 71bea784: fix #1971 order of merged properties\n- b0862d39: fix #2014 html not replaced when resource resolves next `tick`\n- cbc8d3ee: remove seroval plugins from build output\n\n## 1.8.8\n\n### Patch Changes\n\n- 40b5d78d: chore(types): return mapped type for splitProps excluded `other` value\n- 968e2cc9: update seroval, fix #1972, fix #1980, fix #2002, support partial ALS\n- 292aba41: fix #1982 ErrorBoundary with ExternalSource\n- 7e5667ab: fix #1998 Switch relying on order\n- 8d2de12f: fix #1850 untrack in external source\n- b887587a: fix #1973 array over object reconcile\n\n## 1.8.7\n\n### Patch Changes\n\n- 22667bbc: fix: createSignal not found when bundled\n- e09a3cc3: fix timing issue with deferStream\n\n## 1.8.6\n\n### Patch Changes\n\n- 2b320376: Add types directory export for each package\n- fb7f4bc1: fix #1950 leaking error tracking\n- b092368c: feat(DEV): Add afterCreateSignal hook to DevHooks\n- 54e1aecf: update seroval, fix this, optimize star imports, fix #1952 hydration race condition\n\n## 1.8.5\n\n### Patch Changes\n\n- 80ca972f: fix `onHydrate` call being skipped\n\n## 1.8.4\n\n### Patch Changes\n\n- cf0542a4: fix #1927, fix #1929, fix #1931, update storage API\n- 3f3a3396: serialization error handling, experimental async storage\n\n## 1.8.3\n\n### Patch Changes\n\n- 1f0226e1: fix #1917 for real this time\n\n## 1.8.2\n\n### Patch Changes\n\n- b632dfd5: Add missing `indexArray` to server-side runtime.\n- dd492c5e: fix #1917, fix #1918 error handling with serialization\n- 4968fe26: Add `.js` extension to import\n\n## 1.8.1\n\n### Patch Changes\n\n- 0b9b71aa: better errors for hydration\n\n## 1.8.0\n\n### Minor Changes\n\n- 2c087cbb: update to seroval streaming serializer, change ssr markers\n- 2c087cbb: hydration perf improvement, fix #1849\n\n### Patch Changes\n\n- 2c087cbb: remove attribute quotes in template, batch serialization\n- 2c087cbb: improved serialization/guards, fix #1413, fix #1796 hydration with lazy\n- 2c087cbb: fix: missing `has` property in `SharedConfig`\n- 2c087cbb: fix #1905, fix #1908 JSX type ommissions\n\n## 1.8.0-beta.2\n\n### Minor Changes\n\n- e3a97d28: hydration perf improvement, fix #1849\n\n### Patch Changes\n\n- d797a143: fix #1905, fix #1908 JSX type ommissions\n\n## 1.8.0-beta.1\n\n### Patch Changes\n\n- f6d511db: remove attribute quotes in template, batch serialization\n- af625dd3: fix: missing `has` property in `SharedConfig`\n\n## 1.8.0-beta.0\n\n### Minor Changes\n\n- d8e0e8e8: update to seroval streaming serializer, change ssr markers\n\n### Patch Changes\n\n- bf09b838: improved serialization/guards, fix #1413, fix #1796 hydration with lazy\n\n## 1.7.12\n\n### Patch Changes\n\n- 12eb1552: fix #1875 - mergeProps not handling undefined on SSR\n- 13b1fa6e: fix #1883 initialize createDeferred with transition value\n- 10ac07af: update jsx types, iife compiler optimization\n- 8b49110b: Allow passing defer:boolean to `on`\n\n## 1.7.11\n\n### Patch Changes\n\n- 26740b88: fix #1848 Suspense Default Context Non-Null\n\n## 1.7.10\n\n### Patch Changes\n\n- 5ed448ae: Export `ContextProviderComponent`, `ResolvedChildren` and `ResolvedJSXElement` types\n- 7dd1f413: fix .pipeTo signature to return promise\n- c2008f02: Fix underscore property\n- 792e7dea: fix #1821 improve context performance\n\n## 1.7.9\n\n### Patch Changes\n\n- 44a2bf0b: fix #1814 incorrect typing embedding for h and html\n- 6cd10c73: Changes how the Setter type was declared without actually functionally changing it, fixing the Setter type being assignable to any other Setter type; fixes #1818.\n\n Generically typed Setters must now non-null assert their parameter, i.e.\n\n ```diff\n function myCustomSignal(v: T) {\n const [get, set] = createSignal();\n - const mySetter: Setter = (v?) => set(v);\n + const mySetter: Setter = (v?) => set(v!);\n\n const [get, set] = createSignal(v);\n - const mySetter: Setter = (v?) => set(v);\n + const mySetter: Setter = (v?) => set(v!);\n }\n ```\n\n- 6c9879c9: fix in introspection in stores\n- 039cf60d: update universal runtime readme\n- 852f4c76: add missing link jsx types\n\n## 1.7.8\n\n### Patch Changes\n\n- efd23186: fix #1780 invalid HTML comments\n- 51074fab: remove optional chaining, reduce bundle size\n- fe6f03f9: fix #1795 early effects running during async hydration\n\n## 1.7.7\n\n### Patch Changes\n\n- c4cbfd3c: fix(Portal): reactive in children when pass signal directly\n- 0100bd12: Propagate errors to parents when throwing errors in nested catchError\n- 46e5e787: Improve type inference of `createSelector`.\n- 8ba0e80a: Fix `mergeProps`.\n- e660e5a3: add prettier code format in git-commit-hook\n- 93d44d45: fix #1787 missing CJS types\n\n## 1.7.6\n\n### Patch Changes\n\n- 83c99d51: fix #1739 resolved state of disabled resources\n- f99dd044: Solid-Element: Add clarification on 'props' parameter in customElement function\n- 88493691: apply reference optimization to mergeProps\n- 514ef679: test: add tests to `splitProps`\n- 20261537: fix #1735 web component instantiation before constructor\n- 194f93c7: Improve performance in `splitProps` and `mergeProps`\n\n## 1.7.5\n\n### Patch Changes\n\n- 5288cfa8: fix #1713, fix non-option jsx types\n- 8852c199: test: add tests to `splitProps` and `mergeProps`\n\n## 1.7.4\n\n### Patch Changes\n\n- 1b5ea076: perf: avoid unnecessary flat\n- 91110701: fix element/test mismatch issues #1684, #1697, #1707\n fix solid-ssr types\n add missing JSX types #1690\n fix firefox iframe #1688\n\n## 1.7.3\n\n### Patch Changes\n\n- 655f0b7e: fix attr in ssr spread, fix static undefined classList values, fix #1666 directives in TTLs\n- 8ce2c47b: Portal fixes #1676, #1677\n\n## 1.7.2\n\n### Patch Changes\n\n- 27994dc9: Another attempt at fixing skypack\n- dfec6883: fix #1668 proto methods on store data nodes\n\n## 1.7.1\n\n### Patch Changes\n\n- ba024813: fix ref timing in portals\n\n## 1.7.0\n\n### Minor Changes\n\n- 503b6328: Add type narrowing non-keyed control flow\n- 86c32279: always cast to errors when handled\n- f7dc355f: Remove FunctionElement from JSX.Element types\n- 940e5745: change to seroval serializer, better ssr fragment fixes\n- 608b3c3a: Add catchError/deprecate onError\n- 2b80f706: Reduce DOM compiler output size\n Remove auxilary closing tags and lazy evaluate templates\n- 8d0877e4: fix #1562 cleanup order\n- 74f00e15: Support prop/attr directives in spreads, apply prop aliases only to specific elements\n\n### Patch Changes\n\n- 6b77d9ed: Better types on function callback control flow\n- 41ca6522: fixes around templates and hydration\n- 840933b8: fix #1653 portal bypasses Suspense\n- cb6a383d: ensure narrowed values are non-null\n- 3de9432c: Better Input Event Types, Template Pruning, Universal Renderer Fixes\n- 2cb6f3d6: fix treeshaking in rollup 3\n- 24469762: Add a reference to the component funciton to DevComponent owner.\n Rename DevComponent's property from `componentName` to `name`.\n- 5545d3ee: Type narrowed flow on the server, add stale warning\n- 0dc8e365: Make non-null control flow assertion stricter by throwing\n- 4929530b: Remove name generation of owners and signals\n- 71c40af6: DEV: Minor additions and change the API of dev hooks\n- 6a4fe46c: fix #1553 improper html entity encoding in literal expressions\n- 5d671b89: Fix external source tests\n- 23c157ac: fix backward compatibility of template, fix #1639 loading on iframe\n\n## 1.7.0-beta.5\n\n### Patch Changes\n\n- 0dc8e365: Make non-null control flow assertion stricter by throwing\n\n## 1.7.0-beta.4\n\n### Patch Changes\n\n- cb6a383d: ensure narrowed values are non-null\n- 3de9432c: Better Input Event Types, Template Pruning, Universal Renderer Fixes\n- 2cb6f3d6: fix treeshaking in rollup 3\n- 23c157ac: fix backward compatibility of template, fix #1639 loading on iframe\n\n## 1.7.0-beta.3\n\n### Patch Changes\n\n- 41ca6522: fixes around templates and hydration\n\n## 1.7.0-beta.2\n\n### Minor Changes\n\n- 940e5745: change to seroval serializer, better ssr fragment fixes\n\n## 1.7.0-beta.1\n\n### Minor Changes\n\n- 608b3c3a: Add catchError/deprecate onError\n- 2b80f706: Reduce DOM compiler output size\n Remove auxilary closing tags and lazy evaluate templates\n- 8d0877e4: fix #1562 cleanup order\n- 74f00e15: Support prop/attr directives in spreads, apply prop aliases only to specific elements\n\n### Patch Changes\n\n- 6b77d9ed: Better types on function callback control flow\n- 24469762: Add a reference to the component funciton to DevComponent owner.\n Rename DevComponent's property from `componentName` to `name`.\n- 5545d3ee: Type narrowed flow on the server, add stale warning\n\n## 1.7.0-beta.0\n\n### Minor Changes\n\n- 503b632: Add type narrowing non-keyed control flow\n- 86c3227: always cast to errors when handled\n- f7dc355: Remove FunctionElement from JSX.Element types\n\n### Patch Changes\n\n- 4929530: Remove name generation of owners and signals\n- 71c40af: DEV: Minor additions and change the API of dev hooks\n- e245736: Fixed test case for setStore 7 parameter overload by fixing KeyOf giving number for KeyOf\n- 6a4fe46: fix #1553 improper html entity encoding in literal expressions\n\n## 1.6.16\n\n### Patch Changes\n\n- d10da016: Fix #1651 hydration markers introduced too early\n- 620c7636: Switch test runner from Jest to Vitest\n\n## 1.6.15\n\n### Patch Changes\n\n- e8448ebd: fix #1624 early fallback removal, add missing svg pathLength type\n- da83ebda: defer ssr cleanup to next macrotask\n\n## 1.6.14\n\n### Patch Changes\n\n- 6cceab2f: fix #1613 broken renderToString\n\n## 1.6.13\n\n### Patch Changes\n\n- af20f00b: fix #1602 wrong resource state during SSR\n- 60f8624d: fix #1596 ssr fragment text merge, fix #1599 ssr onCleanup\n\n## 1.6.12\n\n### Patch Changes\n\n- e2888c77: Correct the type of `isServer` const to `boolean` from `false`.\n- 676ed331: docs: fix typos\n- b8a3ff13: fix #1586 error boundary called twice\n- 1aff80c6: fix #1573 top level reconcile not merging\n- 53db3f0f: fix fallback hydration\n- 47d574a8: fix #1588: dynamic mount elements in Portals without recreation\n- e245736f: Fixed test case for setStore 7 parameter overload by fixing KeyOf giving number for KeyOf\n- 61d1fe25: Export `isDev` const from solid-js/web for differentiating between dev/prod env.\n- 4fdec4f9: fix #1564, fix #1567 template literal bugs\n\n## 1.6.11\n\n### Patch Changes\n\n- bfbd002: Fixed the store setter's recursive fallback overload not terminating with non-numbers\n- 1ecdea4: chore: export package.json\n- 91d518a: fix: createResource should not ignores empty string throw\n- 18e734d: Support null for detachedOwner in createRoot\n- 12d458d: fix #1547, missing SVGPattern type\n- 4aaa94b: Fix: swap KeyOf for MutableKeyOf in one of the SetStoreFunction overload\n- c26f933: Add fast track for `untrack` in case of `null` listener\n- 6fb3cd8: fix #1541: process errors at the end of synchronous execution\n- c5b208c: fix #1522, errors stop future effects from running\n\n## 1.6.10\n\n### Patch Changes\n\n- 1b32e63: Fix broken comments description link to solid docs\n- dd879da: fix #1493 export DynamicProps\n- d89e791: Add generic to onCleanup\n- 695d99b: Export `EffectOptions` and `OnOptions` from main module\n- d35a1ca: Fixed the return type of the `Symbol.observable` method of the `observable` in the generated `.d.ts`\n- 7ab43a4: fix #1492 SSR Spread Breaks Hydration\n fix #1495 runWithOwner not clearing listener\n fix #1498 unrecoverable error in async batch\n\n## 1.6.9\n\n### Patch Changes\n\n- a572c12: Streaming without a wrapper and compile time JSX validation\n- 0ad9859: fix #1478 error infinite loop\n- 12629a3: DEV: registerGraph `graph` property added to values\n\n## 1.6.8\n\n### Patch Changes\n\n- 6db2d89: Fix #1461 - streaming broken due to reusing same resources for lazy dedupe\n\n## 1.6.7\n\n### Patch Changes\n\n- c4ac14c: Format/Cleanup Types and code style\n- 1384496: Fix unowned roots having owner in dev\n- 1dbd5a9: stub out render and hydrate on server\n- 368e508: make splitProps with dynamic source return proxies\n- 54f3068: fix #1452 runWithOwner responsible for errors in its scope\n- c8edacd: Fix lazy defined in components during SSR\n- 89baf12: fix boolean escaping, improve ssr performance\n\n## 1.6.6\n\n### Patch Changes\n\n- a603850: Export SignalOptions\n- 2119211: fix #1423 - inlined arrow functions in SSR and update rollup\n- 5a5a72d: Fix #1436 incorrectly missing proxy detection\n- 5eb575a: fix: delete lazy contexts one by one as they are completed\n\n## 1.6.5\n\n### Patch Changes\n\n- 50d1304: fix #1416 nulls in array reconcile\n- ee71b16: fix #1410 - node 14 compatibility. Remove `||=` operator that isn't available on some legacy platforms.\n\n## 1.6.4\n\n### Patch Changes\n\n- a42a5f6: memoize merging functions\n\n## 1.6.3\n\n### Patch Changes\n\n- e95e95f: Bug fixes and testing changelog\n" }, { "path": "packages/solid/README.md", "content": "

\n \"SolidJS\"\n

\n\n[![Build Status](https://img.shields.io/github/actions/workflow/status/solidjs/solid/main-ci.yml?branch=main&logo=github&style=for-the-badge)](https://github.com/solidjs/solid/actions/workflows/main-ci.yml)\n[![Coverage Status](https://img.shields.io/coveralls/github/solidjs/solid.svg?style=for-the-badge)](https://coveralls.io/github/solidjs/solid?branch=main)\n\n[![NPM Version](https://img.shields.io/npm/v/solid-js.svg?style=for-the-badge)](https://www.npmjs.com/package/solid-js)\n[![](https://img.shields.io/npm/dm/solid-js.svg?style=for-the-badge)](https://www.npmjs.com/package/solid-js)\n[![Discord](https://img.shields.io/discord/722131463138705510?style=for-the-badge)](https://discord.com/invite/solidjs)\n[![Subreddit subscribers](https://img.shields.io/reddit/subreddit-subscribers/solidjs?style=for-the-badge)](https://www.reddit.com/r/solidjs/)\n\n**[Website](https://www.solidjs.com/) • [API Docs](https://docs.solidjs.com/) • [Features Tutorial](https://www.solidjs.com/tutorial/introduction_basics) • [Playground](https://playground.solidjs.com/?version=1.3.13#NobwRAdghgtgpmAXGGUCWEwBowBcCeADgsrgM4Ae2YZA9gK4BOAxiWGjIbY7gAQi9GcCABM4jXgF9eAM0a0YvADo1aAGzQiAtACsyAegDucAEYqA3EogcuPfr2ZCouOAGU0Ac2hqps+YpU6DW09CysrGXoIZlw0WgheAGEGCBdGAAoASn4rXgd4sj5gZhTcLF4yOFxkqNwAXV4AXgcnF3cvKDV0gAZMywT8iELeDEc4eFSm3iymgD4KqprU9JLamYBqXgBGPvCBoVwmBPTcvN4AHhN6XFx43gJiRpUrm-iVXnjEjWYAa0aQUZCCa4SSzU5nfirZaZSTgi76F63CBgga7CCwiBWISicTpGaNebnJZpXj6WblES0Zj0YEAOg8VQAompxsJcAAhfAASREJzAUEIhBUmTRYEkdSAA) • [Discord](https://discord.com/invite/solidjs)**\n\nSolid is a declarative JavaScript library for creating user interfaces. Instead of using a Virtual DOM, it compiles its templates to real DOM nodes and updates them with fine-grained reactions. Declare your state and use it throughout your app, and when a piece of state changes, only the code that depends on it will rerun. Check out our [intro video](https://www.youtube.com/watch?v=cELFZQAMdhQ) or read on!\n\n## Key Features\n\n- Fine-grained updates to the real DOM\n- Declarative data: model your state as a system with reactive primitives\n- Render-once mental model: your components are regular JavaScript functions that run once to set up your view\n- Automatic dependency tracking: accessing your reactive state subscribes to it\n- [Small](https://dev.to/this-is-learning/javascript-framework-todomvc-size-comparison-504f) and [fast](https://krausest.github.io/js-framework-benchmark/current.html)\n- Simple: learn a few powerful concepts that can be reused, combined, and built on top of\n- Provides modern framework features like JSX, fragments, Context, Portals, Suspense, streaming SSR, progressive hydration, Error Boundaries and concurrent rendering.\n- Naturally debuggable: A `
` is a real div, so you can use your browser's devtools to inspect the rendering\n- [Web component friendly](https://github.com/solidjs/solid/tree/main/packages/solid-element#readme) and can author custom elements\n- Isomorphic: render your components on the client and the server\n- Universal: write [custom renderers](https://github.com/solidjs/solid/releases/tag/v1.2.0) to use Solid anywhere\n- A growing community and ecosystem with active core team support\n\n
\n\nQuick Start\n\nYou can get started with a simple app by running the following in your terminal:\n\n```sh\n> npx degit solidjs/templates/js my-app\n> cd my-app\n> npm i # or yarn or pnpm\n> npm run dev # or yarn or pnpm\n```\n\nOr for TypeScript:\n\n```sh\n> npx degit solidjs/templates/ts my-app\n> cd my-app\n> npm i # or yarn or pnpm\n> npm run dev # or yarn or pnpm\n```\n\nThis will create a minimal, client-rendered application powered by [Vite](https://vitejs.dev/).\n\nOr you can install the dependencies in your own setup. To use Solid with JSX (_recommended_), run:\n\n```sh\n> npm i -D babel-preset-solid\n> npm i solid-js\n```\n\nThe easiest way to get set up is to add `babel-preset-solid` to your `.babelrc`, babel config for webpack, or rollup configuration:\n\n```js\n\"presets\": [\"solid\"]\n```\n\nFor TypeScript to work, remember to set your `.tsconfig` to handle Solid's JSX:\n\n```js\n\"compilerOptions\": {\n \"jsx\": \"preserve\",\n \"jsxImportSource\": \"solid-js\",\n}\n```\n\n
\n\n## Why Solid?\n\n### Performant\n\nMeticulously engineered for performance and with half a decade of research behind it, Solid's performance is almost indistinguishable from optimized vanilla JavaScript (See Solid on the [JS Framework Benchmark](https://krausest.github.io/js-framework-benchmark/current.html)). Solid is [small](https://bundlephobia.com/package/solid-js@1.3.15) and completely tree-shakable, and [fast](https://levelup.gitconnected.com/how-we-wrote-the-fastest-javascript-ui-framework-again-db097ddd99b6) when rendering on the server, too. Whether you're writing a fully client-rendered SPA or a server-rendered app, your users see it faster than ever. ([Read more about Solid's performance](https://dev.to/ryansolid/thinking-granular-how-is-solidjs-so-performant-4g37) from the library's creator.)\n\n### Powerful\n\nSolid is fully-featured with everything you can expect from a modern framework. Performant state management is built-in with Context and Stores: you don't have to reach for a third party library to manage global state (if you don't want to). With Resources, you can use data loaded from the server like any other piece of state and build a responsive UI for it thanks to Suspense and concurrent rendering. And when you're ready to move to the server, Solid has full SSR and serverless support, with streaming and progressive hydration to get to interactive as quickly as possible. (Check out our full [interactive features walkthrough](https://www.solidjs.com/tutorial/introduction_basics).)\n\n### Pragmatic\n\nDo more with less: use simple, composable primitives without hidden rules and gotchas. In Solid, components are just functions - rendering is determined purely by how your state is used - so you're free to organize your code how you like and you don't have to learn a new rendering system. Solid encourages patterns like declarative code and read-write segregation that help keep your project maintainable, but isn't opinionated enough to get in your way.\n\n### Productive\n\nSolid is built on established tools like JSX and TypeScript and integrates with the Vite ecosystem. Solid's bare-metal, minimal abstractions give you direct access to the DOM, making it easy to use your favorite native JavaScript libraries like D3. And the Solid ecosystem is growing fast, with [custom primitives](https://github.com/solidjs-community/solid-primitives), [component libraries](https://github.com/hope-ui/hope-ui), and build-time utilities that let you [write Solid code in new ways](https://github.com/LXSMNSYC/solid-labels).\n\n
\nShow Me!\n\n```jsx\nimport { render } from \"solid-js/web\";\nimport { createSignal } from \"solid-js\";\n\n// A component is just a function that (optionally) accepts properties and returns a DOM node\nconst Counter = props => {\n // Create a piece of reactive state, giving us a accessor, count(), and a setter, setCount()\n const [count, setCount] = createSignal(props.startingCount || 1);\n\n // The increment function calls the setter\n const increment = () => setCount(count() + 1);\n\n console.log(\n \"The body of the function runs once, like you'd expect from calling any other function, so you only ever see this console log once.\"\n );\n\n // JSX allows us to write HTML within our JavaScript function and include dynamic expressions using the { } syntax\n // The only part of this that will ever rerender is the count() text.\n return (\n \n );\n};\n\n// The render function mounts a component onto your page\nrender(() => , document.getElementById(\"app\"));\n```\n\nSee it in action in our interactive [Playground](https://playground.solidjs.com/?hash=-894962706&version=1.3.13)!\n\nSolid compiles our JSX down to efficient real DOM expressions updates, still using the same reactive primitives (`createSignal`) at runtime but making sure there's as little rerendering as possible. Here's what that looks like in this example:\n\n```js\nimport { render, createComponent, delegateEvents, insert, template } from \"solid-js/web\";\nimport { createSignal } from \"solid-js\";\n\nconst _tmpl$ = /*#__PURE__*/ template(``, 2);\n\nconst Counter = props => {\n const [count, setCount] = createSignal(props.startingCount || 1);\n const increment = () => setCount(count() + 1);\n\n console.log(\"The body of the function runs once . . .\");\n\n return (() => {\n //_el$ is a real DOM node!\n const _el$ = _tmpl$.cloneNode(true);\n _el$.firstChild;\n\n _el$.$$click = increment;\n\n //This inserts the count as a child of the button in a way that allows count to update without rerendering the whole button\n insert(_el$, count, null);\n\n return _el$;\n })();\n};\n\nrender(\n () =>\n createComponent(Counter, {\n startingCount: 2\n }),\n document.getElementById(\"app\")\n);\n\ndelegateEvents([\"click\"]);\n```\n\n
\n\n## More\n\nCheck out our official [documentation](https://www.solidjs.com/guide) or browse some [examples](https://github.com/solidjs/solid/blob/main/documentation/resources/examples.md)\n\n## Browser Support\n\nSolidJS Core is committed to supporting the last 2 years of modern browsers including Firefox, Safari, Chrome and Edge (for desktop and mobile devices). We do not support IE or similar sunset browsers. For server environments, we support Node LTS and the latest Deno and Cloudflare Worker runtimes.\n\n\"Testing\n\n## Community\n\nCome chat with us on [Discord](https://discord.com/invite/solidjs)! Solid's creator and the rest of the core team are active there, and we're always looking for contributions.\n\n### Contributors\n\n\n\n### Open Collective\n\nSupport us with a donation and help us continue our activities. [[Contribute](https://opencollective.com/solid)]\n\n\n\n\n\n\n\n\n\n\n\n\n\n### Sponsors\n\nBecome a sponsor and get your logo on our README on GitHub with a link to your site. [[Become a sponsor](https://opencollective.com/solid#sponsor)]\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n" }, { "path": "packages/solid/babel.config.cjs", "content": "const path = require('path');\r\n\r\nmodule.exports = {\r\n env: {\r\n test: {\r\n presets: [\r\n [\"@babel/preset-env\", { targets: { node: \"current\" } }],\r\n \"@babel/preset-typescript\"\r\n ],\r\n plugins: [\r\n [\r\n \"babel-plugin-transform-rename-import\",\r\n {\r\n replacements: [\r\n {\r\n original: \"rxcore\",\r\n replacement: path.join(__dirname, \"../../packages/solid/web/src/core\")\r\n },\r\n {\r\n original: \"^solid-js$\",\r\n replacement: path.join(__dirname, \"src\"),\r\n }\r\n ]\r\n }\r\n ],\r\n [\r\n \"babel-plugin-jsx-dom-expressions\",\r\n {\r\n moduleName: path.join(__dirname, \"web/src/index\"),\r\n contextToCustomElements: true,\r\n wrapConditionals: true\r\n }\r\n ]\r\n ]\r\n }\r\n }\r\n};\r\n" }, { "path": "packages/solid/bench/bench.cjs", "content": "const { createRoot, createSignal, createComputed } = require(\"../dist/solid.cjs\");\r\n\r\nvar now = typeof process === 'undefined' ? browserNow : nodeNow;\r\n\r\nvar COUNT = 1e5;\r\n\r\nmain();\r\n\r\nfunction main() {\r\n var createTotal = 0;\r\n createTotal += bench(createDataSignals, COUNT, COUNT);\r\n createTotal += bench(createComputations0to1, COUNT, 0);\r\n createTotal += bench(createComputations1to1, COUNT, COUNT);\r\n createTotal += bench(createComputations2to1, COUNT / 2, COUNT);\r\n createTotal += bench(createComputations4to1, COUNT / 4, COUNT);\r\n createTotal += bench(createComputations1000to1, COUNT / 1000, COUNT);\r\n //total += bench1(createComputations8, COUNT, 8 * COUNT);\r\n createTotal += bench(createComputations1to2, COUNT, COUNT / 2);\r\n createTotal += bench(createComputations1to4, COUNT, COUNT / 4);\r\n createTotal += bench(createComputations1to8, COUNT, COUNT / 8);\r\n createTotal += bench(createComputations1to1000, COUNT, COUNT / 1000);\r\n console.log(`create total: ${createTotal.toFixed(0)}`);\r\n console.log('---');\r\n var updateTotal = 0;\r\n updateTotal += bench(updateComputations1to1, COUNT * 4, 1);\r\n updateTotal += bench(updateComputations2to1, COUNT * 2, 2);\r\n updateTotal += bench(updateComputations4to1, COUNT, 4);\r\n updateTotal += bench(updateComputations1000to1, COUNT / 100, 1000);\r\n updateTotal += bench(updateComputations1to2, COUNT * 4, 1);\r\n updateTotal += bench(updateComputations1to4, COUNT * 4, 1);\r\n updateTotal += bench(updateComputations1to1000, COUNT * 4, 1);\r\n console.log(`update total: ${updateTotal.toFixed(0)}`);\r\n console.log(`total: ${(createTotal + updateTotal).toFixed(0)}`);\r\n}\r\n\r\nfunction bench(fn, count, scount) {\r\n var time = run(fn, count, scount);\r\n console.log(`${fn.name}: ${time.toFixed(0)}`);\r\n return time;\r\n}\r\n\r\nfunction run(fn, n, scount) {\r\n // prep n * arity sources\r\n var start,\r\n end;\r\n\r\n createRoot(function () {\r\n // run 3 times to warm up\r\n var sources = createDataSignals(scount, []);\r\n fn(n / 100, sources);\r\n sources = createDataSignals(scount, []);\r\n fn(n / 100, sources);\r\n sources = createDataSignals(scount, []);\r\n % OptimizeFunctionOnNextCall(fn);\r\n fn(n / 100, sources);\r\n sources = createDataSignals(scount, []);\r\n for (var i = 0; i < scount; i++) {\r\n sources[i][0]();\r\n sources[i][0]();\r\n //%OptimizeFunctionOnNextCall(sources[i]);\r\n sources[i][0]();\r\n }\r\n\r\n // start GC clean\r\n % CollectGarbage(null);\r\n\r\n start = now();\r\n\r\n fn(n, sources);\r\n\r\n // end GC clean\r\n sources = null;\r\n % CollectGarbage(null);\r\n\r\n end = now();\r\n });\r\n\r\n return end - start;\r\n}\r\n\r\nfunction createDataSignals(n, sources) {\r\n for (var i = 0; i < n; i++) {\r\n sources[i] = createSignal(i);\r\n }\r\n return sources;\r\n}\r\n\r\nfunction createComputations0to1(n, sources) {\r\n for (var i = 0; i < n; i++) {\r\n createComputation0(i);\r\n }\r\n}\r\n\r\nfunction createComputations1to1000(n, sources) {\r\n for (var i = 0; i < n / 1000; i++) {\r\n const [get] = sources[i];\r\n for (var j = 0; j < 1000; j++) {\r\n createComputation1(get);\r\n }\r\n //sources[i] = null;\r\n }\r\n}\r\n\r\nfunction createComputations1to8(n, sources) {\r\n for (var i = 0; i < n / 8; i++) {\r\n const [get] = sources[i];\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n //sources[i] = null;\r\n }\r\n}\r\n\r\nfunction createComputations1to4(n, sources) {\r\n for (var i = 0; i < n / 4; i++) {\r\n const [get] = sources[i];\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n createComputation1(get);\r\n //sources[i] = null;\r\n }\r\n}\r\n\r\nfunction createComputations1to2(n, sources) {\r\n for (var i = 0; i < n / 2; i++) {\r\n const [get] = sources[i];\r\n createComputation1(get);\r\n createComputation1(get);\r\n //sources[i] = null;\r\n }\r\n}\r\n\r\nfunction createComputations1to1(n, sources) {\r\n for (var i = 0; i < n; i++) {\r\n const [get] = sources[i]\r\n createComputation1(get);\r\n //sources[i] = null;\r\n }\r\n}\r\n\r\nfunction createComputations2to1(n, sources) {\r\n for (var i = 0; i < n; i++) {\r\n createComputation2(\r\n sources[i * 2][0],\r\n sources[i * 2 + 1][0]\r\n );\r\n //sources[i * 2] = null;\r\n //sources[i * 2 + 1] = null;\r\n }\r\n}\r\n\r\nfunction createComputations4to1(n, sources) {\r\n for (var i = 0; i < n; i++) {\r\n createComputation4(\r\n sources[i * 4][0],\r\n sources[i * 4 + 1][0],\r\n sources[i * 4 + 2][0],\r\n sources[i * 4 + 3][0]\r\n );\r\n //sources[i * 4] = null;\r\n //sources[i * 4 + 1] = null;\r\n //sources[i * 4 + 2] = null;\r\n //sources[i * 4 + 3] = null;\r\n }\r\n}\r\n\r\nfunction createComputations8(n, sources) {\r\n for (var i = 0; i < n; i++) {\r\n createComputation8(\r\n sources[i * 8][0],\r\n sources[i * 8 + 1][0],\r\n sources[i * 8 + 2][0],\r\n sources[i * 8 + 3][0],\r\n sources[i * 8 + 4][0],\r\n sources[i * 8 + 5][0],\r\n sources[i * 8 + 6][0],\r\n sources[i * 8 + 7][0]\r\n );\r\n sources[i * 8] = null;\r\n sources[i * 8 + 1] = null;\r\n sources[i * 8 + 2] = null;\r\n sources[i * 8 + 3] = null;\r\n sources[i * 8 + 4] = null;\r\n sources[i * 8 + 5] = null;\r\n sources[i * 8 + 6] = null;\r\n sources[i * 8 + 7] = null;\r\n }\r\n}\r\n\r\n// only create n / 100 computations, as otherwise takes too long\r\nfunction createComputations1000to1(n, sources) {\r\n for (var i = 0; i < n; i++) {\r\n createComputation1000(sources, i * 1000);\r\n }\r\n}\r\n\r\nfunction createComputation0(i) {\r\n createComputed(function () { return i; });\r\n}\r\n\r\nfunction createComputation1(s1) {\r\n createComputed(function () { return s1(); });\r\n}\r\n\r\nfunction createComputation2(s1, s2) {\r\n createComputed(function () { return s1() + s2(); });\r\n}\r\n\r\nfunction createComputation4(s1, s2, s3, s4) {\r\n createComputed(function () { return s1() + s2() + s3() + s4(); });\r\n}\r\n\r\nfunction createComputation8(s1, s2, s3, s4, s5, s6, s7, s8) {\r\n createComputed(function () { return s1() + s2() + s3() + s4() + s5() + s6() + s7() + s8(); });\r\n}\r\n\r\nfunction createComputation1000(ss, offset) {\r\n createComputed(function () {\r\n var sum = 0;\r\n for (var i = 0; i < 1000; i++) {\r\n sum += ss[offset + i][0]();\r\n }\r\n return sum;\r\n });\r\n}\r\n\r\nfunction updateComputations1to1(n, sources) {\r\n var [get1, set1] = sources[0];\r\n createComputed(function () { return get1(); });\r\n for (var i = 0; i < n; i++) {\r\n set1(i);\r\n }\r\n}\r\n\r\nfunction updateComputations2to1(n, sources) {\r\n var [get1, set1] = sources[0],\r\n [get2] = sources[1];\r\n createComputed(function () { return get1() + get2(); });\r\n for (var i = 0; i < n; i++) {\r\n set1(i);\r\n }\r\n}\r\n\r\nfunction updateComputations4to1(n, sources) {\r\n var [get1, set1] = sources[0],\r\n [get2] = sources[1],\r\n [get3] = sources[2],\r\n [get4] = sources[3];\r\n createComputed(function () { return get1() + get2() + get3() + get4(); });\r\n for (var i = 0; i < n; i++) {\r\n set1(i);\r\n }\r\n}\r\n\r\nfunction updateComputations1000to1(n, sources) {\r\n var [get1, set1] = sources[0];\r\n createComputed(function () {\r\n var sum = 0;\r\n for (var i = 0; i < 1000; i++) {\r\n sum += sources[i][0]();\r\n }\r\n return sum;\r\n });\r\n for (var i = 0; i < n; i++) {\r\n set1(i);\r\n }\r\n}\r\n\r\nfunction updateComputations1to2(n, sources) {\r\n var [get1, set1] = sources[0];\r\n createComputed(function () { return get1(); });\r\n createComputed(function () { return get1(); });\r\n for (var i = 0; i < n / 2; i++) {\r\n set1(i);\r\n }\r\n}\r\n\r\nfunction updateComputations1to4(n, sources) {\r\n var [get1, set1] = sources[0];\r\n createComputed(function () { return get1(); });\r\n createComputed(function () { return get1(); });\r\n createComputed(function () { return get1(); });\r\n createComputed(function () { return get1(); });\r\n for (var i = 0; i < n / 4; i++) {\r\n set1(i);\r\n }\r\n}\r\n\r\nfunction updateComputations1to1000(n, sources) {\r\n var [get1, set1] = sources[0];\r\n for (var i = 0; i < 1000; i++) {\r\n createComputed(function () { return get1(); });\r\n }\r\n for (var i = 0; i < n / 1000; i++) {\r\n set1(i);\r\n }\r\n}\r\n\r\nfunction browserNow() {\r\n return performance.now();\r\n}\r\n\r\nfunction nodeNow() {\r\n var hrt = process.hrtime();\r\n return hrt[0] * 1000 + hrt[1] / 1e6;\r\n}\r\n" }, { "path": "packages/solid/bench/libraries/kairo.cjs", "content": "let currentCollecting = null;\nfunction setData(data, value) {\n if (!inTransaction) {\n return runInTransaction(() => setData(data, value));\n }\n if (data.value !== value) {\n data.value = value;\n data.flags |= 1024 /* Changed */;\n dirtyDataQueue.push(data); // TODO: redunant?\n markObserversMaybeStale(data);\n }\n}\nconst dirtyDataQueue = [];\nconst effects = [];\nfunction markObserversMaybeStale(computation) {\n if (computation.flags & 64 /* SingleObserver */) {\n const observer = computation.observer;\n if (observer !== null) {\n if ((observer.flags & 2048) /* Zombie */ === 0) {\n observer.depsReadyBits |= 1 << computation.observerSlot; // maximum 52 dependencies\n }\n if (observer.flags & 8 /* MaybeStale */) {\n return;\n }\n observer.flags |= 8 /* MaybeStale */;\n markObserversMaybeStale(observer);\n }\n } else {\n for (let i = 0; i < computation.observers.length; i++) {\n const observer = computation.observers[i];\n if ((observer.flags & 2048) /* Zombie */ === 0) {\n observer.depsReadyBits |= 1 << computation.observerSlots[i];\n }\n if (observer.flags & 8 /* MaybeStale */) {\n continue;\n }\n observer.flags |= 8 /* MaybeStale */;\n markObserversMaybeStale(observer);\n }\n }\n}\nfunction accessData(data) {\n if (currentCollecting !== null) {\n if (currentCollecting.flags & 256 /* Dynamic */) {\n insertNewSource(currentCollecting, data);\n } else if (currentCollecting.flags & 512 /* MaybeStable */) {\n logUnstable(currentCollecting, data);\n }\n if (data.flags & 2048 /* Zombie */) {\n if ((currentCollecting.flags & 2048) /* Zombie */ === 0) {\n data.flags -= 2048 /* Zombie */; // dezombie naturally\n }\n }\n }\n return data.value;\n}\nfunction accessComputation(data) {\n if (data.flags & 32 /* Computing */) {\n throw new Error(\"Circular dependency\");\n }\n if (currentCollecting !== null) {\n if (currentCollecting.flags & 256 /* Dynamic */) {\n insertNewSource(currentCollecting, data);\n } else if (currentCollecting.flags & 512 /* MaybeStable */) {\n logUnstable(currentCollecting, data);\n }\n if (data.flags & 2048 /* Zombie */) {\n if ((currentCollecting.flags & 2048) /* Zombie */ === 0) {\n data.flags -= 2048 /* Zombie */; // dezombie naturally\n }\n }\n }\n if (data.flags & 8 /* MaybeStale */) {\n updateComputation(data);\n data.flags -= 8 /* MaybeStale */;\n }\n return data.value;\n}\nfunction logUnstable(accessor, data) {\n if (accessor.flags & 128 /* SingleSource */) {\n if (accessor.source !== data) {\n // currentCollecting.source is definitely not null? why?\n // deps changed\n accessor.flags -= 512 /* MaybeStable */;\n accessor.flags |= 256 /* Dynamic */;\n // clean observers from here\n if (accessor.checkIndex === 0) {\n // checkIndex == 0 means this is the first source\n // first source doesn't match?\n cleanupComputationOfSingleSource(accessor);\n // otherwise it changes from single source to multi source.\n }\n insertNewSource(accessor, data); // still need to log.\n } else {\n accessor.checkIndex++;\n }\n } else {\n const checkIndex = accessor.checkIndex;\n if (checkIndex >= accessor.sources.length || data !== accessor.sources[checkIndex]) {\n // deps changed.\n accessor.flags -= 512 /* MaybeStable */;\n accessor.flags |= 256 /* Dynamic */;\n // clean observers from here\n cleanupComputation(accessor, checkIndex);\n insertNewSource(accessor, data);\n } else {\n accessor.checkIndex++;\n }\n }\n}\nfunction collectSourceAndRecomputeComputation(computation) {\n const stored = currentCollecting;\n currentCollecting = computation;\n computation.flags |= 32 /* Computing */;\n const currentValue = computation.collect();\n computation.flags -= 32 /* Computing */;\n if (computation.flags & 512 /* MaybeStable */) {\n // check the real used deps is lesser than assumed.\n if (computation.flags & 128 /* SingleSource */) {\n if (computation.checkIndex === 0 && computation.source !== null) {\n computation.flags -= 512 /* MaybeStable */;\n computation.flags |= 256 /* Dynamic */;\n cleanupComputationOfSingleSource(computation);\n }\n } else if (computation.checkIndex != computation.sources.length) {\n computation.flags -= 512 /* MaybeStable */;\n computation.flags |= 256 /* Dynamic */;\n cleanupComputation(computation, computation.checkIndex);\n }\n currentCollecting.checkIndex = 0;\n }\n currentCollecting = stored;\n return currentValue;\n}\nfunction untrack(fn, ...args) {\n const stored = currentCollecting;\n currentCollecting = null;\n const ret = fn(...args);\n currentCollecting = stored;\n return ret;\n}\nfunction updateComputation(computation) {\n if (computation.flags & 256 /* Dynamic */) {\n cleanupComputation(computation, 0);\n }\n const currentValue = collectSourceAndRecomputeComputation(computation);\n if (computation.flags & 4096 /* NotReady */) {\n computation.flags -= 4096 /* NotReady */ | 256 /* Dynamic */;\n if (computation.flags & 16384 /* Stable */) {\n computation.flags |= 16384 /* Stable */;\n } else {\n computation.flags |= 512 /* MaybeStable */;\n }\n }\n // compare value , if changed, mark as changed\n if (currentValue !== computation.value) {\n computation.value = currentValue;\n computation.flags |= 1024 /* Changed */; // maybe problematic?\n }\n}\nfunction cleanupComputationOfSingleSource(cell) {\n if (cell.source === null) {\n return;\n }\n let theSource = cell.source;\n let observerSlotOfLastSourceOfComputation = cell.sourceSlot;\n cell.source = null;\n cell.sourceSlot = -1;\n if (theSource.flags & 64 /* SingleObserver */ && theSource.observer !== null) {\n theSource.observer = null;\n theSource.observerSlot = -1;\n } else {\n // here observers is definitely not empty:\n let lastObserverOfSource = theSource.observers.pop();\n let sourceSlotOfLastObserverOfSource = theSource.observerSlots.pop(); //我原来在哪儿，要找回去。\n if (observerSlotOfLastSourceOfComputation == theSource.observers.length) {\n // lucky, you are just the last observer\n return;\n }\n // replace you with last observer\n theSource.observers[observerSlotOfLastSourceOfComputation] = lastObserverOfSource;\n theSource.observerSlots[\n observerSlotOfLastSourceOfComputation\n ] = sourceSlotOfLastObserverOfSource;\n // notify the change of position\n if (lastObserverOfSource.flags & 128 /* SingleSource */) {\n lastObserverOfSource.sourceSlot = observerSlotOfLastSourceOfComputation;\n } else {\n lastObserverOfSource.sourceSlots[\n sourceSlotOfLastObserverOfSource\n ] = observerSlotOfLastSourceOfComputation;\n }\n }\n}\nfunction cleanupComputation(cell, remain) {\n if (cell.flags & 128 /* SingleSource */) {\n return cleanupComputationOfSingleSource(cell);\n }\n while (cell.sources.length > remain) {\n let theSource = cell.sources.pop();\n let observerSlotOfLastSourceOfComputation = cell.sourceSlots.pop();\n if (theSource.flags & 64 /* SingleObserver */ && theSource.observer !== null) {\n theSource.observer = null;\n theSource.observerSlot = -1;\n } else {\n let lastObserverOfSource = theSource.observers.pop();\n let sourceSlotOfLastObserverOfSource = theSource.observerSlots.pop();\n if (observerSlotOfLastSourceOfComputation == theSource.observers.length) {\n continue;\n }\n theSource.observers[observerSlotOfLastSourceOfComputation] = lastObserverOfSource;\n theSource.observerSlots[\n observerSlotOfLastSourceOfComputation\n ] = sourceSlotOfLastObserverOfSource;\n if (lastObserverOfSource.flags & 128 /* SingleSource */) {\n lastObserverOfSource.sourceSlot = observerSlotOfLastSourceOfComputation;\n } else {\n lastObserverOfSource.sourceSlots[\n sourceSlotOfLastObserverOfSource\n ] = observerSlotOfLastSourceOfComputation;\n }\n }\n }\n}\nfunction propagate(computation) {\n let notZombie = false;\n // if maybe stale\n if (computation.flags & 8 /* MaybeStale */) {\n if (computation.depsReadyBits !== 0) {\n throw \"this should never happen.\";\n }\n if (computation.flags & 4 /* Stale */) {\n updateComputation(computation);\n computation.flags -= 4 /* Stale */;\n }\n computation.flags -= 8 /* MaybeStale */;\n // now it is definitely not stale!\n }\n // if changed\n if (computation.flags & 1024 /* Changed */) {\n let hasObserver = false;\n if (computation.flags & 64 /* SingleObserver */) {\n const observer = computation.observer;\n if (observer !== null) {\n if ((observer.flags & 2048) /* Zombie */ === 0) {\n observer.flags |= 4 /* Stale */;\n observer.depsReadyBits -= 1 << computation.observerSlot;\n if (observer.depsReadyBits === 0 && propagate(observer)) {\n notZombie = true;\n }\n hasObserver = true;\n }\n }\n } else {\n for (let i = 0; i < computation.observers.length; ) {\n let current = computation.observers[i];\n if (current.flags & 2048 /* Zombie */) {\n i++;\n continue;\n }\n if ((current.flags & 8) /* MaybeStale */ === 0) {\n i++;\n hasObserver = true; // ???\n continue;\n }\n current.flags |= 4 /* Stale */;\n current.depsReadyBits -= 1 << computation.observerSlots[i];\n if (current.depsReadyBits === 0 && propagate(current)) {\n notZombie = true;\n }\n if (current === computation.observers[i]) {\n i++;\n }\n hasObserver = true;\n }\n }\n // now remove changed mark.\n computation.flags -= 1024 /* Changed */;\n if (computation.last_effect) {\n let wnode = computation.last_effect;\n while (wnode !== null) {\n effects.push(wnode.fn);\n wnode = wnode.prev;\n }\n } else if (!hasObserver) {\n computation.flags |= 2048 /* Zombie */;\n }\n } else {\n if (computation.flags & 64 /* SingleObserver */) {\n if (computation.observer !== null) {\n // TODO: make inline cache?\n if (!((computation.observer.flags & 2048) /* Zombie */)) {\n computation.observer.depsReadyBits -= 1 << computation.observerSlot;\n if (computation.observer.depsReadyBits === 0 && propagate(computation.observer)) {\n notZombie = true;\n }\n }\n }\n } else {\n for (let i = 0; i < computation.observers.length; i++) {\n let current = computation.observers[i];\n if (current.flags & 2048 /* Zombie */) {\n continue;\n }\n current.depsReadyBits -= 1 << computation.observerSlots[i];\n if (current.depsReadyBits === 0 && propagate(current)) {\n notZombie = true;\n }\n }\n }\n }\n return notZombie;\n}\nfunction watch(data, sideEffect) {\n if (data.flags & 2048 /* Zombie */) {\n data.flags -= 2048 /* Zombie */;\n }\n if (data.flags & 1 /* Data */) {\n accessData(data); // TODO: is it necessary?\n } else {\n accessComputation(data); // because it maybe stale?\n }\n const node = {\n fn: sideEffect,\n prev: data.last_effect,\n next: null,\n disposed: false,\n data: data\n };\n if (data.last_effect) {\n data.last_effect.next = node;\n }\n data.last_effect = node;\n return node;\n}\nfunction disposeWatcher(watcher) {\n if (watcher.disposed) {\n return;\n }\n watcher.disposed = true;\n if (watcher.next === null) {\n // it is the last.\n watcher.data.last_effect = watcher.prev;\n } else {\n watcher.next.prev = watcher.prev;\n }\n if (watcher.prev) {\n watcher.prev.next = watcher.next;\n }\n}\nlet inTransaction = false;\nfunction runInTransaction(fn) {\n if (inTransaction) {\n // already inside a transaction\n return fn();\n }\n inTransaction = true;\n const retValue = fn();\n inTransaction = false;\n while (dirtyDataQueue.length) {\n const data = dirtyDataQueue.pop();\n propagate(data);\n }\n while (effects.length) {\n effects.pop()();\n }\n return retValue;\n}\nfunction insertNewSource(accessing, source) {\n if (accessing.flags & 128 /* SingleSource */) {\n if (accessing.source === null) {\n accessing.source = source;\n accessing.sourceSlot = insertNewObserver(source, accessing, -1);\n } else {\n accessing.flags -= 128 /* SingleSource */;\n // notify relocation\n if (accessing.source.flags & 64 /* SingleObserver */) {\n accessing.source.observerSlot = 0;\n } else {\n accessing.source.observerSlots[accessing.sourceSlot] = 0;\n }\n accessing.sources = [accessing.source];\n accessing.sourceSlots = [accessing.sourceSlot];\n accessing.source = null;\n accessing.sourceSlot = -1;\n return insertNewSource(accessing, source);\n }\n } else {\n accessing.sources.push(source);\n accessing.sourceSlots.push(insertNewObserver(source, accessing, accessing.sourceSlots.length));\n }\n}\nfunction insertNewObserver(accesed, observer, atWhichSlotOfObserver) {\n if (accesed.flags & 64 /* SingleObserver */) {\n if (accesed.observer === null) {\n accesed.observer = observer;\n accesed.observerSlot = atWhichSlotOfObserver;\n return -1;\n } else {\n accesed.flags -= 64 /* SingleObserver */;\n if (accesed.observer.flags & 128 /* SingleSource */) {\n accesed.observer.sourceSlot = 0;\n } else {\n accesed.observer.sourceSlots[accesed.observerSlot] = 0;\n }\n accesed.observers = [accesed.observer];\n accesed.observerSlots = [accesed.observerSlot];\n accesed.observer = null;\n accesed.observerSlot = -1;\n return insertNewObserver(accesed, observer, atWhichSlotOfObserver);\n }\n } else {\n accesed.observers.push(observer);\n accesed.observerSlots.push(atWhichSlotOfObserver);\n return accesed.observerSlots.length - 1;\n }\n}\nfunction createData(value) {\n return {\n flags: 1 /* Data */ | 64 /* SingleObserver */ | 2048 /* Zombie */,\n last_effect: null,\n observer: null,\n observerSlot: -1,\n observers: null,\n observerSlots: null,\n value\n };\n}\nfunction createComputation(fn, options) {\n const ret = {\n flags:\n 2 /* Computation */ |\n 128 /* SingleSource */ |\n 64 /* SingleObserver */ |\n 2048 /* Zombie */ |\n 8 /* MaybeStale */ |\n 256 /* Dynamic */ |\n 4096 /* NotReady */,\n last_effect: null,\n observer: null,\n observerSlot: -1,\n observers: null,\n observerSlots: null,\n value: null,\n source: null,\n sourceSlot: -1,\n sources: null,\n sourceSlots: null,\n collect: fn,\n depsReadyBits: 0,\n checkIndex: 0\n };\n // ret.value = collectSourceAndRecomputeComputation(ret);\n if (options === null || options === void 0 ? void 0 : options.static) {\n // if source is ready: give it ready.\n ret.flags |= 16384 /* Stable */;\n }\n return ret;\n}\n\nmodule.exports = {\n createRoot: fn => fn(),\n createSignal: value => {\n const node = createData(value);\n return [() => accessData(node), v => setData(node, v)];\n },\n createComputed: fn => {\n const g = createComputation(fn);\n watch(g, () => {});\n }\n};\n" }, { "path": "packages/solid/bench/libraries/preact.cjs", "content": "// preact signals 1.1.0 (c) 2018 Jason Miller\n// https://github.com/preactjs/signals\n\nfunction cycleDetected() {\n\tthrow new Error(\"Cycle detected\");\n}\n\n// Flags for Computed and Effect.\nconst RUNNING = 1 << 0;\nconst NOTIFIED = 1 << 1;\nconst OUTDATED = 1 << 2;\nconst DISPOSED = 1 << 3;\nconst HAS_ERROR = 1 << 4;\nconst TRACKING = 1 << 5;\n\n// Flags for Nodes.\nconst NODE_FREE = 1 << 0;\nconst NODE_SUBSCRIBED = 1 << 1;\n\nfunction startBatch() {\n\tbatchDepth++;\n}\n\nfunction endBatch() {\n\tif (batchDepth > 1) {\n\t\tbatchDepth--;\n\t\treturn;\n\t}\n\n\tlet error;\n\tlet hasError = false;\n\n\twhile (batchedEffect !== undefined) {\n\t\tlet effect = batchedEffect;\n\t\tbatchedEffect = undefined;\n\n\t\tbatchIteration++;\n\n\t\twhile (effect !== undefined) {\n\t\t\tconst next = effect._nextBatchedEffect;\n\t\t\teffect._nextBatchedEffect = undefined;\n\t\t\teffect._flags &= ~NOTIFIED;\n\n\t\t\tif (!(effect._flags & DISPOSED) && effect._flags & OUTDATED) {\n\t\t\t\ttry {\n\t\t\t\t\teffect._callback();\n\t\t\t\t} catch (err) {\n\t\t\t\t\tif (!hasError) {\n\t\t\t\t\t\terror = err;\n\t\t\t\t\t\thasError = true;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\teffect = next;\n\t\t}\n\t}\n\tbatchIteration = 0;\n\tbatchDepth--;\n\n\tif (hasError) {\n\t\tthrow error;\n\t}\n}\n\nfunction batch(callback) {\n\tif (batchDepth > 0) {\n\t\treturn callback();\n\t}\n\t/*@__INLINE__**/ startBatch();\n\ttry {\n\t\treturn callback();\n\t} finally {\n\t\tendBatch();\n\t}\n}\n\n// Currently evaluated computed or effect.\nlet evalContext = undefined;\n\n// Effects collected into a batch.\nlet batchedEffect = undefined;\nlet batchDepth = 0;\nlet batchIteration = 0;\n\n// A global version number for signals, used for fast-pathing repeated\n// computed.peek()/computed.value calls when nothing has changed globally.\nlet globalVersion = 0;\n\nfunction addDependency(signal) {\n\tif (evalContext === undefined) {\n\t\treturn undefined;\n\t}\n\n\tlet node = signal._node;\n\tif (node === undefined || node._target !== evalContext) {\n\t\t// `signal` is a new dependency. Create a new node dependency node, move it\n\t\t// to the front of the current context's dependency list.\n\t\tnode = {\n\t\t\t_flags: 0,\n\t\t\t_version: 0,\n\t\t\t_source: signal,\n\t\t\t_prevSource: undefined,\n\t\t\t_nextSource: evalContext._sources,\n\t\t\t_target: evalContext,\n\t\t\t_prevTarget: undefined,\n\t\t\t_nextTarget: undefined,\n\t\t\t_rollbackNode: node,\n\t\t};\n\t\tevalContext._sources = node;\n\t\tsignal._node = node;\n\n\t\t// Subscribe to change notifications from this dependency if we're in an effect\n\t\t// OR evaluating a computed signal that in turn has subscribers.\n\t\tif (evalContext._flags & TRACKING) {\n\t\t\tsignal._subscribe(node);\n\t\t}\n\t\treturn node;\n\t} else if (node._flags & NODE_FREE) {\n\t\t// `signal` is an existing dependency from a previous evaluation. Reuse the dependency\n\t\t// node and move it to the front of the evaluation context's dependency list.\n\t\tnode._flags &= ~NODE_FREE;\n\n\t\tconst head = evalContext._sources;\n\t\tif (node !== head) {\n\t\t\tconst prev = node._prevSource;\n\t\t\tconst next = node._nextSource;\n\t\t\tif (prev !== undefined) {\n\t\t\t\tprev._nextSource = next;\n\t\t\t}\n\t\t\tif (next !== undefined) {\n\t\t\t\tnext._prevSource = prev;\n\t\t\t}\n\t\t\tif (head !== undefined) {\n\t\t\t\thead._prevSource = node;\n\t\t\t}\n\t\t\tnode._prevSource = undefined;\n\t\t\tnode._nextSource = head;\n\t\t\tevalContext._sources = node;\n\t\t}\n\n\t\t// We can assume that the currently evaluated effect / computed signal is already\n\t\t// subscribed to change notifications from `signal` if needed.\n\t\treturn node;\n\t}\n\treturn undefined;\n}\n\n/** @internal */\nfunction Signal(value) {\n\tthis._value = value;\n\tthis._version = 0;\n\tthis._node = undefined;\n\tthis._targets = undefined;\n}\n\nSignal.prototype._refresh = function () {\n\treturn true;\n};\n\nSignal.prototype._subscribe = function (node) {\n\tif (!(node._flags & NODE_SUBSCRIBED)) {\n\t\tnode._flags |= NODE_SUBSCRIBED;\n\t\tnode._nextTarget = this._targets;\n\n\t\tif (this._targets !== undefined) {\n\t\t\tthis._targets._prevTarget = node;\n\t\t}\n\t\tthis._targets = node;\n\t}\n};\n\nSignal.prototype._unsubscribe = function (node) {\n\tif (node._flags & NODE_SUBSCRIBED) {\n\t\tnode._flags &= ~NODE_SUBSCRIBED;\n\n\t\tconst prev = node._prevTarget;\n\t\tconst next = node._nextTarget;\n\t\tif (prev !== undefined) {\n\t\t\tprev._nextTarget = next;\n\t\t\tnode._prevTarget = undefined;\n\t\t}\n\t\tif (next !== undefined) {\n\t\t\tnext._prevTarget = prev;\n\t\t\tnode._nextTarget = undefined;\n\t\t}\n\t\tif (node === this._targets) {\n\t\t\tthis._targets = next;\n\t\t}\n\t}\n};\n\nSignal.prototype.subscribe = function (fn) {\n\tconst signal = this;\n\treturn effect(function () {\n\t\tconst value = signal.value;\n\t\tconst flag = this._flags & TRACKING;\n\t\tthis._flags &= ~TRACKING;\n\t\ttry {\n\t\t\tfn(value);\n\t\t} finally {\n\t\t\tthis._flags |= flag;\n\t\t}\n\t});\n};\n\nSignal.prototype.valueOf = function () {\n\treturn this.value;\n};\n\nSignal.prototype.toString = function () {\n\treturn this.value + \"\";\n};\n\nSignal.prototype.peek = function () {\n\treturn this._value;\n};\n\nObject.defineProperty(Signal.prototype, \"value\", {\n\tget() {\n\t\tconst node = addDependency(this);\n\t\tif (node !== undefined) {\n\t\t\tnode._version = this._version;\n\t\t}\n\t\treturn this._value;\n\t},\n\tset(value) {\n\t\tif (value !== this._value) {\n\t\t\tif (batchIteration > 100) {\n\t\t\t\tcycleDetected();\n\t\t\t}\n\n\t\t\tthis._value = value;\n\t\t\tthis._version++;\n\t\t\tglobalVersion++;\n\n\t\t\t/**@__INLINE__*/ startBatch();\n\t\t\ttry {\n\t\t\t\tfor (\n\t\t\t\t\tlet node = this._targets;\n\t\t\t\t\tnode !== undefined;\n\t\t\t\t\tnode = node._nextTarget\n\t\t\t\t) {\n\t\t\t\t\tnode._target._notify();\n\t\t\t\t}\n\t\t\t} finally {\n\t\t\t\tendBatch();\n\t\t\t}\n\t\t}\n\t},\n});\n\nfunction signal(value) {\n\treturn new Signal(value);\n}\n\nfunction prepareSources(target) {\n\tfor (\n\t\tlet node = target._sources;\n\t\tnode !== undefined;\n\t\tnode = node._nextSource\n\t) {\n\t\tconst rollbackNode = node._source._node;\n\t\tif (rollbackNode !== undefined) {\n\t\t\tnode._rollbackNode = rollbackNode;\n\t\t}\n\t\tnode._source._node = node;\n\t\tnode._flags |= NODE_FREE;\n\t}\n}\n\nfunction cleanupSources(target) {\n\t// At this point target._sources is a mishmash of current & former dependencies.\n\t// The current dependencies are also in a reverse order of use.\n\t// Therefore build a new, reverted list of dependencies containing only the current\n\t// dependencies in a proper order of use.\n\t// Drop former dependencies from the list and unsubscribe from their change notifications.\n\n\tlet node = target._sources;\n\tlet sources = undefined;\n\twhile (node !== undefined) {\n\t\tconst next = node._nextSource;\n\t\tif (node._flags & NODE_FREE) {\n\t\t\tnode._source._unsubscribe(node);\n\t\t\tnode._nextSource = undefined;\n\t\t} else {\n\t\t\tif (sources !== undefined) {\n\t\t\t\tsources._prevSource = node;\n\t\t\t}\n\t\t\tnode._prevSource = undefined;\n\t\t\tnode._nextSource = sources;\n\t\t\tsources = node;\n\t\t}\n\n\t\tnode._source._node = node._rollbackNode;\n\t\tif (node._rollbackNode !== undefined) {\n\t\t\tnode._rollbackNode = undefined;\n\t\t}\n\t\tnode = next;\n\t}\n\ttarget._sources = sources;\n}\n\n\nfunction Computed(compute) {\n\tSignal.call(this, undefined);\n\n\tthis._compute = compute;\n\tthis._sources = undefined;\n\tthis._globalVersion = globalVersion - 1;\n\tthis._flags = OUTDATED;\n}\n\nComputed.prototype = new Signal();\n\nComputed.prototype._refresh = function () {\n\tthis._flags &= ~NOTIFIED;\n\n\tif (this._flags & RUNNING) {\n\t\treturn false;\n\t}\n\n\t// If this computed signal has subscribed to updates from its dependencies\n\t// (TRACKING flag set) and none of them have notified about changes (OUTDATED\n\t// flag not set), then the computed value can't have changed.\n\tif ((this._flags & (OUTDATED | TRACKING)) === TRACKING) {\n\t\treturn true;\n\t}\n\tthis._flags &= ~OUTDATED;\n\n\tif (this._globalVersion === globalVersion) {\n\t\treturn true;\n\t}\n\tthis._globalVersion = globalVersion;\n\n\t// Mark this computed signal running before checking the dependencies for value\n\t// changes, so that the RUNNIN flag can be used to notice cyclical dependencies.\n\tthis._flags |= RUNNING;\n\tif (this._version > 0) {\n\t\t// Check the dependencies for changed values. The dependency list is already\n\t\t// in order of use. Therefore if multiple dependencies have changed values, only\n\t\t// the first used dependency is re-evaluated at this point.\n\t\tlet node = this._sources;\n\t\twhile (node !== undefined) {\n\t\t\t// If a dependency has something blocking it from refreshing (e.g. a dependency\n\t\t\t// cycle) or there's a new version of the dependency, then we need to recompute.\n\t\t\tif (!node._source._refresh() || node._source._version !== node._version) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tnode = node._nextSource;\n\t\t}\n\t\t// If none of the dependencies have changed values since last recompute then the\n\t\t// computed value can't have changed.\n\t\tif (node === undefined) {\n\t\t\tthis._flags &= ~RUNNING;\n\t\t\treturn true;\n\t\t}\n\t}\n\n\tconst prevContext = evalContext;\n\ttry {\n\t\tprepareSources(this);\n\t\tevalContext = this;\n\t\tconst value = this._compute();\n\t\tif (\n\t\t\tthis._flags & HAS_ERROR ||\n\t\t\tthis._value !== value ||\n\t\t\tthis._version === 0\n\t\t) {\n\t\t\tthis._value = value;\n\t\t\tthis._flags &= ~HAS_ERROR;\n\t\t\tthis._version++;\n\t\t}\n\t} catch (err) {\n\t\tthis._value = err;\n\t\tthis._flags |= HAS_ERROR;\n\t\tthis._version++;\n\t}\n\tevalContext = prevContext;\n\tcleanupSources(this);\n\tthis._flags &= ~RUNNING;\n\treturn true;\n};\n\nComputed.prototype._subscribe = function (node) {\n\tif (this._targets === undefined) {\n\t\tthis._flags |= OUTDATED | TRACKING;\n\n\t\t// A computed signal subscribes lazily to its dependencies when the it\n\t\t// gets its first subscriber.\n\t\tfor (\n\t\t\tlet node = this._sources;\n\t\t\tnode !== undefined;\n\t\t\tnode = node._nextSource\n\t\t) {\n\t\t\tnode._source._subscribe(node);\n\t\t}\n\t}\n\tSignal.prototype._subscribe.call(this, node);\n};\n\nComputed.prototype._unsubscribe = function (node) {\n\tSignal.prototype._unsubscribe.call(this, node);\n\n\t// Computed signal unsubscribes from its dependencies from it loses its last subscriber.\n\tif (this._targets === undefined) {\n\t\tthis._flags &= ~TRACKING;\n\n\t\tfor (\n\t\t\tlet node = this._sources;\n\t\t\tnode !== undefined;\n\t\t\tnode = node._nextSource\n\t\t) {\n\t\t\tnode._source._unsubscribe(node);\n\t\t}\n\t}\n};\n\nComputed.prototype._notify = function () {\n\tif (!(this._flags & NOTIFIED)) {\n\t\tthis._flags |= OUTDATED | NOTIFIED;\n\n\t\tfor (\n\t\t\tlet node = this._targets;\n\t\t\tnode !== undefined;\n\t\t\tnode = node._nextTarget\n\t\t) {\n\t\t\tnode._target._notify();\n\t\t}\n\t}\n};\n\nComputed.prototype.peek = function () {\n\tif (!this._refresh()) {\n\t\tcycleDetected();\n\t}\n\tif (this._flags & HAS_ERROR) {\n\t\tthrow this._value;\n\t}\n\treturn this._value;\n};\n\nObject.defineProperty(Computed.prototype, \"value\", {\n\tget() {\n\t\tif (this._flags & RUNNING) {\n\t\t\tcycleDetected();\n\t\t}\n\t\tconst node = addDependency(this);\n\t\tthis._refresh();\n\t\tif (node !== undefined) {\n\t\t\tnode._version = this._version;\n\t\t}\n\t\tif (this._flags & HAS_ERROR) {\n\t\t\tthrow this._value;\n\t\t}\n\t\treturn this._value;\n\t},\n});\n\nfunction computed(compute) {\n\treturn new Computed(compute);\n}\n\nfunction cleanupEffect(effect) {\n\tconst cleanup = effect._cleanup;\n\teffect._cleanup = undefined;\n\n\tif (typeof cleanup === \"function\") {\n\t\t/*@__INLINE__**/ startBatch();\n\n\t\t// Run cleanup functions always outside of any context.\n\t\tconst prevContext = evalContext;\n\t\tevalContext = undefined;\n\t\ttry {\n\t\t\tcleanup();\n\t\t} catch (err) {\n\t\t\teffect._flags &= ~RUNNING;\n\t\t\tthrow err;\n\t\t} finally {\n\t\t\tevalContext = prevContext;\n\t\t\tendBatch();\n\t\t}\n\t}\n}\n\nfunction disposeEffect(effect) {\n\tfor (\n\t\tlet node = effect._sources;\n\t\tnode !== undefined;\n\t\tnode = node._nextSource\n\t) {\n\t\tnode._source._unsubscribe(node);\n\t}\n\teffect._sources = undefined;\n\n\tcleanupEffect(effect);\n}\n\nfunction endEffect(prevContext) {\n\tif (evalContext !== this) {\n\t\tthrow new Error(\"Out-of-order effect\");\n\t}\n\tcleanupSources(this);\n\tevalContext = prevContext;\n\n\tthis._flags &= ~RUNNING;\n\tif (this._flags & DISPOSED) {\n\t\tdisposeEffect(this);\n\t}\n\tendBatch();\n}\n\nfunction Effect(compute) {\n\tthis._compute = compute;\n\tthis._cleanup = undefined;\n\tthis._sources = undefined;\n\tthis._nextBatchedEffect = undefined;\n\tthis._flags = OUTDATED | TRACKING;\n}\n\nEffect.prototype._callback = function () {\n\tconst finish = this._start();\n\ttry {\n\t\tif (!(this._flags & DISPOSED)) {\n\t\t\tthis._cleanup = this._compute();\n\t\t}\n\t} finally {\n\t\tfinish();\n\t}\n};\n\nEffect.prototype._start = function () {\n\tif (this._flags & RUNNING) {\n\t\tcycleDetected();\n\t}\n\tthis._flags |= RUNNING;\n\tthis._flags &= ~DISPOSED;\n\tprepareSources(this);\n\tcleanupEffect(this);\n\n\t/*@__INLINE__**/ startBatch();\n\tthis._flags &= ~OUTDATED;\n\tconst prevContext = evalContext;\n\tevalContext = this;\n\treturn endEffect.bind(this, prevContext);\n};\n\nEffect.prototype._notify = function () {\n\tif (!(this._flags & NOTIFIED)) {\n\t\tthis._flags |= NOTIFIED | OUTDATED;\n\t\tthis._nextBatchedEffect = batchedEffect;\n\t\tbatchedEffect = this;\n\t}\n};\n\nEffect.prototype._dispose = function () {\n\tthis._flags |= DISPOSED;\n\n\tif (!(this._flags & RUNNING)) {\n\t\tdisposeEffect(this);\n\t}\n};\n\nfunction effect(compute) {\n\tconst effect = new Effect(compute);\n\teffect._callback();\n\t// Return a bound function instead of a wrapper like `() => effect._dispose()`,\n\t// because bound functions seem to be just as fast and take up a lot less memory.\n\treturn effect._dispose.bind(effect);\n}\n\nfunction createRoot(fn) { return fn(); }\nfunction createSignal(value) {\n const r = new Signal(value);\n return [() => r.value, v => r.value = v];\n}\n\nmodule.exports = {\n createSignal,\n createRoot,\n createComputed: effect\n};" }, { "path": "packages/solid/bench/libraries/rval-mod.cjs", "content": "const NOT_TRACKING = 0;\r\nconst STALE = 1;\r\nconst UP_TO_DATE = 2;\r\n\r\nconst context = {\r\n isUpdating: false,\r\n pending: [],\r\n currentlyComputingStack: [],\r\n get currentlyComputing() {\r\n return this.currentlyComputingStack[this.currentlyComputingStack.length - 1];\r\n },\r\n isRunningReactions: false,\r\n runPendingObservers\r\n};\r\n\r\nfunction batch(fn) {\r\n if (context.isUpdating) return fn();\r\n try {\r\n context.isUpdating = true;\r\n return fn();\r\n } finally {\r\n context.isUpdating = false;\r\n runPendingObservers();\r\n }\r\n}\r\nfunction runPendingObservers() {\r\n if (!context.isUpdating && !context.isRunningReactions) {\r\n context.isRunningReactions = true;\r\n while (context.pending.length) {\r\n // N.B. errors here cause other pending subscriptions to be aborted!\r\n const fns = context.pending.splice(0);\r\n for (let i = 0, len = fns.length; i < len; i += 1) fns[i]();\r\n }\r\n context.isRunningReactions = false;\r\n }\r\n}\r\n\r\nclass Signal {\r\n constructor(state) {\r\n this.listeners = new Set();\r\n this.value = state;\r\n }\r\n addListener(listener) {\r\n this.listeners.add(listener);\r\n }\r\n removeListener(listener) {\r\n this.listeners.delete(listener);\r\n }\r\n get() {\r\n return registerRead(this);\r\n }\r\n set(newValue) {\r\n if (newValue !== this.value) {\r\n this.value = newValue;\r\n batch(() => runAll(this.listeners));\r\n }\r\n }\r\n}\r\nclass Computed {\r\n constructor(derivation) {\r\n this.derivation = derivation;\r\n this.listeners = new Set();\r\n this.inputValues = undefined;\r\n this.observing = new Set();\r\n this.state = NOT_TRACKING;\r\n this.dirtyCount = 0;\r\n this.value = undefined;\r\n this.markDirty = () => {\r\n if (++this.dirtyCount === 1) {\r\n this.state = STALE;\r\n runAll(this.listeners);\r\n }\r\n };\r\n }\r\n addListener(observer) {\r\n this.listeners.add(observer);\r\n }\r\n removeListener(observer) {\r\n this.listeners.delete(observer)\r\n }\r\n registerDependency(sub) {\r\n this.observing.add(sub);\r\n }\r\n someDependencyHasChanged() {\r\n switch (this.state) {\r\n case NOT_TRACKING:\r\n return true;\r\n case UP_TO_DATE:\r\n return false;\r\n case STALE:\r\n if (!inputSetHasChanged(this.observing, this.inputValues)) {\r\n this.dirtyCount = 0;\r\n this.state = UP_TO_DATE;\r\n return false;\r\n }\r\n }\r\n return true;\r\n }\r\n track() {\r\n if (!this.someDependencyHasChanged()) return;\r\n const oldObserving = this.observing;\r\n const [newValue, newObserving] = track(this.derivation);\r\n this.value = newValue;\r\n this.observing = newObserving;\r\n registerDependencies(this.markDirty, oldObserving, newObserving);\r\n this.inputValues = recordInputSet(newObserving);\r\n this.dirtyCount = 0;\r\n this.state = UP_TO_DATE;\r\n }\r\n get() {\r\n registerRead(this);\r\n // yay, we are up to date!\r\n if (this.state === UP_TO_DATE) return this.value;\r\n // nope, we are not, and no one is observing either\r\n if (!context.currentlyComputing && !this.listeners.size) {\r\n // This won't actively remove any listener, but will transition the drv to\r\n // untracked, if no other listener arrived\r\n // TODO: optimize: have one handler for this!\r\n // TODO: should there be an option to disable this optimization to prevent mem leaking?\r\n setTimeout(() => this.removeListener(null), 0);\r\n }\r\n // maybe scheduled, definitely tracking, value is needed, track now!\r\n this.track();\r\n return this.value;\r\n }\r\n}\r\nfunction track(fn) {\r\n const observing = new Set();\r\n context.currentlyComputingStack.push(observing);\r\n const res = fn();\r\n context.currentlyComputingStack.pop();\r\n return [res, observing];\r\n}\r\nfunction registerDependencies(listener, oldDeps, newDeps) {\r\n // Optimize:\r\n if (!oldDeps) {\r\n for (const d of newDeps.values()) d.addListener(listener);\r\n } else {\r\n for (const o of newDeps.values()) {\r\n if (!oldDeps.has(o)) o.addListener(listener);\r\n }\r\n for (const o of oldDeps) {\r\n if (!newDeps.has(o)) o.removeListener(listener);\r\n }\r\n }\r\n}\r\nfunction registerRead(observable) {\r\n if (context.currentlyComputing) context.currentlyComputing.add(observable);\r\n return observable.value;\r\n}\r\nfunction recordInputSet(deps) {\r\n // optimize: write more efficiently\r\n return [...deps].map(currentValue);\r\n}\r\nfunction inputSetHasChanged(deps, inputs) {\r\n return !deps || !inputs || ![...deps.values()].every((o, idx) => o.get() === inputs[idx]);\r\n}\r\nfunction currentValue(dep) {\r\n // Returns the current, last known (computed) value of a dep\r\n // Regardless whether that is stale or not\r\n return dep.value;\r\n}\r\nfunction runAll(fns) {\r\n for (const fn of fns.values()) fn();\r\n}\r\n\r\nfunction createSignal(value) {\r\n const v = new Signal(value);\r\n return [v.get.bind(v), v.set.bind(v)];\r\n}\r\n\r\nfunction createMemo(derivation) {\r\n const c = new Computed(derivation);\r\n return c.get.bind(c);\r\n}\r\n\r\nfunction createRoot(fn) {\r\n fn();\r\n}\r\n\r\nfunction createEffect(fn) {\r\n const computed = new Computed(fn);\r\n let scheduled = true;\r\n let disposed = false;\r\n function onDirty() {\r\n if (scheduled || disposed) return;\r\n scheduled = true;\r\n context.pending.push(onInvalidate);\r\n }\r\n function onInvalidate() {\r\n scheduled = false;\r\n computed.someDependencyHasChanged() && computed.get();\r\n }\r\n computed.addListener(onDirty);\r\n onInvalidate();\r\n}\r\n\r\nmodule.exports = {\r\n createSignal,\r\n createRoot,\r\n createComputed: createEffect,\r\n createMemo,\r\n batch\r\n};\r\n" }, { "path": "packages/solid/bench/libraries/s-mod.cjs", "content": "// Modified version of S.js[https://github.com/adamhaile/S] by Adam Haile\r\n// Comparator memos from VSJolund fork https://github.com/VSjolund/vs-bind\r\nconst equalFn = (a, b) => a === b;\r\nconst ERROR = Symbol(\"error\");\r\n// Public interface\r\nfunction createRoot(fn, detachedOwner) {\r\n detachedOwner && (Owner = detachedOwner);\r\n let owner = Owner,\r\n listener = Listener,\r\n root = fn.length === 0 ? UNOWNED : createComputationNode(null, null),\r\n result = undefined,\r\n disposer = function _dispose() {\r\n if (RunningClock !== null) {\r\n RootClock.disposes.add(root);\r\n } else {\r\n dispose(root);\r\n }\r\n };\r\n Owner = root;\r\n Listener = null;\r\n try {\r\n result = fn(disposer);\r\n } catch (err) {\r\n const fns = lookup(Owner, ERROR);\r\n if (!fns) throw err;\r\n fns.forEach(f => f(err));\r\n } finally {\r\n RootClock.afters.run(f => f());\r\n Listener = listener;\r\n Owner = owner;\r\n }\r\n return result;\r\n}\r\nfunction createSignal(value, areEqual) {\r\n const d = new DataNode(value);\r\n let setter;\r\n if (areEqual) {\r\n let age = -1;\r\n setter = v => {\r\n if (!areEqual(v, value)) {\r\n const time = RootClock.time;\r\n if (time === age) {\r\n throw new Error(`Conflicting value update: ${v} is not the same as ${value}`);\r\n }\r\n age = time;\r\n value = v;\r\n d.next(v);\r\n }\r\n };\r\n } else setter = d.next.bind(d);\r\n return [d.current.bind(d), setter];\r\n}\r\nfunction createEffect(fn, value) {\r\n createComputationNode(fn, value);\r\n}\r\nfunction createDependentEffect(fn, deps, defer) {\r\n const resolved = Array.isArray(deps) ? callAll(deps) : deps;\r\n defer = !!defer;\r\n createComputationNode(value => {\r\n const listener = Listener;\r\n resolved();\r\n if (defer) defer = false;\r\n else {\r\n Listener = null;\r\n value = fn(value);\r\n Listener = listener;\r\n }\r\n return value;\r\n });\r\n}\r\nfunction createMemo(fn, value, areEqual) {\r\n var node = createComputationNode(fn, value);\r\n node.comparator = areEqual || null;\r\n return () => {\r\n if (Listener !== null) {\r\n const state = node.state;\r\n if ((state & 7) !== 0) {\r\n liftComputation(node);\r\n }\r\n if (node.age === RootClock.time && state === 8) {\r\n throw new Error(\"Circular dependency.\");\r\n }\r\n if ((state & 16) === 0) {\r\n if (node.log === null) node.log = createLog();\r\n logRead(node.log);\r\n }\r\n }\r\n return node.value;\r\n };\r\n}\r\nfunction batch(fn) {\r\n let result = undefined;\r\n if (RunningClock !== null) result = fn();\r\n else {\r\n RunningClock = RootClock;\r\n RunningClock.changes.reset();\r\n try {\r\n result = fn();\r\n event();\r\n } finally {\r\n RunningClock = null;\r\n }\r\n }\r\n return result;\r\n}\r\nfunction sample(fn) {\r\n let result,\r\n listener = Listener;\r\n Listener = null;\r\n result = fn();\r\n Listener = listener;\r\n return result;\r\n}\r\nfunction afterEffects(fn) {\r\n if (RunningClock !== null) RunningClock.afters.add(fn);\r\n else RootClock.afters.add(fn);\r\n}\r\nfunction onCleanup(fn) {\r\n if (Owner === null)\r\n console.warn(\"cleanups created outside a `createRoot` or `render` will never be run\");\r\n else if (Owner.cleanups === null) Owner.cleanups = [fn];\r\n else Owner.cleanups.push(fn);\r\n}\r\nfunction onError(fn) {\r\n if (Owner === null)\r\n console.warn(\"error handlers created outside a `createRoot` or `render` will never be run\");\r\n else if (Owner.context === null) Owner.context = { [ERROR]: [fn] };\r\n else if (!Owner.context[ERROR]) Owner.context[ERROR] = [fn];\r\n else Owner.context[ERROR].push(fn);\r\n}\r\nfunction isListening() {\r\n return Listener !== null;\r\n}\r\nfunction createContext(defaultValue) {\r\n const id = Symbol(\"context\");\r\n return { id, Provider: createProvider(id), defaultValue };\r\n}\r\nfunction useContext(context) {\r\n return lookup(Owner, context.id) || context.defaultValue;\r\n}\r\nfunction getOwner() {\r\n return Owner;\r\n}\r\n// Internal implementation\r\n/// Graph classes and operations\r\nclass DataNode {\r\n constructor(value) {\r\n this.value = value;\r\n this.pending = NOTPENDING;\r\n this.log = null;\r\n }\r\n current() {\r\n if (Listener !== null) {\r\n if (this.log === null) this.log = createLog();\r\n logRead(this.log);\r\n }\r\n return this.value;\r\n }\r\n next(value) {\r\n if (RunningClock !== null) {\r\n if (this.pending !== NOTPENDING) {\r\n // value has already been set once, check for conflicts\r\n if (value !== this.pending) {\r\n throw new Error(\"conflicting changes: \" + value + \" !== \" + this.pending);\r\n }\r\n } else {\r\n // add to list of changes\r\n this.pending = value;\r\n RootClock.changes.add(this);\r\n }\r\n } else {\r\n // not batching, respond to change now\r\n if (this.log !== null) {\r\n this.pending = value;\r\n RootClock.changes.add(this);\r\n event();\r\n } else {\r\n this.value = value;\r\n }\r\n }\r\n return value;\r\n }\r\n}\r\nfunction createComputationNode(fn, value) {\r\n const node = {\r\n fn,\r\n value,\r\n age: RootClock.time,\r\n state: 0,\r\n comparator: null,\r\n source1: null,\r\n source1slot: 0,\r\n sources: null,\r\n sourceslots: null,\r\n dependents: null,\r\n dependentslot: 0,\r\n dependentcount: 0,\r\n owner: Owner,\r\n owned: null,\r\n log: null,\r\n context: null,\r\n cleanups: null\r\n };\r\n if (fn === null) return node;\r\n let owner = Owner,\r\n listener = Listener;\r\n if (owner === null)\r\n console.warn(\"computations created outside a `createRoot` or `render` will never be disposed\");\r\n Owner = Listener = node;\r\n if (RunningClock === null) {\r\n toplevelComputation(node);\r\n } else node.value = node.fn(node.value);\r\n if (owner && owner !== UNOWNED) {\r\n if (owner.owned === null) owner.owned = [node];\r\n else owner.owned.push(node);\r\n }\r\n Owner = owner;\r\n Listener = listener;\r\n return node;\r\n}\r\nfunction createClock() {\r\n return {\r\n time: 0,\r\n changes: new Queue(),\r\n updates: new Queue(),\r\n disposes: new Queue(),\r\n afters: new Queue()\r\n };\r\n}\r\nfunction createLog() {\r\n return {\r\n node1: null,\r\n node1slot: 0,\r\n nodes: null,\r\n nodeslots: null\r\n };\r\n}\r\nclass Queue {\r\n constructor() {\r\n this.items = [];\r\n this.count = 0;\r\n }\r\n reset() {\r\n this.count = 0;\r\n }\r\n add(item) {\r\n this.items[this.count++] = item;\r\n }\r\n run(fn) {\r\n let items = this.items;\r\n for (let i = 0; i < this.count; i++) {\r\n try {\r\n const item = items[i];\r\n items[i] = null;\r\n fn(item);\r\n } catch (err) {\r\n const fns = lookup(Owner, ERROR);\r\n if (!fns) throw err;\r\n fns.forEach(f => f(err));\r\n }\r\n }\r\n this.count = 0;\r\n }\r\n}\r\n// \"Globals\" used to keep track of current system state\r\nlet RootClock = createClock(),\r\n RunningClock = null, // currently running clock\r\n Listener = null, // currently listening computation\r\n Owner = null, // owner for new computations\r\n Pending = null; // pending node\r\n// Constants\r\nlet NOTPENDING = {},\r\n UNOWNED = createComputationNode(null, null);\r\n// State\r\n// 1 - Stale, 2 - Pending, 4 - Pending Disposal, 8 - Running, 16 - Disposed\r\n// Functions\r\nfunction callAll(ss) {\r\n return function all() {\r\n for (let i = 0; i < ss.length; i++) ss[i]();\r\n };\r\n}\r\nfunction lookup(owner, key) {\r\n return (\r\n owner && ((owner.context && owner.context[key]) || (owner.owner && lookup(owner.owner, key)))\r\n );\r\n}\r\nfunction resolveChildren(children) {\r\n if (typeof children === \"function\") return createMemo(() => resolveChildren(children()));\r\n if (Array.isArray(children)) {\r\n const results = [];\r\n for (let i = 0; i < children.length; i++) {\r\n let result = resolveChildren(children[i]);\r\n Array.isArray(result) ? results.push.apply(results, result) : results.push(result);\r\n }\r\n return results;\r\n }\r\n return children;\r\n}\r\nfunction createProvider(id) {\r\n return function provider(props) {\r\n let rendered;\r\n createComputationNode(() => {\r\n Owner.context = { [id]: props.value };\r\n rendered = sample(() => resolveChildren(props.children));\r\n });\r\n return rendered;\r\n };\r\n}\r\nfunction logRead(from) {\r\n let to = Listener,\r\n fromslot,\r\n toslot = to.source1 === null ? -1 : to.sources === null ? 0 : to.sources.length;\r\n if (from.node1 === null) {\r\n from.node1 = to;\r\n from.node1slot = toslot;\r\n fromslot = -1;\r\n } else if (from.nodes === null) {\r\n if (from.node1 === to) return;\r\n from.nodes = [to];\r\n from.nodeslots = [toslot];\r\n fromslot = 0;\r\n } else {\r\n fromslot = from.nodes.length;\r\n if (from.nodes[fromslot - 1] === to) return;\r\n from.nodes.push(to);\r\n from.nodeslots.push(toslot);\r\n }\r\n if (to.source1 === null) {\r\n to.source1 = from;\r\n to.source1slot = fromslot;\r\n } else if (to.sources === null) {\r\n to.sources = [from];\r\n to.sourceslots = [fromslot];\r\n } else {\r\n to.sources.push(from);\r\n to.sourceslots.push(fromslot);\r\n }\r\n}\r\nfunction liftComputation(node) {\r\n if ((node.state & 6) !== 0) {\r\n applyUpstreamUpdates(node);\r\n }\r\n if ((node.state & 1) !== 0) {\r\n updateNode(node);\r\n }\r\n resetComputation(node, 31);\r\n}\r\nfunction event() {\r\n // b/c we might be under a top level S.root(), have to preserve current root\r\n let owner = Owner;\r\n RootClock.updates.reset();\r\n RootClock.time++;\r\n try {\r\n run(RootClock);\r\n } finally {\r\n RunningClock = Listener = null;\r\n Owner = owner;\r\n }\r\n}\r\nfunction toplevelComputation(node) {\r\n RunningClock = RootClock;\r\n RootClock.changes.reset();\r\n RootClock.updates.reset();\r\n try {\r\n node.value = node.fn(node.value);\r\n if (RootClock.changes.count > 0 || RootClock.updates.count > 0) {\r\n RootClock.time++;\r\n run(RootClock);\r\n }\r\n } catch (err) {\r\n const fns = lookup(Owner, ERROR);\r\n if (!fns) throw err;\r\n fns.forEach(f => f(err));\r\n } finally {\r\n RunningClock = Owner = Listener = null;\r\n }\r\n}\r\nfunction run(clock) {\r\n let running = RunningClock,\r\n count = 0;\r\n RunningClock = clock;\r\n clock.disposes.reset();\r\n // for each batch ...\r\n while (clock.changes.count !== 0 || clock.updates.count !== 0 || clock.disposes.count !== 0) {\r\n if (count > 0)\r\n // don't tick on first run, or else we expire already scheduled updates\r\n clock.time++;\r\n clock.changes.run(applyDataChange);\r\n clock.updates.run(updateNode);\r\n clock.disposes.run(dispose);\r\n // if there are still changes after excessive batches, assume runaway\r\n if (count++ > 1e5) {\r\n throw new Error(\"Runaway clock detected\");\r\n }\r\n }\r\n clock.afters.run(f => f());\r\n RunningClock = running;\r\n}\r\nfunction applyDataChange(data) {\r\n data.value = data.pending;\r\n data.pending = NOTPENDING;\r\n if (data.log) setComputationState(data.log, stateStale);\r\n}\r\nfunction updateNode(node) {\r\n const state = node.state;\r\n if ((state & 16) === 0) {\r\n if ((state & 2) !== 0) {\r\n node.dependents[node.dependentslot++] = null;\r\n if (node.dependentslot === node.dependentcount) {\r\n resetComputation(node, 14);\r\n }\r\n } else if ((state & 1) !== 0) {\r\n if ((state & 4) !== 0) {\r\n liftComputation(node);\r\n } else if (node.comparator) {\r\n const current = updateComputation(node);\r\n const comparator = node.comparator;\r\n if (!comparator(current, node.value)) {\r\n markDownstreamComputations(node, false, true);\r\n }\r\n } else {\r\n updateComputation(node);\r\n }\r\n }\r\n }\r\n}\r\nfunction updateComputation(node) {\r\n const value = node.value,\r\n owner = Owner,\r\n listener = Listener;\r\n Owner = Listener = node;\r\n node.state = 8;\r\n cleanupNode(node, false);\r\n node.value = node.fn(node.value);\r\n resetComputation(node, 31);\r\n Owner = owner;\r\n Listener = listener;\r\n return value;\r\n}\r\nfunction stateStale(node) {\r\n const time = RootClock.time;\r\n if (node.age < time) {\r\n node.state |= 1;\r\n node.age = time;\r\n setDownstreamState(node, !!node.comparator);\r\n }\r\n}\r\nfunction statePending(node) {\r\n const time = RootClock.time;\r\n if (node.age < time) {\r\n node.state |= 2;\r\n let dependents = node.dependents || (node.dependents = []);\r\n dependents[node.dependentcount++] = Pending;\r\n setDownstreamState(node, true);\r\n }\r\n}\r\nfunction pendingStateStale(node) {\r\n if ((node.state & 2) !== 0) {\r\n node.state = 1;\r\n const time = RootClock.time;\r\n if (node.age < time) {\r\n node.age = time;\r\n if (!node.comparator) {\r\n markDownstreamComputations(node, false, true);\r\n }\r\n }\r\n }\r\n}\r\nfunction setDownstreamState(node, pending) {\r\n RootClock.updates.add(node);\r\n if (node.comparator) {\r\n const pending = Pending;\r\n Pending = node;\r\n markDownstreamComputations(node, true, false);\r\n Pending = pending;\r\n } else {\r\n markDownstreamComputations(node, pending, false);\r\n }\r\n}\r\nfunction markDownstreamComputations(node, onchange, dirty) {\r\n const owned = node.owned;\r\n if (owned !== null) {\r\n const pending = onchange && !dirty;\r\n markForDisposal(owned, pending, RootClock.time);\r\n }\r\n const log = node.log;\r\n if (log !== null) {\r\n setComputationState(log, dirty ? pendingStateStale : onchange ? statePending : stateStale);\r\n }\r\n}\r\nfunction setComputationState(log, stateFn) {\r\n const node1 = log.node1,\r\n nodes = log.nodes;\r\n if (node1 !== null) stateFn(node1);\r\n if (nodes !== null) {\r\n for (let i = 0, ln = nodes.length; i < ln; i++) {\r\n stateFn(nodes[i]);\r\n }\r\n }\r\n}\r\nfunction markForDisposal(children, pending, time) {\r\n for (let i = 0, ln = children.length; i < ln; i++) {\r\n const child = children[i];\r\n if (child !== null) {\r\n if (pending) {\r\n if ((child.state & 16) === 0) {\r\n child.state |= 4;\r\n }\r\n } else {\r\n child.age = time;\r\n child.state = 16;\r\n }\r\n const owned = child.owned;\r\n if (owned !== null) markForDisposal(owned, pending, time);\r\n }\r\n }\r\n}\r\nfunction applyUpstreamUpdates(node) {\r\n if ((node.state & 4) !== 0) {\r\n const owner = node.owner;\r\n if ((owner.state & 7) !== 0) liftComputation(owner);\r\n node.state &= ~4;\r\n }\r\n if ((node.state & 2) !== 0) {\r\n const slots = node.dependents;\r\n for (let i = node.dependentslot, ln = node.dependentcount; i < ln; i++) {\r\n const slot = slots[i];\r\n if (slot != null) liftComputation(slot);\r\n slots[i] = null;\r\n }\r\n node.state &= ~2;\r\n }\r\n}\r\nfunction cleanupNode(node, final) {\r\n let source1 = node.source1,\r\n sources = node.sources,\r\n sourceslots = node.sourceslots,\r\n cleanups = node.cleanups,\r\n owned = node.owned,\r\n i,\r\n len;\r\n if (cleanups !== null) {\r\n for (i = 0; i < cleanups.length; i++) {\r\n cleanups[i](final);\r\n }\r\n node.cleanups = null;\r\n }\r\n node.context = null;\r\n if (owned !== null) {\r\n for (i = 0; i < owned.length; i++) {\r\n dispose(owned[i]);\r\n }\r\n node.owned = null;\r\n }\r\n if (source1 !== null) {\r\n cleanupSource(source1, node.source1slot);\r\n node.source1 = null;\r\n }\r\n if (sources !== null) {\r\n for (i = 0, len = sources.length; i < len; i++) {\r\n cleanupSource(sources.pop(), sourceslots.pop());\r\n }\r\n }\r\n}\r\nfunction cleanupSource(source, slot) {\r\n let nodes = source.nodes,\r\n nodeslots = source.nodeslots,\r\n last,\r\n lastslot;\r\n if (slot === -1) {\r\n source.node1 = null;\r\n } else {\r\n last = nodes.pop();\r\n lastslot = nodeslots.pop();\r\n if (slot !== nodes.length) {\r\n nodes[slot] = last;\r\n nodeslots[slot] = lastslot;\r\n if (lastslot === -1) {\r\n last.source1slot = slot;\r\n } else {\r\n last.sourceslots[lastslot] = slot;\r\n }\r\n }\r\n }\r\n}\r\nfunction resetComputation(node, flags) {\r\n node.state &= ~flags;\r\n node.dependentslot = 0;\r\n node.dependentcount = 0;\r\n}\r\nfunction dispose(node) {\r\n node.fn = null;\r\n node.log = null;\r\n node.dependents = null;\r\n cleanupNode(node, true);\r\n resetComputation(node, 31);\r\n}\r\n\r\nmodule.exports = {\r\n createRoot, createComputed: createEffect, createSignal\r\n}" }, { "path": "packages/solid/bench/libraries/s.cjs", "content": "\"use strict\";\n\n// Public interface\nvar S = function S(fn, value) {\n if (Owner === null)\n console.warn(\"computations created without a root or parent will never be disposed\");\n var _a = makeComputationNode(fn, value, false, false),\n node = _a.node,\n _value = _a.value;\n if (node === null) {\n return function computation() {\n return _value;\n };\n } else {\n return function computation() {\n return node.current();\n };\n }\n};\n// compatibility with commonjs systems that expect default export to be at require('s.js').default rather than just require('s-js')\nObject.defineProperty(S, \"default\", { value: S });\nS.root = function root(fn) {\n var owner = Owner,\n disposer =\n fn.length === 0\n ? null\n : function _dispose() {\n if (root === null);\n else if (RunningClock !== null) {\n RootClock.disposes.add(root);\n } else {\n dispose(root);\n }\n },\n root = disposer === null ? UNOWNED : getCandidateNode(),\n result;\n Owner = root;\n try {\n result = disposer === null ? fn() : fn(disposer);\n } finally {\n Owner = owner;\n }\n if (disposer !== null && recycleOrClaimNode(root, null, undefined, true)) {\n root = null;\n }\n return result;\n};\nS.on = function on(ev, fn, seed, onchanges) {\n if (Array.isArray(ev)) ev = callAll(ev);\n onchanges = !!onchanges;\n return S(on, seed);\n function on(value) {\n var listener = Listener;\n ev();\n if (onchanges) onchanges = false;\n else {\n Listener = null;\n value = fn(value);\n Listener = listener;\n }\n return value;\n }\n};\nfunction callAll(ss) {\n return function all() {\n for (var i = 0; i < ss.length; i++) ss[i]();\n };\n}\nS.effect = function effect(fn, value) {\n makeComputationNode(fn, value, false, false);\n};\nS.data = function data(value) {\n var node = new DataNode(value);\n return function data(value) {\n if (arguments.length === 0) {\n return node.current();\n } else {\n return node.next(value);\n }\n };\n};\nS.value = function value(current, eq) {\n var node = new DataNode(current),\n age = -1;\n return function value(update) {\n if (arguments.length === 0) {\n return node.current();\n } else {\n var same = eq ? eq(current, update) : current === update;\n if (!same) {\n var time = RootClock.time;\n if (age === time)\n throw new Error(\"conflicting values: \" + update + \" is not the same as \" + current);\n age = time;\n current = update;\n node.next(update);\n }\n return update;\n }\n };\n};\nS.freeze = function freeze(fn) {\n var result = undefined;\n if (RunningClock !== null) {\n result = fn();\n } else {\n RunningClock = RootClock;\n RunningClock.changes.reset();\n try {\n result = fn();\n event();\n } finally {\n RunningClock = null;\n }\n }\n return result;\n};\nS.sample = function sample(fn) {\n var result,\n listener = Listener;\n Listener = null;\n result = fn();\n Listener = listener;\n return result;\n};\nS.cleanup = function cleanup(fn) {\n if (Owner === null) console.warn(\"cleanups created without a root or parent will never be run\");\n else if (Owner.cleanups === null) Owner.cleanups = [fn];\n else Owner.cleanups.push(fn);\n};\n// experimental : exposing node constructors and some state\nS.makeDataNode = function makeDataNode(value) {\n return new DataNode(value);\n};\nS.makeComputationNode = makeComputationNode;\nS.disposeNode = function disposeNode(node) {\n if (RunningClock !== null) {\n RootClock.disposes.add(node);\n } else {\n dispose(node);\n }\n};\nS.isFrozen = function isFrozen() {\n return RunningClock !== null;\n};\nS.isListening = function isListening() {\n return Listener !== null;\n};\n// Internal implementation\n/// Graph classes and operations\nvar Clock = /** @class */ (function () {\n function Clock() {\n this.time = 0;\n this.changes = new Queue(); // batched changes to data nodes\n this.updates = new Queue(); // computations to update\n this.disposes = new Queue(); // disposals to run after current batch of updates finishes\n }\n return Clock;\n})();\nvar RootClockProxy = {\n time: function () {\n return RootClock.time;\n }\n};\nvar DataNode = /** @class */ (function () {\n function DataNode(value) {\n this.value = value;\n this.pending = NOTPENDING;\n this.log = null;\n }\n DataNode.prototype.current = function () {\n if (Listener !== null) {\n logDataRead(this);\n }\n return this.value;\n };\n DataNode.prototype.next = function (value) {\n if (RunningClock !== null) {\n if (this.pending !== NOTPENDING) {\n // value has already been set once, check for conflicts\n if (value !== this.pending) {\n throw new Error(\"conflicting changes: \" + value + \" !== \" + this.pending);\n }\n } else {\n // add to list of changes\n this.pending = value;\n RootClock.changes.add(this);\n }\n } else {\n // not batching, respond to change now\n if (this.log !== null) {\n this.pending = value;\n RootClock.changes.add(this);\n event();\n } else {\n this.value = value;\n }\n }\n return value;\n };\n DataNode.prototype.clock = function () {\n return RootClockProxy;\n };\n return DataNode;\n})();\nvar ComputationNode = /** @class */ (function () {\n function ComputationNode() {\n this.fn = null;\n this.value = undefined;\n this.age = -1;\n this.state = CURRENT;\n this.source1 = null;\n this.source1slot = 0;\n this.sources = null;\n this.sourceslots = null;\n this.log = null;\n this.owned = null;\n this.cleanups = null;\n }\n ComputationNode.prototype.current = function () {\n if (Listener !== null) {\n if (this.age === RootClock.time) {\n if (this.state === RUNNING) throw new Error(\"circular dependency\");\n else updateNode(this); // checks for state === STALE internally, so don't need to check here\n }\n logComputationRead(this);\n }\n return this.value;\n };\n ComputationNode.prototype.clock = function () {\n return RootClockProxy;\n };\n return ComputationNode;\n})();\nvar Log = /** @class */ (function () {\n function Log() {\n this.node1 = null;\n this.node1slot = 0;\n this.nodes = null;\n this.nodeslots = null;\n }\n return Log;\n})();\nvar Queue = /** @class */ (function () {\n function Queue() {\n this.items = [];\n this.count = 0;\n }\n Queue.prototype.reset = function () {\n this.count = 0;\n };\n Queue.prototype.add = function (item) {\n this.items[this.count++] = item;\n };\n Queue.prototype.run = function (fn) {\n var items = this.items;\n for (var i = 0; i < this.count; i++) {\n fn(items[i]);\n items[i] = null;\n }\n this.count = 0;\n };\n return Queue;\n})();\n// Constants\nvar NOTPENDING = {},\n CURRENT = 0,\n STALE = 1,\n RUNNING = 2,\n UNOWNED = new ComputationNode();\n// \"Globals\" used to keep track of current system state\nvar RootClock = new Clock(),\n RunningClock = null, // currently running clock\n Listener = null, // currently listening computation\n Owner = null, // owner for new computations\n LastNode = null; // cached unused node, for re-use\n// Functions\nvar makeComputationNodeResult = { node: null, value: undefined };\nfunction makeComputationNode(fn, value, orphan, sample) {\n var node = getCandidateNode(),\n owner = Owner,\n listener = Listener,\n toplevel = RunningClock === null;\n Owner = node;\n Listener = sample ? null : node;\n if (toplevel) {\n value = execToplevelComputation(fn, value);\n } else {\n value = fn(value);\n }\n Owner = owner;\n Listener = listener;\n var recycled = recycleOrClaimNode(node, fn, value, orphan);\n if (toplevel) finishToplevelComputation(owner, listener);\n makeComputationNodeResult.node = recycled ? null : node;\n makeComputationNodeResult.value = value;\n return makeComputationNodeResult;\n}\nfunction execToplevelComputation(fn, value) {\n RunningClock = RootClock;\n RootClock.changes.reset();\n RootClock.updates.reset();\n try {\n return fn(value);\n } finally {\n Owner = Listener = RunningClock = null;\n }\n}\nfunction finishToplevelComputation(owner, listener) {\n if (RootClock.changes.count > 0 || RootClock.updates.count > 0) {\n RootClock.time++;\n try {\n run(RootClock);\n } finally {\n RunningClock = null;\n Owner = owner;\n Listener = listener;\n }\n }\n}\nfunction getCandidateNode() {\n var node = LastNode;\n if (node === null) node = new ComputationNode();\n else LastNode = null;\n return node;\n}\nfunction recycleOrClaimNode(node, fn, value, orphan) {\n var _owner = orphan || Owner === null || Owner === UNOWNED ? null : Owner,\n recycle =\n node.source1 === null && ((node.owned === null && node.cleanups === null) || _owner !== null),\n i;\n if (recycle) {\n LastNode = node;\n if (_owner !== null) {\n if (node.owned !== null) {\n if (_owner.owned === null) _owner.owned = node.owned;\n else\n for (i = 0; i < node.owned.length; i++) {\n _owner.owned.push(node.owned[i]);\n }\n node.owned = null;\n }\n if (node.cleanups !== null) {\n if (_owner.cleanups === null) _owner.cleanups = node.cleanups;\n else\n for (i = 0; i < node.cleanups.length; i++) {\n _owner.cleanups.push(node.cleanups[i]);\n }\n node.cleanups = null;\n }\n }\n } else {\n node.fn = fn;\n node.value = value;\n node.age = RootClock.time;\n if (_owner !== null) {\n if (_owner.owned === null) _owner.owned = [node];\n else _owner.owned.push(node);\n }\n }\n return recycle;\n}\nfunction logRead(from) {\n var to = Listener,\n fromslot,\n toslot = to.source1 === null ? -1 : to.sources === null ? 0 : to.sources.length;\n if (from.node1 === null) {\n from.node1 = to;\n from.node1slot = toslot;\n fromslot = -1;\n } else if (from.nodes === null) {\n from.nodes = [to];\n from.nodeslots = [toslot];\n fromslot = 0;\n } else {\n fromslot = from.nodes.length;\n from.nodes.push(to);\n from.nodeslots.push(toslot);\n }\n if (to.source1 === null) {\n to.source1 = from;\n to.source1slot = fromslot;\n } else if (to.sources === null) {\n to.sources = [from];\n to.sourceslots = [fromslot];\n } else {\n to.sources.push(from);\n to.sourceslots.push(fromslot);\n }\n}\nfunction logDataRead(data) {\n if (data.log === null) data.log = new Log();\n logRead(data.log);\n}\nfunction logComputationRead(node) {\n if (node.log === null) node.log = new Log();\n logRead(node.log);\n}\nfunction event() {\n // b/c we might be under a top level S.root(), have to preserve current root\n var owner = Owner;\n RootClock.updates.reset();\n RootClock.time++;\n try {\n run(RootClock);\n } finally {\n RunningClock = Listener = null;\n Owner = owner;\n }\n}\nfunction run(clock) {\n var running = RunningClock,\n count = 0;\n RunningClock = clock;\n clock.disposes.reset();\n // for each batch ...\n while (clock.changes.count !== 0 || clock.updates.count !== 0 || clock.disposes.count !== 0) {\n if (count > 0)\n // don't tick on first run, or else we expire already scheduled updates\n clock.time++;\n clock.changes.run(applyDataChange);\n clock.updates.run(updateNode);\n clock.disposes.run(dispose);\n // if there are still changes after excessive batches, assume runaway\n if (count++ > 1e5) {\n throw new Error(\"Runaway clock detected\");\n }\n }\n RunningClock = running;\n}\nfunction applyDataChange(data) {\n data.value = data.pending;\n data.pending = NOTPENDING;\n if (data.log) markComputationsStale(data.log);\n}\nfunction markComputationsStale(log) {\n var node1 = log.node1,\n nodes = log.nodes;\n // mark all downstream nodes stale which haven't been already\n if (node1 !== null) markNodeStale(node1);\n if (nodes !== null) {\n for (var i = 0, len = nodes.length; i < len; i++) {\n markNodeStale(nodes[i]);\n }\n }\n}\nfunction markNodeStale(node) {\n var time = RootClock.time;\n if (node.age < time) {\n node.age = time;\n node.state = STALE;\n RootClock.updates.add(node);\n if (node.owned !== null) markOwnedNodesForDisposal(node.owned);\n if (node.log !== null) markComputationsStale(node.log);\n }\n}\nfunction markOwnedNodesForDisposal(owned) {\n for (var i = 0; i < owned.length; i++) {\n var child = owned[i];\n child.age = RootClock.time;\n child.state = CURRENT;\n if (child.owned !== null) markOwnedNodesForDisposal(child.owned);\n }\n}\nfunction updateNode(node) {\n if (node.state === STALE) {\n var owner = Owner,\n listener = Listener;\n Owner = Listener = node;\n node.state = RUNNING;\n cleanup(node, false);\n node.value = node.fn(node.value);\n node.state = CURRENT;\n Owner = owner;\n Listener = listener;\n }\n}\nfunction cleanup(node, final) {\n var source1 = node.source1,\n sources = node.sources,\n sourceslots = node.sourceslots,\n cleanups = node.cleanups,\n owned = node.owned,\n i,\n len;\n if (cleanups !== null) {\n for (i = 0; i < cleanups.length; i++) {\n cleanups[i](final);\n }\n node.cleanups = null;\n }\n if (owned !== null) {\n for (i = 0; i < owned.length; i++) {\n dispose(owned[i]);\n }\n node.owned = null;\n }\n if (source1 !== null) {\n cleanupSource(source1, node.source1slot);\n node.source1 = null;\n }\n if (sources !== null) {\n for (i = 0, len = sources.length; i < len; i++) {\n cleanupSource(sources.pop(), sourceslots.pop());\n }\n }\n}\nfunction cleanupSource(source, slot) {\n var nodes = source.nodes,\n nodeslots = source.nodeslots,\n last,\n lastslot;\n if (slot === -1) {\n source.node1 = null;\n } else {\n last = nodes.pop();\n lastslot = nodeslots.pop();\n if (slot !== nodes.length) {\n nodes[slot] = last;\n nodeslots[slot] = lastslot;\n if (lastslot === -1) {\n last.source1slot = slot;\n } else {\n last.sourceslots[lastslot] = slot;\n }\n }\n }\n}\nfunction dispose(node) {\n node.fn = null;\n node.log = null;\n cleanup(node, true);\n}\n\nmodule.exports = {\n createRoot: S.root, createComputed: S, createSignal(init) {\n const s = S.data(init);\n return [s, s];\n }\n}" }, { "path": "packages/solid/bench/libraries/sinuous-mod.cjs", "content": "function getChildrenDeep(children, res) {\r\n for (let i = 0; i < children.length; i += 1) {\r\n res.push(children[i]);\r\n getChildrenDeep(children[0]._children, res);\r\n }\r\n}\r\n\r\nconst EMPTY_ARR = [];\r\nlet tracking;\r\nlet queue;\r\n\r\n/**\r\n * Returns true if there is an active observer.\r\n * @return {boolean}\r\n */\r\nfunction isListening() {\r\n return !!tracking;\r\n}\r\n\r\n/**\r\n * Creates a root and executes the passed function that can contain computations.\r\n * The executed function receives an `unsubscribe` argument which can be called to\r\n * unsubscribe all inner computations.\r\n *\r\n * @param {Function} fn\r\n * @return {*}\r\n */\r\nfunction createRoot(fn) {\r\n const prevTracking = tracking,\r\n rootUpdate = { _children: [] };\r\n tracking = rootUpdate;\r\n const result = fn(() => {\r\n _unsubscribe(rootUpdate);\r\n tracking = undefined;\r\n });\r\n tracking = prevTracking;\r\n return result;\r\n}\r\n\r\nfunction sample(fn) {\r\n const prevTracking = tracking;\r\n tracking = undefined;\r\n const value = fn();\r\n tracking = prevTracking;\r\n return value;\r\n}\r\n\r\nfunction batch(fn) {\r\n let prevQueue = queue;\r\n queue = [];\r\n const result = fn();\r\n let q = queue;\r\n queue = prevQueue;\r\n for (let i = 0; i < q.length; i += 1) {\r\n const data = q[i];\r\n if (data._pending !== EMPTY_ARR) {\r\n const pending = data._pending;\r\n data._pending = EMPTY_ARR;\r\n data(pending);\r\n }\r\n }\r\n return result;\r\n}\r\n\r\nclass DataNode {\r\n constructor(value) {\r\n this._observers = new Set();\r\n this._pending = EMPTY_ARR;\r\n this.value = value;\r\n this._runObservers = null;\r\n }\r\n current() {\r\n if (tracking && tracking._observables && !this._observers.has(tracking)) {\r\n this._observers.add(tracking);\r\n tracking._observables.push(this);\r\n }\r\n return this.value;\r\n }\r\n next(nextValue) {\r\n if (queue) {\r\n if (this._pending === EMPTY_ARR) {\r\n queue.push(this);\r\n }\r\n this._pending = nextValue;\r\n return nextValue;\r\n }\r\n\r\n this.value = nextValue;\r\n\r\n // Clear `tracking` otherwise a computed triggered by a set\r\n // in another computed is seen as a child of that other computed.\r\n const clearedUpdate = tracking;\r\n tracking = undefined;\r\n\r\n // Update can alter data._observers, make a copy before running.\r\n this._runObservers = new Set(this._observers);\r\n for (const v of this._runObservers.values()) v._fresh = false;\r\n for (const v of this._runObservers.values()) !v._fresh && updateComputation(v);\r\n\r\n tracking = clearedUpdate;\r\n return this.value;\r\n }\r\n}\r\n\r\nfunction createComputationNode(observer, value) {\r\n const c = {\r\n observer,\r\n value,\r\n _fresh: false,\r\n _observables: [],\r\n _children: [],\r\n _cleanups: []\r\n };\r\n updateComputation(c);\r\n return c;\r\n}\r\n\r\nfunction removeFreshChildren(u) {\r\n if (u._fresh) {\r\n for (let i = 0, len = u._observables.length; i < len; i += 1) {\r\n const o = u._observables[i];\r\n o._runObservers && o._runObservers.delete(u);\r\n }\r\n }\r\n}\r\n\r\nfunction onCleanup(fn) {\r\n if (tracking) {\r\n tracking._cleanups.push(fn);\r\n }\r\n return fn;\r\n}\r\n\r\nfunction _unsubscribe(node) {\r\n let i;\r\n for (i = 0; i < node._children.length; i += 1) _unsubscribe(node._children[i]);\r\n for (i = 0; i < node._observables.length; i += 1) {\r\n const o = node._observables[i];\r\n o._observers.delete(node);\r\n o._runObservers && o._runObservers.delete(node);\r\n }\r\n for (i = 0; i < node._cleanups.length; i += 1) node._cleanups[i]();\r\n resetUpdate(node);\r\n}\r\n\r\nfunction updateComputation(node) {\r\n if (!node.observer) return;\r\n const prevTracking = tracking;\r\n if (tracking) {\r\n tracking._children.push(node);\r\n }\r\n\r\n const prevChildren = node._children;\r\n\r\n _unsubscribe(node);\r\n node._fresh = true;\r\n tracking = node;\r\n node.value = node.observer(node.value);\r\n\r\n // If any children computations were removed mark them as fresh.\r\n // Check the diff of the children list between pre and post update.\r\n const pK = Object.keys(prevChildren);\r\n for (let i = 0, len = pK.length; i < len; i += 1) {\r\n const u = prevChildren[i];\r\n if (node._children.indexOf(u) === -1) {\r\n u._fresh = true;\r\n }\r\n }\r\n\r\n // If any children were marked as fresh remove them from the run lists.\r\n const allChildren = [];\r\n getChildrenDeep(node._children, allChildren);\r\n for (let i = 0; i < allChildren.length; i += 1) removeFreshChildren(allChildren[i]);\r\n\r\n tracking = prevTracking;\r\n return node.value;\r\n}\r\n\r\nfunction currentValue() {\r\n if (this._fresh) {\r\n for (let i = 0; i < this._observables.length; i += 1) this._observables[i].current();\r\n } else {\r\n this.value = updateComputation(this);\r\n }\r\n return this.value;\r\n}\r\n\r\nfunction resetUpdate(node) {\r\n // Keep track of which observables trigger nodes. Needed for unsubscribe.\r\n node._observables = [];\r\n node._children = [];\r\n node._cleanups = [];\r\n}\r\n\r\nmodule.exports = {\r\n createSignal: value => {\r\n const o = new DataNode(value);\r\n return [o.current.bind(o), o.next.bind(o)];\r\n },\r\n createRoot,\r\n createComputed: (observer, seed) => createComputationNode(observer, seed),\r\n createMemo: (observer, seed) => {\r\n const c = createComputationNode(observer, seed);\r\n return currentValue.bind(c);\r\n }\r\n};\r\n" }, { "path": "packages/solid/bench/libraries/sinuous.cjs", "content": "function getChildrenDeep(children) {\r\n return children.reduce(\r\n (res, curr) => res.concat(curr, getChildrenDeep(curr._children)),\r\n []\r\n );\r\n}\r\n\r\nconst EMPTY_ARR = [];\r\nlet tracking;\r\nlet queue;\r\n\r\n/**\r\n * Returns true if there is an active observer.\r\n * @return {boolean}\r\n */\r\nfunction isListening() {\r\n return !!tracking;\r\n}\r\n\r\n/**\r\n * Creates a root and executes the passed function that can contain computations.\r\n * The executed function receives an `unsubscribe` argument which can be called to\r\n * unsubscribe all inner computations.\r\n *\r\n * @param {Function} fn\r\n * @return {*}\r\n */\r\nfunction root(fn) {\r\n const prevTracking = tracking;\r\n const rootUpdate = () => {};\r\n tracking = rootUpdate;\r\n resetUpdate(rootUpdate);\r\n const result = fn(() => {\r\n _unsubscribe(rootUpdate);\r\n tracking = undefined;\r\n });\r\n tracking = prevTracking;\r\n return result;\r\n}\r\n\r\n/**\r\n * Sample the current value of an observable but don't create a dependency on it.\r\n *\r\n * @example\r\n * S(() => { if (foo()) bar(sample(bar) + 1); });\r\n *\r\n * @param {Function} fn\r\n * @return {*}\r\n */\r\nfunction sample(fn) {\r\n const prevTracking = tracking;\r\n tracking = undefined;\r\n const value = fn();\r\n tracking = prevTracking;\r\n return value;\r\n}\r\n\r\n/**\r\n * Creates a transaction in which an observable can be set multiple times\r\n * but only trigger a computation once.\r\n * @param {Function} fn\r\n * @return {*}\r\n */\r\nfunction transaction(fn) {\r\n let prevQueue = queue;\r\n queue = [];\r\n const result = fn();\r\n let q = queue;\r\n queue = prevQueue;\r\n q.forEach(data => {\r\n if (data._pending !== EMPTY_ARR) {\r\n const pending = data._pending;\r\n data._pending = EMPTY_ARR;\r\n data(pending);\r\n }\r\n });\r\n return result;\r\n}\r\n\r\n/**\r\n * Creates a new observable, returns a function which can be used to get\r\n * the observable's value by calling the function without any arguments\r\n * and set the value by passing one argument of any type.\r\n *\r\n * @param {*} value - Initial value.\r\n * @return {Function}\r\n */\r\nfunction observable(value) {\r\n function data(nextValue) {\r\n if (arguments.length === 0) {\r\n if (tracking && !data._observers.has(tracking)) {\r\n data._observers.add(tracking);\r\n tracking._observables.push(data);\r\n }\r\n return value;\r\n }\r\n\r\n if (queue) {\r\n if (data._pending === EMPTY_ARR) {\r\n queue.push(data);\r\n }\r\n data._pending = nextValue;\r\n return nextValue;\r\n }\r\n\r\n value = nextValue;\r\n\r\n // Clear `tracking` otherwise a computed triggered by a set\r\n // in another computed is seen as a child of that other computed.\r\n const clearedUpdate = tracking;\r\n tracking = undefined;\r\n\r\n // Update can alter data._observers, make a copy before running.\r\n data._runObservers = new Set(data._observers);\r\n data._runObservers.forEach(observer => (observer._fresh = false));\r\n data._runObservers.forEach(observer => {\r\n if (!observer._fresh) observer();\r\n });\r\n\r\n tracking = clearedUpdate;\r\n return value;\r\n }\r\n\r\n // Tiny indicator that this is an observable function.\r\n data._observers = new Set();\r\n // The 'not set' value must be unique, so `nullish` can be set in a transaction.\r\n data._pending = EMPTY_ARR;\r\n\r\n return [data, data];\r\n}\r\n\r\n/**\r\n * @namespace\r\n * @borrows observable as o\r\n */\r\n\r\n/**\r\n * Creates a new computation which runs when defined and automatically re-runs\r\n * when any of the used observable's values are set.\r\n *\r\n * @param {Function} observer\r\n * @param {*} value - Seed value.\r\n * @return {Function} Computation which can be used in other computations.\r\n */\r\nfunction computed(observer, value) {\r\n observer._update = update;\r\n\r\n // if (tracking == null) {\r\n // console.warn(\"computations created without a root or parent will never be disposed\");\r\n // }\r\n\r\n resetUpdate(update);\r\n update();\r\n\r\n function update() {\r\n const prevTracking = tracking;\r\n if (tracking) {\r\n tracking._children.push(update);\r\n }\r\n\r\n const prevChildren = update._children;\r\n\r\n _unsubscribe(update);\r\n update._fresh = true;\r\n tracking = update;\r\n value = observer(value);\r\n\r\n // If any children computations were removed mark them as fresh.\r\n // Check the diff of the children list between pre and post update.\r\n prevChildren.forEach(u => {\r\n if (update._children.indexOf(u) === -1) {\r\n u._fresh = true;\r\n }\r\n });\r\n\r\n // If any children were marked as fresh remove them from the run lists.\r\n const allChildren = getChildrenDeep(update._children);\r\n allChildren.forEach(removeFreshChildren);\r\n\r\n tracking = prevTracking;\r\n return value;\r\n }\r\n\r\n function data() {\r\n if (update._fresh) {\r\n update._observables.forEach(o => o());\r\n } else {\r\n value = update();\r\n }\r\n return value;\r\n }\r\n\r\n return data;\r\n}\r\n\r\nfunction removeFreshChildren(u) {\r\n if (u._fresh) {\r\n u._observables.forEach(o => {\r\n if (o._runObservers) {\r\n o._runObservers.delete(u);\r\n }\r\n });\r\n }\r\n}\r\n\r\n/**\r\n * Run the given function just before the enclosing computation updates\r\n * or is disposed.\r\n * @param {Function} fn\r\n * @return {Function}\r\n */\r\nfunction cleanup(fn) {\r\n if (tracking) {\r\n tracking._cleanups.push(fn);\r\n }\r\n return fn;\r\n}\r\n\r\nfunction _unsubscribe(update) {\r\n update._children.forEach(_unsubscribe);\r\n update._observables.forEach(o => {\r\n o._observers.delete(update);\r\n if (o._runObservers) {\r\n o._runObservers.delete(update);\r\n }\r\n });\r\n update._cleanups.forEach(c => c());\r\n resetUpdate(update);\r\n}\r\n\r\nfunction resetUpdate(update) {\r\n // Keep track of which observables trigger updates. Needed for unsubscribe.\r\n update._observables = [];\r\n update._children = [];\r\n update._cleanups = [];\r\n}\r\n\r\nmodule.exports = {\r\n createSignal: observable,\r\n createRoot: root,\r\n createComputed: computed,\r\n createMemo: computed,\r\n batch: transaction\r\n};\r\n" }, { "path": "packages/solid/bench/libraries/usignal.cjs", "content": "// uSignal 0.7.0 https://github.com/WebReflection/usignal\n\n'use strict';\n/*! (c) Andrea Giammarchi */\n\nconst {is} = Object;\n\nlet batches;\n\n/**\n * Execute a callback that will not side-effect until its top-most batch is\n * completed.\n * @param {() => void} callback a function that batches changes to be notified\n * through signals.\n */\nconst batch = callback => {\n const prev = batches;\n batches = prev || [];\n try {\n callback();\n if (!prev)\n for (const {value} of batches);\n }\n finally { batches = prev }\n};\n\n/**\n * A signal with a value property also exposed via toJSON, toString and valueOf.\n * When created via computed, the `value` property is **readonly**.\n * @template T\n */\nclass Signal {\n /** @param {T} value the value carried along the signal. */\n constructor(value) {\n this._ = value;\n }\n\n /** @returns {T} */\n then() { return this.value }\n\n /** @returns {T} */\n toJSON() { return this.value }\n\n /** @returns {T} */\n toString() { return this.value }\n\n /** @returns {T} */\n valueOf() { return this.value }\n}\n\nlet computedSignal;\nclass Computed extends Signal {\n constructor(_, v, o, f) {\n super(_);\n this.f = f; // is effect?\n this.$ = true; // should update (\"value for money\")\n this.r = new Set; // related signals\n this.s = new Reactive(v, o); // signal\n }\n /** @readonly */\n get value() {\n if (this.$) {\n const prev = computedSignal;\n computedSignal = this;\n try { this.s.value = this._(this.s._) }\n finally {\n this.$ = false;\n computedSignal = prev;\n }\n }\n return this.s.value;\n }\n}\n\nconst defaults = {async: false, equals: true};\n\n/**\n * Returns a read-only Signal that is invoked only when any of the internally\n * used signals, as in within the callback, is unknown or updated.\n * @template T\n * @type {(fn: (v: T) => T, value?: T, options?: { equals?: boolean | ((prev: T, next: T) => boolean) }) => Signal}\n */\nconst computed = (fn, value, options = defaults) =>\n new Computed(fn, value, options, false);\n\nlet outerEffect;\nconst noop = () => {};\nclass Effect extends Computed {\n constructor(_, v, o) {\n super(_, v, o, true);\n this.i = 0; // index\n this.a = !!o.async; // async\n this.m = true; // microtask\n this.e = []; // effects\n // \"I am effects\" ^_^;;\n }\n get value() {\n this.a ? this.async() : this.sync();\n }\n async() {\n if (this.m) {\n this.m = false;\n queueMicrotask(() => {\n this.m = true;\n this.sync();\n });\n }\n }\n sync() {\n const prev = outerEffect;\n const {e} = (outerEffect = this);\n this.i = 0;\n super.value;\n // if effects are present in loops, these can grow or shrink.\n // when these grow, there's nothing to do, as well as when these are\n // still part of the loop, as the callback gets updated anyway.\n // however, if there were more effects before but none now, those can\n // just stop being referenced and go with the GC.\n if (this.i < e.length)\n for (const effect of e.splice(this.i))\n effect.stop();\n for (const {value} of e);\n outerEffect = prev;\n }\n stop() {\n this._ = noop;\n this.r.clear();\n this.s.c.clear();\n for (const effect of this.e.splice(0))\n effect.stop();\n }\n}\n\n/**\n * Invokes a function when any of its internal signals or computed values change.\n * \n * Returns a dispose callback.\n * @template T\n * @type {(fn: (v: T) => T, value?: T, options?: { async?: boolean }) => () => void}\n */\nconst effect = (callback, value, options = defaults) => {\n let unique;\n if (outerEffect) {\n const {i, e} = outerEffect;\n // bottleneck:\n // there's literally no way to optimize this path *unless* the callback is\n // already a known one. however, latter case is not really common code so\n // the question is: should I optimize this more than this? 'cause I don't\n // think the amount of code needed to understand if a callback is *likely*\n // the same as before makes any sense + correctness would be trashed.\n if (i === e.length || e[i]._ !== callback)\n e[i] = new Effect(callback, value, options);\n unique = e[i];\n outerEffect.i++;\n }\n else\n (unique = new Effect(callback, value, options)).value;\n return () => { unique.stop() };\n};\n\nconst skip = () => false;\nclass Reactive extends Signal {\n constructor(_, {equals}) {\n super(_)\n this.c = new Set; // computeds\n this.s = equals === true ? is : (equals || skip); // (don't) skip updates\n }\n peek() { return this._ }\n get value() {\n if (computedSignal) {\n this.c.add(computedSignal);\n computedSignal.r.add(this);\n }\n return this._;\n }\n set value(_) {\n if (!this.s(this._, _)) {\n this._ = _;\n if (this.c.size) {\n const effects = [];\n const stack = [this];\n for (const signal of stack) {\n for (const computed of signal.c) {\n if (!computed.$ && computed.r.has(signal)) {\n computed.r.clear();\n computed.$ = true;\n if (computed.f) {\n effects.push(computed);\n const stack = [computed];\n for (const c of stack) {\n for (const effect of c.e) {\n effect.r.clear();\n effect.$ = true;\n stack.push(effect);\n }\n }\n }\n else\n stack.push(computed.s);\n }\n }\n }\n for (const effect of effects)\n batches ? batches.push(effect) : effect.value;\n }\n }\n }\n}\n\n/**\n * Returns a writable Signal that side-effects whenever its value gets updated.\n * @template T\n * @type {(initialValue: T, options?: { equals?: boolean | ((prev: T, next: T) => boolean) }) => Signal}\n */\nconst signal = (value, options = defaults) => new Reactive(value, options);\n\n// adapter\nfunction createRoot(fn) { return fn(); }\nfunction createSignal(value) {\n const r = new Reactive(value, {});\n return [() => r.value, v => r.value = v];\n}\n\nmodule.exports = {\n createSignal,\n createRoot,\n createComputed: effect\n};" }, { "path": "packages/solid/bench/libraries/vuerx.cjs", "content": "//shared\r\n// Make a map and return a function for checking if a key\r\n// is in that map.\r\n//\r\n// IMPORTANT: all calls of this function must be prefixed with /*#__PURE__*/\r\n// So that rollup can tree-shake them if necessary.\r\nfunction makeMap(str, expectsLowerCase) {\r\n const map = Object.create(null);\r\n const list = str.split(',');\r\n for (let i = 0; i < list.length; i++) {\r\n map[list[i]] = true;\r\n }\r\n return expectsLowerCase ? val => !!map[val.toLowerCase()] : val => !!map[val];\r\n}\r\n\r\n\r\nconst EMPTY_OBJ = Object.freeze({});\r\n\r\nconst hasOwnProperty = Object.prototype.hasOwnProperty;\r\nconst hasOwn = (val, key) => hasOwnProperty.call(val, key);\r\nconst isArray = Array.isArray;\r\nconst isFunction = (val) => typeof val === 'function';\r\nconst isSymbol = (val) => typeof val === 'symbol';\r\nconst isObject = (val) => val !== null && typeof val === 'object';\r\nconst objectToString = Object.prototype.toString;\r\nconst toTypeString = (value) => objectToString.call(value);\r\nconst toRawType = (value) => {\r\n return toTypeString(value).slice(8, -1);\r\n};\r\nconst cacheStringFunction = (fn) => {\r\n const cache = Object.create(null);\r\n return ((str) => {\r\n const hit = cache[str];\r\n return hit || (cache[str] = fn(str));\r\n });\r\n};\r\nconst capitalize = cacheStringFunction((str) => {\r\n return str.charAt(0).toUpperCase() + str.slice(1);\r\n});\r\n// compare whether a value has changed, accounting for NaN.\r\nconst hasChanged = (value, oldValue) => value !== oldValue && (value === value || oldValue === oldValue);\r\nconst def = (obj, key, value) => {\r\n Object.defineProperty(obj, key, {\r\n configurable: true,\r\n value\r\n });\r\n};\r\n\r\n//vue-rx\r\nconst targetMap = new WeakMap();\r\nconst effectStack = [];\r\nlet activeEffect;\r\nconst ITERATE_KEY = Symbol( 'iterate' );\r\nconst MAP_KEY_ITERATE_KEY = Symbol( 'Map key iterate' );\r\nfunction isEffect(fn) {\r\n return fn && fn._isEffect === true;\r\n}\r\nfunction effect(fn, options = EMPTY_OBJ) {\r\n if (isEffect(fn)) {\r\n fn = fn.raw;\r\n }\r\n const effect = createReactiveEffect(fn, options);\r\n if (!options.lazy) {\r\n effect();\r\n }\r\n return effect;\r\n}\r\nfunction stop(effect) {\r\n if (effect.active) {\r\n cleanup(effect);\r\n if (effect.options.onStop) {\r\n effect.options.onStop();\r\n }\r\n effect.active = false;\r\n }\r\n}\r\nlet uid = 0;\r\nfunction createReactiveEffect(fn, options) {\r\n const effect = function reactiveEffect(...args) {\r\n if (!effect.active) {\r\n return options.scheduler ? undefined : fn(...args);\r\n }\r\n if (!effectStack.includes(effect)) {\r\n cleanup(effect);\r\n try {\r\n enableTracking();\r\n effectStack.push(effect);\r\n activeEffect = effect;\r\n return fn(...args);\r\n }\r\n finally {\r\n effectStack.pop();\r\n resetTracking();\r\n activeEffect = effectStack[effectStack.length - 1];\r\n }\r\n }\r\n };\r\n effect.id = uid++;\r\n effect._isEffect = true;\r\n effect.active = true;\r\n effect.raw = fn;\r\n effect.deps = [];\r\n effect.options = options;\r\n return effect;\r\n}\r\nfunction cleanup(effect) {\r\n const { deps } = effect;\r\n if (deps.length) {\r\n for (let i = 0; i < deps.length; i++) {\r\n deps[i].delete(effect);\r\n }\r\n deps.length = 0;\r\n }\r\n}\r\nlet shouldTrack = true;\r\nconst trackStack = [];\r\nfunction pauseTracking() {\r\n trackStack.push(shouldTrack);\r\n shouldTrack = false;\r\n}\r\nfunction enableTracking() {\r\n trackStack.push(shouldTrack);\r\n shouldTrack = true;\r\n}\r\nfunction resetTracking() {\r\n const last = trackStack.pop();\r\n shouldTrack = last === undefined ? true : last;\r\n}\r\nfunction track(target, type, key) {\r\n if (!shouldTrack || activeEffect === undefined) {\r\n return;\r\n }\r\n let depsMap = targetMap.get(target);\r\n if (!depsMap) {\r\n targetMap.set(target, (depsMap = new Map()));\r\n }\r\n let dep = depsMap.get(key);\r\n if (!dep) {\r\n depsMap.set(key, (dep = new Set()));\r\n }\r\n if (!dep.has(activeEffect)) {\r\n dep.add(activeEffect);\r\n activeEffect.deps.push(dep);\r\n if ( activeEffect.options.onTrack) {\r\n activeEffect.options.onTrack({\r\n effect: activeEffect,\r\n target,\r\n type,\r\n key\r\n });\r\n }\r\n }\r\n}\r\nfunction trigger(target, type, key, newValue, oldValue, oldTarget) {\r\n const depsMap = targetMap.get(target);\r\n if (!depsMap) {\r\n // never been tracked\r\n return;\r\n }\r\n const effects = new Set();\r\n const computedRunners = new Set();\r\n const add = (effectsToAdd) => {\r\n if (effectsToAdd) {\r\n effectsToAdd.forEach(effect => {\r\n if (effect !== activeEffect || !shouldTrack) {\r\n if (effect.options.computed) {\r\n computedRunners.add(effect);\r\n }\r\n else {\r\n effects.add(effect);\r\n }\r\n }\r\n });\r\n }\r\n };\r\n if (type === \"clear\" /* CLEAR */) {\r\n // collection being cleared\r\n // trigger all effects for target\r\n depsMap.forEach(add);\r\n }\r\n else if (key === 'length' && isArray(target)) {\r\n depsMap.forEach((dep, key) => {\r\n if (key === 'length' || key >= newValue) {\r\n add(dep);\r\n }\r\n });\r\n }\r\n else {\r\n // schedule runs for SET | ADD | DELETE\r\n if (key !== void 0) {\r\n add(depsMap.get(key));\r\n }\r\n // also run for iteration key on ADD | DELETE | Map.SET\r\n const isAddOrDelete = type === \"add\" /* ADD */ ||\r\n (type === \"delete\" /* DELETE */ && !isArray(target));\r\n if (isAddOrDelete ||\r\n (type === \"set\" /* SET */ && target instanceof Map)) {\r\n add(depsMap.get(isArray(target) ? 'length' : ITERATE_KEY));\r\n }\r\n if (isAddOrDelete && target instanceof Map) {\r\n add(depsMap.get(MAP_KEY_ITERATE_KEY));\r\n }\r\n }\r\n const run = (effect) => {\r\n if ( effect.options.onTrigger) {\r\n effect.options.onTrigger({\r\n effect,\r\n target,\r\n key,\r\n type,\r\n newValue,\r\n oldValue,\r\n oldTarget\r\n });\r\n }\r\n if (effect.options.scheduler) {\r\n effect.options.scheduler(effect);\r\n }\r\n else {\r\n effect();\r\n }\r\n };\r\n // Important: computed effects must be run first so that computed getters\r\n // can be invalidated before any normal effects that depend on them are run.\r\n computedRunners.forEach(run);\r\n effects.forEach(run);\r\n}\r\n\r\nconst builtInSymbols = new Set(Object.getOwnPropertyNames(Symbol)\r\n .map(key => Symbol[key])\r\n .filter(isSymbol));\r\nconst get = /*#__PURE__*/ createGetter();\r\nconst shallowGet = /*#__PURE__*/ createGetter(false, true);\r\nconst readonlyGet = /*#__PURE__*/ createGetter(true);\r\nconst shallowReadonlyGet = /*#__PURE__*/ createGetter(true, true);\r\nconst arrayInstrumentations = {};\r\n['includes', 'indexOf', 'lastIndexOf'].forEach(key => {\r\n arrayInstrumentations[key] = function (...args) {\r\n const arr = toRaw(this);\r\n for (let i = 0, l = this.length; i < l; i++) {\r\n track(arr, \"get\" /* GET */, i + '');\r\n }\r\n // we run the method using the original args first (which may be reactive)\r\n const res = arr[key](...args);\r\n if (res === -1 || res === false) {\r\n // if that didn't work, run it again using raw values.\r\n return arr[key](...args.map(toRaw));\r\n }\r\n else {\r\n return res;\r\n }\r\n };\r\n});\r\nfunction createGetter(isReadonly = false, shallow = false) {\r\n return function get(target, key, receiver) {\r\n if (key === \"__v_isReactive\" /* isReactive */) {\r\n return !isReadonly;\r\n }\r\n else if (key === \"__v_isReadonly\" /* isReadonly */) {\r\n return isReadonly;\r\n }\r\n else if (key === \"__v_raw\" /* raw */) {\r\n return target;\r\n }\r\n const targetIsArray = isArray(target);\r\n if (targetIsArray && hasOwn(arrayInstrumentations, key)) {\r\n return Reflect.get(arrayInstrumentations, key, receiver);\r\n }\r\n const res = Reflect.get(target, key, receiver);\r\n if (isSymbol(key) && builtInSymbols.has(key) || key === '__proto__') {\r\n return res;\r\n }\r\n if (shallow) {\r\n !isReadonly && track(target, \"get\" /* GET */, key);\r\n return res;\r\n }\r\n if (isRef(res)) {\r\n if (targetIsArray) {\r\n !isReadonly && track(target, \"get\" /* GET */, key);\r\n return res;\r\n }\r\n else {\r\n // ref unwrapping, only for Objects, not for Arrays.\r\n return res.value;\r\n }\r\n }\r\n !isReadonly && track(target, \"get\" /* GET */, key);\r\n return isObject(res)\r\n ? isReadonly\r\n ? // need to lazy access readonly and reactive here to avoid\r\n // circular dependency\r\n readonly(res)\r\n : reactive(res)\r\n : res;\r\n };\r\n}\r\nconst set = /*#__PURE__*/ createSetter();\r\nconst shallowSet = /*#__PURE__*/ createSetter(true);\r\nfunction createSetter(shallow = false) {\r\n return function set(target, key, value, receiver) {\r\n const oldValue = target[key];\r\n if (!shallow) {\r\n value = toRaw(value);\r\n if (!isArray(target) && isRef(oldValue) && !isRef(value)) {\r\n oldValue.value = value;\r\n return true;\r\n }\r\n }\r\n const hadKey = hasOwn(target, key);\r\n const result = Reflect.set(target, key, value, receiver);\r\n // don't trigger if target is something up in the prototype chain of original\r\n if (target === toRaw(receiver)) {\r\n if (!hadKey) {\r\n trigger(target, \"add\" /* ADD */, key, value);\r\n }\r\n else if (hasChanged(value, oldValue)) {\r\n trigger(target, \"set\" /* SET */, key, value, oldValue);\r\n }\r\n }\r\n return result;\r\n };\r\n}\r\nfunction deleteProperty(target, key) {\r\n const hadKey = hasOwn(target, key);\r\n const oldValue = target[key];\r\n const result = Reflect.deleteProperty(target, key);\r\n if (result && hadKey) {\r\n trigger(target, \"delete\" /* DELETE */, key, undefined, oldValue);\r\n }\r\n return result;\r\n}\r\nfunction has(target, key) {\r\n const result = Reflect.has(target, key);\r\n track(target, \"has\" /* HAS */, key);\r\n return result;\r\n}\r\nfunction ownKeys(target) {\r\n track(target, \"iterate\" /* ITERATE */, ITERATE_KEY);\r\n return Reflect.ownKeys(target);\r\n}\r\nconst mutableHandlers = {\r\n get,\r\n set,\r\n deleteProperty,\r\n has,\r\n ownKeys\r\n};\r\nconst readonlyHandlers = {\r\n get: readonlyGet,\r\n has,\r\n ownKeys,\r\n set(target, key) {\r\n {\r\n console.warn(`Set operation on key \"${String(key)}\" failed: target is readonly.`, target);\r\n }\r\n return true;\r\n },\r\n deleteProperty(target, key) {\r\n {\r\n console.warn(`Delete operation on key \"${String(key)}\" failed: target is readonly.`, target);\r\n }\r\n return true;\r\n }\r\n};\r\nconst shallowReactiveHandlers = {\r\n ...mutableHandlers,\r\n get: shallowGet,\r\n set: shallowSet\r\n};\r\n// Props handlers are special in the sense that it should not unwrap top-level\r\n// refs (in order to allow refs to be explicitly passed down), but should\r\n// retain the reactivity of the normal readonly object.\r\nconst shallowReadonlyHandlers = {\r\n ...readonlyHandlers,\r\n get: shallowReadonlyGet\r\n};\r\n\r\nconst toReactive = (value) => isObject(value) ? reactive(value) : value;\r\nconst toReadonly = (value) => isObject(value) ? readonly(value) : value;\r\nconst getProto = (v) => Reflect.getPrototypeOf(v);\r\nfunction get$1(target, key, wrap) {\r\n target = toRaw(target);\r\n const rawKey = toRaw(key);\r\n if (key !== rawKey) {\r\n track(target, \"get\" /* GET */, key);\r\n }\r\n track(target, \"get\" /* GET */, rawKey);\r\n const { has, get } = getProto(target);\r\n if (has.call(target, key)) {\r\n return wrap(get.call(target, key));\r\n }\r\n else if (has.call(target, rawKey)) {\r\n return wrap(get.call(target, rawKey));\r\n }\r\n}\r\nfunction has$1(key) {\r\n const target = toRaw(this);\r\n const rawKey = toRaw(key);\r\n if (key !== rawKey) {\r\n track(target, \"has\" /* HAS */, key);\r\n }\r\n track(target, \"has\" /* HAS */, rawKey);\r\n const has = getProto(target).has;\r\n return has.call(target, key) || has.call(target, rawKey);\r\n}\r\nfunction size(target) {\r\n target = toRaw(target);\r\n track(target, \"iterate\" /* ITERATE */, ITERATE_KEY);\r\n return Reflect.get(getProto(target), 'size', target);\r\n}\r\nfunction add(value) {\r\n value = toRaw(value);\r\n const target = toRaw(this);\r\n const proto = getProto(target);\r\n const hadKey = proto.has.call(target, value);\r\n const result = proto.add.call(target, value);\r\n if (!hadKey) {\r\n trigger(target, \"add\" /* ADD */, value, value);\r\n }\r\n return result;\r\n}\r\nfunction set$1(key, value) {\r\n value = toRaw(value);\r\n const target = toRaw(this);\r\n const { has, get, set } = getProto(target);\r\n let hadKey = has.call(target, key);\r\n if (!hadKey) {\r\n key = toRaw(key);\r\n hadKey = has.call(target, key);\r\n }\r\n else {\r\n checkIdentityKeys(target, has, key);\r\n }\r\n const oldValue = get.call(target, key);\r\n const result = set.call(target, key, value);\r\n if (!hadKey) {\r\n trigger(target, \"add\" /* ADD */, key, value);\r\n }\r\n else if (hasChanged(value, oldValue)) {\r\n trigger(target, \"set\" /* SET */, key, value, oldValue);\r\n }\r\n return result;\r\n}\r\nfunction deleteEntry(key) {\r\n const target = toRaw(this);\r\n const { has, get, delete: del } = getProto(target);\r\n let hadKey = has.call(target, key);\r\n if (!hadKey) {\r\n key = toRaw(key);\r\n hadKey = has.call(target, key);\r\n }\r\n else {\r\n checkIdentityKeys(target, has, key);\r\n }\r\n const oldValue = get ? get.call(target, key) : undefined;\r\n // forward the operation before queueing reactions\r\n const result = del.call(target, key);\r\n if (hadKey) {\r\n trigger(target, \"delete\" /* DELETE */, key, undefined, oldValue);\r\n }\r\n return result;\r\n}\r\nfunction clear() {\r\n const target = toRaw(this);\r\n const hadItems = target.size !== 0;\r\n const oldTarget = target instanceof Map\r\n ? new Map(target)\r\n : new Set(target)\r\n ;\r\n // forward the operation before queueing reactions\r\n const result = getProto(target).clear.call(target);\r\n if (hadItems) {\r\n trigger(target, \"clear\" /* CLEAR */, undefined, undefined, oldTarget);\r\n }\r\n return result;\r\n}\r\nfunction createForEach(isReadonly) {\r\n return function forEach(callback, thisArg) {\r\n const observed = this;\r\n const target = toRaw(observed);\r\n const wrap = isReadonly ? toReadonly : toReactive;\r\n !isReadonly && track(target, \"iterate\" /* ITERATE */, ITERATE_KEY);\r\n // important: create sure the callback is\r\n // 1. invoked with the reactive map as `this` and 3rd arg\r\n // 2. the value received should be a corresponding reactive/readonly.\r\n function wrappedCallback(value, key) {\r\n return callback.call(thisArg, wrap(value), wrap(key), observed);\r\n }\r\n return getProto(target).forEach.call(target, wrappedCallback);\r\n };\r\n}\r\nfunction createIterableMethod(method, isReadonly) {\r\n return function (...args) {\r\n const target = toRaw(this);\r\n const isMap = target instanceof Map;\r\n const isPair = method === 'entries' || (method === Symbol.iterator && isMap);\r\n const isKeyOnly = method === 'keys' && isMap;\r\n const innerIterator = getProto(target)[method].apply(target, args);\r\n const wrap = isReadonly ? toReadonly : toReactive;\r\n !isReadonly &&\r\n track(target, \"iterate\" /* ITERATE */, isKeyOnly ? MAP_KEY_ITERATE_KEY : ITERATE_KEY);\r\n // return a wrapped iterator which returns observed versions of the\r\n // values emitted from the real iterator\r\n return {\r\n // iterator protocol\r\n next() {\r\n const { value, done } = innerIterator.next();\r\n return done\r\n ? { value, done }\r\n : {\r\n value: isPair ? [wrap(value[0]), wrap(value[1])] : wrap(value),\r\n done\r\n };\r\n },\r\n // iterable protocol\r\n [Symbol.iterator]() {\r\n return this;\r\n }\r\n };\r\n };\r\n}\r\nfunction createReadonlyMethod(type) {\r\n return function (...args) {\r\n {\r\n const key = args[0] ? `on key \"${args[0]}\" ` : ``;\r\n console.warn(`${capitalize(type)} operation ${key}failed: target is readonly.`, toRaw(this));\r\n }\r\n return type === \"delete\" /* DELETE */ ? false : this;\r\n };\r\n}\r\nconst mutableInstrumentations = {\r\n get(key) {\r\n return get$1(this, key, toReactive);\r\n },\r\n get size() {\r\n return size(this);\r\n },\r\n has: has$1,\r\n add,\r\n set: set$1,\r\n delete: deleteEntry,\r\n clear,\r\n forEach: createForEach(false)\r\n};\r\nconst readonlyInstrumentations = {\r\n get(key) {\r\n return get$1(this, key, toReadonly);\r\n },\r\n get size() {\r\n return size(this);\r\n },\r\n has: has$1,\r\n add: createReadonlyMethod(\"add\" /* ADD */),\r\n set: createReadonlyMethod(\"set\" /* SET */),\r\n delete: createReadonlyMethod(\"delete\" /* DELETE */),\r\n clear: createReadonlyMethod(\"clear\" /* CLEAR */),\r\n forEach: createForEach(true)\r\n};\r\nconst iteratorMethods = ['keys', 'values', 'entries', Symbol.iterator];\r\niteratorMethods.forEach(method => {\r\n mutableInstrumentations[method] = createIterableMethod(method, false);\r\n readonlyInstrumentations[method] = createIterableMethod(method, true);\r\n});\r\nfunction createInstrumentationGetter(isReadonly) {\r\n const instrumentations = isReadonly\r\n ? readonlyInstrumentations\r\n : mutableInstrumentations;\r\n return (target, key, receiver) => {\r\n if (key === \"__v_isReactive\" /* isReactive */) {\r\n return !isReadonly;\r\n }\r\n else if (key === \"__v_isReadonly\" /* isReadonly */) {\r\n return isReadonly;\r\n }\r\n else if (key === \"__v_raw\" /* raw */) {\r\n return target;\r\n }\r\n return Reflect.get(hasOwn(instrumentations, key) && key in target\r\n ? instrumentations\r\n : target, key, receiver);\r\n };\r\n}\r\nconst mutableCollectionHandlers = {\r\n get: createInstrumentationGetter(false)\r\n};\r\nconst readonlyCollectionHandlers = {\r\n get: createInstrumentationGetter(true)\r\n};\r\nfunction checkIdentityKeys(target, has, key) {\r\n const rawKey = toRaw(key);\r\n if (rawKey !== key && has.call(target, rawKey)) {\r\n const type = toRawType(target);\r\n console.warn(`Reactive ${type} contains both the raw and reactive ` +\r\n `versions of the same object${type === `Map` ? `as keys` : ``}, ` +\r\n `which can lead to inconsistencies. ` +\r\n `Avoid differentiating between the raw and reactive versions ` +\r\n `of an object and only use the reactive version if possible.`);\r\n }\r\n}\r\n\r\nconst collectionTypes = new Set([Set, Map, WeakMap, WeakSet]);\r\nconst isObservableType = /*#__PURE__*/ makeMap('Object,Array,Map,Set,WeakMap,WeakSet');\r\nconst canObserve = (value) => {\r\n return (!value.__v_skip &&\r\n isObservableType(toRawType(value)) &&\r\n !Object.isFrozen(value));\r\n};\r\nfunction reactive(target) {\r\n // if trying to observe a readonly proxy, return the readonly version.\r\n if (target && target.__v_isReadonly) {\r\n return target;\r\n }\r\n return createReactiveObject(target, false, mutableHandlers, mutableCollectionHandlers);\r\n}\r\n// Return a reactive-copy of the original object, where only the root level\r\n// properties are reactive, and does NOT unwrap refs nor recursively convert\r\n// returned properties.\r\nfunction shallowReactive(target) {\r\n return createReactiveObject(target, false, shallowReactiveHandlers, mutableCollectionHandlers);\r\n}\r\nfunction readonly(target) {\r\n return createReactiveObject(target, true, readonlyHandlers, readonlyCollectionHandlers);\r\n}\r\n// Return a reactive-copy of the original object, where only the root level\r\n// properties are readonly, and does NOT unwrap refs nor recursively convert\r\n// returned properties.\r\n// This is used for creating the props proxy object for stateful components.\r\nfunction shallowReadonly(target) {\r\n return createReactiveObject(target, true, shallowReadonlyHandlers, readonlyCollectionHandlers);\r\n}\r\nfunction createReactiveObject(target, isReadonly, baseHandlers, collectionHandlers) {\r\n if (!isObject(target)) {\r\n {\r\n console.warn(`value cannot be made reactive: ${String(target)}`);\r\n }\r\n return target;\r\n }\r\n // target is already a Proxy, return it.\r\n // exception: calling readonly() on a reactive object\r\n if (target.__v_raw && !(isReadonly && target.__v_isReactive)) {\r\n return target;\r\n }\r\n // target already has corresponding Proxy\r\n if (hasOwn(target, isReadonly ? \"__v_readonly\" /* readonly */ : \"__v_reactive\" /* reactive */)) {\r\n return isReadonly ? target.__v_readonly : target.__v_reactive;\r\n }\r\n // only a whitelist of value types can be observed.\r\n if (!canObserve(target)) {\r\n return target;\r\n }\r\n const observed = new Proxy(target, collectionTypes.has(target.constructor) ? collectionHandlers : baseHandlers);\r\n def(target, isReadonly ? \"__v_readonly\" /* readonly */ : \"__v_reactive\" /* reactive */, observed);\r\n return observed;\r\n}\r\nfunction isReactive(value) {\r\n if (isReadonly(value)) {\r\n return isReactive(value.__v_raw);\r\n }\r\n return !!(value && value.__v_isReactive);\r\n}\r\nfunction isReadonly(value) {\r\n return !!(value && value.__v_isReadonly);\r\n}\r\nfunction isProxy(value) {\r\n return isReactive(value) || isReadonly(value);\r\n}\r\nfunction toRaw(observed) {\r\n return (observed && toRaw(observed.__v_raw)) || observed;\r\n}\r\nfunction markRaw(value) {\r\n def(value, \"__v_skip\" /* skip */, true);\r\n return value;\r\n}\r\n\r\nconst convert = (val) => isObject(val) ? reactive(val) : val;\r\nfunction isRef(r) {\r\n return r ? r.__v_isRef === true : false;\r\n}\r\nfunction ref(value) {\r\n return createRef(value);\r\n}\r\nfunction shallowRef(value) {\r\n return createRef(value, true);\r\n}\r\nfunction createRef(rawValue, shallow = false) {\r\n if (isRef(rawValue)) {\r\n return rawValue;\r\n }\r\n let value = shallow ? rawValue : convert(rawValue);\r\n const r = {\r\n __v_isRef: true,\r\n get value() {\r\n track(r, \"get\" /* GET */, 'value');\r\n return value;\r\n },\r\n set value(newVal) {\r\n if (hasChanged(toRaw(newVal), rawValue)) {\r\n rawValue = newVal;\r\n value = shallow ? newVal : convert(newVal);\r\n trigger(r, \"set\" /* SET */, 'value', { newValue: newVal } );\r\n }\r\n }\r\n };\r\n return r;\r\n}\r\nfunction triggerRef(ref) {\r\n trigger(ref, \"set\" /* SET */, 'value', { newValue: ref.value } );\r\n}\r\nfunction unref(ref) {\r\n return isRef(ref) ? ref.value : ref;\r\n}\r\nfunction customRef(factory) {\r\n const { get, set } = factory(() => track(r, \"get\" /* GET */, 'value'), () => trigger(r, \"set\" /* SET */, 'value'));\r\n const r = {\r\n __v_isRef: true,\r\n get value() {\r\n return get();\r\n },\r\n set value(v) {\r\n set(v);\r\n }\r\n };\r\n return r;\r\n}\r\nfunction toRefs(object) {\r\n if ( !isProxy(object)) {\r\n console.warn(`toRefs() expects a reactive object but received a plain one.`);\r\n }\r\n const ret = {};\r\n for (const key in object) {\r\n ret[key] = toRef(object, key);\r\n }\r\n return ret;\r\n}\r\nfunction toRef(object, key) {\r\n return {\r\n __v_isRef: true,\r\n get value() {\r\n return object[key];\r\n },\r\n set value(newVal) {\r\n object[key] = newVal;\r\n }\r\n };\r\n}\r\n\r\nfunction computed(getterOrOptions) {\r\n let getter;\r\n let setter;\r\n if (isFunction(getterOrOptions)) {\r\n getter = getterOrOptions;\r\n setter = () => {\r\n console.warn('Write operation failed: computed value is readonly');\r\n }\r\n ;\r\n }\r\n else {\r\n getter = getterOrOptions.get;\r\n setter = getterOrOptions.set;\r\n }\r\n let dirty = true;\r\n let value;\r\n let computed;\r\n const runner = effect(getter, {\r\n lazy: true,\r\n // mark effect as computed so that it gets priority during trigger\r\n computed: true,\r\n scheduler: () => {\r\n if (!dirty) {\r\n dirty = true;\r\n trigger(computed, \"set\" /* SET */, 'value');\r\n }\r\n }\r\n });\r\n computed = {\r\n __v_isRef: true,\r\n // expose effect so computed can be stopped\r\n effect: runner,\r\n get value() {\r\n if (dirty) {\r\n value = runner();\r\n dirty = false;\r\n }\r\n track(computed, \"get\" /* GET */, 'value');\r\n return value;\r\n },\r\n set value(newValue) {\r\n setter(newValue);\r\n }\r\n };\r\n return computed;\r\n}\r\n\r\nfunction createSignal(value) {\r\n const r = shallowRef(value);\r\n return [() => r.value, v => r.value = v];\r\n}\r\n\r\nfunction createRoot(fn) { return fn(); }\r\n\r\nmodule.exports = {\r\n createSignal,\r\n createRoot,\r\n createComputed: effect\r\n};" }, { "path": "packages/solid/bench/prototypes/message-noarray.cjs", "content": "const equalFn = (a, b) => a === b;\nconst signalOptions = {\n equals: equalFn\n};\nlet runEffects = runQueue;\nconst UNOWNED = {\n owned: null,\n cleanups: null,\n context: null,\n owner: null\n};\nvar Owner = null;\nlet Listener = null;\nlet Effects = null;\nlet ExecCount = 0;\nfunction createRoot(fn, detachedOwner) {\n detachedOwner && (Owner = detachedOwner);\n const listener = Listener,\n owner = Owner,\n root =\n fn.length === 0 && !false\n ? UNOWNED\n : {\n owned: null,\n cleanups: null,\n context: null,\n owner\n };\n Owner = root;\n Listener = null;\n let result;\n try {\n runUpdates(() => (result = fn(() => cleanNode(root))));\n } finally {\n Listener = listener;\n Owner = owner;\n }\n return result;\n}\nfunction createSignal(value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const s = {\n value,\n observer: null,\n observerSlot: 0,\n observers: null,\n observerSlots: null,\n comparator: options.equals || undefined\n };\n return [\n () => {\n if (Listener !== null) logRead(s);\n return s.value;\n },\n value => {\n if (typeof value === \"function\") {\n value = value(s.value);\n }\n if (writeSignal(s, value) && (s.observer || s.observers)) {\n markDownstream(s, false, true, true);\n runUpdates(() => runImmediate(s));\n }\n return value;\n }\n ];\n}\nfunction createComputed(fn, value) {\n updateComputation(createComputation(fn, value, true), true);\n}\nfunction createMemo(fn, value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const c = createComputation(fn, value, true);\n c.observer = null;\n c.observerSlot = 0;\n c.observers = null;\n c.observerSlots = null;\n c.comparator = options.equals || undefined;\n updateComputation(c);\n return () => {\n if (c.source) updateNode(c);\n if (Listener !== null) logRead(c);\n return c.value;\n };\n}\n\nfunction batch(fn) {\n return runUpdates(fn);\n}\nfunction untrack(fn) {\n let result,\n listener = Listener;\n Listener = null;\n result = fn();\n Listener = listener;\n return result;\n}\nfunction logRead(node) {\n let to = Listener,\n fromslot,\n toslot = to.source === null ? -1 : to.sources === null ? 0 : to.sources.length;\n if (node.observer === null) {\n node.observer = to;\n node.observerSlot = toslot;\n fromslot = -1;\n } else if (node.observerSlots === null) {\n if (node.observer === to) return node.value;\n node.observers = [to];\n node.observerSlots = [toslot];\n fromslot = 0;\n } else {\n fromslot = node.observerSlots.length;\n node.observers.push(to);\n node.observerSlots.push(toslot);\n }\n if (to.source === null) {\n to.source = node;\n to.sourceSlot = fromslot;\n } else if (to.sources === null) {\n to.sources = [node];\n to.sourceSlots = [fromslot];\n } else {\n to.sources.push(node);\n to.sourceSlots.push(fromslot);\n }\n}\nfunction writeSignal(node, value) {\n if (node.comparator && node.comparator(node.value, value)) return;\n node.value = value;\n return true;\n}\nfunction updateComputation(node, init) {\n if (!node.fn) return;\n cleanNode(node);\n const owner = Owner,\n listener = Listener,\n time = ExecCount;\n Listener = Owner = node;\n runComputation(node, node.value, time);\n Listener = listener;\n Owner = owner;\n}\nfunction runComputation(node, value, time) {\n let nextValue;\n nextValue = node.fn(value);\n if (!node.updatedAt || node.updatedAt <= time) {\n if (node.observer || (node.observers && node.observers.length)) {\n markDownstream(node, !writeSignal(node, nextValue));\n runImmediate(node);\n } else node.value = nextValue;\n node.updatedAt = time;\n }\n}\nfunction createComputation(fn, init, pure, options) {\n const c = {\n fn,\n stale: 0,\n ready: 0,\n updatedAt: 0,\n owned: null,\n source: null,\n sourceSlot: 0,\n sources: null,\n sourceSlots: null,\n cleanups: null,\n value: init,\n owner: Owner,\n context: null,\n pure\n };\n if (Owner === null);\n else if (Owner !== UNOWNED) {\n if (!Owner.owned) Owner.owned = [c];\n else Owner.owned.push(c);\n }\n return c;\n}\nfunction runTop(node) {\n let ancestors = node;\n while ((node = node.owner) && (!node.updatedAt || node.updatedAt < ExecCount)) {\n if (node.stale) {\n if (!ancestors.length) ancestors = [node];\n ancestors.push(node);\n }\n }\n if (!ancestors.length) return updateNode(ancestors);\n for (let i = ancestors.length - 1; i >= 0; i--) {\n updateNode(ancestors[i]);\n }\n}\nfunction runUpdates(fn) {\n let wait = false;\n if (Effects) wait = true;\n else Effects = [];\n ExecCount++;\n try {\n const res = fn();\n completeUpdates(wait);\n return res;\n } finally {\n if (!wait) Effects = null;\n }\n}\nfunction completeUpdates(wait) {\n if (wait) return;\n const e = Effects;\n Effects = null;\n if (e.length) runUpdates(() => runEffects(e));\n}\nfunction runQueue(queue) {\n for (let i = 0; i < queue.length; i++) queue[i].stale && runTop(queue[i]);\n}\nfunction lookUpstream(node) {\n if (node.source) {\n lookUpstreamNode(node.source);\n }\n if (node.sources) {\n for (let i = 0; i < node.sources.length; i += 1) {\n lookUpstreamNode(node.sources[i]);\n }\n }\n}\nfunction lookUpstreamNode(node) {\n if (node.source || node.sources) {\n if (node.stale === node.ready) runTop(node);\n else if (node.stale) lookUpstream(node);\n }\n}\nfunction markDownstream(node, decrease, stale, top) {\n if (node.observer) {\n markDownstreamNode(node.observer, decrease, stale, top);\n }\n if (node.observers) {\n for (let i = 0; i < node.observers.length; i += 1) {\n markDownstreamNode(node.observers[i], decrease, stale, top);\n }\n }\n}\nfunction markDownstreamNode(o, decrease, stale, top) {\n if (stale) {\n if (top) o.ready++;\n !o.stale++ && (o.observer || o.observers) && markDownstream(o, false, true);\n } else if (decrease) o.stale && o.stale--;\n else if (o.stale) o.ready++;\n}\nfunction runImmediate(node) {\n let observers;\n if (node.observers && node.observers.length) observers = [...node.observers];\n if (node.observer) runNode(node.observer);\n if (observers) {\n for (let i = 0; i < observers.length; i += 1) {\n runNode(observers[i]);\n }\n }\n}\nfunction runNode(node) {\n if (node.stale === node.ready && node.updatedAt < ExecCount) {\n if (node.stale) {\n if (node.pure) runTop(node);\n else Effects.push(node);\n } else if (node.observer || (node.observers && node.observers.length)) {\n markDownstream(node, true);\n runImmediate(node);\n }\n }\n}\nfunction updateNode(node) {\n if (node.stale) {\n if (node.stale === node.ready) {\n updateComputation(node);\n } else lookUpstream(node);\n }\n}\nfunction cleanNode(node) {\n let i;\n if (node.source != null) {\n cleanupSource(node.source, node.sourceSlot);\n node.source = null;\n }\n if (node.sources != null) {\n for (let i = 0, len = node.sources.length; i < len; i++) {\n cleanupSource(node.sources.pop(), node.sourceSlots.pop());\n }\n }\n if (node.owned) {\n for (i = 0; i < node.owned.length; i++) cleanNode(node.owned[i]);\n node.owned = null;\n }\n if (node.cleanups) {\n for (i = 0; i < node.cleanups.length; i++) node.cleanups[i]();\n node.cleanups = null;\n }\n node.stale = node.ready = 0;\n node.context = null;\n}\n\nfunction cleanupSource(source, slot) {\n let nodes = source.observers,\n nodeslots = source.observerSlots,\n last,\n lastslot;\n if (slot === -1) {\n source.observer = null;\n } else {\n last = nodes.pop();\n lastslot = nodeslots.pop();\n if (slot !== nodes.length) {\n nodes[slot] = last;\n nodeslots[slot] = lastslot;\n if (lastslot === -1) {\n last.sourceSlot = slot;\n } else {\n last.sourceSlots[lastslot] = slot;\n }\n }\n }\n}\n\nexports.createComputed = createComputed;\nexports.createMemo = createMemo;\nexports.createRoot = createRoot;\nexports.createSignal = createSignal;\nexports.batch = batch;\n" }, { "path": "packages/solid/bench/prototypes/message.cjs", "content": "const equalFn = (a, b) => a === b;\nconst signalOptions = {\n equals: equalFn\n};\nlet runEffects = runQueue;\nconst UNOWNED = {\n owned: null,\n cleanups: null,\n context: null,\n owner: null\n};\nvar Owner = null;\nlet Listener = null;\nlet Effects = null;\nlet ExecCount = 0;\nfunction createRoot(fn, detachedOwner) {\n detachedOwner && (Owner = detachedOwner);\n const listener = Listener,\n owner = Owner,\n root =\n fn.length === 0 && !false\n ? UNOWNED\n : {\n owned: null,\n cleanups: null,\n context: null,\n owner\n };\n Owner = root;\n Listener = null;\n let result;\n try {\n runUpdates(() => (result = fn(() => cleanNode(root))));\n } finally {\n Listener = listener;\n Owner = owner;\n }\n return result;\n}\nfunction createSignal(value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const s = {\n value,\n observers: null,\n observerSlots: null,\n comparator: options.equals || undefined\n };\n return [\n readSignal.bind(s),\n value => {\n if (typeof value === \"function\") {\n value = value(s.value);\n }\n if (writeSignal(s, value) && s.observers && s.observers.length) {\n runUpdates(() => {\n markDownstream(s, false, true, true);\n runImmediate(s);\n });\n }\n return value;\n }\n ];\n}\nfunction createComputed(fn, value) {\n updateComputation(createComputation(fn, value, true));\n}\nfunction createMemo(fn, value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const c = createComputation(fn, value, true);\n c.observers = null;\n c.observerSlots = null;\n c.comparator = options.equals || undefined;\n updateComputation(c);\n return readSignal.bind(c);\n}\n\nfunction batch(fn) {\n return runUpdates(fn);\n}\nfunction untrack(fn) {\n let result,\n listener = Listener;\n Listener = null;\n result = fn();\n Listener = listener;\n return result;\n}\nfunction readSignal() {\n if (this.sources) updateNode(this);\n if (Listener) {\n const sSlot = this.observers ? this.observers.length : 0;\n if (!Listener.sources) {\n Listener.sources = [this];\n Listener.sourceSlots = [sSlot];\n } else {\n Listener.sources.push(this);\n Listener.sourceSlots.push(sSlot);\n }\n if (!this.observers) {\n this.observers = [Listener];\n this.observerSlots = [Listener.sources.length - 1];\n } else {\n this.observers.push(Listener);\n this.observerSlots.push(Listener.sources.length - 1);\n }\n }\n return this.value;\n}\nfunction writeSignal(node, value) {\n if (node.comparator && node.comparator(node.value, value)) return;\n node.value = value;\n return true;\n}\nfunction updateComputation(node) {\n if (!node.fn) return;\n cleanNode(node);\n const owner = Owner,\n listener = Listener,\n time = ExecCount;\n Listener = Owner = node;\n runComputation(node, node.value, time);\n Listener = listener;\n Owner = owner;\n}\nfunction runComputation(node, value, time) {\n let nextValue;\n nextValue = node.fn(value);\n if (!node.updatedAt || node.updatedAt <= time) {\n if (node.observers && node.observers.length) {\n markDownstream(node, !writeSignal(node, nextValue));\n runImmediate(node);\n } else node.value = nextValue;\n node.updatedAt = time;\n }\n}\nfunction createComputation(fn, init, pure, options) {\n const c = {\n fn,\n stale: 0,\n ready: 0,\n updatedAt: 0,\n owned: null,\n sources: null,\n sourceSlots: null,\n cleanups: null,\n value: init,\n owner: Owner,\n context: null,\n pure\n };\n if (Owner === null);\n else if (Owner !== UNOWNED) {\n if (!Owner.owned) Owner.owned = [c];\n else Owner.owned.push(c);\n }\n return c;\n}\nfunction runTop(node) {\n let ancestors = node;\n while ((node = node.owner) && (!node.updatedAt || node.updatedAt < ExecCount)) {\n if (node.stale) {\n if (!ancestors.length) ancestors = [node];\n ancestors.push(node);\n }\n }\n if (!ancestors.length) return updateNode(ancestors);\n for (let i = ancestors.length - 1; i >= 0; i--) {\n updateNode(ancestors[i]);\n }\n}\nfunction runUpdates(fn) {\n let wait = false;\n if (Effects) wait = true;\n else Effects = [];\n ExecCount++;\n try {\n const res = fn();\n completeUpdates(wait);\n return res;\n } finally {\n if (!wait) Effects = null;\n }\n}\nfunction completeUpdates(wait) {\n if (wait) return;\n const e = Effects;\n Effects = null;\n if (e.length) runUpdates(() => runEffects(e));\n}\nfunction runQueue(queue) {\n for (let i = 0; i < queue.length; i++) queue[i].stale && runTop(queue[i]);\n}\nfunction lookUpstream(node) {\n for (let i = 0; i < node.sources.length; i += 1) {\n const source = node.sources[i];\n if (source.sources) {\n if (source.stale === source.ready) runTop(source);\n else if (source.stale) lookUpstream(source);\n }\n }\n}\nfunction markDownstream(node, decrease, stale, top) {\n for (let i = 0; i < node.observers.length; i += 1) {\n const o = node.observers[i];\n if (stale) {\n if (top) o.ready++;\n !o.stale++ && o.observers && o.observers.length && markDownstream(o, false, true);\n } else if (decrease) o.stale && o.stale--;\n else o.ready++;\n }\n}\nfunction runImmediate(node) {\n if (node.observers.length === 1) {\n return runNode(node.observers[0]);\n }\n const clone = [...node.observers];\n for (let i = 0; i < clone.length; i += 1) {\n runNode(clone[i]);\n }\n}\nfunction runNode(node) {\n if (node.stale === node.ready) {\n if (node.stale) {\n if (node.pure) runTop(node);\n else Effects.push(node);\n } else if (node.observers && node.observers.length) {\n markDownstream(node, true);\n runImmediate(node);\n }\n }\n}\nfunction updateNode(node) {\n if (node.stale) {\n if (node.stale === node.ready) {\n updateComputation(node);\n } else lookUpstream(node);\n }\n}\nfunction cleanNode(node) {\n let i;\n if (node.sources) {\n while (node.sources.length) {\n const source = node.sources.pop(),\n index = node.sourceSlots.pop(),\n obs = source.observers;\n if (obs && obs.length) {\n const n = obs.pop(),\n s = source.observerSlots.pop();\n if (index < obs.length) {\n n.sourceSlots[s] = index;\n obs[index] = n;\n source.observerSlots[index] = s;\n }\n }\n }\n }\n if (node.owned) {\n for (i = 0; i < node.owned.length; i++) cleanNode(node.owned[i]);\n node.owned = null;\n }\n if (node.cleanups) {\n for (i = 0; i < node.cleanups.length; i++) node.cleanups[i]();\n node.cleanups = null;\n }\n node.stale = node.ready = 0;\n node.context = null;\n}\n\nexports.createComputed = createComputed;\nexports.createMemo = createMemo;\nexports.createRoot = createRoot;\nexports.createSignal = createSignal;\nexports.batch = batch;\n" }, { "path": "packages/solid/bench/prototypes/queue-noarray.cjs", "content": "const equalFn = (a, b) => a === b;\nconst signalOptions = {\n equals: equalFn\n};\nlet ERROR = null;\nlet runEffects = runQueue;\nconst STALE = 1;\nconst PENDING = 2;\nconst UNOWNED = {\n owned: null,\n cleanups: null,\n context: null,\n owner: null\n};\nvar Owner = null;\nlet Listener = null;\nlet Updates = null;\nlet Effects = null;\nlet ExecCount = 0;\nfunction createRoot(fn, detachedOwner) {\n detachedOwner && (Owner = detachedOwner);\n const listener = Listener,\n owner = Owner,\n root =\n fn.length === 0 && !false\n ? UNOWNED\n : {\n owned: null,\n cleanups: null,\n context: null,\n owner\n };\n Owner = root;\n Listener = null;\n let result;\n try {\n runUpdates(() => (result = fn(() => cleanNode(root))), true);\n } finally {\n Listener = listener;\n Owner = owner;\n }\n return result;\n}\nfunction createSignal(value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const s = {\n value,\n observer: null,\n observerSlot: 0,\n observers: null,\n observerSlots: null,\n comparator: options.equals || undefined\n };\n return [\n () => {\n if (Listener) logRead(s);\n return s.value;\n },\n value => {\n if (typeof value === \"function\") {\n value = value(s.value);\n }\n return writeSignal(s, value);\n }\n ];\n}\nfunction createComputed(fn, value) {\n updateComputation(createComputation(fn, value, true, STALE));\n}\nfunction createMemo(fn, value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const c = createComputation(fn, value, true, 0);\n c.observer = null;\n c.observerSlot = 0;\n c.observers = null;\n c.observerSlots = null;\n c.comparator = options.equals || undefined;\n updateComputation(c);\n return () => {\n if (c.state && (c.source || c.sources)) {\n const updates = Updates;\n Updates = null;\n c.state === STALE ? updateComputation(c) : lookUpstream(c);\n Updates = updates;\n }\n if (Listener) logRead(c);\n return c.value;\n };\n}\n\nfunction batch(fn) {\n return runUpdates(fn, false);\n}\nfunction untrack(fn) {\n let result,\n listener = Listener;\n Listener = null;\n result = fn();\n Listener = listener;\n return result;\n}\n\nfunction logRead(node) {\n let to = Listener,\n fromslot,\n toslot = to.source === null ? -1 : to.sources === null ? 0 : to.sources.length;\n if (node.observer === null) {\n node.observer = to;\n node.observerSlot = toslot;\n fromslot = -1;\n } else if (node.observerSlots === null) {\n if (node.observer === to) return node.value;\n node.observers = [to];\n node.observerSlots = [toslot];\n fromslot = 0;\n } else {\n fromslot = node.observerSlots.length;\n node.observers.push(to);\n node.observerSlots.push(toslot);\n }\n if (to.source === null) {\n to.source = node;\n to.sourceSlot = fromslot;\n } else if (to.sources === null) {\n to.sources = [node];\n to.sourceSlots = [fromslot];\n } else {\n to.sources.push(node);\n to.sourceSlots.push(fromslot);\n }\n}\nfunction writeSignal(node, value) {\n if (node.comparator) {\n if (node.comparator(node.value, value)) return value;\n }\n node.value = value;\n if (node.observer || (node.observers && node.observers.length)) {\n runUpdates(() => {\n if (node.observer) queueUpdates(node.observer);\n if (node.observers) {\n for (let i = 0; i < node.observers.length; i += 1) queueUpdates(node.observers[i]);\n }\n if (Updates.length > 10e5) {\n Updates = [];\n throw new Error();\n }\n }, false);\n }\n return value;\n}\nfunction queueUpdates(o) {\n if (!o.state) {\n if (o.pure) Updates.push(o);\n else Effects.push(o);\n if (o.observer || o.observers) markDownstream(o);\n }\n o.state = STALE;\n}\n\nfunction updateComputation(node) {\n if (!node.fn) return;\n cleanNode(node);\n const owner = Owner,\n listener = Listener,\n time = ExecCount;\n Listener = Owner = node;\n runComputation(node, node.value, time);\n Listener = listener;\n Owner = owner;\n}\nfunction runComputation(node, value, time) {\n let nextValue;\n nextValue = node.fn(value);\n if (!node.updatedAt || node.updatedAt <= time) {\n if (node.updatedAt && \"observers\" in node) {\n writeSignal(node, nextValue);\n } else node.value = nextValue;\n node.updatedAt = time;\n }\n}\nfunction createComputation(fn, init, pure, state = STALE, options) {\n const c = {\n fn,\n state: state,\n updatedAt: null,\n owned: null,\n source: null,\n sourceSlot: 0,\n sources: null,\n sourceSlots: null,\n cleanups: null,\n value: init,\n owner: Owner,\n context: null,\n pure\n };\n if (Owner === null);\n else if (Owner !== UNOWNED) {\n if (!Owner.owned) Owner.owned = [c];\n else Owner.owned.push(c);\n }\n return c;\n}\nfunction runTop(node) {\n if (node.state === 0) return;\n if (node.state === PENDING) return lookUpstream(node);\n const ancestors = [node];\n while ((node = node.owner) && (!node.updatedAt || node.updatedAt < ExecCount)) {\n if (node.state) ancestors.push(node);\n }\n for (let i = ancestors.length - 1; i >= 0; i--) {\n node = ancestors[i];\n if (node.state === STALE) {\n updateComputation(node);\n } else if (node.state === PENDING) {\n const updates = Updates;\n Updates = null;\n lookUpstream(node);\n Updates = updates;\n }\n }\n}\nfunction runUpdates(fn, init) {\n if (Updates) return fn();\n let wait = false;\n if (!init) Updates = [];\n if (Effects) wait = true;\n else Effects = [];\n ExecCount++;\n try {\n const res = fn();\n completeUpdates(wait);\n return res;\n } finally {\n Updates = null;\n if (!wait) Effects = null;\n }\n}\nfunction completeUpdates(wait) {\n if (Updates) {\n runQueue(Updates);\n Updates = null;\n }\n if (wait) return;\n const e = Effects;\n Effects = null;\n if (e.length) runUpdates(() => runEffects(e), false);\n}\nfunction runQueue(queue) {\n for (let i = 0; i < queue.length; i++) runTop(queue[i]);\n}\nfunction lookUpstream(node) {\n node.state = 0;\n if (node.source) lookUpstreamNode(node.source)\n if (node.sources) {\n for (let i = 0; i < node.sources.length; i += 1) {\n lookUpstream(node.sources[i]);\n }\n }\n}\nfunction lookUpstreamNode(source) {\n if (source.source || source.sources) {\n if (source.state === STALE) runTop(source);\n else if (source.state === PENDING) lookUpstream(source);\n }\n}\nfunction markDownstream(node) {\n if (node.observer) markDownstreamNode(node.observer);\n if (node.observers) {\n for (let i = 0; i < node.observers.length; i += 1) markDownstreamNode(node.observers[i]);\n }\n}\nfunction markDownstreamNode(o) {\n if (!o.state) {\n o.state = PENDING;\n if (o.pure) Updates.push(o);\n else Effects.push(o);\n (o.observer || o.observers) && markDownstream(o);\n }\n}\nfunction cleanNode(node) {\n let i;\n if (node.source != null) {\n cleanupSource(node.source, node.sourceSlot);\n node.source = null;\n }\n if (node.sources != null) {\n for (let i = 0, len = node.sources.length; i < len; i++) {\n cleanupSource(node.sources.pop(), node.sourceSlots.pop());\n }\n }\n if (node.owned) {\n for (i = 0; i < node.owned.length; i++) cleanNode(node.owned[i]);\n node.owned = null;\n }\n if (node.cleanups) {\n for (i = 0; i < node.cleanups.length; i++) node.cleanups[i]();\n node.cleanups = null;\n }\n node.state = 0;\n node.context = null;\n}\nfunction cleanupSource(source, slot) {\n let nodes = source.observers,\n nodeslots = source.observerSlots,\n last,\n lastslot;\n if (slot === -1) {\n source.observer = null;\n } else {\n last = nodes.pop();\n lastslot = nodeslots.pop();\n if (slot !== nodes.length) {\n nodes[slot] = last;\n nodeslots[slot] = lastslot;\n if (lastslot === -1) {\n last.sourceSlot = slot;\n } else {\n last.sourceSlots[lastslot] = slot;\n }\n }\n }\n}\nexports.createComputed = createComputed;\nexports.createMemo = createMemo;\nexports.createRoot = createRoot;\nexports.createSignal = createSignal;\nexports.batch = batch;\n" }, { "path": "packages/solid/bench/prototypes/queue.cjs", "content": "const equalFn = (a, b) => a === b;\nconst signalOptions = {\n equals: equalFn\n};\nlet ERROR = null;\nlet runEffects = runQueue;\nconst STALE = 1;\nconst PENDING = 2;\nconst UNOWNED = {\n owned: null,\n cleanups: null,\n context: null,\n owner: null\n};\nvar Owner = null;\nlet Listener = null;\nlet Updates = null;\nlet Effects = null;\nlet ExecCount = 0;\nfunction createRoot(fn, detachedOwner) {\n detachedOwner && (Owner = detachedOwner);\n const listener = Listener,\n owner = Owner,\n root =\n fn.length === 0 && !false\n ? UNOWNED\n : {\n owned: null,\n cleanups: null,\n context: null,\n owner\n };\n Owner = root;\n Listener = null;\n let result;\n try {\n runUpdates(() => (result = fn(() => cleanNode(root))), true);\n } finally {\n Listener = listener;\n Owner = owner;\n }\n return result;\n}\nfunction createSignal(value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const s = {\n value,\n observers: null,\n observerSlots: null,\n comparator: options.equals || undefined\n };\n return [\n readSignal.bind(s),\n value => {\n if (typeof value === \"function\") {\n value = value(s.value);\n }\n return writeSignal(s, value);\n }\n ];\n}\nfunction createComputed(fn, value) {\n updateComputation(createComputation(fn, value, true, STALE));\n}\nfunction createMemo(fn, value, options) {\n options = options ? Object.assign({}, signalOptions, options) : signalOptions;\n const c = createComputation(fn, value, true, 0);\n c.observers = null;\n c.observerSlots = null;\n c.comparator = options.equals || undefined;\n updateComputation(c);\n return readSignal.bind(c);\n}\n\nfunction batch(fn) {\n return runUpdates(fn, false);\n}\nfunction untrack(fn) {\n let result,\n listener = Listener;\n Listener = null;\n result = fn();\n Listener = listener;\n return result;\n}\n\nfunction readSignal() {\n if (this.state && this.sources) {\n const updates = Updates;\n Updates = null;\n this.state === STALE ? updateComputation(this) : lookUpstream(this);\n Updates = updates;\n }\n if (Listener) {\n const sSlot = this.observers ? this.observers.length : 0;\n if (!Listener.sources) {\n Listener.sources = [this];\n Listener.sourceSlots = [sSlot];\n } else {\n Listener.sources.push(this);\n Listener.sourceSlots.push(sSlot);\n }\n if (!this.observers) {\n this.observers = [Listener];\n this.observerSlots = [Listener.sources.length - 1];\n } else {\n this.observers.push(Listener);\n this.observerSlots.push(Listener.sources.length - 1);\n }\n }\n return this.value;\n}\nfunction writeSignal(node, value, isComp) {\n if (node.comparator) {\n if (node.comparator(node.value, value)) return value;\n }\n node.value = value;\n if (node.observers && node.observers.length) {\n runUpdates(() => {\n for (let i = 0; i < node.observers.length; i += 1) {\n const o = node.observers[i];\n if (!o.state) {\n if (o.pure) Updates.push(o);\n else Effects.push(o);\n if (o.observers) markDownstream(o);\n }\n o.state = STALE;\n }\n if (Updates.length > 10e5) {\n Updates = [];\n throw new Error();\n }\n }, false);\n }\n return value;\n}\nfunction updateComputation(node) {\n if (!node.fn) return;\n cleanNode(node);\n const owner = Owner,\n listener = Listener,\n time = ExecCount;\n Listener = Owner = node;\n runComputation(node, node.value, time);\n Listener = listener;\n Owner = owner;\n}\nfunction runComputation(node, value, time) {\n let nextValue;\n nextValue = node.fn(value);\n if (!node.updatedAt || node.updatedAt <= time) {\n if (node.updatedAt != null && \"observers\" in node) {\n writeSignal(node, nextValue, true);\n } else node.value = nextValue;\n node.updatedAt = time;\n }\n}\nfunction createComputation(fn, init, pure, state = STALE, options) {\n const c = {\n fn,\n state: state,\n updatedAt: null,\n owned: null,\n sources: null,\n sourceSlots: null,\n cleanups: null,\n value: init,\n owner: Owner,\n context: null,\n pure\n };\n if (Owner === null);\n else if (Owner !== UNOWNED) {\n if (!Owner.owned) Owner.owned = [c];\n else Owner.owned.push(c);\n }\n return c;\n}\nfunction runTop(node) {\n if (node.state === 0) return;\n if (node.state === PENDING) return lookUpstream(node);\n const ancestors = [node];\n while ((node = node.owner) && (!node.updatedAt || node.updatedAt < ExecCount)) {\n if (node.state) ancestors.push(node);\n }\n for (let i = ancestors.length - 1; i >= 0; i--) {\n node = ancestors[i];\n if (node.state === STALE) {\n updateComputation(node);\n } else if (node.state === PENDING) {\n const updates = Updates;\n Updates = null;\n lookUpstream(node);\n Updates = updates;\n }\n }\n}\nfunction runUpdates(fn, init) {\n if (Updates) return fn();\n let wait = false;\n if (!init) Updates = [];\n if (Effects) wait = true;\n else Effects = [];\n ExecCount++;\n try {\n const res = fn();\n completeUpdates(wait);\n return res;\n } finally {\n Updates = null;\n if (!wait) Effects = null;\n }\n}\nfunction completeUpdates(wait) {\n if (Updates) {\n runQueue(Updates);\n Updates = null;\n }\n if (wait) return;\n const e = Effects;\n Effects = null;\n if (e.length) runUpdates(() => runEffects(e), false);\n}\nfunction runQueue(queue) {\n for (let i = 0; i < queue.length; i++) runTop(queue[i]);\n}\nfunction lookUpstream(node) {\n node.state = 0;\n for (let i = 0; i < node.sources.length; i += 1) {\n const source = node.sources[i];\n if (source.sources) {\n if (source.state === STALE) runTop(source);\n else if (source.state === PENDING) lookUpstream(source);\n }\n }\n}\nfunction markDownstream(node) {\n for (let i = 0; i < node.observers.length; i += 1) {\n const o = node.observers[i];\n if (!o.state) {\n o.state = PENDING;\n if (o.pure) Updates.push(o);\n else Effects.push(o);\n o.observers && markDownstream(o);\n }\n }\n}\nfunction cleanNode(node) {\n let i;\n if (node.sources) {\n while (node.sources.length) {\n const source = node.sources.pop(),\n index = node.sourceSlots.pop(),\n obs = source.observers;\n if (obs && obs.length) {\n const n = obs.pop(),\n s = source.observerSlots.pop();\n if (index < obs.length) {\n n.sourceSlots[s] = index;\n obs[index] = n;\n source.observerSlots[index] = s;\n }\n }\n }\n }\n if (node.owned) {\n for (i = 0; i < node.owned.length; i++) cleanNode(node.owned[i]);\n node.owned = null;\n }\n if (node.cleanups) {\n for (i = 0; i < node.cleanups.length; i++) node.cleanups[i]();\n node.cleanups = null;\n }\n node.state = 0;\n node.context = null;\n}\nexports.createComputed = createComputed;\nexports.createMemo = createMemo;\nexports.createRoot = createRoot;\nexports.createSignal = createSignal;\nexports.batch = batch;\n" }, { "path": "packages/solid/bench/results.md", "content": "# Benchmark Results (22/09/2022)\n\nThis benchmark is mostly to serve Solid's own R&D. Everything is coerced to Solid's API shape as that is a necessity here. While most libraries presented are unsuitable for Solid's rendering because of missing features/capabilities it is still useful to help gauge where the implementations fall. In most UI libraries you'd be bringing in overhead from a VDOM or other rendering model where Solid's reactivity takes the brunt of that cost.\n\n## Released Libraries\n\n### Solid\nThis is Solid's production build with Transitions and Timeslicing. Look below to see equivalent pure reactive approach.\n\n```\ncreateDataSignals: 6\ncreateComputations0to1: 5\ncreateComputations1to1: 18\ncreateComputations2to1: 16\ncreateComputations4to1: 8\ncreateComputations1000to1: 7\ncreateComputations1to2: 24\ncreateComputations1to4: 17\ncreateComputations1to8: 17\ncreateComputations1to1000: 33\ncreate total: 151\n---\nupdateComputations1to1: 31\nupdateComputations2to1: 20\nupdateComputations4to1: 15\nupdateComputations1000to1: 28\nupdateComputations1to2: 27\nupdateComputations1to4: 28\nupdateComputations1to1000: 26\nupdate total: 176\ntotal: 327\n```\n\n### S.js\n\n```\ncreateDataSignals: 4\ncreateComputations0to1: 3\ncreateComputations1to1: 15\ncreateComputations2to1: 13\ncreateComputations4to1: 15\ncreateComputations1000to1: 16\ncreateComputations1to2: 16\ncreateComputations1to4: 15\ncreateComputations1to8: 10\ncreateComputations1to1000: 9\ncreate total: 116\n---\nupdateComputations1to1: 18\nupdateComputations2to1: 14\nupdateComputations4to1: 11\nupdateComputations1000to1: 19\nupdateComputations1to2: 18\nupdateComputations1to4: 19\nupdateComputations1to1000: 15\nupdate total: 115\ntotal: 232\n```\n\n### Kairo\n\n```\ncreateDataSignals: 7\ncreateComputations0to1: 5\ncreateComputations1to1: 19\ncreateComputations2to1: 21\ncreateComputations4to1: 13\ncreateComputations1000to1: 6\ncreateComputations1to2: 24\ncreateComputations1to4: 16\ncreateComputations1to8: 16\ncreateComputations1to1000: 27\ncreate total: 153\n---\nupdateComputations1to1: 19\nupdateComputations2to1: 14\nupdateComputations4to1: 11\nupdateComputations1000to1: 13\nupdateComputations1to2: 22\nupdateComputations1to4: 20\nupdateComputations1to1000: 20\nupdate total: 120\ntotal: 273\n```\n\n### Preact Signals\n\n```\ncreateDataSignals: 11\ncreateComputations0to1: 6\ncreateComputations1to1: 18\ncreateComputations2to1: 13\ncreateComputations4to1: 11\ncreateComputations1000to1: 9\ncreateComputations1to2: 15\ncreateComputations1to4: 14\ncreateComputations1to8: 16\ncreateComputations1to1000: 22\ncreate total: 135\n---\nupdateComputations1to1: 24\nupdateComputations2to1: 14\nupdateComputations4to1: 16\nupdateComputations1000to1: 20\nupdateComputations1to2: 21\nupdateComputations1to4: 21\nupdateComputations1to1000: 18\nupdate total: 134\ntotal: 269\n```\n\n### usignal\n\n```\ncreateDataSignals: 20\ncreateComputations0to1: 12\ncreateComputations1to1: 35\ncreateComputations2to1: 23\ncreateComputations4to1: 17\ncreateComputations1000to1: 11\ncreateComputations1to2: 32\ncreateComputations1to4: 30\ncreateComputations1to8: 51\ncreateComputations1to1000: 54\ncreate total: 284\n---\nupdateComputations1to1: 50\nupdateComputations2to1: 31\nupdateComputations4to1: 23\nupdateComputations1000to1: 38\nupdateComputations1to2: 43\nupdateComputations1to4: 42\nupdateComputations1to1000: 45\nupdate total: 272\ntotal: 556\n```\n\n### @vue/reactivity\n\n```\ncreateDataSignals: 35\ncreateComputations0to1: 14\ncreateComputations1to1: 82\ncreateComputations2to1: 60\ncreateComputations4to1: 51\ncreateComputations1000to1: 42\ncreateComputations1to2: 60\ncreateComputations1to4: 49\ncreateComputations1to8: 46\ncreateComputations1to1000: 51\ncreate total: 491\n---\nupdateComputations1to1: 138\nupdateComputations2to1: 91\nupdateComputations4to1: 65\nupdateComputations1000to1: 119\nupdateComputations1to2: 111\nupdateComputations1to4: 101\nupdateComputations1to1000: 107\nupdate total: 732\ntotal: 1222\n```\n\n### Sinuous\n\n```\ncreateDataSignals: 20\ncreateComputations0to1: 53\ncreateComputations1to1: 53\ncreateComputations2to1: 35\ncreateComputations4to1: 26\ncreateComputations1000to1: 45\ncreateComputations1to2: 51\ncreateComputations1to4: 55\ncreateComputations1to8: 72\ncreateComputations1to1000: 62\ncreate total: 472\n---\nupdateComputations1to1: 114\nupdateComputations2to1: 69\nupdateComputations4to1: 46\nupdateComputations1000to1: 61\nupdateComputations1to2: 86\nupdateComputations1to4: 82\nupdateComputations1to1000: 87\nupdate total: 546\ntotal: 1018\n```\n\n## Mods of other Libraries\n\n### S.js mod\nModified to allow conditional notification of memos\n\n```\ncreateDataSignals: 4\ncreateComputations0to1: 4\ncreateComputations1to1: 12\ncreateComputations2to1: 7\ncreateComputations4to1: 7\ncreateComputations1000to1: 6\ncreateComputations1to2: 11\ncreateComputations1to4: 15\ncreateComputations1to8: 10\ncreateComputations1to1000: 17\ncreate total: 93\n---\nupdateComputations1to1: 27\nupdateComputations2to1: 17\nupdateComputations4to1: 11\nupdateComputations1000to1: 21\nupdateComputations1to2: 33\nupdateComputations1to4: 25\nupdateComputations1to1000: 21\nupdate total: 155\ntotal: 248\n```\n\n### Sinuous-mod\n\n```\ncreateDataSignals: 14\ncreateComputations0to1: 25\ncreateComputations1to1: 36\ncreateComputations2to1: 24\ncreateComputations4to1: 22\ncreateComputations1000to1: 51\ncreateComputations1to2: 37\ncreateComputations1to4: 40\ncreateComputations1to8: 36\ncreateComputations1to1000: 47\ncreate total: 332\n---\nupdateComputations1to1: 91\nupdateComputations2to1: 59\nupdateComputations4to1: 45\nupdateComputations1000to1: 87\nupdateComputations1to2: 65\nupdateComputations1to4: 57\nupdateComputations1to1000: 71\nupdate total: 475\ntotal: 807\n```\n\n### RVal Mod\n\n```\ncreateDataSignals: 13\ncreateComputations0to1: 29\ncreateComputations1to1: 63\ncreateComputations2to1: 40\ncreateComputations4to1: 35\ncreateComputations1000to1: 15\ncreateComputations1to2: 62\ncreateComputations1to4: 86\ncreateComputations1to8: 83\ncreateComputations1to1000: 91\ncreate total: 517\n---\nupdateComputations1to1: 195\nupdateComputations2to1: 116\nupdateComputations4to1: 77\nupdateComputations1000to1: 110\nupdateComputations1to2: 180\nupdateComputations1to4: 169\nupdateComputations1to1000: 164\nupdate total: 1011\ntotal: 1527\n```\n\n## Solid Prototypes\n\nThese are raw implementations that I use for designing Solid. Solid has overhead due to Transitions/Timeslicing and other features that are important to the framework so it's nice to look at the raw implementation. Typically it's about a 10% performance improvement.\n\nNo Array optimization is nice but adds about 30 LoC. So far I haven't seen an impact in non-reactive based benchmarks. Ie.. things that render the actual DOM so haven't implemented it.\n\nMessage approaches are faster but it have deeper callstack, and doesn't play nice with time slicing. To be fair MobX also has this call stack limitation so it isn't a big deal unless doing absurd things like the CellX benchmark.\n\n### queue (current version of Solid)\n\nTypical queue approach. We use a queue so we can easily support Time Slicing.\n\n```\ncreateDataSignals: 5\ncreateComputations0to1: 4\ncreateComputations1to1: 17\ncreateComputations2to1: 15\ncreateComputations4to1: 7\ncreateComputations1000to1: 7\ncreateComputations1to2: 23\ncreateComputations1to4: 17\ncreateComputations1to8: 17\ncreateComputations1to1000: 31\ncreate total: 143\n---\nupdateComputations1to1: 26\nupdateComputations2to1: 19\nupdateComputations4to1: 13\nupdateComputations1000to1: 28\nupdateComputations1to2: 24\nupdateComputations1to4: 24\nupdateComputations1to1000: 23\nupdate total: 158\ntotal: 300\n```\n\n### queue-noarray\n\nArray optimization on Queue approach\n\n```\ncreateDataSignals: 6\ncreateComputations0to1: 4\ncreateComputations1to1: 13\ncreateComputations2to1: 8\ncreateComputations4to1: 7\ncreateComputations1000to1: 7\ncreateComputations1to2: 13\ncreateComputations1to4: 16\ncreateComputations1to8: 11\ncreateComputations1to1000: 10\ncreate total: 95\n---\nupdateComputations1to1: 24\nupdateComputations2to1: 17\nupdateComputations4to1: 14\nupdateComputations1000to1: 18\nupdateComputations1to2: 22\nupdateComputations1to4: 21\nupdateComputations1to1000: 19\nupdate total: 136\ntotal: 231\n```\n\n### message\n\nInspired by MobX algorithm.\n\n```\ncreateDataSignals: 5\ncreateComputations0to1: 3\ncreateComputations1to1: 17\ncreateComputations2to1: 15\ncreateComputations4to1: 7\ncreateComputations1000to1: 7\ncreateComputations1to2: 24\ncreateComputations1to4: 17\ncreateComputations1to8: 17\ncreateComputations1to1000: 32\ncreate total: 144\n---\nupdateComputations1to1: 19\nupdateComputations2to1: 14\nupdateComputations4to1: 11\nupdateComputations1000to1: 26\nupdateComputations1to2: 24\nupdateComputations1to4: 23\nupdateComputations1to1000: 22\nupdate total: 138\ntotal: 282\n```\n\n### message-noarray\nMobX algorithm inspired + array optimized. Currently this is the fastest approach I have.\n\n```\ncreateDataSignals: 6\ncreateComputations0to1: 4\ncreateComputations1to1: 13\ncreateComputations2to1: 7\ncreateComputations4to1: 8\ncreateComputations1000to1: 6\ncreateComputations1to2: 14\ncreateComputations1to4: 17\ncreateComputations1to8: 11\ncreateComputations1to1000: 11\ncreate total: 97\n---\nupdateComputations1to1: 15\nupdateComputations2to1: 13\nupdateComputations4to1: 11\nupdateComputations1000to1: 18\nupdateComputations1to2: 20\nupdateComputations1to4: 21\nupdateComputations1to1000: 18\nupdate total: 115\ntotal: 212\n```\n" }, { "path": "packages/solid/h/README.md", "content": "# Solid HyperScript\n\nThis sub module provides a HyperScript method for Solid. This is useful to use Solid in non-compiled environments or in some environments where you can only use a standard JSX transform. This method can be used as the JSX factory function.\n\nHyperScript function takes a few forms. The 2nd props argument is optional. Children may be passed as either an array to the 2nd/3rd argument or as every argument past the 2nd.\n\n```js\n// create an element with a title attribute\nh(\"button\", { title: \"My button\" }, \"Click Me\")\n\n// create a component with a title prop\nh(Button, { title: \"My button\" }, \"Click Me\")\n\n// create an element with many children\nh(\"div\", { title: \"My button\" }, h(\"span\", \"1\"), h(\"span\", \"2\"), h(\"span\", \"3\"))\n```\n\nThis is the least efficient way to use Solid as it requires a slightly larger runtime that isn't treeshakeable, and cannot leverage anything in the way of analysis, so it requires manual wrapping of expressions and has a few other caveats (see below).\n\n## Example\n\n```js\nimport { render } from \"solid-js/web\";\nimport h from \"solid-js/h\";\nimport { createSignal } from \"solid-js\";\n\nfunction Button(props) {\n return h(\"button.btn-primary\", props)\n}\n\nfunction Counter() {\n const [count, setCount] = createSignal(0);\n const increment = (e) => setCount(c => c + 1);\n\n return h(Button, { type: \"button\", onClick: increment }, count);\n}\n\nrender(Counter, document.getElementById(\"app\"));\n```\n\n## Differences from JSX\n\nThere are a few differences from Solid's JSX that are important to note. And also apply when attempting use any transformation that would compile to HyperScript.\n\n1. Reactive expression must be manually wrapped in functions to be reactive.\n\n```js\n// jsx\n
{firstName() + lastName()}
\n\n// hyperscript\nh(\"div\", { id: () => props.id }, () => firstName() + lastName())\n```\n\n2. Merging spreads requires using the merge props helper to keep reactivity\n\n```js\n// jsx\n
\n\n// hyperscript\nimport { mergeProps } from \"solid-js\"\n\nh(\"div\", mergeProps({ class: selectedClass }, props))\n```\n\n3. Events on components require explicit event in the arguments\n\nSolid's HyperScript automatically wraps functions passed to props of components with no arguments in getters so you need to provide one to prevent this. The same applies to render props like in the `` component.\n\n```js\n// good\nh(Button, { onClick: (e) => console.log(\"Hi\")});\n\n// bad\nh(Button, { onClick: () => console.log(\"Hi\")})\n```\n\n4. All refs are callback form\n\nWe can't do the compiled assignment trick so only the callback form is supported.\n\n```js\nlet myEl;\n\nh(div, { ref: (el) => myEl = el });\n```\n\n5. There is a shorthand for static id and classes\n\n```js\nh(\"div#some-id.my-class\")\n```\n\n6. Fragments are just arrays\n\n```js\n[h(\"span\", \"1\"), h(\"span\", \"2\")]\n```\n" }, { "path": "packages/solid/h/jsx-dev-runtime/package.json", "content": "{\n \"name\": \"solid-js/h/jsx-dev-runtime\",\n \"main\": \"../jsx-runtime/dist/jsx.cjs\",\n \"module\": \"../jsx-runtime/dist/jsx.js\",\n \"types\": \"../jsx-runtime/types/index.d.ts\",\n \"type\": \"module\",\n \"sideEffects\": false\n}\n" }, { "path": "packages/solid/h/jsx-runtime/package.json", "content": "{\n \"name\": \"solid-js/h/jsx-runtime\",\n \"main\": \"./dist/jsx.cjs\",\n \"module\": \"./dist/jsx.js\",\n \"types\": \"./types/index.d.ts\",\n \"type\": \"module\",\n \"sideEffects\": false\n}\n" }, { "path": "packages/solid/h/jsx-runtime/src/index.ts", "content": "import h from \"solid-js/h\";\nexport type { JSX } from \"./jsx.d.ts\";\nimport type { JSX } from \"./jsx.d.ts\";\n\nfunction Fragment(props: { children: JSX.Element }) {\n return props.children;\n}\n\nfunction jsx(type: any, props: any) {\n return h(type, props);\n}\n\n// support React Transform in case someone really wants it for some reason\nexport { jsx, jsx as jsxs, jsx as jsxDEV, Fragment };\n" }, { "path": "packages/solid/h/jsx-runtime/tsconfig.json", "content": "{\n \"extends\": \"../../../../tsconfig.json\",\n \"compilerOptions\": {\n \"outDir\": \"./types\",\n \"baseUrl\": \"src\",\n \"paths\": {\n \"solid-js/h\": [\"../..\"]\n }\n },\n \"include\": [\"./src\"]\n}\n" }, { "path": "packages/solid/h/package.json", "content": "{\n \"name\": \"solid-js/h\",\n \"main\": \"./dist/h.cjs\",\n \"module\": \"./dist/h.js\",\n \"types\": \"./types/index.d.ts\",\n \"type\": \"module\",\n \"sideEffects\": false\n}\n" }, { "path": "packages/solid/h/src/hyperscript.ts", "content": "export * from \"hyper-dom-expressions\";\n" }, { "path": "packages/solid/h/src/index.ts", "content": "import { createHyperScript } from \"./hyperscript.js\";\nimport type { HyperScript } from \"./hyperscript.js\";\nimport {\n spread,\n assign,\n insert,\n createComponent,\n dynamicProperty,\n SVGElements\n} from \"solid-js/web\";\n\nconst h: HyperScript = createHyperScript({\n spread,\n assign,\n insert,\n createComponent,\n dynamicProperty,\n SVGElements\n});\n\nexport default h;\n" }, { "path": "packages/solid/h/tsconfig.json", "content": "{\n \"extends\": \"../../../tsconfig.json\",\n \"compilerOptions\": {\n \"outDir\": \"./types\",\n \"baseUrl\": \"src\",\n \"paths\": {\n \"solid-js/web\": [\"../../web\"],\n \"solid-js\": [\"../..\"]\n }\n },\n \"include\": [\"./src\"],\n}\n" }, { "path": "packages/solid/html/README.md", "content": "# Solid Tagged Template Literals\n\nThis sub module provides a Tagged Template Literal `html` method for Solid. This is useful to use Solid in non-compiled environments. This method can be used as replacement for JSX.\n\n`html` uses `${}` to escape into JavaScript expressions. Components are closed with ``\n\n```js\n// create an element with a title attribute\nhtml``\n\n// create a component with a title prop\nhtml`<${Button} title=\"My button\">Click me`\n\n// create an element with dynamic attribute and spread\nhtml`
selectedClass()} ...${props} />`\n```\n\nUsing `html` is slightly less efficient than JSX(but more than HyperScript), requires a larger runtime that isn't treeshakeable, and cannot leverage expression analysis, so it requires manual wrapping of expressions and has a few other caveats (see below).\n\n## Example\n\n```js\nimport { render } from \"solid-js/web\";\nimport html from \"solid-js/html\";\nimport { createSignal } from \"solid-js\";\n\nfunction Button(props) {\n return html`
}>\n * {(item, index) =>
{item()}
}\n * \n * ```\n * If you have a list with changing indices, better use ``.\n *\n * @description https://docs.solidjs.com/reference/components/index-component\n */\nexport function Index(props: {\n each: T | undefined | null | false;\n fallback?: JSX.Element;\n children: (item: Accessor, index: number) => U;\n}) {\n const fallback = \"fallback\" in props && { fallback: () => props.fallback };\n return (IS_DEV\n ? createMemo(\n indexArray(() => props.each, props.children, fallback || undefined),\n undefined,\n { name: \"value\" }\n )\n : createMemo(\n indexArray(() => props.each, props.children, fallback || undefined)\n )) as unknown as JSX.Element;\n}\n\ntype RequiredParameter = T extends () => unknown ? never : T;\n/**\n * Conditionally render its children or an optional fallback component\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show<\n T,\n TRenderFunction extends (item: Accessor>) => JSX.Element\n>(props: {\n when: T | undefined | null | false;\n keyed?: false;\n fallback?: JSX.Element;\n children: JSX.Element | RequiredParameter;\n}): JSX.Element;\nexport function Show) => JSX.Element>(props: {\n when: T | undefined | null | false;\n keyed: true;\n fallback?: JSX.Element;\n children: JSX.Element | RequiredParameter;\n}): JSX.Element;\nexport function Show(props: {\n when: T | undefined | null | false;\n keyed?: boolean;\n fallback?: JSX.Element;\n children: JSX.Element | ((item: NonNullable | Accessor>) => JSX.Element);\n}): JSX.Element {\n const keyed = props.keyed;\n const conditionValue = createMemo(\n () => props.when,\n undefined,\n IS_DEV ? { name: \"condition value\" } : undefined\n );\n const condition = keyed\n ? conditionValue\n : createMemo(\n conditionValue,\n undefined,\n IS_DEV\n ? {\n equals: (a, b) => !a === !b,\n name: \"condition\"\n }\n : { equals: (a, b) => !a === !b }\n );\n return createMemo(\n () => {\n const c = condition();\n if (c) {\n const child = props.children;\n const fn = typeof child === \"function\" && child.length > 0;\n return fn\n ? untrack(() =>\n (child as any)(\n keyed\n ? (c as T)\n : () => {\n if (!untrack(condition)) throw narrowedError(\"Show\");\n return conditionValue();\n }\n )\n )\n : child;\n }\n return props.fallback;\n },\n undefined,\n IS_DEV ? { name: \"value\" } : undefined\n ) as unknown as JSX.Element;\n}\n\ntype EvalConditions = readonly [number, Accessor, MatchProps];\n\n/**\n * Switches between content based on mutually exclusive conditions\n * ```typescript\n * }>\n * \n * \n * \n * \n * \n * \n * \n * ```\n * @description https://docs.solidjs.com/reference/components/switch-and-match\n */\nexport function Switch(props: { fallback?: JSX.Element; children: JSX.Element }): JSX.Element {\n const chs = children(() => props.children);\n const switchFunc = createMemo(() => {\n const ch = chs() as unknown as MatchProps | MatchProps[];\n const mps = Array.isArray(ch) ? ch : [ch];\n let func: Accessor = () => undefined;\n for (let i = 0; i < mps.length; i++) {\n const index = i;\n const mp = mps[i];\n const prevFunc = func;\n const conditionValue = createMemo(\n () => (prevFunc() ? undefined : mp.when),\n undefined,\n IS_DEV ? { name: \"condition value\" } : undefined\n );\n const condition = mp.keyed\n ? conditionValue\n : createMemo(\n conditionValue,\n undefined,\n IS_DEV\n ? {\n equals: (a, b) => !a === !b,\n name: \"condition\"\n }\n : { equals: (a, b) => !a === !b }\n );\n func = () => prevFunc() || (condition() ? [index, conditionValue, mp] : undefined);\n }\n return func;\n });\n return createMemo(\n () => {\n const sel = switchFunc()();\n if (!sel) return props.fallback;\n const [index, conditionValue, mp] = sel;\n const child = mp.children;\n const fn = typeof child === \"function\" && child.length > 0;\n return fn\n ? untrack(() =>\n (child as any)(\n mp.keyed\n ? (conditionValue() as any)\n : () => {\n if (untrack(switchFunc)()?.[0] !== index) throw narrowedError(\"Match\");\n return conditionValue();\n }\n )\n )\n : child;\n },\n undefined,\n IS_DEV ? { name: \"eval conditions\" } : undefined\n ) as unknown as JSX.Element;\n}\n\nexport type MatchProps = {\n when: T | undefined | null | false;\n keyed?: boolean;\n children: JSX.Element | ((item: NonNullable | Accessor>) => JSX.Element);\n};\n/**\n * Selects a content based on condition when inside a `` control flow\n * ```typescript\n * \n * \n * \n * ```\n * @description https://docs.solidjs.com/reference/components/switch-and-match\n */\nexport function Match<\n T,\n TRenderFunction extends (item: Accessor>) => JSX.Element\n>(props: {\n when: T | undefined | null | false;\n keyed?: false;\n children: JSX.Element | RequiredParameter;\n}): JSX.Element;\nexport function Match) => JSX.Element>(props: {\n when: T | undefined | null | false;\n keyed: true;\n children: JSX.Element | RequiredParameter;\n}): JSX.Element;\nexport function Match(props: MatchProps) {\n return props as unknown as JSX.Element;\n}\n\nlet Errors: Set>;\nexport function resetErrorBoundaries() {\n Errors && [...Errors].forEach(fn => fn());\n}\n/**\n * Catches uncaught errors inside components and renders a fallback content\n *\n * Also supports a callback form that passes the error and a reset function:\n * ```typescript\n *
Error: {err.toString()}
\n * }>\n * \n * \n * ```\n * Errors thrown from the fallback can be caught by a parent ErrorBoundary\n *\n * @description https://docs.solidjs.com/reference/components/error-boundary\n */\nexport function ErrorBoundary(props: {\n fallback: JSX.Element | ((err: any, reset: () => void) => JSX.Element);\n children: JSX.Element;\n}): JSX.Element {\n let err;\n if (sharedConfig!.context && sharedConfig!.load)\n err = sharedConfig.load(sharedConfig.getContextId());\n const [errored, setErrored] = createSignal(err, IS_DEV ? { name: \"errored\" } : undefined);\n Errors || (Errors = new Set());\n Errors.add(setErrored);\n onCleanup(() => Errors.delete(setErrored));\n return createMemo(\n () => {\n let e: any;\n if ((e = errored())) {\n const f = props.fallback;\n if (IS_DEV && (typeof f !== \"function\" || f.length == 0)) console.error(e);\n return typeof f === \"function\" && f.length ? untrack(() => f(e, () => setErrored())) : f;\n }\n return catchError(() => props.children, setErrored);\n },\n undefined,\n IS_DEV ? { name: \"value\" } : undefined\n ) as unknown as JSX.Element;\n}\n" }, { "path": "packages/solid/src/render/hydration.ts", "content": "import { Computation } from \"../reactive/signal.js\";\n\nexport type HydrationContext = { id: string; count: number };\n\ntype SharedConfig = {\n context?: HydrationContext;\n resources?: { [key: string]: any };\n load?: (id: string) => Promise | any;\n has?: (id: string) => boolean;\n gather?: (key: string) => void;\n registry?: Map;\n done?: boolean;\n count?: number;\n effects?: Computation[];\n getContextId(): string;\n getNextContextId(): string;\n};\n\nexport const sharedConfig: SharedConfig = {\n context: undefined,\n registry: undefined,\n effects: undefined,\n done: false,\n getContextId() {\n return getContextId(this.context!.count);\n },\n getNextContextId() {\n return getContextId(this.context!.count++);\n }\n};\n\nfunction getContextId(count: number) {\n const num = String(count),\n len = num.length - 1;\n return sharedConfig.context!.id + (len ? String.fromCharCode(96 + len) : \"\") + num;\n}\n\nexport function setHydrateContext(context?: HydrationContext): void {\n sharedConfig.context = context;\n}\n\nexport function nextHydrateContext(): HydrationContext | undefined {\n return {\n ...sharedConfig.context,\n id: sharedConfig.getNextContextId(),\n count: 0\n };\n}\n" }, { "path": "packages/solid/src/render/index.ts", "content": "export * from \"./component.js\";\nexport * from \"./flow.js\";\nexport * from \"./Suspense.js\";\nexport { sharedConfig } from \"./hydration.js\";\n" }, { "path": "packages/solid/src/server/index.ts", "content": "export {\n catchError,\n createRoot,\n createSignal,\n createComputed,\n createRenderEffect,\n createEffect,\n createReaction,\n createDeferred,\n createSelector,\n createMemo,\n getListener,\n onMount,\n onCleanup,\n onError,\n untrack,\n batch,\n on,\n children,\n createContext,\n useContext,\n getOwner,\n runWithOwner,\n equalFn,\n requestCallback,\n mapArray,\n indexArray,\n observable,\n from,\n $PROXY,\n $DEVCOMP,\n $TRACK,\n DEV,\n enableExternalSource\n} from \"./reactive.js\";\n\nexport {\n mergeProps,\n splitProps,\n createComponent,\n For,\n Index,\n Show,\n Switch,\n Match,\n ErrorBoundary,\n Suspense,\n SuspenseList,\n createResource,\n resetErrorBoundaries,\n enableScheduling,\n enableHydration,\n startTransition,\n useTransition,\n createUniqueId,\n lazy,\n sharedConfig\n} from \"./rendering.js\";\n\nexport type { Component, Resource } from \"./rendering.js\";\n" }, { "path": "packages/solid/src/server/reactive.ts", "content": "import type { JSX } from \"../jsx.js\";\n\nexport const equalFn = (a: T, b: T) => a === b;\nexport const $PROXY = Symbol(\"solid-proxy\");\nexport const $TRACK = Symbol(\"solid-track\");\nexport const $DEVCOMP = Symbol(\"solid-dev-component\");\nexport const DEV = undefined;\n\nexport type Accessor = () => T;\nexport type Setter = undefined extends T\n ? (value?: (U extends Function ? never : U) | ((prev?: T) => U)) => U\n : (value: (U extends Function ? never : U) | ((prev: T) => U)) => U;\nexport type Signal = [get: Accessor, set: Setter];\n\nconst ERROR = Symbol(\"error\");\nexport function castError(err: unknown): Error {\n if (err instanceof Error) return err;\n return new Error(typeof err === \"string\" ? err : \"Unknown error\", { cause: err });\n}\n\nfunction handleError(err: unknown, owner = Owner): void {\n const fns = owner && owner.context && owner.context[ERROR];\n const error = castError(err);\n if (!fns) throw error;\n\n try {\n for (const f of fns) f(error);\n } catch (e) {\n handleError(e, (owner && owner.owner) || null);\n }\n}\n\nconst UNOWNED: Owner = { context: null, owner: null, owned: null, cleanups: null };\nexport let Owner: Owner | null = null;\n\ninterface Owner {\n owner: Owner | null;\n context: any | null;\n owned: Owner[] | null;\n cleanups: (() => void)[] | null;\n}\n\nexport function createOwner(): Owner {\n const o = { owner: Owner, context: Owner ? Owner.context : null, owned: null, cleanups: null };\n if (Owner) {\n if (!Owner.owned) Owner.owned = [o];\n else Owner.owned.push(o);\n }\n return o;\n}\n\nexport function createRoot(fn: (dispose: () => void) => T, detachedOwner?: typeof Owner): T {\n const owner = Owner,\n current = detachedOwner === undefined ? owner : detachedOwner,\n root =\n fn.length === 0\n ? UNOWNED\n : {\n context: current ? current.context : null,\n owner: current,\n owned: null,\n cleanups: null\n };\n Owner = root;\n let result: T;\n try {\n result = fn(fn.length === 0 ? () => {} : () => cleanNode(root));\n } catch (err) {\n handleError(err);\n } finally {\n Owner = owner;\n }\n return result!;\n}\n\nexport function createSignal(\n value: T,\n options?: { equals?: false | ((prev: T, next: T) => boolean); name?: string }\n): [get: () => T, set: (v: (T extends Function ? never : T) | ((prev: T) => T)) => T] {\n return [\n () => value as T,\n v => {\n return (value = typeof v === \"function\" ? (v as (prev: T) => T)(value) : v);\n }\n ];\n}\n\nexport function createComputed(fn: (v?: T) => T, value?: T): void {\n Owner = createOwner();\n try {\n fn(value);\n } catch (err) {\n handleError(err);\n } finally {\n Owner = Owner.owner;\n }\n}\n\nexport const createRenderEffect = createComputed;\n\nexport function createEffect(fn: (v?: T) => T, value?: T): void {}\n\nexport function createReaction(fn: () => void) {\n return (fn: () => void) => {\n fn();\n };\n}\n\nexport function createMemo(fn: (v?: T) => T, value?: T): () => T {\n Owner = createOwner();\n let v: T;\n try {\n v = fn(value);\n } catch (err) {\n handleError(err);\n } finally {\n Owner = Owner.owner;\n }\n return () => v;\n}\n\nexport function createDeferred(source: () => T) {\n return source;\n}\n\nexport function createSelector(source: () => T, fn: (k: T, value: T) => boolean = equalFn) {\n return (k: T) => fn(k, source());\n}\n\nexport function batch(fn: () => T): T {\n return fn();\n}\n\nexport const untrack = batch;\n\nexport function on(\n deps: Array<() => T> | (() => T),\n fn: (value: Array | T, prev?: Array | T, prevResults?: U) => U,\n options: { defer?: boolean } = {}\n): (prev?: U) => U | undefined {\n const isArray = Array.isArray(deps);\n const defer = options.defer;\n return () => {\n if (defer) return undefined;\n let value: Array | T;\n if (isArray) {\n value = [];\n for (let i = 0; i < deps.length; i++) value.push((deps as Array<() => T>)[i]());\n } else value = (deps as () => T)();\n return fn!(value);\n };\n}\n\nexport function onMount(fn: () => void) {}\n\nexport function onCleanup(fn: () => void) {\n if (Owner) {\n if (!Owner.cleanups) Owner.cleanups = [fn];\n else Owner.cleanups.push(fn);\n }\n return fn;\n}\n\nexport function cleanNode(node: Owner) {\n if (node.owned) {\n for (let i = 0; i < node.owned.length; i++) cleanNode(node.owned[i]);\n node.owned = null;\n }\n if (node.cleanups) {\n for (let i = 0; i < node.cleanups.length; i++) node.cleanups[i]();\n node.cleanups = null;\n }\n}\n\nexport function catchError(fn: () => T, handler: (err: Error) => void) {\n const owner = createOwner();\n owner.context = { ...owner.context, [ERROR]: [handler] };\n Owner = owner;\n try {\n return fn();\n } catch (err) {\n handleError(err);\n } finally {\n Owner = Owner!.owner;\n }\n}\n\nexport function getListener() {\n return null;\n}\n\n// Context API\nexport interface Context {\n id: symbol;\n Provider: (props: { value: T; children: any }) => any;\n defaultValue?: T;\n}\n\nexport function createContext(defaultValue?: T): Context {\n const id = Symbol(\"context\");\n return { id, Provider: createProvider(id), defaultValue };\n}\n\nexport function useContext(context: Context): T {\n return Owner && Owner.context && Owner.context[context.id] !== undefined\n ? Owner.context[context.id]\n : context.defaultValue;\n}\n\nexport function getOwner() {\n return Owner;\n}\n\ntype ChildrenReturn = Accessor & { toArray: () => any[] };\nexport function children(fn: () => any): ChildrenReturn {\n const memo = createMemo(() => resolveChildren(fn()));\n (memo as ChildrenReturn).toArray = () => {\n const c = memo();\n return Array.isArray(c) ? c : c != null ? [c] : [];\n };\n return memo as ChildrenReturn;\n}\n\nexport function runWithOwner(o: typeof Owner, fn: () => T): T | undefined {\n const prev = Owner;\n Owner = o;\n try {\n return fn();\n } catch (err) {\n handleError(err);\n } finally {\n Owner = prev;\n }\n}\n\nfunction resolveChildren(children: any): unknown {\n // `!children.length` avoids running functions that arent signals\n if (typeof children === \"function\" && !children.length) return resolveChildren(children());\n if (Array.isArray(children)) {\n const results: any[] = [];\n for (let i = 0; i < children.length; i++) {\n const result = resolveChildren(children[i]);\n Array.isArray(result) ? results.push.apply(results, result) : results.push(result);\n }\n return results;\n }\n return children;\n}\n\nfunction createProvider(id: symbol) {\n return function provider(props: { value: unknown; children: any }) {\n return createMemo(() => {\n Owner!.context = { ...Owner!.context, [id]: props.value };\n return children(() => props.children) as unknown as JSX.Element;\n });\n };\n}\n\nexport interface Task {\n id: number;\n fn: ((didTimeout: boolean) => void) | null;\n startTime: number;\n expirationTime: number;\n}\nexport function requestCallback(fn: () => void, options?: { timeout: number }): Task {\n return { id: 0, fn: () => {}, startTime: 0, expirationTime: 0 };\n}\nexport function cancelCallback(task: Task) {}\n\nexport function mapArray(\n list: Accessor,\n mapFn: (v: T, i: Accessor) => U,\n options: { fallback?: Accessor } = {}\n): () => U[] {\n const items = list();\n let s: U[] = [];\n if (items && items.length) {\n for (let i = 0, len = items.length; i < len; i++) s.push(mapFn(items[i], () => i));\n } else if (options.fallback) s = [options.fallback()];\n return () => s;\n}\n\nexport function indexArray(\n list: Accessor,\n mapFn: (v: Accessor, i: number) => U,\n options: { fallback?: Accessor } = {}\n): () => U[] {\n const items = list();\n let s: U[] = [];\n if (items && items.length) {\n for (let i = 0, len = items.length; i < len; i++) s.push(mapFn(() => items[i], i));\n } else if (options.fallback) s = [options.fallback()];\n return () => s;\n}\n\nexport type ObservableObserver =\n | ((v: T) => void)\n | {\n next: (v: T) => void;\n error?: (v: any) => void;\n complete?: (v: boolean) => void;\n };\nexport function observable(input: Accessor) {\n return {\n subscribe(observer: ObservableObserver) {\n if (!(observer instanceof Object) || observer == null) {\n throw new TypeError(\"Expected the observer to be an object.\");\n }\n\n const handler =\n typeof observer === \"function\" ? observer : observer.next && observer.next.bind(observer);\n\n if (!handler) {\n return { unsubscribe() {} };\n }\n\n const dispose = createRoot(disposer => {\n createEffect(() => {\n const v = input();\n untrack(() => handler(v));\n });\n\n return disposer;\n });\n\n if (getOwner()) onCleanup(dispose);\n\n return {\n unsubscribe() {\n dispose();\n }\n };\n },\n [Symbol.observable || \"@@observable\"]() {\n return this;\n }\n };\n}\n\nexport function from(\n producer:\n | ((setter: Setter) => () => void)\n | {\n subscribe: (fn: (v: T) => void) => (() => void) | { unsubscribe: () => void };\n }\n): Accessor {\n const [s, set] = createSignal(undefined, { equals: false }) as [\n Accessor,\n Setter\n ];\n if (\"subscribe\" in producer) {\n const unsub = producer.subscribe(v => set(() => v));\n onCleanup(() => (\"unsubscribe\" in unsub ? unsub.unsubscribe() : unsub()));\n } else {\n const clean = producer(set);\n onCleanup(clean);\n }\n return s;\n}\n\nexport function enableExternalSource(factory: any) {}\n\n/**\n * @deprecated since version 1.7.0 and will be removed in next major - use catchError instead\n */\nexport function onError(fn: (err: Error) => void): void {\n if (Owner) {\n if (Owner.context === null || !Owner.context[ERROR]) {\n // terrible de-opt\n Owner.context = { ...Owner.context, [ERROR]: [fn] };\n mutateContext(Owner, ERROR, [fn]);\n } else Owner.context[ERROR].push(fn);\n }\n}\n\nfunction mutateContext(o: Owner, key: symbol, value: any) {\n if (o.owned) {\n for (let i = 0; i < o.owned.length; i++) {\n if (o.owned[i].context === o.context) mutateContext(o.owned[i], key, value);\n if (!o.owned[i].context) {\n o.owned[i].context = o.context;\n mutateContext(o.owned[i], key, value);\n } else if (!o.owned[i].context[key]) {\n o.owned[i].context[key] = value;\n mutateContext(o.owned[i], key, value);\n }\n }\n }\n}\n" }, { "path": "packages/solid/src/server/rendering.ts", "content": "import {\n Accessor,\n castError,\n catchError,\n cleanNode,\n createContext,\n createMemo,\n createOwner,\n Owner,\n runWithOwner,\n Setter,\n Signal,\n useContext\n} from \"./reactive.js\";\nimport type { JSX } from \"../jsx.js\";\n\nexport type Component

= (props: P) => JSX.Element;\nexport type VoidProps

= P & { children?: never };\nexport type VoidComponent

= Component>;\nexport type ParentProps

= P & { children?: JSX.Element };\nexport type ParentComponent

= Component>;\nexport type FlowProps

= P & { children: C };\nexport type FlowComponent

= Component>;\nexport type Ref = T | ((val: T) => void);\nexport type ValidComponent = keyof JSX.IntrinsicElements | Component | (string & {});\nexport type ComponentProps =\n T extends Component\n ? P\n : T extends keyof JSX.IntrinsicElements\n ? JSX.IntrinsicElements[T]\n : Record;\n\n// these methods are duplicates from solid-js/web\n// we need a better solution for this in the future\nfunction escape(s: any, attr?: boolean) {\n const t = typeof s;\n if (t !== \"string\") {\n if (!attr && t === \"function\") return escape(s());\n if (!attr && Array.isArray(s)) {\n for (let i = 0; i < s.length; i++) s[i] = escape(s[i]);\n return s;\n }\n if (attr && t === \"boolean\") return String(s);\n return s;\n }\n const delim = attr ? '\"' : \"<\";\n const escDelim = attr ? \""\" : \"<\";\n let iDelim = s.indexOf(delim);\n let iAmp = s.indexOf(\"&\");\n\n if (iDelim < 0 && iAmp < 0) return s;\n\n let left = 0,\n out = \"\";\n\n while (iDelim >= 0 && iAmp >= 0) {\n if (iDelim < iAmp) {\n if (left < iDelim) out += s.substring(left, iDelim);\n out += escDelim;\n left = iDelim + 1;\n iDelim = s.indexOf(delim, left);\n } else {\n if (left < iAmp) out += s.substring(left, iAmp);\n out += \"&\";\n left = iAmp + 1;\n iAmp = s.indexOf(\"&\", left);\n }\n }\n\n if (iDelim >= 0) {\n do {\n if (left < iDelim) out += s.substring(left, iDelim);\n out += escDelim;\n left = iDelim + 1;\n iDelim = s.indexOf(delim, left);\n } while (iDelim >= 0);\n } else\n while (iAmp >= 0) {\n if (left < iAmp) out += s.substring(left, iAmp);\n out += \"&\";\n left = iAmp + 1;\n iAmp = s.indexOf(\"&\", left);\n }\n\n return left < s.length ? out + s.substring(left) : out;\n}\n\nfunction resolveSSRNode(node: any): string {\n const t = typeof node;\n if (t === \"string\") return node;\n if (node == null || t === \"boolean\") return \"\";\n if (Array.isArray(node)) {\n let prev = {};\n let mapped = \"\";\n for (let i = 0, len = node.length; i < len; i++) {\n if (typeof prev !== \"object\" && typeof node[i] !== \"object\") mapped += ``;\n mapped += resolveSSRNode((prev = node[i]));\n }\n return mapped;\n }\n if (t === \"object\") return node.t;\n if (t === \"function\") return resolveSSRNode(node());\n return String(node);\n}\n\ntype SharedConfig = {\n context?: HydrationContext;\n getContextId(): string;\n getNextContextId(): string;\n};\nexport const sharedConfig: SharedConfig = {\n context: undefined,\n getContextId() {\n if (!this.context) throw new Error(`getContextId cannot be used under non-hydrating context`);\n return getContextId(this.context.count);\n },\n getNextContextId() {\n if (!this.context)\n throw new Error(`getNextContextId cannot be used under non-hydrating context`);\n return getContextId(this.context.count++);\n }\n};\n\nfunction getContextId(count: number) {\n const num = String(count),\n len = num.length - 1;\n return sharedConfig.context!.id + (len ? String.fromCharCode(96 + len) : \"\") + num;\n}\n\nfunction setHydrateContext(context?: HydrationContext): void {\n sharedConfig.context = context;\n}\n\nfunction nextHydrateContext(): HydrationContext | undefined {\n return sharedConfig.context\n ? {\n ...sharedConfig.context,\n id: sharedConfig.getNextContextId(),\n count: 0\n }\n : undefined;\n}\n\nexport function createUniqueId(): string {\n return sharedConfig.getNextContextId();\n}\n\nexport function createComponent(Comp: (props: T) => JSX.Element, props: T): JSX.Element {\n if (sharedConfig.context && !sharedConfig.context.noHydrate) {\n const c = sharedConfig.context;\n setHydrateContext(nextHydrateContext());\n const r = Comp(props || ({} as T));\n setHydrateContext(c);\n return r;\n }\n return Comp(props || ({} as T));\n}\n\nexport function mergeProps(source: T, source1: U): T & U;\nexport function mergeProps(source: T, source1: U, source2: V): T & U & V;\nexport function mergeProps(\n source: T,\n source1: U,\n source2: V,\n source3: W\n): T & U & V & W;\nexport function mergeProps(...sources: any): any {\n const target = {};\n for (let i = 0; i < sources.length; i++) {\n let source = sources[i];\n if (typeof source === \"function\") source = source();\n if (source) {\n const descriptors = Object.getOwnPropertyDescriptors(source);\n for (const key in descriptors) {\n if (key in target) continue;\n Object.defineProperty(target, key, {\n enumerable: true,\n get() {\n for (let i = sources.length - 1; i >= 0; i--) {\n let v,\n s = sources[i];\n if (typeof s === \"function\") s = s();\n v = (s || {})[key];\n if (v !== undefined) return v;\n }\n }\n });\n }\n }\n }\n return target;\n}\n\nexport function splitProps(\n props: T,\n ...keys: [K1[]]\n): [Pick, Omit];\nexport function splitProps(\n props: T,\n ...keys: [K1[], K2[]]\n): [Pick, Pick, Omit];\nexport function splitProps<\n T extends object,\n K1 extends keyof T,\n K2 extends keyof T,\n K3 extends keyof T\n>(\n props: T,\n ...keys: [K1[], K2[], K3[]]\n): [Pick, Pick, Pick, Omit];\nexport function splitProps<\n T extends object,\n K1 extends keyof T,\n K2 extends keyof T,\n K3 extends keyof T,\n K4 extends keyof T\n>(\n props: T,\n ...keys: [K1[], K2[], K3[], K4[]]\n): [Pick, Pick, Pick, Pick, Omit];\nexport function splitProps<\n T extends object,\n K1 extends keyof T,\n K2 extends keyof T,\n K3 extends keyof T,\n K4 extends keyof T,\n K5 extends keyof T\n>(\n props: T,\n ...keys: [K1[], K2[], K3[], K4[], K5[]]\n): [\n Pick,\n Pick,\n Pick,\n Pick,\n Pick,\n Omit\n];\nexport function splitProps(props: T, ...keys: [(keyof T)[]]) {\n const descriptors = Object.getOwnPropertyDescriptors(props),\n split = (k: (keyof T)[]) => {\n const clone: Partial = {};\n for (let i = 0; i < k.length; i++) {\n const key = k[i];\n if (descriptors[key]) {\n Object.defineProperty(clone, key, descriptors[key]);\n delete descriptors[key];\n }\n }\n return clone;\n };\n return keys.map(split).concat(split(Object.keys(descriptors) as (keyof T)[]));\n}\n\nfunction simpleMap(\n props: { each: any[]; children: Function; fallback?: string },\n wrap: (fn: Function, item: any, i: number) => string\n) {\n const list = props.each || [],\n len = list.length,\n fn = props.children;\n if (len) {\n let mapped = Array(len);\n for (let i = 0; i < len; i++) mapped[i] = wrap(fn, list[i], i);\n return mapped;\n }\n return props.fallback;\n}\n\nexport function For(props: {\n each: T[];\n fallback?: string;\n children: (item: T, index: () => number) => string;\n}) {\n return simpleMap(props, (fn, item, i) => fn(item, () => i));\n}\n\n// non-keyed\nexport function Index(props: {\n each: T[];\n fallback?: string;\n children: (item: () => T, index: number) => string;\n}) {\n return simpleMap(props, (fn, item, i) => fn(() => item, i));\n}\n\ntype RequiredParameter = T extends () => unknown ? never : T;\n/**\n * Conditionally render its children or an optional fallback component\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show(props: {\n when: T | undefined | null | false;\n keyed?: boolean;\n fallback?: string;\n children: string | ((item: NonNullable | Accessor>) => string);\n}): string {\n let c: string | ((item: NonNullable | Accessor>) => string);\n return props.when\n ? typeof (c = props.children) === \"function\"\n ? c(props.keyed ? props.when! : () => props.when as any)\n : c\n : props.fallback || \"\";\n}\n\nexport function Switch(props: {\n fallback?: string;\n children: MatchProps | MatchProps[];\n}) {\n let conditions = props.children;\n Array.isArray(conditions) || (conditions = [conditions]);\n\n for (let i = 0; i < conditions.length; i++) {\n const w = conditions[i].when;\n if (w) {\n const c = conditions[i].children;\n return typeof c === \"function\" ? c(conditions[i].keyed ? w : () => w) : c;\n }\n }\n return props.fallback || \"\";\n}\n\ntype MatchProps = {\n when: T | false;\n keyed?: boolean;\n children: string | ((item: NonNullable | Accessor>) => string);\n};\nexport function Match(props: MatchProps) {\n return props;\n}\n\nexport function resetErrorBoundaries() {}\nexport function ErrorBoundary(props: {\n fallback: string | ((err: any, reset: () => void) => string);\n children: string;\n}) {\n let error: any,\n res: any,\n clean: any,\n sync = true;\n const ctx = sharedConfig.context!;\n const id = sharedConfig.getContextId();\n function displayFallback() {\n cleanNode(clean);\n ctx.serialize(id, error);\n setHydrateContext({ ...ctx, count: 0 });\n const f = props.fallback;\n return typeof f === \"function\" && f.length ? f(error, () => {}) : f;\n }\n createMemo(() => {\n clean = Owner;\n return catchError(\n () => (res = props.children),\n err => {\n error = err;\n !sync && ctx.replace(\"e\" + id, displayFallback);\n sync = true;\n }\n );\n });\n if (error) return displayFallback();\n sync = false;\n return { t: `${resolveSSRNode(escape(res))}` };\n}\n\n// Suspense Context\nexport interface Resource {\n (): T | undefined;\n state: \"unresolved\" | \"pending\" | \"ready\" | \"refreshing\" | \"errored\";\n loading: boolean;\n error: any;\n latest: T | undefined;\n}\n\ntype SuspenseContextType = {\n resources: Map;\n completed: () => void;\n};\n\nexport type ResourceActions = { mutate: Setter; refetch: (info?: unknown) => void };\n\nexport type ResourceReturn = [Resource, ResourceActions];\n\nexport type ResourceSource = S | false | null | undefined | (() => S | false | null | undefined);\n\nexport type ResourceFetcher = (k: S, info: ResourceFetcherInfo) => T | Promise;\n\nexport type ResourceFetcherInfo = { value: T | undefined; refetching?: unknown };\n\nexport type ResourceOptions = undefined extends T\n ? {\n initialValue?: T;\n name?: string;\n deferStream?: boolean;\n ssrLoadFrom?: \"initial\" | \"server\";\n storage?: () => Signal;\n onHydrated?: (k: S, info: ResourceFetcherInfo) => void;\n }\n : {\n initialValue: T;\n name?: string;\n deferStream?: boolean;\n ssrLoadFrom?: \"initial\" | \"server\";\n storage?: (v?: T) => Signal;\n onHydrated?: (k: S, info: ResourceFetcherInfo) => void;\n };\n\nconst SuspenseContext = createContext();\nlet resourceContext: any[] | null = null;\nexport function createResource(\n fetcher: ResourceFetcher,\n options?: ResourceOptions\n): ResourceReturn;\nexport function createResource(\n fetcher: ResourceFetcher,\n options: ResourceOptions\n): ResourceReturn;\nexport function createResource(\n source: ResourceSource,\n fetcher: ResourceFetcher,\n options?: ResourceOptions\n): ResourceReturn;\nexport function createResource(\n source: ResourceSource,\n fetcher: ResourceFetcher,\n options: ResourceOptions\n): ResourceReturn;\nexport function createResource(\n source: ResourceSource | ResourceFetcher,\n fetcher?: ResourceFetcher | ResourceOptions | ResourceOptions,\n options: ResourceOptions | ResourceOptions = {}\n): ResourceReturn | ResourceReturn {\n if (typeof fetcher !== \"function\") {\n options = (fetcher || {}) as ResourceOptions | ResourceOptions;\n fetcher = source as ResourceFetcher;\n source = true as ResourceSource;\n }\n\n const contexts = new Set();\n const id = sharedConfig.getNextContextId();\n let resource: { ref?: any; data?: T } = {};\n let value = options.storage ? options.storage(options.initialValue)[0]() : options.initialValue;\n let p: Promise | T | null | undefined;\n let error: any;\n if (sharedConfig.context!.async && options.ssrLoadFrom !== \"initial\") {\n resource = sharedConfig.context!.resources[id] || (sharedConfig.context!.resources[id] = {});\n if (resource.ref) {\n if (!resource.data && !resource.ref[0]._loading && !resource.ref[0].error)\n resource.ref[1].refetch();\n return resource.ref;\n }\n }\n const prepareResource = () => {\n if (error) throw error;\n const resolved =\n options.ssrLoadFrom !== \"initial\" &&\n sharedConfig.context!.async &&\n \"data\" in sharedConfig.context!.resources[id];\n if (!resolved && resourceContext) resourceContext.push(id);\n if (!resolved && read._loading) {\n const ctx = useContext(SuspenseContext);\n if (ctx) {\n ctx.resources.set(id, read);\n contexts.add(ctx);\n }\n }\n return resolved;\n };\n const read = () => {\n return prepareResource() ? sharedConfig.context!.resources[id].data : value;\n };\n const loading = () => {\n prepareResource();\n return read._loading;\n };\n read._loading = false;\n read.error = undefined as any;\n read.state = \"initialValue\" in options ? \"ready\" : \"unresolved\";\n Object.defineProperties(read, {\n latest: {\n get() {\n return read();\n }\n },\n loading: {\n get() {\n return loading();\n }\n }\n });\n function load() {\n const ctx = sharedConfig.context!;\n if (!ctx.async)\n return (read._loading = !!(typeof source === \"function\" ? (source as () => S)() : source));\n if (ctx.resources && id in ctx.resources && \"data\" in ctx.resources[id]) {\n value = ctx.resources[id].data;\n return;\n }\n let lookup;\n try {\n resourceContext = [];\n lookup = typeof source === \"function\" ? (source as () => S)() : source;\n if (resourceContext.length) return;\n } finally {\n resourceContext = null;\n }\n if (!p) {\n if (lookup == null || lookup === false) return;\n p = (fetcher as ResourceFetcher)(lookup, { value });\n }\n if (p != undefined && typeof p === \"object\" && \"then\" in p) {\n read._loading = true;\n read.state = \"pending\";\n p = p\n .then(res => {\n read._loading = false;\n read.state = \"ready\";\n ctx.resources[id].data = res;\n p = null;\n notifySuspense(contexts);\n return res;\n })\n .catch(err => {\n read._loading = false;\n read.state = \"errored\";\n read.error = error = castError(err);\n p = null;\n notifySuspense(contexts);\n throw error;\n });\n if (ctx.serialize) ctx.serialize(id, p, options.deferStream);\n return p;\n }\n ctx.resources[id].data = p;\n if (ctx.serialize) ctx.serialize(id, p);\n p = null;\n return ctx.resources[id].data;\n }\n if (options.ssrLoadFrom !== \"initial\") load();\n const ref = [\n read as unknown as Resource,\n { refetch: load, mutate: (v: T) => (value = v) }\n ] as ResourceReturn;\n if (p) resource.ref = ref;\n return ref;\n}\n\nexport function lazy>(\n fn: () => Promise<{ default: T }>\n): T & { preload: () => Promise<{ default: T }> } {\n let p: Promise<{ default: T }> & { resolved?: T };\n let load = (id?: string) => {\n if (!p) {\n p = fn();\n p.then(mod => (p.resolved = mod.default));\n if (id) sharedConfig.context!.lazy[id] = p;\n }\n return p;\n };\n const contexts = new Set();\n const wrap: Component> & {\n preload?: () => Promise<{ default: T }>;\n } = props => {\n const id = sharedConfig.context!.id;\n let ref = sharedConfig.context!.lazy[id];\n if (ref) p = ref;\n else load(id);\n if (p.resolved) return p.resolved(props);\n const ctx = useContext(SuspenseContext);\n const track = { _loading: true, error: undefined };\n if (ctx) {\n ctx.resources.set(id, track);\n contexts.add(ctx);\n }\n if (sharedConfig.context!.async) {\n sharedConfig.context!.block(\n p.then(() => {\n track._loading = false;\n notifySuspense(contexts);\n })\n );\n }\n return \"\";\n };\n wrap.preload = load;\n return wrap as T & { preload: () => Promise<{ default: T }> };\n}\n\nfunction suspenseComplete(c: SuspenseContextType) {\n for (const r of c.resources.values()) {\n if (r._loading) return false;\n }\n return true;\n}\n\nfunction notifySuspense(contexts: Set) {\n for (const c of contexts) {\n if (!suspenseComplete(c)) {\n continue;\n }\n c.completed();\n contexts.delete(c);\n }\n}\n\nexport function enableScheduling() {}\n\nexport function enableHydration() {}\n\nexport function startTransition(fn: () => any): void {\n fn();\n}\n\nexport function useTransition(): [() => boolean, (fn: () => any) => void] {\n return [\n () => false,\n fn => {\n fn();\n }\n ];\n}\n\ntype HydrationContext = {\n id: string;\n count: number;\n serialize: (id: string, v: Promise | any, deferStream?: boolean) => void;\n nextRoot: (v: any) => string;\n replace: (id: string, replacement: () => any) => void;\n block: (p: Promise) => void;\n resources: Record;\n suspense: Record;\n registerFragment: (v: string) => (v?: string, err?: any) => boolean;\n lazy: Record>;\n async?: boolean;\n noHydrate: boolean;\n};\n\nexport function SuspenseList(props: {\n children: string;\n revealOrder: \"forwards\" | \"backwards\" | \"together\";\n tail?: \"collapsed\" | \"hidden\";\n}) {\n // TODO: support revealOrder and tail options\n if (sharedConfig.context && !sharedConfig.context.noHydrate) {\n const c = sharedConfig.context;\n setHydrateContext(nextHydrateContext());\n const result = props.children;\n setHydrateContext(c);\n return result;\n }\n return props.children;\n}\n\nexport function Suspense(props: { fallback?: string; children: string }) {\n let done: undefined | ((html?: string, error?: any) => boolean);\n const ctx = sharedConfig.context!;\n const id = sharedConfig.getContextId();\n const o = createOwner();\n const value: SuspenseContextType =\n ctx.suspense[id] ||\n (ctx.suspense[id] = {\n resources: new Map(),\n completed: () => {\n const res = runSuspense();\n if (suspenseComplete(value)) {\n done!(resolveSSRNode(escape(res)));\n }\n }\n });\n\n function suspenseError(err: Error) {\n if (!done || !done(undefined, err)) {\n runWithOwner(o.owner!, () => {\n throw err;\n });\n }\n }\n\n function runSuspense() {\n setHydrateContext({ ...ctx, count: 0 });\n cleanNode(o);\n return runWithOwner(o, () =>\n createComponent(SuspenseContext.Provider, {\n value,\n get children() {\n return catchError(() => props.children, suspenseError);\n }\n })\n );\n }\n const res = runSuspense();\n\n // never suspended\n if (suspenseComplete(value)) {\n delete ctx.suspense[id];\n return res;\n }\n\n done = ctx.async ? ctx.registerFragment(id) : undefined;\n return catchError(() => {\n if (ctx.async) {\n setHydrateContext({ ...ctx, count: 0, id: ctx.id + \"0F\", noHydrate: true });\n const res = {\n t: `${resolveSSRNode(\n escape(props.fallback)\n )}`\n };\n setHydrateContext(ctx);\n return res;\n }\n setHydrateContext({ ...ctx, count: 0, id: ctx.id + \"0F\" });\n ctx.serialize(id, \"$$f\");\n return props.fallback;\n }, suspenseError);\n}\n" }, { "path": "packages/solid/store/README.md", "content": "# Solid Store\n\nThis submodules contains the means for handling deeps nested reactivity. It provides 2 main primitives `createStore` and `createMutable` which leverage proxies to create dynamic nested reactive structures.\n\nThis also contains helper methods `produce` and `reconcile` which augment the behavior of the store setter method to allow for localized mutation and data diffing.\n\nFor full documentation, check out the [website](https://docs.solidjs.com).\n\n## Example\n\n```js\nimport { createStore } from \"solid-js/store\";\n\nconst [store, setStore] = createStore({\n user: {\n firstName: \"John\",\n lastName: \"Smith\"\n }\n});\n\n// update store.user.firstName\nsetStore(\"user\", \"firstName\", \"Will\");\n```\n" }, { "path": "packages/solid/store/package.json", "content": "{\n \"name\": \"solid-js/store\",\n \"main\": \"./dist/server.cjs\",\n \"module\": \"./dist/server.js\",\n \"unpkg\": \"./dist/store.cjs\",\n \"types\": \"./types/index.d.ts\",\n \"type\": \"module\",\n \"sideEffects\": false,\n \"exports\": {\n \".\": {\n \"worker\": {\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/server.js\",\n \"require\": \"./dist/server.cjs\"\n },\n \"browser\": {\n \"development\": {\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/dev.js\",\n \"require\": \"./dist/dev.cjs\"\n },\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/store.js\",\n \"require\": \"./dist/store.cjs\"\n },\n \"deno\": {\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/server.js\",\n \"require\": \"./dist/server.cjs\"\n },\n \"node\": {\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/server.js\",\n \"require\": \"./dist/server.cjs\"\n },\n \"development\": {\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/dev.js\",\n \"require\": \"./dist/dev.cjs\"\n },\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/store.js\",\n \"require\": \"./dist/store.cjs\"\n }\n }\n}\n" }, { "path": "packages/solid/store/src/index.ts", "content": "export { $RAW, createStore, unwrap } from \"./store.js\";\nexport type {\n ArrayFilterFn,\n DeepMutable,\n DeepReadonly,\n NotWrappable,\n Part,\n SetStoreFunction,\n SolidStore,\n Store,\n StoreNode,\n StorePathRange,\n StoreSetter\n} from \"./store.js\";\nexport * from \"./mutable.js\";\nexport * from \"./modifiers.js\";\n\n// dev\nimport { $NODE, isWrappable, DevHooks, IS_DEV } from \"./store.js\";\nexport const DEV = IS_DEV ? ({ $NODE, isWrappable, hooks: DevHooks } as const) : undefined;\n" }, { "path": "packages/solid/store/src/modifiers.ts", "content": "import { setProperty, unwrap, isWrappable, StoreNode, $RAW } from \"./store.js\";\n\nconst $ROOT = Symbol(\"store-root\");\n\nexport type ReconcileOptions = {\n key?: string | null;\n merge?: boolean;\n};\n\nfunction applyState(\n target: any,\n parent: any,\n property: PropertyKey,\n merge: boolean | undefined,\n key: string | null\n) {\n const previous = parent[property];\n if (target === previous) return;\n const isArray = Array.isArray(target);\n if (\n property !== $ROOT &&\n (!isWrappable(target) ||\n !isWrappable(previous) ||\n isArray !== Array.isArray(previous) ||\n (key && target[key] !== previous[key]))\n ) {\n setProperty(parent, property, target);\n return;\n }\n\n if (isArray) {\n if (\n target.length &&\n previous.length &&\n (!merge || (key && target[0] && target[0][key] != null))\n ) {\n let i, j, start, end, newEnd, item, newIndicesNext, keyVal;\n // common prefix\n for (\n start = 0, end = Math.min(previous.length, target.length);\n start < end &&\n (previous[start] === target[start] ||\n (key &&\n previous[start] &&\n target[start] &&\n previous[start][key] &&\n previous[start][key] === target[start][key]));\n start++\n ) {\n applyState(target[start], previous, start, merge, key);\n }\n\n const temp = new Array(target.length),\n newIndices = new Map();\n // common suffix\n for (\n end = previous.length - 1, newEnd = target.length - 1;\n end >= start &&\n newEnd >= start &&\n (previous[end] === target[newEnd] ||\n (key &&\n previous[end] &&\n target[newEnd] &&\n previous[end][key] &&\n previous[end][key] === target[newEnd][key]));\n end--, newEnd--\n ) {\n temp[newEnd] = previous[end];\n }\n\n // insert any remaining updates and remove any remaining nodes and we're done\n if (start > newEnd || start > end) {\n for (j = start; j <= newEnd; j++) setProperty(previous, j, target[j]);\n for (; j < target.length; j++) {\n setProperty(previous, j, temp[j]);\n applyState(target[j], previous, j, merge, key);\n }\n if (previous.length > target.length) setProperty(previous, \"length\", target.length);\n return;\n }\n\n // prepare a map of all indices in target\n newIndicesNext = new Array(newEnd + 1);\n for (j = newEnd; j >= start; j--) {\n item = target[j];\n keyVal = key && item ? item[key] : item;\n i = newIndices.get(keyVal);\n newIndicesNext[j] = i === undefined ? -1 : i;\n newIndices.set(keyVal, j);\n }\n // step through all old items to check reuse\n for (i = start; i <= end; i++) {\n item = previous[i];\n keyVal = key && item ? item[key] : item;\n j = newIndices.get(keyVal);\n if (j !== undefined && j !== -1) {\n temp[j] = previous[i];\n j = newIndicesNext[j];\n newIndices.set(keyVal, j);\n }\n }\n // set all the new values\n for (j = start; j < target.length; j++) {\n if (j in temp) {\n setProperty(previous, j, temp[j]);\n applyState(target[j], previous, j, merge, key);\n } else setProperty(previous, j, target[j]);\n }\n } else {\n for (let i = 0, len = target.length; i < len; i++) {\n applyState(target[i], previous, i, merge, key);\n }\n }\n if (previous.length > target.length) setProperty(previous, \"length\", target.length);\n return;\n }\n\n const targetKeys = Object.keys(target);\n for (let i = 0, len = targetKeys.length; i < len; i++) {\n applyState(target[targetKeys[i]], previous, targetKeys[i], merge, key);\n }\n const previousKeys = Object.keys(previous);\n for (let i = 0, len = previousKeys.length; i < len; i++) {\n if (target[previousKeys[i]] === undefined) setProperty(previous, previousKeys[i], undefined);\n }\n}\n\n// Diff method for setStore\nexport function reconcile(\n value: T,\n options: ReconcileOptions = {}\n): (state: U) => T {\n const { merge, key = \"id\" } = options,\n v = unwrap(value);\n return state => {\n if (!isWrappable(state) || !isWrappable(v)) return v;\n const res = applyState(v, { [$ROOT]: state }, $ROOT, merge, key);\n return res === undefined ? (state as T) : res;\n };\n}\n\nconst producers = new WeakMap();\nconst setterTraps: ProxyHandler = {\n get(target, property): any {\n if (property === $RAW) return target;\n const value = target[property];\n let proxy;\n return isWrappable(value)\n ? producers.get(value) ||\n (producers.set(value, (proxy = new Proxy(value, setterTraps))), proxy)\n : value;\n },\n\n set(target, property, value) {\n setProperty(target, property, unwrap(value));\n return true;\n },\n\n deleteProperty(target, property) {\n setProperty(target, property, undefined, true);\n return true;\n }\n};\n\n// Immer style mutation style\nexport function produce(fn: (state: T) => void): (state: T) => T {\n return state => {\n if (isWrappable(state)) {\n let proxy;\n if (!(proxy = producers.get(state as Record))) {\n producers.set(\n state as Record,\n (proxy = new Proxy(state as Extract, setterTraps))\n );\n }\n fn(proxy);\n }\n return state;\n };\n}\n" }, { "path": "packages/solid/store/src/mutable.ts", "content": "import { batch, getListener, DEV, $PROXY, $TRACK } from \"solid-js\";\nimport {\n unwrap,\n isWrappable,\n getNodes,\n trackSelf,\n getNode,\n $RAW,\n $NODE,\n $HAS,\n StoreNode,\n setProperty,\n ownKeys,\n IS_DEV\n} from \"./store.js\";\n\nfunction proxyDescriptor(target: StoreNode, property: PropertyKey) {\n const desc = Reflect.getOwnPropertyDescriptor(target, property);\n if (\n !desc ||\n desc.get ||\n desc.set ||\n !desc.configurable ||\n property === $PROXY ||\n property === $NODE\n )\n return desc;\n\n delete desc.value;\n delete desc.writable;\n desc.get = () => target[$PROXY][property];\n desc.set = v => (target[$PROXY][property] = v);\n\n return desc;\n}\n\nconst proxyTraps: ProxyHandler = {\n get(target, property, receiver) {\n if (property === $RAW) return target;\n if (property === $PROXY) return receiver;\n if (property === $TRACK) {\n trackSelf(target);\n return receiver;\n }\n const nodes = getNodes(target, $NODE);\n const tracked = nodes[property];\n let value = tracked ? tracked() : target[property];\n if (property === $NODE || property === $HAS || property === \"__proto__\") return value;\n\n if (!tracked) {\n const desc = Object.getOwnPropertyDescriptor(target, property);\n const isFunction = typeof value === \"function\";\n if (getListener() && (!isFunction || target.hasOwnProperty(property)) && !(desc && desc.get))\n value = getNode(nodes, property, value)();\n else if (value != null && isFunction && value === Array.prototype[property as any]) {\n return (...args: unknown[]) =>\n batch(() => Array.prototype[property as any].apply(receiver, args));\n }\n }\n return isWrappable(value) ? wrap(value) : value;\n },\n\n has(target, property) {\n if (\n property === $RAW ||\n property === $PROXY ||\n property === $TRACK ||\n property === $NODE ||\n property === $HAS ||\n property === \"__proto__\"\n )\n return true;\n getListener() && getNode(getNodes(target, $HAS), property)();\n return property in target;\n },\n\n set(target, property, value) {\n batch(() => setProperty(target, property, unwrap(value)));\n return true;\n },\n\n deleteProperty(target, property) {\n batch(() => setProperty(target, property, undefined, true));\n return true;\n },\n\n ownKeys: ownKeys,\n\n getOwnPropertyDescriptor: proxyDescriptor\n};\n\nfunction wrap(value: T): T {\n let p = value[$PROXY];\n if (!p) {\n Object.defineProperty(value, $PROXY, { value: (p = new Proxy(value, proxyTraps)) });\n const keys = Object.keys(value),\n desc = Object.getOwnPropertyDescriptors(value);\n\n const proto = Object.getPrototypeOf(value);\n const isClass =\n proto !== null &&\n value !== null &&\n typeof value === \"object\" &&\n !Array.isArray(value) &&\n proto !== Object.prototype;\n if (isClass) {\n let curProto = proto;\n while (curProto != null) {\n const descriptors = Object.getOwnPropertyDescriptors(curProto);\n keys.push(...Object.keys(descriptors));\n Object.assign(desc, descriptors);\n curProto = Object.getPrototypeOf(curProto);\n }\n }\n\n for (let i = 0, l = keys.length; i < l; i++) {\n const prop = keys[i];\n if (isClass && prop === \"constructor\") continue;\n if (desc[prop].get) {\n const get = desc[prop].get!.bind(p);\n Object.defineProperty(value, prop, {\n get,\n configurable: true\n });\n }\n if (desc[prop].set) {\n const og = desc[prop].set!,\n set = (v: T[keyof T]) => batch(() => og.call(p, v));\n Object.defineProperty(value, prop, {\n set,\n configurable: true\n });\n }\n }\n }\n return p;\n}\n\nexport function createMutable(state: T, options?: { name?: string }): T {\n const unwrappedStore = unwrap(state || {});\n if (IS_DEV && typeof unwrappedStore !== \"object\" && typeof unwrappedStore !== \"function\")\n throw new Error(\n `Unexpected type ${typeof unwrappedStore} received when initializing 'createMutable'. Expected an object.`\n );\n\n const wrappedStore = wrap(unwrappedStore);\n if (IS_DEV) DEV!.registerGraph({ value: unwrappedStore, name: options && options.name });\n return wrappedStore;\n}\n\nexport function modifyMutable(state: T, modifier: (state: T) => T) {\n batch(() => modifier(unwrap(state)));\n}\n" }, { "path": "packages/solid/store/src/server.ts", "content": "import type { SetStoreFunction, Store } from \"./store.js\";\n\nexport type {\n ArrayFilterFn,\n DeepMutable,\n DeepReadonly,\n NotWrappable,\n Part,\n SetStoreFunction,\n SolidStore,\n Store,\n StoreNode,\n StorePathRange,\n StoreSetter\n} from \"./store.js\";\n\nexport const $RAW = Symbol(\"state-raw\");\n\nexport function isWrappable(obj: any) {\n return (\n obj != null &&\n typeof obj === \"object\" &&\n (Object.getPrototypeOf(obj) === Object.prototype || Array.isArray(obj))\n );\n}\n\nexport function unwrap(item: T): T {\n return item;\n}\n\nexport function setProperty(state: any, property: PropertyKey, value: any, force?: boolean) {\n if (!force && state[property] === value) return;\n if (value === undefined) {\n delete state[property];\n } else state[property] = value;\n}\n\nfunction mergeStoreNode(state: any, value: any, force?: boolean) {\n const keys = Object.keys(value);\n for (let i = 0; i < keys.length; i += 1) {\n const key = keys[i];\n setProperty(state, key, value[key], force);\n }\n}\n\nfunction updateArray(\n current: any,\n next: Array | Record | ((prev: any) => Array | Record)\n) {\n if (typeof next === \"function\") next = next(current);\n if (Array.isArray(next)) {\n if (current === next) return;\n let i = 0,\n len = next.length;\n for (; i < len; i++) {\n const value = next[i];\n if (current[i] !== value) setProperty(current, i, value);\n }\n setProperty(current, \"length\", len);\n } else mergeStoreNode(current, next);\n}\n\nexport function updatePath(current: any, path: any[], traversed: PropertyKey[] = []) {\n let part,\n next = current;\n if (path.length > 1) {\n part = path.shift();\n const partType = typeof part,\n isArray = Array.isArray(current);\n\n if (Array.isArray(part)) {\n // Ex. update('data', [2, 23], 'label', l => l + ' !!!');\n for (let i = 0; i < part.length; i++) {\n updatePath(current, [part[i]].concat(path), traversed);\n }\n return;\n } else if (isArray && partType === \"function\") {\n // Ex. update('data', i => i.id === 42, 'label', l => l + ' !!!');\n for (let i = 0; i < current.length; i++) {\n if (part(current[i], i)) updatePath(current, [i].concat(path), traversed);\n }\n return;\n } else if (isArray && partType === \"object\") {\n // Ex. update('data', { from: 3, to: 12, by: 2 }, 'label', l => l + ' !!!');\n const { from = 0, to = current.length - 1, by = 1 } = part;\n for (let i = from; i <= to; i += by) {\n updatePath(current, [i].concat(path), traversed);\n }\n return;\n } else if (path.length > 1) {\n updatePath(current[part], path, [part].concat(traversed));\n return;\n }\n next = current[part];\n traversed = [part].concat(traversed);\n }\n let value = path[0];\n if (typeof value === \"function\") {\n value = value(next, traversed);\n if (value === next) return;\n }\n if (part === undefined && value == undefined) return;\n if (part === undefined || (isWrappable(next) && isWrappable(value) && !Array.isArray(value))) {\n mergeStoreNode(next, value);\n } else setProperty(current, part, value);\n}\n\nexport function createStore(state: T | Store): [Store, SetStoreFunction] {\n const isArray = Array.isArray(state);\n function setStore(...args: any[]): void {\n isArray && args.length === 1 ? updateArray(state, args[0]) : updatePath(state, args);\n }\n return [state as Store, setStore];\n}\n\nexport function createMutable(state: T | Store): T {\n return state as T;\n}\n\nexport function modifyMutable(state: T, modifier: (state: T) => T) {\n modifier(state);\n}\n\ntype ReconcileOptions = {\n key?: string | null;\n merge?: boolean;\n};\n\n// Diff method for setStore\nexport function reconcile(\n value: T,\n options: ReconcileOptions = {}\n): (state: U) => T {\n return state => {\n if (!isWrappable(state) || !isWrappable(value)) return value;\n const targetKeys = Object.keys(value) as (keyof T)[];\n for (let i = 0, len = targetKeys.length; i < len; i++) {\n const key = targetKeys[i];\n setProperty(state, key, value[key]);\n }\n const previousKeys = Object.keys(state) as (keyof T)[];\n for (let i = 0, len = previousKeys.length; i < len; i++) {\n if (value[previousKeys[i]] === undefined) setProperty(state, previousKeys[i], undefined);\n }\n return state as T;\n };\n}\n\n// Immer style mutation style\nexport function produce(fn: (state: T) => void): (state: T) => T {\n return state => {\n if (isWrappable(state)) fn(state);\n return state;\n };\n}\n\nexport const DEV = undefined;\n" }, { "path": "packages/solid/store/src/store.ts", "content": "import { getListener, batch, DEV, $PROXY, $TRACK, createSignal } from \"solid-js\";\n\n// replaced during build\nexport const IS_DEV = \"_SOLID_DEV_\" as string | boolean;\n\nexport const $RAW = Symbol(\"store-raw\"),\n $NODE = Symbol(\"store-node\"),\n $HAS = Symbol(\"store-has\"),\n $SELF = Symbol(\"store-self\");\n\n// debug hooks for devtools\nexport const DevHooks: { onStoreNodeUpdate: OnStoreNodeUpdate | null } = {\n onStoreNodeUpdate: null\n};\n\ntype DataNode = {\n (): any;\n $(value?: any): void;\n};\nexport type DataNodes = Record;\n\nexport type OnStoreNodeUpdate = (\n state: StoreNode,\n property: PropertyKey,\n value: StoreNode | NotWrappable,\n prev: StoreNode | NotWrappable\n) => void;\n\nexport interface StoreNode {\n [$NODE]?: DataNodes;\n [key: PropertyKey]: any;\n}\n\nexport namespace SolidStore {\n export interface Unwrappable {}\n}\nexport type NotWrappable =\n | string\n | number\n | bigint\n | symbol\n | boolean\n | Function\n | null\n | undefined\n | SolidStore.Unwrappable[keyof SolidStore.Unwrappable];\nexport type Store = T;\n\nfunction wrap(value: T): T {\n let p = value[$PROXY];\n if (!p) {\n Object.defineProperty(value, $PROXY, { value: (p = new Proxy(value, proxyTraps)) });\n if (!Array.isArray(value)) {\n const keys = Object.keys(value),\n desc = Object.getOwnPropertyDescriptors(value);\n for (let i = 0, l = keys.length; i < l; i++) {\n const prop = keys[i];\n if (desc[prop].get) {\n Object.defineProperty(value, prop, {\n enumerable: desc[prop].enumerable,\n get: desc[prop].get!.bind(p)\n });\n }\n }\n }\n }\n return p;\n}\n\nexport function isWrappable(obj: T | NotWrappable): obj is T;\nexport function isWrappable(obj: any) {\n let proto;\n return (\n obj != null &&\n typeof obj === \"object\" &&\n (obj[$PROXY] ||\n !(proto = Object.getPrototypeOf(obj)) ||\n proto === Object.prototype ||\n Array.isArray(obj))\n );\n}\n\n/**\n * Returns the underlying data in the store without a proxy.\n * @param item store proxy object\n * @example\n * ```js\n * const initial = {z...};\n * const [state, setState] = createStore(initial);\n * initial === state; // => false\n * initial === unwrap(state); // => true\n * ```\n */\nexport function unwrap(item: T, set?: Set): T;\nexport function unwrap(item: any, set = new Set()): T {\n let result, unwrapped, v, prop;\n if ((result = item != null && item[$RAW])) return result;\n if (!isWrappable(item) || set.has(item)) return item;\n\n if (Array.isArray(item)) {\n if (Object.isFrozen(item)) item = item.slice(0);\n else set.add(item);\n for (let i = 0, l = item.length; i < l; i++) {\n v = item[i];\n if ((unwrapped = unwrap(v, set)) !== v) item[i] = unwrapped;\n }\n } else {\n if (Object.isFrozen(item)) item = Object.assign({}, item);\n else set.add(item);\n const keys = Object.keys(item),\n desc = Object.getOwnPropertyDescriptors(item);\n for (let i = 0, l = keys.length; i < l; i++) {\n prop = keys[i];\n if (desc[prop].get) continue;\n v = item[prop];\n if ((unwrapped = unwrap(v, set)) !== v) item[prop] = unwrapped;\n }\n }\n return item;\n}\n\nexport function getNodes(target: StoreNode, symbol: typeof $NODE | typeof $HAS): DataNodes {\n let nodes = target[symbol];\n if (!nodes)\n Object.defineProperty(target, symbol, { value: (nodes = Object.create(null) as DataNodes) });\n return nodes;\n}\n\nexport function getNode(nodes: DataNodes, property: PropertyKey, value?: any) {\n if (nodes[property]) return nodes[property]!;\n const [s, set] = createSignal(value, {\n equals: false,\n internal: true\n });\n (s as DataNode).$ = set;\n return (nodes[property] = s as DataNode);\n}\n\nexport function proxyDescriptor(target: StoreNode, property: PropertyKey) {\n const desc = Reflect.getOwnPropertyDescriptor(target, property);\n if (!desc || desc.get || !desc.configurable || property === $PROXY || property === $NODE)\n return desc;\n delete desc.value;\n delete desc.writable;\n desc.get = () => target[$PROXY][property];\n return desc;\n}\n\nexport function trackSelf(target: StoreNode) {\n getListener() && getNode(getNodes(target, $NODE), $SELF)();\n}\n\nexport function ownKeys(target: StoreNode) {\n trackSelf(target);\n return Reflect.ownKeys(target);\n}\n\nconst proxyTraps: ProxyHandler = {\n get(target, property, receiver) {\n if (property === $RAW) return target;\n if (property === $PROXY) return receiver;\n if (property === $TRACK) {\n trackSelf(target);\n return receiver;\n }\n const nodes = getNodes(target, $NODE);\n const tracked = nodes[property];\n let value = tracked ? tracked() : target[property];\n if (property === $NODE || property === $HAS || property === \"__proto__\") return value;\n\n if (!tracked) {\n const desc = Object.getOwnPropertyDescriptor(target, property);\n if (\n getListener() &&\n (typeof value !== \"function\" || target.hasOwnProperty(property)) &&\n !(desc && desc.get)\n )\n value = getNode(nodes, property, value)();\n }\n return isWrappable(value) ? wrap(value) : value;\n },\n\n has(target, property) {\n if (\n property === $RAW ||\n property === $PROXY ||\n property === $TRACK ||\n property === $NODE ||\n property === $HAS ||\n property === \"__proto__\"\n )\n return true;\n getListener() && getNode(getNodes(target, $HAS), property)();\n return property in target;\n },\n\n set() {\n if (IS_DEV) console.warn(\"Cannot mutate a Store directly\");\n return true;\n },\n\n deleteProperty() {\n if (IS_DEV) console.warn(\"Cannot mutate a Store directly\");\n return true;\n },\n\n ownKeys: ownKeys,\n\n getOwnPropertyDescriptor: proxyDescriptor\n};\n\nexport function setProperty(\n state: StoreNode,\n property: PropertyKey,\n value: any,\n deleting: boolean = false\n): void {\n if (!deleting && state[property] === value) return;\n const prev = state[property],\n len = state.length;\n\n if (IS_DEV)\n DevHooks.onStoreNodeUpdate && DevHooks.onStoreNodeUpdate(state, property, value, prev);\n\n if (value === undefined) {\n delete state[property];\n if (state[$HAS] && state[$HAS][property] && prev !== undefined) state[$HAS][property].$();\n } else {\n state[property] = value;\n if (state[$HAS] && state[$HAS][property] && prev === undefined) state[$HAS][property].$();\n }\n let nodes = getNodes(state, $NODE),\n node: DataNode | undefined;\n if ((node = getNode(nodes, property, prev))) node.$(() => value);\n\n if (Array.isArray(state) && state.length !== len) {\n for (let i = state.length; i < len; i++) (node = nodes[i]) && node.$();\n (node = getNode(nodes, \"length\", len)) && node.$(state.length);\n }\n (node = nodes[$SELF]) && node.$();\n}\n\nfunction mergeStoreNode(state: StoreNode, value: Partial) {\n const keys = Object.keys(value);\n for (let i = 0; i < keys.length; i += 1) {\n const key = keys[i];\n setProperty(state, key, value[key]);\n }\n}\n\nfunction updateArray(\n current: StoreNode,\n next: Array | Record | ((prev: StoreNode) => Array | Record)\n) {\n if (typeof next === \"function\") next = next(current);\n next = unwrap(next) as Array | Record;\n if (Array.isArray(next)) {\n if (current === next) return;\n let i = 0,\n len = next.length;\n for (; i < len; i++) {\n const value = next[i];\n if (current[i] !== value) setProperty(current, i, value);\n }\n setProperty(current, \"length\", len);\n } else mergeStoreNode(current, next);\n}\n\nexport function updatePath(current: StoreNode, path: any[], traversed: PropertyKey[] = []) {\n let part,\n prev = current;\n if (path.length > 1) {\n part = path.shift();\n const partType = typeof part,\n isArray = Array.isArray(current);\n\n if (Array.isArray(part)) {\n // Ex. update('data', [2, 23], 'label', l => l + ' !!!');\n for (let i = 0; i < part.length; i++) {\n updatePath(current, [part[i]].concat(path), traversed);\n }\n return;\n } else if (isArray && partType === \"function\") {\n // Ex. update('data', i => i.id === 42, 'label', l => l + ' !!!');\n for (let i = 0; i < current.length; i++) {\n if (part(current[i], i)) updatePath(current, [i].concat(path), traversed);\n }\n return;\n } else if (isArray && partType === \"object\") {\n // Ex. update('data', { from: 3, to: 12, by: 2 }, 'label', l => l + ' !!!');\n const { from = 0, to = current.length - 1, by = 1 } = part;\n for (let i = from; i <= to; i += by) {\n updatePath(current, [i].concat(path), traversed);\n }\n return;\n } else if (path.length > 1) {\n updatePath(current[part], path, [part].concat(traversed));\n return;\n }\n prev = current[part];\n traversed = [part].concat(traversed);\n }\n let value = path[0];\n if (typeof value === \"function\") {\n value = value(prev, traversed);\n if (value === prev) return;\n }\n if (part === undefined && value == undefined) return;\n value = unwrap(value);\n if (part === undefined || (isWrappable(prev) && isWrappable(value) && !Array.isArray(value))) {\n mergeStoreNode(prev, value);\n } else setProperty(current, part, value);\n}\n\n/** @deprecated */\nexport type DeepReadonly = 0 extends 1 & T\n ? T\n : T extends NotWrappable\n ? T\n : {\n readonly [K in keyof T]: DeepReadonly;\n };\n/** @deprecated */\nexport type DeepMutable = 0 extends 1 & T\n ? T\n : T extends NotWrappable\n ? T\n : {\n -readonly [K in keyof T]: DeepMutable;\n };\n\nexport type CustomPartial = T extends readonly unknown[]\n ? \"0\" extends keyof T\n ? { [K in Extract]?: T[K] }\n : { [x: number]: T[number] }\n : Partial;\n\nexport type PickMutable = {\n [K in keyof T as (() => U extends { [V in K]: T[V] } ? 1 : 2) extends () => U extends {\n -readonly [V in K]: T[V];\n }\n ? 1\n : 2\n ? K\n : never]: T[K];\n};\n\nexport type StorePathRange = { from?: number; to?: number; by?: number };\n\nexport type ArrayFilterFn = (item: T, index: number) => boolean;\n\nexport type StoreSetter =\n | T\n | CustomPartial\n | ((prevState: T, traversed: U) => T | CustomPartial);\n\nexport type Part = KeyOf> =\n | K\n | ([K] extends [never] ? never : readonly K[])\n | ([T] extends [readonly unknown[]] ? ArrayFilterFn | StorePathRange : never);\n\n// shortcut to avoid writing `Exclude` too many times\ntype W = Exclude;\n\n// specially handle keyof to avoid errors with arrays and any\ntype KeyOf = number extends keyof T // have to check this otherwise ts won't allow KeyOf to index T\n ? 0 extends 1 & T // if it's any just return keyof T\n ? keyof T\n : [T] extends [never]\n ? never // keyof never is PropertyKey, which number extends. this must go before\n : // checking [T] extends [readonly unknown[]] because never extends everything\n [T] extends [readonly unknown[]]\n ? number // it's an array or tuple; exclude the non-number properties\n : keyof T // it's something which contains an index signature for strings or numbers\n : keyof T;\n\ntype MutableKeyOf = KeyOf & keyof PickMutable;\n\n// rest must specify at least one (additional) key, followed by a StoreSetter if the key is mutable.\ntype Rest = KeyOf> = [T] extends [never]\n ? never\n : K extends MutableKeyOf\n ? [Part, ...RestSetterOrContinue]\n : K extends KeyOf\n ? [Part, ...RestContinue]\n : never;\n\ntype RestContinue = 0 extends 1 & T\n ? [...Part[], StoreSetter]\n : Rest, U>;\n\ntype RestSetterOrContinue = [StoreSetter] | RestContinue;\n\nexport interface SetStoreFunction {\n <\n K1 extends KeyOf>,\n K2 extends KeyOf[K1]>>,\n K3 extends KeyOf[K1]>[K2]>>,\n K4 extends KeyOf[K1]>[K2]>[K3]>>,\n K5 extends KeyOf[K1]>[K2]>[K3]>[K4]>>,\n K6 extends KeyOf[K1]>[K2]>[K3]>[K4]>[K5]>>,\n K7 extends MutableKeyOf[K1]>[K2]>[K3]>[K4]>[K5]>[K6]>>\n >(\n k1: Part, K1>,\n k2: Part[K1]>, K2>,\n k3: Part[K1]>[K2]>, K3>,\n k4: Part[K1]>[K2]>[K3]>, K4>,\n k5: Part[K1]>[K2]>[K3]>[K4]>, K5>,\n k6: Part[K1]>[K2]>[K3]>[K4]>[K5]>, K6>,\n k7: Part[K1]>[K2]>[K3]>[K4]>[K5]>[K6]>, K7>,\n setter: StoreSetter<\n W[K1]>[K2]>[K3]>[K4]>[K5]>[K6]>[K7],\n [K7, K6, K5, K4, K3, K2, K1]\n >\n ): void;\n <\n K1 extends KeyOf>,\n K2 extends KeyOf[K1]>>,\n K3 extends KeyOf[K1]>[K2]>>,\n K4 extends KeyOf[K1]>[K2]>[K3]>>,\n K5 extends KeyOf[K1]>[K2]>[K3]>[K4]>>,\n K6 extends MutableKeyOf[K1]>[K2]>[K3]>[K4]>[K5]>>\n >(\n k1: Part, K1>,\n k2: Part[K1]>, K2>,\n k3: Part[K1]>[K2]>, K3>,\n k4: Part[K1]>[K2]>[K3]>, K4>,\n k5: Part[K1]>[K2]>[K3]>[K4]>, K5>,\n k6: Part[K1]>[K2]>[K3]>[K4]>[K5]>, K6>,\n setter: StoreSetter[K1]>[K2]>[K3]>[K4]>[K5]>[K6], [K6, K5, K4, K3, K2, K1]>\n ): void;\n <\n K1 extends KeyOf>,\n K2 extends KeyOf[K1]>>,\n K3 extends KeyOf[K1]>[K2]>>,\n K4 extends KeyOf[K1]>[K2]>[K3]>>,\n K5 extends MutableKeyOf[K1]>[K2]>[K3]>[K4]>>\n >(\n k1: Part, K1>,\n k2: Part[K1]>, K2>,\n k3: Part[K1]>[K2]>, K3>,\n k4: Part[K1]>[K2]>[K3]>, K4>,\n k5: Part[K1]>[K2]>[K3]>[K4]>, K5>,\n setter: StoreSetter[K1]>[K2]>[K3]>[K4]>[K5], [K5, K4, K3, K2, K1]>\n ): void;\n <\n K1 extends KeyOf>,\n K2 extends KeyOf[K1]>>,\n K3 extends KeyOf[K1]>[K2]>>,\n K4 extends MutableKeyOf[K1]>[K2]>[K3]>>\n >(\n k1: Part, K1>,\n k2: Part[K1]>, K2>,\n k3: Part[K1]>[K2]>, K3>,\n k4: Part[K1]>[K2]>[K3]>, K4>,\n setter: StoreSetter[K1]>[K2]>[K3]>[K4], [K4, K3, K2, K1]>\n ): void;\n <\n K1 extends KeyOf>,\n K2 extends KeyOf[K1]>>,\n K3 extends MutableKeyOf[K1]>[K2]>>\n >(\n k1: Part, K1>,\n k2: Part[K1]>, K2>,\n k3: Part[K1]>[K2]>, K3>,\n setter: StoreSetter[K1]>[K2]>[K3], [K3, K2, K1]>\n ): void;\n >, K2 extends MutableKeyOf[K1]>>>(\n k1: Part, K1>,\n k2: Part[K1]>, K2>,\n setter: StoreSetter[K1]>[K2], [K2, K1]>\n ): void;\n >>(k1: Part, K1>, setter: StoreSetter[K1], [K1]>): void;\n (setter: StoreSetter): void;\n // fallback\n <\n K1 extends KeyOf>,\n K2 extends KeyOf[K1]>>,\n K3 extends KeyOf[K1]>[K2]>>,\n K4 extends KeyOf[K1]>[K2]>[K3]>>,\n K5 extends KeyOf[K1]>[K2]>[K3]>[K4]>>,\n K6 extends KeyOf[K1]>[K2]>[K3]>[K4]>[K5]>>,\n K7 extends KeyOf[K1]>[K2]>[K3]>[K4]>[K5]>[K6]>>\n >(\n k1: Part, K1>,\n k2: Part[K1]>, K2>,\n k3: Part[K1]>[K2]>, K3>,\n k4: Part[K1]>[K2]>[K3]>, K4>,\n k5: Part[K1]>[K2]>[K3]>[K4]>, K5>,\n k6: Part[K1]>[K2]>[K3]>[K4]>[K5]>, K6>,\n k7: Part[K1]>[K2]>[K3]>[K4]>[K5]>[K6]>, K7>,\n ...rest: Rest[K1]>[K2]>[K3]>[K4]>[K5]>[K6]>[K7], [K7, K6, K5, K4, K3, K2, K1]>\n ): void;\n}\n\n/**\n * Creates a reactive store that can be read through a proxy object and written with a setter function\n *\n * @description https://docs.solidjs.com/reference/store-utilities/create-store\n */\nexport function createStore(\n ...[store, options]: {} extends T\n ? [store?: T | Store, options?: { name?: string }]\n : [store: T | Store, options?: { name?: string }]\n): [get: Store, set: SetStoreFunction] {\n const unwrappedStore = unwrap((store || {}) as T);\n const isArray = Array.isArray(unwrappedStore);\n if (IS_DEV && typeof unwrappedStore !== \"object\" && typeof unwrappedStore !== \"function\")\n throw new Error(\n `Unexpected type ${typeof unwrappedStore} received when initializing 'createStore'. Expected an object.`\n );\n const wrappedStore = wrap(unwrappedStore);\n if (IS_DEV) DEV!.registerGraph({ value: unwrappedStore, name: options && options.name });\n function setStore(...args: any[]): void {\n batch(() => {\n isArray && args.length === 1\n ? updateArray(unwrappedStore, args[0])\n : updatePath(unwrappedStore, args);\n });\n }\n\n return [wrappedStore, setStore];\n}\n" }, { "path": "packages/solid/store/test/modifiers.spec.ts", "content": "import { describe, expect, test } from \"vitest\";\n\nimport { createRoot, createSignal, createEffect } from \"../../src/index.js\";\nimport {\n createStore,\n createMutable,\n reconcile,\n produce,\n unwrap,\n modifyMutable\n} from \"../src/index.js\";\n\ndescribe(\"setState with reconcile\", () => {\n test(\"Reconcile a simple object\", () => {\n const [state, setState] = createStore<{ data: number; missing?: string }>({\n data: 2,\n missing: \"soon\"\n });\n expect(state.data).toBe(2);\n expect(state.missing).toBe(\"soon\");\n setState(reconcile({ data: 5 }));\n expect(state.data).toBe(5);\n expect(state.missing).toBeUndefined();\n });\n\n test(\"Reconcile array with nulls\", () => {\n const [state, setState] = createStore([null, \"a\"]);\n expect(state[0]).toBe(null);\n expect(state[1]).toBe(\"a\");\n setState(reconcile([\"b\", null]));\n expect(state[0]).toBe(\"b\");\n expect(state[1]).toBe(null);\n });\n\n test(\"Reconcile a simple object on a nested path\", () => {\n const [state, setState] = createStore<{\n data: { user: { firstName: string; middleName: string; lastName?: string } };\n }>({\n data: { user: { firstName: \"John\", middleName: \"\", lastName: \"Snow\" } }\n });\n expect(state.data.user.firstName).toBe(\"John\");\n expect(state.data.user.lastName).toBe(\"Snow\");\n setState(\"data\", \"user\", reconcile({ firstName: \"Jake\", middleName: \"R\" }));\n expect(state.data.user.firstName).toBe(\"Jake\");\n expect(state.data.user.middleName).toBe(\"R\");\n expect(state.data.user.lastName).toBeUndefined();\n });\n\n test(\"Reconcile a simple object on a nested path with no prev state\", () => {\n const [state, setState] = createStore<{ user?: { firstName: string; middleName: string } }>({});\n expect(state.user).toBeUndefined();\n setState(\"user\", reconcile({ firstName: \"Jake\", middleName: \"R\" }));\n expect(state.user!.firstName).toBe(\"Jake\");\n expect(state.user!.middleName).toBe(\"R\");\n });\n\n test(\"Reconcile reorder a keyed array\", () => {\n const JOHN = { id: 1, firstName: \"John\", lastName: \"Snow\" },\n NED = { id: 2, firstName: \"Ned\", lastName: \"Stark\" },\n BRANDON = { id: 3, firstName: \"Brandon\", lastName: \"Start\" },\n ARYA = { id: 4, firstName: \"Arya\", lastName: \"Start\" };\n const [state, setState] = createStore({ users: [JOHN, NED, BRANDON] });\n expect(Object.is(unwrap(state.users[0]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), BRANDON)).toBe(true);\n setState(\"users\", reconcile([NED, JOHN, BRANDON]));\n expect(Object.is(unwrap(state.users[0]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), BRANDON)).toBe(true);\n setState(\"users\", reconcile([NED, BRANDON, JOHN]));\n expect(Object.is(unwrap(state.users[0]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), BRANDON)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), JOHN)).toBe(true);\n setState(\"users\", reconcile([NED, BRANDON, JOHN, ARYA]));\n expect(Object.is(unwrap(state.users[0]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), BRANDON)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[3]), ARYA)).toBe(true);\n setState(\"users\", reconcile([BRANDON, JOHN, ARYA]));\n expect(Object.is(unwrap(state.users[0]), BRANDON)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), ARYA)).toBe(true);\n });\n\n test(\"Reconcile overwrite in non-keyed merge mode\", () => {\n const JOHN = { id: 1, firstName: \"John\", lastName: \"Snow\" },\n NED = { id: 2, firstName: \"Ned\", lastName: \"Stark\" },\n BRANDON = { id: 3, firstName: \"Brandon\", lastName: \"Start\" };\n const [state, setState] = createStore({\n users: [{ ...JOHN }, { ...NED }, { ...BRANDON }]\n });\n expect(state.users[0].id).toBe(1);\n expect(state.users[0].firstName).toBe(\"John\");\n expect(state.users[1].id).toBe(2);\n expect(state.users[1].firstName).toBe(\"Ned\");\n expect(state.users[2].id).toBe(3);\n expect(state.users[2].firstName).toBe(\"Brandon\");\n setState(\n \"users\",\n reconcile([{ ...NED }, { ...JOHN }, { ...BRANDON }], {\n merge: true,\n key: null\n })\n );\n expect(state.users[0].id).toBe(2);\n expect(state.users[0].firstName).toBe(\"Ned\");\n expect(state.users[1].id).toBe(1);\n expect(state.users[1].firstName).toBe(\"John\");\n expect(state.users[2].id).toBe(3);\n expect(state.users[2].firstName).toBe(\"Brandon\");\n });\n\n test(\"Reconcile top level key mismatch\", () => {\n const JOHN = { id: 1, firstName: \"John\", lastName: \"Snow\" },\n NED = { id: 2, firstName: \"Ned\", lastName: \"Stark\" };\n\n const [user, setUser] = createStore(JOHN);\n expect(user.id).toBe(1);\n expect(user.firstName).toBe(\"John\");\n setUser(reconcile(NED));\n expect(user.id).toBe(2);\n expect(user.firstName).toBe(\"Ned\");\n });\n\n test(\"Reconcile nested top level key mismatch\", () => {\n const JOHN = { id: 1, firstName: \"John\", lastName: \"Snow\" },\n NED = { id: 2, firstName: \"Ned\", lastName: \"Stark\" };\n\n const [user, setUser] = createStore({ user: JOHN });\n expect(user.user.id).toBe(1);\n expect(user.user.firstName).toBe(\"John\");\n setUser(\"user\", reconcile(NED));\n expect(user.user.id).toBe(2);\n expect(user.user.firstName).toBe(\"Ned\");\n });\n\n test(\"Reconcile top level key missing\", () => {\n const [store, setStore] = createStore<{ id?: number; value?: string }>({\n id: 0,\n value: \"value\"\n });\n setStore(reconcile({}));\n expect(store.id).toBe(undefined);\n expect(store.value).toBe(undefined);\n });\n\n test(\"Reconcile overwrite an object with an array\", () => {\n const [store, setStore] = createStore<{ value: {} | [] }>({\n value: { a: { b: 1 } }\n });\n\n setStore(reconcile({ value: { c: [1, 2, 3] } }));\n expect(store.value).toEqual({ c: [1, 2, 3] });\n });\n\n test(\"Reconcile overwrite an array with an object\", () => {\n const [store, setStore] = createStore<{ value: {} | [] }>({\n value: [1, 2, 3]\n });\n setStore(reconcile({ value: { name: \"John\" } }));\n expect(Array.isArray(store.value)).toBeFalsy();\n expect(store.value).toEqual({ name: \"John\" });\n setStore(reconcile({ value: [1, 2, 3] }));\n expect(store.value).toEqual([1, 2, 3]);\n setStore(reconcile({ value: { q: \"aa\" } }));\n expect(store.value).toEqual({ q: \"aa\" });\n });\n});\n\ndescribe(\"setState with produce\", () => {\n interface DataState {\n data: { ending?: number; starting: number };\n }\n test(\"Top Level Mutation\", () => {\n const [state, setState] = createStore({ data: { starting: 1, ending: 1 } });\n setState(\n produce(s => {\n s.data.ending = s.data.starting + 1;\n })\n );\n expect(state.data.starting).toBe(1);\n expect(state.data.ending).toBe(2);\n });\n test(\"referential equality\", () => {\n const [state, setState] = createStore({ data: { starting: 1, ending: 1 } });\n setState(\n produce(s => {\n if (s.data === s.data) s.data.ending!++;\n })\n );\n expect(state.data.starting).toBe(1);\n expect(state.data.ending).toBe(2);\n });\n test(\"Top Level Mutation in computation\", () => {\n createRoot(() => {\n const [s, set] = createSignal(1);\n const [state, setState] = createStore<{ data: number[] }>({ data: [] });\n createEffect(() => {\n setState(\n produce(state => {\n state.data.push(s());\n })\n );\n });\n createEffect(() => state.data.length);\n });\n expect(true).toBe(true);\n });\n test(\"Nested Level Mutation\", () => {\n const [state, setState] = createStore({ data: { starting: 1, ending: 1 } });\n setState(\n \"data\",\n produce(s => {\n s.ending = s.starting + 1;\n })\n );\n expect(state.data.starting).toBe(1);\n expect(state.data.ending).toBe(2);\n });\n test(\"Top Level Deletion\", () => {\n const [state, setState] = createStore({ data: { starting: 1, ending: 1 } });\n setState(\n produce(s => {\n delete s.data.ending;\n })\n );\n expect(state.data.starting).toBe(1);\n expect(state.data.ending).not.toBeDefined();\n });\n test(\"Top Level Object Mutation\", () => {\n const [state, setState] = createStore({ data: { starting: 1, ending: 1 } }),\n next = { starting: 3, ending: 6 };\n setState(\n produce(s => {\n s.data = next;\n })\n );\n expect(unwrap(state.data)).toBe(next);\n expect(state.data.starting).toBe(3);\n expect(state.data.ending).toBe(6);\n });\n test(\"Test Array Mutation\", () => {\n interface TodoState {\n todos: { id: number; title: string; done: boolean }[];\n }\n const [state, setState] = createStore({\n todos: [\n { id: 1, title: \"Go To Work\", done: true },\n { id: 2, title: \"Eat Lunch\", done: false }\n ]\n });\n setState(\n produce(s => {\n s.todos[1].done = true;\n s.todos.push({ id: 3, title: \"Go Home\", done: false });\n })\n );\n expect(Array.isArray(state.todos)).toBe(true);\n expect(state.todos[1].done).toBe(true);\n expect(state.todos[2].title).toBe(\"Go Home\");\n });\n\n test(\"Test Top-Level Array Mutation\", () => {\n type TodoState = Array<{\n id: number;\n title: string;\n done: boolean;\n }>;\n const [state, setState] = createStore([\n { id: 1, title: \"Go To Work\", done: true },\n { id: 2, title: \"Eat Lunch\", done: false }\n ]);\n setState(\n produce(s => {\n s[1].done = true;\n s.push({ id: 3, title: \"Go Home\", done: false });\n })\n );\n expect(Array.isArray(state)).toBe(true);\n expect(state[1].done).toBe(true);\n expect(state[2].title).toBe(\"Go Home\");\n });\n});\n\ndescribe(\"modifyMutable with reconcile\", () => {\n test(\"Reconcile a simple object\", () => {\n const state = createMutable<{ data: number; missing?: string }>({\n data: 2,\n missing: \"soon\"\n });\n expect(state.data).toBe(2);\n expect(state.missing).toBe(\"soon\");\n modifyMutable(state, reconcile({ data: 5 }));\n expect(state.data).toBe(5);\n expect(state.missing).toBeUndefined();\n });\n\n test(\"Reconcile a simple object on a nested path\", () => {\n const state = createMutable<{\n data: { user: { firstName: string; middleName: string; lastName?: string } };\n }>({\n data: { user: { firstName: \"John\", middleName: \"\", lastName: \"Snow\" } }\n });\n expect(state.data.user.firstName).toBe(\"John\");\n expect(state.data.user.lastName).toBe(\"Snow\");\n modifyMutable(state.data.user, reconcile({ firstName: \"Jake\", middleName: \"R\" }));\n expect(state.data.user.firstName).toBe(\"Jake\");\n expect(state.data.user.middleName).toBe(\"R\");\n expect(state.data.user.lastName).toBeUndefined();\n });\n\n test(\"Reconcile reorder a keyed array\", () => {\n const JOHN = { id: 1, firstName: \"John\", lastName: \"Snow\" },\n NED = { id: 2, firstName: \"Ned\", lastName: \"Stark\" },\n BRANDON = { id: 3, firstName: \"Brandon\", lastName: \"Start\" },\n ARYA = { id: 4, firstName: \"Arya\", lastName: \"Start\" };\n const state = createMutable({ users: [JOHN, NED, BRANDON] });\n expect(Object.is(unwrap(state.users[0]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), BRANDON)).toBe(true);\n modifyMutable(state.users, reconcile([NED, JOHN, BRANDON]));\n expect(Object.is(unwrap(state.users[0]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), BRANDON)).toBe(true);\n modifyMutable(state.users, reconcile([NED, BRANDON, JOHN]));\n expect(Object.is(unwrap(state.users[0]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), BRANDON)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), JOHN)).toBe(true);\n modifyMutable(state.users, reconcile([NED, BRANDON, JOHN, ARYA]));\n expect(Object.is(unwrap(state.users[0]), NED)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), BRANDON)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[3]), ARYA)).toBe(true);\n modifyMutable(state.users, reconcile([BRANDON, JOHN, ARYA]));\n expect(Object.is(unwrap(state.users[0]), BRANDON)).toBe(true);\n expect(Object.is(unwrap(state.users[1]), JOHN)).toBe(true);\n expect(Object.is(unwrap(state.users[2]), ARYA)).toBe(true);\n });\n\n test(\"Reconcile overwrite in non-keyed merge mode\", () => {\n const JOHN = { id: 1, firstName: \"John\", lastName: \"Snow\" },\n NED = { id: 2, firstName: \"Ned\", lastName: \"Stark\" },\n BRANDON = { id: 3, firstName: \"Brandon\", lastName: \"Start\" };\n const state = createMutable({\n users: [{ ...JOHN }, { ...NED }, { ...BRANDON }]\n });\n expect(state.users[0].id).toBe(1);\n expect(state.users[0].firstName).toBe(\"John\");\n expect(state.users[1].id).toBe(2);\n expect(state.users[1].firstName).toBe(\"Ned\");\n expect(state.users[2].id).toBe(3);\n expect(state.users[2].firstName).toBe(\"Brandon\");\n modifyMutable(\n state.users,\n reconcile([{ ...NED }, { ...JOHN }, { ...BRANDON }], {\n merge: true,\n key: null\n })\n );\n expect(state.users[0].id).toBe(2);\n expect(state.users[0].firstName).toBe(\"Ned\");\n expect(state.users[1].id).toBe(1);\n expect(state.users[1].firstName).toBe(\"John\");\n expect(state.users[2].id).toBe(3);\n expect(state.users[2].firstName).toBe(\"Brandon\");\n });\n});\n\n// type tests\n\n// reconcile\n() => {\n const [state, setState] = createStore<{ data: number; missing: string; partial?: { v: number } }>(\n {\n data: 2,\n missing: \"soon\"\n }\n );\n // @ts-expect-error should not be able to reconcile partial type\n setState(reconcile({ data: 5 }));\n // should be able to reconcile unwrappable types\n setState(\"partial\", reconcile(undefined));\n};\n\n// produce\n() => {\n const [store, setStore] = createStore({ todos: [{ id: 1, text: \"\" }] });\n // should be able to strip readonly from arrays\n setStore(\n \"todos\",\n produce(todos => {\n todos.push({ id: todos[todos.length - 1].id + 1, text: \"\" });\n })\n );\n};\n\n// works regardless of depth\n() => {\n const [store, setStore] = createStore({\n a: { b: { c: { d: { e: { f: { g: { h: { i: 1 } } } } } } } }\n });\n setStore(produce(v => v));\n setStore(reconcile({ ...store }));\n setStore(\n \"a\",\n \"b\",\n \"c\",\n \"d\",\n \"e\",\n \"f\",\n \"g\",\n \"h\",\n produce(v => ({ i: v.i }))\n );\n setStore(\"a\", \"b\", \"c\", \"d\", \"e\", \"f\", \"g\", \"h\", reconcile({ i: 2 }));\n};\n" }, { "path": "packages/solid/store/test/mutable.spec.ts", "content": "import { describe, expect, test } from \"vitest\";\nimport { createRoot, createSignal, createMemo, batch, createEffect } from \"../../src/index.js\";\nimport { Accessor, Setter } from \"../../types/index.js\";\nimport { createMutable, unwrap, $RAW } from \"../src/index.js\";\n\ntest(\"Object.create(null) is allowed\", () => {\n const user = createMutable(Object.assign(Object.create(null), { name: \"John\" }));\n expect(user.name).toBe(\"John\");\n});\n\ndescribe(\"State Mutability\", () => {\n test(\"Setting a property\", () => {\n const user = createMutable({ name: \"John\" });\n expect(user.name).toBe(\"John\");\n user.name = \"Jake\";\n expect(user.name).toBe(\"Jake\");\n });\n\n test(\"Deleting a property\", () => {\n const user = createMutable({ name: \"John\" });\n expect(user.name).toBe(\"John\");\n // @ts-ignore\n delete user.name;\n expect(user.name).toBeUndefined();\n });\n});\n\ndescribe(\"State Getter/Setters\", () => {\n test(\"Testing an update from state\", () => {\n let user: any;\n createRoot(() => {\n user = createMutable({\n name: \"John\",\n get greeting(): string {\n return `Hi, ${this.name}`;\n }\n });\n });\n expect(user.greeting).toBe(\"Hi, John\");\n user.name = \"Jake\";\n expect(user.greeting).toBe(\"Hi, Jake\");\n });\n\n test(\"setting a value with setters\", () => {\n let user: any;\n createRoot(() => {\n user = createMutable({\n firstName: \"John\",\n lastName: \"Smith\",\n get fullName(): string {\n return `${this.firstName} ${this.lastName}`;\n },\n set fullName(value) {\n const parts = value.split(\" \");\n this.firstName = parts[0];\n this.lastName = parts[1];\n }\n });\n });\n expect(user.fullName).toBe(\"John Smith\");\n user.fullName = \"Jake Murray\";\n expect(user.firstName).toBe(\"Jake\");\n expect(user.lastName).toBe(\"Murray\");\n });\n});\n\ndescribe(\"Simple update modes\", () => {\n test(\"Simple Key Value\", () => {\n const state = createMutable({ key: \"\" });\n state.key = \"value\";\n expect(state.key).toBe(\"value\");\n });\n\n test(\"Nested update\", () => {\n const state = createMutable({ data: { starting: 1, ending: 1 } });\n state.data.ending = 2;\n expect(state.data.starting).toBe(1);\n expect(state.data.ending).toBe(2);\n });\n\n test(\"Test Array\", () => {\n const todos = createMutable([\n { id: 1, title: \"Go To Work\", done: true },\n { id: 2, title: \"Eat Lunch\", done: false }\n ]);\n todos[1].done = true;\n todos.push({ id: 3, title: \"Go Home\", done: false });\n expect(Array.isArray(todos)).toBe(true);\n expect(todos[1].done).toBe(true);\n expect(todos[2].title).toBe(\"Go Home\");\n });\n});\n\ndescribe(\"Unwrapping Edge Cases\", () => {\n test(\"Unwrap nested frozen state object\", () => {\n const state = createMutable({\n data: Object.freeze({ user: { firstName: \"John\", lastName: \"Snow\" } })\n }),\n s = unwrap({ ...state });\n expect(s.data.user.firstName).toBe(\"John\");\n expect(s.data.user.lastName).toBe(\"Snow\");\n // @ts-ignore check if proxy still\n expect(s.data.user[$RAW]).toBeUndefined();\n });\n test(\"Unwrap nested frozen array\", () => {\n const state = createMutable({\n data: [{ user: { firstName: \"John\", lastName: \"Snow\" } }]\n }),\n s = unwrap({ data: state.data.slice(0) });\n expect(s.data[0].user.firstName).toBe(\"John\");\n expect(s.data[0].user.lastName).toBe(\"Snow\");\n // @ts-ignore check if proxy still\n expect(s.data[0].user[$RAW]).toBeUndefined();\n });\n test(\"Unwrap nested frozen state array\", () => {\n const state = createMutable({\n data: Object.freeze([{ user: { firstName: \"John\", lastName: \"Snow\" } }])\n }),\n s = unwrap({ ...state });\n expect(s.data[0].user.firstName).toBe(\"John\");\n expect(s.data[0].user.lastName).toBe(\"Snow\");\n // @ts-ignore check if proxy still\n expect(s.data[0].user[$RAW]).toBeUndefined();\n });\n});\n\ndescribe(\"Tracking State changes\", () => {\n test(\"Track a state change\", () => {\n let state: { data: number };\n createRoot(() => {\n state = createMutable({ data: 2 });\n let executionCount = 0;\n\n expect.assertions(2);\n createEffect(() => {\n if (executionCount === 0) expect(state.data).toBe(2);\n else if (executionCount === 1) {\n expect(state.data).toBe(5);\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n });\n state!.data = 5;\n // same value again should not retrigger\n state!.data = 5;\n });\n\n test(\"Deleting an undefined property\", () => {\n let state: { firstName: string; lastName: string | undefined };\n let executionCount = 0;\n createRoot(() => {\n state = createMutable({\n firstName: \"John\",\n lastName: undefined\n });\n\n createEffect(() => {\n state.lastName;\n executionCount++;\n });\n //this should retrigger the execution despite it being undefined\n });\n delete state!.lastName;\n expect(executionCount).toBe(2);\n });\n\n test(\"Track a nested state change\", () => {\n let executionCount = 0;\n let state: { user: { firstName: string; lastName: string } };\n createRoot(() => {\n state = createMutable({\n user: { firstName: \"John\", lastName: \"Smith\" }\n });\n expect.assertions(2);\n createEffect(() => {\n if (executionCount === 0) {\n expect(state.user.firstName).toBe(\"John\");\n } else if (executionCount === 1) {\n expect(state.user.firstName).toBe(\"Jake\");\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n });\n state!.user.firstName = \"Jake\";\n });\n});\n\ndescribe(\"Handling functions in state\", () => {\n test(\"Array Native Methods: Array.Filter\", () => {\n createRoot(() => {\n const list = createMutable([0, 1, 2]),\n getFiltered = createMemo(() => list.filter(i => i % 2));\n expect(getFiltered()).toStrictEqual([1]);\n });\n });\n\n test(\"Track function change\", () => {\n createRoot(() => {\n const state = createMutable<{ fn: () => number }>({\n fn: () => 1\n }),\n getValue = createMemo(() => state.fn());\n state.fn = () => 2;\n expect(getValue()).toBe(2);\n });\n });\n});\n\ndescribe(\"Setting state from Effects\", () => {\n test(\"Setting state from signal\", () => {\n let state: { data: string };\n let getData: Accessor, setData: Setter;\n createRoot(() => {\n (([getData, setData] = createSignal(\"init\")), (state = createMutable({ data: \"\" })));\n // don't do this often\n createEffect(() => (state.data = getData()));\n });\n setData!(\"signal\");\n expect(state!.data).toBe(\"signal\");\n });\n\n test(\"Select Promise\", () =>\n new Promise(done => {\n createRoot(async () => {\n const p = new Promise(resolve => {\n setTimeout(resolve, 20, \"promised\");\n }),\n state = createMutable({ data: \"\" });\n p.then(v => (state.data = v));\n await p;\n expect(state.data).toBe(\"promised\");\n done(undefined);\n });\n }));\n});\n\ndescribe(\"State wrapping\", () => {\n test(\"Setting plain object\", () => {\n const data = { withProperty: \"y\" },\n state = createMutable({ data });\n // not wrapped\n expect(state.data).not.toBe(data);\n });\n test(\"Setting plain array\", () => {\n const data = [1, 2, 3],\n state = createMutable({ data });\n // not wrapped\n expect(state.data).not.toBe(data);\n });\n test(\"Setting non-wrappable\", () => {\n const date = new Date(),\n state = createMutable({ time: date });\n // not wrapped\n expect(state.time).toBe(date);\n });\n test(\"Respects batch in array mutate 2\", () => {\n const state = createMutable([1, 2, 3]);\n batch(() => {\n expect(state.length).toBe(3);\n const move = state.splice(1, 1);\n expect(state.length).toBe(2);\n state.splice(0, 0, ...move);\n expect(state.length).toBe(3);\n expect(state).toEqual([2, 1, 3]);\n });\n expect(state.length).toBe(3);\n expect(state).toEqual([2, 1, 3]);\n });\n});\n\ndescribe(\"In Operator\", () => {\n test(\"wrapped nested class\", () => {\n let access = 0;\n const store = createMutable<{ a?: number; b?: number; c?: number }>({\n a: 1,\n get b() {\n access++;\n return 2;\n }\n });\n\n expect(\"a\" in store).toBe(true);\n expect(\"b\" in store).toBe(true);\n expect(\"c\" in store).toBe(false);\n expect(access).toBe(0);\n\n const [a, b, c] = createRoot(() => {\n return [\n createMemo(() => \"a\" in store),\n createMemo(() => \"b\" in store),\n createMemo(() => \"c\" in store)\n ];\n });\n\n expect(a()).toBe(true);\n expect(b()).toBe(true);\n expect(c()).toBe(false);\n expect(access).toBe(0);\n\n store.c = 3;\n\n expect(a()).toBe(true);\n expect(b()).toBe(true);\n expect(c()).toBe(true);\n expect(access).toBe(0);\n\n delete store.a;\n expect(a()).toBe(false);\n expect(b()).toBe(true);\n expect(c()).toBe(true);\n expect(access).toBe(0);\n\n expect(\"a\" in store).toBe(false);\n expect(\"b\" in store).toBe(true);\n expect(\"c\" in store).toBe(true);\n expect(access).toBe(0);\n });\n});\n" }, { "path": "packages/solid/store/test/mutableWithClass.spec.tsx", "content": "import { describe, expect, test } from \"vitest\";\nimport { createEffect, createRoot } from \"../../src/index.js\";\nimport { createMutable } from \"../src/index.js\";\n\ndescribe(\"Class Operator test\", () => {\n test(\"read and set class\", () => {\n class D {\n f = 1;\n get e() {\n return this.f * 4;\n }\n }\n class A {\n a = 1;\n get b() {\n return this.a * 4;\n }\n child = new D();\n }\n let m: any;\n let count = 0,\n childCount = 0;\n const increment = () => {\n m.a++;\n m.child.f++;\n };\n\n createRoot(() => {\n m = createMutable(new A());\n createEffect(() => {\n m.b;\n count++;\n });\n createEffect(() => {\n m.child.f;\n childCount++;\n });\n increment();\n });\n\n expect(m.b).toBe(8);\n expect(m.child.e).toBe(8);\n expect(count).toBe(1);\n expect(childCount).toBe(1);\n increment();\n expect(m.b).toBe(12);\n expect(m.child.e).toBe(12);\n expect(count).toBe(2);\n expect(childCount).toBe(1);\n increment();\n expect(m.b).toBe(16);\n expect(m.child.e).toBe(16);\n expect(count).toBe(3);\n expect(childCount).toBe(1);\n });\n\n test(\"inherited properties\", () => {\n class A {\n val = 0;\n get getVal() {\n return this.val;\n }\n }\n class B extends A {}\n\n const instance = createMutable(new B());\n let lastVal: number | undefined;\n\n createRoot(() => {\n createEffect(() => {\n lastVal = instance.getVal;\n });\n });\n\n expect(lastVal).toBe(0);\n instance.val = 1;\n expect(lastVal).toBe(1);\n });\n});\n" }, { "path": "packages/solid/store/test/store.spec.ts", "content": "import { describe, expect, test } from \"vitest\";\nimport {\n createRoot,\n createSignal,\n createEffect,\n createMemo,\n batch,\n on,\n untrack,\n mapArray\n} from \"../../src/index.js\";\nimport { createStore, unwrap, $RAW, NotWrappable } from \"../src/index.js\";\n\ndescribe(\"State immutability\", () => {\n test(\"Setting a property\", () => {\n const [state] = createStore({ name: \"John\" });\n expect(state.name).toBe(\"John\");\n state.name = \"Jake\";\n expect(state.name).toBe(\"John\");\n });\n\n test(\"Deleting a property\", () => {\n const [state] = createStore({ name: \"John\" });\n expect(state.name).toBe(\"John\");\n // @ts-expect-error can't delete required property\n delete state.name;\n expect(state.name).toBe(\"John\");\n });\n\n test(\"Immutable state is not mutable even inside setter\", () => {\n const [state, setState] = createStore({ name: \"John\" });\n expect(state.name).toBe(\"John\");\n setState(() => {\n state.name = \"Jake\";\n });\n expect(state.name).toBe(\"John\");\n });\n});\n\ndescribe(\"State Getters\", () => {\n test(\"Testing an update from state\", () => {\n let state: any, setState: Function;\n createRoot(() => {\n [state, setState] = createStore({\n name: \"John\",\n get greeting(): string {\n return `Hi, ${this.name}`;\n }\n });\n });\n expect(state!.greeting).toBe(\"Hi, John\");\n setState!({ name: \"Jake\" });\n expect(state!.greeting).toBe(\"Hi, Jake\");\n });\n\n test(\"Testing an update from state\", () => {\n let state: any, setState: Function;\n createRoot(() => {\n let greeting: () => string;\n [state, setState] = createStore({\n name: \"John\",\n get greeting(): string {\n return greeting();\n }\n });\n greeting = createMemo(() => `Hi, ${state.name}`);\n });\n expect(state!.greeting).toBe(\"Hi, John\");\n setState!({ name: \"Jake\" });\n expect(state!.greeting).toBe(\"Hi, Jake\");\n });\n});\n\ndescribe(\"Simple setState modes\", () => {\n test(\"Simple Key Value\", () => {\n const [state, setState] = createStore({ key: \"\" });\n setState(\"key\", \"value\");\n expect(state.key).toBe(\"value\");\n });\n\n test(\"Top level merge\", () => {\n const [state, setState] = createStore({ starting: 1, ending: 1 });\n setState({ ending: 2 });\n expect(state.starting).toBe(1);\n expect(state.ending).toBe(2);\n });\n\n test(\"Top level merge no arguments\", () => {\n const [state, setState] = createStore({ starting: 1 });\n setState({});\n expect(state.starting).toBe(1);\n });\n\n test(\"Top level state function merge\", () => {\n const [state, setState] = createStore({ starting: 1, ending: 1 });\n setState((s, t) => {\n expect(t).toStrictEqual([]);\n return { ending: s.starting + 1 };\n });\n expect(state.starting).toBe(1);\n expect(state.ending).toBe(2);\n });\n\n test(\"Nested merge\", () => {\n const [state, setState] = createStore({ data: { starting: 1, ending: 1 } });\n setState(\"data\", { ending: 2 });\n expect(state.data.starting).toBe(1);\n expect(state.data.ending).toBe(2);\n });\n\n test(\"Nested state function merge\", () => {\n const [state, setState] = createStore({ data: { starting: 1, ending: 1 } });\n setState(\"data\", (d, t) => {\n expect(t).toStrictEqual([\"data\"]);\n return { ending: d.starting + 1 };\n });\n expect(state.data.starting).toBe(1);\n expect(state.data.ending).toBe(2);\n });\n\n test(\"Test Array\", () => {\n const [todos, setTodos] = createStore([\n { id: 1, title: \"Go To Work\", done: true },\n { id: 2, title: \"Eat Lunch\", done: false }\n ]);\n setTodos(1, { done: true });\n setTodos([...todos, { id: 3, title: \"Go Home\", done: false }]);\n setTodos(t => [...t.slice(1)]);\n expect(Array.isArray(todos)).toBe(true);\n expect(todos[0].done).toBe(true);\n expect(todos[1].title).toBe(\"Go Home\");\n });\n\n test(\"Test Array Nested\", () => {\n const [state, setState] = createStore({\n todos: [\n { id: 1, title: \"Go To Work\", done: true },\n { id: 2, title: \"Eat Lunch\", done: false }\n ]\n });\n setState(\"todos\", 1, { done: true });\n setState(\"todos\", [...state.todos, { id: 3, title: \"Go Home\", done: false }]);\n expect(Array.isArray(state.todos)).toBe(true);\n expect(state.todos[1].done).toBe(true);\n expect(state.todos[2].title).toBe(\"Go Home\");\n });\n});\n\ndescribe(\"Array setState modes\", () => {\n test(\"Update Specific\", () => {\n const [state, setState] = createStore([1, 2, 3, 4, 5]);\n setState([1, 3], (r, t) => {\n expect(typeof t[0]).toBe(\"number\");\n return r * 2;\n });\n expect(state[0]).toBe(1);\n expect(state[1]).toBe(4);\n expect(state[2]).toBe(3);\n expect(state[3]).toBe(8);\n expect(state[4]).toBe(5);\n expect(Object.keys(state)).toStrictEqual([\"0\", \"1\", \"2\", \"3\", \"4\"]);\n });\n test(\"Update Specific Object\", () => {\n const [state, setState] = createStore([1, 2, 3, 4, 5]);\n setState({\n 1: 4,\n 3: 8\n });\n expect(state[0]).toBe(1);\n expect(state[1]).toBe(4);\n expect(state[2]).toBe(3);\n expect(state[3]).toBe(8);\n expect(state[4]).toBe(5);\n expect(Object.keys(state)).toStrictEqual([\"0\", \"1\", \"2\", \"3\", \"4\"]);\n });\n test(\"Update filterFn\", () => {\n const [state, setState] = createStore([1, 2, 3, 4, 5]);\n setState(\n (r, i) => Boolean(i % 2),\n (r, t) => {\n expect(typeof t[0]).toBe(\"number\");\n return r * 2;\n }\n );\n expect(state[0]).toBe(1);\n expect(state[1]).toBe(4);\n expect(state[2]).toBe(3);\n expect(state[3]).toBe(8);\n expect(state[4]).toBe(5);\n });\n test(\"Update traversal range\", () => {\n const [state, setState] = createStore([1, 2, 3, 4, 5]);\n setState({ from: 1, to: 4, by: 2 }, (r, t) => {\n expect(typeof t[0]).toBe(\"number\");\n return r * 2;\n });\n expect(state[0]).toBe(1);\n expect(state[1]).toBe(4);\n expect(state[2]).toBe(3);\n expect(state[3]).toBe(8);\n expect(state[4]).toBe(5);\n });\n test(\"Update traversal range defaults\", () => {\n const [state, setState] = createStore([1, 2, 3, 4, 5]);\n setState({}, (r, t) => {\n expect(typeof t[0]).toBe(\"number\");\n return r * 2;\n });\n expect(state[0]).toBe(2);\n expect(state[1]).toBe(4);\n expect(state[2]).toBe(6);\n expect(state[3]).toBe(8);\n expect(state[4]).toBe(10);\n });\n});\n\ndescribe(\"Unwrapping Edge Cases\", () => {\n test(\"Unwrap nested frozen state object\", () => {\n const [state] = createStore({\n data: Object.freeze({ user: { firstName: \"John\", lastName: \"Snow\" } })\n }),\n s = unwrap({ ...state });\n expect(s.data.user.firstName).toBe(\"John\");\n expect(s.data.user.lastName).toBe(\"Snow\");\n // @ts-ignore check if proxy still\n expect(s.data.user[$RAW]).toBeUndefined();\n });\n test(\"Unwrap nested frozen array\", () => {\n const [state] = createStore({\n data: [{ user: { firstName: \"John\", lastName: \"Snow\" } }]\n }),\n s = unwrap({ data: state.data.slice(0) });\n expect(s.data[0].user.firstName).toBe(\"John\");\n expect(s.data[0].user.lastName).toBe(\"Snow\");\n // @ts-ignore check if proxy still\n expect(s.data[0].user[$RAW]).toBeUndefined();\n });\n test(\"Unwrap nested frozen state array\", () => {\n const [state] = createStore({\n data: Object.freeze([{ user: { firstName: \"John\", lastName: \"Snow\" } }])\n }),\n s = unwrap({ ...state });\n expect(s.data[0].user.firstName).toBe(\"John\");\n expect(s.data[0].user.lastName).toBe(\"Snow\");\n // @ts-ignore check if proxy still\n expect(s.data[0].user[$RAW]).toBeUndefined();\n });\n});\n\ndescribe(\"Tracking State changes\", () => {\n test(\"Track a state change\", () => {\n const [state, setState] = createStore({ data: 2 });\n createRoot(() => {\n let executionCount = 0;\n\n expect.assertions(2);\n createEffect(() => {\n if (executionCount === 0) expect(state.data).toBe(2);\n else if (executionCount === 1) {\n expect(state.data).toBe(5);\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n });\n setState({ data: 5 });\n // same value again should not retrigger\n setState({ data: 5 });\n });\n\n test(\"Track a nested state change\", () => {\n const [state, setState] = createStore({\n user: { firstName: \"John\", lastName: \"Smith\" }\n });\n createRoot(() => {\n let executionCount = 0;\n\n expect.assertions(2);\n createEffect(() => {\n if (executionCount === 0) {\n expect(state.user.firstName).toBe(\"John\");\n } else if (executionCount === 1) {\n expect(state.user.firstName).toBe(\"Jake\");\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n });\n setState(\"user\", \"firstName\", \"Jake\");\n });\n\n test(\"Track array item on removal\", () => {\n const [state, setState] = createStore([1]);\n createRoot(() => {\n let executionCount = 0;\n\n expect.assertions(2);\n createEffect(() => {\n if (executionCount === 0) {\n expect(state[0]).toBe(1);\n } else if (executionCount === 1) {\n expect(state[0]).toBe(undefined);\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n });\n setState([]);\n });\n\n test(\"Tracking Top-Level Array iteration\", () => {\n const [state, setState] = createStore([\"hi\"]);\n let executionCount = 0;\n let executionCount2 = 0;\n let executionCount3 = 0;\n createRoot(() => {\n createEffect(() => {\n for (let i = 0; i < state.length; i++) state[i];\n untrack(() => {\n if (executionCount === 0) expect(state.length).toBe(1);\n else if (executionCount === 1) {\n expect(state.length).toBe(2);\n expect(state[1]).toBe(\"item\");\n } else if (executionCount === 2) {\n expect(state.length).toBe(2);\n expect(state[1]).toBe(\"new\");\n } else if (executionCount === 3) {\n expect(state.length).toBe(1);\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n });\n executionCount++;\n });\n\n createEffect(() => {\n for (const item of state);\n untrack(() => {\n if (executionCount2 === 0) expect(state.length).toBe(1);\n else if (executionCount2 === 1) {\n expect(state.length).toBe(2);\n expect(state[1]).toBe(\"item\");\n } else if (executionCount2 === 2) {\n expect(state.length).toBe(2);\n expect(state[1]).toBe(\"new\");\n } else if (executionCount2 === 3) {\n expect(state.length).toBe(1);\n } else {\n // should never get here\n expect(executionCount2).toBe(-1);\n }\n });\n executionCount2++;\n });\n\n const mapped = mapArray(\n () => state,\n item => item\n );\n createEffect(() => {\n mapped();\n untrack(() => {\n if (executionCount3 === 0) expect(state.length).toBe(1);\n else if (executionCount3 === 1) {\n expect(state.length).toBe(2);\n expect(state[1]).toBe(\"item\");\n } else if (executionCount3 === 2) {\n expect(state.length).toBe(2);\n expect(state[1]).toBe(\"new\");\n } else if (executionCount3 === 3) {\n expect(state.length).toBe(1);\n } else {\n // should never get here\n expect(executionCount3).toBe(-1);\n }\n });\n executionCount3++;\n });\n });\n // add\n setState(1, \"item\");\n\n // update\n setState(1, \"new\");\n\n // delete\n setState(s => [s[0]]);\n expect.assertions(18);\n });\n\n test(\"Tracking iteration Object key addition/removal\", () => {\n const [state, setState] = createStore<{ obj: { item?: number } }>({ obj: {} });\n let executionCount = 0;\n let executionCount2 = 0;\n createRoot(() => {\n createEffect(() => {\n const keys = Object.keys(state.obj);\n if (executionCount === 0) expect(keys.length).toBe(0);\n else if (executionCount === 1) {\n expect(keys.length).toBe(1);\n expect(keys[0]).toBe(\"item\");\n } else if (executionCount === 2) {\n expect(keys.length).toBe(0);\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n\n createEffect(() => {\n for (const key in state.obj) {\n key;\n }\n const u = unwrap(state.obj);\n if (executionCount2 === 0) expect(u.item).toBeUndefined();\n else if (executionCount2 === 1) {\n expect(u.item).toBe(5);\n } else if (executionCount2 === 2) {\n expect(u.item).toBeUndefined();\n } else {\n // should never get here\n expect(executionCount2).toBe(-1);\n }\n executionCount2++;\n });\n });\n // add\n setState(\"obj\", \"item\", 5);\n\n // update\n // setState(\"obj\", \"item\", 10);\n\n // delete\n setState(\"obj\", \"item\", undefined);\n expect.assertions(7);\n });\n\n test(\"Doesn't trigger object on addition/removal\", () => {\n const [state, setState] = createStore<{ obj: { item?: number } }>({ obj: {} });\n let executionCount = 0;\n createRoot(() => {\n createEffect(\n on(\n () => state.obj,\n v => {\n if (executionCount === 0) expect(v.item).toBeUndefined();\n else if (executionCount === 1) {\n expect(v.item).toBe(5);\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n }\n )\n );\n });\n // add\n setState(\"obj\", \"item\", 5);\n\n // delete\n setState(\"obj\", \"item\", undefined);\n expect.assertions(1);\n });\n\n test(\"Tracking Top level iteration Object key addition/removal\", () => {\n const [state, setState] = createStore<{ item?: number }>({});\n let executionCount = 0;\n let executionCount2 = 0;\n createRoot(() => {\n createEffect(() => {\n const keys = Object.keys(state);\n if (executionCount === 0) expect(keys.length).toBe(0);\n else if (executionCount === 1) {\n expect(keys.length).toBe(1);\n expect(keys[0]).toBe(\"item\");\n } else if (executionCount === 2) {\n expect(keys.length).toBe(0);\n } else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n\n createEffect(() => {\n for (const key in state) {\n key;\n }\n const u = unwrap(state);\n if (executionCount2 === 0) expect(u.item).toBeUndefined();\n else if (executionCount2 === 1) {\n expect(u.item).toBe(5);\n } else if (executionCount2 === 2) {\n expect(u.item).toBeUndefined();\n } else {\n // should never get here\n expect(executionCount2).toBe(-1);\n }\n executionCount2++;\n });\n });\n // add\n setState(\"item\", 5);\n\n // delete\n setState(\"item\", undefined);\n expect.assertions(7);\n });\n\n test(\"Not Tracking Top level key addition/removal\", () => {\n const [state, setState] = createStore<{ item?: number; item2?: number }>({});\n let executionCount = 0;\n createRoot(() => {\n createEffect(() => {\n if (executionCount === 0) expect(state.item2).toBeUndefined();\n else {\n // should never get here\n expect(executionCount).toBe(-1);\n }\n executionCount++;\n });\n });\n // add\n setState(\"item\", 5);\n\n // delete\n setState(\"item\", undefined);\n expect.assertions(1);\n });\n});\n\ndescribe(\"Handling functions in state\", () => {\n test(\"Array Native Methods: Array.Filter\", () => {\n createRoot(() => {\n const [state] = createStore({ list: [0, 1, 2] }),\n getFiltered = createMemo(() => state.list.filter(i => i % 2));\n expect(getFiltered()).toStrictEqual([1]);\n });\n });\n\n test(\"Track function change\", () => {\n createRoot(() => {\n const [state, setState] = createStore<{ fn: () => number }>({\n fn: () => 1\n }),\n getValue = createMemo(() => state.fn());\n setState({ fn: () => 2 });\n expect(getValue()).toBe(2);\n });\n });\n});\n\ndescribe(\"Setting state from Effects\", () => {\n test(\"Setting state from signal\", () => {\n const [getData, setData] = createSignal(\"init\"),\n [state, setState] = createStore({ data: \"\" });\n createRoot(() => {\n createEffect(() => setState(\"data\", getData()));\n });\n setData(\"signal\");\n expect(state.data).toBe(\"signal\");\n });\n\n test(\"Select Promise\", () =>\n new Promise(done => {\n createRoot(async () => {\n const p = new Promise(resolve => {\n setTimeout(resolve, 20, \"promised\");\n });\n const [state, setState] = createStore({ data: \"\" });\n p.then(v => setState(\"data\", v));\n await p;\n expect(state.data).toBe(\"promised\");\n done(undefined);\n });\n }));\n});\n\ndescribe(\"Batching\", () => {\n test(\"Respects batch\", () => {\n let data = 1;\n const [state, setState] = createStore({ data: 1 });\n const memo = createRoot(() => createMemo(() => (data = state.data)));\n\n batch(() => {\n expect(state.data).toBe(1);\n expect(memo()).toBe(1);\n expect(data).toBe(1);\n setState(\"data\", 2);\n expect(state.data).toBe(2);\n expect(data).toBe(1);\n expect(memo()).toBe(2);\n expect(data).toBe(2);\n });\n expect(state.data).toBe(2);\n expect(memo!()).toBe(2);\n expect(data).toBe(2);\n });\n test(\"Respects batch in array\", () => {\n let data = 1;\n const [state, setState] = createStore([1]);\n const memo = createRoot(() => createMemo(() => (data = state[0])));\n batch(() => {\n expect(state[0]).toBe(1);\n expect(memo()).toBe(1);\n expect(data).toBe(1);\n setState(0, 2);\n expect(state[0]).toBe(2);\n expect(data).toBe(1);\n expect(memo()).toBe(2);\n expect(data).toBe(2);\n });\n expect(state[0]).toBe(2);\n expect(memo()).toBe(2);\n expect(data).toBe(2);\n });\n test(\"Respects batch in array mutate\", () => {\n let data = 1;\n const [state, setState] = createStore([1]);\n const memo = createRoot(() => createMemo(() => (data = state.length)));\n batch(() => {\n expect(state.length).toBe(1);\n expect(memo()).toBe(1);\n expect(data).toBe(1);\n setState([...state, 2]);\n expect(state.length).toBe(2);\n expect(data).toBe(1);\n expect(memo()).toBe(2);\n expect(data).toBe(2);\n });\n expect(state.length).toBe(2);\n expect(memo()).toBe(2);\n expect(data).toBe(2);\n });\n});\n\ndescribe(\"State wrapping\", () => {\n test(\"Setting plain object\", () => {\n const data = { withProperty: \"y\" },\n [state] = createStore({ data });\n // not wrapped\n expect(state.data).not.toBe(data);\n });\n test(\"Setting plain array\", () => {\n const data = [1, 2, 3],\n [state] = createStore({ data });\n // not wrapped\n expect(state.data).not.toBe(data);\n });\n test(\"Setting non-wrappable\", () => {\n const date = new Date(),\n [state] = createStore({ time: date });\n // not wrapped\n expect(state.time).toBe(date);\n });\n});\n\ndescribe(\"Array length\", () => {\n test(\"Setting plain object\", () => {\n const [state, setState] = createStore<{ list: number[] }>({ list: [] });\n let length;\n // isolate length tracking\n const list = state.list;\n createRoot(() => {\n createEffect(() => {\n length = list.length;\n });\n });\n expect(length).toBe(0);\n // insert at index 0\n setState(\"list\", 0, 1);\n expect(length).toBe(1);\n });\n});\n\ndescribe(\"State recursion\", () => {\n test(\"there is no infinite loop\", () => {\n const x: { a: number; b: any } = { a: 1, b: undefined };\n x.b = x;\n\n const [state, setState] = createStore(x);\n expect(state.a).toBe(state.b.a);\n });\n});\n\ndescribe(\"Nested Classes\", () => {\n test(\"wrapped nested class\", () => {\n class CustomThing {\n a: number;\n b: number;\n constructor(value: number) {\n this.a = value;\n this.b = 10;\n }\n }\n\n const [inner] = createStore(new CustomThing(1));\n const [store, setStore] = createStore({ inner });\n\n expect(store.inner.a).toBe(1);\n expect(store.inner.b).toBe(10);\n\n let sum;\n createRoot(() => {\n createEffect(() => {\n sum = store.inner.a + store.inner.b;\n });\n });\n expect(sum).toBe(11);\n setStore(\"inner\", \"a\", 10);\n expect(sum).toBe(20);\n setStore(\"inner\", \"b\", 5);\n expect(sum).toBe(15);\n });\n\n test(\"not wrapped nested class\", () => {\n class CustomThing {\n a: number;\n b: number;\n constructor(value: number) {\n this.a = value;\n this.b = 10;\n }\n }\n const [store, setStore] = createStore({ inner: new CustomThing(1) });\n\n expect(store.inner.a).toBe(1);\n expect(store.inner.b).toBe(10);\n\n let sum;\n createRoot(() => {\n createEffect(() => {\n sum = store.inner.a + store.inner.b;\n });\n });\n expect(sum).toBe(11);\n setStore(\"inner\", \"a\", 10);\n expect(sum).toBe(11);\n setStore(\"inner\", \"b\", 5);\n expect(sum).toBe(11);\n });\n});\n\ndescribe(\"In Operator\", () => {\n test(\"wrapped nested class\", () => {\n let access = 0;\n const [store, setStore] = createStore<{ a?: number; b?: number; c?: number }>({\n a: 1,\n get b() {\n access++;\n return 2;\n }\n });\n\n expect(\"a\" in store).toBe(true);\n expect(\"b\" in store).toBe(true);\n expect(\"c\" in store).toBe(false);\n expect(access).toBe(0);\n\n const [a, b, c] = createRoot(() => {\n return [\n createMemo(() => \"a\" in store),\n createMemo(() => \"b\" in store),\n createMemo(() => \"c\" in store)\n ];\n });\n\n expect(a()).toBe(true);\n expect(b()).toBe(true);\n expect(c()).toBe(false);\n expect(access).toBe(0);\n\n setStore(\"c\", 3);\n\n expect(a()).toBe(true);\n expect(b()).toBe(true);\n expect(c()).toBe(true);\n expect(access).toBe(0);\n\n setStore(\"a\", undefined);\n expect(a()).toBe(false);\n expect(b()).toBe(true);\n expect(c()).toBe(true);\n expect(access).toBe(0);\n\n expect(\"a\" in store).toBe(false);\n expect(\"b\" in store).toBe(true);\n expect(\"c\" in store).toBe(true);\n expect(access).toBe(0);\n });\n});\n\n// type tests\n\n// NotWrappable keys are ignored\n() => {\n const [, setStore] = createStore<{\n a?:\n | undefined\n | {\n b: null | { c: number | { d: bigint | { e: Function | { f: symbol | { g: string } } } } };\n };\n }>({});\n setStore(\"a\", \"b\", \"c\", \"d\", \"e\", \"f\", \"g\", \"h\");\n};\n\n// Cannot update readonly keys\n() => {\n const [, setK1] = createStore({} as { readonly i: number });\n // @ts-expect-error i is readonly\n setK1(\"i\", 2);\n const [, setK2] = createStore({} as { i: { readonly j: number } });\n // @ts-expect-error j is readonly\n setK2(\"i\", \"j\", 3);\n const [, setK3] = createStore({} as { i: { j: { readonly k: number } } });\n // @ts-expect-error k is readonly\n setK3(\"i\", \"j\", \"k\", 4);\n const [, setK4] = createStore({} as { i: { j: { k: { readonly l: number } } } });\n // @ts-expect-error l is readonly\n setK4(\"i\", \"j\", \"k\", \"l\", 5);\n const [, setK5] = createStore({} as { i: { j: { k: { l: { readonly m: number } } } } });\n // @ts-expect-error m is readonly\n setK5(\"i\", \"j\", \"k\", \"l\", \"m\", 6);\n const [, setK6] = createStore({} as { i: { j: { k: { l: { m: { readonly n: number } } } } } });\n // @ts-expect-error n is readonly, but has unreadable error due to method overloading\n setK6(\"i\", \"j\", \"k\", \"l\", \"m\", \"n\", 7);\n const [, setK7] = createStore(\n {} as { i: { j: { k: { l: { m: { n: { readonly o: number } } } } } } }\n );\n // @ts-expect-error o is readonly, but has unreadable error due to method overloading\n setK7(\"i\", \"j\", \"k\", \"l\", \"m\", \"n\", \"o\", 8);\n const [, setKn] = createStore(\n {} as { i: { j: { k: { l: { m: { n: { o: { readonly p: number } } } } } } } }\n );\n // @ts-expect-error p is readonly\n setKn(\"i\", \"j\", \"k\", \"l\", \"m\", \"n\", \"o\", \"p\", 9);\n};\n\n// keys are narrowed\n() => {\n const [store, setStore] = createStore({ a: { b: 1 }, c: { d: 2 } });\n setStore(\"a\", \"b\", 3);\n setStore(\"c\", \"d\", 4);\n // @ts-expect-error a.d is not valid\n setStore(\"a\", \"d\", 5);\n // @ts-expect-error a.d is not valid\n store.a.d;\n // @ts-expect-error c.b is not valid\n setStore(\"c\", \"b\", 6);\n // @ts-expect-error c.b is not valid\n store.c.b;\n};\n\n// array key types are inferred\n() => {\n const [, setStore] = createStore({ list: [1, 2, 3] });\n setStore(\n \"list\",\n (v, i) => i === 0,\n (v, t) => v * 2\n );\n setStore(\"list\", { from: 1, to: 2 }, 4);\n setStore(\"list\", [2, 3], 4);\n};\n\n// fallback overload correctly infers keys and setter\n() => {\n const [, setStore] = createStore({\n a: { b: { c: { d: { e: { f: { g: { h: { i: { j: { k: 1 } } } } } } } } } }\n });\n setStore(\"a\", \"b\", \"c\", \"d\", \"e\", \"f\", \"g\", \"h\", \"i\", \"j\", (v, t) => ({\n k: 2\n }));\n setStore(\"a\", \"b\", \"c\", \"d\", \"e\", \"f\", \"g\", \"h\", \"i\", \"j\", \"k\", 2);\n};\n\n// same as the above but with strings which have more types of keys\n() => {\n const [, setStore] = createStore({\n a: { b: { c: { d: { e: { f: { g: { h: { i: { j: { k: \"l\" } } } } } } } } } }\n });\n setStore(\"a\", \"b\", \"c\", \"d\", \"e\", \"f\", \"g\", \"h\", \"i\", \"j\", \"k\", \"m\");\n setStore(\"a\", \"b\", \"c\", \"d\", \"e\", \"f\", \"g\", \"h\", \"i\", \"j\", (v, t) => ({\n k: \"m\"\n }));\n};\n\n// tuples are correctly typed\n() => {\n const [, setStore] = createStore({ data: [\"a\", 1] as [string, number] });\n setStore(\"data\", 0, \"hello\");\n setStore(\"data\", 1, 2);\n // @ts-expect-error number not assignable to string\n setStore(\"data\", 0, 3);\n // @ts-expect-error string not assignable to number\n setStore(\"data\", 1, \"world\");\n};\n\n// // cannot mutate a store directly\n// () => {\n// const [store, setStore] = createStore({ a: 1, nested: { a: 1 } });\n// // @ts-expect-error cannot set\n// store.a = 1;\n// // @ts-expect-error cannot set\n// store.nested.a = 1;\n// // @ts-expect-error cannot delete\n// delete store.a;\n// // @ts-expect-error cannot delete\n// delete store.nested.a;\n// // @ts-expect-error cannot set in setter\n// setStore(s => (s.a = 1));\n// // @ts-expect-error cannot set in setter\n// setStore(s => (s.nested.a = 1));\n// };\n\n// cannot mutate unnested classes\n() => {\n const [store, setStore] = createStore({ inner: new Uint8Array() });\n // TODO @ts-expect-error\n setStore(\"inner\", 0, 2);\n const [inner] = createStore(new Uint8Array());\n const [, setNested] = createStore({ inner });\n setNested(\"inner\", 0, 2);\n};\n\n// createStore initial value\n() => {\n createStore();\n createStore<{ a?: { b: 1 } }>();\n createStore(() => 1);\n // @ts-expect-error cannot create store from null\n createStore(null);\n // @ts-expect-error cannot create store from number\n createStore(1);\n // @ts-expect-error cannot create store from string\n createStore(\"a\");\n // @ts-expect-error cannot create store from symbol\n createStore(Symbol());\n // @ts-expect-error cannot create store from bigint\n createStore(BigInt(0));\n // @ts-expect-error must provide initial value if {} cannot be assigned to it\n createStore<{ a: 1 }>();\n};\n\n// recursive\n() => {\n type Recursive = { a: Recursive };\n const [store, setStore] = createStore({} as Recursive);\n setStore(\"a\", \"a\", \"a\", \"a\", {});\n // @ts-expect-error TODO should work with recursive types even at rest depth\n setStore(\"a\", \"a\", \"a\", \"a\", \"a\", \"a\", \"a\", \"a\", \"a\", \"a\", {});\n store.a.a.a.a.a.a.a.a.a;\n};\n\n// TODO Wrappable instead of NotWrappable\n() => {\n type User = {\n name: string;\n data: number[];\n };\n let user: User = { name: \"Jake\", data: [1, 2, 3] };\n // @ts-expect-error plain objects are wrappable\n let a: NotWrappable = user;\n let b: NotWrappable = 1;\n let c: NotWrappable = \"string\";\n let d: NotWrappable = BigInt(0);\n let e: NotWrappable = Symbol();\n let f: NotWrappable = undefined;\n let g: NotWrappable = null;\n let h: NotWrappable = () => 1;\n // @ts-expect-error TODO classes are not wrappable\n let i: NotWrappable = new Uint8Array();\n};\n\n// interactions with `any`\n() => {\n const [, setStore] = createStore<{ a: any; b?: { c: string } }>({ a: {} });\n // allows anything when accessing `any`\n setStore(\"a\", \"b\", \"c\", \"d\", \"e\", \"f\", \"g\", \"h\", \"i\");\n setStore(\"a\", 1, \"c\", Symbol(), 2, 1, 2, 3, 4, 5, 6, 1, 2, 3, \"a\", Symbol());\n // still infers correctly on other paths\n setStore(\"b\", \"c\", \"d\");\n // @ts-expect-error\n setStore(\"b\", 2);\n setStore(\"b\", \"c\", v => v);\n};\n\n// interactions with `unknown`\n() => {\n const [, setStore] = createStore<{ a: unknown }>({ a: {} });\n // allows any setter\n setStore(\"a\", \"a\");\n setStore(\"a\", () => ({ a: { b: 1 } }));\n\n // @ts-expect-error doesn't allow string\n setStore(\"a\", \"b\", 1);\n // @ts-expect-error doesn't allow number\n setStore(\"a\", 1, 1);\n // @ts-expect-error doesn't allow symbol\n setStore(\"a\", Symbol(), 1);\n};\n\n// interactions with generics\n(v: T) => {\n type A = { a: T; b: Record; c: Record };\n const a = {} as A;\n const [store, setStore] = createStore(a);\n // should allow\n setStore(\"a\", v);\n setStore(\"b\", \"a\", \"c\");\n setStore(\"b\", v, \"c\");\n // @ts-expect-error TODO generic should index Record\n setStore(\"c\", v, \"c\");\n const b = store.c[v];\n const c: typeof b = \"1\";\n const d = a.c[v];\n const e: typeof d = \"1\";\n};\n\n// traversed contains the correct types of keys\n() => {\n const [, setStore] = createStore({ a: [{ b: 1 }] });\n setStore((v, t) => {\n const expectedT: [] = t;\n t = [] as [];\n return v;\n });\n setStore(\"a\", (v, t) => {\n const expectedT: [\"a\"] = t;\n t = [\"a\"];\n return v;\n });\n setStore(\"a\", 0, (v, t) => {\n const expectedT: [0, \"a\"] = t;\n t = [0, \"a\"];\n return v;\n });\n // array of keys\n setStore([\"a\"], [0], (v, t) => {\n const expectedT: [0, \"a\"] = t;\n t = [0, \"a\"];\n return v;\n });\n // callback\n setStore(\n [\"a\"],\n () => true,\n (v, t) => {\n const expectedT: [number, \"a\"] = t;\n t = [0, \"a\"];\n return v;\n }\n );\n // { from, to, by }\n setStore([\"a\"], {}, (v, t) => {\n const expectedT: [number, \"a\"] = t;\n t = [0, \"a\"];\n return v;\n });\n};\n\n// types with a string index signature are not wrongly assumed to be arrays in setStore\n() => {\n const [store, setStore] = createStore<{ [x: string]: number }>({});\n // @ts-expect-error filter function not allowed for objects\n setStore(() => true, 1);\n // @ts-expect-error from to by not allowed for objects\n setStore({ from: 0, to: 10, by: 3 }, 1);\n};\n\n// can set overly complex? types\n() => {\n const [store, setStore] = createStore<{ el?: Element }>({});\n setStore(\"el\", {} as Element);\n};\n\n// can set tuple indices\n() => {\n const [store, setStore] = createStore({ list: [0] as [number, number?] });\n setStore(\"list\", { 0: 1, 1: 2 });\n setStore(\"list\", { 0: 1 });\n setStore(\"list\", { 1: 2 });\n setStore(\"list\", {});\n // @ts-expect-error tuple only contains two items\n setStore(\"list\", { 2: 3 });\n};\n\n// can set array indices\n() => {\n const [store, setStore] = createStore({ list: [0] as number[] });\n setStore(\"list\", { 0: 1, 1: 2 });\n setStore(\"list\", { 0: 1 });\n setStore(\"list\", { 1: 2 });\n setStore(\"list\", { 99: 100 });\n};\n\n// can set top-level tuple indices\n() => {\n const [store, setStore] = createStore([0] as [number, number?]);\n setStore({ 0: 1, 1: 2 });\n setStore({ 0: 1 });\n setStore({ 1: 2 });\n setStore({});\n // @ts-expect-error tuple only contains two items\n setStore({ 2: 3 });\n};\n\n// can set top-level array indices\n() => {\n const [store, setStore] = createStore([0] as number[]);\n setStore({ 0: 1, 1: 2 });\n setStore({ 0: 1 });\n setStore({ 1: 2 });\n setStore({ 99: 100 });\n};\n" }, { "path": "packages/solid/store/tsconfig.build.json", "content": "{\n \"extends\": \"../../../tsconfig.json\",\n \"compilerOptions\": {\n \"outDir\": \"./types\",\n \"baseUrl\": \"src\",\n \"paths\": {\n \"solid-js\": [\"../..\"],\n \"solid-js/jsx-runtime\": [\"../../src/jsx\"],\n \"solid-js/jsx-dev-runtime\": [\"../../src/jsx\"],\n }\n },\n \"include\": [\"./src\"]\n}\n" }, { "path": "packages/solid/store/tsconfig.json", "content": "{\n \"extends\": \"./tsconfig.build.json\",\n \"include\": [\"./src\", \"./test\"]\n}\n" }, { "path": "packages/solid/test/MessageChannel.ts", "content": "// @ts-ignore\nglobalThis.MessageChannel = class {\n port1: { onmessage?: any } = {};\n port2 = {\n postMessage: () => {\n setTimeout(this.port1.onmessage, 0);\n }\n };\n};\n" }, { "path": "packages/solid/test/array.spec.ts", "content": "import { describe, expect, test } from \"vitest\";\nimport { mapArray, indexArray, createSignal, createMemo, createRoot } from \"../src/index.js\";\n\ndescribe(\"Map operator\", () => {\n test(\"simple mapArray\", () => {\n createRoot(() => {\n const [s, set] = createSignal([1, 2, 3, 4]),\n r = createMemo(mapArray(s, v => v * 2));\n expect(r()).toEqual([2, 4, 6, 8]);\n set([3, 4, 5]);\n expect(r()).toEqual([6, 8, 10]);\n });\n });\n\n test(\"show fallback\", () => {\n createRoot(() => {\n const [s, set] = createSignal([1, 2, 3, 4]),\n double = mapArray(s, v => v * 2, {\n fallback: () => \"Empty\"\n }),\n r = createMemo(double);\n expect(r()).toEqual([2, 4, 6, 8]);\n set([]);\n expect(r()).toEqual([\"Empty\"]);\n set([3, 4, 5]);\n expect(r()).toEqual([6, 8, 10]);\n });\n });\n});\n\ndescribe(\"Index operator\", () => {\n test(\"simple indexArray\", () => {\n createRoot(() => {\n const [s, set] = createSignal([1, 2, 3, 4]),\n r = createMemo(indexArray(s, v => v() * 2));\n expect(r()).toEqual([2, 4, 6, 8]);\n });\n });\n\n test(\"show fallback\", () => {\n createRoot(() => {\n const [s, set] = createSignal([1, 2, 3, 4]),\n double = indexArray(s, v => v() * 2, {\n fallback: () => \"Empty\"\n }),\n r = createMemo(double);\n expect(r()).toEqual([2, 4, 6, 8]);\n set([]);\n expect(r()).toEqual([\"Empty\"]);\n set([3, 4, 5]);\n expect(r()).toEqual([6, 8, 10]);\n });\n });\n});\n" }, { "path": "packages/solid/test/component.bench.ts", "content": "import { mergeProps, splitProps } from \"../src/index.js\";\nimport { $PROXY } from \"../src/reactive/signal.js\";\nimport { bench, describe } from \"vitest\";\n\nconst staticDesc = {\n value: 1,\n writable: true,\n configurable: true,\n enumerable: true\n};\n\nconst signalDesc = {\n get() {\n return 1;\n },\n configurable: true,\n enumerable: true\n};\n\nconst cache = new Map();\n\nconst createObject = (\n name: string,\n amount: number,\n desc: (index: number) => PropertyDescriptor\n) => {\n const key = `${name}-${amount}`;\n const cached = cache.get(key);\n if (cached) return cached;\n const proto: Record = {};\n for (let index = 0; index < amount; ++index) proto[`${name}${index}`] = desc(index);\n const result = Object.defineProperties({}, proto) as Record;\n cache.set(key, result);\n return result;\n};\n\nconst keys = (o: Record) => Object.keys(o);\n\ntype Test = {\n title: string;\n benchs: { title: string; func: any }[];\n};\n\nfunction createTest any, G extends (...args: any[]) => any>(options: {\n name: string;\n /**\n * `vitest bench -t \"FILTER\"` does not work\n */\n filter?: RegExp;\n subjects: {\n name: string;\n func: T;\n }[];\n generator: Record;\n inputs: (generator: G) => Record>;\n}) {\n const tests: Test[] = [];\n for (const generatorName in options.generator) {\n const generator = options.generator[generatorName];\n const inputs = options.inputs(generator);\n for (const inputName in inputs) {\n const args = inputs[inputName];\n const test: Test = {\n title: `${options.name}-${generatorName}${inputName}`,\n benchs: []\n };\n if (options.filter && !options.filter.exec(test.title)) continue;\n for (const subject of options.subjects) {\n test.benchs.push({\n title: subject.name,\n func: () => subject.func(...args)\n });\n }\n tests.push(test);\n }\n }\n return tests;\n}\n\ntype SplitProps = (...args: any[]) => Record[];\n\nconst generator = {\n static: (amount: number) => createObject(\"static\", amount, () => staticDesc),\n signal: (amount: number) => createObject(\"signal\", amount, () => signalDesc),\n mixed: (amount: number) => createObject(\"mixed\", amount, v => (v % 2 ? staticDesc : signalDesc)),\n store: (amount: number) => {\n const data = createObject(\"store\", amount, () => staticDesc);\n // Create a proxy that mimics store behavior with $PROXY symbol\n const proxy = new Proxy(data, {\n get(target, property) {\n if (property === $PROXY) return proxy;\n return target[property];\n },\n has(target, property) {\n if (property === $PROXY) return true;\n return property in target;\n },\n ownKeys(target) {\n return Reflect.ownKeys(target);\n }\n });\n Object.defineProperty(data, $PROXY, { value: proxy, configurable: true });\n return proxy;\n }\n} as const;\n\nconst filter = new RegExp(process.env.FILTER || \".+\");\n\nconst splitPropsTests = createTest({\n filter,\n name: \"splitProps\",\n subjects: [\n {\n name: \"splitProps\",\n func: splitProps as SplitProps\n }\n ],\n generator,\n inputs: g => ({\n \"(5, 1)\": [g(5), keys(g(1))],\n \"(2, 15)\": [g(2), keys(g(15))],\n \"(2, 100)\": [g(2), keys(g(100))],\n \"(0, 15)\": [g(0), keys(g(15))],\n \"(25, 5)\": [g(25), keys(g(5))],\n \"(25, 100)\": [g(25), keys(g(100))],\n \"(50, 100)\": [g(50), keys(g(100))],\n \"(100, 25)\": [g(100), keys(g(25))],\n \"(5, 1, 2)\": [g(5), keys(g(1)), keys(g(2))],\n \"(2, 3, 2)\": [g(2), keys(g(3)), keys(g(2))],\n \"(2, 100, 3, 2)\": [g(2), keys(g(100)), keys(g(3)), keys(g(2))]\n })\n});\n\nconst mergePropsTest = createTest({\n name: \"mergeProps\",\n filter,\n subjects: [\n {\n name: \"mergeProps\",\n func: mergeProps\n }\n ],\n generator,\n inputs: g => ({\n \"(5, 1)\": [g(5), g(1)],\n \"(2, 15)\": [g(2), g(15)],\n \"(2, 100)\": [g(2), g(100)],\n \"(0, 15)\": [g(0), g(15)],\n \"(25, 5)\": [g(25), g(5)],\n \"(25, 100)\": [g(25), g(100)],\n \"(50, 100)\": [g(50), g(100)],\n \"(100, 25)\": [g(100), g(25)],\n \"(5, 1, 2)\": [g(5), g(1), g(2)],\n \"(2, 3, 2)\": [g(2), g(3), g(2)],\n \"(2, 100, 3, 2)\": [g(2), g(100), g(3), g(2)]\n })\n});\n\nfor (const test of splitPropsTests) {\n describe(test.title, () => {\n for (const { title, func } of test.benchs) bench(title, func);\n });\n}\n\nfor (const test of mergePropsTest) {\n describe(test.title, () => {\n for (const { title, func } of test.benchs) bench(title, func);\n });\n}\n" }, { "path": "packages/solid/test/component.spec.ts", "content": "import { describe, expect, it, test } from \"vitest\";\nimport {\n createRoot,\n createComponent,\n mergeProps,\n splitProps,\n createUniqueId,\n createSignal,\n createEffect,\n JSX\n} from \"../src/index.js\";\nimport { createStore } from \"../store/src/index.js\";\n\ntype SimplePropTypes = {\n a?: string | null;\n b?: string | null;\n c?: string | null;\n d?: string | null;\n};\n\nconst Comp = (props: { greeting: string; name: string }) => `${props.greeting} ${props.name}`;\n\nconst Comp2 = (props: { greeting: string; name: string; optional?: string }) => {\n const [p, q] = splitProps(props, [\"greeting\", \"optional\"]);\n expect((p as any).name).toBeUndefined();\n expect((q as any).greeting).toBeUndefined();\n return `${p.greeting} ${q.name}`;\n};\n\ndescribe(\"CreateComponent\", () => {\n test(\"create simple component\", () => {\n createRoot(() => {\n const out = createComponent(Comp, {\n greeting: \"Hi\",\n get name() {\n return \"dynamic\";\n }\n });\n expect(out).toBe(\"Hi dynamic\");\n });\n });\n test(\"null/undefined props are replaced with empty props\", () => {\n createRoot(() => {\n const nonObjects = [null, undefined, false];\n nonObjects.forEach(nonObject => {\n const out = createComponent(p => p as JSX.Element, nonObject as any);\n expect(out).toEqual({});\n });\n });\n });\n});\n\ndescribe(\"mergeProps\", () => {\n test(\"falsey values\", () => {\n let props: SimplePropTypes = {\n get a() {\n return \"ji\";\n },\n b: null,\n c: \"j\"\n };\n props = mergeProps(props, false, null, undefined);\n expect(props.a).toBe(\"ji\");\n expect(props.b).toBe(null);\n expect(props.c).toBe(\"j\");\n });\n it(\"skips undefined values\", () => {\n let bValue: number | undefined;\n const a = { value: 1 };\n const b = {\n get value() {\n return bValue;\n }\n };\n const c = {\n get value() {\n return undefined;\n }\n };\n const d = { value: undefined };\n const props = mergeProps(a, b, c, d);\n expect(props.value).toBe(1);\n bValue = 2;\n expect(props.value).toBe(2);\n });\n it(\"includes undefined property\", () => {\n const value = { a: undefined };\n const getter = {\n get a() {\n return undefined;\n }\n };\n expect(\"a\" in mergeProps(value)).toBeTruthy();\n expect(\"a\" in mergeProps(getter)).toBeTruthy();\n expect(\"a\" in mergeProps(value, getter)).toBeTruthy();\n expect(\"a\" in mergeProps(getter, value)).toBeTruthy();\n });\n it(\"doesn't keep references for non-getters\", () => {\n const a = { value1: 1 };\n const b = { value2: 2 };\n const props = mergeProps(a, b);\n a.value1 = b.value2 = 3;\n expect(props.value1).toBe(1);\n expect(props.value2).toBe(2);\n expect(Object.keys(props).join()).toBe(\"value1,value2\");\n });\n it(\"without getter transfers only value\", () => {\n const a = { value1: 1 };\n const b = {\n get value2() {\n return undefined;\n }\n };\n const props = mergeProps(a, b);\n a.value1 = 3;\n expect(props.value1).toBe(1);\n expect(Object.keys(props).join()).toBe(\"value1,value2\");\n });\n it(\"overrides enumerables\", () => {\n const a = Object.defineProperties(\n {},\n {\n value1: {\n enumerable: false,\n value: 2\n }\n }\n );\n const props = mergeProps({}, a);\n expect((props as any).value1).toBe(2);\n expect(Object.getOwnPropertyDescriptor(props, \"value1\")?.enumerable).toBeTruthy();\n expect(Object.keys(props).join()).toBe(\"value1\");\n });\n it(\"does not write the target\", () => {\n const props = { value1: 1 };\n mergeProps(props, {\n value2: 2,\n get value3() {\n return 3;\n }\n });\n expect(Object.keys(props).join(\"\")).toBe(\"value1\");\n });\n it(\"always returns a new reference\", () => {\n const props = {};\n const newProps = mergeProps(props);\n expect(props === newProps).toBeFalsy();\n });\n it(\"uses the source instances\", () => {\n const source1 = {\n get a() {\n return this;\n }\n };\n const source2 = {\n get b() {\n return this;\n }\n };\n const props = mergeProps(source1, source2);\n expect(props.a === source1).toBeTruthy();\n expect(props.b === source2).toBeTruthy();\n });\n it(\"does not clone nested objects\", () => {\n const b = { value: 1 };\n const props = mergeProps({ a: 1 }, { b });\n b.value = 2;\n expect(props.b.value).toBe(2);\n });\n it(\"ignores undefined values\", () => {\n const props = mergeProps({ a: 1 }, { a: undefined });\n expect(props.a).toBe(1);\n });\n it(\"handles null values\", () => {\n const props = mergeProps({ a: 1 }, { a: null });\n expect(props.a).toBeNull();\n });\n it(\"contains null values\", () => {\n const props = mergeProps({\n a: null,\n get b() {\n return null;\n }\n });\n expect(props.a).toBeNull();\n expect(props.b).toBeNull();\n });\n it(\"contains undefined values\", () => {\n const props = mergeProps({\n a: undefined,\n get b() {\n return undefined;\n }\n });\n expect(Object.keys(props).join()).toBe(\"a,b\");\n expect(\"a\" in props).toBeTruthy();\n expect(\"b\" in props).toBeTruthy();\n expect(props.a).toBeUndefined();\n expect(props.b).toBeUndefined();\n });\n it(\"ignores falsy sources\", () => {\n const props = mergeProps(undefined, null, { value: 1 }, null, undefined);\n expect(Object.keys(props).join()).toBe(\"value\");\n });\n it(\"fails with non objects sources\", () => {\n expect(() => mergeProps({ value: 1 }, true)).toThrowError();\n expect(() => mergeProps({ value: 1 }, 1)).toThrowError();\n });\n it(\"works with a array source\", () => {\n const props = mergeProps({ value: 1 }, [2]);\n expect(Object.keys(props).join()).toBe(\"0,value,length\");\n expect(props.value).toBe(1);\n expect(props.length).toBe(1);\n expect(props[0]).toBe(2);\n });\n it(\"is safe\", () => {\n mergeProps({}, JSON.parse('{ \"__proto__\": { \"evil\": true } }'));\n expect(({} as any).evil).toBeUndefined();\n mergeProps({}, JSON.parse('{ \"prototype\": { \"evil\": true } }'));\n expect(({} as any).evil).toBeUndefined();\n mergeProps({ value: 1 }, JSON.parse('{ \"__proto__\": { \"evil\": true } }'));\n expect(({} as any).evil).toBeUndefined();\n mergeProps({ value: 1 }, JSON.parse('{ \"prototype\": { \"evil\": true } }'));\n expect(({} as any).evil).toBeUndefined();\n });\n it(\"sets already prototyped properties\", () => {\n expect(mergeProps({ toString: 1 }).toString).toBe(1);\n expect({}.toString).toBeTypeOf(\"function\");\n });\n});\n\ndescribe(\"Set Default Props\", () => {\n test(\"simple set\", () => {\n let props: SimplePropTypes = {\n get a() {\n return \"ji\";\n },\n b: null,\n c: \"j\"\n },\n defaults: SimplePropTypes = { a: \"yy\", b: \"ggg\", d: \"DD\" };\n props = mergeProps(defaults, props);\n expect(props.a).toBe(\"ji\");\n expect(props.b).toBe(null);\n expect(props.c).toBe(\"j\");\n expect(props.d).toBe(\"DD\");\n });\n});\n\ndescribe(\"Clone Props\", () => {\n test(\"simple set\", () => {\n let reactive = false;\n const props: SimplePropTypes = {\n get a() {\n reactive = true;\n return \"ji\";\n },\n b: null,\n c: \"j\"\n };\n const newProps = mergeProps({}, props);\n expect(reactive).toBe(false);\n expect(newProps.a).toBe(\"ji\");\n expect(reactive).toBe(true);\n expect(newProps.b).toBe(null);\n expect(newProps.c).toBe(\"j\");\n expect(newProps.d).toBe(undefined);\n });\n});\n\ndescribe(\"Clone Store\", () => {\n test(\"simple set\", () => {\n const [state, setState] = createStore<{ a: string; b: string; c?: string }>({\n a: \"Hi\",\n b: \"Jo\"\n });\n const clone = mergeProps(state);\n expect(clone.a).toBe(\"Hi\");\n expect(clone.b).toBe(\"Jo\");\n setState({ a: \"Greetings\", c: \"John\" });\n expect(clone.a).toBe(\"Greetings\");\n expect(clone.b).toBe(\"Jo\");\n expect(clone.c).toBe(\"John\");\n });\n});\n\ndescribe(\"Merge Signal\", () => {\n test(\"simple set\", () => {\n const [s, set] = createSignal({\n get a() {\n return \"ji\";\n },\n b: null,\n c: \"j\"\n }),\n defaults: SimplePropTypes = { a: \"yy\", b: \"ggg\", d: \"DD\" };\n let props!: SimplePropTypes;\n const res: string[] = [];\n createRoot(() => {\n props = mergeProps(defaults, s);\n createEffect(() => {\n res.push(props.a as string);\n });\n });\n expect(props.a).toBe(\"ji\");\n expect(props.b).toBe(null);\n expect(props.c).toBe(\"j\");\n expect(props.d).toBe(\"DD\");\n set({ a: \"h\" });\n expect(props.a).toBe(\"h\");\n expect(props.b).toBe(\"ggg\");\n expect(props.c).toBeUndefined();\n expect(props.d).toBe(\"DD\");\n expect(res[0]).toBe(\"ji\");\n expect(res[1]).toBe(\"h\");\n expect(res.length).toBe(2);\n });\n\n test(\"null/undefined/false are ignored\", () => {\n const props = mergeProps({ a: 1 }, null, undefined, false);\n expect(props).toEqual({ a: 1 });\n });\n});\n\ndescribe(\"SplitProps Props\", () => {\n test(\"SplitProps in two\", () => {\n createRoot(() => {\n const out = createComponent(Comp2, {\n greeting: \"Hi\",\n get name() {\n return \"dynamic\";\n }\n });\n expect(out).toBe(\"Hi dynamic\");\n });\n });\n test(\"SplitProps in two with store\", () => {\n createRoot(() => {\n const [state] = createStore({ greeting: \"Yo\", name: \"Bob\" });\n const out = createComponent(Comp2, state);\n expect(out).toBe(\"Yo Bob\");\n });\n });\n test(\"SplitProps result is inmutable\", () => {\n const inProps = { first: 1, second: 2 };\n const [props, otherProps] = splitProps(inProps, [\"first\"]);\n inProps.first = inProps.second = 3;\n expect(props.first).toBe(1);\n expect(otherProps.second).toBe(2);\n });\n test(\"SplitProps clones the descriptor\", () => {\n let signalValue = 1;\n const desc = {\n signal: {\n enumerable: true,\n get() {\n return signalValue;\n }\n },\n static: {\n configurable: true,\n enumerable: false,\n value: 2\n }\n };\n const inProps = Object.defineProperties({}, desc) as { signal: number; value1: number };\n const [props, otherProps] = splitProps(inProps, [\"signal\"]);\n\n expect(props.signal).toBe(1);\n signalValue++;\n expect(props.signal).toBe(2);\n\n const signalDesc = Object.getOwnPropertyDescriptor(props, \"signal\")!;\n expect(signalDesc.get === desc.signal.get).toBeTruthy();\n expect(signalDesc.set).toBeUndefined();\n expect(signalDesc.enumerable).toBeTruthy();\n expect(signalDesc.configurable).toBeFalsy();\n\n const staticDesc = Object.getOwnPropertyDescriptor(otherProps, \"static\")!;\n expect(staticDesc.value).toBe(2);\n expect(staticDesc.get).toBeUndefined();\n expect(staticDesc.set).toBeUndefined();\n expect(staticDesc.enumerable).toBeFalsy();\n expect(staticDesc.configurable).toBeTruthy();\n });\n test(\"SplitProps with multiple keys\", () => {\n const inProps: {\n id?: string;\n color?: string;\n margin?: number;\n padding?: number;\n variant?: string;\n description?: string;\n } = {\n id: \"input\",\n color: \"red\",\n margin: 3,\n variant: \"outlined\",\n description: \"test\"\n };\n\n const [styleProps, inputProps, otherProps] = splitProps(\n inProps,\n [\"color\", \"margin\", \"padding\"],\n [\"variant\", \"description\"]\n );\n\n expect(styleProps.color).toBe(\"red\");\n expect(styleProps.margin).toBe(3);\n expect(styleProps.padding).toBeUndefined();\n expect(Object.keys(styleProps).length).toBe(2);\n\n expect(inputProps.description).toBe(\"test\");\n expect(inputProps.variant).toBe(\"outlined\");\n expect(Object.keys(inputProps).length).toBe(2);\n\n expect(otherProps.id).toBe(\"input\");\n expect(Object.keys(otherProps).length).toBe(1);\n });\n test(\"SplitProps returns same prop descriptors\", () => {\n const inProps = {\n a: 1,\n b: 2,\n get c() {\n return 3;\n },\n d: undefined,\n x: 1,\n y: 2,\n get w() {\n return 3;\n },\n z: undefined\n };\n const inDescriptor = Object.getOwnPropertyDescriptors(inProps);\n const [props, otherProps] = splitProps(inProps, [\"a\", \"b\", \"c\", \"d\", \"e\" as \"d\"]);\n\n const propsDesc = Object.getOwnPropertyDescriptors(props);\n expect(propsDesc.a).toMatchObject(inDescriptor.a);\n expect(propsDesc.b).toMatchObject(inDescriptor.b);\n expect(propsDesc.c).toMatchObject(inDescriptor.c);\n expect(propsDesc.d).toMatchObject(inDescriptor.d);\n expect(propsDesc.e).toBeUndefined();\n\n const otherDesc = Object.getOwnPropertyDescriptors(otherProps);\n expect(otherDesc.w).toMatchObject(otherDesc.w);\n expect(otherDesc.x).toMatchObject(otherDesc.x);\n expect(otherDesc.y).toMatchObject(otherDesc.y);\n expect(otherDesc.z).toMatchObject(otherDesc.z);\n });\n test(\"SplitProps is safe\", () => {\n const inProps = JSON.parse('{\"__proto__\": { \"evil\": true } }');\n const [, evilProps1] = splitProps(inProps, []);\n\n expect(evilProps1.__proto__?.evil).toBeTruthy();\n expect(({} as any).evil).toBeUndefined();\n\n const [evilProps2] = splitProps(inProps, [\"__proto__\"]);\n\n expect(evilProps2.__proto__?.evil).toBeTruthy();\n expect(({} as any).evil).toBeUndefined();\n });\n\n test(\"Merge SplitProps\", () => {\n let value: string | undefined = undefined;\n const [splittedProps] = splitProps({ color: \"blue\" } as { color: string; other?: string }, [\n \"color\",\n \"other\"\n ]);\n const mergedProps = mergeProps(splittedProps, {\n get color() {\n return value;\n },\n other: \"value\"\n });\n expect(mergedProps.color).toBe(\"blue\");\n value = \"red\";\n expect(mergedProps.color).toBe(\"red\");\n });\n});\n\ndescribe(\"createUniqueId\", () => {\n test(\"creating some\", () => {\n const id1 = createUniqueId();\n const id2 = createUniqueId();\n\n expect(id1).toBeDefined();\n expect(id2).toBeDefined();\n expect(id1).not.toEqual(id2);\n });\n});\n" }, { "path": "packages/solid/test/component.type-tests.ts", "content": "import { mergeProps, splitProps } from \"../src/index.js\";\n\ntype Assert = never;\n// from: https://github.com/Microsoft/TypeScript/issues/27024#issuecomment-421529650\ntype IsExact =\n (() => G extends T | I ? 1 : 2) extends () => G extends U | I ? 1 : 2 ? true : false;\n\n// m1: mergeProps multiple property case\nconst m1 = mergeProps(\n {} as {\n a: number;\n b: number;\n c: number;\n d?: number;\n e?: number;\n f?: number;\n i: number;\n j?: number;\n m: undefined;\n n: undefined;\n o?: undefined;\n p: number;\n q: 1;\n r: number;\n s: 1;\n },\n {} as {\n b: string;\n c?: string;\n e: string;\n f?: string;\n g: string;\n h?: string;\n i: undefined;\n j: undefined;\n k: undefined;\n l?: undefined;\n m: string;\n n?: string;\n o?: string;\n p: 1;\n q: number;\n r?: 1;\n s?: number;\n }\n);\ntype M1 = typeof m1;\ntype TestM1 = Assert<\n IsExact<\n M1,\n {\n a: number;\n b: string;\n c: string | number;\n d?: number | undefined;\n e: string;\n f?: string | number | undefined;\n g: string;\n h?: string;\n i: number;\n j: number | undefined;\n k: undefined;\n l?: undefined;\n m: string;\n n: string | undefined;\n o?: string | undefined;\n p: 1;\n q: number;\n r: number;\n s: number;\n }\n >\n>;\n\n// m2-m3: mergeProps single property cases\n// optional is kept optional\nconst m2 = mergeProps({ a: 1 } as { a?: number }, { a: 1 } as { a?: number });\ntype M2 = typeof m2;\ntype TestM2 = Assert>;\n\n// undefined is ignored\nconst m3 = mergeProps({ a: 1 }, { a: undefined });\ntype M3 = typeof m3;\ntype TestM3 = Assert>;\n\n// m4: mergeProps works with generics (best effort)\ntype M4Type = {\n a: { aProp: string; test: string };\n b: { bProp: number; test: string };\n};\nfunction M4(\n props: { prop: \"a\" | \"b\" } & { as: T } & Omit\n) {\n const defaultProperties = { prop: \"a\" };\n const test1 = mergeProps(defaultProperties, props);\n const prop1: \"a\" | \"b\" = test1.prop;\n const propstr1: string = test1.prop;\n const as1: T = test1.as;\n const str1: string = test1.test;\n test1.prop = \"a\";\n test1.as = \"\" as T;\n test1.test = \"\";\n\n const test2 = mergeProps(defaultProperties, props as { prop: \"a\" | \"b\" } & { as: T } & M4Type[T]);\n const prop2: \"a\" | \"b\" = test2.prop;\n const propstr2: string = test2.prop;\n const as2: T = test2.as;\n const str2: string = test2.test;\n test2.prop = \"a\";\n test2.as = \"\" as T;\n test2.test = \"\";\n\n const test3 = mergeProps(defaultProperties, ...[props]);\n const prop3: \"a\" | \"b\" = test3.prop;\n const propstr3: string = test3.prop;\n const as3: T = test3.as!;\n const str3: string = test3.test!;\n test3.prop = \"a\";\n test3.as = \"\" as T;\n test3.test = \"\";\n\n const test4 = mergeProps(...[defaultProperties], props);\n const prop4: \"a\" | \"b\" = test4.prop;\n const propstr4: string = test4.prop;\n const as4: T = test4.as;\n const str4: string = test4.test;\n test4.prop = \"a\";\n test4.as = \"\" as T;\n test4.test = \"\";\n\n const test5 = mergeProps(defaultProperties, ...[props], props);\n const prop5: \"a\" | \"b\" = test5.prop;\n const propstr5: string = test5.prop;\n const as5: T = test5.as;\n const str5: string = test5.test;\n test5.prop = \"a\";\n test5.as = \"\" as T;\n test5.test = \"\";\n\n const test6 = mergeProps(props, props);\n const prop6: \"a\" | \"b\" = test6.prop;\n const propstr6: string = test6.prop;\n const as6: T = test6.as;\n const str6: string = test6.test;\n test6.prop = \"a\";\n test6.as = \"\" as T;\n test6.test = \"\";\n}\n\n{\n const a = { a: 1 };\n const b = { b: 2 };\n const c = { c: 3 };\n const bc = { b: 2, c: 3 };\n // m5-m7: mergeProps spreading arrays is valid\n const m5 = mergeProps(a, ...[b], c);\n type M5 = typeof m5;\n type TestM5 = Assert>;\n\n const m6 = mergeProps(...[b], c);\n type M6 = typeof m6;\n type TestM6 = Assert>;\n\n const m7 = mergeProps(a, ...[b]);\n type M7 = typeof m7;\n type TestM7 = Assert>;\n\n const m8 = mergeProps(...[b]);\n type M8 = typeof m8;\n type TestM8 = Assert>;\n\n const m9 = mergeProps(...[a], ...[b], ...[c]);\n type M9 = typeof m9;\n type TestM9 = Assert>;\n}\n\n// s1-s3: splitProps return type is correct regardless of usage\nconst s1 = splitProps({ a: 1, b: 2 }, [\"a\"]);\ntype S1 = typeof s1;\ntype TestS1 = Assert>;\n\nconst [, s2] = splitProps({ a: 1, b: 2 }, [\"a\"]);\ntype S2 = typeof s2;\ntype TestS2 = Assert>;\n\nconst [s3] = splitProps({ a: 1, b: 2 }, [\"a\"]);\ntype S3 = typeof s3;\ntype TestS3 = Assert>;\n" }, { "path": "packages/solid/test/dev.spec.ts", "content": "import { describe, expect, test, vi } from \"vitest\";\nimport {\n createRoot,\n getOwner,\n createSignal,\n createEffect,\n createComputed,\n DEV,\n createContext,\n createComponent\n} from \"../src/index.js\";\nimport type { DevComponent } from \"../src/reactive/signal.js\";\nimport { createStore, unwrap, DEV as STORE_DEV } from \"../store/src/index.js\";\n\ndescribe(\"Dev features\", () => {\n test(\"Signals being added to sourceMap with user-provided names\", () => {\n createRoot(() => {\n const owner = getOwner()!;\n createSignal(3, { name: \"test\" });\n createSignal(5);\n createSignal(6, { name: \"explicit\" });\n expect(owner).toHaveProperty(\"sourceMap\");\n expect(owner.sourceMap![0].name).toBe(\"test\");\n expect(owner.sourceMap![0].value).toBe(3);\n expect(owner.sourceMap![1].name).toBe(undefined);\n expect(owner.sourceMap![1].value).toBe(5);\n expect(owner.sourceMap![2].name).toBe(\"explicit\");\n expect(owner.sourceMap![2].value).toBe(6);\n });\n });\n\n test(\"Computations can be named\", () => {\n createRoot(() => {\n const owner = getOwner()!;\n createComputed(() => {}, undefined, { name: \"test\" });\n createEffect(() => {}, undefined, { name: \"test_effect\" });\n createComputed(() => {});\n createEffect(() => {});\n expect(owner).toHaveProperty(\"owned\");\n expect(owner.owned![0].name).toBe(\"test\");\n expect(owner.owned![1].name).toBe(\"test_effect\");\n expect(owner.owned![2].name).toBe(undefined);\n expect(owner.owned![3].name).toBe(undefined);\n });\n });\n\n test(\"Context nodes can be named\", () => {\n createRoot(dispose => {\n const ctx1 = createContext(undefined);\n const ctx2 = createContext(undefined, { name: \"test\" });\n ctx1.Provider({ value: undefined, children: undefined });\n ctx2.Provider({ value: undefined, children: undefined });\n expect(getOwner()!.owned![0].name).toBe(undefined);\n expect(getOwner()!.owned![1].name).toBe(\"test\");\n dispose();\n });\n });\n\n test(\"AfterUpdate Hook\", () => {\n let triggered = 0;\n let set1: (v: number) => number, setState1: any;\n DEV!.hooks.afterUpdate = () => triggered++;\n createRoot(() => {\n const [s, set] = createSignal(5);\n const [s2] = createSignal(5);\n createEffect(() => {\n const [s] = createSignal(6, { name: \"explicit\" });\n });\n const [state, setState] = createStore({ firstName: \"John\", lastName: \"Smith\" });\n createEffect(() => {\n s();\n s2();\n state.firstName;\n });\n set1 = set;\n setState1 = setState;\n });\n expect(triggered).toBe(1);\n set1!(7);\n expect(triggered).toBe(2);\n setState1({ middleInitial: \"R.\", firstName: \"Matt\" });\n expect(triggered).toBe(3);\n });\n\n test(\"AfterUpdate Hook with effect write\", () => {\n let triggered = 0;\n let set1: (v: number) => number;\n let log = \"\";\n DEV!.hooks.afterUpdate = () => triggered++;\n createRoot(() => {\n const [s, set] = createSignal(5);\n const [s2, set2] = createSignal(0);\n const [s3, set3] = createSignal(0);\n createComputed(() => {\n log += \"a\";\n set3(s2());\n });\n createEffect(() => {\n log += \"b\";\n set2(s());\n });\n createEffect(() => {\n log += \"c\";\n s3();\n });\n set1 = set;\n });\n expect(triggered).toBe(1);\n expect(log).toBe(\"abcac\");\n log = \"\";\n set1!(7);\n expect(triggered).toBe(2);\n expect(log).toBe(\"bac\");\n });\n\n test(\"afterCreateOwner Hook\", () => {\n const cb = vi.fn();\n DEV!.hooks.afterCreateOwner = cb;\n createRoot(() => {\n expect(cb).toHaveBeenCalledTimes(1);\n expect(cb).toHaveBeenLastCalledWith(getOwner());\n createRoot(_ => {\n expect(cb).toHaveBeenCalledTimes(2);\n expect(cb).toHaveBeenLastCalledWith(getOwner());\n });\n createComputed(() => {\n expect(cb).toHaveBeenCalledTimes(3);\n expect(cb).toHaveBeenLastCalledWith(getOwner());\n });\n });\n });\n\n test(\"afterRegisterGraph Hook\", () => {\n createRoot(() => {\n const owner = getOwner()!;\n const cb = vi.fn();\n DEV!.hooks.afterRegisterGraph = cb;\n\n createSignal(1);\n expect(cb).toHaveBeenCalledTimes(1);\n expect(cb).toHaveBeenLastCalledWith(owner.sourceMap![0]);\n expect(owner.sourceMap).toHaveLength(1);\n\n createSignal(2, { internal: true });\n expect(cb).toHaveBeenCalledTimes(1);\n expect(owner.sourceMap).toHaveLength(1);\n\n createStore({});\n expect(cb).toHaveBeenCalledTimes(2);\n expect(cb).toHaveBeenLastCalledWith(owner.sourceMap![1]);\n expect(owner.sourceMap).toHaveLength(2);\n\n const customValue = { value: 3 };\n DEV!.registerGraph(customValue);\n expect(cb).toHaveBeenCalledTimes(3);\n expect(cb).toHaveBeenLastCalledWith(customValue);\n expect(owner.sourceMap).toHaveLength(3);\n });\n });\n\n test(\"OnStoreNodeUpdate Hook\", () => {\n const cb = vi.fn();\n STORE_DEV!.hooks.onStoreNodeUpdate = cb;\n const [s, set] = createStore({ firstName: \"John\", lastName: \"Smith\", inner: { foo: 1 } });\n expect(cb).toHaveBeenCalledTimes(0);\n set({ firstName: \"Matt\" });\n expect(cb).toHaveBeenCalledTimes(1);\n expect(cb).toHaveBeenCalledWith(unwrap(s), \"firstName\", \"Matt\", \"John\");\n set(\"inner\", \"foo\", 2);\n expect(cb).toHaveBeenCalledTimes(2);\n expect(cb).toHaveBeenCalledWith(unwrap(s.inner), \"foo\", 2, 1);\n });\n\n test(\"createComponent should create a component owner in DEV\", () => {\n createRoot(() => {\n const props = {};\n createComponent(function MyComponent() {\n const owner = getOwner() as DevComponent<{}>;\n expect(owner.name).toBe(\"MyComponent\");\n expect(owner.props).toBe(props);\n expect(owner.component).toBe(MyComponent);\n return null;\n }, props);\n });\n });\n});\n" }, { "path": "packages/solid/test/external-source.spec.ts", "content": "import { afterEach, beforeEach, describe, expect, it, vi } from \"vitest\";\nimport { createRoot, createMemo, untrack, enableExternalSource } from \"../src/index.js\";\n\nimport \"./MessageChannel\";\n\nclass ExternalSource {\n listeners: Set<() => void> = new Set();\n\n constructor(private value: T) {}\n\n update(x: T) {\n this.value = x;\n this.listeners.forEach(x => x());\n }\n\n get() {\n if (listener) {\n this.listeners.add(listener!);\n sources.get(listener!)!.add(this);\n }\n return this.value;\n }\n\n removeListener(listener: () => void) {\n this.listeners.delete(listener);\n }\n}\n\nlet listener: (() => void) | null = null;\n\nfunction untrackSource(fn: () => T) {\n const tmp = listener;\n listener = null;\n try {\n return fn();\n } finally {\n listener = tmp;\n }\n}\n\nlet sources: Map<() => void, Set> = new Map();\n\ndescribe(\"external source\", () => {\n beforeEach(() => {\n enableExternalSource((fn, trigger) => {\n sources.set(trigger, new Set());\n return {\n track: x => {\n const tmp = listener;\n // trigger could play the role of listener，as it has stable reference\n listener = trigger;\n try {\n return fn(x);\n } finally {\n listener = tmp;\n }\n },\n dispose: () => {\n sources.get(trigger)!.forEach(x => x.removeListener(trigger));\n sources.delete(trigger);\n }\n };\n }, untrackSource);\n\n enableExternalSource(fn => {\n return {\n track: fn,\n dispose: () => {}\n };\n }); // do nothing, make sure multiple factories be piped.\n });\n it(\"should trigger solid primitive update\", () => {\n createRoot(fn => {\n const e = new ExternalSource(0);\n const memo = createMemo(() => {\n return e.get();\n });\n const memo2 = createMemo(() => {\n return untrack(() => e.get());\n });\n expect(memo()).toBe(0);\n expect(memo2()).toBe(0);\n e.update(1);\n expect(memo()).toBe(1);\n expect(memo2()).toBe(0);\n fn();\n });\n });\n\n afterEach(() => {\n vi.resetModules();\n });\n});\n" }, { "path": "packages/solid/test/observable.spec.ts", "content": "import { describe, expect, test, vi } from \"vitest\";\nimport { createRoot, createSignal, from, observable } from \"../src/index.js\";\n\ndescribe(\"Observable operator\", () => {\n test(\"to observable\", () => {\n let out: string;\n let set: (v: string) => void;\n createRoot(() => {\n const [s, _set] = createSignal(\"Hi\"),\n obsv$ = observable(s);\n\n set = _set;\n obsv$.subscribe({ next: v => (out = v) });\n });\n expect(out!).toBe(\"Hi\");\n set!(\"John\");\n expect(out!).toBe(\"John\");\n });\n\n test(\"preserve the observer's next binding\", () => {\n const observer = {\n next: vi.fn().mockReturnThis()\n };\n\n createRoot(() => {\n const [s] = createSignal(\"Hi\"),\n obsv$ = observable(s);\n\n obsv$.subscribe(observer);\n });\n expect(observer.next).toHaveReturnedWith(observer);\n });\n\n test(\"observable throws TypeError on non-object\", () => {\n const [s, _set] = createSignal(\"Hi\");\n const o = observable(s);\n expect(() => o.subscribe(null as any)).toThrow(TypeError);\n });\n\n test(\"observable unsubscribe\", () => {\n const [s, set] = createSignal(\"Hi\");\n const o = observable(s);\n let out: string;\n let subscription: any;\n createRoot(() => {\n subscription = o.subscribe({\n next(v) {\n out = v;\n }\n });\n });\n set(\"John\");\n expect(out!).toBe(\"John\");\n subscription.unsubscribe();\n set(\"Benjamin\");\n expect(out!).toBe(\"John\");\n });\n});\n\ndescribe(\"from transform\", () => {\n test(\"from subscribable\", async () => {\n let out: () => string | undefined;\n let set: (v: string) => void;\n createRoot(() => {\n const [s, _set] = createSignal(\"Hi\"),\n obsv$ = observable(s);\n\n set = _set;\n out = from(obsv$);\n });\n expect(out!()).toBe(\"Hi\");\n set!(\"John\");\n expect(out!()).toBe(\"John\");\n });\n\n test(\"from producer\", async () => {\n let out: () => string | undefined;\n let set: (v: string) => void;\n createRoot(() => {\n const [s, _set] = createSignal(\"Hi\"),\n obsv$ = observable(s);\n\n set = _set;\n out = from(set => {\n const sub = obsv$.subscribe(set);\n return () => sub.unsubscribe();\n });\n });\n expect(out!()).toBe(\"Hi\");\n set!(\"John\");\n expect(out!()).toBe(\"John\");\n });\n});\n" }, { "path": "packages/solid/test/rendering.spec.ts", "content": "import { describe, expect, test } from \"vitest\";\nimport { createResource } from \"../src/index.js\";\nimport { resolveSSRNode } from \"dom-expressions/src/server.js\";\n\ndescribe(\"resolveSSRNode\", () => {\n test(\"should resolve a string node\", () => {\n expect(resolveSSRNode(\"Hello World\")).toBe(\"Hello World\");\n });\n\n test(\"should resolve a null or boolean node\", () => {\n expect(resolveSSRNode(null)).toBe(\"\");\n expect(resolveSSRNode(false)).toBe(\"\");\n });\n\n test(\"should resolve an array of nodes\", () => {\n const nodes = [\"

\"];\n expect(resolveSSRNode(nodes)).toBe(\"
\");\n });\n\n test(\"should resolve an object with 't' property\", () => {\n const node = { t: \"
Text
\" };\n expect(resolveSSRNode(node)).toBe(\"
Text
\");\n });\n\n test(\"should resolve a function node\", () => {\n const fn = () => \"dynamic content\";\n expect(resolveSSRNode(fn)).toBe(\"dynamic content\");\n });\n});\n\ndescribe(\"createResource\", () => {\n test(\"should return initial value immediately if provided\", () => {\n const [data] = createResource(() => Promise.resolve(\"test\"), { initialValue: \"loading\" });\n expect(data()).toBe(\"loading\");\n });\n\n test(\"should handle a promise and update the value\", async () => {\n const [data, { refetch }] = createResource(\n () => new Promise(resolve => setTimeout(() => resolve(\"Success!\"), 10))\n );\n\n // Initially, data should be undefined, and loading should be true\n expect(data()).toBeUndefined();\n expect(data.loading).toBe(true);\n\n await new Promise(r => setTimeout(r, 20)); // Wait for the promise to resolve\n\n // After resolution, data should have the new value, and loading should be false\n expect(data()).toBe(\"Success!\");\n expect(data.loading).toBe(false);\n });\n});\n" }, { "path": "packages/solid/test/resource.spec.ts", "content": "import { describe, expect, test } from \"vitest\";\nimport {\n createRoot,\n createSignal,\n createResource,\n createRenderEffect,\n catchError,\n Resource,\n ResourceFetcherInfo,\n Signal,\n createMemo,\n getOwner\n} from \"../src/index.js\";\n\nimport { createStore, reconcile, ReconcileOptions, Store, unwrap } from \"../store/src/index.js\";\n\ndescribe(\"Simulate a dynamic fetch\", () => {\n let resolve: (v: string) => void,\n reject: (r: string) => void,\n trigger: (v: string) => void,\n value: Resource,\n error: Error;\n function fetcher(id: string) {\n return new Promise((r, f) => {\n resolve = r;\n reject = f;\n });\n }\n\n test(\"initial async resource\", async () => {\n createRoot(() => {\n const [id, setId] = createSignal(\"1\");\n trigger = setId;\n catchError(\n () => {\n [value] = createResource(id, fetcher);\n createRenderEffect(value);\n },\n e => (error = e)\n );\n });\n expect(value()).toBeUndefined();\n expect(value.latest).toBeUndefined();\n expect(value.loading).toBe(true);\n resolve(\"John\");\n await Promise.resolve();\n expect(value()).toBe(\"John\");\n expect(value.latest).toBe(\"John\");\n expect(value.loading).toBe(false);\n });\n\n test(\"test out of order\", async () => {\n trigger(\"2\");\n expect(value.loading).toBe(true);\n const resolve1 = resolve;\n trigger(\"3\");\n const resolve2 = resolve;\n resolve2(\"Jake\");\n resolve1(\"Jo\");\n await Promise.resolve();\n expect(value()).toBe(\"Jake\");\n expect(value.loading).toBe(false);\n });\n\n test(\"promise rejection\", async () => {\n trigger(\"4\");\n expect(value.loading).toBe(true);\n expect(value.error).toBeUndefined();\n reject(\"Because I said so\");\n await Promise.resolve();\n expect(error).toBeInstanceOf(Error);\n expect(error.message).toBe(\"Because I said so\");\n expect(value.error).toBeInstanceOf(Error);\n expect(value.error.message).toBe(\"Because I said so\");\n expect(value.loading).toBe(false);\n });\n});\n\ndescribe(\"Simulate a dynamic fetch with state and reconcile\", () => {\n interface User {\n firstName: string;\n address: {\n streetNumber: number;\n streetName: string;\n };\n }\n let resolve: (v: User) => void,\n refetch: (info?: unknown) => void,\n user: Resource,\n state: { user?: User; userLoading: boolean },\n count = 0;\n function fetcher(_: unknown, { value }: ResourceFetcherInfo>) {\n expect(getOwner()).toBeDefined();\n return new Promise(r => {\n resolve = r;\n }).then(next => reconcile(next)(value!));\n }\n const data: User[] = [];\n data.push({ firstName: \"John\", address: { streetNumber: 4, streetName: \"Grindel Rd\" } });\n data.push({ ...data[0], firstName: \"Joseph\" });\n\n test(\"initial async resource\", async () => {\n createRoot(async () => {\n [user, { refetch }] = createResource(fetcher);\n [state] = createStore<{ user?: User; userLoading: boolean }>({\n get user() {\n return user();\n },\n get userLoading() {\n return user.loading;\n }\n });\n createRenderEffect(() => (state.user, count++));\n });\n expect(state.user).toBeUndefined();\n expect(state.userLoading).toBe(true);\n resolve(data[0]);\n await Promise.resolve();\n await Promise.resolve();\n expect(unwrap(state.user)).toStrictEqual(data[0]);\n expect(state.userLoading).toBe(false);\n expect(count).toBe(2);\n\n refetch();\n expect(state.userLoading).toBe(true);\n resolve(data[1]);\n await Promise.resolve();\n await Promise.resolve();\n expect(unwrap(state.user)).toStrictEqual(data[0]);\n expect(state.user?.firstName).toBe(\"Joseph\");\n expect(unwrap(state.user?.address)).toStrictEqual(data[0].address);\n expect(state.userLoading).toBe(false);\n expect(count).toBe(2);\n });\n});\n\ndescribe(\"using Resource with no root\", () => {\n test(\"loads default value\", () => {\n expect(() => {\n let resolve: (v: string) => void;\n createResource(\"error\", () => new Promise(r => (resolve = r)));\n resolve!(\"Hi\");\n }).not.toThrow();\n });\n});\n\ndescribe(\"using Resource with initial Value\", () => {\n let resolve: (v: string) => void,\n reject: (r: string) => void,\n trigger: (v: string) => void,\n value: Resource,\n error: Error;\n function fetcher(id: string) {\n return new Promise((r, f) => {\n resolve = r;\n reject = f;\n });\n }\n test(\"loads default value\", async () => {\n createRoot(() => {\n const [id, setId] = createSignal(\"1\");\n trigger = setId;\n catchError(\n () => {\n [value] = createResource(id, fetcher, { initialValue: \"Loading\" });\n createRenderEffect(value);\n },\n e => (error = e)\n );\n });\n expect(value()).toBe(\"Loading\");\n expect(value.loading).toBe(true);\n resolve(\"John\");\n await Promise.resolve();\n expect(value()).toBe(\"John\");\n expect(value.loading).toBe(false);\n });\n});\n\ndescribe(\"using Resource with errors\", () => {\n let resolve: (v: string) => void,\n reject: (e: any) => void,\n trigger: (v: string) => void,\n value: Resource,\n error: Error;\n function fetcher(id: string) {\n return new Promise((r, f) => {\n resolve = r;\n reject = f;\n });\n }\n test(\"works with falsy errors\", async () => {\n createRoot(() => {\n const [id, setId] = createSignal(\"1\");\n trigger = setId;\n catchError(\n () => {\n [value] = createResource(id, fetcher);\n createRenderEffect(value);\n },\n e => (error = e)\n );\n });\n expect(value()).toBeUndefined();\n expect(value.state === \"pending\").toBe(true);\n expect(value.error).toBeUndefined();\n reject(null);\n await Promise.resolve();\n expect(value.state === \"errored\").toBe(true);\n expect(value.error.message).toBe(\"Unknown error\");\n });\n});\n\ndescribe(\"using Resource with synchronous error\", () => {\n let value: Resource;\n let error: Error;\n test(\"catches the error\", async () => {\n createRoot(() => {\n catchError(\n () => {\n [value] = createResource(() => {\n throw new Error(\"Fetcher error\");\n });\n createRenderEffect(value);\n },\n e => {\n error = e;\n }\n );\n });\n expect(value.state === \"errored\").toBe(true);\n expect(value.error).toBe(error);\n expect(value.error.message).toBe(\"Fetcher error\");\n });\n});\n\ndescribe(\"using Resource with custom store\", () => {\n type User = {\n firstName: string;\n lastName: string;\n address: {\n streetNumber: number;\n streetName: string;\n city: string;\n state: string;\n zip: number;\n };\n };\n let resolve: (v: User) => void;\n let value: Resource;\n function fetcher() {\n return new Promise(r => {\n resolve = r;\n });\n }\n function createDeepSignal(value: T, options?: ReconcileOptions): Signal {\n const [store, setStore] = createStore({\n value\n });\n return [\n () => store.value,\n (v: T) => {\n const unwrapped = unwrap(store.value);\n typeof v === \"function\" && (v = v(unwrapped));\n setStore(\"value\", reconcile(v, options));\n return store.value;\n }\n ] as Signal;\n }\n test(\"loads and diffs\", async () => {\n let first = 0;\n let last = 0;\n let addr = 0;\n let street = 0;\n createRoot(() => {\n [value] = createResource(fetcher, {\n initialValue: {\n firstName: \"John\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Grindel Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n },\n storage: createDeepSignal\n });\n createRenderEffect(() => (first++, value()?.firstName));\n createRenderEffect(() => (last++, value()?.lastName));\n const address = createMemo(() => (addr++, value()?.address));\n createRenderEffect(() => (street++, address()?.streetName));\n });\n expect(value()).toEqual({\n firstName: \"John\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Grindel Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n });\n expect(value.loading).toBe(true);\n expect(first).toBe(1);\n expect(last).toBe(1);\n expect(addr).toBe(1);\n expect(street).toBe(1);\n resolve({\n firstName: \"Matt\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Central Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n });\n await Promise.resolve();\n expect(value()).toEqual({\n firstName: \"Matt\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Central Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n });\n expect(value.loading).toBe(false);\n expect(first).toBe(2);\n expect(last).toBe(1);\n expect(addr).toBe(1);\n expect(street).toBe(2);\n });\n\n test(\"mutates\", async () => {\n let first = 0;\n let last = 0;\n let addr = 0;\n let street = 0;\n let mutate: (v: T) => T;\n createRoot(() => {\n [value, { mutate }] = createResource(false, fetcher, {\n initialValue: {\n firstName: \"John\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Grindel Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n },\n storage: createDeepSignal\n });\n createRenderEffect(() => (first++, value()?.firstName));\n createRenderEffect(() => (last++, value()?.lastName));\n const address = createMemo(() => (addr++, value()?.address));\n createRenderEffect(() => (street++, address()?.streetName));\n });\n expect(value()).toEqual({\n firstName: \"John\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Grindel Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n });\n expect(value.loading).toBe(false);\n expect(first).toBe(1);\n expect(last).toBe(1);\n expect(addr).toBe(1);\n expect(street).toBe(1);\n mutate!({\n firstName: \"Matt\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Central Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n });\n await Promise.resolve();\n expect(value()).toEqual({\n firstName: \"Matt\",\n lastName: \"Smith\",\n address: {\n streetNumber: 4,\n streetName: \"Central Rd\",\n city: \"New York\",\n state: \"NY\",\n zip: 10001\n }\n });\n expect(value.loading).toBe(false);\n expect(first).toBe(2);\n expect(last).toBe(1);\n expect(addr).toBe(1);\n expect(street).toBe(2);\n });\n});\n\ndescribe(\"createResource can be wrapped\", () => {\n const fns: [name: string, function: typeof createResource][] = [\n [\"original createResource\", createResource],\n // @ts-ignore\n [\"createResource(...args)\", (...args) => createResource(...args)],\n // @ts-ignore\n [\"createResource(a, b, c)\", (a, b, c) => createResource(a, b, c)]\n ];\n\n for (const [name, fn] of fns) {\n test(`only fetcher in ${name}`, () => {\n const [[data], dispose] = createRoot(dispose => [fn(() => 123), dispose]);\n expect(data()).toBe(123);\n dispose();\n });\n\n test(`fetcher and source in ${name}`, () => {\n const [source, setSource] = createSignal(1);\n\n const [[data], dispose] = createRoot(dispose => [fn(source, v => v), dispose]);\n expect(data()).toBe(1);\n\n setSource(2);\n expect(data()).toBe(2);\n\n dispose();\n });\n }\n});\n" }, { "path": "packages/solid/test/resource.type-tests.ts", "content": "import { createResource, ResourceReturn, createSignal, Resource, Setter } from \"../src/index.js\";\nimport { InitializedResource, InitializedResourceReturn } from \"../src/reactive/signal.js\";\n\ntype Assert = T;\n// https://github.com/Microsoft/TypeScript/issues/27024#issuecomment-421529650\ntype Equals =\n (() => T extends X ? 1 : 2) extends () => T extends Y ? 1 : 2 ? true : false;\n\n/* createResource inference tests */\n\n// without source, initialValue\n// with fetcher\n{\n const resourceReturn = createResource(\n k => {\n return Promise.resolve(1);\n type Tests = Assert>> &\n Assert>;\n },\n {\n storage: createSignal,\n name: \"test\",\n deferStream: true,\n onHydrated: (k, info) => {\n type Tests = Assert> &\n Assert>;\n }\n }\n );\n}\n\n// without source\n// with fetcher, initialValue\n{\n const resourceReturn = createResource(\n k => {\n return Promise.resolve(1);\n type Tests = Assert<\n Equals>\n > &\n Assert>;\n },\n {\n initialValue: 1,\n storage: createSignal,\n name: \"test\",\n deferStream: true,\n onHydrated: (k, info) => {\n type Tests = Assert> &\n Assert>;\n }\n }\n );\n\n type ResourceActions = (typeof resourceReturn)[1];\n type Tests = Assert>>;\n}\n\n// without initialValue\n// with source, fetcher\n{\n const resourceReturn = createResource(\n () => 1,\n k => {\n return Promise.resolve(1);\n type Tests = Assert>> &\n Assert>;\n },\n {\n storage: createSignal,\n name: \"test\",\n deferStream: true,\n onHydrated: (k, info) => {\n type Tests = Assert> &\n Assert>;\n }\n }\n );\n\n type ResourceActions = (typeof resourceReturn)[1];\n type Tests = Assert>>;\n}\n\n// with source, fetcher, initialValue\n{\n const resourceReturn = createResource(\n () => 1,\n k => {\n return Promise.resolve(1);\n type Tests = Assert<\n Equals>\n > &\n Assert>;\n },\n {\n initialValue: 1,\n storage: createSignal,\n name: \"test\",\n deferStream: true,\n onHydrated: (k, info) => {\n type Tests = Assert> &\n Assert>;\n }\n }\n );\n}\n\n/* Resource type tests */\n{\n let resource!: Resource;\n const resourceValue = resource();\n let initializedResource!: InitializedResource;\n const initializedResourceValue = initializedResource();\n\n type Tests = Assert> &\n Assert> &\n Assert<\n Equals\n > &\n Assert>;\n\n switch (resource.state) {\n case \"errored\":\n const errorValue = resource();\n break;\n case \"pending\":\n const pendingValue = resource();\n break;\n case \"ready\":\n const readyValue = resource();\n break;\n case \"refreshing\":\n const refreshingValue = resource();\n break;\n case \"unresolved\":\n const unresolvedValue = resource();\n break;\n // this is weird but it works\n type Test = Assert> &\n Assert> &\n Assert> &\n Assert> &\n Assert>;\n }\n\n switch (initializedResource.state) {\n case \"errored\":\n const errorValue = initializedResource();\n break;\n case \"ready\":\n const readyValue = initializedResource();\n break;\n case \"refreshing\":\n const refreshingValue = initializedResource();\n break;\n // this is weird but it works\n type Test = Assert> &\n Assert> &\n Assert>;\n }\n}\n" }, { "path": "packages/solid/test/scheduler.spec.ts", "content": "/** @vitest-environment jsdom */\nimport { describe, expect, test } from \"vitest\";\nimport { cancelCallback, requestCallback } from \"../src/index.js\";\nimport \"./MessageChannel\";\n\ndescribe(\"requestCallback basics\", () => {\n test(\"queue a task\", () =>\n new Promise(done => {\n requestCallback(() => {\n done(undefined);\n });\n }));\n\n test(\"queue a task in correct order\", () =>\n new Promise(done => {\n let count = 0;\n requestCallback(() => {\n expect(count).toBe(2);\n done(undefined);\n });\n requestCallback(\n () => {\n count++;\n expect(count).toBe(1);\n },\n { timeout: 10 }\n );\n requestCallback(\n () => {\n count++;\n expect(count).toBe(2);\n },\n { timeout: 40 }\n );\n }));\n\n test(\"supports cancelling a callback\", () =>\n new Promise((done, reject) => {\n const task = requestCallback(() => {\n reject(new Error(\"should not be called\"));\n });\n cancelCallback(task);\n requestCallback(() => done(undefined));\n }));\n});\n" }, { "path": "packages/solid/test/signals.memo.spec.ts", "content": "import { describe, expect, it } from \"vitest\";\nimport { createRoot, createSignal, createMemo, Accessor } from \"../src/index.js\";\n\ndescribe(\"createMemo\", () => {\n describe(\"executing propagating\", () => {\n it(\"propagates in topological order\", () => {\n createRoot(() => {\n //\n // c1\n // / \\\n // / \\\n // b1 b2\n // \\ /\n // \\ /\n // a1\n //\n var seq = \"\",\n [a1, setA1] = createSignal(false),\n b1 = createMemo(\n () => {\n a1();\n seq += \"b1\";\n },\n undefined,\n { equals: false }\n ),\n b2 = createMemo(\n () => {\n a1();\n seq += \"b2\";\n },\n undefined,\n { equals: false }\n ),\n c1 = createMemo(\n () => {\n (b1(), b2());\n seq += \"c1\";\n },\n undefined,\n { equals: false }\n );\n\n seq = \"\";\n setA1(true);\n\n expect(seq).toBe(\"b1b2c1\");\n });\n });\n\n it(\"only propagates once with linear convergences\", () => {\n createRoot(() => {\n // d\n // |\n // +---+---+---+---+\n // v v v v v\n // f1 f2 f3 f4 f5\n // | | | | |\n // +---+---+---+---+\n // v\n // g\n var [d, setD] = createSignal(0),\n f1 = createMemo(() => d()),\n f2 = createMemo(() => d()),\n f3 = createMemo(() => d()),\n f4 = createMemo(() => d()),\n f5 = createMemo(() => d()),\n gcount = 0,\n g = createMemo(() => {\n gcount++;\n return f1() + f2() + f3() + f4() + f5();\n });\n\n gcount = 0;\n setD(1);\n expect(gcount).toBe(1);\n });\n });\n\n it(\"only propagates once with exponential convergence\", () => {\n createRoot(() => {\n // d\n // |\n // +---+---+\n // v v v\n // f1 f2 f3\n // \\ | /\n // O\n // / | \\\n // v v v\n // g1 g2 g3\n // +---+---+\n // v\n // h\n var [d, setD] = createSignal(0),\n f1 = createMemo(() => {\n return d();\n }),\n f2 = createMemo(() => {\n return d();\n }),\n f3 = createMemo(() => {\n return d();\n }),\n g1 = createMemo(() => {\n return f1() + f2() + f3();\n }),\n g2 = createMemo(() => {\n return f1() + f2() + f3();\n }),\n g3 = createMemo(() => {\n return f1() + f2() + f3();\n }),\n hcount = 0,\n h = createMemo(() => {\n hcount++;\n return g1() + g2() + g3();\n });\n hcount = 0;\n setD(1);\n expect(hcount).toBe(1);\n });\n });\n\n it(\"does not trigger downstream computations unless changed\", () => {\n createRoot(() => {\n const [s1, set] = createSignal(1, { equals: false });\n let order = \"\";\n const t1 = createMemo(() => {\n order += \"t1\";\n return s1();\n });\n createMemo(() => {\n order += \"c1\";\n t1();\n });\n expect(order).toBe(\"t1c1\");\n order = \"\";\n set(1);\n expect(order).toBe(\"t1\");\n order = \"\";\n set(2);\n expect(order).toBe(\"t1c1\");\n });\n });\n\n it(\"applies updates to changed dependees in same order as createMemo\", () => {\n createRoot(() => {\n const [s1, set] = createSignal(0);\n let order = \"\";\n const t1 = createMemo(() => {\n order += \"t1\";\n return s1() === 0;\n });\n createMemo(() => {\n order += \"c1\";\n return s1();\n });\n createMemo(() => {\n order += \"c2\";\n return t1();\n });\n\n expect(order).toBe(\"t1c1c2\");\n order = \"\";\n set(1);\n expect(order).toBe(\"t1c2c1\");\n });\n });\n\n it(\"updates downstream pending computations\", () => {\n createRoot(() => {\n const [s1, set] = createSignal(0);\n const [s2] = createSignal(0);\n let order = \"\";\n const t1 = createMemo(() => {\n order += \"t1\";\n return s1() === 0;\n });\n createMemo(() => {\n order += \"c1\";\n return s1();\n });\n createMemo(() => {\n order += \"c2\";\n t1();\n createMemo(() => {\n order += \"c2_1\";\n return s2();\n });\n });\n order = \"\";\n set(1);\n expect(order).toBe(\"t1c2c2_1c1\");\n });\n });\n });\n\n describe(\"with changing dependencies\", () => {\n let i: () => boolean, setI: (v: boolean) => void;\n let t: () => number, setT: (v: number) => void;\n let e: () => number, setE: (v: number) => void;\n let fevals: number;\n let f: () => number;\n\n function init() {\n [i, setI] = createSignal(true);\n [t, setT] = createSignal(1);\n [e, setE] = createSignal(2);\n fevals = 0;\n f = createMemo(() => {\n fevals++;\n return i() ? t() : e();\n });\n fevals = 0;\n }\n\n it(\"updates on active dependencies\", () => {\n createRoot(() => {\n init();\n setT(5);\n expect(fevals).toBe(1);\n expect(f()).toBe(5);\n });\n });\n\n it(\"does not update on inactive dependencies\", () => {\n createRoot(() => {\n init();\n setE(5);\n expect(fevals).toBe(0);\n expect(f()).toBe(1);\n });\n });\n\n it(\"deactivates obsolete dependencies\", () => {\n createRoot(() => {\n init();\n setI(false);\n fevals = 0;\n setT(5);\n expect(fevals).toBe(0);\n });\n });\n\n it(\"activates new dependencies\", () => {\n createRoot(() => {\n init();\n setI(false);\n fevals = 0;\n setE(5);\n expect(fevals).toBe(1);\n });\n });\n\n it(\"ensures that new dependencies are updated before dependee\", () => {\n createRoot(() => {\n var order = \"\",\n [a, setA] = createSignal(0),\n b = createMemo(() => {\n order += \"b\";\n return a() + 1;\n }),\n c = createMemo(() => {\n order += \"c\";\n const check = b();\n if (check) {\n return check;\n }\n return e();\n }),\n d = createMemo(() => {\n return a();\n }),\n e = createMemo(() => {\n order += \"d\";\n return d() + 10;\n });\n\n expect(order).toBe(\"bcd\");\n\n order = \"\";\n setA(-1);\n\n expect(order).toBe(\"bcd\");\n expect(c()).toBe(9);\n\n order = \"\";\n setA(0);\n\n expect(order).toBe(\"bcd\");\n expect(c()).toBe(1);\n });\n });\n });\n\n describe(\"with intercepting computations\", () => {\n it(\"does not update subsequent pending computations after stale invocations\", () => {\n createRoot(() => {\n const [s1, set1] = createSignal(1);\n const [s2, set2] = createSignal(false);\n let count = 0;\n /*\n s1\n |\n +---+---+\n t1 t2 c1 t3\n \\ /\n c3\n [PN,PN,STL,void]\n */\n const t1 = createMemo(() => s1() > 0);\n const t2 = createMemo(() => s1() > 0);\n const c1 = createMemo(() => s1());\n const t3 = createMemo(() => {\n const a = s1();\n const b = s2();\n return a && b;\n });\n createMemo(() => {\n t1();\n t2();\n c1();\n t3();\n count++;\n });\n set2(true);\n expect(count).toBe(2);\n set1(2);\n expect(count).toBe(3);\n });\n });\n\n it(\"evaluates stale computations before dependees when trackers stay unchanged\", () => {\n createRoot(() => {\n let [s1, set] = createSignal(1, { equals: false });\n let order = \"\";\n let t1 = createMemo(() => {\n order += \"t1\";\n return s1() > 2;\n });\n let t2 = createMemo(() => {\n order += \"t2\";\n return s1() > 2;\n });\n let c1 = createMemo(\n () => {\n order += \"c1\";\n s1();\n },\n undefined,\n { equals: false }\n );\n createMemo(() => {\n order += \"c2\";\n t1();\n t2();\n c1();\n });\n order = \"\";\n set(1);\n expect(order).toBe(\"t1t2c1c2\");\n order = \"\";\n set(3);\n expect(order).toBe(\"t2c2t1c1\");\n });\n });\n\n it(\"evaluates nested trackings\", () => {\n createRoot(() => {\n const [s1, set1] = createSignal(1);\n const [s2] = createSignal(1);\n let count = 0;\n let c1: () => number;\n createMemo(() => {\n c1 = createMemo(() => s2());\n return s1();\n });\n createMemo(() => {\n count++;\n c1();\n });\n set1(2);\n expect(count).toBe(1);\n });\n });\n\n it(\"propagates in topological order\", () => {\n createRoot(() => {\n const [s1, set] = createSignal(true);\n let order = \"\";\n const t1 = createMemo(() => {\n order += \"t1\";\n return s1();\n });\n const t2 = createMemo(() => {\n order += \"t2\";\n return s1();\n });\n createMemo(() => {\n t1();\n t2();\n order += \"c1\";\n });\n order = \"\";\n set(false);\n expect(order).toBe(\"t1t2c1\");\n });\n });\n\n it(\"does not evaluate dependencies with tracking sources that have not changed\", () => {\n createRoot(() => {\n const [s1, set] = createSignal(1);\n let order = \"\";\n let c2: () => boolean;\n createMemo(() => {\n order += \"c1\";\n if (s1() > 1) {\n c2();\n }\n });\n const t1 = createMemo(() => {\n order += \"t1\";\n return s1() < 3;\n });\n const t2 = createMemo(() => {\n order += \"t2\";\n return t1();\n });\n c2 = createMemo(() => {\n order += \"c2\";\n return t2();\n });\n order = \"\";\n set(2);\n expect(order).toBe(\"c1t1\");\n order = \"\";\n set(3);\n expect(order).toBe(\"c1t1t2c2\");\n });\n });\n\n it(\"correctly marks downstream computations as stale on change\", () => {\n createRoot(() => {\n const [s1, set] = createSignal(1);\n let order = \"\";\n const t1 = createMemo(() => {\n order += \"t1\";\n return s1();\n });\n const c1 = createMemo(() => {\n order += \"c1\";\n return t1();\n });\n const c2 = createMemo(() => {\n order += \"c2\";\n return c1();\n });\n createMemo(() => {\n order += \"c3\";\n return c2();\n });\n order = \"\";\n set(2);\n expect(order).toBe(\"t1c1c2c3\");\n });\n });\n });\n\n describe(\"with unending changes\", () => {\n it(\"throws when continually setting a direct dependency\", () => {\n createRoot(() => {\n const [d, set] = createSignal(1);\n\n expect(() => {\n createMemo(() => {\n return set(d() + 1);\n });\n }).toThrow();\n });\n });\n\n it(\"throws when continually setting an indirect dependency\", () => {\n createRoot(() => {\n let i = 2;\n const [d, set] = createSignal(1),\n f1 = createMemo(() => d()),\n f2 = createMemo(() => f1()),\n f3 = createMemo(() => f2());\n\n expect(() => {\n createMemo(() => {\n f3();\n set(i++);\n });\n }).toThrow();\n });\n });\n });\n\n describe(\"with circular dependencies\", () => {\n it(\"throws when cycle created by modifying a branch\", () => {\n createRoot(() => {\n var [d, set] = createSignal(1),\n f: Accessor = createMemo(() => (f ? f() : d()), undefined, {\n equals: false\n });\n\n expect(() => {\n set(0);\n }).toThrow();\n });\n });\n });\n});\n" }, { "path": "packages/solid/test/signals.spec.ts", "content": "/** @vitest-environment jsdom */\nimport { describe, expect, test } from \"vitest\";\nimport {\n createRoot,\n createSignal,\n createEffect,\n createRenderEffect,\n createComputed,\n createReaction,\n createDeferred,\n createMemo,\n createSelector,\n untrack,\n on,\n onMount,\n onCleanup,\n catchError,\n createContext,\n useContext,\n getOwner,\n runWithOwner\n} from \"../src/index.js\";\n\nimport \"./MessageChannel\";\n\ndescribe(\"Create signals\", () => {\n test(\"Create and read a Signal\", () => {\n const [value] = createSignal(5);\n expect(value()).toBe(5);\n });\n test(\"Create and read a Signal with comparator\", () => {\n const [value] = createSignal(5, { equals: (a, b) => a === b });\n expect(value()).toBe(5);\n });\n test(\"Create and read a Memo\", () => {\n createRoot(() => {\n const memo = createMemo(() => \"Hello\");\n expect(memo()).toBe(\"Hello\");\n });\n });\n test(\"Create and read a Memo with initial value\", () => {\n createRoot(() => {\n const memo = createMemo(i => `${i} John`, \"Hello\");\n expect(memo()).toBe(\"Hello John\");\n });\n });\n test(\"Create onMount\", () => {\n let temp: string;\n createRoot(() => {\n onMount(() => (temp = \"impure\"));\n });\n expect(temp!).toBe(\"impure\");\n });\n test(\"Create a Effect with explicit deps\", () => {\n let temp: string;\n createRoot(() => {\n const [sign] = createSignal(\"thoughts\");\n const fn = on(sign, v => (temp = `impure ${v}`));\n createEffect(fn);\n createEffect(on(sign, v => (temp = `impure ${v}`)));\n });\n expect(temp!).toBe(\"impure thoughts\");\n });\n test(\"Create a Effect with multiple explicit deps\", () => {\n let temp: string;\n createRoot(() => {\n const [sign] = createSignal(\"thoughts\");\n const [num] = createSignal(3);\n const fn = on([sign, num], v => (temp = `impure ${v[1]}`));\n createEffect(fn);\n });\n expect(temp!).toBe(\"impure 3\");\n });\n test(\"Create a Effect with explicit deps and lazy evaluation\", () => {\n let temp: string;\n const [sign, set] = createSignal(\"thoughts\");\n createRoot(() => {\n const fn = on(sign, v => (temp = `impure ${v}`), { defer: true });\n createEffect(fn);\n });\n expect(temp!).toBeUndefined();\n set(\"minds\");\n expect(temp!).toBe(\"impure minds\");\n });\n test(\"Create a Effect with explicit deps, lazy evaluation, and initial value\", () => {\n let temp: string;\n const [sign, set] = createSignal(\"thoughts\");\n createRoot(() => {\n const fn = on(sign, (v, _, p) => (temp = `impure ${p} ${v}`), { defer: true });\n createEffect(fn, \"numbers\");\n });\n expect(temp!).toBeUndefined();\n set(\"minds\");\n expect(temp!).toBe(\"impure numbers minds\");\n });\n});\n\ndescribe(\"Update signals\", () => {\n test(\"Create and update a Signal\", () => {\n const [value, setValue] = createSignal(5);\n setValue(10);\n expect(value()).toBe(10);\n });\n test(\"Create and update a Signal with fn\", () => {\n const [value, setValue] = createSignal(5);\n setValue(p => p + 5);\n expect(value()).toBe(10);\n });\n test(\"Create Signal and set different value\", () => {\n const [value, setValue] = createSignal(5);\n setValue(10);\n expect(value()).toBe(10);\n });\n test(\"Create Signal and set equivalent value\", () => {\n const [value, setValue] = createSignal(5, { equals: (a, b) => a > b });\n setValue(3);\n expect(value()).toBe(5);\n });\n test(\"Create and read a Signal with function value\", () => {\n const [value, setValue] = createSignal<() => string>(() => \"Hi\");\n expect(value()()).toBe(\"Hi\");\n setValue(() => () => \"Hello\");\n expect(value()()).toBe(\"Hello\");\n });\n test(\"Create and trigger a Memo\", () => {\n createRoot(() => {\n const [name, setName] = createSignal(\"John\"),\n memo = createMemo(() => `Hello ${name()}`);\n expect(memo()).toBe(\"Hello John\");\n setName(\"Jake\");\n expect(memo()).toBe(\"Hello Jake\");\n });\n });\n test(\"Create Signal and set equivalent value not trigger Memo\", () => {\n createRoot(() => {\n const [name, setName] = createSignal(\"John\", { equals: (a, b) => b.startsWith(\"J\") }),\n memo = createMemo(() => `Hello ${name()}`);\n expect(name()).toBe(\"John\");\n expect(memo()).toBe(\"Hello John\");\n setName(\"Jake\");\n expect(name()).toBe(\"John\");\n expect(memo()).toBe(\"Hello John\");\n });\n });\n test(\"Create and trigger a Memo in an effect\", () =>\n new Promise(done => {\n createRoot(() => {\n let temp: string;\n const [name, setName] = createSignal(\"John\"),\n memo = createMemo(() => `Hello ${name()}`);\n createEffect(() => (temp = `${memo()}!!!`));\n setTimeout(() => {\n expect(temp).toBe(\"Hello John!!!\");\n setName(\"Jake\");\n expect(temp).toBe(\"Hello Jake!!!\");\n done(undefined);\n });\n });\n }));\n test(\"Create and trigger an Effect\", () =>\n new Promise(done => {\n createRoot(() => {\n let temp: string;\n const [sign, setSign] = createSignal(\"thoughts\");\n createEffect(() => (temp = `unpure ${sign()}`));\n setTimeout(() => {\n expect(temp).toBe(\"unpure thoughts\");\n setSign(\"mind\");\n expect(temp).toBe(\"unpure mind\");\n done(undefined);\n });\n });\n }));\n test(\"Create and trigger an Effect with function signals\", () =>\n new Promise(done => {\n createRoot(() => {\n let temp: string;\n const [sign, setSign] = createSignal<() => string>(() => \"thoughts\");\n createEffect(() => (temp = `unpure ${sign()()}`));\n setTimeout(() => {\n expect(temp).toBe(\"unpure thoughts\");\n setSign(() => () => \"mind\");\n expect(temp).toBe(\"unpure mind\");\n done(undefined);\n });\n });\n }));\n test(\"Set signal returns argument\", () => {\n const [_, setValue] = createSignal();\n const res1: undefined = setValue(undefined);\n expect(res1).toBe(undefined);\n const res2: number = setValue(12);\n expect(res2).toBe(12);\n const res3 = setValue(Math.random() >= 0 ? 12 : undefined);\n expect(res3).toBe(12);\n const res4 = setValue();\n expect(res4).toBe(undefined);\n });\n});\n\ndescribe(\"Untrack signals\", () => {\n test(\"Mute an effect\", () =>\n new Promise(done => {\n createRoot(() => {\n let temp: string;\n const [sign, setSign] = createSignal(\"thoughts\");\n createEffect(() => (temp = `unpure ${untrack(sign)}`));\n setTimeout(() => {\n expect(temp).toBe(\"unpure thoughts\");\n setSign(\"mind\");\n expect(temp).toBe(\"unpure thoughts\");\n done(undefined);\n });\n });\n }));\n});\n\ndescribe(\"Batching signals\", () => {\n test(\"Mute an effect\", () =>\n new Promise(done => {\n createRoot(() => {\n let temp: string;\n const [sign, setSign] = createSignal(\"thoughts\");\n createEffect(() => (temp = `unpure ${untrack(sign)}`));\n setTimeout(() => {\n expect(temp).toBe(\"unpure thoughts\");\n setSign(\"mind\");\n expect(temp).toBe(\"unpure thoughts\");\n done(undefined);\n });\n });\n }));\n});\n\ndescribe(\"Effect grouping of signals\", () => {\n test(\"Groups updates\", () =>\n new Promise(done => {\n createRoot(() => {\n let count = 0;\n const [a, setA] = createSignal(0);\n const [b, setB] = createSignal(0);\n createEffect(() => {\n setA(1);\n setB(1);\n });\n createMemo(() => (count += a() + b()));\n setTimeout(() => {\n expect(count).toBe(2);\n done(undefined);\n });\n });\n }));\n test(\"Groups updates with repeated sets\", () =>\n new Promise(done => {\n createRoot(() => {\n let count = 0;\n const [a, setA] = createSignal(0);\n createEffect(() => {\n setA(1);\n setA(4);\n });\n createMemo(() => (count += a()));\n setTimeout(() => {\n expect(count).toBe(4);\n done(undefined);\n });\n });\n }));\n test(\"Groups updates with fn setSignal\", () =>\n new Promise(done => {\n createRoot(() => {\n let count = 0;\n const [a, setA] = createSignal(0);\n const [b, setB] = createSignal(0);\n createEffect(() => {\n setA(a => a + 1);\n setB(b => b + 1);\n });\n createMemo(() => (count += a() + b()));\n setTimeout(() => {\n expect(count).toBe(2);\n done(undefined);\n });\n });\n }));\n test(\"Groups updates with fn setSignal with repeated sets\", () =>\n new Promise(done => {\n createRoot(() => {\n let count = 0;\n const [a, setA] = createSignal(0);\n createEffect(() => {\n setA(a => a + 1);\n setA(a => a + 2);\n });\n createMemo(() => (count += a()));\n setTimeout(() => {\n expect(count).toBe(3);\n done(undefined);\n });\n });\n }));\n test(\"Test cross setting in a effect update\", () =>\n new Promise(done => {\n createRoot(() => {\n let count = 0;\n const [a, setA] = createSignal(1);\n const [b, setB] = createSignal(0);\n createEffect(() => {\n setA(a => a + b());\n });\n createMemo(() => (count += a()));\n setTimeout(() => {\n setB(b => b + 1);\n setTimeout(() => {\n expect(count).toBe(3);\n done(undefined);\n });\n });\n });\n }));\n test(\"Handles errors gracefully\", () =>\n new Promise(done => {\n createRoot(() => {\n let error: Error;\n const [a, setA] = createSignal(0);\n const [b, setB] = createSignal(0);\n createEffect(() => {\n try {\n setA(1);\n throw new Error(\"test\");\n } catch (e) {\n error = e as Error;\n }\n });\n createMemo(() => a() + b());\n setTimeout(() => {\n expect(a()).toBe(1);\n expect(b()).toBe(0);\n setA(2);\n expect(a()).toBe(2);\n expect(error).toBeInstanceOf(Error);\n expect(error.message).toBe(\"test\");\n done(undefined);\n });\n });\n }));\n\n test(\"Multiple sets\", () =>\n new Promise(done => {\n createRoot(() => {\n let count = 0;\n const [a, setA] = createSignal(0);\n createEffect(() => {\n setA(1);\n setA(0);\n });\n createMemo(() => (count = a()));\n setTimeout(() => {\n expect(count).toBe(0);\n done(undefined);\n });\n });\n }));\n});\n\ndescribe(\"Typecheck computed and effects\", () => {\n test(\"No default value can return undefined\", () => {\n createRoot(() => {\n let count = 0;\n const [sign, setSign] = createSignal(\"thoughts\");\n const fn = (arg?: number) => {\n count++;\n sign();\n expect(arg).toBe(undefined);\n return arg;\n };\n createComputed(fn);\n createRenderEffect(fn);\n createEffect(fn);\n setTimeout(() => {\n expect(count).toBe(3);\n setSign(\"update\");\n expect(count).toBe(6);\n });\n });\n });\n test(\"Default value never receives undefined\", () => {\n createRoot(() => {\n let count = 0;\n const [sign, setSign] = createSignal(\"thoughts\");\n const fn = (arg: number) => {\n count++;\n sign();\n expect(arg).toBe(12);\n return arg;\n };\n createComputed(fn, 12);\n createRenderEffect(fn, 12);\n createEffect(fn, 12);\n setTimeout(() => {\n expect(count).toBe(3);\n setSign(\"update\");\n expect(count).toBe(6);\n });\n });\n });\n});\n\ndescribe(\"onCleanup\", () => {\n test(\"Clean an effect\", () =>\n new Promise(done => {\n createRoot(() => {\n let temp: string;\n const [sign, setSign] = createSignal(\"thoughts\");\n createEffect(() => {\n sign();\n onCleanup(() => (temp = \"after\"));\n });\n setTimeout(() => {\n expect(temp).toBeUndefined();\n setSign(\"mind\");\n expect(temp).toBe(\"after\");\n done(undefined);\n });\n });\n }));\n test(\"Explicit root disposal\", () => {\n let temp: string | undefined, disposer: () => void;\n createRoot(dispose => {\n disposer = dispose;\n onCleanup(() => (temp = \"disposed\"));\n });\n expect(temp).toBeUndefined();\n disposer!();\n expect(temp).toBe(\"disposed\");\n });\n test(\"Failed Root disposal from arguments\", () => {\n let temp: string | undefined, disposer: () => void;\n createRoot((...args) => {\n disposer = args[0];\n onCleanup(() => (temp = \"disposed\"));\n });\n expect(temp).toBeUndefined();\n expect(disposer!).toThrow();\n });\n});\n\ndescribe(\"catchError\", () => {\n test(\"No Handler\", () => {\n expect(() =>\n createRoot(() => {\n throw \"fail\";\n })\n ).toThrow(\"fail\");\n });\n test(\"Top level\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n catchError(\n () => {\n throw \"fail\";\n },\n () => (errored = true)\n );\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n\n test(\"Nested in catchError\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n catchError(\n () => {\n catchError(\n () => {\n throw \"fail\";\n },\n error => {\n throw error;\n }\n );\n },\n () => (errored = true)\n );\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n\n test(\"In initial effect\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n createEffect(() => {\n catchError(\n () => {\n throw \"fail\";\n },\n () => (errored = true)\n );\n });\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n\n // test(\"With multiple error handlers\", () => {\n // let errored = false;\n // let errored2 = false;\n // expect(() =>\n // createRoot(() => {\n // createEffect(() => {\n // onError(() => (errored = true));\n // onError(() => (errored2 = true));\n // throw \"fail\";\n // });\n // })\n // ).not.toThrow(\"fail\");\n // expect(errored).toBe(true);\n // expect(errored2).toBe(true);\n // });\n\n test(\"In update effect\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n const [s, set] = createSignal(0);\n createEffect(() => {\n const v = s();\n catchError(\n () => {\n if (v) throw \"fail\";\n },\n () => (errored = true)\n );\n });\n set(1);\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n\n test(\"In initial nested effect\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n createEffect(() => {\n createEffect(() => {\n catchError(\n () => {\n throw \"fail\";\n },\n () => (errored = true)\n );\n });\n });\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n\n test(\"In nested update effect\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n const [s, set] = createSignal(0);\n createEffect(() => {\n createEffect(() => {\n const v = s();\n catchError(\n () => {\n if (v) throw \"fail\";\n },\n () => (errored = true)\n );\n });\n });\n set(1);\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n\n test(\"In nested update effect different levels\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n const [s, set] = createSignal(0);\n createEffect(() => {\n catchError(\n () =>\n createEffect(() => {\n const v = s();\n if (v) throw \"fail\";\n }),\n () => (errored = true)\n );\n });\n set(1);\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n\n test(\"In nested memo\", () => {\n let errored = false;\n expect(() =>\n createRoot(() => {\n createMemo(() => {\n catchError(\n () => {\n createEffect(() => {});\n throw new Error(\"fail\");\n },\n () => (errored = true)\n );\n });\n })\n ).not.toThrow(\"fail\");\n expect(errored).toBe(true);\n });\n});\n\ndescribe(\"createDeferred\", () => {\n test(\"simple defer\", () =>\n new Promise(done => {\n createRoot(() => {\n const [s, set] = createSignal(\"init\"),\n r = createDeferred(s, { timeoutMs: 20 });\n expect(r()).toBe(\"init\");\n set(\"Hi\");\n expect(r()).toBe(\"init\");\n setTimeout(() => {\n expect(r()).toBe(\"Hi\");\n done(undefined);\n }, 100);\n });\n }));\n});\n\ndescribe(\"createSelector\", () => {\n test(\"simple selection\", () =>\n new Promise(done => {\n createRoot(() => {\n const [s, set] = createSignal(),\n isSelected = createSelector(s);\n let count = 0;\n const list = Array.from({ length: 100 }, (_, i) =>\n createMemo(() => {\n count++;\n return isSelected(i) ? \"selected\" : \"no\";\n })\n );\n expect(count).toBe(100);\n expect(list[3]()).toBe(\"no\");\n setTimeout(() => {\n count = 0;\n set(3);\n expect(count).toBe(1);\n expect(list[3]()).toBe(\"selected\");\n count = 0;\n set(6);\n expect(count).toBe(2);\n expect(list[3]()).toBe(\"no\");\n expect(list[6]()).toBe(\"selected\");\n set(undefined);\n expect(count).toBe(3);\n expect(list[6]()).toBe(\"no\");\n set(5);\n expect(count).toBe(4);\n expect(list[5]()).toBe(\"selected\");\n done(undefined);\n });\n });\n }));\n\n test(\"double selection\", () =>\n new Promise(done => {\n createRoot(() => {\n const [s, set] = createSignal(-1),\n isSelected = createSelector(s);\n let count = 0;\n const list = Array.from({ length: 100 }, (_, i) => [\n createMemo(() => {\n count++;\n return isSelected(i) ? \"selected\" : \"no\";\n }),\n createMemo(() => {\n count++;\n return isSelected(i) ? \"oui\" : \"non\";\n })\n ]);\n expect(count).toBe(200);\n expect(list[3][0]()).toBe(\"no\");\n expect(list[3][1]()).toBe(\"non\");\n setTimeout(() => {\n count = 0;\n set(3);\n expect(count).toBe(2);\n expect(list[3][0]()).toBe(\"selected\");\n expect(list[3][1]()).toBe(\"oui\");\n count = 0;\n set(6);\n expect(count).toBe(4);\n expect(list[3][0]()).toBe(\"no\");\n expect(list[6][0]()).toBe(\"selected\");\n expect(list[3][1]()).toBe(\"non\");\n expect(list[6][1]()).toBe(\"oui\");\n done(undefined);\n });\n });\n }));\n\n test(\"zero index\", () =>\n new Promise(done => {\n createRoot(() => {\n const [s, set] = createSignal(-1),\n isSelected = createSelector(s);\n let count = 0;\n const list = [\n createMemo(() => {\n count++;\n return isSelected(0) ? \"selected\" : \"no\";\n })\n ];\n expect(count).toBe(1);\n expect(list[0]()).toBe(\"no\");\n setTimeout(() => {\n count = 0;\n set(0);\n expect(count).toBe(1);\n expect(list[0]()).toBe(\"selected\");\n count = 0;\n set(-1);\n expect(count).toBe(1);\n expect(list[0]()).toBe(\"no\");\n done(undefined);\n });\n });\n }));\n});\n\ndescribe(\"create and use context\", () => {\n test(\"createContext without arguments defaults to undefined\", () => {\n const context = createContext();\n const res = useContext(context);\n expect(res).toBe(undefined);\n });\n});\n\ndescribe(\"createRoot\", () => {\n test(\"roots with dispose function unused are unowned\", () => {\n createRoot(_ => {\n const root1 = getOwner()!;\n createRoot(_ => {\n const root2 = getOwner()!;\n createRoot(() => {\n const root3 = getOwner()!;\n expect(root2.owner).toBe(root1);\n expect(root3.owner).toBe(null);\n });\n });\n });\n });\n\n test(\"Allows to define detachedOwner\", () => {\n let owner1: any;\n let owner2: any;\n let owner3: any;\n let owner4: any;\n let owner5: any;\n\n createRoot(_ => (owner1 = getOwner()!));\n createRoot(_ => (owner2 = getOwner()!), owner1);\n createRoot(_ => {\n owner3 = getOwner()!;\n createRoot(_ => (owner4 = getOwner()!));\n createRoot(_ => (owner5 = getOwner()!), null);\n });\n\n expect(owner1.owner).toBe(null);\n expect(owner2.owner).toBe(owner1);\n expect(owner3.owner).toBe(null);\n expect(owner4.owner).toBe(owner3);\n expect(owner5.owner).toBe(null);\n });\n});\n\ndescribe(\"runWithOwner\", () => {\n test(\"Top level owner execute and disposal\", () => {\n let effectRun = false;\n let cleanupRun = false;\n const [owner, dispose] = createRoot(dispose => {\n return [getOwner()!, dispose];\n });\n\n runWithOwner(owner, () => {\n createEffect(() => (effectRun = true));\n onCleanup(() => (cleanupRun = true));\n expect(effectRun).toBe(false);\n expect(cleanupRun).toBe(false);\n });\n expect(effectRun).toBe(true);\n expect(cleanupRun).toBe(false);\n dispose();\n expect(cleanupRun).toBe(true);\n });\n});\n\ndescribe(\"createReaction\", () => {\n test(\"Create and trigger a Reaction\", () =>\n new Promise(done => {\n createRoot(() => {\n let count = 0;\n const [sign, setSign] = createSignal(\"thoughts\");\n const track = createReaction(() => count++);\n expect(count).toBe(0);\n track(sign);\n expect(count).toBe(0);\n setTimeout(() => {\n expect(count).toBe(0);\n setSign(\"mind\");\n expect(count).toBe(1);\n setSign(\"body\");\n expect(count).toBe(1);\n track(sign);\n setSign(\"everything\");\n expect(count).toBe(2);\n done(undefined);\n });\n });\n }));\n});\n" }, { "path": "packages/solid/test/signals.type-tests.ts", "content": "import {\n createEffect,\n createComputed,\n createRenderEffect,\n createMemo,\n Accessor,\n on,\n createSignal,\n createSelector,\n Signal,\n Setter\n} from \"../src/index.js\";\n\nclass Animal {\n #animal = null;\n}\nclass Dog extends Animal {\n #dog = null;\n}\n\n//////////////////////////////////////////////////////////////////////////\n// createEffect ////////////////////////////////////////////////////\n//////////////////////////////////////////////////////////////////////////\n\ncreateEffect(() => {\n return \"hello\";\n}, \"init\");\n\ncreateEffect(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\n\ncreateEffect((prev: string) => {\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\n\ncreateEffect(() => {\n return \"hello\";\n}, 123);\n\ncreateEffect(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string = prev;\n return p + \"hello\";\n}, 123);\n\ncreateEffect((prev: number | string) => {\n const p: number | string = prev;\n return p + \"hello\";\n}, 123);\n\ncreateEffect(() => {\n return \"hello\";\n});\n\ncreateEffect(_prev => {\n return \"hello\";\n});\n\ncreateEffect(_prev => {});\n\ncreateEffect((v: number | string): number => 123, \"asdf\");\n\ncreateEffect((num: number | undefined): number | undefined => 123);\n\ncreateEffect((num?: number): number | undefined => 123);\n\ncreateEffect((v: number | string): number => 123, 123);\ncreateEffect((v: number | string): number => 123, 123);\n\n// @ts-expect-error undefined initial value not assignable to input parameter\ncreateEffect((v: number | boolean): number | boolean => false);\n\ncreateEffect((v: Animal): Dog => new Dog(), new Dog());\ncreateEffect((v: Animal): Dog => new Dog(), new Animal());\ncreateEffect(\n // @ts-expect-error the Animal arg is not assignable to the Dog parameter\n (v: Dog): Dog => new Dog(),\n new Animal()\n);\n// @ts-expect-error the missing second arg is undefined, and undefined is not assignable to the Animal parameter\ncreateEffect((v: Animal): Dog => new Dog());\n\ncreateEffect(\n // @ts-expect-error because if number|boolean were returnable from the passed-in function, it wouldn't be assignable to the input of that function.\n // TODO can we improve this? Technically, the return type of the function is always assignable to number|boolean, which is really all we should care about.\n (v: number | string): number => 123,\n 123\n);\n\ncreateEffect((v: number | string): number => 123, \"asdf\");\n\ncreateEffect((v: number) => 123, 123);\n\ncreateEffect(\n (v?: number) => {\n return 123;\n },\n 123,\n {}\n);\ncreateEffect(() => 123);\ncreateEffect(() => {});\ncreateEffect(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {}\n);\n// @ts-expect-error undefined initial value is not assignable to the number parameter\ncreateEffect((v: number) => 123);\ncreateEffect(() => {\n return 123;\n}, 123);\ncreateEffect(() => {\n return 123;\n}, undefined);\ncreateEffect((v: number) => 123, 123);\ncreateEffect((v?: number) => 123, undefined);\ncreateEffect(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {},\n 123\n);\ncreateEffect(\n // @ts-expect-error the void return is not assignable to the explicitly specified number|undefined return\n v => {},\n 123\n);\ncreateEffect(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {},\n undefined\n);\ncreateEffect(v => {}); // useless, but ok\n// @ts-expect-error the void return is not assignable to the number|undefined parameter\ncreateEffect((v: number) => {});\ncreateEffect(\n // @ts-expect-error void return not assignable to number parameter\n (v: number) => {},\n 123\n);\ncreateEffect(\n // @ts-expect-error undefined second arg is not assignable to the number parameter\n (v: number) => {},\n undefined\n);\n// @ts-expect-error undefined second arg is not assignable to the number parameter\ncreateEffect((v: number) => 123, undefined);\n// @ts-expect-error void not assignable to number|undefined\ncreateEffect((v?: number) => {}, 123);\n\n//////////////////////////////////////////////////////////////////////////\n// createComputed ////////////////////////////////////////////////////\n//////////////////////////////////////////////////////////////////////////\n\ncreateComputed(() => {\n return \"hello\";\n}, \"init\");\n\ncreateComputed(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\n\ncreateComputed((prev: string) => {\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\n\ncreateComputed(() => {\n return \"hello\";\n}, 123);\n\ncreateComputed(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string = prev;\n return p + \"hello\";\n}, 123);\n\ncreateComputed((prev: number | string) => {\n const p: number | string = prev;\n return p + \"hello\";\n}, 123);\n\ncreateComputed(() => {\n return \"hello\";\n});\n\ncreateComputed(_prev => {\n return \"hello\";\n});\n\ncreateComputed(_prev => {});\n\ncreateComputed((v: number | string): number => 123, \"asdf\");\n\ncreateComputed((num: number | undefined): number | undefined => 123);\n\ncreateComputed((num?: number): number | undefined => 123);\n\ncreateComputed((v: number | string): number => 123, 123);\ncreateComputed((v: number | string): number => 123, 123);\n\n// @ts-expect-error undefined initial value not assignable to input parameter\ncreateComputed((v: number | boolean): number | boolean => false);\n\ncreateComputed((v: Animal): Dog => new Dog(), new Dog());\ncreateComputed((v: Animal): Dog => new Dog(), new Animal());\ncreateComputed(\n // @ts-expect-error the Animal arg is not assignable to the Dog parameter\n (v: Dog): Dog => new Dog(),\n new Animal()\n);\n// @ts-expect-error the missing second arg is undefined, and undefined is not assignable to the Animal parameter\ncreateComputed((v: Animal): Dog => new Dog());\n\ncreateComputed(\n // @ts-expect-error because if number|boolean were returnable from the passed-in function, it wouldn't be assignable to the input of that function.\n // TODO can we improve this? Technically, the return type of the function is always assignable to number|boolean, which is really all we should care about.\n (v: number | string): number => 123,\n 123\n);\n\ncreateComputed((v: number | string): number => 123, \"asdf\");\n\ncreateComputed((v: number) => 123, 123);\n\ncreateComputed(\n (v?: number) => {\n return 123;\n },\n 123,\n {}\n);\ncreateComputed(() => 123);\ncreateComputed(() => {});\ncreateComputed(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {}\n);\n// @ts-expect-error undefined initial value is not assignable to the number parameter\ncreateComputed((v: number) => 123);\ncreateComputed(() => {\n return 123;\n}, 123);\ncreateComputed(() => {\n return 123;\n}, undefined);\ncreateComputed((v: number) => 123, 123);\ncreateComputed((v?: number) => 123, undefined);\ncreateComputed(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {},\n 123\n);\ncreateComputed(\n // @ts-expect-error the void return is not assignable to the explicitly specified number|undefined return\n v => {},\n 123\n);\ncreateComputed(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {},\n undefined\n);\ncreateComputed(v => {}); // useless, but ok\n// @ts-expect-error the void return is not assignable to the number|undefined parameter\ncreateComputed((v: number) => {});\ncreateComputed(\n // @ts-expect-error void return not assignable to number parameter\n (v: number) => {},\n 123\n);\ncreateComputed(\n // @ts-expect-error undefined second arg is not assignable to the number parameter\n (v: number) => {},\n undefined\n);\n// @ts-expect-error undefined second arg is not assignable to the number parameter\ncreateComputed((v: number) => 123, undefined);\n// @ts-expect-error void not assignable to number|undefined\ncreateComputed((v?: number) => {}, 123);\n\n//////////////////////////////////////////////////////////////////////////\n// createRenderEffect ////////////////////////////////////////////////////\n//////////////////////////////////////////////////////////////////////////\n\ncreateRenderEffect(() => {\n return \"hello\";\n}, \"init\");\n\ncreateRenderEffect(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\n\ncreateRenderEffect((prev: string) => {\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\n\ncreateRenderEffect(() => {\n return \"hello\";\n}, 123);\n\ncreateRenderEffect(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string = prev;\n return p + \"hello\";\n}, 123);\n\ncreateRenderEffect((prev: number | string) => {\n const p: number | string = prev;\n return p + \"hello\";\n}, 123);\n\ncreateRenderEffect(() => {\n return \"hello\";\n});\n\ncreateRenderEffect(_prev => {\n return \"hello\";\n});\n\ncreateRenderEffect(_prev => {});\n\ncreateRenderEffect((v: number | string): number => 123, \"asdf\");\n\ncreateRenderEffect((num: number | undefined): number | undefined => 123);\n\ncreateRenderEffect((num?: number): number | undefined => 123);\n\ncreateRenderEffect((v: number | string): number => 123, 123);\ncreateRenderEffect((v: number | string): number => 123, 123);\n\n// @ts-expect-error undefined initial value not assignable to input parameter\ncreateRenderEffect((v: number | boolean): number | boolean => false);\n\ncreateRenderEffect((v: Animal): Dog => new Dog(), new Dog());\ncreateRenderEffect((v: Animal): Dog => new Dog(), new Animal());\ncreateRenderEffect(\n // @ts-expect-error the Animal arg is not assignable to the Dog parameter\n (v: Dog): Dog => new Dog(),\n new Animal()\n);\n// @ts-expect-error the missing second arg is undefined, and undefined is not assignable to the Animal parameter\ncreateRenderEffect((v: Animal): Dog => new Dog());\n\ncreateRenderEffect(\n // @ts-expect-error because if number|boolean were returnable from the passed-in function, it wouldn't be assignable to the input of that function.\n // TODO can we improve this? Technically, the return type of the function is always assignable to number|boolean, which is really all we should care about.\n (v: number | string): number => 123,\n 123\n);\n\ncreateRenderEffect((v: number | string): number => 123, \"asdf\");\n\ncreateRenderEffect((v: number) => 123, 123);\n\ncreateRenderEffect(\n (v?: number) => {\n return 123;\n },\n 123,\n {}\n);\ncreateRenderEffect(() => 123);\ncreateRenderEffect(() => {});\ncreateRenderEffect(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {}\n);\n// @ts-expect-error undefined initial value is not assignable to the number parameter\ncreateRenderEffect((v: number) => 123);\ncreateRenderEffect(() => {\n return 123;\n}, 123);\ncreateRenderEffect(() => {\n return 123;\n}, undefined);\ncreateRenderEffect((v: number) => 123, 123);\ncreateRenderEffect((v?: number) => 123, undefined);\ncreateRenderEffect(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {},\n 123\n);\ncreateRenderEffect(\n // @ts-expect-error the void return is not assignable to the explicitly specified number|undefined return\n v => {},\n 123\n);\ncreateRenderEffect(\n // @ts-expect-error the void return is not assignable to the number|undefined parameter\n (v?: number) => {},\n undefined\n);\ncreateRenderEffect(v => {}); // useless, but ok\n// @ts-expect-error the void return is not assignable to the number|undefined parameter\ncreateRenderEffect((v: number) => {});\ncreateRenderEffect(\n // @ts-expect-error void return not assignable to number parameter\n (v: number) => {},\n 123\n);\ncreateRenderEffect(\n // @ts-expect-error undefined second arg is not assignable to the number parameter\n (v: number) => {},\n undefined\n);\n// @ts-expect-error undefined second arg is not assignable to the number parameter\ncreateRenderEffect((v: number) => 123, undefined);\n// @ts-expect-error void not assignable to number|undefined\ncreateRenderEffect((v?: number) => {}, 123);\n\n//////////////////////////////////////////////////////////////////////////\n// createMemo ////////////////////////////////////////////////////\n//////////////////////////////////////////////////////////////////////////\n\ncreateMemo((v: number | string): number => 123, \"asdf\");\n\ncreateMemo((num: number | undefined): number | undefined => 123);\n\n// Return type should be `Accessor`\n// Not sure how to write a test for this, because `Accessor` is assignable to `Accessor`.\nlet c1 = createMemo((num?: number): number | undefined => undefined);\nlet n = c1();\n// @ts-expect-error n might be undefined\nconst n2 = n + 3; // n is undefined\n\ncreateMemo((v: number | string): number => 123, 123);\ncreateMemo((v: number | string): number => 123, 123);\n\n// @ts-expect-error undefined initial value not assignable to input parameter\ncreateMemo((v: number | boolean): number | boolean => false);\n\ncreateMemo((v: Animal): Dog => new Dog(), new Dog());\ncreateMemo((v: Animal): Dog => new Dog(), new Animal());\ncreateMemo(\n // @ts-expect-error the Animal arg is not assignable to the Dog parameter\n (v: Dog): Dog => new Dog(),\n new Animal()\n);\n// @ts-expect-error the missing second arg is undefined, and undefined is not assignable to the Animal parameter\ncreateMemo((v: Animal): Dog => new Dog());\n\ncreateMemo(\n // @ts-expect-error because if number|boolean were returnable from the passed-in function, it wouldn't be assignable to the input of that function.\n // TODO can we improve this? Technically, the return type of the function is always assignable to number|boolean, which is really all we should care about.\n (v: number | string): number => 123,\n 123\n);\n\ncreateMemo((v: number | string): number => 123, \"asdf\");\n\ncreateMemo((v: number) => 123, 123);\n\nconst mv0 = createMemo(() => {\n return \"hello\";\n}, \"init\");\nconst mv0t: string = mv0();\n\nconst mv1 = createMemo(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\nconst mv1t: string = mv1();\n\nconst mv11 = createMemo((prev: string) => {\n const p: string = prev;\n return p + \"hello\";\n}, \"init\");\nconst mv11t: string = mv11();\n\nconst mv2 = createMemo(() => {\n return \"hello\";\n}, 123);\nconst mv2t: string = mv2();\n\nconst mv3 = createMemo(prev => {\n // @ts-expect-error FIXME prev is inferred as unknown, so not assignable to string|number. Can we make it inferred?\n const p: string | number = prev;\n return p + \"hello\";\n}, 123);\nconst mv3t: string = mv3();\n\nconst mv31 = createMemo((prev: string | number) => {\n const p: string | number = prev;\n return p + \"hello\";\n}, 123);\nconst mv31t: string = mv31();\n\nconst mv4 = createMemo(() => {\n return \"hello\";\n});\nconst mv4t: string = mv4();\n\nconst mv5 = createMemo(_prev => {\n return \"hello\";\n});\nconst mv5t: string = mv5();\n\nconst mv6 = createMemo(() => {});\nconst mv6t: void = mv6();\n\nconst mv7 = createMemo(_prev => {});\nconst mv7t: void = mv7();\n\nconst v1 = createMemo(\n (v?: number) => {\n return 123;\n },\n 123,\n {}\n);\nconst v2 = createMemo(() => 123);\n// @ts-expect-error number return value can not be assigned to the input string arg\nconst v3 = createMemo((v: string) => 123);\nconst v4 = createMemo(v => 123);\nconst v5 = createMemo(() => {});\n// @ts-expect-error because void return of the effect function cannot be assigned to number | undefined of the effect function's parameter\nconst v6 = createMemo((v?: number) => {});\nconst v7 = createMemo(() => 123, 123);\nconst v8 = createMemo(() => 123, undefined);\n// @ts-expect-error undefined initial value is not assignable to the number parameter\nconst v9 = createMemo((v: number) => 123);\nconst v10 = createMemo((v: number) => 123, 123);\nconst v11 = createMemo((v?: number) => 123, 123);\nconst v12 = createMemo((v?: number) => 123, undefined);\nconst v13 = createMemo((v?: number) => 123, 123);\nconst v14 = createMemo(\n // @ts-expect-error because void return of the effect function cannot be assigned to number | undefined of the effect function's parameter\n (v?: number) => {},\n 123\n);\nconst v15 = createMemo(\n // @ts-expect-error effect function does not match the specified memo type\n v => {},\n 123\n);\nconst v16 = createMemo(\n // @ts-expect-error because void return of the effect function cannot be assigned to number | undefined of the effect function's parameter\n (v?: number) => {},\n undefined\n);\nconst v17 = createMemo(v => {});\n// @ts-expect-error because void return of the effect function cannot be assigned to number | undefined of the effect function's parameter\nconst v18 = createMemo((v: number) => {});\nconst v19 = createMemo(\n // @ts-expect-error void is not assignable to anything\n (v: number) => {},\n 123\n);\nconst v20 = createMemo(\n // @ts-expect-error clearly undefined can't be assigned into the input parameter of the effect function\n (v: number) => {},\n undefined\n);\nconst v21 =\n // @ts-expect-error and this one makes complete sense, undefined cannot go into the effect function's number parameter.\n createMemo((v: number) => 123, undefined);\nconst v22 = createMemo(\n // @ts-expect-error because void return of the effect function cannot be assigned to number | undefined of the effect function's parameter\n (v?: number) => {},\n 123\n);\n\nconst m: Accessor = createMemo(\n (v?: number) => {\n return 123;\n },\n 123,\n {}\n);\nconst m2: Accessor = createMemo(() => 123);\n// @ts-expect-error void can't be assigned to anything!\nconst m3: //\nAccessor = createMemo(() => {});\nconst m4: Accessor = createMemo(() => {});\n// @ts-expect-error void can't be assigned to anything!\nconst m5: Accessor = createMemo(\n // @ts-expect-error void can't be assigned to anything!\n (v?: number) => {}\n);\nconst mm5 = createMemo(\n // @ts-expect-error void can't be assigned to anything!\n (v?: number) => {}\n);\nconst m6: Accessor = createMemo(() => 123, 123);\nconst m7: Accessor = createMemo(() => 123, undefined);\nconst m8: Accessor = createMemo((v: number) => 123, 123);\nconst m9: Accessor = createMemo((v?: number) => 123, undefined);\nconst m10: Accessor = createMemo(\n // @ts-expect-error void can't be assigned to anything!\n (v?: number) => {},\n 123\n);\nconst m11: Accessor = createMemo(\n // @ts-expect-error void can't be assigned to anything!\n v => {},\n 123\n);\nconst m12: Accessor = createMemo(\n // @ts-expect-error void can't be assigned to anything!\n (v?: number) => {},\n undefined\n);\nconst m13 = createMemo((v?: number): number | undefined => 123, undefined);\nconst testm13: Accessor = m13;\nconst m14: Accessor = createMemo((v?: number): number => 123, undefined);\nconst m15: Accessor =\n // @ts-expect-error undefined initial value is not assignable to the number parameter\n createMemo((v: number): number => 123);\nconst m16: Accessor =\n // @ts-expect-error undefined initial value can't be assign to the number parameter\n createMemo((v: number): number => 123, undefined);\nconst m17: Accessor =\n // @ts-expect-error no overload matches because the second string arg cannot be assigned to the number|boolean parameter.\n createMemo((v: number | boolean): number => 123, \"asdf\");\nconst m18: Accessor =\n // @ts-expect-error undefined initial value is not assignable to the number parameter\n createMemo((v: number | boolean): number => 123);\nconst m19: Accessor =\n // @ts-expect-error undefined initial value is not assignable to the number parameter\n createMemo((v: number | string): number => 123);\nconst m20: Accessor =\n // @ts-expect-error because the number return cannot be assigned to the boolean|string parameter\n createMemo((v: boolean | string): number => 123);\nconst m21: Accessor =\n // @ts-expect-error because the second boolean arg cannot be assigned to the number|string parameter.\n createMemo((v: number | string): number => 123, true);\nconst m22: Accessor = createMemo((v: number | string): number => 123, \"asdf\");\nconst m23: Accessor = createMemo((v?: number | string): number => 123, undefined);\nconst m24: Accessor =\n // @ts-expect-error true not assignable to number|string\n createMemo((v: number | string): number => 123, true);\n\nconst asdf = createMemo(() => num());\n// @ts-expect-error Accessor is not assignable to Accessor\nconst asdf2: //\nAccessor = asdf;\n\n//////////////////////////////////////////////////////////////////////////\n// on ////////////////////////////////////////////////////////////////////\n//////////////////////////////////////////////////////////////////////////\n\nconst one = (): number => 123;\nconst two = () => Boolean(Math.random());\ncreateEffect(\n on(\n (): [number, boolean] => [1, true],\n (input, prevInput, prev) => {\n const [one, two]: [number, boolean] = input;\n if (prevInput) {\n const [prevOne, prevTwo]: [number, boolean] = prevInput;\n }\n // @ts-expect-error FIXME computed type is unknown, should be `number`.\n const _prev: number = prev;\n return one + +two;\n }\n )\n);\nconst onMemo1 = createMemo(\n on([one, two], (input, prevInput, prev) => {\n const [one, two]: [number, boolean] = input;\n if (prevInput) {\n const [prevOne, prevTwo]: [number, boolean] = prevInput;\n }\n // @ts-expect-error FIXME computed type is unknown, should be `number`.\n const _prev: number = prev;\n return one + +two;\n })\n);\nconst onMemo2: Accessor = onMemo1;\ncreateEffect(\n on(\n [one, two],\n (input, prevInput, prev) => {\n const [one, two]: [number, boolean] = input;\n if (prevInput) {\n const [prevOne, prevTwo]: [number, boolean] = prevInput;\n }\n // @ts-expect-error FIXME computed type is unknown, should be `number`.\n const _prev: number = prev;\n return one + +two;\n },\n { defer: true }\n )\n);\nconst onMemo3 = createMemo(\n on(\n [one, two],\n (input, prevInput, prev) => {\n const [one, two]: [number, boolean] = input;\n if (prevInput) {\n const [prevOne, prevTwo]: [number, boolean] = prevInput;\n }\n // @ts-expect-error FIXME computed type is unknown, should be `number`.\n const _prev: number = prev;\n return one + +two;\n },\n { defer: true }\n )\n);\n// @ts-expect-error when deferred the type includes undefined\nconst onMemo4: Accessor = onMemo3;\n// Allow passing boolean to defer\nconst memoCreator = (defer: boolean) =>\n createMemo(\n on(\n [one, two],\n (input, prevInput, prev) => {\n const [one, two]: [number, boolean] = input;\n if (prevInput) {\n const [prevOne, prevTwo]: [number, boolean] = prevInput;\n }\n // @ts-expect-error FIXME computed type is unknown, should be `number`.\n const _prev: number = prev;\n return one + +two;\n },\n { defer }\n )\n );\nconst memoCreator1: Accessor = memoCreator(true);\nconst memoCreator2: Accessor = memoCreator(false);\n\n//////////////////////////////////////////////////////////////////////////\n// createSelector ////////////////////////////////////////////////////////\n//////////////////////////////////////////////////////////////////////////\n\n{\n const selector = createSelector(() => 123);\n const bool: boolean = selector(123);\n // @ts-expect-error Argument of type 'string' is not assignable to parameter of type 'number'. ts(2345)\n const bool2: boolean = selector(\"123\");\n}\n{\n const selector = createSelector(() => 123, undefined, { name: \"test\" });\n const bool: boolean = selector(123);\n // @ts-expect-error Argument of type 'string' is not assignable to parameter of type 'number'. ts(2345)\n const bool2: boolean = selector(\"123\");\n}\n{\n const selector = createSelector(() => 123);\n const bool: boolean = selector(123);\n const bool2: boolean = selector(\"123\");\n // @ts-expect-error Argument of type 'null' is not assignable to parameter of type 'string | number'. ts(2345)\n const bool3: boolean = selector(null);\n}\n{\n const selector = createSelector(\n () => 123,\n (key, source) => key === source\n );\n const bool: boolean = selector(123);\n // @ts-expect-error Argument of type 'string' is not assignable to parameter of type 'number'. ts(2345)\n const bool2: boolean = selector(\"123\");\n}\n{\n const selector = createSelector(\n () => 123,\n (key: string, source) => Number(key) === source\n );\n // @ts-expect-error Argument of type 'number' is not assignable to parameter of type 'string'. ts(2345)\n const bool: boolean = selector(123);\n const bool2: boolean = selector(\"123\");\n}\n{\n const selector = createSelector(\n () => 123,\n (key, source) => key === source,\n { name: \"test\" }\n );\n const bool: boolean = selector(123);\n // @ts-expect-error Argument of type 'string' is not assignable to parameter of type 'number'. ts(2345)\n const bool2: boolean = selector(\"123\");\n}\n\n//////////////////////////////////////////////////////////////////////////\n// variations of signal types ////////////////////////////////////////////\n//////////////////////////////////////////////////////////////////////////\n\nconst [num, setN] = createSignal(1);\nlet n1: number = num();\nsetN(123);\nsetN(n => (n1 = n + 1));\n// @ts-expect-error Expected 1 arguments, but got 0. ts(2554)\nsetN();\n\nconst [num3, setN3] = createSignal();\n// @ts-expect-error Type 'undefined' is not assignable to type 'number'. ts(2322)\nlet n3: number = num3();\nsetN3(123);\nsetN3(undefined); // ok, accepts undefined\n// @ts-expect-error Object is possibly 'undefined'. ts(2532) (the `n` value)\nsetN3(n => (n3 = n + 1));\nsetN3(); // ok, accepts undefined\n\n// @ts-expect-error Argument of type 'boolean' is not assignable to parameter of type 'number'. ts(2345)\nconst [num4, setN4] = createSignal(true);\n\nconst [bool, setBool] = createSignal(true);\nlet b1: boolean = bool();\nsetBool(false);\nsetBool(b => (b1 = !b));\n// @ts-expect-error Expected 1 arguments, but got 0. ts(2554)\nsetBool();\n\nconst [bool2, setBool2] = createSignal();\n// @ts-expect-error Type 'undefined' is not assignable to type 'number'. ts(2322)\nlet n4: boolean = bool2();\nsetBool2(false);\nsetBool2(undefined); // ok, accepts undefined\nsetBool2(n => (n4 = !n)); // ok because undefined is being converted to boolean\n// @ts-expect-error Type 'boolean | undefined' is not assignable to type 'boolean'. ts(2322)\nsetBool2(n => (n4 = n));\nsetBool2(); // ok, accepts undefined\n\nconst [func, setFunc] = createSignal(() => 1);\n// @ts-expect-error 1 is not assignable to function (no overload matches)\nsetFunc(() => 1);\nsetFunc(() => (): 1 => 1); // ok, set the value to a function\nconst fn: () => 1 = func(); // ok, returns function value\nconst n5: 1 = func()();\n\nconst [func2, setFunc2] = createSignal<() => number>(() => 1);\n// @ts-expect-error number is not assignable to function (no overload matches)\nsetFunc2(() => 1);\nsetFunc2(() => () => 1); // ok, set the value to a function\nconst fn2: () => number = func2(); // ok, returns function value\nconst n6: number = func2()();\n\nconst [stringOrFunc1, setStringOrFunc1] = createSignal<(() => number) | string>(\"\");\n// @ts-expect-error number should not be assignable to string\nsetStringOrFunc1(() => 1);\nconst sf1: () => 1 = setStringOrFunc1(() => () => 1);\nconst sf2: \"oh yeah\" = setStringOrFunc1(\"oh yeah\");\nconst sf3: \"oh yeah\" = setStringOrFunc1(() => \"oh yeah\");\n// @ts-expect-error cannot set signal to undefined\nsetStringOrFunc1();\n// @ts-expect-error cannot set signal to undefined\nsetStringOrFunc1(undefined);\n// @ts-expect-error return value might be string\nconst sf6: () => number = stringOrFunc1();\nconst sf7: (() => number) | string | undefined = stringOrFunc1();\nconst sf8: (() => number) | string = stringOrFunc1();\n\nconst [stringOrFunc2, setStringOrFunc2] = createSignal<(() => number) | string>();\n// @ts-expect-error number should not be assignable to string\nsetStringOrFunc2(() => 1);\nconst sf9: () => 1 = setStringOrFunc2(() => () => 1);\nconst sf10: \"oh yeah\" = setStringOrFunc2(\"oh yeah\");\nconst sf11: \"oh yeah\" = setStringOrFunc2(() => \"oh yeah\");\nconst sf12: undefined = setStringOrFunc2();\nconst sf13: undefined = setStringOrFunc2(undefined);\nconst sf14: (() => number) | string | undefined = stringOrFunc2();\n// @ts-expect-error return value might be undefined\nconst sf15: (() => number) | string = stringOrFunc2();\n\nconst [stringOrNumber, setStringOrNumber] = createSignal(1);\nsetStringOrNumber(1 as number | string);\nsetStringOrNumber(1);\nsetStringOrNumber(\"\" as number | string);\nsetStringOrNumber(\"\");\n\nfunction createGenericSignal(): Signal {\n const [generic, setGeneric] = createSignal();\n const customSet: Setter = (v?) => setGeneric(v!);\n return [generic, (v?) => setGeneric(v!)];\n}\n\nfunction createInitializedSignal(init: T): Signal {\n const [generic, setGeneric] = createSignal(init);\n const customSet: Setter = (v?) => setGeneric(v!);\n return [generic, (v?) => setGeneric(v!)];\n}\n\ninterface KobalteBaseSelectProps {\n options: Array
` unless the target is document.head or `isSVG` is true. setting `useShadow` to true places the element in a shadow root to isolate styles.\n *\n * @description https://docs.solidjs.com/reference/components/portal\n */\nexport function Portal(props: {\n mount?: Node;\n useShadow?: T;\n isSVG?: S;\n ref?:\n | (S extends true ? SVGGElement : HTMLDivElement)\n | ((\n el: (T extends true ? { readonly shadowRoot: ShadowRoot } : {}) &\n (S extends true ? SVGGElement : HTMLDivElement)\n ) => void);\n children: JSX.Element;\n}) {\n const { useShadow } = props,\n marker = document.createTextNode(\"\"),\n mount = () => props.mount || document.body,\n owner = getOwner();\n let content: undefined | (() => JSX.Element);\n let hydrating = !!sharedConfig.context;\n\n createEffect(\n () => {\n // basically we backdoor into a sort of renderEffect here\n if (hydrating) (getOwner() as any).user = hydrating = false;\n content || (content = runWithOwner(owner, () => createMemo(() => props.children)));\n const el = mount();\n if (el instanceof HTMLHeadElement) {\n const [clean, setClean] = createSignal(false);\n const cleanup = () => setClean(true);\n createRoot(dispose => insert(el, () => (!clean() ? content!() : dispose()), null));\n onCleanup(cleanup);\n } else {\n const container = createElement(props.isSVG ? \"g\" : \"div\", props.isSVG),\n renderRoot =\n useShadow && container.attachShadow\n ? container.attachShadow({ mode: \"open\" })\n : container;\n\n Object.defineProperty(container, \"_$host\", {\n get() {\n return marker.parentNode;\n },\n configurable: true\n });\n insert(renderRoot, content);\n el.appendChild(container);\n props.ref && (props as any).ref(container);\n onCleanup(() => el.removeChild(container));\n }\n },\n undefined,\n { render: !hydrating }\n );\n return marker;\n}\n\nexport type DynamicProps> = {\n [K in keyof P]: P[K];\n} & {\n component: T | undefined;\n};\n\n/**\n * Renders an arbitrary component or element with the given props\n *\n * This is a lower level version of the `Dynamic` component, useful for\n * performance optimizations in libraries. Do not use this unless you know\n * what you are doing.\n * ```typescript\n * const element = () => multiline() ? 'textarea' : 'input';\n * createDynamic(element, { value: value() });\n * ```\n * @description https://docs.solidjs.com/reference/components/dynamic\n */\nexport function createDynamic(\n component: () => T | undefined,\n props: ComponentProps\n): JSX.Element {\n const cached = createMemo(component);\n return createMemo(() => {\n const component = cached();\n switch (typeof component) {\n case \"function\":\n if (isDev) Object.assign(component, { [$DEVCOMP]: true });\n return untrack(() => component(props));\n\n case \"string\":\n const isSvg = SVGElements.has(component);\n const el = sharedConfig.context\n ? getNextElement()\n : createElement(\n component,\n isSvg,\n untrack(() => props.is)\n );\n spread(el, props, isSvg);\n return el;\n\n default:\n break;\n }\n }) as unknown as JSX.Element;\n}\n\n/**\n * Renders an arbitrary custom or native component and passes the other props\n * ```typescript\n * \n * ```\n * @description https://docs.solidjs.com/reference/components/dynamic\n */\nexport function Dynamic(props: DynamicProps): JSX.Element {\n const [, others] = splitProps(props, [\"component\"]);\n return createDynamic(() => props.component, others as ComponentProps);\n}\n" }, { "path": "packages/solid/web/src/jsx.ts", "content": "export type { JSX } from \"../../types/jsx.js\";\n" }, { "path": "packages/solid/web/src/server-mock.ts", "content": "//@ts-nocheck\nfunction throwInBrowser(func: Function) {\n const err = new Error(`${func.name} is not supported in the browser, returning undefined`);\n\n console.error(err);\n}\n\nexport function renderToString(\n fn: () => T,\n options?: {\n nonce?: string;\n renderId?: string;\n }\n): string {\n throwInBrowser(renderToString);\n}\nexport function renderToStringAsync(\n fn: () => T,\n options?: {\n timeoutMs?: number;\n nonce?: string;\n renderId?: string;\n }\n): Promise {\n throwInBrowser(renderToStringAsync);\n}\nexport function renderToStream(\n fn: () => T,\n options?: {\n nonce?: string;\n renderId?: string;\n onCompleteShell?: (info: { write: (v: string) => void }) => void;\n onCompleteAll?: (info: { write: (v: string) => void }) => void;\n }\n): {\n pipe: (writable: { write: (v: string) => void }) => void;\n pipeTo: (writable: WritableStream) => void;\n} {\n throwInBrowser(renderToStream);\n}\nexport function ssr(template: string[] | string, ...nodes: any[]): { t: string } {}\nexport function ssrElement(\n name: string,\n props: any,\n children: any,\n needsId: boolean\n): { t: string } {}\nexport function ssrClassList(value: { [k: string]: boolean }): string {}\nexport function ssrStyle(value: { [k: string]: string }): string {}\nexport function ssrAttribute(key: string, value: boolean): string {}\nexport function ssrHydrationKey(): string {}\nexport function resolveSSRNode(node: any): string {}\nexport function escape(html: string): string {}\n\n/**\n * @deprecated Replaced by ssrElement\n */\nexport function ssrSpread(props: any, isSVG: boolean, skipChildren: boolean): void {}\nexport type LegacyResults = {\n startWriting: () => void;\n};\n/**\n * @deprecated Replaced by renderToStream\n */\nexport function pipeToWritable(\n fn: () => T,\n writable: WritableStream,\n options?: {\n nonce?: string;\n onReady?: (res: LegacyResults) => void;\n onCompleteAll?: () => void;\n }\n): void;\n/**\n * @deprecated Replaced by renderToStream\n */\nexport function pipeToNodeWritable(\n fn: () => T,\n writable: { write: (v: string) => void },\n options?: {\n nonce?: string;\n onReady?: (res: LegacyResults) => void;\n onCompleteAll?: () => void;\n }\n): void;\n" }, { "path": "packages/solid/web/storage/package.json", "content": "{\n \"name\": \"solid-js/web/storage\",\n \"main\": \"./dist/storage.cjs\",\n \"module\": \"./dist/storage.js\",\n \"types\": \"./types/index.d.ts\",\n \"type\": \"module\",\n \"sideEffects\": false,\n \"exports\": {\n \".\": {\n \"types\": \"./types/index.d.ts\",\n \"import\": \"./dist/storage.js\",\n \"require\": \"./dist/storage.cjs\"\n }\n }\n}\n" }, { "path": "packages/solid/web/storage/src/index.ts", "content": "import { AsyncLocalStorage } from \"node:async_hooks\";\nimport type { RequestEvent } from \"solid-js/web\";\nimport { isServer, RequestContext } from \"solid-js/web\";\n\n// using global on a symbol for locating it later and detaching for environments that don't support it.\nexport function provideRequestEvent(init: T, cb: () => U): U {\n if (!isServer) throw new Error(\"Attempting to use server context in non-server build\");\n const ctx: AsyncLocalStorage = ((globalThis as any)[RequestContext] =\n (globalThis as any)[RequestContext] || new AsyncLocalStorage());\n return ctx.run(init, cb);\n}\n" }, { "path": "packages/solid/web/storage/tsconfig.build.json", "content": "{\n \"extends\": \"../../../../tsconfig.json\",\n \"compilerOptions\": {\n \"outDir\": \"./types\",\n \"baseUrl\": \"src\",\n \"paths\": {\n \"solid-js\": [\"../../..\"],\n \"solid-js/web\": [\"../..\"],\n \"solid-js/jsx-runtime\": [\"../../../src/jsx\"],\n \"solid-js/jsx-dev-runtime\": [\"../../../src/jsx\"],\n }\n },\n \"include\": [\"./src\"]\n}\n" }, { "path": "packages/solid/web/storage/tsconfig.json", "content": "{\n \"extends\": \"./tsconfig.build.json\",\n \"include\": [\"./src\"]\n}\n" }, { "path": "packages/solid/web/test/context.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, it } from \"vitest\";\n\nimport { createContext, useContext } from \"../../src/index.js\";\nimport { render, Show } from \"../src/index.js\";\n\ndescribe(\"Testing Context\", () => {\n const ThemeContext = createContext(\"light\");\n const Component = () => {\n const theme = useContext(ThemeContext);\n return
{theme}
;\n };\n const CondComponent = () => {\n const theme = useContext(ThemeContext);\n return (\n \n
{theme}
\n \n );\n };\n const div = document.createElement(\"div\");\n it(\"should create context properly\", () => {\n expect(ThemeContext.id).toBeDefined();\n expect(ThemeContext.defaultValue).toBe(\"light\");\n });\n\n it(\"should work with single provider child\", () => {\n render(\n () => (\n \n \n \n ),\n div\n );\n expect((div.firstChild as HTMLDivElement).innerHTML).toBe(\"dark\");\n div.innerHTML = \"\";\n });\n\n it(\"should work with single conditional provider child\", () => {\n render(\n () => (\n \n \n \n ),\n div\n );\n expect((div.firstChild as HTMLDivElement).innerHTML).toBe(\"dark\");\n div.innerHTML = \"\";\n });\n\n it(\"should work with multi provider child\", () => {\n render(\n () => (\n \n
Hi
\n \n \n ),\n div\n );\n expect((div.firstChild!.nextSibling! as HTMLDivElement).innerHTML).toBe(\"dark\");\n div.innerHTML = \"\";\n });\n\n it(\"should work with multi conditional provider child\", () => {\n render(\n () => (\n \n
Hi
\n \n \n ),\n div\n );\n expect((div.firstChild!.nextSibling! as HTMLDivElement).innerHTML).toBe(\"dark\");\n div.innerHTML = \"\";\n });\n\n it(\"should work with dynamic multi provider child\", () => {\n const child = () => ;\n render(\n () => (\n \n
Hi
\n {child()}\n \n ),\n div\n );\n expect((div.firstChild!.nextSibling! as HTMLDivElement).innerHTML).toBe(\"dark\");\n div.innerHTML = \"\";\n });\n\n it(\"should work with dynamic multi conditional provider child\", () => {\n const child = () => ;\n render(\n () => (\n \n
Hi
\n {child()}\n \n ),\n div\n );\n expect((div.firstChild!.nextSibling! as HTMLDivElement).innerHTML).toBe(\"dark\");\n div.innerHTML = \"\";\n });\n});\n" }, { "path": "packages/solid/web/test/dynamic.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test, beforeEach, afterEach } from \"vitest\";\nimport { createRoot, createSignal, Component, JSX } from \"../../src/index.js\";\nimport { createStore } from \"../../store/src/index.js\";\nimport { Dynamic } from \"../src/index.js\";\n\ndescribe(\"Testing Dynamic control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n\n interface ExampleProps {\n id: string;\n }\n const [comp, setComp] = createSignal | keyof JSX.IntrinsicElements>(),\n [name, setName] = createSignal(\"Smith\");\n const Component = () => (\n
\n \n
\n ),\n CompA: Component = props =>
Hi {props.id}
,\n CompB: Component = props => Yo {props.id};\n\n beforeEach(() => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n });\n\n afterEach(() => disposer());\n\n test(\"Toggle Dynamic control flow\", () => {\n expect(div.innerHTML).toBe(\"\");\n setComp(() => CompA);\n expect(div.innerHTML).toBe(\"
Hi Smith
\");\n setName(\"Smithers\");\n expect(div.innerHTML).toBe(\"
Hi Smithers
\");\n setComp(() => CompB);\n expect(div.innerHTML).toBe(\"Yo Smithers\");\n setComp(\"h1\");\n expect(div.innerHTML).toBe(`

`);\n setName(\"Sunny\");\n expect(div.innerHTML).toBe(`

`);\n expect(div.querySelector(\"h1\")).toBeInstanceOf(HTMLElement);\n });\n\n test(\"Renders SVG elements\", () => {\n setComp(\"svg\");\n expect(div.querySelector(\"svg\")).toBeInstanceOf(SVGSVGElement);\n setComp(\"path\");\n expect(div.querySelector(\"path\")).toBeInstanceOf(SVGElement);\n });\n});\n\ndescribe(\"Testing Dynamic with state spread\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n\n interface ExampleProps {\n id: string;\n }\n const [comp, setComp] = createSignal | keyof JSX.IntrinsicElements>(),\n [state, setState] = createStore({\n id: \"Smith\"\n });\n const Component = () => (\n
\n \n
\n ),\n CompA: Component = props =>
Hi {props.id}
,\n CompB: Component = props => Yo {props.id};\n\n beforeEach(() => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n });\n\n afterEach(() => disposer());\n\n test(\"Toggle Dynamic control flow\", () => {\n expect(div.innerHTML).toBe(\"\");\n setComp(() => CompA);\n expect(div.innerHTML).toBe(\"
Hi Smith
\");\n setState(\"id\", \"Smithers\");\n expect(div.innerHTML).toBe(\"
Hi Smithers
\");\n setComp(() => CompB);\n expect(div.innerHTML).toBe(\"Yo Smithers\");\n setComp(\"h1\");\n expect(div.innerHTML).toBe(`

`);\n setState(\"id\", \"Sunny\");\n expect(div.innerHTML).toBe(`

`);\n expect(div.querySelector(\"h1\")).toBeInstanceOf(HTMLElement);\n });\n});\n" }, { "path": "packages/solid/web/test/element.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test } from \"vitest\";\nimport { createRoot, createSignal, createUniqueId, JSX, children } from \"../../src/index.js\";\n\ndeclare module \"solid-js/jsx-runtime\" {\n namespace JSX {\n interface Directives {\n getRef: boolean;\n }\n }\n}\n\ndescribe(\"Basic element attributes\", () => {\n test(\"spread\", () => {\n let div: HTMLDivElement;\n const props: JSX.HTMLAttributes = {\n id: \"main\",\n title: \"main\",\n children:

Hi

,\n ref: (ref: HTMLDivElement) => {\n div = ref;\n },\n onClick: () => console.log(\"clicked\")\n },\n d = createRoot(() =>
) as HTMLDivElement & { $$click: any };\n expect(div!).toBe(d);\n expect(d.id).toBe(\"main\");\n expect(d.title).toBe(\"main\");\n expect(d.$$click).toBeDefined();\n expect(d.innerHTML).toBe(\"

Hi

\");\n });\n\n test(\"classList\", () => {\n const classes = { first: true, second: false, \"third fourth\": true },\n d = (
) as HTMLDivElement;\n expect(d.className).toBe(\"first third fourth\");\n });\n\n test(\"ternary expression triggered\", () =>\n new Promise(done => {\n let div: HTMLDivElement;\n createRoot(() => {\n const [s, setS] = createSignal(0);\n div = (
{s() > 5 ? \"Large\" : \"Small\"}
) as HTMLDivElement;\n expect(div.innerHTML).toBe(\"Small\");\n setTimeout(() => {\n setS(7);\n expect(div.innerHTML).toBe(\"Large\");\n done(undefined);\n });\n });\n }));\n\n test(\"boolean expression triggered once\", () => {\n let div1: HTMLDivElement, div2: HTMLDivElement;\n createRoot(() => {\n const [s, setS] = createSignal(6);\n
{s() > 5 && (div1 = (
) as HTMLDivElement)}
;\n div2 = div1;\n setS(7);\n expect(div1).toBe(div2);\n });\n });\n\n test(\"directives work properly\", () => {\n let ref: HTMLDivElement,\n el!: HTMLDivElement,\n getRef = (el: HTMLDivElement) => (ref = el),\n d = (
) as HTMLDivElement;\n expect(ref!).toBe(el);\n });\n\n test(\"uniqueId\", () => {\n let div: HTMLDivElement;\n createRoot(() => {\n const id = createUniqueId();\n div = (\n
\n \n \n
\n ) as HTMLDivElement;\n });\n expect((div!.firstChild as HTMLLabelElement).htmlFor).toBe(\n (div!.firstChild!.nextSibling as HTMLInputElement).id\n );\n });\n\n test(\"children\", () => {\n const Comp = (props: { children?: JSX.Element }) => {\n const c = children(() => props.children);\n return (\n <>\n {c.toArray().map(i => (\n
{i}
\n ))}\n \n );\n };\n const res: HTMLDivElement = createRoot(() => {\n return (\n
\n \n Hello\n \n \n Hello\n Jake\n \n \n
\n ) as HTMLDivElement;\n });\n expect(res.innerHTML).toBe(\n \"
Hello
Hello
Jake
\"\n );\n });\n});\n" }, { "path": "packages/solid/web/test/errorboundary.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test } from \"vitest\";\nimport { createRoot, resetErrorBoundaries } from \"../../src/index.js\";\nimport { ErrorBoundary } from \"../src/index.js\";\n\ndescribe(\"Testing ErrorBoundary control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n\n const Component = () => {\n throw new Error(\"Failure\");\n };\n\n let first = true;\n const Component2 = () => {\n if (first) {\n first = false;\n throw new Error(\"Failure\");\n }\n return \"Success\";\n };\n\n const Component3 = () => {\n throw null;\n };\n\n test(\"Create an Error\", () => {\n createRoot(dispose => {\n disposer = dispose;\n
\n \n \n \n
;\n });\n expect(div.innerHTML).toBe(\"Failed Miserably\");\n });\n\n test(\"Create an Error with null\", () => {\n createRoot(dispose => {\n disposer = dispose;\n
\n \n \n \n
;\n });\n expect(div.innerHTML).toBe(\"Failed Miserably\");\n });\n\n test(\"Create an Error callback\", () => {\n createRoot(dispose => {\n disposer = dispose;\n
\n e.message}>\n \n \n
;\n });\n expect(div.innerHTML).toBe(\"Failure\");\n });\n\n test(\"Create an Error callback and reset\", () => {\n let r: () => void;\n createRoot(dispose => {\n disposer = dispose;\n
\n {\n r = reset;\n return e.message;\n }}\n >\n \n \n
;\n });\n expect(div.innerHTML).toBe(\"Failure\");\n r!();\n expect(div.innerHTML).toBe(\"Success\");\n first = true;\n });\n\n test(\"Create an Error global reset\", () => {\n let r: () => void;\n createRoot(dispose => {\n disposer = dispose;\n
\n e.message}>\n \n \n
;\n });\n expect(div.innerHTML).toBe(\"Failure\");\n resetErrorBoundaries();\n expect(div.innerHTML).toBe(\"Success\");\n first = true;\n });\n\n test(\"Create an Error in an Error Fallback\", () => {\n createRoot(dispose => {\n disposer = dispose;\n
\n \n }>\n \n \n \n
;\n });\n expect(div.innerHTML).toBe(\"Failed Miserably\");\n });\n\n test(\"dispose\", () => disposer());\n});\n" }, { "path": "packages/solid/web/test/for.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test } from \"vitest\";\nimport { createRoot, createSignal } from \"../../src/index.js\";\nimport { insert, For } from \"../src/index.js\";\n\ndescribe(\"Testing an only child each control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => (\n
\n {item => item}\n
\n );\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(array.join(\"\"));\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"abcd\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"abcd\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an multi child each control flow\", () => {\n const div = document.createElement(\"div\");\n div.appendChild(document.createTextNode(\"z\"));\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => {item => item};\n let disposer: () => void;\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(`${array.join(\"\")}z`);\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"abcdz\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n insert(div, , div.firstChild);\n });\n\n expect(div.innerHTML).toBe(\"abcdz\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child each control flow with fragment children\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => (\n
\n \n {item => (\n <>\n {item}\n {item}\n \n )}\n \n
\n );\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(array.map(p => `${p}${p}`).join(\"\"));\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"aabbccdd\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"aabbccdd\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child each control flow with array children\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => (\n
\n {item => [item, item]}\n
\n );\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(array.map(p => `${p}${p}`).join(\"\"));\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"aabbccdd\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"aabbccdd\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing each control flow with fallback\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([]);\n const Component = () => (\n
\n \n {item => item}\n \n
\n );\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n expect(div.innerHTML).toBe(\"Empty\");\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"abcd\");\n setList([]);\n expect(div.innerHTML).toBe(\"Empty\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing each that maps to undefined\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([]);\n const Component = () => (\n
\n {item => undefined}\n
\n );\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n expect(div.innerHTML).toBe(\"\");\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"\");\n setList([]);\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing each with indexes\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([]);\n const Component = () => (\n
\n \n {(item, i) => {item + i()}}\n \n
\n );\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n expect(div.innerHTML).toBe(\"Hi\");\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"a0b1c2d3\");\n setList([n2, n3, n4, n1]);\n expect(div.innerHTML).toBe(\"b0c1d2a3\");\n setList([n3, n4, n1]);\n expect(div.innerHTML).toBe(\"c0d1a2\");\n setList([n3, n2, n4, n1]);\n expect(div.innerHTML).toBe(\"c0b1d2a3\");\n setList([]);\n expect(div.innerHTML).toBe(\"Hi\");\n setList([n1]);\n expect(div.innerHTML).toBe(\"a0\");\n });\n\n test(\"dispose\", () => disposer());\n});\n" }, { "path": "packages/solid/web/test/index.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test } from \"vitest\";\nimport { createRoot, createSignal } from \"../../src/index.js\";\nimport { insert, Index } from \"../src/index.js\";\n\ndescribe(\"Testing an only child each control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => (\n
\n {item => <>{item()}}\n
\n );\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(array.join(\"\"));\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"abcd\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"abcd\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an multi child each control flow\", () => {\n const div = document.createElement(\"div\");\n div.appendChild(document.createTextNode(\"z\"));\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => {item => <>{item()}};\n let disposer: () => void;\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(`${array.join(\"\")}z`);\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"abcdz\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n insert(div, , div.firstChild);\n });\n\n expect(div.innerHTML).toBe(\"abcdz\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child each control flow with fragment children\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => (\n
\n \n {item => (\n <>\n {item}\n {item}\n \n )}\n \n
\n );\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(array.map(p => `${p}${p}`).join(\"\"));\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"aabbccdd\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"aabbccdd\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child each control flow with array children\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([n1, n2, n3, n4]);\n const Component = () => (\n
\n \n {item => (\n <>\n {item()}\n {item()}\n \n )}\n \n
\n );\n\n function apply(array: string[]) {\n setList(array);\n expect(div.innerHTML).toBe(array.map(p => `${p}${p}`).join(\"\"));\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"aabbccdd\");\n }\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"aabbccdd\");\n });\n\n test(\"1 missing\", () => {\n apply([n2, n3, n4]);\n apply([n1, n3, n4]);\n apply([n1, n2, n4]);\n apply([n1, n2, n3]);\n });\n\n test(\"2 missing\", () => {\n apply([n3, n4]);\n apply([n2, n4]);\n apply([n2, n3]);\n apply([n1, n4]);\n apply([n1, n3]);\n apply([n1, n2]);\n });\n\n test(\"3 missing\", () => {\n apply([n1]);\n apply([n2]);\n apply([n3]);\n apply([n4]);\n });\n\n test(\"all missing\", () => {\n apply([]);\n });\n\n test(\"swaps\", () => {\n apply([n2, n1, n3, n4]);\n apply([n3, n2, n1, n4]);\n apply([n4, n2, n3, n1]);\n });\n\n test(\"rotations\", () => {\n apply([n2, n3, n4, n1]);\n apply([n3, n4, n1, n2]);\n apply([n4, n1, n2, n3]);\n });\n\n test(\"reversal\", () => {\n apply([n4, n3, n2, n1]);\n });\n\n test(\"full replace\", () => {\n apply([\"e\", \"f\", \"g\", \"h\"]);\n });\n\n test(\"swap backward edge\", () => {\n setList([\"milk\", \"bread\", \"chips\", \"cookie\", \"honey\"]);\n setList([\"chips\", \"bread\", \"cookie\", \"milk\", \"honey\"]);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing each control flow with fallback\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([]);\n const Component = () => (\n
\n \n {item => <>{item()}}\n \n
\n );\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n expect(div.innerHTML).toBe(\"Empty\");\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"abcd\");\n setList([]);\n expect(div.innerHTML).toBe(\"Empty\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing each that maps to undefined\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([]);\n const Component = () => (\n
\n {item => undefined}\n
\n );\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n expect(div.innerHTML).toBe(\"\");\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"\");\n setList([]);\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing each with indexes\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const n1 = \"a\",\n n2 = \"b\",\n n3 = \"c\",\n n4 = \"d\";\n const [list, setList] = createSignal([]);\n const Component = () => (\n
\n {(item, i) => {item() + i}}\n
\n );\n\n test(\"Create each control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n expect(div.innerHTML).toBe(\"\");\n setList([n1, n2, n3, n4]);\n expect(div.innerHTML).toBe(\"a0b1c2d3\");\n setList([n2, n3, n4, n1]);\n expect(div.innerHTML).toBe(\"b0c1d2a3\");\n setList([n3, n4, n1]);\n expect(div.innerHTML).toBe(\"c0d1a2\");\n setList([n3, n2, n4, n1]);\n expect(div.innerHTML).toBe(\"c0b1d2a3\");\n setList([]);\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"dispose\", () => disposer());\n});\n" }, { "path": "packages/solid/web/test/portal.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test } from \"vitest\";\nimport { createSignal } from \"../../src/index.js\";\nimport { render, clearDelegatedEvents, Portal, Show } from \"../src/index.js\";\n\ndescribe(\"Testing a simple Portal\", () => {\n let div = document.createElement(\"div\"),\n disposer: () => void;\n const testMount = document.createElement(\"div\");\n const Component = () => Hi;\n\n test(\"Create portal control flow\", () => {\n disposer = render(Component, div);\n expect(div.innerHTML).toBe(\"\");\n expect((testMount.firstChild as HTMLDivElement).innerHTML).toBe(\"Hi\");\n expect((testMount.firstChild as HTMLDivElement & { _$host: HTMLElement })._$host).toBe(div);\n });\n\n test(\"dispose\", () => {\n disposer();\n expect(div.innerHTML).toBe(\"\");\n });\n});\n\ndescribe(\"Testing an SVG Portal\", () => {\n let div = document.createElement(\"div\"),\n disposer: () => void;\n const testMount = document.createElement(\"svg\");\n const Component = () => (\n \n Hi\n \n );\n\n test(\"Create portal control flow\", () => {\n disposer = render(Component, div);\n expect(div.innerHTML).toBe(\"\");\n expect((testMount.firstChild as SVGGElement).innerHTML).toBe(\"Hi\");\n expect((testMount.firstChild as SVGGElement & { _$host: SVGElement })._$host).toBe(div);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing a Portal to the head\", () => {\n let div = document.createElement(\"div\"),\n disposer: () => void,\n [s, set] = createSignal(\"A Meaningful Page Title\"),\n [visible, setVisible] = createSignal(true);\n const Component = () => (\n \n \n {s()}\n \n \n );\n\n test(\"Create portal control flow\", () => {\n disposer = render(Component, div);\n expect(div.innerHTML).toBe(\"\");\n expect(document.head.innerHTML).toBe(\"A Meaningful Page Title\");\n });\n\n test(\"Update title text\", () => {\n set(\"A New Better Page Title\");\n expect(document.head.innerHTML).toBe(\"A New Better Page Title\");\n });\n\n test(\"Hide Portal\", () => {\n setVisible(false);\n expect(document.head.innerHTML).toBe(\"\");\n setVisible(true);\n expect(document.head.innerHTML).toBe(\"A New Better Page Title\");\n });\n\n test(\"dispose\", async () => {\n expect(document.head.innerHTML).toBe(\"A New Better Page Title\");\n disposer();\n expect(document.head.innerHTML).toBe(\"\");\n });\n});\n\ndescribe(\"Testing a Portal with Synthetic Events\", () => {\n let div = document.createElement(\"div\"),\n disposer: () => void,\n checkElem!: HTMLDivElement,\n testElem!: HTMLDivElement,\n clicked = false;\n const Component = () => (\n \n
(clicked = true)} />\n \n );\n\n test(\"Create portal control flow\", () => {\n disposer = render(Component, div);\n expect(div.innerHTML).toBe(\"\");\n expect(testElem).toBe(checkElem.firstChild);\n });\n\n test(\"Test portal element clicked\", () => {\n expect(clicked).toBe(false);\n testElem.click();\n expect(clicked).toBe(true);\n clicked = false;\n clearDelegatedEvents();\n expect(clicked).toBe(false);\n testElem.click();\n expect(clicked).toBe(false);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing a Portal with direct reactive children\", () => {\n let div = document.createElement(\"div\"),\n disposer: () => void,\n [count, setCount] = createSignal(0),\n portalElem!: HTMLDivElement;\n const Component = () => {count()};\n\n test(\"Create portal control flow\", () => {\n disposer = render(Component, div);\n expect(div.innerHTML).toBe(\"\");\n expect(document.body.firstChild).toBe(portalElem);\n });\n\n test(\"Click to trigger reactive update\", () => {\n expect(portalElem.innerHTML).toBe(\"0\");\n setCount(count() + 1);\n expect(portalElem.innerHTML).toBe(\"1\");\n setCount(count() + 1);\n expect(portalElem.innerHTML).toBe(\"2\");\n });\n\n test(\"dispose\", () => disposer());\n});\n" }, { "path": "packages/solid/web/test/server-mock.spec.tsx", "content": "import { expect, test, vi, beforeEach, afterAll } from \"vitest\";\nimport { renderToString, renderToStringAsync, renderToStream } from \"../src/server-mock.js\";\n\nconst origConsoleError = console.error;\nconst mockConsoleError = vi.fn();\n\nbeforeEach(() => {\n console.error = mockConsoleError;\n mockConsoleError.mockReset();\n});\n\nafterAll(() => {\n console.error = origConsoleError;\n});\n\ntest(\"renderToString\", () => {\n const result = renderToString(() => {});\n\n const err: Error = mockConsoleError.mock.calls[0][0];\n\n expect(err.message).toContain(\n \"renderToString is not supported in the browser, returning undefined\"\n );\n expect(result).toBeUndefined();\n});\n\ntest(\"renderToStringAsync\", () => {\n const result = renderToStringAsync(() => {});\n\n const err: Error = mockConsoleError.mock.calls[0][0];\n\n expect(err.message).toContain(\n \"renderToStringAsync is not supported in the browser, returning undefined\"\n );\n expect(result).toBeUndefined();\n});\n\ntest(\"renderToStream\", () => {\n const result = renderToStream(() => {});\n\n const err: Error = mockConsoleError.mock.calls[0][0];\n\n expect(err.message).toContain(\n \"renderToStream is not supported in the browser, returning undefined\"\n );\n expect(result).toBeUndefined();\n});\n" }, { "path": "packages/solid/web/test/show.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test } from \"vitest\";\nimport { createRoot, createSignal } from \"../../src/index.js\";\nimport { Show } from \"../src/index.js\";\n\ndescribe(\"Testing an only child show control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n const Component = () => (\n
\n = 5}>{count()}\n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"Toggle show control flow\", () => {\n setCount(7);\n expect(div.innerHTML).toBe(\"7\");\n setCount(5);\n expect(div.innerHTML).toBe(\"5\");\n setCount(2);\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child show control flow with DOM children\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n const Component = () => (\n
\n = 5}>\n {count()}\n counted\n \n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"Toggle show control flow\", () => {\n setCount(7);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n setCount(5);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n setCount(2);\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing nonkeyed show control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n let whenExecuted = 0;\n let childrenExecuted = 0;\n function when() {\n whenExecuted++;\n return count();\n }\n const Component = () => (\n
\n \n {count()}\n {childrenExecuted++}\n \n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n expect(whenExecuted).toBe(1);\n expect(childrenExecuted).toBe(0);\n });\n\n test(\"Toggle show control flow\", () => {\n setCount(7);\n expect(whenExecuted).toBe(2);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n expect(childrenExecuted).toBe(1);\n setCount(5);\n expect(whenExecuted).toBe(3);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n expect(childrenExecuted).toBe(1);\n setCount(5);\n expect(whenExecuted).toBe(3);\n setCount(0);\n expect(whenExecuted).toBe(4);\n expect(div.innerHTML).toBe(\"\");\n expect(childrenExecuted).toBe(1);\n setCount(5);\n expect(whenExecuted).toBe(5);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing keyed show control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n let whenExecuted = 0;\n let childrenExecuted = 0;\n function when() {\n whenExecuted++;\n return count();\n }\n const Component = () => (\n
\n \n {count()}\n {childrenExecuted++}\n \n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n expect(whenExecuted).toBe(1);\n expect(childrenExecuted).toBe(0);\n });\n\n test(\"Toggle show control flow\", () => {\n setCount(7);\n expect(whenExecuted).toBe(2);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n expect(childrenExecuted).toBe(1);\n setCount(5);\n expect(whenExecuted).toBe(3);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n expect(childrenExecuted).toBe(2);\n setCount(5);\n expect(whenExecuted).toBe(3);\n setCount(0);\n expect(whenExecuted).toBe(4);\n expect(div.innerHTML).toBe(\"\");\n expect(childrenExecuted).toBe(2);\n setCount(5);\n expect(whenExecuted).toBe(5);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing nonkeyed function show control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n let whenExecuted = 0;\n let childrenExecuted = 0;\n function when() {\n whenExecuted++;\n return count();\n }\n const Component = () => (\n
\n \n {count => (\n <>\n {count()}\n {childrenExecuted++}\n \n )}\n \n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n expect(whenExecuted).toBe(1);\n expect(childrenExecuted).toBe(0);\n });\n\n test(\"Toggle show control flow\", () => {\n setCount(7);\n expect(whenExecuted).toBe(2);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n expect(childrenExecuted).toBe(1);\n setCount(5);\n expect(whenExecuted).toBe(3);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n expect(childrenExecuted).toBe(1);\n setCount(5);\n expect(whenExecuted).toBe(3);\n setCount(0);\n expect(whenExecuted).toBe(4);\n expect(div.innerHTML).toBe(\"\");\n expect(childrenExecuted).toBe(1);\n setCount(5);\n expect(whenExecuted).toBe(5);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing keyed function show control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n let executed = 0;\n const Component = () => (\n
\n \n {count => (\n <>\n {count}\n {executed++}\n \n )}\n \n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n expect(executed).toBe(0);\n });\n\n test(\"Toggle show control flow\", () => {\n setCount(7);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n expect(executed).toBe(1);\n setCount(5);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n expect(executed).toBe(2);\n setCount(0);\n expect(div.innerHTML).toBe(\"\");\n expect(executed).toBe(2);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child show control flow with keyed function\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [data, setData] = createSignal<{ count: number }>();\n const Component = () => (\n
\n \n {({ count }) => (\n <>\n {count}\n counted\n \n )}\n \n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"Toggle show control flow\", () => {\n setData({ count: 7 });\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n setData({ count: 5 });\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n setData({ count: 2 });\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"2\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child show control flow with non-keyed function\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [data, setData] = createSignal<{ count: number }>();\n const Component = () => (\n
\n \n {data => (\n <>\n {data().count}\n counted\n \n )}\n \n
\n );\n\n test(\"Create show control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"\");\n });\n\n test(\"Toggle show control flow\", () => {\n setData({ count: 7 });\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n setData({ count: 5 });\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n setData({ count: 2 });\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"2\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child show control flow with DOM children and fallback\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n const Component = () => (\n
\n = 5} fallback={Too Low}>\n {count()}\n \n
\n );\n\n test(\"Create when control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"Too Low\");\n });\n\n test(\"Toggle show control flow\", () => {\n setCount(7);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"7\");\n setCount(5);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"5\");\n setCount(2);\n expect((div.firstChild as HTMLSpanElement).innerHTML).toBe(\"Too Low\");\n });\n\n test(\"dispose\", () => disposer());\n});\n" }, { "path": "packages/solid/web/test/suspense.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\n\nimport { describe, expect, test, beforeEach, afterEach, vi } from \"vitest\";\nimport \"../../test/MessageChannel\";\nimport {\n lazy,\n createSignal,\n createResource,\n useTransition,\n enableScheduling\n} from \"../../src/index.js\";\nimport { render, Suspense, SuspenseList } from \"../src/index.js\";\nimport { createStore } from \"../../store/src/index.js\";\n\nenableScheduling();\n\nbeforeEach(() => {\n vi.useFakeTimers();\n});\nafterEach(() => {\n vi.useRealTimers();\n});\ndescribe(\"Testing Basics\", () => {\n test(\"Children are reactive\", () => {\n let div = document.createElement(\"div\");\n let increment: () => void;\n render(() => {\n const [count, setCount] = createSignal(0);\n increment = () => setCount(count() + 1);\n return {count()};\n }, div);\n expect(div.innerHTML).toBe(\"0\");\n increment!();\n expect(div.innerHTML).toBe(\"1\");\n });\n});\ndescribe(\"Testing Suspense\", () => {\n let div = document.createElement(\"div\"),\n disposer: () => void,\n resolvers: Function[] = [],\n [triggered, trigger] = createSignal();\n const LazyComponent = lazy(() => new Promise(r => resolvers.push(r))),\n ChildComponent = (props: { greeting: string }) => {\n const [value] = createResource(\n triggered,\n () => new Promise(r => setTimeout(() => r(\"Jo\"), 300)),\n { initialValue: \"\" }\n );\n return (\n <>\n {props.greeting} {value()}\n \n );\n },\n Component = () => (\n \n .\n \n \n );\n\n test(\"Create Suspense control flow\", () => {\n disposer = render(Component, div);\n expect(div.innerHTML).toBe(\"Loading\");\n });\n\n test(\"Toggle Suspense control flow\", async () => {\n for (const r of resolvers) r({ default: ChildComponent });\n\n await Promise.resolve();\n vi.runAllTimers();\n await Promise.resolve();\n\n expect(div.innerHTML).toBe(\"Hi, .Hello \");\n });\n\n test(\"Toggle with refresh transition\", async () => {\n const [pending, start] = useTransition();\n let finished = false;\n\n start(() => trigger(\"Jo\")).then(() => (finished = true));\n expect(div.innerHTML).toBe(\"Hi, .Hello \");\n expect(finished).toBe(false);\n // wait trigger resource refetch\n await Promise.resolve();\n\n expect(div.innerHTML).toBe(\"Hi, .Hello \");\n expect(pending()).toBe(true);\n expect(finished).toBe(false);\n\n // Exhausts create-resource setTimeout\n vi.runAllTimers();\n // wait update suspense state\n await Promise.resolve();\n // wait update computation\n vi.runAllTimers();\n // wait write signal suc\n await Promise.resolve();\n\n vi.runAllTimers();\n await Promise.resolve();\n\n expect(div.innerHTML).toBe(\"Hi, Jo.Hello Jo\");\n expect(pending()).toBe(false);\n expect(finished).toBe(true);\n });\n\n test(\"Toggle with store and refresh transition\", async () => {\n const [store, setStore] = createStore({ count: 0 });\n const [pending, start] = useTransition();\n let finished = false;\n\n start(() => {\n setStore({ count: 1 });\n trigger(\"Jack\");\n }).then(() => (finished = true));\n\n expect(store.count).toBe(0);\n expect(finished).toBe(false);\n // wait trigger resource refetch\n await Promise.resolve();\n\n expect(store.count).toBe(0);\n expect(pending()).toBe(true);\n expect(finished).toBe(false);\n\n // Exhausts create-resource setTimeout\n vi.runAllTimers();\n // wait update suspense state\n await Promise.resolve();\n // wait update computation\n vi.runAllTimers();\n\n // Await the rest of the things, TODO: figure out what these are\n await Promise.resolve();\n vi.runAllTimers();\n await Promise.resolve();\n\n expect(pending()).toBe(false);\n expect(finished).toBe(true);\n expect(store.count).toBe(1);\n });\n\n test(\"dispose\", () => {\n div.innerHTML = \"\";\n disposer();\n });\n});\n\ndescribe(\"SuspenseList\", () => {\n const promiseFactory = (time: number) => {\n return (v: string) =>\n new Promise(r => {\n setTimeout(() => {\n r(v);\n }, time);\n });\n },\n A = () => {\n const [value] = createResource(\"A\", promiseFactory(200));\n return
{value()}
;\n },\n B = () => {\n const [value] = createResource(\"B\", promiseFactory(100));\n return
{value()}
;\n },\n C = () => {\n const [value] = createResource(\"C\", promiseFactory(300));\n return
{value()}
;\n };\n\n test(\"revealOrder together\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n Loading 1
}>\n \n \n Loading 2
}>\n \n \n Loading 3
}>\n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n vi.advanceTimersByTime(100);\n // wait effect update\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n\n test(\"revealOrder forwards\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n Loading 1
}>\n \n \n Loading 2
}>\n \n \n Loading 3
}>\n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n\n test(\"revealOrder forwards hidden\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n Loading 1
}>\n \n \n Loading 2
}>\n \n \n Loading 3
}>\n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"\");\n\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n\n test(\"revealOrder forwards\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n Loading 1
}>\n \n \n Loading 2
}>\n \n \n Loading 3
}>\n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n\n test(\"revealOrder forwards collapse\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n Loading 1
}>\n \n \n Loading 2
}>\n \n \n Loading 3
}>\n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"
Loading 1
\");\n\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n\n test(\"revealOrder backwards collapse\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n Loading 1}>\n \n \n Loading 2}>\n \n \n Loading 3}>\n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"
Loading 3
\");\n\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n\n test(\"nested SuspenseList together\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n \n Loading 1}>\n \n \n \n \n Loading 2}>\n \n \n Loading 3}>\n \n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n\n test(\"nested SuspenseList forwards\", async () => {\n const div = document.createElement(\"div\"),\n Comp = () => (\n \n \n Loading 1}>\n \n \n \n \n Loading 2}>\n \n \n Loading 3}>\n \n \n \n \n );\n const dispose = render(Comp, div);\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(110);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
Loading 1
Loading 2
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
Loading 3
\");\n\n vi.advanceTimersByTime(100);\n await Promise.resolve();\n expect(div.innerHTML).toBe(\"
A
B
C
\");\n dispose();\n });\n});\n" }, { "path": "packages/solid/web/test/switch.spec.tsx", "content": "/**\n * @jsxImportSource solid-js\n * @vitest-environment jsdom\n */\nimport { describe, expect, test } from \"vitest\";\nimport { render, Switch, Match, For } from \"../src/index.js\";\nimport { createRoot, createSignal } from \"../../src/index.js\";\nimport { createStore } from \"../../store/src/index.js\";\n\ndescribe(\"Testing a single match switch control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n const Component = () => (\n
\n \n 1\n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"Toggle Switch control flow\", () => {\n setCount(1);\n expect(div.innerHTML).toBe(\"1\");\n setCount(3);\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing an only child Switch control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [count, setCount] = createSignal(0);\n const Component = () => (\n
\n \n 1\n 2\n 3\n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"Toggle Switch control flow\", () => {\n setCount(1);\n expect(div.innerHTML).toBe(\"1\");\n setCount(4);\n expect(div.innerHTML).toBe(\"2\");\n setCount(7);\n expect(div.innerHTML).toBe(\"3\");\n setCount(9);\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"doesn't re-render on same option\", () => {\n setCount(4);\n expect(div.innerHTML).toBe(\"2\");\n const c = div.firstChild;\n setCount(4);\n expect(div.innerHTML).toBe(\"2\");\n expect(div.firstChild).toBe(c);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing keyed Switch control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [a, setA] = createSignal(0),\n [b, setB] = createSignal(0),\n [c, setC] = createSignal(0);\n const Component = () => (\n
\n \n \n {a()}\n \n \n {b()}\n \n \n {c()}\n \n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"Toggle Switch control flow\", () => {\n setC(1);\n expect(div.innerHTML).toBe(\"1\");\n setB(2);\n expect(div.innerHTML).toBe(\"2\");\n setA(3);\n expect(div.innerHTML).toBe(\"3\");\n setA(0);\n expect(div.innerHTML).toBe(\"2\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing keyed function handler Switch control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [a, setA] = createSignal(0),\n [b, setB] = createSignal(0),\n [c, setC] = createSignal(0);\n const Component = () => (\n
\n \n \n {a => a}\n \n \n {b => b}\n \n \n {c => c}\n \n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"Toggle Switch control flow\", () => {\n setC(1);\n expect(div.innerHTML).toBe(\"1\");\n setB(2);\n expect(div.innerHTML).toBe(\"2\");\n setA(3);\n expect(div.innerHTML).toBe(\"3\");\n setA(0);\n expect(div.innerHTML).toBe(\"2\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing non-keyed function handler Switch control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [a, setA] = createSignal(0),\n [b, setB] = createSignal(0),\n [c, setC] = createSignal(0);\n const Component = () => (\n
\n \n {a => <>{a()}}\n {b => <>{b()}}\n {c => <>{c()}}\n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"Toggle Switch control flow\", () => {\n setC(1);\n expect(div.innerHTML).toBe(\"1\");\n setB(2);\n expect(div.innerHTML).toBe(\"2\");\n setA(3);\n expect(div.innerHTML).toBe(\"3\");\n setA(0);\n expect(div.innerHTML).toBe(\"2\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing Switch conditions evaluation counts\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n function makeCondition() {\n const [get, set] = createSignal(0);\n const result = {\n get,\n set,\n evalCount: 0,\n getAndCount: () => {\n result.evalCount++;\n return get();\n }\n };\n return result;\n }\n const a = makeCondition(),\n b = makeCondition(),\n c = makeCondition();\n const Component = () => (\n
\n \n a={a.get()}\n {b => <>b={b()}}\n \n {c => <>c={c}}\n \n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"fallback\");\n expect(a.evalCount).toBe(1);\n expect(b.evalCount).toBe(1);\n expect(c.evalCount).toBe(1);\n });\n\n test(\"Toggle conditions\", () => {\n c.set(5);\n expect(div.innerHTML).toBe(\"c=5\");\n expect(a.evalCount).toBe(1);\n expect(b.evalCount).toBe(1);\n expect(c.evalCount).toBe(2);\n a.set(1);\n expect(div.innerHTML).toBe(\"a=1\");\n expect(a.evalCount).toBe(2);\n expect(b.evalCount).toBe(1);\n expect(c.evalCount).toBe(2);\n b.set(3);\n expect(div.innerHTML).toBe(\"a=1\");\n expect(a.evalCount).toBe(2);\n expect(b.evalCount).toBe(1); // did not evaluate\n expect(c.evalCount).toBe(2);\n b.set(2);\n expect(div.innerHTML).toBe(\"a=1\");\n expect(a.evalCount).toBe(2);\n expect(b.evalCount).toBe(1); // did not evaluate\n expect(c.evalCount).toBe(2);\n a.set(0);\n expect(div.innerHTML).toBe(\"b=2\");\n expect(a.evalCount).toBe(3);\n expect(b.evalCount).toBe(2); // evaluated now\n expect(c.evalCount).toBe(2);\n b.set(3);\n expect(div.innerHTML).toBe(\"b=3\");\n expect(a.evalCount).toBe(3);\n expect(b.evalCount).toBe(3);\n expect(c.evalCount).toBe(2);\n c.set(3);\n expect(div.innerHTML).toBe(\"b=3\");\n expect(a.evalCount).toBe(3);\n expect(b.evalCount).toBe(3);\n expect(c.evalCount).toBe(2); // did not evaluate\n a.set(1);\n expect(div.innerHTML).toBe(\"a=1\");\n expect(a.evalCount).toBe(4);\n expect(b.evalCount).toBe(3);\n expect(c.evalCount).toBe(2);\n b.set(1);\n expect(div.innerHTML).toBe(\"a=1\");\n expect(a.evalCount).toBe(4);\n expect(b.evalCount).toBe(3); // did not evaluate\n expect(c.evalCount).toBe(2);\n b.set(0);\n expect(div.innerHTML).toBe(\"a=1\");\n expect(a.evalCount).toBe(4);\n expect(b.evalCount).toBe(3); // did not evaluate\n expect(c.evalCount).toBe(2);\n a.set(0);\n expect(div.innerHTML).toBe(\"c=3\");\n expect(a.evalCount).toBe(5);\n expect(b.evalCount).toBe(4); // evaluated now, as b changed since its last evaluation\n expect(c.evalCount).toBe(3); // evaluated now\n c.set(0);\n expect(div.innerHTML).toBe(\"fallback\");\n expect(a.evalCount).toBe(5);\n expect(b.evalCount).toBe(4);\n expect(c.evalCount).toBe(4);\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing non-keyed function handler Switch control flow with dangling callback\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [a, setA] = createSignal(0),\n [b] = createSignal(2);\n let callback: () => void;\n let delayed: number;\n const Component = () => (\n
\n \n {a => <>{a()}}\n \n {b => {\n setTimeout(() => {\n expect(() => (delayed = b())).toThrow();\n callback();\n }, 0);\n return <>{b()};\n }}\n \n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n return new Promise(c => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n setA(1);\n\n expect(div.innerHTML).toBe(\"1\");\n callback = () => {\n expect(delayed).toBeUndefined();\n c();\n };\n });\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Testing a For in a Switch control flow\", () => {\n let div!: HTMLDivElement, disposer: () => void;\n const [state, setState] = createStore({\n users: [\n { firstName: \"Jerry\", certified: false },\n { firstName: \"Janice\", certified: false }\n ]\n });\n const Component = () => (\n
\n \n \n {user => {user.firstName}}\n \n \n
\n );\n\n test(\"Create Switch control flow\", () => {\n createRoot(dispose => {\n disposer = dispose;\n ;\n });\n\n expect(div.innerHTML).toBe(\"fallback\");\n });\n\n test(\"Toggle Switch control flow\", () => {\n setState(\"users\", 1, \"certified\", true);\n expect(div.innerHTML).toBe(\"Janice\");\n setState(\"users\", 0, \"certified\", true);\n expect(div.innerHTML).toBe(\"Jerry\");\n setState(\"users\", u => [{ firstName: \"Gordy\", certified: true }, ...u]);\n expect(div.innerHTML).toBe(\"Gordy\");\n });\n\n test(\"dispose\", () => disposer());\n});\n\ndescribe(\"Test top level switch control flow\", () => {\n let div = document.createElement(\"div\"),\n disposer: () => void;\n const [count, setCount] = createSignal(0);\n const Component = () => (\n \n 1\n \n );\n\n test(\"Create switch control flow\", () => {\n disposer = render(Component, div);\n\n expect(div.innerHTML).toBe(\"fallback\");\n setCount(1);\n expect(div.innerHTML).toBe(\"1\");\n });\n\n test(\"dispose\", () => disposer());\n});\n" }, { "path": "packages/solid/web/tsconfig.build.json", "content": "{\n \"extends\": \"../../../tsconfig.json\",\n \"compilerOptions\": {\n \"outDir\": \"./types\",\n \"baseUrl\": \"src\",\n \"paths\": {\n \"solid-js\": [\"../..\"],\n \"solid-js/jsx-runtime\": [\"../../src/jsx\"],\n \"solid-js/jsx-dev-runtime\": [\"../../src/jsx\"],\n }\n },\n \"include\": [\"./src\"]\n}\n" }, { "path": "packages/solid/web/tsconfig.json", "content": "{\n \"extends\": \"./tsconfig.build.json\",\n \"include\": [\"./src\", \"./test\"]\n}\n" }, { "path": "packages/solid-element/CHANGELOG.md", "content": "# solid-element\n\n## 1.9.1\n\n### Patch Changes\n\n- 5a14ab8: fix #2337 empty attributes in solid-element\n- Updated dependencies [bb6ce8b]\n- Updated dependencies [9b70a15]\n - solid-js@1.9.3\n\n## 1.9.0\n\n### Minor Changes\n\n- 2a3a1980: update dom-expressions\n - Improved Custom Element/Shadow DOM traversal - @olivercoad\n - Better heuristic to determine when to importNode - @titoBouzout\n - handleEvent syntax to allow custom event properties when not delegated - @titoBouzout\n - support for bool: attribute namespace - @titoBouzout\n - add \"is\" as detection for custom element - @titoBouzout\n - fix missing exports in different envs - @trusktr\n - better hydration mismatch errors - @ryansolid\n - improved HTML validation of JSX partials - @titoBouzout\n\n### Patch Changes\n\n- Updated dependencies [4f8597dc]\n- Updated dependencies [120bf06d]\n- Updated dependencies [80b09589]\n- Updated dependencies [2a3a1980]\n- Updated dependencies [51bec61a]\n - solid-js@1.9.0\n\n## 1.8.1\n\n### Patch Changes\n\n- 6693b56f: update TS, custom elements, and a lot compiler fixes\n fixes #2144, #2145, #2178, #2192\n- Updated dependencies [6693b56f]\n- Updated dependencies [a8c2a8f3]\n - solid-js@1.8.18\n\n## 1.8.0\n\n### Patch Changes\n\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n - solid-js@1.8.0\n\n## 1.8.0-beta.1\n\n### Patch Changes\n\n- Updated dependencies [e3a97d28]\n- Updated dependencies [d797a143]\n - solid-js@1.8.0-beta.2\n\n## 1.8.0-beta.0\n\n### Patch Changes\n\n- Updated dependencies [d8e0e8e8]\n- Updated dependencies [bf09b838]\n - solid-js@1.8.0-beta.0\n\n## 1.7.1\n\n### Patch Changes\n\n- f99dd044: Solid-Element: Add clarification on 'props' parameter in customElement function\n- Updated dependencies [83c99d51]\n- Updated dependencies [f99dd044]\n- Updated dependencies [88493691]\n- Updated dependencies [514ef679]\n- Updated dependencies [20261537]\n- Updated dependencies [194f93c7]\n - solid-js@1.7.6\n\n## 1.7.0\n\n### Patch Changes\n\n- Updated dependencies [6b77d9ed]\n- Updated dependencies [503b6328]\n- Updated dependencies [41ca6522]\n- Updated dependencies [840933b8]\n- Updated dependencies [86c32279]\n- Updated dependencies [f7dc355f]\n- Updated dependencies [940e5745]\n- Updated dependencies [cb6a383d]\n- Updated dependencies [3de9432c]\n- Updated dependencies [608b3c3a]\n- Updated dependencies [2cb6f3d6]\n- Updated dependencies [24469762]\n- Updated dependencies [2b80f706]\n- Updated dependencies [8d0877e4]\n- Updated dependencies [5545d3ee]\n- Updated dependencies [0dc8e365]\n- Updated dependencies [4929530b]\n- Updated dependencies [71c40af6]\n- Updated dependencies [6a4fe46c]\n- Updated dependencies [5d671b89]\n- Updated dependencies [74f00e15]\n- Updated dependencies [23c157ac]\n - solid-js@1.7.0\n\n## 1.7.0-beta.2\n\n### Patch Changes\n\n- Updated dependencies [940e5745]\n - solid-js@1.7.0-beta.2\n\n## 1.7.0-beta.1\n\n### Patch Changes\n\n- Updated dependencies [6b77d9ed]\n- Updated dependencies [608b3c3a]\n- Updated dependencies [24469762]\n- Updated dependencies [2b80f706]\n- Updated dependencies [8d0877e4]\n- Updated dependencies [5545d3ee]\n- Updated dependencies [74f00e15]\n - solid-js@1.7.0-beta.1\n\n## 1.7.0-beta.0\n\n### Patch Changes\n\n- Updated dependencies [503b632]\n- Updated dependencies [86c3227]\n- Updated dependencies [f7dc355]\n- Updated dependencies [4929530]\n- Updated dependencies [71c40af]\n- Updated dependencies [e245736]\n- Updated dependencies [6a4fe46]\n - solid-js@1.7.0-beta.0\n\n## 1.6.4\n\n### Patch Changes\n\n- 676ed331: docs: fix typos\n- Updated dependencies [e2888c77]\n- Updated dependencies [676ed331]\n- Updated dependencies [b8a3ff13]\n- Updated dependencies [1aff80c6]\n- Updated dependencies [53db3f0f]\n- Updated dependencies [47d574a8]\n- Updated dependencies [e245736f]\n- Updated dependencies [61d1fe25]\n- Updated dependencies [4fdec4f9]\n - solid-js@1.6.12\n\n## 1.6.3\n\n### Patch Changes\n\n- e95e95f: Bug fixes and testing changelog\n- Updated dependencies [e95e95f]\n - solid-js@1.6.3\n" }, { "path": "packages/solid-element/README.md", "content": "# Solid Element\n[![Build Status](https://github.com/solidjs/solid/workflows/Solid%20CI/badge.svg)](https://github.com/solidjs/solid/actions/workflows/main-ci.yml)\n[![NPM Version](https://img.shields.io/npm/v/solid-element.svg?style=flat)](https://www.npmjs.com/package/solid-element)\n![](https://img.shields.io/librariesio/release/npm/solid-element)\n![](https://img.shields.io/npm/dm/solid-element.svg?style=flat)\n\nThis library extends [Solid](https://github.com/solidjs/solid) by adding Custom Web Components and extensions to manage modular behaviors and composition. It uses [Component Register](https://github.com/ryansolid/component-register) to create Web Components and its composed mixin pattern to construct modular re-usable behaviors. This allows your code to available as simple HTML elements for library interop and to leverage Shadow DOM style isolation. Solid already supports binding to Web Components so this fills the gap allowing full modular applications to be built out of nested Web Components. Component Register makes use of the V1 Standards and on top of being compatible with the common webcomponent.js polyfills, has a solution for Polyfilling Shadow DOM CSS using the ShadyCSS Parser from Polymer in a generic framework agnostic way (unlike the ShadyCSS package).\n\n## Example\n\n[See here](./sample.jsx) for an example of a webcomponent created by `solid-element`.\n\n## Installation\n\n```sh\nnpm i solid-element solid-js babel-preset-solid\n```\n\n## Custom Elements\n\nThe simplest way to create a Web Component is to use the `customElement` method.\n\nThe arguments of `customElement` are:\n1) custom element tag (e.g. `'my-component'`)\n2) (optional) Default prop values (e.g. `{someProp: 'one', otherProp: 'two'}`). Props without default values will be ignored by the customElement.\n3) the Solid template function. The arguments of this function are state wrapped props as the first argument, and the underlying element as the 2nd (e.g. `(props, { element }) => { solid code here\n }`)\n\n```jsx\nimport { customElement } from 'solid-element';\n\ncustomElement('my-component', {someProp: 'one', otherProp: 'two'}, (props, { element }) => {\n // ... Solid code\n})\n```\n\nProps get assigned as element properties and hyphenated attributes. This exposes the component that can be used in HTML/JSX as:\n```html\n\n```\n\nThis is all you need to get started with Solid Element.\n\nA shadow DOM is used by default for style isolation. If you want to disable the shadow DOM, you can do it with `noShadowDOM()` like this:\n\n```jsx\nimport { customElement, noShadowDOM } from 'solid-element';\n\ncustomElement('my-component', {someProp: 'one', otherProp: 'two'}, (props, { element }) => {\n noShadowDOM();\n // ... Solid code\n})\n```\n\n## Examples\n\n[Web Component Todos](https://wc-todo.firebaseapp.com/) Simple Todos Comparison\n\n## Hot Module Replacement (new)\n\nSolid Element exposes Component Register's Hot Module Replacement solution for Webpack and Parcel. It does not preserve state, swapping Components that are changed and their descendants. This approach is simple but predictable. It works by indicating the component to be Hot Replaced with the `hot` method in your file.\n\n```js\nimport { customElement, hot } from 'solid-element';\n\nhot(module, 'my-component');\n```\nThis is a new feature that is actively seeking feedback. Read more: [Component Register](https://github.com/ryansolid/component-register#hot-module-replacement-new)\n\nThere is also a webpack loader that handles adding this automatically. Check out [Component Register Loader](https://github.com/ryansolid/component-register-loader)\n\n## withSolid\n\nUnder the hood the customElement method is using Component Register's mixins to create our Custom Element. So this library also provides the way to do so directly if you wish to mixin your own functionality. It all starts by using the register HOC which upgrades your class or method to a WebComponent. It is always the start of the chain.\n\n```jsx\nimport { register } from 'component-register';\n\n/*\nregister(tag, defaultProps)\n*/\nregister('my-component', {someProp: 'one', otherProp: 'two'})((props, options) =>\n // ....\n)\n```\n\nComponent Register exposes a convenient compose method (a reduce right) that makes it easier compose multiple mixins. From there we can use withSolid mixin to basically produce the Component method above. However, now you are able to add more HOC mixins in the middle to add additional behavior in your components.\n\n```jsx\nimport { register, compose } from 'component-register';\nimport { withSolid } from 'solid-element';\n\n/*\nwithSolid\n*/\ncompose(\n register('my-component'),\n withSolid\n)((props, options) =>\n // ....\n)\n```\n" }, { "path": "packages/solid-element/package.json", "content": "{\n \"name\": \"solid-element\",\n \"description\": \"Webcomponents wrapper for Solid\",\n \"author\": \"Ryan Carniato\",\n \"license\": \"MIT\",\n \"version\": \"1.9.1\",\n \"homepage\": \"https://github.com/solidjs/solid/blob/main/packages/solid-element#readme\",\n \"type\": \"module\",\n \"main\": \"dist/index.js\",\n \"module\": \"dist/index.js\",\n \"types\": \"dist/index.d.ts\",\n \"files\": [\n \"dist\"\n ],\n \"sideEffects\": false,\n \"scripts\": {\n \"clean\": \"rimraf dist/\",\n \"build\": \"pnpm run clean && tsc\"\n },\n \"dependencies\": {\n \"component-register\": \"^0.8.7\"\n },\n \"peerDependencies\": {\n \"solid-js\": \"^1.9.11\"\n },\n \"devDependencies\": {\n \"solid-js\": \"workspace:*\"\n }\n}\n" }, { "path": "packages/solid-element/sample.jsx", "content": "import { createSignal } from \"solid-js\";\nimport { customElement } from \"solid-element\";\n\nconst style = `div * {\n font-size: 200%;\n }\n\n span {\n width: 4rem;\n display: inline-block;\n text-align: center;\n }\n\n button {\n width: 4rem;\n height: 4rem;\n border: none;\n border-radius: 10px;\n background-color: seagreen;\n color: white;\n }`;\n\ncustomElement(\"my-counter\", () => {\n const [count, setCount] = createSignal(0);\n return (\n
\n \n \n {count}\n \n
\n );\n});\n" }, { "path": "packages/solid-element/src/index.ts", "content": "import {\n register,\n ComponentType as mComponentType,\n ICustomElement,\n FunctionComponent,\n ComponentOptions,\n PropsDefinitionInput\n} from \"component-register\";\nexport { hot, getCurrentElement, noShadowDOM } from \"component-register\";\nexport type ComponentType = mComponentType;\nimport { createRoot, createSignal } from \"solid-js\";\nimport { insert } from \"solid-js/web\";\n\nfunction createProps(raw: T) {\n const keys = Object.keys(raw) as (keyof T)[];\n const props = {};\n for (let i = 0; i < keys.length; i++) {\n const [get, set] = createSignal(raw[keys[i]]);\n Object.defineProperty(props, keys[i], {\n get,\n set(v) {\n set(() => v);\n }\n });\n }\n return props as T;\n}\n\nfunction lookupContext(el: ICustomElement & { _$owner?: any }) {\n if (el.assignedSlot && el.assignedSlot._$owner) return el.assignedSlot._$owner;\n let next: Element & { _$owner?: any } = el.parentNode;\n while (\n next &&\n !next._$owner &&\n !(next.assignedSlot && (next.assignedSlot as Element & { _$owner?: any })._$owner)\n )\n next = next.parentNode as Element;\n return next && next.assignedSlot\n ? (next.assignedSlot as Element & { _$owner?: any })._$owner\n : el._$owner;\n}\n\nfunction withSolid(ComponentType: ComponentType): ComponentType {\n return (rawProps: T, options: ComponentOptions) => {\n const { element } = options as {\n element: ICustomElement & { _$owner?: any };\n };\n return createRoot((dispose: Function) => {\n const props = createProps(rawProps);\n\n element.addPropertyChangedCallback((key: string, val: any) => (props[key as keyof T] = val));\n element.addReleaseCallback(() => {\n element.renderRoot.textContent = \"\";\n dispose();\n });\n\n const comp = (ComponentType as FunctionComponent)(props as T, options);\n return insert(element.renderRoot, comp);\n }, lookupContext(element));\n };\n}\n\nfunction customElement(\n tag: string,\n ComponentType: ComponentType\n): CustomElementConstructor;\nfunction customElement(\n tag: string,\n props: PropsDefinitionInput,\n ComponentType: ComponentType\n): CustomElementConstructor;\nfunction customElement(\n tag: string,\n props: PropsDefinitionInput | ComponentType,\n ComponentType?: ComponentType\n): CustomElementConstructor {\n if (arguments.length === 2) {\n ComponentType = props as ComponentType;\n props = {} as PropsDefinitionInput;\n }\n return register(tag, props as PropsDefinitionInput)(withSolid(ComponentType!));\n}\n\nexport { withSolid, customElement };\n" }, { "path": "packages/solid-element/tsconfig.json", "content": "{\n \"extends\": \"../../tsconfig.json\",\n \"compilerOptions\": {\n \"outDir\": \"./dist\",\n \"emitDeclarationOnly\": false\n },\n \"include\": [\n \"./src\"\n ]\n}" }, { "path": "packages/solid-ssr/CHANGELOG.md", "content": "# solid-ssr\n\n## 1.7.2\n\n### Patch Changes\n\n- e660e5a3: add prettier code format in git-commit-hook\n\n## 1.7.1\n\n### Patch Changes\n\n- 91110701: fix element/test mismatch issues #1684, #1697, #1707\n fix solid-ssr types\n add missing JSX types #1690\n fix firefox iframe #1688\n\n## 1.7.0\n\n### Minor Changes\n\n- bee730cb: update solid ssr to type module\n\n## 1.7.0-beta.0\n\n### Minor Changes\n\n- bee730cb: update solid ssr to type module\n\n## 1.6.3\n\n### Patch Changes\n\n- e95e95f: Bug fixes and testing changelog\n" }, { "path": "packages/solid-ssr/README.md", "content": "# `solid-ssr`\n\nThis library provides tools to help with SSR. So far it's a simple Static Generator. But will add more tools in the future.\n\n## solid-ssr/static\n\nThis is a simple runner that renders files and writes them to disk. It exports a single export that can be used in either CJS or ESM.\n\n```js\nrenderStatic(\n PAGES.map(p => ({\n entry: pathToServer,\n output: path.join(pathToPublic, `${p}.html`),\n url: `/${p}`\n }))\n);\n```\n\nEach entry expects 3 values:\n* entry: path to the server entry point you will be using to render the page\n* output: path to the location of the html file you wish to write\n* url: the url that will be passed on the faux request object\n\nEntry files should be async functions that return the html string in the form:\n```js\nexport default async function(req) {\n return \"My Page\"\n}\n```\n\n## Examples\n\nLook at the examples to best understand how to use it. Important I make use of conditional export maps here in node. You need the latest version of Node 14 (or latest Node 12 but this example doesn't work in Node 12, sorry).\n\nThere are 4 examples all using the same shared source. It is an isomorphically routed tab navigation using Suspense, Lazy Components, and Data Fetching. They are just compiled differently and have slightly different server entry points.\n\n1. ssr\n\nUses standard synchronous SSR. Renders what it can synchronously on the server and hydrates top level in the client. Async data is fetched and rendered in the client without hydration.\n\n2. stream\n\nSimilar to `ssr` except using streams. Data is loaded on the server and sent along the stream so the client can render it. Again, only initial HTML is hydrated. Slightly speeds up data loading, so total page load time is reduced.\n\n3. async\n\nResolves everything reactively on server before sending HTML and serialized data to the client. Whole page is hydrated, but all loading states are avoided. Total load time is similar to streaming, but time to first paint is blocked by how long it takes to load data.\n\n4. ssg\nUsing async compiler configuration to statically generate pages. Removes the time it takes to render real time.\n\nExamples run on http://localhost:8080/. To run them (in this case ssr):\n```\nlerna run build:example:ssr --stream\nlerna run start:example:ssr --stream\n```\n\n|folder/example name|ssr|async|stream|ssg|\n|--- |--- |--- |--- |--- |\n|Parallels|[JAMStack](\"https://jamstack.org/what-is-jamstack/\")|Next/Nuxt/Sveltekit|[Marko streaming](https://tech.ebayinc.com/engineering/async-fragments-rediscovering-progressive-html-rendering-with-marko/)|Static site generators|\n|When is the data queried?|Client|Server, at request time|Server, at request time|Server, at build-time|\n|Render strategy|Elements outside the suspense boundary are rendered on the server and sent initially, then hydrated on the client. Everything that depends on data is in the bundle and rendered client-side|All necessary nodes are rendered on the server, then hydrated on the client. Data is serialized, sent along with the page, and reused on the client as necessary.|The page is rendered with placeholders for elements that depend on data. These are replaced with the correct nodes as more of the stream loads.|Same as async, but the rendering is done ahead of time|\n|Loading indicators / suspense fallbacks|Top-level suspense fallback (the _Loading…_ span) is sent as part of the HTML. The _Loading Info…_ span is part of the Profile component, in the bundle.|None. The suspense fallback never gets shown because the suspense is resolved in the server.|Both loading indicators are included in the HTML, along with the scripts that replace them. On a slow connection, the HTML gets to the browser at the same time, and you don’t see any loading indicators.|Same as async|\n|Server-side render function used|renderToString|renderToStringAsync|renderToStream (1.3)|renderToStringAsync|\n" }, { "path": "packages/solid-ssr/examples/.gitignore", "content": "**/public/\n**/lib/" }, { "path": "packages/solid-ssr/examples/async/index.js", "content": "import express from \"express\";\nimport url from \"url\";\n\nimport { renderToStringAsync } from \"solid-js/web\";\nimport App from \"../shared/src/components/App\";\n\nconst app = express();\nconst port = 3000;\n\napp.use(express.static(url.fileURLToPath(new URL(\"../public\", import.meta.url))));\n\napp.get(\"*\", async (req, res) => {\n let result;\n try {\n result = await renderToStringAsync(() => );\n } catch (err) {\n console.error(err);\n } finally {\n res.send(result);\n }\n});\n\napp.listen(port, () => console.log(`Example app listening on port ${port}!`));\n" }, { "path": "packages/solid-ssr/examples/async/rollup.config.js", "content": "import nodeResolve from \"@rollup/plugin-node-resolve\";\nimport common from \"@rollup/plugin-commonjs\";\nimport babel from \"@rollup/plugin-babel\";\nimport copy from \"rollup-plugin-copy\";\n\nexport default [\n {\n input: \"examples/async/index.js\",\n output: [\n {\n dir: \"examples/async/lib\",\n format: \"esm\"\n }\n ],\n preserveEntrySignatures: false,\n external: [\"solid-js\", \"solid-js/web\", \"path\", \"express\"],\n plugins: [\n nodeResolve({ preferBuiltins: true, exportConditions: [\"solid\", \"node\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"ssr\", hydratable: true }]]\n }),\n common()\n ]\n },\n {\n input: \"examples/shared/src/index.js\",\n output: [\n {\n dir: \"examples/async/public/js\",\n format: \"esm\"\n }\n ],\n preserveEntrySignatures: false,\n plugins: [\n nodeResolve({ exportConditions: [\"solid\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"dom\", hydratable: true }]]\n }),\n common(),\n copy({\n targets: [\n {\n src: [\"examples/shared/static/*\"],\n dest: \"examples/async/public\"\n }\n ]\n })\n ]\n }\n];\n" }, { "path": "packages/solid-ssr/examples/shared/src/components/App.js", "content": "import { useContext, lazy, ErrorBoundary } from \"solid-js\";\nimport { HydrationScript } from \"solid-js/web\";\nimport { Link, RouteHOC, RouterContext } from \"../router\";\n// import stub as main package to allowing fetch as you load\nimport Profile from \"./Profile\";\n\nconst Home = lazy(() => import(\"./Home\"));\nconst Settings = lazy(() => import(\"./Settings\"));\n\nconst App = RouteHOC(() => {\n const [, pending, { matches }] = useContext(RouterContext);\n return (\n \n \n 🔥 Solid SSR 🔥\n \n \n \n \n \n \n
\n
    \n
  • \n Home\n
    • \n
  • \n Profile\n
    • \n
  • \n Settings\n
    • \n
\n
\n {\n return (\n <>\n

Error: {err.message}

\n \n \n );\n }}\n >\n \n Loading...\n \n }\n >\n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n
\n \n \n \n );\n});\n\nexport default App;\n" }, { "path": "packages/solid-ssr/examples/shared/src/components/Home.js", "content": "import { createSignal, onCleanup, onMount } from \"solid-js\";\nconst Home = () => {\n const [s, set] = createSignal(0);\n onMount(() => {\n const t = setInterval(() => set(s() + 1), 100);\n onCleanup(() => clearInterval(t));\n });\n return (\n <>\n

Welcome to this Simple Routing Example

\n

Click the links in the Navigation above to load different routes.

\n {s()}\n \n );\n};\n\nexport default Home;\n" }, { "path": "packages/solid-ssr/examples/shared/src/components/Profile/Profile.js", "content": "const Profile = props => (\n <>\n

{props.user?.firstName}'s Profile

\n

This section could be about you.

\n Loading Info...}>\n
    \n {fact =>
  • {fact}
    • }    \n
\n \n \n);\n\nexport default Profile;\n" }, { "path": "packages/solid-ssr/examples/shared/src/components/Profile/index.js", "content": "import { createResource, lazy } from \"solid-js\";\nconst Profile = lazy(() => import(\"./Profile\"));\n\n// this component lazy loads data and code in parallel\nexport default () => {\n const [user] = createResource(() => {\n // simulate data loading\n console.log(\"LOAD USER\");\n return new Promise(res => {\n setTimeout(() => res({ firstName: \"Jon\", lastName: \"Snow\" }), 400);\n });\n }),\n [info] = createResource(\n user,\n () => {\n // simulate cascading data loading\n console.log(\"LOAD INFO\");\n return new Promise(res => {\n setTimeout(\n () =>\n res([\"Something Interesting\", \"Something else you might care about\", \"Or maybe not\"]),\n 400\n );\n });\n },\n { initialValue: [] }\n );\n\n return ;\n};\n" }, { "path": "packages/solid-ssr/examples/shared/src/components/Settings.js", "content": "import { createUniqueId, createSignal } from \"solid-js\";\n\nconst Settings = () => {\n const [text, setText] = createSignal(\"Hi\");\n const id = createUniqueId();\n return (\n <>\n

Settings

\n

All that configuration you never really ever want to look at.

\n \n setText(e.currentTarget.value)} />\n

{text()}

\n \n );\n};\n\nexport default Settings;\n" }, { "path": "packages/solid-ssr/examples/shared/src/index.js", "content": "import { hydrate } from \"solid-js/web\";\nimport App from \"./components/App\";\n\n// entry point for browser\nhydrate(() => , document);\n" }, { "path": "packages/solid-ssr/examples/shared/src/router.js", "content": "import { createSignal, createContext, useContext, useTransition } from \"solid-js\";\nimport { isServer } from \"solid-js/web\";\n\n// Super simplistic pushstate router that matches on absolute paths\nconst RouterContext = createContext();\nfunction RouteHOC(Comp) {\n return (props = {}) => {\n const [location, setLocation] = createSignal(\n (props.url ? props.url : window.location.pathname).slice(1) || \"index\"\n ),\n matches = match => match === (location() || \"index\"),\n [pending, start] = useTransition();\n !isServer && (window.onpopstate = () => setLocation(window.location.pathname.slice(1)));\n\n return (\n start(() => setLocation(v)), matches }]}\n >\n \n \n );\n };\n}\n\nconst Link = props => {\n const [, , { setLocation }] = useContext(RouterContext);\n const navigate = e => {\n if (e) e.preventDefault();\n window.history.pushState(\"\", \"\", `/${props.path}`);\n setLocation(props.path);\n };\n return (\n \n {props.children}\n \n );\n};\n\nexport { RouteHOC, RouterContext, Link };\n" }, { "path": "packages/solid-ssr/examples/shared/static/styles.css", "content": "body {\r\n background-color: #eee;\r\n}\r\n#app {\r\n border-radius: 3px;\r\n border: 1px solid #e5e5e5;\r\n margin: 15px;\r\n background-color: white;\r\n}\r\n.tab {\r\n width: 100%;\r\n padding: 25px;\r\n font-family: sans-serif;\r\n color: #444;\r\n}\r\n.tab.pending {\r\n transition: opacity 0.2s;\r\n transition-delay: 0.1s;\r\n transition-timing-function: ease-in;\r\n opacity: 0.6;\r\n}\r\nul.inline {\r\n list-style: none;\r\n padding: 0;\r\n margin-bottom: 0;\r\n -webkit-margin-before: 0;\r\n -webkit-margin-after: 0;\r\n -webkit-margin-start: 0px;\r\n -webkit-margin-end: 0px;\r\n -webkit-padding-start: 0px;\r\n}\r\nul.inline li {\r\n display: inline-block;\r\n margin-left: 0;\r\n border-bottom: 2px solid #eee;\r\n transition: all 0.5s;\r\n font-family: sans-serif;\r\n font-weight: 300;\r\n cursor: pointer;\r\n color: #aaa;\r\n}\r\nul.inline li.selected {\r\n border-bottom: 2px solid #337ab7;\r\n color: #444;\r\n}\r\nul.inline a {\r\n display: block;\r\n padding: 10px;\r\n}\r\na.link {\r\n text-decoration: none;\r\n color: black;\r\n}\r\n.loader {\r\n opacity: 0;\r\n color: #aaa;\r\n font-size: 16px;\r\n font-weight: 600;\r\n animation: fadeInAnimation ease .3s;\r\n animation-delay: .2s;\r\n animation-iteration-count: 1;\r\n animation-fill-mode: forwards;\r\n}\r\n\r\n@keyframes fadeInAnimation {\r\n 0% {\r\n opacity: 0;\r\n }\r\n 100% {\r\n opacity: 1;\r\n }\r\n}\r\n" }, { "path": "packages/solid-ssr/examples/ssg/export.js", "content": "import path from \"path\";\nimport url from \"url\";\nimport renderStatic from \"../../static/index.js\";\n\nconst PAGES = [\"index\", \"profile\", \"settings\"];\nconst __dirname = url.fileURLToPath(new URL(\".\", import.meta.url));\nconst pathToServer = path.resolve(__dirname, \"lib/index.js\");\nconst pathToPublic = path.resolve(__dirname, \"public\");\n\nrenderStatic(\n PAGES.map(p => ({\n entry: pathToServer,\n output: path.join(pathToPublic, `${p}.html`),\n url: `/${p}`\n }))\n);\n" }, { "path": "packages/solid-ssr/examples/ssg/index.js", "content": "import { renderToStringAsync } from \"solid-js/web\";\nimport App from \"../shared/src/components/App\";\n\n// entry point for server render\nexport default async req => {\n return await renderToStringAsync(() => );\n};\n" }, { "path": "packages/solid-ssr/examples/ssg/rollup.config.js", "content": "import nodeResolve from \"@rollup/plugin-node-resolve\";\nimport common from \"@rollup/plugin-commonjs\";\nimport babel from \"@rollup/plugin-babel\";\nimport copy from \"rollup-plugin-copy\";\n\nexport default [\n {\n input: \"examples/ssg/index.js\",\n output: [\n {\n dir: \"examples/ssg/lib\",\n format: \"esm\"\n }\n ],\n external: [\"solid-js\", \"solid-js/web\"],\n plugins: [\n nodeResolve({ preferBuiltins: true, exportConditions: [\"solid\", \"node\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"ssr\", hydratable: true }]]\n }),\n common()\n ]\n },\n {\n input: \"examples/shared/src/index.js\",\n output: [\n {\n dir: \"examples/ssg/public/js\",\n format: \"esm\"\n }\n ],\n preserveEntrySignatures: false,\n plugins: [\n nodeResolve({ exportConditions: [\"solid\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"dom\", hydratable: true }]]\n }),\n common(),\n copy({\n targets: [\n {\n src: [\"examples/shared/static/*\"],\n dest: \"examples/ssg/public\"\n }\n ]\n })\n ]\n }\n];\n" }, { "path": "packages/solid-ssr/examples/ssr/index.js", "content": "import express from \"express\";\nimport url from \"url\";\n\nimport { renderToString } from \"solid-js/web\";\nimport App from \"../shared/src/components/App\";\n\nconst app = express();\nconst port = 3000;\n\napp.use(express.static(url.fileURLToPath(new URL(\"../public\", import.meta.url))));\n\napp.get(\"*\", (req, res) => {\n let html;\n try {\n html = renderToString(() => );\n } catch (err) {\n console.error(err);\n } finally {\n res.send(html);\n }\n});\n\napp.listen(port, () => console.log(`Example app listening on port ${port}!`));\n" }, { "path": "packages/solid-ssr/examples/ssr/rollup.config.js", "content": "import nodeResolve from \"@rollup/plugin-node-resolve\";\nimport common from \"@rollup/plugin-commonjs\";\nimport babel from \"@rollup/plugin-babel\";\nimport copy from \"rollup-plugin-copy\";\n\nexport default [\n {\n input: \"examples/ssr/index.js\",\n output: [\n {\n dir: \"examples/ssr/lib\",\n format: \"esm\"\n }\n ],\n external: [\"solid-js\", \"solid-js/web\", \"path\", \"express\", \"stream\"],\n plugins: [\n nodeResolve({ preferBuiltins: true, exportConditions: [\"solid\", \"node\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"ssr\", hydratable: true }]]\n }),\n common()\n ],\n preserveEntrySignatures: false\n },\n {\n input: \"examples/shared/src/index.js\",\n output: [\n {\n dir: \"examples/ssr/public/js\",\n format: \"esm\"\n }\n ],\n preserveEntrySignatures: false,\n plugins: [\n nodeResolve({ exportConditions: [\"solid\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"dom\", hydratable: true }]]\n }),\n common(),\n copy({\n targets: [\n {\n src: [\"examples/shared/static/*\"],\n dest: \"examples/ssr/public\"\n }\n ]\n })\n ]\n }\n];\n" }, { "path": "packages/solid-ssr/examples/stream/index.js", "content": "import express from \"express\";\nimport url from \"url\";\n\nimport { renderToStream } from \"solid-js/web\";\nimport App from \"../shared/src/components/App\";\n\nconst app = express();\nconst port = 3000;\n\napp.use(express.static(url.fileURLToPath(new URL(\"../public\", import.meta.url))));\n\napp.get(\"*\", (req, res) => renderToStream(() => ).pipe(res));\n\napp.listen(port, () => console.log(`Example app listening on port ${port}!`));\n" }, { "path": "packages/solid-ssr/examples/stream/rollup.config.js", "content": "import nodeResolve from \"@rollup/plugin-node-resolve\";\nimport common from \"@rollup/plugin-commonjs\";\nimport babel from \"@rollup/plugin-babel\";\nimport copy from \"rollup-plugin-copy\";\n\nexport default [\n {\n input: \"examples/stream/index.js\",\n preserveEntrySignatures: false,\n output: [\n {\n dir: \"examples/stream/lib\",\n format: \"esm\"\n }\n ],\n external: [\"solid-js\", \"solid-js/web\", \"path\", \"express\", \"stream\"],\n plugins: [\n nodeResolve({ preferBuiltins: true, exportConditions: [\"solid\", \"node\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"ssr\", hydratable: true }]]\n }),\n common()\n ]\n },\n {\n input: \"examples/shared/src/index.js\",\n output: [\n {\n dir: \"examples/stream/public/js\",\n format: \"esm\"\n }\n ],\n preserveEntrySignatures: false,\n plugins: [\n nodeResolve({ exportConditions: [\"solid\"] }),\n babel({\n babelHelpers: \"bundled\",\n presets: [[\"solid\", { generate: \"dom\", hydratable: true }]]\n }),\n common(),\n copy({\n targets: [\n {\n src: [\"examples/shared/static/*\"],\n dest: \"examples/stream/public\"\n }\n ]\n })\n ]\n }\n];\n" }, { "path": "packages/solid-ssr/package.json", "content": "{\n \"name\": \"solid-ssr\",\n \"description\": \"Utilities to help with SSR\",\n \"version\": \"1.7.2\",\n \"author\": \"Ryan Carniato\",\n \"license\": \"MIT\",\n \"type\": \"module\",\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/solidjs/solid/blob/main/packages/solid-ssr\"\n },\n \"exports\": {\n \"./static\": {\n \"require\": \"./static/index.cjs\",\n \"import\": \"./static/index.js\"\n }\n },\n \"files\": [\n \"static\"\n ],\n \"scripts\": {\n \"build:example:async\": \"rollup -c examples/async/rollup.config.js\",\n \"start:example:async\": \"node examples/async/lib/index.js\",\n \"build:example:ssg\": \"rollup -c examples/ssg/rollup.config.js && node --trace-warnings examples/ssg/export.js\",\n \"start:example:ssg\": \"npx serve examples/ssg/public -l 8080\",\n \"build:example:ssr\": \"rollup -c examples/ssr/rollup.config.js\",\n \"start:example:ssr\": \"node examples/ssr/lib/index.js\",\n \"build:example:stream\": \"rollup -c examples/stream/rollup.config.js\",\n \"start:example:stream\": \"node examples/stream/lib/index.js\",\n \"clean\": \"rimraf examples/**/lib/ examples/**/public/\"\n },\n \"devDependencies\": {\n \"@babel/core\": \"^7.21.3\",\n \"@rollup/plugin-babel\": \"6.0.3\",\n \"@rollup/plugin-commonjs\": \"24.0.1\",\n \"@rollup/plugin-node-resolve\": \"15.0.1\",\n \"babel-preset-solid\": \"workspace:*\",\n \"express\": \"^4.20.0\",\n \"rollup\": \"^3.20.0\",\n \"rollup-plugin-copy\": \"^3.4.0\",\n \"solid-js\": \"workspace:*\"\n }\n}\n" }, { "path": "packages/solid-ssr/static/index.cjs", "content": "const path = require(\"path\");\nconst execFile = require(\"util\").promisify(require(\"child_process\").execFile);\n\nconst pathToRunner = path.resolve(__dirname, \"writeToDisk.cjs\");\n\nasync function run({ entry, output, url }) {\n const { stdout, stderr } = await execFile(\"node\", [pathToRunner, entry, output, url, \"--trace-warnings\"]);\n if (stdout.length) console.log(stdout);\n if (stderr.length) console.log(stderr);\n}\n\nmodule.exports = async function renderStatic(config) {\n if (Array.isArray(config)) {\n await Promise.all(config.map(run));\n } else await run(config);\n};\n" }, { "path": "packages/solid-ssr/static/index.d.ts", "content": "export type StaticConfig = { entry: string; output: string; url: string };\nexport default function renderStatic(config: StaticConfig | StaticConfig[]): Promise;\n" }, { "path": "packages/solid-ssr/static/index.js", "content": "import { resolve } from \"path\";\nimport { fileURLToPath } from \"url\";\nimport { execFile } from \"child_process\";\nimport { promisify } from \"util\";\n\nconst exec = promisify(execFile);\nconst __dirname = fileURLToPath(new URL(\".\", import.meta.url));\nconst pathToRunner = resolve(__dirname, \"writeToDisk.js\");\n\nasync function run({ entry, output, url }) {\n const { stdout, stderr } = await exec(\"node\", [\n pathToRunner,\n entry,\n output,\n url,\n \"--trace-warnings\"\n ]);\n if (stdout.length) console.log(stdout);\n if (stderr.length) console.log(stderr);\n}\n\nexport default async function renderStatic(config) {\n if (Array.isArray(config)) {\n await Promise.all(config.map(run));\n } else await run(config);\n}\n" }, { "path": "packages/solid-ssr/static/writeToDisk.cjs", "content": "const fs = require(\"fs\");\nconst path = require(\"path\");\nconst server = require(process.argv[2]);\n\nasync function write() {\n const res = await server({ url: process.argv[4] });\n fs.mkdir(path.dirname(process.argv[3]), {recursive: true}, () =>\n fs.writeFile(process.argv[3], res, () => process.exit(0))\n );\n}\nwrite();\n" }, { "path": "packages/solid-ssr/static/writeToDisk.js", "content": "import { dirname, join } from \"path\";\nimport { writeFile, mkdir } from \"fs\";\n\nasync function write() {\n const server = (await import(join(\"file://\", process.argv[2]))).default;\n const res = await server({ url: process.argv[4] });\n mkdir(dirname(process.argv[3]), { recursive: true }, () =>\n writeFile(process.argv[3], res, () => process.exit(0))\n );\n}\nwrite();\n" }, { "path": "packages/test-integration/CHANGELOG.md", "content": "# test-integration\n\n## 1.9.11\n\n### Patch Changes\n\n- Updated dependencies [6628d9f]\n - solid-js@1.9.11\n\n## 1.9.10\n\n### Patch Changes\n\n- Updated dependencies [2270ae9]\n- Updated dependencies [94d87f1]\n- Updated dependencies [3114302]\n- Updated dependencies [6c92555]\n - solid-js@1.9.10\n - babel-preset-solid@1.9.10\n\n## 1.9.9\n\n### Patch Changes\n\n- Updated dependencies [f59ee48]\n- Updated dependencies [62c5a98]\n- Updated dependencies [62c5a98]\n- Updated dependencies [c07887c]\n - solid-js@1.9.9\n - babel-preset-solid@1.9.9\n\n## 1.9.8\n\n### Patch Changes\n\n- Updated dependencies [09a9c1d]\n- Updated dependencies [472c007]\n- Updated dependencies [3d3207d]\n- Updated dependencies [2cd810f]\n- Updated dependencies [cbff564]\n- Updated dependencies [e056eab]\n- Updated dependencies [bdba4dc]\n - solid-js@1.9.8\n - babel-preset-solid@1.9.8\n\n## 1.9.7\n\n### Patch Changes\n\n- Updated dependencies [4cd7eb1]\n - solid-js@1.9.7\n\n## 1.9.6\n\n### Patch Changes\n\n- Updated dependencies [362e99f]\n- Updated dependencies [8356213]\n- Updated dependencies [c65faec]\n- Updated dependencies [6380b01]\n - solid-js@1.9.6\n - babel-preset-solid@1.9.6\n\n## 1.9.5\n\n### Patch Changes\n\n- Updated dependencies [86ae8a9]\n- Updated dependencies [89e016d]\n- Updated dependencies [9431b88]\n- Updated dependencies [35266c1]\n- Updated dependencies [0eab77d]\n- Updated dependencies [fff8aed]\n- Updated dependencies [f9ef621]\n - solid-js@1.9.5\n - babel-preset-solid@1.9.5\n\n## 1.9.4\n\n### Patch Changes\n\n- Updated dependencies [b93956f]\n- Updated dependencies [199dd69]\n- Updated dependencies [7f9cd3d]\n- Updated dependencies [32aa744]\n - solid-js@1.9.4\n\n## 1.9.3\n\n### Patch Changes\n\n- Updated dependencies [bb6ce8b]\n- Updated dependencies [9b70a15]\n - solid-js@1.9.3\n - babel-preset-solid@1.9.3\n\n## 1.9.2\n\n### Patch Changes\n\n- Updated dependencies [22aff14]\n- Updated dependencies [e2e2a03]\n - babel-preset-solid@1.9.2\n - solid-js@1.9.2\n\n## 1.9.1\n\n### Patch Changes\n\n- Updated dependencies [fb67b687]\n- Updated dependencies [7ecf92d3]\n - solid-js@1.9.1\n\n## 1.9.0\n\n### Minor Changes\n\n- 2a3a1980: update dom-expressions\n - Improved Custom Element/Shadow DOM traversal - @olivercoad\n - Better heuristic to determine when to importNode - @titoBouzout\n - handleEvent syntax to allow custom event properties when not delegated - @titoBouzout\n - support for bool: attribute namespace - @titoBouzout\n - add \"is\" as detection for custom element - @titoBouzout\n - fix missing exports in different envs - @trusktr\n - better hydration mismatch errors - @ryansolid\n - improved HTML validation of JSX partials - @titoBouzout\n\n### Patch Changes\n\n- Updated dependencies [4f8597dc]\n- Updated dependencies [120bf06d]\n- Updated dependencies [80b09589]\n- Updated dependencies [2a3a1980]\n- Updated dependencies [51bec61a]\n - solid-js@1.9.0\n - babel-preset-solid@1.9.0\n\n## 1.8.23\n\n### Patch Changes\n\n- Updated dependencies [bc20a4ce]\n- Updated dependencies [9697c94b]\n- Updated dependencies [9e192d7e]\n- Updated dependencies [379293d9]\n- Updated dependencies [73c00927]\n- Updated dependencies [e4b2c668]\n- Updated dependencies [94929afa]\n - solid-js@1.8.23\n\n## 1.8.22\n\n### Patch Changes\n\n- Updated dependencies [f8ae663c]\n- Updated dependencies [19d0295f]\n- Updated dependencies [26128ec0]\n - solid-js@1.8.22\n - babel-preset-solid@1.8.22\n\n## 1.8.21\n\n### Patch Changes\n\n- Updated dependencies [a036a63a]\n - solid-js@1.8.21\n\n## 1.8.20\n\n### Patch Changes\n\n- Updated dependencies [c8fe58e9]\n- Updated dependencies [80dd2769]\n - solid-js@1.8.20\n\n## 1.8.19\n\n### Patch Changes\n\n- Updated dependencies [3fc015c2]\n- Updated dependencies [f909c1c1]\n- Updated dependencies [816a5c61]\n- Updated dependencies [424a31a3]\n - solid-js@1.8.19\n - babel-preset-solid@1.8.19\n\n## 1.8.18\n\n### Patch Changes\n\n- Updated dependencies [6693b56f]\n- Updated dependencies [a8c2a8f3]\n - babel-preset-solid@1.8.18\n - solid-js@1.8.18\n\n## 1.8.17\n\n### Patch Changes\n\n- Updated dependencies [72c5381d]\n- Updated dependencies [e065e475]\n - babel-preset-solid@1.8.17\n - solid-js@1.8.17\n\n## 1.8.16\n\n### Patch Changes\n\n- Updated dependencies [8de75a47]\n- Updated dependencies [071cd42f]\n- Updated dependencies [3212f74d]\n - solid-js@1.8.16\n - babel-preset-solid@1.8.16\n\n## 1.8.15\n\n### Patch Changes\n\n- Updated dependencies [829af663]\n- Updated dependencies [4ee461dc]\n - solid-js@1.8.15\n - babel-preset-solid@1.8.15\n\n## 1.8.14\n\n### Patch Changes\n\n- Updated dependencies [4b76be80]\n - solid-js@1.8.14\n\n## 1.8.13\n\n### Patch Changes\n\n- Updated dependencies [3ac8210c]\n - solid-js@1.8.13\n\n## 1.8.12\n\n### Patch Changes\n\n- Updated dependencies [aba5de08]\n- Updated dependencies [85b26c36]\n - solid-js@1.8.12\n - babel-preset-solid@1.8.12\n\n## 1.8.11\n\n### Patch Changes\n\n- Updated dependencies [1ec67f15]\n - solid-js@1.8.11\n\n## 1.8.10\n\n### Patch Changes\n\n- Updated dependencies [169d23b4]\n - solid-js@1.8.10\n\n## 1.8.9\n\n### Patch Changes\n\n- Updated dependencies [80d4830f]\n- Updated dependencies [918586fb]\n- Updated dependencies [71bea784]\n- Updated dependencies [b0862d39]\n- Updated dependencies [cbc8d3ee]\n - babel-preset-solid@1.8.9\n - solid-js@1.8.9\n\n## 1.8.8\n\n### Patch Changes\n\n- Updated dependencies [40b5d78d]\n- Updated dependencies [968e2cc9]\n- Updated dependencies [292aba41]\n- Updated dependencies [7e5667ab]\n- Updated dependencies [8d2de12f]\n- Updated dependencies [b887587a]\n - solid-js@1.8.8\n - babel-preset-solid@1.8.8\n\n## 1.8.7\n\n### Patch Changes\n\n- Updated dependencies [22667bbc]\n- Updated dependencies [e09a3cc3]\n - solid-js@1.8.7\n\n## 1.8.6\n\n### Patch Changes\n\n- Updated dependencies [2b320376]\n- Updated dependencies [fb7f4bc1]\n- Updated dependencies [b092368c]\n- Updated dependencies [54e1aecf]\n - solid-js@1.8.6\n - babel-preset-solid@1.8.6\n\n## 1.8.5\n\n### Patch Changes\n\n- Updated dependencies [80ca972f]\n - solid-js@1.8.5\n\n## 1.8.4\n\n### Patch Changes\n\n- Updated dependencies [cf0542a4]\n- Updated dependencies [3f3a3396]\n - babel-preset-solid@1.8.4\n - solid-js@1.8.4\n\n## 1.8.3\n\n### Patch Changes\n\n- Updated dependencies [1f0226e1]\n - solid-js@1.8.3\n\n## 1.8.2\n\n### Patch Changes\n\n- Updated dependencies [b632dfd5]\n- Updated dependencies [dd492c5e]\n- Updated dependencies [4968fe26]\n - solid-js@1.8.2\n - babel-preset-solid@1.8.2\n\n## 1.8.1\n\n### Patch Changes\n\n- Updated dependencies [0b9b71aa]\n - solid-js@1.8.1\n\n## 1.8.0\n\n### Patch Changes\n\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n- Updated dependencies [2c087cbb]\n - babel-preset-solid@1.8.0\n - solid-js@1.8.0\n\n## 1.8.0-beta.2\n\n### Patch Changes\n\n- Updated dependencies [e3a97d28]\n- Updated dependencies [d797a143]\n - babel-preset-solid@1.8.0-beta.2\n - solid-js@1.8.0-beta.2\n\n## 1.8.0-beta.1\n\n### Patch Changes\n\n- Updated dependencies [f6d511db]\n- Updated dependencies [af625dd3]\n - babel-preset-solid@1.8.0-beta.1\n - solid-js@1.8.0-beta.1\n\n## 1.8.0-beta.0\n\n### Patch Changes\n\n- Updated dependencies [d8e0e8e8]\n- Updated dependencies [bf09b838]\n - babel-preset-solid@1.8.0-beta.0\n - solid-js@1.8.0-beta.0\n\n## 1.7.12\n\n### Patch Changes\n\n- Updated dependencies [12eb1552]\n- Updated dependencies [13b1fa6e]\n- Updated dependencies [10ac07af]\n- Updated dependencies [8b49110b]\n - solid-js@1.7.12\n - babel-preset-solid@1.7.12\n\n## 1.7.11\n\n### Patch Changes\n\n- Updated dependencies [26740b88]\n - solid-js@1.7.11\n\n## 1.7.10\n\n### Patch Changes\n\n- Updated dependencies [5ed448ae]\n- Updated dependencies [7dd1f413]\n- Updated dependencies [c2008f02]\n- Updated dependencies [792e7dea]\n - solid-js@1.7.10\n\n## 1.7.9\n\n### Patch Changes\n\n- Updated dependencies [44a2bf0b]\n- Updated dependencies [6cd10c73]\n- Updated dependencies [6c9879c9]\n- Updated dependencies [039cf60d]\n- Updated dependencies [852f4c76]\n - solid-js@1.7.9\n\n## 1.7.8\n\n### Patch Changes\n\n- Updated dependencies [efd23186]\n- Updated dependencies [51074fab]\n- Updated dependencies [fe6f03f9]\n - solid-js@1.7.8\n\n## 1.7.7\n\n### Patch Changes\n\n- Updated dependencies [c4cbfd3c]\n- Updated dependencies [0100bd12]\n- Updated dependencies [46e5e787]\n- Updated dependencies [8ba0e80a]\n- Updated dependencies [e660e5a3]\n- Updated dependencies [93d44d45]\n - solid-js@1.7.7\n - babel-preset-solid@1.7.7\n\n## 1.7.6\n\n### Patch Changes\n\n- Updated dependencies [83c99d51]\n- Updated dependencies [f99dd044]\n- Updated dependencies [88493691]\n- Updated dependencies [514ef679]\n- Updated dependencies [20261537]\n- Updated dependencies [194f93c7]\n - solid-js@1.7.6\n\n## 1.7.5\n\n### Patch Changes\n\n- Updated dependencies [5288cfa8]\n- Updated dependencies [8852c199]\n - solid-js@1.7.5\n\n## 1.7.4\n\n### Patch Changes\n\n- Updated dependencies [1b5ea076]\n- Updated dependencies [91110701]\n - solid-js@1.7.4\n - babel-preset-solid@1.7.4\n\n## 1.7.3\n\n### Patch Changes\n\n- Updated dependencies [655f0b7e]\n- Updated dependencies [8ce2c47b]\n - babel-preset-solid@1.7.3\n - solid-js@1.7.3\n\n## 1.7.2\n\n### Patch Changes\n\n- Updated dependencies [27994dc9]\n- Updated dependencies [699d88eb]\n- Updated dependencies [dfec6883]\n - solid-js@1.7.2\n - babel-preset-solid@1.7.2\n\n## 1.7.1\n\n### Patch Changes\n\n- Updated dependencies [ba024813]\n- Updated dependencies [d4087fe7]\n - solid-js@1.7.1\n - babel-preset-solid@1.7.1\n\n## 1.7.0\n\n### Patch Changes\n\n- Updated dependencies [6b77d9ed]\n- Updated dependencies [503b6328]\n- Updated dependencies [41ca6522]\n- Updated dependencies [840933b8]\n- Updated dependencies [86c32279]\n- Updated dependencies [f7dc355f]\n- Updated dependencies [940e5745]\n- Updated dependencies [cb6a383d]\n- Updated dependencies [3de9432c]\n- Updated dependencies [608b3c3a]\n- Updated dependencies [a382c0c5]\n- Updated dependencies [2cb6f3d6]\n- Updated dependencies [24469762]\n- Updated dependencies [2b80f706]\n- Updated dependencies [8d0877e4]\n- Updated dependencies [5545d3ee]\n- Updated dependencies [0dc8e365]\n- Updated dependencies [4929530b]\n- Updated dependencies [71c40af6]\n- Updated dependencies [6a4fe46c]\n- Updated dependencies [5d671b89]\n- Updated dependencies [74f00e15]\n- Updated dependencies [23c157ac]\n - solid-js@1.7.0\n - babel-preset-solid@1.7.0\n\n## 1.7.0-beta.5\n\n### Patch Changes\n\n- Updated dependencies [a382c0c5]\n- Updated dependencies [0dc8e365]\n - babel-preset-solid@1.7.0-beta.5\n - solid-js@1.7.0-beta.5\n\n## 1.7.0-beta.4\n\n### Patch Changes\n\n- Updated dependencies [cb6a383d]\n- Updated dependencies [3de9432c]\n- Updated dependencies [2cb6f3d6]\n- Updated dependencies [23c157ac]\n - solid-js@1.7.0-beta.4\n - babel-preset-solid@1.7.0-beta.4\n\n## 1.7.0-beta.3\n\n### Patch Changes\n\n- Updated dependencies [41ca6522]\n - babel-preset-solid@1.7.0-beta.3\n - solid-js@1.7.0-beta.3\n\n## 1.7.0-beta.2\n\n### Patch Changes\n\n- Updated dependencies [940e5745]\n - babel-preset-solid@1.7.0-beta.2\n - solid-js@1.7.0-beta.2\n\n## 1.7.0-beta.1\n\n### Patch Changes\n\n- Updated dependencies [6b77d9ed]\n- Updated dependencies [608b3c3a]\n- Updated dependencies [24469762]\n- Updated dependencies [2b80f706]\n- Updated dependencies [8d0877e4]\n- Updated dependencies [5545d3ee]\n- Updated dependencies [74f00e15]\n - solid-js@1.7.0-beta.1\n - babel-preset-solid@1.7.0-beta.1\n\n## 1.7.0-beta.0\n\n### Patch Changes\n\n- Updated dependencies [503b632]\n- Updated dependencies [86c3227]\n- Updated dependencies [f7dc355]\n- Updated dependencies [4929530]\n- Updated dependencies [71c40af]\n- Updated dependencies [e245736]\n- Updated dependencies [6a4fe46]\n - solid-js@1.7.0-beta.0\n - babel-preset-solid@1.7.0-beta.0\n\n## 1.6.16\n\n### Patch Changes\n\n- 620c7636: Switch test runner from Jest to Vitest\n- Updated dependencies [d10da016]\n- Updated dependencies [620c7636]\n - babel-preset-solid@1.6.16\n - solid-js@1.6.16\n\n## 1.6.15\n\n### Patch Changes\n\n- Updated dependencies [e8448ebd]\n- Updated dependencies [da83ebda]\n - solid-js@1.6.15\n\n## 1.6.14\n\n### Patch Changes\n\n- Updated dependencies [6cceab2f]\n - solid-js@1.6.14\n\n## 1.6.13\n\n### Patch Changes\n\n- Updated dependencies [af20f00b]\n- Updated dependencies [60f8624d]\n - solid-js@1.6.13\n - babel-preset-solid@1.6.13\n\n## 1.6.12\n\n### Patch Changes\n\n- 676ed331: docs: fix typos\n- Updated dependencies [e2888c77]\n- Updated dependencies [676ed331]\n- Updated dependencies [b8a3ff13]\n- Updated dependencies [1aff80c6]\n- Updated dependencies [53db3f0f]\n- Updated dependencies [47d574a8]\n- Updated dependencies [e245736f]\n- Updated dependencies [61d1fe25]\n- Updated dependencies [081ca06c]\n- Updated dependencies [4fdec4f9]\n - solid-js@1.6.12\n - babel-preset-solid@1.6.12\n\n## 1.6.11\n\n### Patch Changes\n\n- Updated dependencies [bfbd002]\n- Updated dependencies [1ecdea4]\n- Updated dependencies [91d518a]\n- Updated dependencies [18e734d]\n- Updated dependencies [12d458d]\n- Updated dependencies [4aaa94b]\n- Updated dependencies [c26f933]\n- Updated dependencies [6fb3cd8]\n- Updated dependencies [c5b208c]\n - solid-js@1.6.11\n\n## 1.6.10\n\n### Patch Changes\n\n- Updated dependencies [1b32e63]\n- Updated dependencies [dd879da]\n- Updated dependencies [d89e791]\n- Updated dependencies [695d99b]\n- Updated dependencies [d35a1ca]\n- Updated dependencies [7ab43a4]\n - solid-js@1.6.10\n - babel-preset-solid@1.6.10\n\n## 1.6.9\n\n### Patch Changes\n\n- Updated dependencies [a572c12]\n- Updated dependencies [0ad9859]\n- Updated dependencies [12629a3]\n - babel-preset-solid@1.6.9\n - solid-js@1.6.9\n\n## 1.6.8\n\n### Patch Changes\n\n- Updated dependencies [6db2d89]\n - solid-js@1.6.8\n\n## 1.6.7\n\n### Patch Changes\n\n- Updated dependencies [c4ac14c]\n- Updated dependencies [1384496]\n- Updated dependencies [1dbd5a9]\n- Updated dependencies [368e508]\n- Updated dependencies [54f3068]\n- Updated dependencies [c8edacd]\n- Updated dependencies [89baf12]\n - solid-js@1.6.7\n - babel-preset-solid@1.6.7\n\n## 1.6.6\n\n### Patch Changes\n\n- Updated dependencies [a603850]\n- Updated dependencies [2119211]\n- Updated dependencies [5a5a72d]\n- Updated dependencies [5eb575a]\n - solid-js@1.6.6\n - babel-preset-solid@1.6.6\n\n## 1.6.5\n\n### Patch Changes\n\n- Updated dependencies [50d1304]\n- Updated dependencies [ee71b16]\n - solid-js@1.6.5\n\n## 1.6.4\n\n### Patch Changes\n\n- Updated dependencies [a42a5f6]\n - solid-js@1.6.4\n\n## 1.6.3\n\n### Patch Changes\n\n- e95e95f: Bug fixes and testing changelog\n- Updated dependencies [e95e95f]\n - babel-preset-solid@1.6.3\n - solid-js@1.6.3\n" }, { "path": "packages/test-integration/babel.config.cjs", "content": "module.exports = {\n env: {\n test: {\n presets: [\n [\"@babel/preset-env\", { targets: { node: \"current\" } }],\n \"@babel/preset-typescript\"\n ]\n }\n }\n};\n" }, { "path": "packages/test-integration/package.json", "content": "{\n \"name\": \"test-integration\",\n \"private\": true,\n \"scripts\": {\n \"test\": \"npm run test:imports\",\n \"test:integrations\": \"vitest run\",\n \"test:imports\": \"node test-imports.mjs\"\n },\n \"dependencies\": {\n \"babel-preset-solid\": \"workspace:*\",\n \"solid-js\": \"workspace:*\"\n },\n \"devDependencies\": {\n \"gitly\": \"^2.2.1\",\n \"shelljs\": \"^0.8.5\"\n },\n \"version\": \"1.9.11\"\n}\n" }, { "path": "packages/test-integration/test-imports.mjs", "content": "function checkError(error) {\n // This error happens when missing the type:module field in package.json when it is needed.\n if (\n error instanceof SyntaxError &&\n error.message.includes(\"Cannot use import statement outside a module\")\n ) {\n console.error(error);\n process.exit(1);\n }\n\n // These errors happen if exports are not mapped to files that should be importable.\n if ([\"ERR_PACKAGE_PATH_NOT_EXPORTED\", \"ERR_MODULE_NOT_FOUND\"].includes(error.code)) {\n console.error(error);\n process.exit(1);\n }\n\n // Any other errors (unless I missed any that should be added to the checks\n // above) are errors that happen after imported modules are successfully\n // resolved (f.e. a module was found, but it doesn't export a particular\n // identifier when running in node vs browser). SO we silence them by not\n // re-throwing them here as we don't want to fail the test in those cases,\n // because we're testing only that ESM exports are set up correctly.\n // Importing `solid-js/h` will fail in node even if modules are resolved\n // properly, for example.\n}\n\nPromise.all([\n import(\"solid-js\").catch(checkError),\n import(\"solid-js/dist/solid.js\").catch(checkError),\n\n import(\"solid-js/web\").catch(checkError),\n import(\"solid-js/web/dist/web.js\").catch(checkError),\n import(\"solid-js/web/dist/server.js\").catch(checkError),\n\n import(\"solid-js/h\").catch(checkError),\n import(\"solid-js/h/dist/h.js\").catch(checkError),\n\n import(\"solid-js/html\").catch(checkError),\n import(\"solid-js/html/dist/html.js\").catch(checkError)\n])\n .then(() => {\n console.log(\"ES Module import test passed.\");\n })\n .catch(error => {\n console.error(error);\n process.exit(1);\n });\n" }, { "path": "packages/test-integration/tests/downloaded.spec.ts", "content": "import { mkdir, rm, exec } from \"shelljs\";\nimport { resolve, dirname, join } from \"path\";\nimport { download, extract } from \"gitly\";\nimport { existsSync } from \"fs\";\n\nfunction makeTestRepo(\n name: string,\n install: (dependencies: string[]) => string = npmInstaller,\n test: string = \"npm test\"\n) {\n return {\n name,\n install,\n test\n };\n}\ntype TestRepo = ReturnType;\n\nfunction npmInstaller(dependencies: string[]) {\n return dependencies.map(dep => `npm install --save \"${dep}\" --ignore-scripts`).join(\" && \");\n}\n\n/** a function that tests a package */\nasync function testPackage(testRepo: TestRepo, dependencies: string[], isSilent = false) {\n const { name, install, test } = testRepo;\n\n const distFolder = resolve(join(__dirname, \"fixtures\", \"downloaded\", name));\n\n // download repository\n if (!packageExists(distFolder)) {\n const source = await download(name);\n mkdir(\"-p\", distFolder);\n await extract(source, distFolder);\n }\n\n // run the tests\n if (packageExists(distFolder)) {\n exec(install(dependencies), {\n fatal: true,\n cwd: distFolder,\n silent: isSilent\n });\n\n exec(test, { fatal: true, cwd: distFolder, silent: isSilent });\n\n return true;\n }\n return false;\n}\n\n/** pack a package */\nfunction pack(packageRoot: string) {\n const packageJson = join(packageRoot, \"package.json\");\n const pkg = require(packageJson);\n const packedPkg = join(packageRoot, `${pkg.name}-${pkg.version}.tgz`);\n rm(\"-rf\", packedPkg);\n exec(\"npm pack\", { cwd: packageRoot, fatal: true });\n return packedPkg;\n}\n\nfunction packageExists(packageRoot: string) {\n return existsSync(join(packageRoot, \"package.json\"));\n}\n\ndescribe(\"Downloaded tests\", () => {\n // The repositories to run the tests for\n const testRepos: TestRepo[] = [makeTestRepo(\"aminya/solid-simple-table\")];\n const clean = true;\n\n let packedSolidPkg: string, packedBabelSolidPkg: string, dependencies: string[];\n beforeAll(() => {\n // Check if solid is built\n if (!existsSync(resolve(join(__dirname, \"../../solid/dist\")))) {\n throw new Error(\"Solid is not built. Run `npm run build`\");\n }\n\n // clean downloaded packages\n if (clean) {\n rm(\"-rf\", resolve(join(__dirname, \"./fixtures/downloaded\")));\n }\n\n // package solid and babel-preset-solid\n packedSolidPkg = pack(resolve(__dirname, \"../../solid\"));\n packedBabelSolidPkg = pack(resolve(__dirname, \"../../babel-preset-solid\"));\n dependencies = [packedSolidPkg, packedBabelSolidPkg];\n });\n\n // run the tests\n for (const testRepo of testRepos) {\n test(testRepo.name, async () => {\n const pass = await testPackage(testRepo, dependencies);\n expect(pass).toBe(true);\n });\n }\n\n afterAll(() => {\n rm(\"-rf\", packedSolidPkg);\n rm(\"-rf\", packedBabelSolidPkg);\n });\n});\n" }, { "path": "packages/test-integration/tsconfig.json", "content": "{\n \"extends\": \"../../tsconfig.test.json\",\n \"include\": [\"./tests\"]\n}\n" }, { "path": "pnpm-workspace.yaml", "content": "packages:\n - 'packages/*'\n" }, { "path": "tsconfig.json", "content": "{\n \"compilerOptions\": {\n \"emitDeclarationOnly\": true,\n \"declaration\": true,\n \"target\": \"ESNext\",\n \"newLine\": \"LF\",\n \"module\": \"NodeNext\",\n \"moduleResolution\": \"NodeNext\",\n \"strict\": true,\n \"jsx\": \"preserve\"\n },\n \"exclude\": [\"node_modules\"]\n}\n" }, { "path": "tsconfig.test.json", "content": "{\n \"compilerOptions\": {\n \"noEmit\": true,\n \"target\": \"ESNext\",\n \"module\": \"NodeNext\",\n \"moduleResolution\": \"NodeNext\",\n \"strict\": true,\n \"lib\": [\"dom\", \"esnext\", \"dom.iterable\"],\n \"jsx\": \"preserve\",\n // Necessary due to picocolors using weird export syntax.\n // This can be removed if the following issue gets fixed:\n // https://github.com/alexeyraspopov/picocolors/issues/50\n \"allowSyntheticDefaultImports\": true,\n // Allows TS to see the Vitest globals\n \"types\": [\"vitest/globals\"]\n },\n \"exclude\": [\"node_modules\"]\n}\n" }, { "path": "turbo.json", "content": "{\n \"$schema\": \"https://turborepo.org/schema.json\",\n \"pipeline\": {\n \"build\": {\n \"dependsOn\": [\"^build\"],\n \"outputMode\": \"new-only\"\n },\n \"solid-js#build\": {\n \"outputs\": [\"dist/**\", \"**/dist/**\"]\n },\n \"solid-js#link\": {\n \"outputs\": []\n },\n \"solid-element#build\": {\n \"dependsOn\": [\"solid-js#types\", \"solid-js#link\"]\n },\n \"solid-js#types\": {\n \"dependsOn\": [\"^types\"],\n \"outputs\": [\"types/**\", \"**/types/**\"]\n },\n \"coverage\": {\n \"outputs\": [\"coverage/**\"]\n },\n \"test\": {\n \"outputs\": []\n },\n \"test-integration#test\": {\n \"dependsOn\": [\"solid-js#build\", \"solid-js#link\"]\n },\n \"solid-js#test-types\": {\n \"outputs\": [],\n \"dependsOn\": [\"types\"]\n }\n }\n}\n" } ]