@solid-primitives/props
Advanced tools
Comparing version 2.2.2 to 3.0.0
{ | ||
"name": "@solid-primitives/props", | ||
"version": "2.2.2", | ||
"version": "3.0.0", | ||
"description": "Library of primitives focused around component props.", | ||
"author": "Alex Lohr <alex.lohr@logmein.com>", | ||
"contributors": [ | ||
"Damian Tarnawski <gthetarnav@gmail.com>" | ||
], | ||
"author": "Damian Tarnawski <gthetarnav@gmail.com>", | ||
"contributors": [], | ||
"license": "MIT", | ||
@@ -20,7 +18,11 @@ "homepage": "https://github.com/solidjs-community/solid-primitives/tree/main/packages/props", | ||
"combineProps", | ||
"filterProps", | ||
"createControlledProps" | ||
"filterProps" | ||
], | ||
"category": "Utilities" | ||
}, | ||
"keywords": [ | ||
"props", | ||
"solid", | ||
"primitives" | ||
], | ||
"files": [ | ||
@@ -31,52 +33,46 @@ "dist" | ||
"sideEffects": false, | ||
"main": "dist/cjs/index.js", | ||
"module": "dist/esm/index.js", | ||
"types": "dist/types/index.d.ts", | ||
"type": "module", | ||
"main": "./dist/server.cjs", | ||
"module": "./dist/server.js", | ||
"types": "./dist/index.d.ts", | ||
"browser": { | ||
"./dist/server.cjs": "./dist/index.cjs", | ||
"./dist/server.js": "./dist/index.js" | ||
}, | ||
"exports": { | ||
".": { | ||
"solid": "./dist/source/index.jsx", | ||
"import": "./dist/esm/index.js", | ||
"browser": { | ||
"import": "./dist/esm/index.js", | ||
"require": "./dist/cjs/index.js" | ||
}, | ||
"require": "./dist/cjs/index.js", | ||
"node": "./dist/cjs/index.js" | ||
} | ||
"worker": { | ||
"import": "./dist/server.js", | ||
"require": "./dist/server.cjs" | ||
}, | ||
"browser": { | ||
"import": "./dist/index.js", | ||
"require": "./dist/index.cjs" | ||
}, | ||
"deno": { | ||
"import": "./dist/server.js", | ||
"require": "./dist/server.cjs" | ||
}, | ||
"node": { | ||
"import": "./dist/server.js", | ||
"require": "./dist/server.cjs" | ||
}, | ||
"import": "./dist/index.js", | ||
"require": "./dist/index.cjs" | ||
}, | ||
"keywords": [ | ||
"props", | ||
"knobs", | ||
"controls", | ||
"solid", | ||
"primitives" | ||
], | ||
"dependencies": { | ||
"@solid-primitives/utils": "^3.0.2" | ||
"@solid-primitives/utils": "^3.1.0" | ||
}, | ||
"devDependencies": { | ||
"babel-preset-solid": "^1.4.8", | ||
"jsdom": "^20.0.0", | ||
"nanospy": "^0.5.0", | ||
"prettier": "^2.7.1", | ||
"rollup": "^2.78.0", | ||
"rollup-preset-solid": "^1.4.0", | ||
"solid-js": "^1.5.1", | ||
"solid-register": "^0.2.5", | ||
"tslib": "^2.4.0", | ||
"typescript": "^4.7.4", | ||
"unocss": "^0.44.7", | ||
"uvu": "^0.5.6", | ||
"vite": "^3.0.7", | ||
"vite-plugin-solid": "^2.3.0" | ||
"solid-js": "^1.5.0" | ||
}, | ||
"peerDependencies": { | ||
"solid-js": "^1.3.0" | ||
"solid-js": "^1.5.0" | ||
}, | ||
"scripts": { | ||
"start": "vite serve dev --host", | ||
"dev": "npm run start", | ||
"build": "rollup -c", | ||
"test": "uvu -r solid-register" | ||
"build": "jiti ../../scripts/build.ts --ssr", | ||
"test": "vitest -c ../../configs/vitest.config.ts", | ||
"test:ssr": "pnpm run test --mode ssr" | ||
} | ||
} |
@@ -16,32 +16,13 @@ <p> | ||
- [`filterProps`](#filterProps) - Create a new props object with only the property names that match the predicate. | ||
- [`createProps`](#createProps) - Provides controllable props signals like knobs/controls for simple component testing. | ||
## Installation | ||
``` | ||
```bash | ||
npm install @solid-primitives/props | ||
# or | ||
yarn add @solid-primitives/props | ||
# or | ||
pnpm add @solid-primitives/props | ||
``` | ||
## SSR Support | ||
If you are using [solid-start](https://github.com/solidjs/solid-start) with SSR, you may see this error comming form the `@solid-primitives/props` package. | ||
``` | ||
TypeError: web.template is not a function | ||
``` | ||
To prevent this, add `"@solid-primitives/props"` entry to `noExternal` field in your vite config, like so: | ||
```tsx | ||
export default defineConfig({ | ||
plugins: [solid()], | ||
ssr: { | ||
// It allows Vite to preprocess the package | ||
noExternal: ["@solid-primitives/props"] | ||
} | ||
}); | ||
``` | ||
## `combineProps` | ||
@@ -170,71 +151,4 @@ | ||
## `createProps` | ||
Primitive that provides controllable props signals like knobs/controls for simple component testing | ||
### How to use it | ||
You can either create a single prop: | ||
```ts | ||
// Second argument can be initialValue for boolean, number, string: | ||
const [string, setString, stringField] = createControlledProp("stringValue", "test"); | ||
// Arrays or enums can be provided in an options object: | ||
const [language, setLanguage, languageField] = createControlledProp( | ||
"language", | ||
{ initialValue: "en", options: ["de", "en", "fr", "it"] as const } | ||
// If you want your array to be able to influence the setter/getter types, use `as const`. | ||
); | ||
enum Currency { | ||
AUD, | ||
GBP, | ||
EUR, | ||
USD, | ||
CHF, | ||
JPY, | ||
CNY | ||
} | ||
const [currency, setCurrency, currencyField] = createControlledProp("currency", { | ||
initialValue: Currency.USD, | ||
options: Currency | ||
}); | ||
return { languageField(); }; | ||
``` | ||
or multiple props in one call: | ||
```ts | ||
enum Test { One, Two, Three }; | ||
const languages = ['de', 'en', 'fr', 'it'] as const; | ||
const [props, fields] = createControlledProps({ | ||
boolean: true, | ||
number: 42, | ||
string: 'text', | ||
array: { initialValue: 'en', options: languages }, | ||
enum: { initialValue: Test.Three, options: Test } | ||
}); | ||
props == { | ||
boolean: Accessor<boolean>, | ||
setBoolean: Setter<boolean>, | ||
number: Accessor<number>, | ||
setNumber: Setter<number>, | ||
string: Accessor<string>, | ||
setString: Setter<string>, | ||
array: Accessor<string>, | ||
setArray: Setter<string>, | ||
enum: Accessor<Test>, | ||
setEnum: Setter<Test> | ||
}; | ||
fields == JSX.Element[]; | ||
``` | ||
### Demo | ||
TODO | ||
## Changelog | ||
See [CHANGELOG.md](./CHANGELOG.md) |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
2
Yes
29803
8
718
153
1