svelte-multiselect
Advanced tools
Comparing version 8.0.1 to 8.0.2
@@ -8,3 +8,3 @@ { | ||
"license": "MIT", | ||
"version": "8.0.1", | ||
"version": "8.0.2", | ||
"type": "module", | ||
@@ -17,12 +17,13 @@ "svelte": "index.js", | ||
"@playwright/test": "^1.27.1", | ||
"@sveltejs/adapter-static": "^1.0.0-next.44", | ||
"@sveltejs/kit": "^1.0.0-next.516", | ||
"@sveltejs/package": "^1.0.0-next.5", | ||
"@sveltejs/vite-plugin-svelte": "^1.0.9", | ||
"@typescript-eslint/eslint-plugin": "^5.40.0", | ||
"@typescript-eslint/parser": "^5.40.0", | ||
"eslint": "^8.25.0", | ||
"@sveltejs/adapter-static": "1.0.0-next.48", | ||
"@sveltejs/kit": "1.0.0-next.538", | ||
"@sveltejs/package": "1.0.0-next.5", | ||
"@sveltejs/vite-plugin-svelte": "^1.1.0", | ||
"@typescript-eslint/eslint-plugin": "^5.42.1", | ||
"@typescript-eslint/parser": "^5.42.1", | ||
"eslint": "^8.27.0", | ||
"eslint-plugin-svelte3": "^4.0.0", | ||
"hastscript": "^7.1.0", | ||
"jsdom": "^20.0.1", | ||
"highlight.js": "^11.6.0", | ||
"jsdom": "^20.0.2", | ||
"mdsvex": "^0.10.6", | ||
@@ -32,13 +33,13 @@ "prettier": "^2.7.1", | ||
"rehype-autolink-headings": "^6.1.1", | ||
"rehype-slug": "^5.0.1", | ||
"rehype-slug": "^5.1.0", | ||
"svelte": "^3.52.0", | ||
"svelte-check": "^2.9.2", | ||
"svelte-github-corner": "^0.1.0", | ||
"svelte-preprocess": "^4.10.6", | ||
"svelte-toc": "^0.4.0", | ||
"svelte-preprocess": "^4.10.7", | ||
"svelte-toc": "^0.4.1", | ||
"svelte2tsx": "^0.5.20", | ||
"tslib": "^2.4.0", | ||
"tslib": "^2.4.1", | ||
"typescript": "^4.8.4", | ||
"vite": "^3.1.8", | ||
"vitest": "^0.24.3" | ||
"vite": "^3.2.3", | ||
"vitest": "^0.25.0" | ||
}, | ||
@@ -45,0 +46,0 @@ "keywords": [ |
@@ -17,6 +17,6 @@ <h1 align="center"> | ||
**Keyboard-friendly, accessible and highly customizable multi-select component.** | ||
<span class="hide-in-docs"> | ||
<a href="https://svelte-multiselect.netlify.app">View the docs</a> | ||
</span> | ||
<p align="center"><strong> | ||
Keyboard-friendly, accessible and highly customizable multi-select component. | ||
<a class="hide-in-docs" href="https://svelte-multiselect.netlify.app">View the docs</a> | ||
</strong></p> | ||
@@ -152,3 +152,3 @@ <slot name="examples" /> | ||
Whether to allow users to select duplicate options. Applies only to the selected item list, not the options dropdown. Keeping that free of duplicates is left to developer. The selected item list can have duplicates if `allowUserOptions` is truthy, `duplicates` is ` true` and users create the same option multiple times. Use `duplicateOptionMsg` to customize the message shown to user if `duplicates` is `false` and users attempt this and `duplicateFunc` to customize when a pair of options is considered a duplicate. | ||
Whether to allow users to select duplicate options. Applies only to the selected item list, not the options dropdown. Keeping that free of duplicates is left to developer. The selected item list can have duplicates if `allowUserOptions` is truthy, `duplicates` is `true` and users create the same option multiple times. Use `duplicateOptionMsg` to customize the message shown to user if `duplicates` is `false` and users attempt this and `duplicateFunc` to customize when a pair of options is considered a duplicate. | ||
@@ -220,5 +220,5 @@ 1. ```ts | ||
maxSelectMsg: ((current: number, max: number) => string) | null = ( | ||
current: number, | ||
max: number | ||
) => (max > 1 ? `${current}/${max}` : ``) | ||
current: number, | ||
max: number | ||
) => (max > 1 ? `${current}/${max}` : ``) | ||
``` | ||
@@ -236,3 +236,3 @@ | ||
Applied to the `<input>` element. Sets the key of this field in a submitted form data object. Not useful at the moment since the value is stored in Svelte state, not on the `<input>` node. | ||
Applied to the `<input>` element. Sets the key of this field in a submitted form data object. See [form example](https://svelte-multiselect.netlify.app/form). | ||
@@ -432,3 +432,4 @@ 1. ```ts | ||
<script lang="ts"> | ||
import MultiSelect, { Option, ObjectOption } from 'svelte-multiselect' | ||
import MultiSelect from 'svelte-multiselect' | ||
import type { Option, ObjectOption } from 'svelte-multiselect' | ||
@@ -593,36 +594,2 @@ const myOptions: ObjectOption[] = [ | ||
## Downstream testing | ||
To test a Svelte component which imports `svelte-multiselect`, you need to configure your test runner to avoid [transpiling issues](https://github.com/janosh/svelte-multiselect/issues/48). | ||
For Jest, exclude `svelte-multiselect` from `transformIgnorePatterns` in your `jest.config.json`: | ||
```json | ||
{ | ||
"transformIgnorePatterns": ["node_modules/?!(svelte-multiselect)"], | ||
"transform": { | ||
"^.+\\.[t|j]s?$": "esbuild-jest", | ||
"^.+\\.svelte$": ["svelte-jester", { "preprocess": true }] | ||
} | ||
} | ||
``` | ||
For Vitest, include `svelte-multiselect` in `deps.inline`: | ||
```ts | ||
// vite.config.ts | ||
import { svelte } from '@sveltejs/vite-plugin-svelte' | ||
export default { | ||
plugins: [svelte({ hot: !process.env.VITEST })], | ||
test: { | ||
deps: { | ||
inline: [/svelte-multiselect/], | ||
}, | ||
}, | ||
} | ||
``` | ||
Here's a [Stackblitz example](https://stackblitz.com/fork/github/davipon/test-svelte-multiselect?initialPath=__vitest__) that also uses [`vitest-svelte-kit`](https://github.com/nickbreaton/vitest-svelte-kit). | ||
## Want to contribute? | ||
@@ -635,4 +602,4 @@ | ||
cd svelte-multiselect | ||
npm install | ||
npm run dev | ||
pnpm install | ||
pnpm dev | ||
``` |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
66703
28
599