@rotki/ui-library 2.20.1 → 2.20.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/components/forms/select/RuiMenuSelect.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/composables/forms/auto-complete/keyboard-navigation.js +26 -24
- package/dist/composables/forms/auto-complete/keyboard-navigation.js.map +1 -1
- package/dist/web-types.json +1 -1
- package/package.json +1 -1
package/dist/components/forms/select/RuiMenuSelect.vue_vue_type_script_setup_true_lang.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RuiMenuSelect.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../../src/components/forms/select/RuiMenuSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport { menuSelectStyles, type MenuSelectVariant } from '@/components/forms/select/menu-select-styles';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu, { type MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { type KeyOfType, useDropdownMenu } from '@/composables/dropdown-menu';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiMenuSelectClassNames {\n root?: VueClassValue;\n label?: VueClassValue;\n menu?: VueClassValue;\n option?: VueClassValue;\n}\n\nexport interface MenuSelectProps<TValue, TItem> {\n options: TItem[];\n keyAttr?: KeyOfType<TItem, TValue extends Array<infer U> ? U : TValue>;\n textAttr?: keyof TItem;\n disabled?: boolean;\n loading?: boolean;\n readOnly?: boolean;\n dense?: boolean;\n clearable?: boolean;\n label?: string;\n menuOptions?: MenuProps;\n classNames?: RuiMenuSelectClassNames;\n /** @deprecated Use `classNames.label` instead */\n labelClass?: string;\n /** @deprecated Use `classNames.menu` instead */\n menuClass?: string;\n /** @deprecated Use `classNames.option` instead */\n optionClass?: string;\n prependWidth?: number;\n appendWidth?: number;\n itemHeight?: number;\n variant?: MenuSelectVariant;\n hint?: string;\n errorMessages?: string | string[];\n successMessages?: string | string[];\n hideDetails?: boolean;\n autoSelectFirst?: boolean;\n hideNoData?: boolean;\n noDataText?: string;\n required?: boolean;\n}\n\ndefineOptions({\n name: 'RuiMenuSelect',\n inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue | undefined>({ required: true });\n\nconst {\n options,\n disabled = false,\n loading = false,\n readOnly = false,\n dense = false,\n clearable = false,\n hideDetails = false,\n label = 'Select',\n menuOptions,\n classNames,\n labelClass,\n menuClass,\n variant = 'default',\n hint,\n keyAttr,\n textAttr,\n itemHeight,\n errorMessages = [],\n successMessages = [],\n autoSelectFirst = false,\n hideNoData = false,\n noDataText = 'No data available',\n required = false,\n} = defineProps<MenuSelectProps<TValue, TItem>>();\n\ndefineSlots<{\n 'activator'?: (props: {\n disabled: boolean;\n value: TItem | undefined;\n variant: string;\n readOnly: boolean;\n attrs: Record<string, unknown>;\n open: boolean;\n hasError: boolean;\n hasSuccess: boolean;\n }) => any;\n 'activator.label'?: (props: { value: TItem | undefined }) => any;\n 'selection.prepend'?: (props: { item: TItem }) => any;\n 'selection'?: (props: { item: TItem }) => any;\n 'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n 'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n 'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n 'no-data'?: () => any;\n}>();\n\nconst menuRef = useTemplateRef<HTMLDivElement>('menuRef');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst { focused } = useFocus(activator);\nconst isHovered = ref<boolean>(false);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n () => errorMessages,\n () => successMessages,\n);\n\nconst value = computed<TItem | undefined>({\n get: () => {\n const value = get(modelValue);\n if (keyAttr)\n return options.find(option => option[keyAttr] === value);\n return value as unknown as TItem;\n },\n set: (selected?: TItem) => {\n const selection = keyAttr && selected ? selected[keyAttr] : selected;\n set(modelValue, selection as TValue);\n },\n});\n\nfunction setValue(val: TItem): void {\n set(value, val);\n set(focused, true);\n}\n\nconst {\n containerProps,\n wrapperProps,\n renderedData,\n isOpen,\n menuWidth,\n getText,\n getIdentifier,\n isActiveItem,\n highlightedIndex,\n moveHighlight,\n applyHighlighted,\n valueKey,\n} = useDropdownMenu<TValue, TItem>({\n itemHeight: itemHeight ?? (dense ? 30 : 48),\n keyAttr,\n textAttr,\n options: () => options,\n dense: () => dense,\n value,\n menuRef,\n disabled: () => disabled,\n autoSelectFirst,\n setValue,\n});\n\nconst outlined = computed<boolean>(() => variant === 'outlined');\nconst float = computed<boolean>(() => (get(isOpen) || !!get(value)) && get(outlined));\n\nconst legendText = computed<string>(() => {\n if (!get(float) || !label)\n return '';\n return required ? `${label} ﹡` : label;\n});\n\nconst ui = computed<ReturnType<typeof menuSelectStyles>>(() => menuSelectStyles({\n filled: variant === 'filled',\n outlined: get(outlined),\n float: get(float),\n opened: get(isOpen),\n hovered: get(isHovered),\n dense,\n disabled,\n readonly: readOnly,\n hasError: get(hasError),\n hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = menuSelectStyles({}).highlighted();\n\nfunction clear(): void {\n set(modelValue, undefined);\n}\n</script>\n\n<template>\n <RuiMenu\n v-model=\"isOpen\"\n v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n placement=\"bottom-start\"\n :close-on-content-click=\"true\"\n :full-width=\"true\"\n :error-messages=\"errorMessages\"\n :success-messages=\"successMessages\"\n :hint=\"hint\"\n :dense=\"dense\"\n :show-details=\"!hideDetails\"\n :disabled=\"disabled\"\n disable-auto-focus\n >\n <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n <slot\n name=\"activator\"\n v-bind=\"{ disabled, value, variant, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n >\n <button\n ref=\"activator\"\n :disabled=\"disabled\"\n :aria-disabled=\"disabled\"\n :aria-expanded=\"isOpen\"\n :aria-readonly=\"readOnly || undefined\"\n :aria-required=\"required || undefined\"\n :aria-busy=\"loading || undefined\"\n type=\"button\"\n :tabindex=\"disabled || readOnly ? -1 : 0\"\n :class=\"ui.activator({ class: cn(classNames?.label) ?? labelClass })\"\n v-bind=\"{\n ...getNonRootAttrs($attrs),\n ...(readOnly ? {} : attrs),\n }\"\n data-id=\"activator\"\n :aria-invalid=\"hasError\"\n @mouseenter=\"isHovered = true\"\n @mouseleave=\"isHovered = false\"\n @keydown.up.prevent=\"moveHighlight(true)\"\n @keydown.down.prevent=\"moveHighlight(false)\"\n @keydown.enter.prevent=\"applyHighlighted()\"\n @keydown.space.prevent=\"applyHighlighted()\"\n @keydown.home.prevent=\"highlightedIndex = 0\"\n @keydown.end.prevent=\"highlightedIndex = options.length - 1\"\n >\n <span\n v-if=\"outlined || !value\"\n :class=\"[\n ui.label(),\n { 'pr-2': !value && !open && outlined },\n ]\"\n >\n <slot\n name=\"activator.label\"\n v-bind=\"{ value }\"\n >\n {{ label }}\n </slot>\n <span\n v-if=\"required\"\n :class=\"ui.required()\"\n >\n ﹡\n </span>\n </span>\n <span\n v-if=\"value\"\n :class=\"ui.value()\"\n >\n <slot\n name=\"selection.prepend\"\n v-bind=\"{ item: value }\"\n />\n <slot\n name=\"selection\"\n v-bind=\"{ item: value }\"\n >\n {{ getText(value) }}\n </slot>\n </span>\n\n <span\n v-if=\"clearable && value && !disabled\"\n data-id=\"clear\"\n :class=\"[ui.clear(), focused && '!visible']\"\n @click.stop.prevent=\"clear()\"\n >\n <RuiIcon\n color=\"error\"\n name=\"lu-x\"\n size=\"18\"\n />\n </span>\n\n <span :class=\"ui.iconWrapper()\">\n <RuiIcon\n :class=\"ui.icon()\"\n :size=\"dense ? 16 : 24\"\n name=\"lu-chevron-down\"\n />\n </span>\n\n <RuiProgress\n v-if=\"loading\"\n :class=\"ui.progress()\"\n color=\"primary\"\n thickness=\"3\"\n variant=\"indeterminate\"\n />\n </button>\n <fieldset\n v-if=\"outlined\"\n :class=\"ui.fieldset()\"\n >\n <legend :class=\"ui.legend()\">\n {{ legendText }}\n </legend>\n </fieldset>\n </slot>\n <input\n :value=\"valueKey\"\n class=\"hidden\"\n type=\"hidden\"\n />\n </template>\n <template #default=\"{ width }\">\n <div\n v-if=\"options.length > 0\"\n :ref=\"containerProps.ref\"\n :class=\"ui.menu({ class: cn(classNames?.menu) ?? menuClass })\"\n :style=\"[containerProps.style, { width: `${width}px`, minWidth: menuWidth }]\"\n @scroll=\"containerProps.onScroll\"\n @keydown.up.prevent=\"moveHighlight(true)\"\n @keydown.down.prevent=\"moveHighlight(false)\"\n >\n <div\n v-bind=\"wrapperProps\"\n ref=\"menuRef\"\n >\n <RuiButton\n v-for=\"{ item, _index } in renderedData\"\n :key=\"getIdentifier(item)\"\n :active=\"isActiveItem(item)\"\n :aria-selected=\"isActiveItem(item)\"\n :size=\"dense ? 'sm' : undefined\"\n variant=\"list\"\n :data-highlighted=\"highlightedIndex === _index\"\n :class=\"{\n [highlightedClass]: !isActiveItem(item) && highlightedIndex === _index,\n }\"\n @click=\"setValue(item)\"\n >\n <template #prepend>\n <slot\n name=\"item.prepend\"\n v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n />\n </template>\n <slot\n name=\"item\"\n v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n >\n {{ getText(item) }}\n </slot>\n <template #append>\n <slot\n name=\"item.append\"\n v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n />\n </template>\n </RuiButton>\n </div>\n </div>\n\n <div\n v-else-if=\"!hideNoData\"\n data-id=\"no-data\"\n :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n :class=\"classNames?.menu ?? menuClass\"\n >\n <slot name=\"no-data\">\n <div class=\"p-4\">\n {{ noDataText }}\n </div>\n </slot>\n </div>\n </template>\n </RuiMenu>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"RuiMenuSelect.vue_vue_type_script_setup_true_lang.js","names":["$attrs"],"sources":["../../../../src/components/forms/select/RuiMenuSelect.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"TValue, TItem\">\nimport type { VueClassValue } from '@/types/class-value';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport { menuSelectStyles, type MenuSelectVariant } from '@/components/forms/select/menu-select-styles';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu, { type MenuProps } from '@/components/overlays/menu/RuiMenu.vue';\nimport RuiProgress from '@/components/progress/RuiProgress.vue';\nimport { type KeyOfType, useDropdownMenu } from '@/composables/dropdown-menu';\nimport { useFormTextDetail } from '@/utils/form-text-detail';\nimport { getNonRootAttrs, getRootAttrs } from '@/utils/helpers';\nimport { cn } from '@/utils/tv';\n\nexport interface RuiMenuSelectClassNames {\n root?: VueClassValue;\n label?: VueClassValue;\n menu?: VueClassValue;\n option?: VueClassValue;\n}\n\nexport interface MenuSelectProps<TValue, TItem> {\n options: TItem[];\n keyAttr?: KeyOfType<TItem, TValue extends Array<infer U> ? U : TValue>;\n textAttr?: keyof TItem;\n disabled?: boolean;\n loading?: boolean;\n readOnly?: boolean;\n dense?: boolean;\n clearable?: boolean;\n label?: string;\n menuOptions?: MenuProps;\n classNames?: RuiMenuSelectClassNames;\n /** @deprecated Use `classNames.label` instead */\n labelClass?: string;\n /** @deprecated Use `classNames.menu` instead */\n menuClass?: string;\n /** @deprecated Use `classNames.option` instead */\n optionClass?: string;\n prependWidth?: number;\n appendWidth?: number;\n itemHeight?: number;\n variant?: MenuSelectVariant;\n hint?: string;\n errorMessages?: string | string[];\n successMessages?: string | string[];\n hideDetails?: boolean;\n autoSelectFirst?: boolean;\n hideNoData?: boolean;\n noDataText?: string;\n required?: boolean;\n}\n\ndefineOptions({\n name: 'RuiMenuSelect',\n inheritAttrs: false,\n});\n\nconst modelValue = defineModel<TValue | undefined>({ required: true });\n\nconst {\n options,\n disabled = false,\n loading = false,\n readOnly = false,\n dense = false,\n clearable = false,\n hideDetails = false,\n label = 'Select',\n menuOptions,\n classNames,\n labelClass,\n menuClass,\n variant = 'default',\n hint,\n keyAttr,\n textAttr,\n itemHeight,\n errorMessages = [],\n successMessages = [],\n autoSelectFirst = false,\n hideNoData = false,\n noDataText = 'No data available',\n required = false,\n} = defineProps<MenuSelectProps<TValue, TItem>>();\n\ndefineSlots<{\n 'activator'?: (props: {\n disabled: boolean;\n value: TItem | undefined;\n variant: string;\n readOnly: boolean;\n attrs: Record<string, unknown>;\n open: boolean;\n hasError: boolean;\n hasSuccess: boolean;\n }) => any;\n 'activator.label'?: (props: { value: TItem | undefined }) => any;\n 'selection.prepend'?: (props: { item: TItem }) => any;\n 'selection'?: (props: { item: TItem }) => any;\n 'item.prepend'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n 'item'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n 'item.append'?: (props: { disabled: boolean; item: TItem; active: boolean }) => any;\n 'no-data'?: () => any;\n}>();\n\nconst menuRef = useTemplateRef<HTMLDivElement>('menuRef');\nconst activator = useTemplateRef<HTMLDivElement>('activator');\nconst { focused } = useFocus(activator);\nconst isHovered = ref<boolean>(false);\n\nconst { hasError, hasSuccess } = useFormTextDetail(\n () => errorMessages,\n () => successMessages,\n);\n\nconst value = computed<TItem | undefined>({\n get: () => {\n const value = get(modelValue);\n if (keyAttr)\n return options.find(option => option[keyAttr] === value);\n return value as unknown as TItem;\n },\n set: (selected?: TItem) => {\n const selection = keyAttr && selected ? selected[keyAttr] : selected;\n set(modelValue, selection as TValue);\n },\n});\n\nfunction setValue(val: TItem): void {\n set(value, val);\n set(focused, true);\n}\n\nconst {\n containerProps,\n wrapperProps,\n renderedData,\n isOpen,\n menuWidth,\n getText,\n getIdentifier,\n isActiveItem,\n highlightedIndex,\n moveHighlight,\n applyHighlighted,\n valueKey,\n} = useDropdownMenu<TValue, TItem>({\n itemHeight: itemHeight ?? (dense ? 30 : 48),\n keyAttr,\n textAttr,\n options: () => options,\n dense: () => dense,\n value,\n menuRef,\n disabled: () => disabled,\n autoSelectFirst,\n setValue,\n});\n\nconst outlined = computed<boolean>(() => variant === 'outlined');\nconst float = computed<boolean>(() => (get(isOpen) || !!get(value)) && get(outlined));\n\nconst legendText = computed<string>(() => {\n if (!get(float) || !label)\n return '';\n return required ? `${label} ﹡` : label;\n});\n\nconst ui = computed<ReturnType<typeof menuSelectStyles>>(() => menuSelectStyles({\n filled: variant === 'filled',\n outlined: get(outlined),\n float: get(float),\n opened: get(isOpen),\n hovered: get(isHovered),\n dense,\n disabled,\n readonly: readOnly,\n hasError: get(hasError),\n hasSuccess: get(hasSuccess) && !get(hasError),\n}));\n\nconst highlightedClass = menuSelectStyles({}).highlighted();\n\nfunction clear(): void {\n set(modelValue, undefined);\n}\n</script>\n\n<template>\n <RuiMenu\n v-model=\"isOpen\"\n v-bind=\"{ ...getRootAttrs($attrs, []), ...menuOptions }\"\n :class=\"ui.wrapper({ class: cn($attrs.class) })\"\n placement=\"bottom-start\"\n :close-on-content-click=\"true\"\n :full-width=\"true\"\n :error-messages=\"errorMessages\"\n :success-messages=\"successMessages\"\n :hint=\"hint\"\n :dense=\"dense\"\n :show-details=\"!hideDetails\"\n :disabled=\"disabled\"\n disable-auto-focus\n >\n <template #activator=\"{ attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\">\n <slot\n name=\"activator\"\n v-bind=\"{ disabled, value, variant, readOnly, attrs, open, hasError: slotHasError, hasSuccess: slotHasSuccess }\"\n >\n <button\n ref=\"activator\"\n :disabled=\"disabled\"\n :aria-disabled=\"disabled\"\n :aria-expanded=\"isOpen\"\n :aria-readonly=\"readOnly || undefined\"\n :aria-required=\"required || undefined\"\n :aria-busy=\"loading || undefined\"\n type=\"button\"\n :tabindex=\"disabled || readOnly ? -1 : 0\"\n :class=\"ui.activator({ class: cn(classNames?.label) ?? labelClass })\"\n v-bind=\"{\n ...getNonRootAttrs($attrs),\n ...(readOnly ? {} : attrs),\n }\"\n data-id=\"activator\"\n :aria-invalid=\"hasError\"\n @mouseenter=\"isHovered = true\"\n @mouseleave=\"isHovered = false\"\n @keydown.up.prevent=\"moveHighlight(true)\"\n @keydown.down.prevent=\"moveHighlight(false)\"\n @keydown.enter.prevent=\"applyHighlighted()\"\n @keydown.space.prevent=\"applyHighlighted()\"\n @keydown.home.prevent=\"highlightedIndex = 0\"\n @keydown.end.prevent=\"highlightedIndex = options.length - 1\"\n >\n <span\n v-if=\"outlined || !value\"\n :class=\"[\n ui.label(),\n { 'pr-2': !value && !open && outlined },\n ]\"\n >\n <slot\n name=\"activator.label\"\n v-bind=\"{ value }\"\n >\n {{ label }}\n </slot>\n <span\n v-if=\"required\"\n :class=\"ui.required()\"\n >\n ﹡\n </span>\n </span>\n <span\n v-if=\"value\"\n :class=\"ui.value()\"\n >\n <slot\n name=\"selection.prepend\"\n v-bind=\"{ item: value }\"\n />\n <slot\n name=\"selection\"\n v-bind=\"{ item: value }\"\n >\n {{ getText(value) }}\n </slot>\n </span>\n\n <span\n v-if=\"clearable && value && !disabled\"\n data-id=\"clear\"\n :class=\"[ui.clear(), focused && '!visible']\"\n @click.stop.prevent=\"clear()\"\n >\n <RuiIcon\n color=\"error\"\n name=\"lu-x\"\n size=\"18\"\n />\n </span>\n\n <span :class=\"ui.iconWrapper()\">\n <RuiIcon\n :class=\"ui.icon()\"\n :size=\"dense ? 16 : 24\"\n name=\"lu-chevron-down\"\n />\n </span>\n\n <RuiProgress\n v-if=\"loading\"\n :class=\"ui.progress()\"\n color=\"primary\"\n thickness=\"3\"\n variant=\"indeterminate\"\n />\n </button>\n <fieldset\n v-if=\"outlined\"\n :class=\"ui.fieldset()\"\n >\n <legend :class=\"ui.legend()\">\n {{ legendText }}\n </legend>\n </fieldset>\n </slot>\n <input\n :value=\"valueKey\"\n class=\"hidden\"\n type=\"hidden\"\n />\n </template>\n <template #default=\"{ width }\">\n <div\n v-if=\"options.length > 0\"\n :ref=\"containerProps.ref\"\n :class=\"ui.menu({ class: cn(classNames?.menu) ?? menuClass })\"\n :style=\"[containerProps.style, { width: `${width}px`, minWidth: menuWidth }]\"\n @scroll=\"containerProps.onScroll\"\n @keydown.up.prevent=\"moveHighlight(true)\"\n @keydown.down.prevent=\"moveHighlight(false)\"\n >\n <div\n v-bind=\"wrapperProps\"\n ref=\"menuRef\"\n >\n <RuiButton\n v-for=\"{ item, _index } in renderedData\"\n :key=\"getIdentifier(item)\"\n :active=\"isActiveItem(item)\"\n :aria-selected=\"isActiveItem(item)\"\n :size=\"dense ? 'sm' : undefined\"\n variant=\"list\"\n :data-highlighted=\"highlightedIndex === _index\"\n :class=\"{\n [highlightedClass]: !isActiveItem(item) && highlightedIndex === _index,\n }\"\n @click=\"setValue(item)\"\n >\n <template #prepend>\n <slot\n name=\"item.prepend\"\n v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n />\n </template>\n <slot\n name=\"item\"\n v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n >\n {{ getText(item) }}\n </slot>\n <template #append>\n <slot\n name=\"item.append\"\n v-bind=\"{ disabled, item, active: isActiveItem(item) }\"\n />\n </template>\n </RuiButton>\n </div>\n </div>\n\n <div\n v-else-if=\"!hideNoData\"\n data-id=\"no-data\"\n :style=\"{ width: `${width}px`, minWidth: menuWidth }\"\n :class=\"classNames?.menu ?? menuClass\"\n >\n <slot name=\"no-data\">\n <div class=\"p-4\">\n {{ noDataText }}\n </div>\n </slot>\n </div>\n </template>\n </RuiMenu>\n</template>\n"],"mappings":"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"}
|
|
@@ -38,35 +38,37 @@ function useAutoCompleteKeyboardNavigation(options, deps) {
|
|
|
38
38
|
function submitClosestForm() {
|
|
39
39
|
(get(deps.activator)?.closest("form"))?.dispatchEvent(new Event("submit"));
|
|
40
40
|
}
|
|
41
|
-
function
|
|
41
|
+
function tryApplyHighlight(event) {
|
|
42
42
|
const filteredOptions = get(deps.filteredOptions);
|
|
43
|
-
|
|
43
|
+
if (get(deps.highlightedIndex) <= -1 || filteredOptions.length === 0) return false;
|
|
44
|
+
deps.applyHighlighted();
|
|
45
|
+
event.preventDefault();
|
|
46
|
+
return true;
|
|
47
|
+
}
|
|
48
|
+
function tryApplyCustom(event, requireEmptyOptions) {
|
|
44
49
|
const customValue = toValue(options.customValue);
|
|
45
|
-
const multiple = toValue(options.multiple);
|
|
46
50
|
const internalSearch = get(deps.internalSearch);
|
|
47
|
-
if (
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
return
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
if (
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
}
|
|
61
|
-
if (filteredOptions.length === 0 && customValue && internalSearch) {
|
|
62
|
-
applyCustomValue(event, multiple);
|
|
63
|
-
return true;
|
|
64
|
-
}
|
|
65
|
-
return false;
|
|
51
|
+
if (!customValue || !internalSearch) return false;
|
|
52
|
+
const filteredOptions = get(deps.filteredOptions);
|
|
53
|
+
if (requireEmptyOptions) {
|
|
54
|
+
if (filteredOptions.length > 0) return false;
|
|
55
|
+
} else if (highlightedMatchesSearch(filteredOptions, get(deps.highlightedIndex), internalSearch)) return false;
|
|
56
|
+
applyCustomValue(event, toValue(options.multiple));
|
|
57
|
+
return true;
|
|
58
|
+
}
|
|
59
|
+
function handleOpenMenuEnter(event) {
|
|
60
|
+
if (get(deps.userNavigated) && tryApplyHighlight(event)) return true;
|
|
61
|
+
if (tryApplyCustom(event, false)) return true;
|
|
62
|
+
if (tryApplyHighlight(event)) return true;
|
|
63
|
+
return tryApplyCustom(event, true);
|
|
66
64
|
}
|
|
67
65
|
function onEnter(event) {
|
|
68
|
-
if (get(deps.isOpen)
|
|
69
|
-
|
|
66
|
+
if (get(deps.isOpen)) {
|
|
67
|
+
if (handleOpenMenuEnter(event)) return;
|
|
68
|
+
event.preventDefault();
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
if (get(deps.value).length === 0) {
|
|
70
72
|
set(deps.isOpen, true);
|
|
71
73
|
return event.preventDefault();
|
|
72
74
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"keyboard-navigation.js","names":[],"sources":["../../../../src/composables/forms/auto-complete/keyboard-navigation.ts"],"sourcesContent":["import type { MaybeRefOrGetter, Ref, TemplateRef } from 'vue';\nimport { get, set } from '@vueuse/shared';\n\nexport interface UseAutoCompleteKeyboardNavigationOptions {\n /** Whether multiple items can be selected. */\n multiple: MaybeRefOrGetter<boolean>;\n /** Whether custom (free-text) values are allowed. */\n customValue: MaybeRefOrGetter<boolean>;\n /** Whether selected values are displayed as chips. */\n chips: MaybeRefOrGetter<boolean>;\n}\n\nexport interface UseAutoCompleteKeyboardNavigationDeps<TItem> {\n internalSearch: Ref<string>;\n value: Ref<TItem[]>;\n filteredOptions: Ref<TItem[]>;\n isOpen: Ref<boolean>;\n highlightedIndex: Ref<number>;\n userNavigated: Ref<boolean>;\n searchInputFocused: Ref<boolean>;\n applyHighlighted: () => void;\n clear: () => void;\n removeValue: (item: TItem) => void;\n setSearchAsValue: () => void;\n getText: (item: TItem) => string | undefined;\n activator: Ref<HTMLElement | undefined> | TemplateRef<HTMLElement>;\n}\n\nexport interface UseAutoCompleteKeyboardNavigationReturn {\n focusedValueIndex: Ref<number>;\n moveSelectedValueHighlight: (event: KeyboardEvent, next: boolean) => void;\n onEnter: (event: KeyboardEvent) => void;\n onTab: (event: KeyboardEvent) => void;\n onInputDeletePressed: () => void;\n setValueFocus: (index: number) => void;\n}\n\nexport function useAutoCompleteKeyboardNavigation<TItem>(\n options: UseAutoCompleteKeyboardNavigationOptions,\n deps: UseAutoCompleteKeyboardNavigationDeps<TItem>,\n): UseAutoCompleteKeyboardNavigationReturn {\n const focusedValueIndex = ref<number>(-1);\n\n function setValueFocus(index: number): void {\n set(focusedValueIndex, index);\n }\n\n function moveSelectedValueHighlight(event: KeyboardEvent, next: boolean): void {\n const multiple = toValue(options.multiple);\n const internalSearchValue = get(deps.internalSearch);\n\n if (!multiple || internalSearchValue.length > 0)\n return;\n\n event.preventDefault();\n const total = get(deps.value).length;\n\n let current = get(focusedValueIndex);\n\n if (current === -1) {\n set(focusedValueIndex, next ? 0 : total - 1);\n return;\n }\n\n const move = next ? 1 : -1;\n current += move;\n\n if (current < 0 || current >= total) {\n set(focusedValueIndex, -1);\n set(deps.searchInputFocused, true);\n }\n else {\n set(focusedValueIndex, current);\n }\n }\n\n function highlightedMatchesSearch(filteredOptions: TItem[], highlightedIndex: number, search: string): boolean {\n if (highlightedIndex < 0 || highlightedIndex >= filteredOptions.length)\n return false;\n\n const option = filteredOptions[highlightedIndex];\n if (typeof option === 'string')\n return option === search;\n\n if (option && typeof option === 'object')\n return (deps.getText(option) ?? '') === search;\n\n return false;\n }\n\n function applyCustomValue(event: KeyboardEvent, multiple: boolean): void {\n deps.setSearchAsValue();\n if (!multiple)\n set(deps.isOpen, false);\n event.preventDefault();\n }\n\n function submitClosestForm(): void {\n const activator = get(deps.activator);\n const form = activator?.closest('form');\n form?.dispatchEvent(new Event('submit'));\n }\n\n function handleOpenMenuEnter(event: KeyboardEvent): boolean {\n const filteredOptions = get(deps.filteredOptions);\n const highlightedIndex = get(deps.highlightedIndex);\n const customValue = toValue(options.customValue);\n const multiple = toValue(options.multiple);\n const internalSearch = get(deps.internalSearch);\n\n const userNavigated = get(deps.userNavigated);\n\n if (userNavigated && highlightedIndex > -1 && filteredOptions.length > 0) {\n deps.applyHighlighted();\n event.preventDefault();\n return true;\n }\n\n if (customValue && internalSearch && !highlightedMatchesSearch(filteredOptions, highlightedIndex, internalSearch)) {\n applyCustomValue(event, multiple);\n return true;\n }\n\n if (highlightedIndex > -1 && filteredOptions.length > 0) {\n deps.applyHighlighted();\n event.preventDefault();\n return true;\n }\n\n if (filteredOptions.length === 0 && customValue && internalSearch) {\n applyCustomValue(event, multiple);\n return true;\n }\n\n return false;\n }\n\n function onEnter(event: KeyboardEvent): void {\n if (get(deps.isOpen) && handleOpenMenuEnter(event))\n return;\n\n // Nothing selected, menu closed: open menu\n if (!get(deps.isOpen) && get(deps.value).length === 0) {\n set(deps.isOpen, true);\n return event.preventDefault();\n }\n\n // Fallback: submit parent form\n submitClosestForm();\n }\n\n function onTab(event: KeyboardEvent): void {\n const isOpen = get(deps.isOpen);\n const filteredOptions = get(deps.filteredOptions);\n const highlightedIndex = get(deps.highlightedIndex);\n const multiple = toValue(options.multiple);\n\n if (isOpen && filteredOptions.length > 0 && highlightedIndex > -1 && !multiple) {\n deps.applyHighlighted();\n event.preventDefault();\n }\n }\n\n function onInputDeletePressed(): void {\n const internalSearch = get(deps.internalSearch);\n const value = get(deps.value);\n const total = value.length;\n const multiple = toValue(options.multiple);\n\n if (!internalSearch && total > 0) {\n if (multiple) {\n if (toValue(options.chips)) {\n set(focusedValueIndex, total - 1);\n }\n else {\n const lastItem = value[total - 1];\n if (lastItem !== undefined)\n deps.removeValue(lastItem);\n }\n }\n else {\n deps.clear();\n }\n }\n }\n\n // Watch value changes to reset focused index\n watch(deps.value, () => {\n setValueFocus(-1);\n });\n\n // Watch focused value index to handle chip focus\n watch(focusedValueIndex, async (index) => {\n const multiple = toValue(options.multiple);\n if (index === -1 || !multiple)\n return;\n\n await nextTick(() => {\n const activator = get(deps.activator);\n const element = activator?.querySelector<HTMLElement>(`[data-index=\"${index}\"]`);\n element?.focus();\n });\n });\n\n return {\n // eslint-disable-next-line @rotki/composable-return-readonly -- written by focus.ts onInputFocused\n focusedValueIndex,\n moveSelectedValueHighlight,\n onEnter,\n onInputDeletePressed,\n onTab,\n setValueFocus,\n };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"keyboard-navigation.js","names":[],"sources":["../../../../src/composables/forms/auto-complete/keyboard-navigation.ts"],"sourcesContent":["import type { MaybeRefOrGetter, Ref, TemplateRef } from 'vue';\nimport { get, set } from '@vueuse/shared';\n\nexport interface UseAutoCompleteKeyboardNavigationOptions {\n /** Whether multiple items can be selected. */\n multiple: MaybeRefOrGetter<boolean>;\n /** Whether custom (free-text) values are allowed. */\n customValue: MaybeRefOrGetter<boolean>;\n /** Whether selected values are displayed as chips. */\n chips: MaybeRefOrGetter<boolean>;\n}\n\nexport interface UseAutoCompleteKeyboardNavigationDeps<TItem> {\n internalSearch: Ref<string>;\n value: Ref<TItem[]>;\n filteredOptions: Ref<TItem[]>;\n isOpen: Ref<boolean>;\n highlightedIndex: Ref<number>;\n userNavigated: Ref<boolean>;\n searchInputFocused: Ref<boolean>;\n applyHighlighted: () => void;\n clear: () => void;\n removeValue: (item: TItem) => void;\n setSearchAsValue: () => void;\n getText: (item: TItem) => string | undefined;\n activator: Ref<HTMLElement | undefined> | TemplateRef<HTMLElement>;\n}\n\nexport interface UseAutoCompleteKeyboardNavigationReturn {\n focusedValueIndex: Ref<number>;\n moveSelectedValueHighlight: (event: KeyboardEvent, next: boolean) => void;\n onEnter: (event: KeyboardEvent) => void;\n onTab: (event: KeyboardEvent) => void;\n onInputDeletePressed: () => void;\n setValueFocus: (index: number) => void;\n}\n\nexport function useAutoCompleteKeyboardNavigation<TItem>(\n options: UseAutoCompleteKeyboardNavigationOptions,\n deps: UseAutoCompleteKeyboardNavigationDeps<TItem>,\n): UseAutoCompleteKeyboardNavigationReturn {\n const focusedValueIndex = ref<number>(-1);\n\n function setValueFocus(index: number): void {\n set(focusedValueIndex, index);\n }\n\n function moveSelectedValueHighlight(event: KeyboardEvent, next: boolean): void {\n const multiple = toValue(options.multiple);\n const internalSearchValue = get(deps.internalSearch);\n\n if (!multiple || internalSearchValue.length > 0)\n return;\n\n event.preventDefault();\n const total = get(deps.value).length;\n\n let current = get(focusedValueIndex);\n\n if (current === -1) {\n set(focusedValueIndex, next ? 0 : total - 1);\n return;\n }\n\n const move = next ? 1 : -1;\n current += move;\n\n if (current < 0 || current >= total) {\n set(focusedValueIndex, -1);\n set(deps.searchInputFocused, true);\n }\n else {\n set(focusedValueIndex, current);\n }\n }\n\n function highlightedMatchesSearch(filteredOptions: TItem[], highlightedIndex: number, search: string): boolean {\n if (highlightedIndex < 0 || highlightedIndex >= filteredOptions.length)\n return false;\n\n const option = filteredOptions[highlightedIndex];\n if (typeof option === 'string')\n return option === search;\n\n if (option && typeof option === 'object')\n return (deps.getText(option) ?? '') === search;\n\n return false;\n }\n\n function applyCustomValue(event: KeyboardEvent, multiple: boolean): void {\n deps.setSearchAsValue();\n if (!multiple)\n set(deps.isOpen, false);\n event.preventDefault();\n }\n\n function submitClosestForm(): void {\n const activator = get(deps.activator);\n const form = activator?.closest('form');\n form?.dispatchEvent(new Event('submit'));\n }\n\n function tryApplyHighlight(event: KeyboardEvent): boolean {\n const filteredOptions = get(deps.filteredOptions);\n const highlightedIndex = get(deps.highlightedIndex);\n if (highlightedIndex <= -1 || filteredOptions.length === 0)\n return false;\n\n deps.applyHighlighted();\n event.preventDefault();\n return true;\n }\n\n function tryApplyCustom(event: KeyboardEvent, requireEmptyOptions: boolean): boolean {\n const customValue = toValue(options.customValue);\n const internalSearch = get(deps.internalSearch);\n if (!customValue || !internalSearch)\n return false;\n\n const filteredOptions = get(deps.filteredOptions);\n if (requireEmptyOptions) {\n if (filteredOptions.length > 0)\n return false;\n }\n else {\n const highlightedIndex = get(deps.highlightedIndex);\n if (highlightedMatchesSearch(filteredOptions, highlightedIndex, internalSearch))\n return false;\n }\n\n applyCustomValue(event, toValue(options.multiple));\n return true;\n }\n\n function handleOpenMenuEnter(event: KeyboardEvent): boolean {\n // Prefer the user's explicit navigation.\n if (get(deps.userNavigated) && tryApplyHighlight(event))\n return true;\n\n // Fall back to a typed custom value when it differs from the highlight.\n if (tryApplyCustom(event, false))\n return true;\n\n // Use the (auto-)highlighted option if there is one.\n if (tryApplyHighlight(event))\n return true;\n\n // No options matched but custom values are allowed — accept the typed text.\n return tryApplyCustom(event, true);\n }\n\n function onEnter(event: KeyboardEvent): void {\n if (get(deps.isOpen)) {\n if (handleOpenMenuEnter(event))\n return;\n\n // Menu is open but no actionable selection (e.g. typed text with no\n // matches and customValue=false, or no highlighted option). Swallow\n // Enter so it does not bubble up and submit a surrounding form.\n event.preventDefault();\n return;\n }\n\n // Nothing selected, menu closed: open menu\n if (get(deps.value).length === 0) {\n set(deps.isOpen, true);\n return event.preventDefault();\n }\n\n // Menu closed with a value selected: let Enter submit the parent form.\n submitClosestForm();\n }\n\n function onTab(event: KeyboardEvent): void {\n const isOpen = get(deps.isOpen);\n const filteredOptions = get(deps.filteredOptions);\n const highlightedIndex = get(deps.highlightedIndex);\n const multiple = toValue(options.multiple);\n\n if (isOpen && filteredOptions.length > 0 && highlightedIndex > -1 && !multiple) {\n deps.applyHighlighted();\n event.preventDefault();\n }\n }\n\n function onInputDeletePressed(): void {\n const internalSearch = get(deps.internalSearch);\n const value = get(deps.value);\n const total = value.length;\n const multiple = toValue(options.multiple);\n\n if (!internalSearch && total > 0) {\n if (multiple) {\n if (toValue(options.chips)) {\n set(focusedValueIndex, total - 1);\n }\n else {\n const lastItem = value[total - 1];\n if (lastItem !== undefined)\n deps.removeValue(lastItem);\n }\n }\n else {\n deps.clear();\n }\n }\n }\n\n // Watch value changes to reset focused index\n watch(deps.value, () => {\n setValueFocus(-1);\n });\n\n // Watch focused value index to handle chip focus\n watch(focusedValueIndex, async (index) => {\n const multiple = toValue(options.multiple);\n if (index === -1 || !multiple)\n return;\n\n await nextTick(() => {\n const activator = get(deps.activator);\n const element = activator?.querySelector<HTMLElement>(`[data-index=\"${index}\"]`);\n element?.focus();\n });\n });\n\n return {\n // eslint-disable-next-line @rotki/composable-return-readonly -- written by focus.ts onInputFocused\n focusedValueIndex,\n moveSelectedValueHighlight,\n onEnter,\n onInputDeletePressed,\n onTab,\n setValueFocus,\n };\n}\n"],"mappings":"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"}
|
package/dist/web-types.json
CHANGED