tuikit-atomicx-vue3 0.1.0 → 3.3.0-beta.3

package/dist/components/ChatSetting/SettingItem/SettingItem.js

@@ -0,0 +1,295 @@
+import { defineComponent, useCssModule, ref, createElementBlock, openBlock, normalizeClass, unref, createElementVNode, toDisplayString, createCommentVNode, Fragment, createVNode, withCtx, createTextVNode, createBlock, normalizeStyle, nextTick } from "vue";
+import { c as cs } from "../../../index-BF6QB9jF.js";
+import { useUIKit, TUIButton, IconEditNameCard } from "@tencentcloud/uikit-base-component-vue3";
+import { _ as _export_sfc } from "../../../_plugin-vue_export-helper-1tPrXgE0.js";
+const _hoisted_1 = ["checked", "disabled"];
+const _hoisted_2 = ["value", "placeholder", "disabled"];
+const _hoisted_3 = ["value", "rows", "placeholder", "disabled"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SettingItem",
+  props: ["label", "type", "value", "disabled", "placeholder", "editable", "validator", "rows"],
+  emits: ["change", "confirm"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const SettingItemType = {
+      SWITCH: "switch",
+      INPUT: "input",
+      TEXTAREA: "textarea",
+      DISPLAY: "display"
+    };
+    const { t } = useUIKit();
+    const classes = useCssModule();
+    const isEditing = ref(false);
+    const editValue = ref("");
+    const errorMessage = ref(null);
+    const inputRef = ref();
+    const textareaRef = ref();
+    function validateValue(value) {
+      if (props.type === SettingItemType.INPUT || props.type === SettingItemType.TEXTAREA) {
+        const { validator } = props;
+        if (validator) {
+          return validator(value, props.value);
+        }
+      }
+      return null;
+    }
+    function handleValueChange(event) {
+      const target = event.target;
+      const newValue = target.value;
+      editValue.value = newValue;
+      const error = validateValue(newValue);
+      errorMessage.value = error;
+    }
+    async function startEdit() {
+      if (props.disabled || props.type !== SettingItemType.INPUT && props.type !== SettingItemType.TEXTAREA) {
+        return;
+      }
+      const currentValue = props.value || "";
+      editValue.value = currentValue;
+      isEditing.value = true;
+      await nextTick();
+      if (props.type === SettingItemType.INPUT && inputRef.value) {
+        inputRef.value.focus();
+        inputRef.value.select();
+      } else if (props.type === SettingItemType.TEXTAREA && textareaRef.value) {
+        textareaRef.value.focus();
+        textareaRef.value.select();
+      }
+    }
+    function cancelEdit() {
+      isEditing.value = false;
+      editValue.value = "";
+      errorMessage.value = null;
+    }
+    function confirmEdit() {
+      if (props.type === SettingItemType.INPUT || props.type === SettingItemType.TEXTAREA) {
+        if (!errorMessage.value) {
+          emit("confirm", editValue.value);
+        }
+      }
+      isEditing.value = false;
+      editValue.value = "";
+      errorMessage.value = null;
+    }
+    function handleKeyPress(event) {
+      if (event.key === "Enter" && !event.shiftKey && props.type === SettingItemType.INPUT) {
+        event.preventDefault();
+        if (!errorMessage.value) {
+          confirmEdit();
+        }
+      } else if (event.key === "Escape") {
+        event.preventDefault();
+        cancelEdit();
+      }
+    }
+    function handleSwitchChange(event) {
+      if (props.type === SettingItemType.SWITCH) {
+        const target = event.target;
+        emit("change", target.checked);
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass([
+          unref(classes)["setting-item"],
+          {
+            [unref(classes)[`setting-item--${__props.type}`]]: !!__props.type,
+            [unref(classes)["setting-item--disabled"]]: __props.disabled,
+            [unref(classes)["setting-item--editing"]]: isEditing.value,
+            [unref(classes)["setting-item--error"]]: !!errorMessage.value
+          }
+        ])
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(unref(classes)["setting-item__label"])
+        }, toDisplayString(__props.label), 3),
+        createElementVNode("div", {
+          class: normalizeClass(unref(classes)["setting-item__content-wrapper"])
+        }, [
+          __props.type === SettingItemType.SWITCH ? (openBlock(), createElementBlock("label", {
+            key: 0,
+            class: normalizeClass(unref(classes)["setting-item__switch"])
+          }, [
+            createElementVNode("input", {
+              class: normalizeClass(unref(classes)["setting-item__switch-input"]),
+              type: "checkbox",
+              checked: __props.value,
+              disabled: __props.disabled,
+              onChange: handleSwitchChange
+            }, null, 42, _hoisted_1),
+            createElementVNode("span", {
+              class: normalizeClass(unref(classes)["setting-item__switch-slider"])
+            }, null, 2)
+          ], 2)) : __props.type === SettingItemType.INPUT ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            isEditing.value && __props.editable ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: normalizeClass(unref(classes)["setting-item__edit-container"])
+            }, [
+              createElementVNode("div", null, [
+                createElementVNode("input", {
+                  ref_key: "inputRef",
+                  ref: inputRef,
+                  class: normalizeClass([
+                    unref(classes)["setting-item__input"],
+                    { [unref(classes)["setting-item__input--error"]]: !!errorMessage.value }
+                  ]),
+                  type: "text",
+                  value: editValue.value,
+                  placeholder: __props.placeholder,
+                  disabled: __props.disabled,
+                  onInput: handleValueChange,
+                  onKeydown: handleKeyPress
+                }, null, 42, _hoisted_2),
+                errorMessage.value ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  class: normalizeClass(unref(classes)["setting-item__error"])
+                }, toDisplayString(errorMessage.value), 3)) : createCommentVNode("", true)
+              ]),
+              createElementVNode("div", {
+                class: normalizeClass(unref(classes)["setting-item__actions"])
+              }, [
+                createVNode(unref(TUIButton), {
+                  class: normalizeClass(unref(classes)["setting-item__btn--cancel"]),
+                  color: "gray",
+                  radius: "rect",
+                  disabled: __props.disabled,
+                  onClick: cancelEdit
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(t)("ChatSetting.cancel")), 1)
+                  ]),
+                  _: 1
+                }, 8, ["class", "disabled"]),
+                createVNode(unref(TUIButton), {
+                  class: normalizeClass(unref(classes)["setting-item__btn--confirm"]),
+                  color: "blue",
+                  radius: "rect",
+                  disabled: __props.disabled || !!errorMessage.value || props.value === editValue.value,
+                  onClick: confirmEdit
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(t)("ChatSetting.confirm")), 1)
+                  ]),
+                  _: 1
+                }, 8, ["class", "disabled"])
+              ], 2)
+            ], 2)) : (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: normalizeClass(unref(classes)["setting-item__content"])
+            }, [
+              createElementVNode("span", {
+                class: normalizeClass([unref(classes)["setting-item__value"], { [unref(classes)["setting-item__value--placeholder"]]: !__props.value }])
+              }, toDisplayString(__props.value || __props.placeholder || unref(t)("ChatSetting.not_set")), 3),
+              __props.editable ? (openBlock(), createBlock(unref(IconEditNameCard), {
+                key: 0,
+                class: normalizeClass(unref(cs)(unref(classes)["setting-item__edit-btn"], "unique-icon-btn")),
+                style: normalizeStyle({ cursor: __props.disabled ? "not-allowed" : "pointer" }),
+                onClick: startEdit
+              }, null, 8, ["class", "style"])) : createCommentVNode("", true)
+            ], 2))
+          ], 64)) : __props.type === SettingItemType.TEXTAREA ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+            isEditing.value && __props.editable ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: normalizeClass(unref(classes)["setting-item__edit-container"])
+            }, [
+              createElementVNode("div", null, [
+                createElementVNode("textarea", {
+                  ref_key: "textareaRef",
+                  ref: textareaRef,
+                  class: normalizeClass([
+                    unref(classes)["setting-item__textarea"],
+                    { [unref(classes)["setting-item__textarea--error"]]: !!errorMessage.value }
+                  ]),
+                  value: editValue.value,
+                  rows: __props.rows || 3,
+                  placeholder: __props.placeholder,
+                  disabled: __props.disabled,
+                  onInput: handleValueChange,
+                  onKeydown: handleKeyPress
+                }, null, 42, _hoisted_3),
+                errorMessage.value ? (openBlock(), createElementBlock("div", {
+                  key: 0,
+                  class: normalizeClass(unref(classes)["setting-item__error"])
+                }, toDisplayString(errorMessage.value), 3)) : createCommentVNode("", true)
+              ]),
+              createElementVNode("div", {
+                class: normalizeClass(unref(classes)["setting-item__actions"])
+              }, [
+                createVNode(unref(TUIButton), {
+                  class: normalizeClass(unref(classes)["setting-item__btn--cancel"]),
+                  color: "gray",
+                  radius: "rect",
+                  disabled: __props.disabled,
+                  onClick: cancelEdit
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(t)("ChatSetting.cancel")), 1)
+                  ]),
+                  _: 1
+                }, 8, ["class", "disabled"]),
+                createVNode(unref(TUIButton), {
+                  class: normalizeClass(unref(classes)["setting-item__btn--confirm"]),
+                  color: "blue",
+                  radius: "rect",
+                  disabled: __props.disabled || !!errorMessage.value || props.value === editValue.value,
+                  onClick: confirmEdit
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(t)("ChatSetting.confirm")), 1)
+                  ]),
+                  _: 1
+                }, 8, ["class", "disabled"])
+              ], 2)
+            ], 2)) : (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: normalizeClass(unref(classes)["setting-item__content"])
+            }, [
+              createElementVNode("span", {
+                class: normalizeClass([unref(classes)["setting-item__value"], { [unref(classes)["setting-item__value--placeholder"]]: !__props.value }])
+              }, toDisplayString(__props.value || __props.placeholder || unref(t)("ChatSetting.not_set")), 3),
+              __props.editable ? (openBlock(), createBlock(unref(IconEditNameCard), {
+                key: 0,
+                class: normalizeClass(unref(cs)(unref(classes)["setting-item__edit-btn"], "unique-icon-btn")),
+                style: normalizeStyle({ cursor: __props.disabled ? "not-allowed" : "pointer" }),
+                onClick: startEdit
+              }, null, 8, ["class", "style"])) : createCommentVNode("", true)
+            ], 2))
+          ], 64)) : __props.type === SettingItemType.DISPLAY ? (openBlock(), createElementBlock("span", {
+            key: 3,
+            class: normalizeClass(unref(classes)["setting-item__value"])
+          }, toDisplayString(__props.value || __props.placeholder || unref(t)("ChatSetting.not_set")), 3)) : createCommentVNode("", true)
+        ], 2)
+      ], 2);
+    };
+  }
+});
+const style0 = {
+  "setting-item": "_setting-item_bjdj6_1",
+  "setting-item--disabled": "_setting-item--disabled_bjdj6_13",
+  "setting-item__switch-slider": "_setting-item__switch-slider_bjdj6_17",
+  "setting-item--switch": "_setting-item--switch_bjdj6_20",
+  "setting-item__label": "_setting-item__label_bjdj6_25",
+  "setting-item__content-wrapper": "_setting-item__content-wrapper_bjdj6_30",
+  "setting-item__content": "_setting-item__content_bjdj6_30",
+  "setting-item__value": "_setting-item__value_bjdj6_43",
+  "setting-item__value--placeholder": "_setting-item__value--placeholder_bjdj6_49",
+  "setting-item__switch": "_setting-item__switch_bjdj6_17",
+  "setting-item__switch-input": "_setting-item__switch-input_bjdj6_60",
+  "setting-item__edit-container": "_setting-item__edit-container_bjdj6_97",
+  "setting-item__input": "_setting-item__input_bjdj6_103",
+  "setting-item__textarea": "_setting-item__textarea_bjdj6_103",
+  "setting-item__input--error": "_setting-item__input--error_bjdj6_120",
+  "setting-item__textarea--error": "_setting-item__textarea--error_bjdj6_120",
+  "setting-item__error": "_setting-item__error_bjdj6_127",
+  "setting-item__actions": "_setting-item__actions_bjdj6_132",
+  "setting-item__btn--cancel": "_setting-item__btn--cancel_bjdj6_137",
+  "setting-item__btn--confirm": "_setting-item__btn--confirm_bjdj6_137"
+};
+const cssModules = {
+  "$style": style0
+};
+const SettingItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
+export {
+  SettingItem as default
+};

