Skip to content

Commit

Permalink
chore: build, cl, version
Browse files Browse the repository at this point in the history
  • Loading branch information
@adamberecz
adamberecz committed Dec 21, 2022
1 parent 98c5ae8 commit ecc4ba0
Show file tree
Hide file tree
Showing 6 changed files with 85 additions and 30 deletions.
18 changes: 18 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,21 @@
## v2.5.8

> `2022-12-21`
### 🎉 Feature
- Added `--ms-border-width-active` and `--ms-border-color-active` CSS vars #213.
- Added `@max` event #269.
- Added `clearOnBlur` option #251.

### 🐞 Bug Fixes
- Removed `max-height` duplicate from default theme #240.
- Norwegian chars fix #243.
- Trigger `@change` event on updating external value #259.
- Docs fix for 2.7 installation instructions #294.
- Docs fix fiddle url.
- Tags dropdown focus fix #286 #300.
- Stop propagation on tag remove click #295.

## v2.5.7

> `2022-11-21`
Expand Down
2 changes: 1 addition & 1 deletion dist/multiselect.global.js
View file

Large diffs are not rendered by default.

46 changes: 32 additions & 14 deletions dist/multiselect.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ function useData (props, context, dep)

// =============== METHODS ==============

const update = (val) => {
const update = (val, triggerInput = true) => {
// Setting object(s) as internal value
iv.value = makeInternal(val);

Expand All @@ -25,8 +25,11 @@ function useData (props, context, dep)
const externalVal = makeExternal(val);

context.emit('change', externalVal, $this);
context.emit('input', externalVal);
context.emit('update:modelValue', externalVal);

if (triggerInput) {
context.emit('input', externalVal);
context.emit('update:modelValue', externalVal);
}
};

// no export
Expand Down Expand Up @@ -210,7 +213,13 @@ function usePointer$1 (props, context, dep)
function normalize (str, strict = true) {
return strict
? String(str).toLowerCase().trim()
: String(str).normalize('NFD').replace(/\p{Diacritic}/gu, '').toLowerCase().trim()
: String(str).toLowerCase()
.normalize('NFD')
.trim()
.replace(new RegExp(/æ/g), 'ae')
.replace(new RegExp(/œ/g), 'oe')
.replace(new RegExp(/ø/g), 'o')
.replace(/\p{Diacritic}/gu, '')
}

function isObject (variable) {
Expand Down Expand Up @@ -577,6 +586,7 @@ function useOptions (props, context, dep)
}

if (isMax()) {
context.emit('max', $this);
return
}

Expand Down Expand Up @@ -605,6 +615,7 @@ function useOptions (props, context, dep)
}

if (isMax()) {
context.emit('max', $this);
return
}

