1
0
mirror of synced 2025-01-31 23:01:39 +03:00

Adds support for option groups on select lists

This commit is contained in:
Justin Schroeder 2019-09-24 11:28:15 -04:00
parent 59e7dc763c
commit d13f306479
3 changed files with 116 additions and 37 deletions

4
dist/index.js vendored

File diff suppressed because one or more lines are too long

87
package-lock.json generated
View File

@ -3126,7 +3126,8 @@
"ansi-regex": { "ansi-regex": {
"version": "2.1.1", "version": "2.1.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"aproba": { "aproba": {
"version": "1.1.1", "version": "1.1.1",
@ -3177,7 +3178,8 @@
"balanced-match": { "balanced-match": {
"version": "0.4.2", "version": "0.4.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"bcrypt-pbkdf": { "bcrypt-pbkdf": {
"version": "1.0.1", "version": "1.0.1",
@ -3192,6 +3194,7 @@
"version": "0.0.9", "version": "0.0.9",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"inherits": "~2.0.0" "inherits": "~2.0.0"
} }
@ -3200,6 +3203,7 @@
"version": "2.10.1", "version": "2.10.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"hoek": "2.x.x" "hoek": "2.x.x"
} }
@ -3208,6 +3212,7 @@
"version": "1.1.7", "version": "1.1.7",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"balanced-match": "^0.4.1", "balanced-match": "^0.4.1",
"concat-map": "0.0.1" "concat-map": "0.0.1"
@ -3216,7 +3221,8 @@
"buffer-shims": { "buffer-shims": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"caseless": { "caseless": {
"version": "0.12.0", "version": "0.12.0",
@ -3233,12 +3239,14 @@
"code-point-at": { "code-point-at": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"combined-stream": { "combined-stream": {
"version": "1.0.5", "version": "1.0.5",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"delayed-stream": "~1.0.0" "delayed-stream": "~1.0.0"
} }
@ -3246,22 +3254,26 @@
"concat-map": { "concat-map": {
"version": "0.0.1", "version": "0.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"console-control-strings": { "console-control-strings": {
"version": "1.1.0", "version": "1.1.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"cryptiles": { "cryptiles": {
"version": "2.0.5", "version": "2.0.5",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"boom": "2.x.x" "boom": "2.x.x"
} }
@ -3301,7 +3313,8 @@
"delayed-stream": { "delayed-stream": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"delegates": { "delegates": {
"version": "1.0.0", "version": "1.0.0",
@ -3333,7 +3346,8 @@
"extsprintf": { "extsprintf": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"forever-agent": { "forever-agent": {
"version": "0.6.1", "version": "0.6.1",
@ -3355,12 +3369,14 @@
"fs.realpath": { "fs.realpath": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"fstream": { "fstream": {
"version": "1.0.11", "version": "1.0.11",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"graceful-fs": "^4.1.2", "graceful-fs": "^4.1.2",
"inherits": "~2.0.0", "inherits": "~2.0.0",
@ -3416,6 +3432,7 @@
"version": "7.1.2", "version": "7.1.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"fs.realpath": "^1.0.0", "fs.realpath": "^1.0.0",
"inflight": "^1.0.4", "inflight": "^1.0.4",
@ -3428,7 +3445,8 @@
"graceful-fs": { "graceful-fs": {
"version": "4.1.11", "version": "4.1.11",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"har-schema": { "har-schema": {
"version": "1.0.5", "version": "1.0.5",
@ -3456,6 +3474,7 @@
"version": "3.1.3", "version": "3.1.3",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"boom": "2.x.x", "boom": "2.x.x",
"cryptiles": "2.x.x", "cryptiles": "2.x.x",
@ -3466,7 +3485,8 @@
"hoek": { "hoek": {
"version": "2.16.3", "version": "2.16.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"http-signature": { "http-signature": {
"version": "1.1.1", "version": "1.1.1",
@ -3483,6 +3503,7 @@
"version": "1.0.6", "version": "1.0.6",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"once": "^1.3.0", "once": "^1.3.0",
"wrappy": "1" "wrappy": "1"
@ -3491,7 +3512,8 @@
"inherits": { "inherits": {
"version": "2.0.3", "version": "2.0.3",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"ini": { "ini": {
"version": "1.3.4", "version": "1.3.4",
@ -3503,6 +3525,7 @@
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"number-is-nan": "^1.0.0" "number-is-nan": "^1.0.0"
} }
@ -3516,7 +3539,8 @@
"isarray": { "isarray": {
"version": "1.0.0", "version": "1.0.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"isstream": { "isstream": {
"version": "0.1.2", "version": "0.1.2",
@ -3589,12 +3613,14 @@
"mime-db": { "mime-db": {
"version": "1.27.0", "version": "1.27.0",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"mime-types": { "mime-types": {
"version": "2.1.15", "version": "2.1.15",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"mime-db": "~1.27.0" "mime-db": "~1.27.0"
} }
@ -3603,6 +3629,7 @@
"version": "3.0.4", "version": "3.0.4",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"brace-expansion": "^1.1.7" "brace-expansion": "^1.1.7"
} }
@ -3610,12 +3637,14 @@
"minimist": { "minimist": {
"version": "0.0.8", "version": "0.0.8",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"mkdirp": { "mkdirp": {
"version": "0.5.1", "version": "0.5.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"minimist": "0.0.8" "minimist": "0.0.8"
} }
@ -3670,7 +3699,8 @@
"number-is-nan": { "number-is-nan": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"oauth-sign": { "oauth-sign": {
"version": "0.8.2", "version": "0.8.2",
@ -3688,6 +3718,7 @@
"version": "1.4.0", "version": "1.4.0",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"wrappy": "1" "wrappy": "1"
} }
@ -3717,7 +3748,8 @@
"path-is-absolute": { "path-is-absolute": {
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"performance-now": { "performance-now": {
"version": "0.2.0", "version": "0.2.0",
@ -3728,7 +3760,8 @@
"process-nextick-args": { "process-nextick-args": {
"version": "1.0.7", "version": "1.0.7",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"punycode": { "punycode": {
"version": "1.4.1", "version": "1.4.1",
@ -3766,6 +3799,7 @@
"version": "2.2.9", "version": "2.2.9",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"buffer-shims": "~1.0.0", "buffer-shims": "~1.0.0",
"core-util-is": "~1.0.0", "core-util-is": "~1.0.0",
@ -3810,6 +3844,7 @@
"version": "2.6.1", "version": "2.6.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"glob": "^7.0.5" "glob": "^7.0.5"
} }
@ -3817,7 +3852,8 @@
"safe-buffer": { "safe-buffer": {
"version": "5.0.1", "version": "5.0.1",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"semver": { "semver": {
"version": "5.3.0", "version": "5.3.0",
@ -3841,6 +3877,7 @@
"version": "1.0.9", "version": "1.0.9",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"hoek": "2.x.x" "hoek": "2.x.x"
} }
@ -3874,6 +3911,7 @@
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"code-point-at": "^1.0.0", "code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0", "is-fullwidth-code-point": "^1.0.0",
@ -3884,6 +3922,7 @@
"version": "1.0.1", "version": "1.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"safe-buffer": "^5.0.1" "safe-buffer": "^5.0.1"
} }
@ -3898,6 +3937,7 @@
"version": "3.0.1", "version": "3.0.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"ansi-regex": "^2.0.0" "ansi-regex": "^2.0.0"
} }
@ -3912,6 +3952,7 @@
"version": "2.2.1", "version": "2.2.1",
"bundled": true, "bundled": true,
"dev": true, "dev": true,
"optional": true,
"requires": { "requires": {
"block-stream": "*", "block-stream": "*",
"fstream": "^1.0.2", "fstream": "^1.0.2",
@ -3967,7 +4008,8 @@
"util-deprecate": { "util-deprecate": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
}, },
"uuid": { "uuid": {
"version": "3.0.1", "version": "3.0.1",
@ -3996,7 +4038,8 @@
"wrappy": { "wrappy": {
"version": "1.0.2", "version": "1.0.2",
"bundled": true, "bundled": true,
"dev": true "dev": true,
"optional": true
} }
} }
}, },

View File

@ -65,13 +65,34 @@
@focus="setFocusState" @focus="setFocusState"
:disabled="disabled" :disabled="disabled"
> >
<option <template
v-for="option in optionList" v-if="!optionGroups"
:value="option.value" >
:key="option.id" <option
v-bind="option.attributes || {}" v-for="option in optionList"
v-text="option.label" :value="option.value"
/> :key="option.id"
v-bind="option.attributes || {}"
v-text="option.label"
/>
</template>
<template
v-else
>
<optgroup
v-for="(list, label) in optionGroups"
:key="label"
:label="label"
>
<option
v-for="option in createOptionList(list)"
:value="option.value"
:key="option.value"
v-bind="option.attributes || {}"
v-text="option.label"
/>
</optgroup>
</template>
</select> </select>
<!-- BOX INPUTS --> <!-- BOX INPUTS -->
<div <div
@ -219,6 +240,18 @@ export default {
type: [Object, Array], type: [Object, Array],
default: () => [] default: () => []
}, },
optionGroups: {
type: [Boolean, Object],
default: false,
validator: function (value) {
if (value === false) {
return true
} else if (typeof value === 'boolean') {
return false
}
return true
}
},
multiple: { multiple: {
type: Boolean, type: Boolean,
default: false default: false
@ -357,12 +390,7 @@ export default {
}, {}) }, {})
}, },
optionList () { optionList () {
if (!Array.isArray(this.options)) { return this.createOptionList(this.options)
return reduce(this.options, (options, value, label) => options.concat({value, label, id: shortid.generate()}), [])
} else if (Array.isArray(this.options) && !this.options.length) {
return [{value: this.name, label: (this.label || this.name), id: shortid.generate()}]
}
return this.options
}, },
val: { val: {
set (value) { set (value) {
@ -416,6 +444,14 @@ export default {
}, },
setFocusState () { setFocusState () {
this.focusState = true this.focusState = true
},
createOptionList (options) {
if (!Array.isArray(options)) {
return reduce(options, (options, value, label) => options.concat({value, label, id: shortid.generate()}), [])
} else if (Array.isArray(options) && !options.length) {
return [{value: this.name, label: (this.label || this.name), id: shortid.generate()}]
}
return options
} }
} }
} }