New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
create-v-model
Advanced tools
create-v-model - npm Package Compare versions
Comparing version 1.0.0 to 2.0.0-beta.0
| { | ||
| "name": "create-v-model", | ||
| "version": "1.0.0", | ||
| "version": "2.0.0-beta.0", | ||
| "description": "create v-model bindings quickly and easily - without having to remember which props to use", | ||
@@ -12,4 +12,7 @@ "files": [ | ||
| }, | ||
| "main": "dist/create-v-model.cjs.js", | ||
| "module": "dist/create-v-model.esm.js", | ||
| "type": "module", | ||
| "exports": { | ||
| "import": "dist/create-v-model.js", | ||
| "require": "dist/create-v-model.cjs" | ||
| }, | ||
| "sideEffects": false, | ||
@@ -21,3 +24,3 @@ "scripts": { | ||
| "postversion": "git push --follow-tags", | ||
| "test": "uvu -r esm -r browser-env/register test" | ||
| "test": "uvu test" | ||
| }, | ||
@@ -27,9 +30,11 @@ "author": "Dave Honneffer <pearofducks@gmail.com>", | ||
| "devDependencies": { | ||
| "@vue/test-utils": "^2.0.0-beta.2", | ||
| "browser-env": "^3.3.0", | ||
| "esm": "^3.2.25", | ||
| "rollup": "^2.23.0", | ||
| "uvu": "^0.3.3", | ||
| "vue": "^3.0.0-rc.7" | ||
| "@vue/test-utils": "^2.0.0-beta.13", | ||
| "abdomen": "^0.9.1", | ||
| "jsdom": "^16.4.0", | ||
| "microbundle": "^0.12.4", | ||
| "rollup": "^2.35.1", | ||
| "sinon": "^9.2.2", | ||
| "uvu": "^0.5.1", | ||
| "vue": "^3.0.4" | ||
| } | ||
| } |
@@ -39,4 +39,5 @@ # create-v-model | ||
| ...modelProps({ | ||
| modelType: any, | ||
| modelModifiersDefault: any | ||
| modelName: string = 'modelValue', | ||
| modelType: any = null, | ||
| modifierDefault: any = (() => ({})) // but you probably want an object factory here of some form | ||
| }) | ||
@@ -46,10 +47,6 @@ } | ||
| *modelType*: | ||
| - default: null | ||
| - an optional type to specify the model should be | ||
| **modelName**: the name of the model; leave this as the default for plain `v-model`, and otherwise give it the `NAME` in `v-model:NAME` | ||
| **modelType**: an optional type to specify the model should be | ||
| **modifierDefault**: an optional alternative default for the _modelModifiers_ prop (or equivalent for named models) | ||
| *modelModifiersDefault*: | ||
| - default: {} | ||
| - an optional alternative default for the modelModifiers prop | ||
| ### createModel | ||
@@ -60,57 +57,27 @@ | ||
| ```js | ||
| setup: (props) => ({ | ||
| model: createModel(props) | ||
| setup: (props, { emit }) => ({ | ||
| model: createModel({ | ||
| props, | ||
| emit?, // see below for info about emit being optional | ||
| modelName: string = 'modelValue', | ||
| modifier?: function | ||
| }) | ||
| }) | ||
| ``` | ||
| ### createModifierModel | ||
| **props**: the props from setup - this is required | ||
| **emit**: if emit is provided, then Vue's built-in modifiers (`trim` and `number`) will be enabled - and events will be emitted for updates instead of directly calling the relevant `onUpdate` function directly | ||
| **modelName**: the name of the model; leave this as the default for plain `v-model`, and otherwise give it the `NAME` in `v-model:NAME` | ||
| **modifier**: a function of the form below, this will be called whenever the model would call `set` | ||
| - `(value: typeof modelType, modelModifiersObject: object) => typeof modelType` | ||
| Same as `createModel`, but as a higher-order function which takes a `modifier` function and returns a `createModel` function | ||
| ```js | ||
| const myModifier = (val, modifiersObject) => modifiersObject.hello ? 'Hi ' + val : val | ||
| const modifiedModelCreator = createModifierModel(myModifier) | ||
| ### createModelFactory | ||
| export default { | ||
| setup: (props) => ({ | ||
| model: modifiedModelCreator(props) | ||
| }) | ||
| } | ||
| ``` | ||
| Creates a higher-order function, can be useful for hooks and other utilities - otherwise effectively the same as `createModel` | ||
| ### namedModelProps | ||
| Same as `modelProps`, but as a higher-order function which takes a `name` and returns a `modelProps` function | ||
| ```js | ||
| const createFooProps = namedModelProps('foo') | ||
| export default { | ||
| props: { | ||
| ...createFooProps() | ||
| } | ||
| } | ||
| setup: (props, { emit }) => ({ | ||
| model: createModelFactory({ modelName, modifier })({ props, emit }) | ||
| }) | ||
| ``` | ||
| ### createNamedModel | ||
| Same as `createModel` but as a higher-order function which takes a `name` and returns a `createModel` function | ||
| ```js | ||
| const createFooModel = createNamedModel('foo') | ||
| export default { | ||
| setup: (props) => ({ | ||
| fooModel: createFooModel() | ||
| }) | ||
| } | ||
| ``` | ||
| ### createNamedModifierModel | ||
| Same as `createModifierModel` but takes a `name` as the first argument instead of the `modifier` function | ||
| ```js | ||
| const myModifier = (val, modifiersObject) => modifiersObject.hello ? 'Hi ' + val : val | ||
| const modifiedFooModelCreator = createNamedModifierModel('foo', myModifier) | ||
| ``` |
New alerts
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
Improved metrics
- Is type module
Yes
Worsened metrics
- Total package byte prevSize
- decreased by-1.75%
6775
- Dev dependency count
- increased by33.33%
8
- Lines of code
- decreased by-28%
54
- Number of low quality alerts
- increased by100%
2
- Number of lines in readme file
- decreased by-28.95%
81
No dependency changes