Expand Down Expand Up @@ -715,7 +726,7 @@ function useOptions (props, context, dep)
// no export
const filterGroups = (groups) => {
// If the search has value we need to filter among
// he ones that are visible to the user to avoid
// the ones that are visible to the user to avoid
// displaying groups which technically have options
// based on search but that option is already selected.
return groupHideEmpty.value
Expand Down Expand Up @@ -922,21 +933,21 @@ function useOptions (props, context, dep)

watch(ev, (newValue) => {
if (isNullish(newValue)) {
iv.value = makeInternal(newValue);
update(makeInternal(newValue), false);
return
}

switch (mode.value) {
case 'single':
if (object.value ? newValue[valueProp.value] != iv.value[valueProp.value] : newValue != iv.value[valueProp.value]) {
iv.value = makeInternal(newValue);
update(makeInternal(newValue), false);
}
break

case 'multiple':
case 'tags':
if (!arraysEqual(object.value ? newValue.map(o => o[valueProp.value]) : newValue, iv.value.map(o => o[valueProp.value]))) {
iv.value = makeInternal(newValue);
update(makeInternal(newValue), false);
}
break
}
Expand Down Expand Up @@ -1290,7 +1301,7 @@ function useDropdown (props, context, dep)

function useMultiselect (props, context, dep)
{
const { searchable, disabled } = toRefs(props);
const { searchable, disabled, clearOnBlur } = toRefs(props);

// ============ DEPENDENCIES ============

Expand Down Expand Up @@ -1352,13 +1363,16 @@ function useMultiselect (props, context, dep)
setTimeout(() => {
if (!isActive.value) {
close();
clearSearch();

if (clearOnBlur.value) {
clearSearch();
}
}
}, 1);
};

const handleFocusIn = (e) => {
if (e.target.closest('[data-tags]') || e.target.closest('[data-clear]')) {
if ((e.target.closest('[data-tags]') && e.target.nodeName !== 'INPUT') || e.target.closest('[data-clear]')) {
return
}

Expand All @@ -1383,7 +1397,6 @@ function useMultiselect (props, context, dep)
deactivate();
}, 0);
} else if (document.activeElement.isEqualNode(wrapper.value) && !isOpen.value) {
console.log(e.target.closest('[data-tags]'));
activate();
}

Expand Down Expand Up @@ -2107,7 +2120,7 @@ var script = {
emits: [
'paste', 'open', 'close', 'select', 'deselect',
'input', 'search-change', 'tag', 'option', 'update:modelValue',
'change', 'clear', 'keydown', 'keyup',
'change', 'clear', 'keydown', 'keyup', 'max',
],
props: {
value: {
Expand Down Expand Up @@ -2392,6 +2405,11 @@ var script = {
type: Object,
default: () => ({}),
},
clearOnBlur: {
required: false,
type: Boolean,
default: true,
},
},
setup(props, context)
{
Expand Down Expand Up @@ -2506,7 +2524,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
? (openBlock(), createElementBlock("span", {
key: 0,
class: normalizeClass(_ctx.classList.tagRemove),
onClick: $event => (_ctx.handleTagRemove(option, $event))
onClick: withModifiers($event => (_ctx.handleTagRemove(option, $event)), ["stop"])
}, [
createElementVNode("span", {
class: normalizeClass(_ctx.classList.tagRemoveIcon)
Expand Down
2 changes: 1 addition & 1 deletion dist/multiselect.vue2.global.js
View file

Large diffs are not rendered by default.

45 changes: 32 additions & 13 deletions dist/multiselect.vue2.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ function useData (props, context, dep)

// =============== METHODS ==============

const update = (val) => {
const update = (val, triggerInput = true) => {
// Setting object(s) as internal value
iv.value = makeInternal(val);

Expand All @@ -25,8 +25,11 @@ function useData (props, context, dep)
const externalVal = makeExternal(val);

context.emit('change', externalVal, $this);
context.emit('input', externalVal);
context.emit('update:modelValue', externalVal);

if (triggerInput) {
context.emit('input', externalVal);
context.emit('update:modelValue', externalVal);
}
};

// no export
Expand Down Expand Up @@ -210,7 +213,13 @@ function usePointer$1 (props, context, dep)
function normalize (str, strict = true) {
return strict
? String(str).toLowerCase().trim()
: String(str).normalize('NFD').replace(/\p{Diacritic}/gu, '').toLowerCase().trim()
: String(str).toLowerCase()
.normalize('NFD')
.trim()
.replace(new RegExp(/æ/g), 'ae')
.replace(new RegExp(/œ/g), 'oe')
.replace(new RegExp(/ø/g), 'o')
.replace(/\p{Diacritic}/gu, '')
}

function isObject (variable) {
Expand Down Expand Up @@ -577,6 +586,7 @@ function useOptions (props, context, dep)
}

if (isMax()) {
context.emit('max', $this);
return
}

Expand Down Expand Up @@ -605,6 +615,7 @@ function useOptions (props, context, dep)
}

if (isMax()) {
context.emit('max', $this);
return
}

Expand Down Expand Up @@ -715,7 +726,7 @@ function useOptions (props, context, dep)
// no export
const filterGroups = (groups) => {
// If the search has value we need to filter among
// he ones that are visible to the user to avoid
// the ones that are visible to the user to avoid
// displaying groups which technically have options
// based on search but that option is already selected.
return groupHideEmpty.value
Expand Down Expand Up @@ -922,21 +933,21 @@ function useOptions (props, context, dep)

watch(ev, (newValue) => {
if (isNullish(newValue)) {
iv.value = makeInternal(newValue);
update(makeInternal(newValue), false);
return
}

switch (mode.value) {
case 'single':
if (object.value ? newValue[valueProp.value] != iv.value[valueProp.value] : newValue != iv.value[valueProp.value]) {
iv.value = makeInternal(newValue);
update(makeInternal(newValue), false);
}
break

case 'multiple':
case 'tags':
if (!arraysEqual(object.value ? newValue.map(o => o[valueProp.value]) : newValue, iv.value.map(o => o[valueProp.value]))) {
iv.value = makeInternal(newValue);
update(makeInternal(newValue), false);
}
break
}
Expand Down Expand Up @@ -1290,7 +1301,7 @@ function useDropdown (props, context, dep)

function useMultiselect (props, context, dep)
{
const { searchable, disabled } = toRefs(props);
const { searchable, disabled, clearOnBlur } = toRefs(props);

// ============ DEPENDENCIES ============

Expand Down Expand Up @@ -1352,13 +1363,16 @@ function useMultiselect (props, context, dep)
setTimeout(() => {
if (!isActive.value) {
close();
clearSearch();

if (clearOnBlur.value) {
clearSearch();
}
}
}, 1);
};

const handleFocusIn = (e) => {
if (e.target.closest('[data-tags]') || e.target.closest('[data-clear]')) {
if ((e.target.closest('[data-tags]') && e.target.nodeName !== 'INPUT') || e.target.closest('[data-clear]')) {
return
}

Expand All @@ -1383,7 +1397,6 @@ function useMultiselect (props, context, dep)
deactivate();
}, 0);
} else if (document.activeElement.isEqualNode(wrapper.value) && !isOpen.value) {
console.log(e.target.closest('[data-tags]'));
activate();
}

Expand Down Expand Up @@ -2109,7 +2122,7 @@ function resolveDeps (props, context, features, deps = {}) {
emits: [
'paste', 'open', 'close', 'select', 'deselect',
'input', 'search-change', 'tag', 'option', 'update:modelValue',
'change', 'clear', 'keydown', 'keyup',
'change', 'clear', 'keydown', 'keyup', 'max',
],
props: {
value: {
Expand Down Expand Up @@ -2394,6 +2407,11 @@ function resolveDeps (props, context, features, deps = {}) {
type: Object,
default: () => ({}),
},
clearOnBlur: {
required: false,
type: Boolean,
default: true,
},
},
setup(props, context)
{
Expand Down Expand Up @@ -2633,6 +2651,7 @@ var __vue_render__ = function () {
class: _vm.classList.tagRemove,
on: {
click: function ($event) {
$event.stopPropagation();
return _vm.handleTagRemove(
option,
$event
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@vueform/multiselect",
"version": "2.5.7",
"version": "2.5.8",
"private": false,
"description": "Vue 3 multiselect component with single select, multiselect and tagging options.",
"license": "MIT",
Expand Down

0 comments on commit ecc4ba0

Please sign in to comment.