@mekari/pixel3-autocomplete 0.0.16 → 0.0.17-dev.1
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 +6 -6
- package/dist/autocomplete.d.ts +6 -6
- package/dist/autocomplete.js +14 -7
- package/dist/autocomplete.mjs +2 -2
- package/dist/{chunk-ZNJWEQ3M.mjs → chunk-5TPEEDUH.mjs} +10 -7
- package/dist/{chunk-DMS7A32B.mjs → chunk-R5D752AH.mjs} +6 -2
- package/dist/index.js +14 -7
- package/dist/index.mjs +2 -2
- package/dist/metafile-cjs.json +1 -1
- package/dist/metafile-esm.json +1 -1
- package/dist/modules/autocomplete.hooks.d.mts +0 -1
- package/dist/modules/autocomplete.hooks.d.ts +0 -1
- package/dist/modules/autocomplete.hooks.js +9 -6
- package/dist/modules/autocomplete.hooks.mjs +1 -1
- package/package.json +10 -9
package/dist/autocomplete.d.mts
CHANGED
|
@@ -128,7 +128,7 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
128
128
|
type: vue.PropType<boolean>;
|
|
129
129
|
default: boolean;
|
|
130
130
|
};
|
|
131
|
-
}, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("
|
|
131
|
+
}, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("update:modelValue" | "input" | "change" | "enter" | "scrollEnd" | "buttonAction" | "focus" | "clear")[], "update:modelValue" | "input" | "change" | "enter" | "scrollEnd" | "buttonAction" | "focus" | "clear", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
132
132
|
id: {
|
|
133
133
|
type: vue.PropType<string>;
|
|
134
134
|
default: string;
|
|
@@ -254,14 +254,14 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
254
254
|
default: boolean;
|
|
255
255
|
};
|
|
256
256
|
}>> & {
|
|
257
|
-
onFocus?: ((...args: any[]) => any) | undefined;
|
|
258
|
-
onChange?: ((...args: any[]) => any) | undefined;
|
|
259
|
-
onInput?: ((...args: any[]) => any) | undefined;
|
|
260
|
-
onClear?: ((...args: any[]) => any) | undefined;
|
|
261
257
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
258
|
+
onInput?: ((...args: any[]) => any) | undefined;
|
|
259
|
+
onChange?: ((...args: any[]) => any) | undefined;
|
|
262
260
|
onEnter?: ((...args: any[]) => any) | undefined;
|
|
263
|
-
onButtonAction?: ((...args: any[]) => any) | undefined;
|
|
264
261
|
onScrollEnd?: ((...args: any[]) => any) | undefined;
|
|
262
|
+
onButtonAction?: ((...args: any[]) => any) | undefined;
|
|
263
|
+
onFocus?: ((...args: any[]) => any) | undefined;
|
|
264
|
+
onClear?: ((...args: any[]) => any) | undefined;
|
|
265
265
|
}, {
|
|
266
266
|
id: string;
|
|
267
267
|
data: unknown[];
|
package/dist/autocomplete.d.ts
CHANGED
|
@@ -128,7 +128,7 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
128
128
|
type: vue.PropType<boolean>;
|
|
129
129
|
default: boolean;
|
|
130
130
|
};
|
|
131
|
-
}, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("
|
|
131
|
+
}, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("update:modelValue" | "input" | "change" | "enter" | "scrollEnd" | "buttonAction" | "focus" | "clear")[], "update:modelValue" | "input" | "change" | "enter" | "scrollEnd" | "buttonAction" | "focus" | "clear", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
132
132
|
id: {
|
|
133
133
|
type: vue.PropType<string>;
|
|
134
134
|
default: string;
|
|
@@ -254,14 +254,14 @@ declare const MpAutocomplete: vue.DefineComponent<{
|
|
|
254
254
|
default: boolean;
|
|
255
255
|
};
|
|
256
256
|
}>> & {
|
|
257
|
-
onFocus?: ((...args: any[]) => any) | undefined;
|
|
258
|
-
onChange?: ((...args: any[]) => any) | undefined;
|
|
259
|
-
onInput?: ((...args: any[]) => any) | undefined;
|
|
260
|
-
onClear?: ((...args: any[]) => any) | undefined;
|
|
261
257
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
258
|
+
onInput?: ((...args: any[]) => any) | undefined;
|
|
259
|
+
onChange?: ((...args: any[]) => any) | undefined;
|
|
262
260
|
onEnter?: ((...args: any[]) => any) | undefined;
|
|
263
|
-
onButtonAction?: ((...args: any[]) => any) | undefined;
|
|
264
261
|
onScrollEnd?: ((...args: any[]) => any) | undefined;
|
|
262
|
+
onButtonAction?: ((...args: any[]) => any) | undefined;
|
|
263
|
+
onFocus?: ((...args: any[]) => any) | undefined;
|
|
264
|
+
onClear?: ((...args: any[]) => any) | undefined;
|
|
265
265
|
}, {
|
|
266
266
|
id: string;
|
|
267
267
|
data: unknown[];
|
package/dist/autocomplete.js
CHANGED
|
@@ -175,6 +175,9 @@ function useAutocomplete(props, emit) {
|
|
|
175
175
|
isDisabled
|
|
176
176
|
} = (0, import_vue.toRefs)(props);
|
|
177
177
|
const classes = (0, import_recipes.autocompleteSlotRecipe)();
|
|
178
|
+
const {
|
|
179
|
+
isNextTheme
|
|
180
|
+
} = (0, import_pixel3_utils.usePixelTheme)();
|
|
178
181
|
const scrollEndNode = (0, import_vue.ref)();
|
|
179
182
|
const currentValue = (0, import_vue.ref)();
|
|
180
183
|
const currentLabel = (0, import_vue.ref)("");
|
|
@@ -265,7 +268,7 @@ function useAutocomplete(props, emit) {
|
|
|
265
268
|
__name(onOpenPopover, "onOpenPopover");
|
|
266
269
|
function onBlur() {
|
|
267
270
|
isPopoverOpen.value = false;
|
|
268
|
-
const inputEl = document.getElementById(`${getId}
|
|
271
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
269
272
|
inputEl == null ? void 0 : inputEl.blur();
|
|
270
273
|
if (isInfinityScroll.value) {
|
|
271
274
|
disableIntersectionObserver();
|
|
@@ -318,7 +321,7 @@ function useAutocomplete(props, emit) {
|
|
|
318
321
|
}
|
|
319
322
|
__name(onModelValueChange, "onModelValueChange");
|
|
320
323
|
function handleForceFocusToInput() {
|
|
321
|
-
const inputEl = document.getElementById(`${getId}
|
|
324
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
322
325
|
inputEl == null ? void 0 : inputEl.focus();
|
|
323
326
|
}
|
|
324
327
|
__name(handleForceFocusToInput, "handleForceFocusToInput");
|
|
@@ -460,8 +463,9 @@ function useAutocomplete(props, emit) {
|
|
|
460
463
|
},
|
|
461
464
|
onClear: (e) => {
|
|
462
465
|
onSelectListItem("");
|
|
463
|
-
const inputEl = document.getElementById(`${getId}
|
|
464
|
-
inputEl
|
|
466
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
467
|
+
if (inputEl)
|
|
468
|
+
inputEl.value = "";
|
|
465
469
|
emit("clear", e);
|
|
466
470
|
}
|
|
467
471
|
};
|
|
@@ -471,7 +475,6 @@ function useAutocomplete(props, emit) {
|
|
|
471
475
|
"aria-label": "dropdown button",
|
|
472
476
|
name: "chevrons-down",
|
|
473
477
|
size: "sm",
|
|
474
|
-
color: "gray.400",
|
|
475
478
|
style: {
|
|
476
479
|
cursor: "pointer"
|
|
477
480
|
},
|
|
@@ -490,7 +493,7 @@ function useAutocomplete(props, emit) {
|
|
|
490
493
|
};
|
|
491
494
|
});
|
|
492
495
|
const emptyTextAttrs = {
|
|
493
|
-
color: "gray.400",
|
|
496
|
+
color: isNextTheme ? "text.secondary" : "gray.400",
|
|
494
497
|
class: classes.emptyText
|
|
495
498
|
};
|
|
496
499
|
const contentLoadingAttrs = {
|
|
@@ -547,6 +550,7 @@ __name(useAutocomplete, "useAutocomplete");
|
|
|
547
550
|
// src/autocomplete.tsx
|
|
548
551
|
var import_patterns = require("@mekari/pixel3-styled-system/patterns");
|
|
549
552
|
var import_recipes2 = require("@mekari/pixel3-styled-system/recipes");
|
|
553
|
+
var import_pixel3_utils2 = require("@mekari/pixel3-utils");
|
|
550
554
|
var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
551
555
|
name: "MpAutocomplete",
|
|
552
556
|
inheritAttrs: false,
|
|
@@ -558,6 +562,9 @@ var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
|
558
562
|
attrs
|
|
559
563
|
}) {
|
|
560
564
|
const classes = (0, import_recipes2.autocompleteSlotRecipe)();
|
|
565
|
+
const {
|
|
566
|
+
isNextTheme
|
|
567
|
+
} = (0, import_pixel3_utils2.usePixelTheme)();
|
|
561
568
|
const {
|
|
562
569
|
getSuggestionDatas,
|
|
563
570
|
getGroupSuggestions,
|
|
@@ -594,7 +601,7 @@ var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
|
594
601
|
group
|
|
595
602
|
}) : (0, import_vue2.createVNode)(import_pixel3_text.MpText, {
|
|
596
603
|
"size": "body-small",
|
|
597
|
-
"color": "gray.600",
|
|
604
|
+
"color": isNextTheme.value ? "text.secondary" : "gray.600",
|
|
598
605
|
"class": classes.groupText
|
|
599
606
|
}, {
|
|
600
607
|
default: () => [group.key]
|
package/dist/autocomplete.mjs
CHANGED
|
@@ -4,7 +4,7 @@ import {
|
|
|
4
4
|
|
|
5
5
|
// src/modules/autocomplete.hooks.ts
|
|
6
6
|
import { ref, computed, toRefs, nextTick, watch, onMounted } from "vue";
|
|
7
|
-
import { isDef, isUndef, isElementVisible, scrollToTargetElement, isEqual, isObject, getUniqueId, useIntersectionObserver, groupBy } from "@mekari/pixel3-utils";
|
|
7
|
+
import { isDef, isUndef, isElementVisible, scrollToTargetElement, isEqual, isObject, getUniqueId, useIntersectionObserver, groupBy, usePixelTheme } from "@mekari/pixel3-utils";
|
|
8
8
|
import { autocompleteSlotRecipe } from "@mekari/pixel3-styled-system/recipes";
|
|
9
9
|
function useAutocomplete(props, emit) {
|
|
10
10
|
const {
|
|
@@ -24,6 +24,9 @@ function useAutocomplete(props, emit) {
|
|
|
24
24
|
isDisabled
|
|
25
25
|
} = toRefs(props);
|
|
26
26
|
const classes = autocompleteSlotRecipe();
|
|
27
|
+
const {
|
|
28
|
+
isNextTheme
|
|
29
|
+
} = usePixelTheme();
|
|
27
30
|
const scrollEndNode = ref();
|
|
28
31
|
const currentValue = ref();
|
|
29
32
|
const currentLabel = ref("");
|
|
@@ -114,7 +117,7 @@ function useAutocomplete(props, emit) {
|
|
|
114
117
|
__name(onOpenPopover, "onOpenPopover");
|
|
115
118
|
function onBlur() {
|
|
116
119
|
isPopoverOpen.value = false;
|
|
117
|
-
const inputEl = document.getElementById(`${getId}
|
|
120
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
118
121
|
inputEl == null ? void 0 : inputEl.blur();
|
|
119
122
|
if (isInfinityScroll.value) {
|
|
120
123
|
disableIntersectionObserver();
|
|
@@ -167,7 +170,7 @@ function useAutocomplete(props, emit) {
|
|
|
167
170
|
}
|
|
168
171
|
__name(onModelValueChange, "onModelValueChange");
|
|
169
172
|
function handleForceFocusToInput() {
|
|
170
|
-
const inputEl = document.getElementById(`${getId}
|
|
173
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
171
174
|
inputEl == null ? void 0 : inputEl.focus();
|
|
172
175
|
}
|
|
173
176
|
__name(handleForceFocusToInput, "handleForceFocusToInput");
|
|
@@ -309,8 +312,9 @@ function useAutocomplete(props, emit) {
|
|
|
309
312
|
},
|
|
310
313
|
onClear: (e) => {
|
|
311
314
|
onSelectListItem("");
|
|
312
|
-
const inputEl = document.getElementById(`${getId}
|
|
313
|
-
inputEl
|
|
315
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
316
|
+
if (inputEl)
|
|
317
|
+
inputEl.value = "";
|
|
314
318
|
emit("clear", e);
|
|
315
319
|
}
|
|
316
320
|
};
|
|
@@ -320,7 +324,6 @@ function useAutocomplete(props, emit) {
|
|
|
320
324
|
"aria-label": "dropdown button",
|
|
321
325
|
name: "chevrons-down",
|
|
322
326
|
size: "sm",
|
|
323
|
-
color: "gray.400",
|
|
324
327
|
style: {
|
|
325
328
|
cursor: "pointer"
|
|
326
329
|
},
|
|
@@ -339,7 +342,7 @@ function useAutocomplete(props, emit) {
|
|
|
339
342
|
};
|
|
340
343
|
});
|
|
341
344
|
const emptyTextAttrs = {
|
|
342
|
-
color: "gray.400",
|
|
345
|
+
color: isNextTheme ? "text.secondary" : "gray.400",
|
|
343
346
|
class: classes.emptyText
|
|
344
347
|
};
|
|
345
348
|
const contentLoadingAttrs = {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
useAutocomplete
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-5TPEEDUH.mjs";
|
|
4
4
|
import {
|
|
5
5
|
autocompleteProps
|
|
6
6
|
} from "./chunk-Q7SGQCOH.mjs";
|
|
@@ -15,6 +15,7 @@ import { MpIcon } from "@mekari/pixel3-icon";
|
|
|
15
15
|
import { MpText } from "@mekari/pixel3-text";
|
|
16
16
|
import { flex } from "@mekari/pixel3-styled-system/patterns";
|
|
17
17
|
import { autocompleteSlotRecipe } from "@mekari/pixel3-styled-system/recipes";
|
|
18
|
+
import { usePixelTheme } from "@mekari/pixel3-utils";
|
|
18
19
|
var MpAutocomplete = defineComponent({
|
|
19
20
|
name: "MpAutocomplete",
|
|
20
21
|
inheritAttrs: false,
|
|
@@ -26,6 +27,9 @@ var MpAutocomplete = defineComponent({
|
|
|
26
27
|
attrs
|
|
27
28
|
}) {
|
|
28
29
|
const classes = autocompleteSlotRecipe();
|
|
30
|
+
const {
|
|
31
|
+
isNextTheme
|
|
32
|
+
} = usePixelTheme();
|
|
29
33
|
const {
|
|
30
34
|
getSuggestionDatas,
|
|
31
35
|
getGroupSuggestions,
|
|
@@ -62,7 +66,7 @@ var MpAutocomplete = defineComponent({
|
|
|
62
66
|
group
|
|
63
67
|
}) : _createVNode(MpText, {
|
|
64
68
|
"size": "body-small",
|
|
65
|
-
"color": "gray.600",
|
|
69
|
+
"color": isNextTheme.value ? "text.secondary" : "gray.600",
|
|
66
70
|
"class": classes.groupText
|
|
67
71
|
}, {
|
|
68
72
|
default: () => [group.key]
|
package/dist/index.js
CHANGED
|
@@ -177,6 +177,9 @@ function useAutocomplete(props, emit) {
|
|
|
177
177
|
isDisabled
|
|
178
178
|
} = (0, import_vue.toRefs)(props);
|
|
179
179
|
const classes = (0, import_recipes.autocompleteSlotRecipe)();
|
|
180
|
+
const {
|
|
181
|
+
isNextTheme
|
|
182
|
+
} = (0, import_pixel3_utils.usePixelTheme)();
|
|
180
183
|
const scrollEndNode = (0, import_vue.ref)();
|
|
181
184
|
const currentValue = (0, import_vue.ref)();
|
|
182
185
|
const currentLabel = (0, import_vue.ref)("");
|
|
@@ -267,7 +270,7 @@ function useAutocomplete(props, emit) {
|
|
|
267
270
|
__name(onOpenPopover, "onOpenPopover");
|
|
268
271
|
function onBlur() {
|
|
269
272
|
isPopoverOpen.value = false;
|
|
270
|
-
const inputEl = document.getElementById(`${getId}
|
|
273
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
271
274
|
inputEl == null ? void 0 : inputEl.blur();
|
|
272
275
|
if (isInfinityScroll.value) {
|
|
273
276
|
disableIntersectionObserver();
|
|
@@ -320,7 +323,7 @@ function useAutocomplete(props, emit) {
|
|
|
320
323
|
}
|
|
321
324
|
__name(onModelValueChange, "onModelValueChange");
|
|
322
325
|
function handleForceFocusToInput() {
|
|
323
|
-
const inputEl = document.getElementById(`${getId}
|
|
326
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
324
327
|
inputEl == null ? void 0 : inputEl.focus();
|
|
325
328
|
}
|
|
326
329
|
__name(handleForceFocusToInput, "handleForceFocusToInput");
|
|
@@ -462,8 +465,9 @@ function useAutocomplete(props, emit) {
|
|
|
462
465
|
},
|
|
463
466
|
onClear: (e) => {
|
|
464
467
|
onSelectListItem("");
|
|
465
|
-
const inputEl = document.getElementById(`${getId}
|
|
466
|
-
inputEl
|
|
468
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
469
|
+
if (inputEl)
|
|
470
|
+
inputEl.value = "";
|
|
467
471
|
emit("clear", e);
|
|
468
472
|
}
|
|
469
473
|
};
|
|
@@ -473,7 +477,6 @@ function useAutocomplete(props, emit) {
|
|
|
473
477
|
"aria-label": "dropdown button",
|
|
474
478
|
name: "chevrons-down",
|
|
475
479
|
size: "sm",
|
|
476
|
-
color: "gray.400",
|
|
477
480
|
style: {
|
|
478
481
|
cursor: "pointer"
|
|
479
482
|
},
|
|
@@ -492,7 +495,7 @@ function useAutocomplete(props, emit) {
|
|
|
492
495
|
};
|
|
493
496
|
});
|
|
494
497
|
const emptyTextAttrs = {
|
|
495
|
-
color: "gray.400",
|
|
498
|
+
color: isNextTheme ? "text.secondary" : "gray.400",
|
|
496
499
|
class: classes.emptyText
|
|
497
500
|
};
|
|
498
501
|
const contentLoadingAttrs = {
|
|
@@ -549,6 +552,7 @@ __name(useAutocomplete, "useAutocomplete");
|
|
|
549
552
|
// src/autocomplete.tsx
|
|
550
553
|
var import_patterns = require("@mekari/pixel3-styled-system/patterns");
|
|
551
554
|
var import_recipes2 = require("@mekari/pixel3-styled-system/recipes");
|
|
555
|
+
var import_pixel3_utils2 = require("@mekari/pixel3-utils");
|
|
552
556
|
var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
553
557
|
name: "MpAutocomplete",
|
|
554
558
|
inheritAttrs: false,
|
|
@@ -560,6 +564,9 @@ var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
|
560
564
|
attrs
|
|
561
565
|
}) {
|
|
562
566
|
const classes = (0, import_recipes2.autocompleteSlotRecipe)();
|
|
567
|
+
const {
|
|
568
|
+
isNextTheme
|
|
569
|
+
} = (0, import_pixel3_utils2.usePixelTheme)();
|
|
563
570
|
const {
|
|
564
571
|
getSuggestionDatas,
|
|
565
572
|
getGroupSuggestions,
|
|
@@ -596,7 +603,7 @@ var MpAutocomplete = (0, import_vue3.defineComponent)({
|
|
|
596
603
|
group
|
|
597
604
|
}) : (0, import_vue2.createVNode)(import_pixel3_text.MpText, {
|
|
598
605
|
"size": "body-small",
|
|
599
|
-
"color": "gray.600",
|
|
606
|
+
"color": isNextTheme.value ? "text.secondary" : "gray.600",
|
|
600
607
|
"class": classes.groupText
|
|
601
608
|
}, {
|
|
602
609
|
default: () => [group.key]
|
package/dist/index.mjs
CHANGED
package/dist/metafile-cjs.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":3480,"imports":[],"format":"esm"},"src/modules/autocomplete.hooks.ts":{"bytes":
|
|
1
|
+
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":3480,"imports":[],"format":"esm"},"src/modules/autocomplete.hooks.ts":{"bytes":12667,"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":5127,"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":5506},"src/modules/autocomplete.props.ts":{"bytesInOutput":1882},"src/modules/autocomplete.hooks.ts":{"bytesInOutput":12726}},"bytes":21237},"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":5346},"src/modules/autocomplete.props.ts":{"bytesInOutput":1882},"src/modules/autocomplete.hooks.ts":{"bytesInOutput":12726}},"bytes":21227},"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":12906}},"bytes":13942},"dist/modules/autocomplete.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/autocomplete.props.ts","inputs":{"src/modules/autocomplete.props.ts":{"bytesInOutput":2231}},"bytes":3199}}}
|
package/dist/metafile-esm.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":3480,"imports":[],"format":"esm"},"src/modules/autocomplete.hooks.ts":{"bytes":
|
|
1
|
+
{"inputs":{"src/modules/autocomplete.props.ts":{"bytes":3480,"imports":[],"format":"esm"},"src/modules/autocomplete.hooks.ts":{"bytes":12667,"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":5127,"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-R5D752AH.mjs","kind":"import-statement"},{"path":"dist/chunk-5TPEEDUH.mjs","kind":"import-statement"},{"path":"dist/chunk-Q7SGQCOH.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-R5D752AH.mjs","kind":"import-statement"},{"path":"dist/chunk-5TPEEDUH.mjs","kind":"import-statement"},{"path":"dist/chunk-Q7SGQCOH.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-R5D752AH.mjs":{"imports":[{"path":"dist/chunk-5TPEEDUH.mjs","kind":"import-statement"},{"path":"dist/chunk-Q7SGQCOH.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":4625}},"bytes":4798},"dist/modules/autocomplete.hooks.mjs":{"imports":[{"path":"dist/chunk-5TPEEDUH.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-5TPEEDUH.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":12098}},"bytes":12216},"dist/modules/autocomplete.props.mjs":{"imports":[{"path":"dist/chunk-Q7SGQCOH.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-Q7SGQCOH.mjs":{"imports":[],"exports":["autocompleteEmit","autocompleteProps"],"inputs":{"src/modules/autocomplete.props.ts":{"bytesInOutput":2003}},"bytes":2093},"dist/chunk-QZ7VFGWC.mjs":{"imports":[],"exports":["__name"],"inputs":{},"bytes":151}}}
|
|
@@ -45,6 +45,9 @@ function useAutocomplete(props, emit) {
|
|
|
45
45
|
isDisabled
|
|
46
46
|
} = (0, import_vue.toRefs)(props);
|
|
47
47
|
const classes = (0, import_recipes.autocompleteSlotRecipe)();
|
|
48
|
+
const {
|
|
49
|
+
isNextTheme
|
|
50
|
+
} = (0, import_pixel3_utils.usePixelTheme)();
|
|
48
51
|
const scrollEndNode = (0, import_vue.ref)();
|
|
49
52
|
const currentValue = (0, import_vue.ref)();
|
|
50
53
|
const currentLabel = (0, import_vue.ref)("");
|
|
@@ -135,7 +138,7 @@ function useAutocomplete(props, emit) {
|
|
|
135
138
|
__name(onOpenPopover, "onOpenPopover");
|
|
136
139
|
function onBlur() {
|
|
137
140
|
isPopoverOpen.value = false;
|
|
138
|
-
const inputEl = document.getElementById(`${getId}
|
|
141
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
139
142
|
inputEl == null ? void 0 : inputEl.blur();
|
|
140
143
|
if (isInfinityScroll.value) {
|
|
141
144
|
disableIntersectionObserver();
|
|
@@ -188,7 +191,7 @@ function useAutocomplete(props, emit) {
|
|
|
188
191
|
}
|
|
189
192
|
__name(onModelValueChange, "onModelValueChange");
|
|
190
193
|
function handleForceFocusToInput() {
|
|
191
|
-
const inputEl = document.getElementById(`${getId}
|
|
194
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
192
195
|
inputEl == null ? void 0 : inputEl.focus();
|
|
193
196
|
}
|
|
194
197
|
__name(handleForceFocusToInput, "handleForceFocusToInput");
|
|
@@ -330,8 +333,9 @@ function useAutocomplete(props, emit) {
|
|
|
330
333
|
},
|
|
331
334
|
onClear: (e) => {
|
|
332
335
|
onSelectListItem("");
|
|
333
|
-
const inputEl = document.getElementById(`${getId}
|
|
334
|
-
inputEl
|
|
336
|
+
const inputEl = document.getElementById(`${getId}`);
|
|
337
|
+
if (inputEl)
|
|
338
|
+
inputEl.value = "";
|
|
335
339
|
emit("clear", e);
|
|
336
340
|
}
|
|
337
341
|
};
|
|
@@ -341,7 +345,6 @@ function useAutocomplete(props, emit) {
|
|
|
341
345
|
"aria-label": "dropdown button",
|
|
342
346
|
name: "chevrons-down",
|
|
343
347
|
size: "sm",
|
|
344
|
-
color: "gray.400",
|
|
345
348
|
style: {
|
|
346
349
|
cursor: "pointer"
|
|
347
350
|
},
|
|
@@ -360,7 +363,7 @@ function useAutocomplete(props, emit) {
|
|
|
360
363
|
};
|
|
361
364
|
});
|
|
362
365
|
const emptyTextAttrs = {
|
|
363
|
-
color: "gray.400",
|
|
366
|
+
color: isNextTheme ? "text.secondary" : "gray.400",
|
|
364
367
|
class: classes.emptyText
|
|
365
368
|
};
|
|
366
369
|
const contentLoadingAttrs = {
|
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.
|
|
4
|
+
"version": "0.0.17-dev.1",
|
|
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.1.1",
|
|
12
|
-
"@mekari/pixel3-utils": "0.0.
|
|
13
|
-
"@mekari/pixel3-input": "0.0.
|
|
14
|
-
"@mekari/pixel3-spinner": "0.0.
|
|
15
|
-
"@mekari/pixel3-icon": "0.0.
|
|
16
|
-
"@mekari/pixel3-popover": "0.0.
|
|
17
|
-
"@mekari/pixel3-text": "0.0.
|
|
11
|
+
"@mekari/pixel3-styled-system": "0.1.2-dev.1",
|
|
12
|
+
"@mekari/pixel3-utils": "0.0.7-dev.1",
|
|
13
|
+
"@mekari/pixel3-input": "0.0.17-dev.1",
|
|
14
|
+
"@mekari/pixel3-spinner": "0.0.17-dev.1",
|
|
15
|
+
"@mekari/pixel3-icon": "0.0.17-dev.1",
|
|
16
|
+
"@mekari/pixel3-popover": "0.0.17-dev.1",
|
|
17
|
+
"@mekari/pixel3-text": "0.0.16-dev.1"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"vue": "^3.4.9"
|
|
@@ -41,6 +41,7 @@
|
|
|
41
41
|
"build:types": "tsup src --dts-only",
|
|
42
42
|
"types:check": "tsc --noEmit",
|
|
43
43
|
"replace-config": "clean-package",
|
|
44
|
-
"restore-config": "clean-package restore"
|
|
44
|
+
"restore-config": "clean-package restore",
|
|
45
|
+
"types:vue": "vue-tsc --noEmit"
|
|
45
46
|
}
|
|
46
47
|
}
|