slim-select 2.9.0 → 2.9.1

package/README.md

@@ -15,7 +15,7 @@ Advanced select dropdown
 
 ## [Documentation and Examples](https://slimselectjs.com)
 
-See [website](https://slimselectjs.com) for the full list of settings, methods and event callbacks
+See [website](https://slimselectjs.com) for the full list of [settings](https://slimselectjs.com/settings), [methods](https://slimselectjs.com/methods) and [event callbacks](https://slimselectjs.com/events)
 
 ![](https://raw.githubusercontent.com/brianvoe/slim-select/master/slimselect.gif)
 
@@ -152,6 +152,7 @@ new SlimSelect({
     timeoutDelay: 200,
     maxValuesShown: 20,
     maxValuesMessage: '{number} selected',
+    addableText: 'Press "Enter" to add {value}',
   },
 })
 ```
@@ -167,7 +168,7 @@ new SlimSelect({
   events: {
     search: (searchValue: string, currentData: DataArray) => Promise<DataArrayPartial> | DataArrayPartial
     searchFilter: (option: Option, search: string) => boolean
-    addable: (value: string) => Promise<OptionOptional | string> | OptionOptional | string
+    addable: (value: string) => Promise<OptionOptional | string> | OptionOptional | string | Error
     beforeChange: (newVal: Option[], oldVal: Option[]) => boolean | void
     afterChange: (newVal: Option[]) => void
     beforeOpen: () => void

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "slim-select",
   "description": "Slim advanced select dropdown",
-  "version": "2.9.0",
+  "version": "2.9.1",
   "author": "Brian Voelker <brian@webiswhatido.com> (http://webiswhatido.com)",
   "homepage": "https://slimselectjs.com",
   "license": "MIT",
@@ -53,21 +53,21 @@
   "devDependencies": {
     "@jest/globals": "^29.7.0",
     "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-commonjs": "^26.0.1",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "@rollup/plugin-replace": "^5.0.7",
+    "@rollup/plugin-commonjs": "^28.0.0",
+    "@rollup/plugin-node-resolve": "^15.3.0",
+    "@rollup/plugin-replace": "^6.0.1",
     "@rollup/plugin-terser": "^0.4.4",
-    "@rollup/plugin-typescript": "^11.1.6",
+    "@rollup/plugin-typescript": "^12.1.0",
     "@testing-library/jest-dom": "^6.5.0",
     "@testing-library/user-event": "^14.5.2",
     "@types/downloadjs": "^1.4.6",
-    "@types/jest": "^29.5.12",
-    "@typescript-eslint/eslint-plugin": "^8.5.0",
-    "@typescript-eslint/parser": "^8.5.0",
-    "@vitejs/plugin-vue": "^5.1.3",
+    "@types/jest": "^29.5.13",
+    "@typescript-eslint/eslint-plugin": "^8.8.1",
+    "@typescript-eslint/parser": "^8.8.1",
+    "@vitejs/plugin-vue": "^5.1.4",
     "clipboard": "^2.0.11",
     "downloadjs": "^1.4.7",
-    "eslint": "^9.10.0",
+    "eslint": "^9.12.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-prettier": "^5.2.1",
     "identity-obj-proxy": "^3.0.0",
@@ -77,18 +77,18 @@
     "prettier": "^3.3.3",
     "prismjs": "^1.29.0",
     "rimraf": "^6.0.1",
-    "rollup": "^4.21.2",
+    "rollup": "^4.24.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-typescript2": "^0.36.0",
     "rollup-plugin-vue": "^6.0.0",
-    "sass": "^1.78.0",
+    "sass": "^1.79.5",
     "ts-jest": "^29.2.5",
     "tslib": "^2.7.0",
-    "typescript": "^5.6.2",
-    "vite": "^5.4.4",
-    "vite-plugin-dts": "^4.2.1",
-    "vue": "^3.5.4",
-    "vue-router": "^4.4.4",
+    "typescript": "^5.6.3",
+    "vite": "^5.4.8",
+    "vite-plugin-dts": "^4.2.4",
+    "vue": "^3.5.12",
+    "vue-router": "^4.4.5",
     "vue-tsc": "^2.1.6",
     "vuex": "^4.0.2"
   }

package/src/slim-select/render.ts

@@ -72,7 +72,9 @@ export default class Render {
     this.updateAriaAttributes()
 
     // Add content to the content location settings
-    this.settings.contentLocation.appendChild(this.content.main)
+    if (this.settings.contentLocation) {
+      this.settings.contentLocation.appendChild(this.content.main)
+    }
   }
 
   // Remove disabled classes

package/src/slim-select/select.ts

@@ -374,7 +374,7 @@ export default class Select {
     const optionEl = document.createElement('option')
     optionEl.id = info.id
     optionEl.value = info.value
-    optionEl.innerHTML = info.text
+    optionEl.textContent = info.text
     if (info.html !== '') {
       optionEl.setAttribute('data-html', info.html)
     }

package/src/slim-select/settings.test.ts

@@ -195,6 +195,21 @@ describe('Settings module', () => {
       expect(optionElement.dataset.html).toBe(option.html)
     })
 
+    test('malicious text is inserted with innerText', () => {
+      // decoded text: <img src=x onerror=alert(1)></img>
+      const str = '&#x3c;&#x69;&#x6d;&#x67;&#x20;&#x73;&#x72;&#x63;&#x3d;&#x78;&#x20;&#x6f;&#x6e;&#x65;&#x72;&#x72;&#x6f;&#x72;&#x3d;&#x61;&#x6c;&#x65;&#x72;&#x74;&#x28;&#x31;&#x29;&#x3e;&#x3c;&#x2f;&#x69;&#x6d;&#x67;&#x3e;'
+      // const str = 'opt'
+      const decode = (string: string|null) => {
+        if(string === null) return ''
+        const doc = new DOMParser().parseFromString(string, "text/html")
+        return doc.documentElement.textContent;
+      }
+      const option = new Option({ text: str })
+      const optionElement = select.createOption(option)
+      // expect(decode(optionElement.textContent)).toBe('opt')
+      expect(optionElement.textContent).toBe(str)
+    })
+
     test('disabled sets disabled property correctly', () => {
       const option = new Option({ text: 'opt', disabled: true })
       const optionElement = select.createOption(option)

package/src/slim-select/settings.ts

@@ -24,7 +24,7 @@ export default class Settings {
   public searchingText: string
   public searchHighlight: boolean
   public closeOnSelect: boolean
-  public contentLocation: HTMLElement
+  public contentLocation: HTMLElement | null
   public contentPosition: 'relative' | 'absolute'
   public openPosition: 'auto' | 'up' | 'down'
   public placeholderText: string

package/vite.config.mts

@@ -3,6 +3,13 @@ import { defineConfig } from 'vite'
 
 // https://vitejs.dev/config/
 export default defineConfig({
+  css: {
+    preprocessorOptions: {
+      scss: {
+        api: 'modern-compiler' // or "modern"
+      }
+    }
+  },
   build: {
     outDir: 'docs',
     emptyOutDir: true,
@@ -10,9 +17,9 @@ export default defineConfig({
       output: {
         entryFileNames: `assets/[name].js`,
         chunkFileNames: `assets/[name].js`,
-        assetFileNames: `assets/[name].[ext]`,
-      },
-    },
+        assetFileNames: `assets/[name].[ext]`
+      }
+    }
   },
-  plugins: [vue()],
+  plugins: [vue()]
 })