Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@solid-primitives/props

Package Overview
Dependencies
Maintainers
3
Versions
40
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@solid-primitives/props - npm Package Compare versions

Comparing version 2.2.2 to 3.0.0

dist/index.cjs

86

package.json
{
"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

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc