diff options
Diffstat (limited to 'core/src/components')
7 files changed, 48 insertions, 27 deletions
diff --git a/core/src/components/AccountMenu/AccountMenuEntry.vue b/core/src/components/AccountMenu/AccountMenuEntry.vue index 47db84a7d33..d983226d273 100644 --- a/core/src/components/AccountMenu/AccountMenuEntry.vue +++ b/core/src/components/AccountMenu/AccountMenuEntry.vue @@ -11,28 +11,30 @@ compact :href="href" :name="name" - target="_self"> + target="_self" + @click="onClick"> <template #icon> - <img class="account-menu-entry__icon" + <NcLoadingIcon v-if="loading" :size="20" class="account-menu-entry__loading" /> + <slot v-else-if="$scopedSlots.icon" name="icon" /> + <img v-else + class="account-menu-entry__icon" :class="{ 'account-menu-entry__icon--active': active }" :src="iconSource" alt=""> </template> - <template v-if="loading" #indicator> - <NcLoadingIcon /> - </template> </NcListItem> </template> -<script> +<script lang="ts"> import { loadState } from '@nextcloud/initial-state' +import { defineComponent } from 'vue' import NcListItem from '@nextcloud/vue/components/NcListItem' import NcLoadingIcon from '@nextcloud/vue/components/NcLoadingIcon' const versionHash = loadState('core', 'versionHash', '') -export default { +export default defineComponent({ name: 'AccountMenuEntry', components: { @@ -55,11 +57,11 @@ export default { }, active: { type: Boolean, - required: true, + default: false, }, icon: { type: String, - required: true, + default: '', }, }, @@ -76,11 +78,17 @@ export default { }, methods: { - handleClick() { - this.loading = true + onClick(e: MouseEvent) { + this.$emit('click', e) + + // Allow to not show the loading indicator + // in case the click event was already handled + if (!e.defaultPrevented) { + this.loading = true + } }, }, -} +}) </script> <style lang="scss" scoped> @@ -96,6 +104,12 @@ export default { } } + &__loading { + height: 20px; + width: 20px; + margin: calc((var(--default-clickable-area) - 20px) / 2); // 20px icon size + } + :deep(.list-item-content__main) { width: fit-content; } diff --git a/core/src/components/AppMenuIcon.vue b/core/src/components/AppMenuIcon.vue index f2cee75e644..089a2016e58 100644 --- a/core/src/components/AppMenuIcon.vue +++ b/core/src/components/AppMenuIcon.vue @@ -18,7 +18,7 @@ import type { INavigationEntry } from '../types/navigation' import { n } from '@nextcloud/l10n' import { computed } from 'vue' -import IconDot from 'vue-material-design-icons/Circle.vue' +import IconDot from 'vue-material-design-icons/CircleOutline.vue' const props = defineProps<{ app: INavigationEntry diff --git a/core/src/components/PublicPageMenu/PublicPageMenuEntry.vue b/core/src/components/PublicPageMenu/PublicPageMenuEntry.vue index 4a8640f38a8..413806c7089 100644 --- a/core/src/components/PublicPageMenu/PublicPageMenuEntry.vue +++ b/core/src/components/PublicPageMenu/PublicPageMenuEntry.vue @@ -11,22 +11,24 @@ role="presentation" @click="$emit('click')"> <template #icon> - <div role="presentation" :class="['icon', icon, 'public-page-menu-entry__icon']" /> + <slot v-if="$scopedSlots.icon" name="icon" /> + <div v-else role="presentation" :class="['icon', icon, 'public-page-menu-entry__icon']" /> </template> </NcListItem> </template> <script setup lang="ts"> -import NcListItem from '@nextcloud/vue/components/NcListItem' import { onMounted } from 'vue' +import NcListItem from '@nextcloud/vue/components/NcListItem' + const props = defineProps<{ /** Only emit click event but do not open href */ clickOnly?: boolean // menu entry props id: string label: string - icon: string + icon?: string href: string details?: string }>() diff --git a/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue b/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue index 1860c54e1ff..171eada8a06 100644 --- a/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue +++ b/core/src/components/UnifiedSearch/UnifiedSearchLocalSearchBar.vue @@ -32,7 +32,7 @@ {{ t('core', 'Search everywhere') }} </template> <template #icon> - <NcIconSvgWrapper :path="mdiCloudSearch" /> + <NcIconSvgWrapper :path="mdiCloudSearchOutline" /> </template> </NcButton> </div> @@ -41,7 +41,7 @@ <script lang="ts" setup> import type { ComponentPublicInstance } from 'vue' -import { mdiCloudSearch, mdiClose } from '@mdi/js' +import { mdiCloudSearchOutline, mdiClose } from '@mdi/js' import { translate as t } from '@nextcloud/l10n' import { useIsMobile } from '@nextcloud/vue/composables/useIsMobile' import { useElementSize } from '@vueuse/core' diff --git a/core/src/components/UnifiedSearch/UnifiedSearchModal.vue b/core/src/components/UnifiedSearch/UnifiedSearchModal.vue index 1edfbd45746..002606f058b 100644 --- a/core/src/components/UnifiedSearch/UnifiedSearchModal.vue +++ b/core/src/components/UnifiedSearch/UnifiedSearchModal.vue @@ -159,8 +159,8 @@ import debounce from 'debounce' import { unifiedSearchLogger } from '../../logger' import IconArrowRight from 'vue-material-design-icons/ArrowRight.vue' -import IconAccountGroup from 'vue-material-design-icons/AccountGroup.vue' -import IconCalendarRange from 'vue-material-design-icons/CalendarRange.vue' +import IconAccountGroup from 'vue-material-design-icons/AccountGroupOutline.vue' +import IconCalendarRange from 'vue-material-design-icons/CalendarRangeOutline.vue' import IconDotsHorizontal from 'vue-material-design-icons/DotsHorizontal.vue' import IconFilter from 'vue-material-design-icons/Filter.vue' import IconListBox from 'vue-material-design-icons/ListBox.vue' @@ -329,7 +329,13 @@ export default defineComponent({ query: { immediate: true, handler() { - this.searchQuery = this.query.trim() + this.searchQuery = this.query + }, + }, + + searchQuery: { + handler() { + this.$emit('update:query', this.searchQuery) }, }, }, diff --git a/core/src/components/login/PasswordLessLoginForm.vue b/core/src/components/login/PasswordLessLoginForm.vue index bbca2ebf31d..bc4d25bf70f 100644 --- a/core/src/components/login/PasswordLessLoginForm.vue +++ b/core/src/components/login/PasswordLessLoginForm.vue @@ -57,7 +57,7 @@ import { import NcEmptyContent from '@nextcloud/vue/components/NcEmptyContent' import NcTextField from '@nextcloud/vue/components/NcTextField' -import InformationIcon from 'vue-material-design-icons/Information.vue' +import InformationIcon from 'vue-material-design-icons/InformationOutline.vue' import LoginButton from './LoginButton.vue' import LockOpenIcon from 'vue-material-design-icons/LockOpen.vue' import logger from '../../logger' diff --git a/core/src/components/setup/RecommendedApps.vue b/core/src/components/setup/RecommendedApps.vue index b31e4b54ca4..f2120c28402 100644 --- a/core/src/components/setup/RecommendedApps.vue +++ b/core/src/components/setup/RecommendedApps.vue @@ -38,17 +38,16 @@ <div class="dialog-row"> <NcButton v-if="showInstallButton && !installingApps" - type="tertiary" - role="link" + data-cy-setup-recommended-apps-skip :href="defaultPageUrl" - data-cy-setup-recommended-apps-skip> + variant="tertiary"> {{ t('core', 'Skip') }} </NcButton> <NcButton v-if="showInstallButton" - type="primary" + data-cy-setup-recommended-apps-install :disabled="installingApps || !isAnyAppSelected" - data-cy-setup-recommended-apps-install> + variant="primary" @click.stop.prevent="installApps"> {{ installingApps ? t('core', 'Installing apps …') : t('core', 'Install recommended apps') }} </NcButton> |