package/dist/components/ChatSetting/SettingItem/SettingItem.vue.d.ts

@@ -0,0 +1,26 @@
+declare const _default: import('vue').DefineComponent<{
+    type?: any;
+    label?: any;
+    placeholder?: any;
+    disabled?: any;
+    value?: any;
+    editable?: any;
+    validator?: any;
+    rows?: any;
+}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    change: (...args: any[]) => void;
+    confirm: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<{
+    type?: any;
+    label?: any;
+    placeholder?: any;
+    disabled?: any;
+    value?: any;
+    editable?: any;
+    validator?: any;
+    rows?: any;
+}> & Readonly<{
+    onChange?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/ChatSetting/SettingItem/index.d.ts

@@ -0,0 +1,3 @@
+import { default as SettingItem } from './SettingItem.vue';
+
+export { SettingItem };

package/dist/components/ChatSetting/SettingItem/index.js

@@ -0,0 +1,4 @@
+import { default as default2 } from "./SettingItem.js";
+export {
+  default2 as SettingItem
+};

package/dist/components/ChatSetting/i18n/en-US.d.ts

@@ -0,0 +1,95 @@
+declare const ChatSetting: {
+    cancel: string;
+    confirm: string;
+    not_set: string;
+    user_id: string;
+    nickname: string;
+    nickname_placeholder: string;
+    signature: string;
+    remark: string;
+    remark_placeholder: string;
+    remark_update_success: string;
+    pin_conversation: string;
+    mute_conversation: string;
+    copied: string;
+    remove_member_dialog_title: string;
+    add_member_dialog_title: string;
+    failed_to_load_more_members: string;
+    failed_to_remove_member: string;
+    me: string;
+    group_id: string;
+    group_name: string;
+    group_name_placeholder: string;
+    group_introduction: string;
+    group_introduction_placeholder: string;
+    group_notification: string;
+    group_notification_placeholder: string;
+    my_name_card: string;
+    my_name_card_placeholder: string;
+    group_type: string;
+    group_type_work: string;
+    group_type_public: string;
+    group_type_meeting: string;
+    group_type_community: string;
+    group_type_avchatroom: string;
+    group_type_unknown: string;
+    group_name_required_string: string;
+    group_name_required: string;
+    group_name_max_length: string;
+    group_name_unchanged: string;
+    group_introduction_required_string: string;
+    group_introduction_max_length: string;
+    group_introduction_unchanged: string;
+    group_notification_required_string: string;
+    group_notification_max_length: string;
+    group_notification_unchanged: string;
+    group_name_card_required_string: string;
+    group_name_card_unchanged: string;
+    group_name_update_success: string;
+    group_name_update_failed: string;
+    group_introduction_update_success: string;
+    group_introduction_update_failed: string;
+    group_notification_update_success: string;
+    group_notification_update_failed: string;
+    group_name_card_update_success: string;
+    group_name_card_update_failed: string;
+    group_member_add_success: string;
+    group_member_add_failed: string;
+    group_member_add_partially_failed: string;
+    group_member_remove_success: string;
+    group_member_remove_failed: string;
+    group_members: string;
+    add: string;
+    remove: string;
+    loading: string;
+    all_members_shown: string;
+    collapse: string;
+    transfer_group_owner: string;
+    quit_group: string;
+    dismiss_group: string;
+    confirm_quit_group: string;
+    select_new_owner_error: string;
+    only_one_owner_error: string;
+    transfer_owner_success: string;
+    transfer_owner_failed: string;
+    quit_group_success: string;
+    quit_group_failed: string;
+    group_management: string;
+    set_admin: string;
+    unset_admin: string;
+    mute_members: string;
+    unmute_members: string;
+    operation_success: string;
+    operation_failed: string;
+    all_members_muted: string;
+    all_members_unmuted: string;
+    mute_all_failed: string;
+    group_admin: string;
+    mute_management: string;
+    mute_all_members: string;
+    mute_all_members_description: string;
+    group_member_role_owner: string;
+    group_member_role_admin: string;
+    group_member_role_member: string;
+};
+export default ChatSetting;

package/dist/components/ChatSetting/i18n/en-US.js

@@ -0,0 +1,107 @@
+const ChatSetting = {
+  // SettingItem
+  cancel: "Cancel",
+  confirm: "Confirm",
+  not_set: "Not Set",
+  // C2CChatSetting
+  user_id: "User ID",
+  nickname: "Nickname",
+  nickname_placeholder: "No nickname set",
+  signature: "Signature",
+  remark: "Remark",
+  remark_placeholder: "No remark set",
+  remark_update_success: "Remark updated successfully",
+  pin_conversation: "Pin Conversation",
+  mute_conversation: "Mute Conversation",
+  copied: "Copied",
+  // GroupChatSetting
+  remove_member_dialog_title: "Remove Group Member",
+  add_member_dialog_title: "Add Group Member",
+  failed_to_load_more_members: "Failed to load more members",
+  failed_to_remove_member: "Failed to remove member",
+  me: "Me",
+  // GroupInfo
+  group_id: "Group ID",
+  group_name: "Group Name",
+  group_name_placeholder: "No group name set",
+  group_introduction: "Group Introduction",
+  group_introduction_placeholder: "No group introduction",
+  group_notification: "Group Notification",
+  group_notification_placeholder: "No group notification",
+  my_name_card: "My Name Card",
+  my_name_card_placeholder: "No name card set",
+  group_type: "Group Type",
+  group_type_work: "Work Group",
+  group_type_public: "Public Group",
+  group_type_meeting: "Meeting Group",
+  group_type_community: "Community",
+  group_type_avchatroom: "Live Group",
+  group_type_unknown: "Unknown Type",
+  // Validation messages
+  group_name_required_string: "Group name must be a string",
+  group_name_required: "Group name cannot be empty",
+  group_name_max_length: "Group name cannot exceed 25 characters",
+  group_name_unchanged: "Please modify the group name before submitting",
+  group_introduction_required_string: "Group introduction must be a string",
+  group_introduction_max_length: "Group introduction cannot exceed 100 characters",
+  group_introduction_unchanged: "Please modify the group introduction before submitting",
+  group_notification_required_string: "Group notification must be a string",
+  group_notification_max_length: "Group notification cannot exceed 100 characters",
+  group_notification_unchanged: "Please modify the group notification before submitting",
+  group_name_card_required_string: "Name card must be a string",
+  group_name_card_unchanged: "Please modify the name card before submitting",
+  // Success/Error messages
+  group_name_update_success: "Group name updated successfully",
+  group_name_update_failed: "Failed to update group name",
+  group_introduction_update_success: "Group introduction updated successfully",
+  group_introduction_update_failed: "Failed to update group introduction",
+  group_notification_update_success: "Group notification updated successfully",
+  group_notification_update_failed: "Failed to update group notification",
+  group_name_card_update_success: "Name card updated successfully",
+  group_name_card_update_failed: "Failed to update name card",
+  group_member_add_success: "Member added successfully",
+  group_member_add_failed: "Failed to add member",
+  group_member_add_partially_failed: "Partially member added failed",
+  group_member_remove_success: "Member removed successfully",
+  group_member_remove_failed: "Failed to remove member",
+  // GroupMembers
+  group_members: "Group Members",
+  add: "Add",
+  remove: "Remove",
+  loading: "Loading...",
+  all_members_shown: "All members shown",
+  collapse: "Collapse",
+  // GroupActions
+  transfer_group_owner: "Transfer Group Owner",
+  quit_group: "Quit Group",
+  dismiss_group: "Dismiss Group",
+  confirm_quit_group: "Are you sure you want to quit the group?",
+  select_new_owner_error: "Please select a new owner",
+  only_one_owner_error: "Only one member can be selected as the new owner",
+  transfer_owner_success: "Ownership transferred successfully",
+  transfer_owner_failed: "Failed to transfer ownership",
+  quit_group_success: "Successfully left the group",
+  quit_group_failed: "Failed to leave the group",
+  // GroupManagement
+  group_management: "Group Management",
+  set_admin: "Set Admin",
+  unset_admin: "Remove Admin",
+  mute_members: "Mute Members",
+  unmute_members: "Unmute Members",
+  operation_success: "Operation completed successfully",
+  operation_failed: "Operation failed",
+  all_members_muted: "All members muted",
+  all_members_unmuted: "All members unmuted",
+  mute_all_failed: "Failed to update mute all setting",
+  group_admin: "Group Admin",
+  mute_management: "Mute Management",
+  mute_all_members: "Mute All Members",
+  mute_all_members_description: "When enabled, only the group owner and admins can speak",
+  // GroupMemberRole
+  group_member_role_owner: "Group Owner",
+  group_member_role_admin: "Admin",
+  group_member_role_member: "Member"
+};
+export {
+  ChatSetting as default
+};