npm - tuikit-atomicx-vue3 - Versions diffs - 4.4.0-beta.1 → 4.5.0 - Mend

tuikit-atomicx-vue3 4.4.0-beta.1 → 4.5.0

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.

Files changed (727) hide show

package/src/components/ContactList/ContactInfo/ContactInfo.vue CHANGED Viewed

@@ -260,5 +260,5 @@ const handleJoinGroup = (data: GroupModel, note: string) => emit('joinGroup', da
 </script>
 <style scoped lang="scss">
-@import './ContactInfo.scss';
+@use './ContactInfo.scss';
 </style>

package/src/components/ContactList/ContactInfo/FriendApplicationInfo/FriendApplicationInfo.vue CHANGED Viewed

@@ -84,5 +84,5 @@ const handleRefuse = () => {
 </script>
 <style scoped lang="scss">
-@import './FriendApplicationInfo.scss';
+@use './FriendApplicationInfo.scss';
 </style>

package/src/components/ContactList/ContactInfo/FriendInfo/FriendInfo.vue CHANGED Viewed

@@ -215,5 +215,5 @@ const handleSendMessage = () => {
 </script>
 <style scoped lang="scss">
-@import './FriendInfo.scss';
+@use './FriendInfo.scss';
 </style>

package/src/components/ContactList/ContactInfo/GroupApplicationInfo/GroupApplicationInfo.vue CHANGED Viewed

@@ -95,5 +95,5 @@ const handleRefuse = () => {
 </script>
 <style scoped lang="scss">
-@import './GroupApplicationInfo.scss';
+@use './GroupApplicationInfo.scss';
 </style>

package/src/components/ContactList/ContactInfo/GroupInfo/GroupInfo.vue CHANGED Viewed

@@ -143,5 +143,5 @@ const handleGroupAction = () => {
 }
 </script>
 <style scoped lang="scss">
-@import './GroupInfo.scss';
+@use './GroupInfo.scss';
 </style>

package/src/components/ContactList/ContactInfo/SearchGroupInfo/SearchGroupInfo.vue CHANGED Viewed

@@ -143,5 +143,5 @@ const handleJoinGroup = async () => {
 </script>
 <style scoped lang="scss">
-@import './SearchGroupInfo.scss';
+@use './SearchGroupInfo.scss';
 </style>

package/src/components/ContactList/ContactInfo/SearchUserInfo/SearchUserInfo.vue CHANGED Viewed

@@ -124,5 +124,5 @@ const handleAddFriend = async () => {
 </script>
 <style scoped lang="scss">
-@import './SearchUserInfo.scss';
+@use './SearchUserInfo.scss';
 </style>

package/src/components/ContactList/ContactList.vue CHANGED Viewed

@@ -310,5 +310,5 @@ const emptyText = computed(() => props.emptyText || t('TUIContact.No contacts'))
 </script>
 <style scoped lang="scss">
-@import './ContactList.scss';
+@use './ContactList.scss';
 </style>

package/src/components/ContactList/ContactListItem/BlacklistItem/BlacklistItem.vue CHANGED Viewed

@@ -43,5 +43,5 @@ const handleClick = () => {
 </script>
 <style scoped lang="scss">
-@import './BlacklistItem.scss';
+@use './BlacklistItem.scss';
 </style>

package/src/components/ContactList/ContactListItem/FriendApplicationItem/FriendApplicationItem.vue CHANGED Viewed

@@ -66,5 +66,5 @@ const handleAccept = () => {
 </script>
 <style scoped lang="scss">
-@import './FriendApplicationItem.scss';
+@use './FriendApplicationItem.scss';
 </style>

package/src/components/ContactList/ContactListItem/FriendItem/FriendItem.vue CHANGED Viewed

@@ -43,5 +43,5 @@ const handleClick = () => {
 </script>
 <style scoped lang="scss">
-@import './FriendItem.scss';
+@use './FriendItem.scss';
 </style>

package/src/components/ContactList/ContactListItem/GroupApplicationItem/GroupApplicationItem.vue CHANGED Viewed

@@ -74,5 +74,5 @@ const handleAction = (action: 'accept' | 'refuse', event: Event) => {
 </script>
 <style scoped lang="scss">
-@import './GroupApplicationItem.scss';
+@use './GroupApplicationItem.scss';
 </style>

package/src/components/ContactList/ContactListItem/GroupItem/GroupItem.vue CHANGED Viewed

@@ -43,5 +43,5 @@ const handleClick = () => {
 </script>
 <style scoped lang="scss">
-@import './GroupItem.scss';
+@use './GroupItem.scss';
 </style>

package/src/components/ContactList/ContactSearch/ContactSearch.vue CHANGED Viewed

@@ -94,5 +94,5 @@ const CustomSearchBar = (searchBarProps: SearchBarProps) => h('div', { class: 'c
 </script>
 <style scoped lang="scss">
-@import './ContactSearch.scss';
+@use './ContactSearch.scss';
 </style>

package/src/components/ConversationList/ConversationActions/ConversationActions.vue CHANGED Viewed

@@ -25,11 +25,11 @@
     <TUIDropdown
       v-else
       trigger="click"
+      :teleported="false"
       placement="bottom-end"
     >
       <div
         :class="$style['conversationActions__popup-icon']"
-        @click="toggleClick"
       >
         <IconEllipsis size="18px" />
       </div>
@@ -81,7 +81,6 @@ const { t } = useUIKit();
 const { markConversationUnread } = useConversationListState();
 const markUnreadStatus = ref(true);
-const anchor = ref<HTMLElement | null>(null);
 const conversationActions = ref<Record<string, ConversationActionItem>>({});
 const enabledActions = computed(() => Object.entries(conversationActions.value)
@@ -151,12 +150,7 @@ watch(
   { immediate: true, deep: true },
 );
-const toggleClick = (e: Event) => {
-  anchor.value = anchor.value ? null : (e.currentTarget as HTMLElement);
-};
 const onClickMenuItem = (e: Event, key: string) => {
-  toggleClick(e);
   emit('click', e, key, props.conversation);
   const action = conversationActions.value[key];
@@ -178,5 +172,5 @@ const handleMaskClick = (e: Event) => {
 </script>
 <style lang="scss" module>
-@import './ConversationActions.scss';
+@use './ConversationActions.scss';
 </style>

package/src/components/ConversationList/ConversationCreate/ConversationCreate.vue CHANGED Viewed

@@ -195,7 +195,7 @@ const handleCreateGroupConversation = async () => {
 const generateGroupName = (userList: Friend[]) => {
   const selfName = loginUserInfo.value?.userName || loginUserInfo.value?.userId || '';
-  const name = `${selfName}、` + userList.map(item => item?.remark || item?.nick || item?.userID).join('、');
+  const name = `${selfName}、${userList.map(item => item?.remark || item?.nick || item?.userID).join('、')}`;
   return name.length >= GROUP_NAME_LIMIT ? name.slice(0, GROUP_NAME_LIMIT) : name;
 };
@@ -231,5 +231,5 @@ const handleCancel = () => {
 </script>
 <style lang="scss" scoped>
-@import './ConversationCreate.scss';
+@use './ConversationCreate.scss';
 </style>

package/src/components/ConversationList/ConversationCreate/ConversationCreateButton/ConversationCreateButton.vue CHANGED Viewed

@@ -83,5 +83,5 @@ const handleClick = (action: CreateConvTypes) => {
 </script>
 <style lang="scss" module>
-@import './ConversationCreateButton.scss';
+@use './ConversationCreateButton.scss';
 </style>

package/src/components/ConversationList/ConversationCreate/ConversationCreateGroupDetail/ConversationCreateGroupDetail.vue CHANGED Viewed

@@ -120,5 +120,5 @@ const groupInfoChange = (value: string, type: string) => {
 </script>
 <style lang="scss" module>
-@import './ConversationCreateGroupDetail.scss';
+@use './ConversationCreateGroupDetail.scss';
 </style>

package/src/components/ConversationList/ConversationCreate/ConversationCreateUserSelectList/ConversationCreateUserSelectList.vue CHANGED Viewed

@@ -61,5 +61,5 @@ const handleSelectListUpdate = (list: UserPickerResult) => {
 </script>
 <style lang="scss" module>
-@import './ConversationCreateUserSelectList.scss';
+@use './ConversationCreateUserSelectList.scss';
 </style>

package/src/components/ConversationList/ConversationCreate/ConversationGroupTypeInfo/ConversationGroupTypeInfo.vue CHANGED Viewed

@@ -57,5 +57,5 @@ const selectGroupType = (type: GroupType) => {
 </script>
 <style lang="scss" module>
-@import './ConversationGroupTypeInfo.scss';
+@use './ConversationGroupTypeInfo.scss';
 </style>

package/src/components/ConversationList/ConversationList.vue CHANGED Viewed

@@ -44,7 +44,7 @@
         :Preview="Preview"
         :ConversationActions="ConversationActions"
         :actions-config="actionsConfig"
-        @select="handleSelectConversation"
+        @select-conversation="handleSelectConversation"
       />
     </component>
   </div>
@@ -185,5 +185,5 @@ const handleCreated = (conversation: ConversationModel) => {
 </script>
 <style lang="scss" module>
-@import './ConversationList.scss';
+@use './ConversationList.scss';
 </style>

package/src/components/ConversationList/ConversationListContent/ConversationListContent.vue CHANGED Viewed

@@ -46,5 +46,5 @@ const props = withDefaults(defineProps<ConversationListContentProps>(), {
 </script>
 <style lang="scss" module>
-@import './ConversationListContent.scss';
+@use './ConversationListContent.scss';
 </style>

package/src/components/ConversationList/ConversationListHeader/ConversationListHeader.vue CHANGED Viewed

@@ -47,5 +47,5 @@ const props = withDefaults(defineProps<ConversationListHeaderProps>(), {
 </script>
 <style lang="scss" module>
-@import './ConversationListHeader.scss';
+@use './ConversationListHeader.scss';
 </style>

package/src/components/ConversationList/ConversationPlaceHolder/ConversationPlaceHolder.vue CHANGED Viewed

@@ -74,5 +74,5 @@ const placeholderText = computed(() => {
 </script>
 <style lang="scss" module>
-@import './ConversationPlaceHolder.scss';
+@use './ConversationPlaceHolder.scss';
 </style>

package/src/components/ConversationList/ConversationPreview/ConversationPreview.vue CHANGED Viewed

@@ -14,7 +14,7 @@
       :actionsConfig="actionsConfig"
       :className="className"
       :style="style"
-      @select="handleSelectConversation"
+      @select-conversation="handleSelectConversation"
     >
       <slot />
     </component>

package/src/components/ConversationList/ConversationPreview/ConversationPreviewAbstract.vue CHANGED Viewed

@@ -33,5 +33,5 @@ const latestMessagePreview = computed(() => getLatestMessagePreview(props.conver
 </script>
 <style lang="scss" module>
-@import './ConversationPreview.scss';
+@use './ConversationPreview.scss';
 </style>

package/src/components/ConversationList/ConversationPreview/ConversationPreviewTimestamp.vue CHANGED Viewed

@@ -5,6 +5,7 @@
 </template>
 <script lang="ts" setup>
+import { computed } from 'vue';
 import { useUIKit } from '@tencentcloud/uikit-base-component-vue3';
 import { getTimeStamp } from '../../../utils/time';
 import type { ConversationModel } from '../../../types';
@@ -15,13 +16,12 @@ const props = defineProps<{
 const { language } = useUIKit();
-const time = getTimeStamp({
+const time = computed(() => getTimeStamp({
   time: Number(props.conversation?.lastMessage?.lastTime || 0) * 1000,
   language: language.value,
-}) || '';
+}) || '');
 </script>
 <style lang="scss" module>
-@import './ConversationPreview.scss';
+@use './ConversationPreview.scss';
 </style>

package/src/components/ConversationList/ConversationPreview/ConversationPreviewTitle.vue CHANGED Viewed

@@ -15,5 +15,5 @@ const title =props?.conversation?.getShowName?.() || '';
 </script>
 <style lang="scss" module>
-@import './ConversationPreview.scss';
+@use './ConversationPreview.scss';
 </style>

package/src/components/ConversationList/ConversationPreview/ConversationPreviewUI.vue CHANGED Viewed

@@ -96,7 +96,7 @@ const props = withDefaults(defineProps<ConversationPreviewUIProps>(), {
 });
 const emit = defineEmits<{
-  select: [conversation: ConversationModel];
+  selectConversation: [conversation: ConversationModel];
 }>();
 const { activeConversation, setActiveConversation } = useConversationListState();
@@ -120,7 +120,7 @@ watch(isHovered, (newValue) => {
 });
 const handleClick = () => {
-  emit('select', props.conversation);
+  emit('selectConversation', props.conversation);
   setActiveConversation(props.conversation.conversationID);
 };
@@ -130,5 +130,5 @@ const handleCloseActionsModal = () => {
 </script>
 <style lang="scss" module>
-@import './ConversationPreview.scss';
+@use './ConversationPreview.scss';
 </style>

package/src/components/ConversationList/ConversationPreview/ConversationPreviewUnread.vue CHANGED Viewed

@@ -30,5 +30,5 @@ const isUnreadMarked = computed(() => props.conversation?.markList?.includes(TUI
 </script>
 <style lang="scss" module>
-@import './ConversationPreview.scss';
+@use './ConversationPreview.scss';
 </style>

package/src/components/ConversationList/ConversationSearch/ConversationSearch.vue CHANGED Viewed

@@ -188,5 +188,5 @@ watch(keyword, handleSearchChange, { immediate: true });
 </script>
 <style lang="scss" module>
-@import './ConversationSearch.scss';
+@use './ConversationSearch.scss';
 </style>