@mekari/pixel3-autocomplete 0.0.25-dev.0 → 0.0.25-dev.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/autocomplete.d.mts +17 -6
- package/dist/autocomplete.d.ts +17 -6
- package/dist/autocomplete.js +12 -5
- package/dist/autocomplete.mjs +3 -3
- package/dist/{chunk-PAF63OPQ.mjs → chunk-OFMZB44N.mjs} +3 -3
- package/dist/{chunk-Q7SGQCOH.mjs → chunk-SXNPFEJZ.mjs} +5 -1
- package/dist/{chunk-56BVVD65.mjs → chunk-SYXFW7Z4.mjs} +7 -4
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +12 -5
- package/dist/index.mjs +3 -3
- package/dist/metafile-cjs.json +1 -1
- package/dist/metafile-esm.json +1 -1
- package/dist/modules/autocomplete.hooks.d.mts +3 -1
- package/dist/modules/autocomplete.hooks.d.ts +3 -1
- package/dist/modules/autocomplete.hooks.js +7 -4
- package/dist/modules/autocomplete.hooks.mjs +1 -1
- package/dist/modules/autocomplete.props.d.mts +6 -1
- package/dist/modules/autocomplete.props.d.ts +6 -1
- package/dist/modules/autocomplete.props.js +5 -1
- package/dist/modules/autocomplete.props.mjs +1 -1
- package/package.json +8 -8
package/dist/autocomplete.d.mts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as vue_jsx_runtime from 'vue/jsx-runtime';
|
|
2
|
+
import * as _mekari_pixel3_input from '@mekari/pixel3-input';
|
|
2
3
|
import * as vue from 'vue';
|
|
3
4
|
import { StringNumberAnyObject } from './modules/autocomplete.props.mjs';
|
|
4
5
|
import '@mekari/pixel3-popover';
|
|
@@ -128,7 +129,11 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
128
129
|
type: vue.PropType<boolean>;
|
|
129
130
|
default: boolean;
|
|
130
131
|
};
|
|
131
|
-
|
|
132
|
+
inputVariant: {
|
|
133
|
+
type: vue.PropType<_mekari_pixel3_input.InputVariant>;
|
|
134
|
+
default: string;
|
|
135
|
+
};
|
|
136
|
+
}, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("buttonAction" | "input" | "clear" | "update:modelValue" | "change" | "enter" | "scrollEnd" | "focus" | "blur")[], "buttonAction" | "input" | "clear" | "update:modelValue" | "change" | "enter" | "scrollEnd" | "focus" | "blur", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
132
137
|
id: {
|
|
133
138
|
type: vue.PropType<string>;
|
|
134
139
|
default: string;
|
|
@@ -253,15 +258,20 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
253
258
|
type: vue.PropType<boolean>;
|
|
254
259
|
default: boolean;
|
|
255
260
|
};
|
|
261
|
+
inputVariant: {
|
|
262
|
+
type: vue.PropType<_mekari_pixel3_input.InputVariant>;
|
|
263
|
+
default: string;
|
|
264
|
+
};
|
|
256
265
|
}>> & {
|
|
257
|
-
|
|
258
|
-
|
|
266
|
+
onFocus?: ((...args: any[]) => any) | undefined;
|
|
267
|
+
onBlur?: ((...args: any[]) => any) | undefined;
|
|
259
268
|
onChange?: ((...args: any[]) => any) | undefined;
|
|
269
|
+
onInput?: ((...args: any[]) => any) | undefined;
|
|
270
|
+
onClear?: ((...args: any[]) => any) | undefined;
|
|
271
|
+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
260
272
|
onEnter?: ((...args: any[]) => any) | undefined;
|
|
261
|
-
onScrollEnd?: ((...args: any[]) => any) | undefined;
|
|
262
273
|
onButtonAction?: ((...args: any[]) => any) | undefined;
|
|
263
|
-
|
|
264
|
-
onClear?: ((...args: any[]) => any) | undefined;
|
|
274
|
+
onScrollEnd?: ((...args: any[]) => any) | undefined;
|
|
265
275
|
}, {
|
|
266
276
|
id: string;
|
|
267
277
|
data: unknown[];
|
|
@@ -289,6 +299,7 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
289
299
|
isRawValue: boolean;
|
|
290
300
|
isKeepAlive: boolean;
|
|
291
301
|
isAdaptiveWidth: boolean;
|
|
302
|
+
inputVariant: _mekari_pixel3_input.InputVariant;
|
|
292
303
|
}, {}>;
|
|
293
304
|
|
|
294
305
|
export { MpAutocomplete };
|
package/dist/autocomplete.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as vue_jsx_runtime from 'vue/jsx-runtime';
|
|
2
|
+
import * as _mekari_pixel3_input from '@mekari/pixel3-input';
|
|
2
3
|
import * as vue from 'vue';
|
|
3
4
|
import { StringNumberAnyObject } from './modules/autocomplete.props.js';
|
|
4
5
|
import '@mekari/pixel3-popover';
|
|
@@ -128,7 +129,11 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
128
129
|
type: vue.PropType<boolean>;
|
|
129
130
|
default: boolean;
|
|
130
131
|
};
|
|
131
|
-
|
|
132
|
+
inputVariant: {
|
|
133
|
+
type: vue.PropType<_mekari_pixel3_input.InputVariant>;
|
|
134
|
+
default: string;
|
|
135
|
+
};
|
|
136
|
+
}, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("buttonAction" | "input" | "clear" | "update:modelValue" | "change" | "enter" | "scrollEnd" | "focus" | "blur")[], "buttonAction" | "input" | "clear" | "update:modelValue" | "change" | "enter" | "scrollEnd" | "focus" | "blur", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
132
137
|
id: {
|
|
133
138
|
type: vue.PropType<string>;
|
|
134
139
|
default: string;
|
|
@@ -253,15 +258,20 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
253
258
|
type: vue.PropType<boolean>;
|
|
254
259
|
default: boolean;
|
|
255
260
|
};
|
|
261
|
+
inputVariant: {
|
|
262
|
+
type: vue.PropType<_mekari_pixel3_input.InputVariant>;
|
|
263
|
+
default: string;
|
|
264
|
+
};
|
|
256
265
|
}>> & {
|
|
257
|
-
|
|
258
|
-
|
|
266
|
+
onFocus?: ((...args: any[]) => any) | undefined;
|
|
267
|
+
onBlur?: ((...args: any[]) => any) | undefined;
|
|
259
268
|
onChange?: ((...args: any[]) => any) | undefined;
|
|
269
|
+
onInput?: ((...args: any[]) => any) | undefined;
|
|
270
|
+
onClear?: ((...args: any[]) => any) | undefined;
|
|
271
|
+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
260
272
|
onEnter?: ((...args: any[]) => any) | undefined;
|
|
261
|
-
onScrollEnd?: ((...args: any[]) => any) | undefined;
|
|
262
273
|
onButtonAction?: ((...args: any[]) => any) | undefined;
|
|
263
|
-
|
|
264
|
-
onClear?: ((...args: any[]) => any) | undefined;
|
|
274
|
+
onScrollEnd?: ((...args: any[]) => any) | undefined;
|
|
265
275
|
}, {
|
|
266
276
|
id: string;
|
|
267
277
|
data: unknown[];
|
|
@@ -289,6 +299,7 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
289
299
|
isRawValue: boolean;
|
|
290
300
|
isKeepAlive: boolean;
|
|
291
301
|
isAdaptiveWidth: boolean;
|
|
302
|
+
inputVariant: _mekari_pixel3_input.InputVariant;
|
|
292
303
|
}, {}>;
|
|
293
304
|
|
|
294
305
|
export { MpAutocomplete };
|
package/dist/autocomplete.js
CHANGED
|
@@ -150,6 +150,10 @@ var autocompleteProps = {
|
|
|
150
150
|
isAdaptiveWidth: {
|
|
151
151
|
type: Boolean,
|
|
152
152
|
default: true
|
|
153
|
+
},
|
|
154
|
+
inputVariant: {
|
|
155
|
+
type: String,
|
|
156
|
+
default: "outline"
|
|
153
157
|
}
|
|
154
158
|
};
|
|
155
159
|
|
|
@@ -172,7 +176,8 @@ function useAutocomplete(props, emit) {
|
|
|
172
176
|
placeholder,
|
|
173
177
|
isAdaptiveWidth,
|
|
174
178
|
isInvalid,
|
|
175
|
-
isDisabled
|
|
179
|
+
isDisabled,
|
|
180
|
+
inputVariant
|
|
176
181
|
} = (0, import_vue.toRefs)(props);
|
|
177
182
|
const classes = (0, import_recipes.autocompleteSlotRecipe)();
|
|
178
183
|
const {
|
|
@@ -267,7 +272,7 @@ function useAutocomplete(props, emit) {
|
|
|
267
272
|
}
|
|
268
273
|
}
|
|
269
274
|
__name(onOpenPopover, "onOpenPopover");
|
|
270
|
-
function onBlur() {
|
|
275
|
+
function onBlur(e) {
|
|
271
276
|
var _a, _b;
|
|
272
277
|
isPopoverOpen.value = false;
|
|
273
278
|
(_b = (_a = inputNode == null ? void 0 : inputNode.value) == null ? void 0 : _a.$el.childNodes[0]) == null ? void 0 : _b.blur();
|
|
@@ -276,6 +281,7 @@ function useAutocomplete(props, emit) {
|
|
|
276
281
|
if (isInfinityScroll.value) {
|
|
277
282
|
disableIntersectionObserver();
|
|
278
283
|
}
|
|
284
|
+
emit("blur", e);
|
|
279
285
|
}
|
|
280
286
|
__name(onBlur, "onBlur");
|
|
281
287
|
function onInputChange(e) {
|
|
@@ -474,12 +480,13 @@ function useAutocomplete(props, emit) {
|
|
|
474
480
|
placeholder: placeholder == null ? void 0 : placeholder.value,
|
|
475
481
|
isInvalid: isInvalid.value,
|
|
476
482
|
isDisabled: isDisabled.value,
|
|
483
|
+
variant: inputVariant.value,
|
|
477
484
|
onInput: onInputChange,
|
|
478
485
|
onKeydown,
|
|
479
486
|
onFocus: onOpenPopover,
|
|
480
|
-
onBlur: () => {
|
|
487
|
+
onBlur: (e) => {
|
|
481
488
|
if (isOutside.value) {
|
|
482
|
-
onBlur();
|
|
489
|
+
onBlur(e);
|
|
483
490
|
}
|
|
484
491
|
},
|
|
485
492
|
onClear: (e) => {
|
|
@@ -575,7 +582,7 @@ var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
|
575
582
|
name: "MpAutocomplete",
|
|
576
583
|
inheritAttrs: false,
|
|
577
584
|
props: autocompleteProps,
|
|
578
|
-
emits: ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "clear"],
|
|
585
|
+
emits: ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "blur", "clear"],
|
|
579
586
|
setup(props, {
|
|
580
587
|
emit,
|
|
581
588
|
slots,
|
package/dist/autocomplete.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import {
|
|
2
2
|
MpAutocomplete
|
|
3
|
-
} from "./chunk-
|
|
4
|
-
import "./chunk-
|
|
5
|
-
import "./chunk-
|
|
3
|
+
} from "./chunk-OFMZB44N.mjs";
|
|
4
|
+
import "./chunk-SYXFW7Z4.mjs";
|
|
5
|
+
import "./chunk-SXNPFEJZ.mjs";
|
|
6
6
|
import "./chunk-QZ7VFGWC.mjs";
|
|
7
7
|
export {
|
|
8
8
|
MpAutocomplete
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import {
|
|
2
2
|
useAutocomplete
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-SYXFW7Z4.mjs";
|
|
4
4
|
import {
|
|
5
5
|
autocompleteProps
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-SXNPFEJZ.mjs";
|
|
7
7
|
|
|
8
8
|
// src/autocomplete.tsx
|
|
9
9
|
import { mergeProps as _mergeProps, createTextVNode as _createTextVNode, createVNode as _createVNode } from "vue";
|
|
@@ -20,7 +20,7 @@ var MpAutocomplete = defineComponent({
|
|
|
20
20
|
name: "MpAutocomplete",
|
|
21
21
|
inheritAttrs: false,
|
|
22
22
|
props: autocompleteProps,
|
|
23
|
-
emits: ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "clear"],
|
|
23
|
+
emits: ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "blur", "clear"],
|
|
24
24
|
setup(props, {
|
|
25
25
|
emit,
|
|
26
26
|
slots,
|
|
@@ -116,9 +116,13 @@ var autocompleteProps = {
|
|
|
116
116
|
isAdaptiveWidth: {
|
|
117
117
|
type: Boolean,
|
|
118
118
|
default: true
|
|
119
|
+
},
|
|
120
|
+
inputVariant: {
|
|
121
|
+
type: String,
|
|
122
|
+
default: "outline"
|
|
119
123
|
}
|
|
120
124
|
};
|
|
121
|
-
var autocompleteEmit = ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "clear"];
|
|
125
|
+
var autocompleteEmit = ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "blur", "clear"];
|
|
122
126
|
|
|
123
127
|
export {
|
|
124
128
|
autocompleteProps,
|
|
@@ -21,7 +21,8 @@ function useAutocomplete(props, emit) {
|
|
|
21
21
|
placeholder,
|
|
22
22
|
isAdaptiveWidth,
|
|
23
23
|
isInvalid,
|
|
24
|
-
isDisabled
|
|
24
|
+
isDisabled,
|
|
25
|
+
inputVariant
|
|
25
26
|
} = toRefs(props);
|
|
26
27
|
const classes = autocompleteSlotRecipe();
|
|
27
28
|
const {
|
|
@@ -116,7 +117,7 @@ function useAutocomplete(props, emit) {
|
|
|
116
117
|
}
|
|
117
118
|
}
|
|
118
119
|
__name(onOpenPopover, "onOpenPopover");
|
|
119
|
-
function onBlur() {
|
|
120
|
+
function onBlur(e) {
|
|
120
121
|
var _a, _b;
|
|
121
122
|
isPopoverOpen.value = false;
|
|
122
123
|
(_b = (_a = inputNode == null ? void 0 : inputNode.value) == null ? void 0 : _a.$el.childNodes[0]) == null ? void 0 : _b.blur();
|
|
@@ -125,6 +126,7 @@ function useAutocomplete(props, emit) {
|
|
|
125
126
|
if (isInfinityScroll.value) {
|
|
126
127
|
disableIntersectionObserver();
|
|
127
128
|
}
|
|
129
|
+
emit("blur", e);
|
|
128
130
|
}
|
|
129
131
|
__name(onBlur, "onBlur");
|
|
130
132
|
function onInputChange(e) {
|
|
@@ -323,12 +325,13 @@ function useAutocomplete(props, emit) {
|
|
|
323
325
|
placeholder: placeholder == null ? void 0 : placeholder.value,
|
|
324
326
|
isInvalid: isInvalid.value,
|
|
325
327
|
isDisabled: isDisabled.value,
|
|
328
|
+
variant: inputVariant.value,
|
|
326
329
|
onInput: onInputChange,
|
|
327
330
|
onKeydown,
|
|
328
331
|
onFocus: onOpenPopover,
|
|
329
|
-
onBlur: () => {
|
|
332
|
+
onBlur: (e) => {
|
|
330
333
|
if (isOutside.value) {
|
|
331
|
-
onBlur();
|
|
334
|
+
onBlur(e);
|
|
332
335
|
}
|
|
333
336
|
},
|
|
334
337
|
onClear: (e) => {
|
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -152,6 +152,10 @@ var autocompleteProps = {
|
|
|
152
152
|
isAdaptiveWidth: {
|
|
153
153
|
type: Boolean,
|
|
154
154
|
default: true
|
|
155
|
+
},
|
|
156
|
+
inputVariant: {
|
|
157
|
+
type: String,
|
|
158
|
+
default: "outline"
|
|
155
159
|
}
|
|
156
160
|
};
|
|
157
161
|
|
|
@@ -174,7 +178,8 @@ function useAutocomplete(props, emit) {
|
|
|
174
178
|
placeholder,
|
|
175
179
|
isAdaptiveWidth,
|
|
176
180
|
isInvalid,
|
|
177
|
-
isDisabled
|
|
181
|
+
isDisabled,
|
|
182
|
+
inputVariant
|
|
178
183
|
} = (0, import_vue.toRefs)(props);
|
|
179
184
|
const classes = (0, import_recipes.autocompleteSlotRecipe)();
|
|
180
185
|
const {
|
|
@@ -269,7 +274,7 @@ function useAutocomplete(props, emit) {
|
|
|
269
274
|
}
|
|
270
275
|
}
|
|
271
276
|
__name(onOpenPopover, "onOpenPopover");
|
|
272
|
-
function onBlur() {
|
|
277
|
+
function onBlur(e) {
|
|
273
278
|
var _a, _b;
|
|
274
279
|
isPopoverOpen.value = false;
|
|
275
280
|
(_b = (_a = inputNode == null ? void 0 : inputNode.value) == null ? void 0 : _a.$el.childNodes[0]) == null ? void 0 : _b.blur();
|
|
@@ -278,6 +283,7 @@ function useAutocomplete(props, emit) {
|
|
|
278
283
|
if (isInfinityScroll.value) {
|
|
279
284
|
disableIntersectionObserver();
|
|
280
285
|
}
|
|
286
|
+
emit("blur", e);
|
|
281
287
|
}
|
|
282
288
|
__name(onBlur, "onBlur");
|
|
283
289
|
function onInputChange(e) {
|
|
@@ -476,12 +482,13 @@ function useAutocomplete(props, emit) {
|
|
|
476
482
|
placeholder: placeholder == null ? void 0 : placeholder.value,
|
|
477
483
|
isInvalid: isInvalid.value,
|
|
478
484
|
isDisabled: isDisabled.value,
|
|
485
|
+
variant: inputVariant.value,
|
|
479
486
|
onInput: onInputChange,
|
|
480
487
|
onKeydown,
|
|
481
488
|
onFocus: onOpenPopover,
|
|
482
|
-
onBlur: () => {
|
|
489
|
+
onBlur: (e) => {
|
|
483
490
|
if (isOutside.value) {
|
|
484
|
-
onBlur();
|
|
491
|
+
onBlur(e);
|
|
485
492
|
}
|
|
486
493
|
},
|
|
487
494
|
onClear: (e) => {
|
|
@@ -577,7 +584,7 @@ var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
|
577
584
|
name: "MpAutocomplete",
|
|
578
585
|
inheritAttrs: false,
|
|
579
586
|
props: autocompleteProps,
|
|
580
|
-
emits: ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "clear"],
|
|
587
|
+
emits: ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "blur", "clear"],
|
|
581
588
|
setup(props, {
|
|
582
589
|
emit,
|
|
583
590
|
slots,
|
package/dist/index.mjs
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import {
|
|
2
2
|
MpAutocomplete
|
|
3
|
-
} from "./chunk-
|
|
4
|
-
import "./chunk-
|
|
5
|
-
import "./chunk-
|
|
3
|
+
} from "./chunk-OFMZB44N.mjs";
|
|
4
|
+
import "./chunk-SYXFW7Z4.mjs";
|
|
5
|
+
import "./chunk-SXNPFEJZ.mjs";
|
|
6
6
|
import "./chunk-QZ7VFGWC.mjs";
|
|
7
7
|
export {
|
|
8
8
|
MpAutocomplete
|
package/dist/metafile-cjs.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":
|
|
1
|
+
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":3638,"imports":[],"format":"esm"},"src/modules/autocomplete.hooks.ts":{"bytes":13320,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-utils","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/autocomplete.tsx":{"bytes":5034,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-popover","kind":"import-statement","external":true},{"path":"@mekari/pixel3-input","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"src/modules/autocomplete.props.ts","kind":"import-statement","original":"./modules/autocomplete.props"},{"path":"src/modules/autocomplete.hooks.ts","kind":"import-statement","original":"./modules/autocomplete.hooks"},{"path":"@mekari/pixel3-styled-system/patterns","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-utils","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":133,"imports":[{"path":"src/autocomplete.tsx","kind":"import-statement","original":"./autocomplete"}],"format":"esm"}},"outputs":{"dist/autocomplete.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-popover","kind":"require-call","external":true},{"path":"@mekari/pixel3-input","kind":"require-call","external":true},{"path":"@mekari/pixel3-spinner","kind":"require-call","external":true},{"path":"@mekari/pixel3-icon","kind":"require-call","external":true},{"path":"@mekari/pixel3-text","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-utils","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/patterns","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-utils","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/autocomplete.tsx","inputs":{"src/autocomplete.tsx":{"bytesInOutput":5446},"src/modules/autocomplete.props.ts":{"bytesInOutput":1946},"src/modules/autocomplete.hooks.ts":{"bytesInOutput":13748}},"bytes":22263},"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-popover","kind":"require-call","external":true},{"path":"@mekari/pixel3-input","kind":"require-call","external":true},{"path":"@mekari/pixel3-spinner","kind":"require-call","external":true},{"path":"@mekari/pixel3-icon","kind":"require-call","external":true},{"path":"@mekari/pixel3-text","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-utils","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/patterns","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-utils","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":133},"src/autocomplete.tsx":{"bytesInOutput":5286},"src/modules/autocomplete.props.ts":{"bytesInOutput":1946},"src/modules/autocomplete.hooks.ts":{"bytesInOutput":13748}},"bytes":22253},"dist/modules/autocomplete.hooks.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-utils","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/modules/autocomplete.hooks.ts","inputs":{"src/modules/autocomplete.hooks.ts":{"bytesInOutput":13928}},"bytes":14964},"dist/modules/autocomplete.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/autocomplete.props.ts","inputs":{"src/modules/autocomplete.props.ts":{"bytesInOutput":2303}},"bytes":3271}}}
|
package/dist/metafile-esm.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":
|
|
1
|
+
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":3638,"imports":[],"format":"esm"},"src/modules/autocomplete.hooks.ts":{"bytes":13320,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-utils","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/autocomplete.tsx":{"bytes":5034,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-popover","kind":"import-statement","external":true},{"path":"@mekari/pixel3-input","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"src/modules/autocomplete.props.ts","kind":"import-statement","original":"./modules/autocomplete.props"},{"path":"src/modules/autocomplete.hooks.ts","kind":"import-statement","original":"./modules/autocomplete.hooks"},{"path":"@mekari/pixel3-styled-system/patterns","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-utils","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":133,"imports":[{"path":"src/autocomplete.tsx","kind":"import-statement","original":"./autocomplete"}],"format":"esm"}},"outputs":{"dist/autocomplete.mjs":{"imports":[{"path":"dist/chunk-OFMZB44N.mjs","kind":"import-statement"},{"path":"dist/chunk-SYXFW7Z4.mjs","kind":"import-statement"},{"path":"dist/chunk-SXNPFEJZ.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["MpAutocomplete"],"entryPoint":"src/autocomplete.tsx","inputs":{},"bytes":179},"dist/index.mjs":{"imports":[{"path":"dist/chunk-OFMZB44N.mjs","kind":"import-statement"},{"path":"dist/chunk-SYXFW7Z4.mjs","kind":"import-statement"},{"path":"dist/chunk-SXNPFEJZ.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["MpAutocomplete"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":0}},"bytes":179},"dist/chunk-OFMZB44N.mjs":{"imports":[{"path":"dist/chunk-SYXFW7Z4.mjs","kind":"import-statement"},{"path":"dist/chunk-SXNPFEJZ.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-popover","kind":"import-statement","external":true},{"path":"@mekari/pixel3-input","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-text","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/patterns","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-utils","kind":"import-statement","external":true}],"exports":["MpAutocomplete"],"inputs":{"src/autocomplete.tsx":{"bytesInOutput":4597}},"bytes":4770},"dist/modules/autocomplete.hooks.mjs":{"imports":[{"path":"dist/chunk-SYXFW7Z4.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["useAutocomplete"],"entryPoint":"src/modules/autocomplete.hooks.ts","inputs":{},"bytes":121},"dist/chunk-SYXFW7Z4.mjs":{"imports":[{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-utils","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true}],"exports":["useAutocomplete"],"inputs":{"src/modules/autocomplete.hooks.ts":{"bytesInOutput":13104}},"bytes":13222},"dist/modules/autocomplete.props.mjs":{"imports":[{"path":"dist/chunk-SXNPFEJZ.mjs","kind":"import-statement"},{"path":"dist/chunk-QZ7VFGWC.mjs","kind":"import-statement"}],"exports":["autocompleteEmit","autocompleteProps"],"entryPoint":"src/modules/autocomplete.props.ts","inputs":{},"bytes":165},"dist/chunk-SXNPFEJZ.mjs":{"imports":[],"exports":["autocompleteEmit","autocompleteProps"],"inputs":{"src/modules/autocomplete.props.ts":{"bytesInOutput":2075}},"bytes":2165},"dist/chunk-QZ7VFGWC.mjs":{"imports":[],"exports":["__name"],"inputs":{},"bytes":151}}}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as _mekari_pixel3_input from '@mekari/pixel3-input';
|
|
1
2
|
import * as vue from 'vue';
|
|
2
3
|
import { HTMLAttributes } from 'vue';
|
|
3
4
|
import { AutocompleteProps, AutocompleteEmits, StringNumberAnyObject } from './autocomplete.props.mjs';
|
|
@@ -41,10 +42,11 @@ declare function useAutocomplete(props: AutocompleteProps, emit: AutocompleteEmi
|
|
|
41
42
|
placeholder: string | undefined;
|
|
42
43
|
isInvalid: boolean;
|
|
43
44
|
isDisabled: boolean;
|
|
45
|
+
variant: _mekari_pixel3_input.InputVariant;
|
|
44
46
|
onInput: (e: Event) => void;
|
|
45
47
|
onKeydown: (e: KeyboardEvent) => void;
|
|
46
48
|
onFocus: (e: Event) => void;
|
|
47
|
-
onBlur: () => void;
|
|
49
|
+
onBlur: (e: Event) => void;
|
|
48
50
|
onClear: (e: Event) => void;
|
|
49
51
|
}>;
|
|
50
52
|
iconChevronsDownAttrs: vue.ComputedRef<{
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as _mekari_pixel3_input from '@mekari/pixel3-input';
|
|
1
2
|
import * as vue from 'vue';
|
|
2
3
|
import { HTMLAttributes } from 'vue';
|
|
3
4
|
import { AutocompleteProps, AutocompleteEmits, StringNumberAnyObject } from './autocomplete.props.js';
|
|
@@ -41,10 +42,11 @@ declare function useAutocomplete(props: AutocompleteProps, emit: AutocompleteEmi
|
|
|
41
42
|
placeholder: string | undefined;
|
|
42
43
|
isInvalid: boolean;
|
|
43
44
|
isDisabled: boolean;
|
|
45
|
+
variant: _mekari_pixel3_input.InputVariant;
|
|
44
46
|
onInput: (e: Event) => void;
|
|
45
47
|
onKeydown: (e: KeyboardEvent) => void;
|
|
46
48
|
onFocus: (e: Event) => void;
|
|
47
|
-
onBlur: () => void;
|
|
49
|
+
onBlur: (e: Event) => void;
|
|
48
50
|
onClear: (e: Event) => void;
|
|
49
51
|
}>;
|
|
50
52
|
iconChevronsDownAttrs: vue.ComputedRef<{
|
|
@@ -42,7 +42,8 @@ function useAutocomplete(props, emit) {
|
|
|
42
42
|
placeholder,
|
|
43
43
|
isAdaptiveWidth,
|
|
44
44
|
isInvalid,
|
|
45
|
-
isDisabled
|
|
45
|
+
isDisabled,
|
|
46
|
+
inputVariant
|
|
46
47
|
} = (0, import_vue.toRefs)(props);
|
|
47
48
|
const classes = (0, import_recipes.autocompleteSlotRecipe)();
|
|
48
49
|
const {
|
|
@@ -137,7 +138,7 @@ function useAutocomplete(props, emit) {
|
|
|
137
138
|
}
|
|
138
139
|
}
|
|
139
140
|
__name(onOpenPopover, "onOpenPopover");
|
|
140
|
-
function onBlur() {
|
|
141
|
+
function onBlur(e) {
|
|
141
142
|
var _a, _b;
|
|
142
143
|
isPopoverOpen.value = false;
|
|
143
144
|
(_b = (_a = inputNode == null ? void 0 : inputNode.value) == null ? void 0 : _a.$el.childNodes[0]) == null ? void 0 : _b.blur();
|
|
@@ -146,6 +147,7 @@ function useAutocomplete(props, emit) {
|
|
|
146
147
|
if (isInfinityScroll.value) {
|
|
147
148
|
disableIntersectionObserver();
|
|
148
149
|
}
|
|
150
|
+
emit("blur", e);
|
|
149
151
|
}
|
|
150
152
|
__name(onBlur, "onBlur");
|
|
151
153
|
function onInputChange(e) {
|
|
@@ -344,12 +346,13 @@ function useAutocomplete(props, emit) {
|
|
|
344
346
|
placeholder: placeholder == null ? void 0 : placeholder.value,
|
|
345
347
|
isInvalid: isInvalid.value,
|
|
346
348
|
isDisabled: isDisabled.value,
|
|
349
|
+
variant: inputVariant.value,
|
|
347
350
|
onInput: onInputChange,
|
|
348
351
|
onKeydown,
|
|
349
352
|
onFocus: onOpenPopover,
|
|
350
|
-
onBlur: () => {
|
|
353
|
+
onBlur: (e) => {
|
|
351
354
|
if (isOutside.value) {
|
|
352
|
-
onBlur();
|
|
355
|
+
onBlur(e);
|
|
353
356
|
}
|
|
354
357
|
},
|
|
355
358
|
onClear: (e) => {
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { PropType, ExtractPropTypes } from 'vue';
|
|
2
2
|
import { PopoverContentProps } from '@mekari/pixel3-popover';
|
|
3
|
+
import { InputVariant } from '@mekari/pixel3-input';
|
|
3
4
|
|
|
4
5
|
type PopoverContentAttrs = {
|
|
5
6
|
class?: unknown;
|
|
@@ -128,8 +129,12 @@ declare const autocompleteProps: {
|
|
|
128
129
|
type: PropType<boolean>;
|
|
129
130
|
default: boolean;
|
|
130
131
|
};
|
|
132
|
+
inputVariant: {
|
|
133
|
+
type: PropType<InputVariant>;
|
|
134
|
+
default: string;
|
|
135
|
+
};
|
|
131
136
|
};
|
|
132
|
-
declare const autocompleteEmit: readonly ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "clear"];
|
|
137
|
+
declare const autocompleteEmit: readonly ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "blur", "clear"];
|
|
133
138
|
type AutocompleteProps = ExtractPropTypes<typeof autocompleteProps>;
|
|
134
139
|
type AutocompleteEmits = (e: (typeof autocompleteEmit)[number], value?: unknown, value2?: unknown) => void;
|
|
135
140
|
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { PropType, ExtractPropTypes } from 'vue';
|
|
2
2
|
import { PopoverContentProps } from '@mekari/pixel3-popover';
|
|
3
|
+
import { InputVariant } from '@mekari/pixel3-input';
|
|
3
4
|
|
|
4
5
|
type PopoverContentAttrs = {
|
|
5
6
|
class?: unknown;
|
|
@@ -128,8 +129,12 @@ declare const autocompleteProps: {
|
|
|
128
129
|
type: PropType<boolean>;
|
|
129
130
|
default: boolean;
|
|
130
131
|
};
|
|
132
|
+
inputVariant: {
|
|
133
|
+
type: PropType<InputVariant>;
|
|
134
|
+
default: string;
|
|
135
|
+
};
|
|
131
136
|
};
|
|
132
|
-
declare const autocompleteEmit: readonly ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "clear"];
|
|
137
|
+
declare const autocompleteEmit: readonly ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "blur", "clear"];
|
|
133
138
|
type AutocompleteProps = ExtractPropTypes<typeof autocompleteProps>;
|
|
134
139
|
type AutocompleteEmits = (e: (typeof autocompleteEmit)[number], value?: unknown, value2?: unknown) => void;
|
|
135
140
|
|
|
@@ -141,9 +141,13 @@ var autocompleteProps = {
|
|
|
141
141
|
isAdaptiveWidth: {
|
|
142
142
|
type: Boolean,
|
|
143
143
|
default: true
|
|
144
|
+
},
|
|
145
|
+
inputVariant: {
|
|
146
|
+
type: String,
|
|
147
|
+
default: "outline"
|
|
144
148
|
}
|
|
145
149
|
};
|
|
146
|
-
var autocompleteEmit = ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "clear"];
|
|
150
|
+
var autocompleteEmit = ["update:modelValue", "input", "change", "enter", "scrollEnd", "buttonAction", "focus", "blur", "clear"];
|
|
147
151
|
// Annotate the CommonJS export names for ESM import in node:
|
|
148
152
|
0 && (module.exports = {
|
|
149
153
|
autocompleteEmit,
|
package/package.json
CHANGED
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mekari/pixel3-autocomplete",
|
|
3
3
|
"description": "Autocomplete component for mekari pixel 3",
|
|
4
|
-
"version": "0.0.25-dev.
|
|
4
|
+
"version": "0.0.25-dev.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"files": [
|
|
8
8
|
"dist"
|
|
9
9
|
],
|
|
10
10
|
"dependencies": {
|
|
11
|
-
"@mekari/pixel3-styled-system": "0.2.0-dev.
|
|
12
|
-
"@mekari/pixel3-
|
|
13
|
-
"@mekari/pixel3-
|
|
14
|
-
"@mekari/pixel3-
|
|
15
|
-
"@mekari/pixel3-
|
|
16
|
-
"@mekari/pixel3-popover": "0.0.25-dev.
|
|
17
|
-
"@mekari/pixel3-text": "0.0.22-dev.
|
|
11
|
+
"@mekari/pixel3-styled-system": "0.2.0-dev.1",
|
|
12
|
+
"@mekari/pixel3-input": "0.0.25-dev.1",
|
|
13
|
+
"@mekari/pixel3-utils": "0.1.0-dev.1",
|
|
14
|
+
"@mekari/pixel3-icon": "0.1.1-dev.1",
|
|
15
|
+
"@mekari/pixel3-spinner": "0.0.25-dev.1",
|
|
16
|
+
"@mekari/pixel3-popover": "0.0.25-dev.1",
|
|
17
|
+
"@mekari/pixel3-text": "0.0.22-dev.1"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"vue": "^3.4.9"
|