Skip to content

Commit 4133d9b

Browse files
committed
feat: makes interface more ssr safe
1 parent ab233dd commit 4133d9b

File tree

4 files changed

+19
-21
lines changed

4 files changed

+19
-21
lines changed

README.md

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,12 @@
44

55
[![NPM Version](https://img.shields.io/npm/v/@dschz/solid-create-script.svg?style=for-the-badge)](https://www.npmjs.com/package/@dschz/solid-create-script)
66
[![Build Status](https://img.shields.io/github/actions/workflow/status/dsnchz/solid-create-script/ci.yaml?branch=main&logo=github&style=for-the-badge)](https://github.com/dsnchz/solid-create-script/actions/workflows/ci.yaml)
7-
[![bun](https://img.shields.io/badge/maintained%20with-bun-cc00ff.svg?style=for-the-badge&logo=bun)](https://bun.sh/)
7+
[![TypeScript](https://img.shields.io/badge/TypeScript-supported-blue?style=for-the-badge&logo=typescript)](https://www.typescriptlang.org/)
8+
[![SSR Compatible](https://img.shields.io/badge/SSR-compatible-brightgreen?style=for-the-badge)](#)
89

910
# @dschz/solid-create-script
1011

11-
> SolidJS hook to declaratively load external scripts, built on top of [`@dschz/load-script`](https://www.npmjs.com/package/@dschz/load-script).
12+
> SolidJS hook to load external scripts -- built on top of [`@dschz/load-script`](https://www.npmjs.com/package/@dschz/load-script).
1213
1314
## ✅ Features
1415

@@ -20,11 +21,8 @@
2021

2122
```bash
2223
npm install solid-js @dschz/load-script @dschz/solid-create-script
23-
2424
pnpm install solid-js @dschz/load-script @dschz/solid-create-script
25-
2625
yarn install solid-js @dschz/load-script @dschz/solid-create-script
27-
2826
bun install solid-js @dschz/load-script @dschz/solid-create-script
2927
```
3028

@@ -37,15 +35,15 @@ bun install solid-js @dschz/load-script @dschz/solid-create-script
3735

3836
### `createScript(src, options?, container?)`
3937

40-
Wraps `loadScript` in a `createResource()` to enable declarative async tracking inside SolidJS.
38+
Loads an external script dynamically and returns a `Resource<HTMLScriptElement>`.
4139

4240
#### Parameters:
4341

44-
- `src` _(string)_: the script source to download
45-
- `options` _(LoadScriptOptions)_: standard script attributes (e.g. `async`, `type`, `nonce`, etc.)
46-
- `container` _(HTMLElement)_: DOM node to append the script to (defaults to `document.head`)
47-
48-
Returns a Solid `Resource<HTMLScriptElement>`.
42+
| Name | Type | Description |
43+
| ----------- | ------------------- | ----------------------------------------------------------------- |
44+
| `src` | `string` | Script URL (required) |
45+
| `options` | `LoadScriptOptions` | `loadScript` options (e.g. `async`, `type`) |
46+
| `container` | `HTMLElement` | HTML element to append `<script />` to (default: `document.head`) |
4947

5048
## 🧪 Example
5149

@@ -70,7 +68,7 @@ const CustomComponent = () => {
7068

7169
- Scripts are cached by `src` unless `innerHTML` or `textContent` is used
7270
- Scripts are not automatically removed on cleanup/unmount
73-
- Designed to be simple and safe to use inside SolidJS components
71+
- Designed to be simple and safe to use inside SolidJS components (in SSR and non-SSR environments)
7472

7573
## 💬 Feedback & Contributions
7674

bun.lock

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
"name": "solid-create-script",
66
"devDependencies": {
77
"@changesets/cli": "^2.29.3",
8-
"@dschz/load-script": "^1.0.5",
8+
"@dschz/load-script": "^1.0.7",
99
"@solidjs/testing-library": "^0.8.10",
1010
"@testing-library/jest-dom": "^6.6.3",
1111
"@types/bun": "^1.2.12",
@@ -26,7 +26,7 @@
2626
"vitest": "^2.1.9",
2727
},
2828
"peerDependencies": {
29-
"@dschz/load-script": ">=1.0.4",
29+
"@dschz/load-script": ">=1.0.7",
3030
"solid-js": ">=1.6.0",
3131
},
3232
},
@@ -138,7 +138,7 @@
138138

139139
"@csstools/css-tokenizer": ["@csstools/css-tokenizer@3.0.3", "", {}, "sha512-UJnjoFsmxfKUdNYdWgOB0mWUypuLvAfQPH1+pyvRJs6euowbFkFC6P13w1l8mJyi3vxYMxc9kld5jZEGRQs6bw=="],
140140

141-
"@dschz/load-script": ["@dschz/load-script@1.0.4", "", {}, "sha512-6XHrWt/HbQilI1CsA6HUVJ13R0TDNSpS/LrzEJS+6SARbc/37tMCEOOG4d0MLbsdmll0XhodEky7gJjC7+khRw=="],
141+
"@dschz/load-script": ["@dschz/load-script@1.0.7", "", {}, "sha512-nFuw/D3W7kyrHlQ4TVTwNvx8w5w6IAID0u5RrkJxaAZ5aDa1AHKKdMwEXhrU31x7rQSRfQLqx+yaOolvjPB3Og=="],
142142

143143
"@esbuild/aix-ppc64": ["@esbuild/aix-ppc64@0.25.4", "", { "os": "aix", "cpu": "ppc64" }, "sha512-1VCICWypeQKhVbE9oW/sJaAmjLxhVqacdkvPLEjwlttjfwENRSClS8EjBz0KzRyFSCPDIkuXW34Je/vk7zdB7Q=="],
144144

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@
6666
},
6767
"devDependencies": {
6868
"@changesets/cli": "^2.29.3",
69-
"@dschz/load-script": "^1.0.5",
69+
"@dschz/load-script": "^1.0.7",
7070
"@solidjs/testing-library": "^0.8.10",
7171
"@testing-library/jest-dom": "^6.6.3",
7272
"@types/bun": "^1.2.12",
@@ -87,7 +87,7 @@
8787
"vitest": "^2.1.9"
8888
},
8989
"peerDependencies": {
90-
"@dschz/load-script": ">=1.0.4",
90+
"@dschz/load-script": ">=1.0.7",
9191
"solid-js": ">=1.6.0"
9292
}
9393
}

src/createScript.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,14 +25,14 @@ import { createResource, type Resource } from "solid-js";
2525
*
2626
* @param src - The script URL to load.
2727
* @param options - HTML script attributes (e.g. async, type, innerHTML).
28-
* @param container - The HTMLElement to append the `<script />` to.
29-
* @returns A SolidJS `Resource<HTMLScriptElement>` representing the loading state.
28+
* @param container - The HTMLElement to append the `<script />` to (defaults to `document.head`).
29+
* @returns `Resource<HTMLScriptElement>`
3030
*/
3131
export const createScript = (
3232
src: string,
3333
options: LoadScriptOptions = {},
34-
target: HTMLElement | null = document.head,
34+
container?: HTMLElement | null,
3535
): Resource<HTMLScriptElement> => {
36-
const [script] = createResource(() => loadScript(src, options, target));
36+
const [script] = createResource(() => loadScript(src, options, container));
3737
return script;
3838
};

0 commit comments

Comments
 (0)