npm - zignal-stencil-library - Versions diffs - 1.1.121 → 1.1.123 - Mend

zignal-stencil-library 1.1.121 → 1.1.123

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 (391) hide show

package/dist/collection/components/dialog-search/dialog-search.js CHANGED Viewed

@@ -63,10 +63,10 @@ export class DialogSearch {
         const theme = configStore.get('theme');
         const isMobile = responsiveStore.get('isMobile');
         const selectReadOptions = [{ label: t('chat_tab.all_chat') }, { label: t('chat_tab.already_read'), value: true }, { label: t('chat_tab.unread'), value: false }];
-        return (h(Host, { key: 'c75cb00a8f108f2c54aa833f2f42d00083203db1' }, h("div", { key: '725102782e251e5bcf5544a7dc0dc71025717cdf', class: `dialog-search scroll-container z-background-${theme} ${isMobile ? 'w-xs' : 'w-xl'}` }, h("div", { key: '8c4b2c1177e1f77cf488b6168741dfe9be756e26', class: "dialog-search-toolbar-action" }, h("div", { key: '7aa1807c7a909c9a9a8a287656ce0bb4aad81d8a', class: "dialog-search-toolbar-action-wrapper " }, h("span", { key: '66517a9a1565e5029d05d399e2bfdeadceedfa14', class: `dialog-search-toolbar-action-reset z-text-${theme}`, onClick: this.handleReset }, t('reset')), h(ZIconButton, { key: '8176803f3b916466523d852e21567fe9eb2ddf36', iconName: "X", variant: "none", onClick: this.handleCancel }))), h("h2", { key: '6ec3a7f7b51e9fa97b5a521d36c8510e5496b937', class: `dialog-search-toolbar-title z-text-${theme}` }, t('chat_tab.search_chat')), h("div", { key: '36be24f841c6ebc4698d1fcae5c50c84abaaa2fe', class: "space-y-2" }, h("p", { key: '9dd4b01e17a0ccec920685c72c82a070041fba48', class: `font-bold z-text-${theme}` }, t('search'), "\u00A0", h("span", { key: 'a75f71d81431d133e95b0417c0b72dbb1ae79f82', class: `text-sm z-text-gray-${theme}` }, "(", t('chat_tab.filter_search_fields'), ")")), h(ZInput, { key: '12b02b05e1904b73bb1a68132c1ff89b9d91c223', placeholder: t('search'), value: this.filter.search, onChange: value => this.handleChange('search', value) }), h("p", { key: 'c9a5575ea47f5740832572a2115d678d3f179e74', class: `font-bold z-text-${theme}` }, t('chat_tab.read_status')), h("div", { key: '3dcbeab543b64a902469232b85740bfa0b459f88', class: "dialog-search-read-option" }, selectReadOptions.map(({ label, value }) => {
+        return (h(Host, { key: 'd678c177cbe132b56297762424e02e99b178cbb4', "data-theme": theme }, h("div", { key: '5e7f1e60e8270b1db3a1b8572adeaa0b9555c9f9', class: `dialog-search scroll-container ${isMobile ? 'w-xs' : 'w-xl'}` }, h("div", { key: '43c60f0722d2e654662cc406a17650251d50294a', class: "dialog-search-toolbar-action" }, h("div", { key: '29c9ff2ba80484d95f3c3a97b194633e76784920', class: "dialog-search-toolbar-action-wrapper " }, h("span", { key: 'a13a6d58bbba8a109da32d1cead07d27330d14b1', class: "dialog-search-toolbar-action-reset", onClick: this.handleReset }, t('reset')), h(ZIconButton, { key: 'fb6ed5bebf8b43627b608ce0f29eb46907994709', iconName: "X", variant: "none", onClick: this.handleCancel }))), h("h2", { key: '2602ee536859cbbc9bd86a5a5081d24fe15db9b7', class: "dialog-search-toolbar-title" }, t('chat_tab.search_chat')), h("div", { key: 'd2f36836d63681762bee6008d9fa02b07d1d8552', class: "space-y-2" }, h("p", { key: '0fd2a930713f6cc738819122bc8f8d84c8580d2c', class: "dialog-search-text" }, t('search'), "\u00A0", h("span", { key: '63a995a2b22fdac330c471cb70d7103a845abde6', class: "text-sm text-theme-gray" }, "(", t('chat_tab.filter_search_fields'), ")")), h(ZInput, { key: '4e95fb75ec095c3a908193dcd5461f513fcbfff5', placeholder: t('search'), value: this.filter.search, onChange: value => this.handleChange('search', value) }), h("p", { key: '13aaa944edebc25835ab612b4298799df20420f8', class: "dialog-search-text" }, t('chat_tab.read_status')), h("div", { key: 'f985bd34085397ae135ba2a2883bdba4e3b7b2f6', class: "dialog-search-read-option" }, selectReadOptions.map(({ label, value }) => {
             const isSelected = value === this.filter.read;
             return h(ZButton, { variant: isSelected ? 'primary' : 'outlined', label: label, title: label, onClick: () => this.handleChange('read', value) });
-        })), h("p", { key: '62da81154a7eb9c6a4b6d04c249f116ebf47cb11', class: `font-bold z-text-${theme}` }, t('channel')), h("div", { key: '93ef5b5a3a4ee87f9d70c910bf64bf20b0f82e97', class: 'mb-2', id: "filter-channel" }, h("autocomplete-multiple-select", { key: 'fb39c5f5c85a0c2d81f61f5acd1cfebccd679b5f', selectedIds: this.filter.connectionIds, fetchItems: async () => Promise.resolve(this.connectionList), onSelecting: event => this.handleChange('connectionIds', event.detail), referenceSelector: "filter-channel" })), h("p", { key: '0f88d73944bc266749e17dd1253305124a126883', class: `font-bold z-text-${theme}` }, t('chat_tab.last_reply')), h("div", { key: '642a550999905d3b2c92f102f1f6a6e6b80ebfd0', class: 'mb-2', id: "filter-last-answer" }, h("autocomplete-multiple-select", { key: '2b6449a5c56f96cf4d9318bf24a523c368f43ed0', selectedIds: this.filter.lastAnswerByIds, fetchItems: async () => Promise.resolve(this.answerList), onSelecting: event => this.handleChange('lastAnswerByIds', event.detail), referenceSelector: "filter-last-answer" })), h("p", { key: 'b17efa41d23df810f5c4c89e8c154493e82f33ad', class: `font-bold z-text-${theme}` }, t('status')), h("div", { key: 'bd7cca775fa42c450f85f477b8bad10a4c7cb954', class: 'mb-2', id: "filter-status" }, h("autocomplete-multiple-select", { key: '287ae6fd15b56feb02bffc5d01adb8192c17ec45', selectedIds: this.filter.statusIds, fetchItems: handleGetUserStatuses, onSelecting: event => this.handleChange('statusIds', event.detail), referenceSelector: "filter-status" })), h("p", { key: '484cde3c2c37521bbff9a46c33514043bfca8bf5', class: `font-bold z-text-${theme}` }, t('tag')), h("div", { key: '207e1503635c216c1b1ee694625f1801511a58c2', class: 'mb-2', id: "filter-tag" }, h("autocomplete-multiple-select", { key: '5a9d86980eaf471bd83668985d71dd87f3eee211', selectedIds: this.filter.tagIds, fetchItems: handleGetUserTags, onSelecting: event => this.handleChange('tagIds', event.detail), referenceSelector: "filter-tag" }))), h("div", { key: 'a9d17d26a6ef75d244654f13cd49dc78f1507ad0', class: "dialog-search-action-wrapper" }, h(ZButton, { key: '33cd22ec63774aac2fd8abc0c47c5517b0e8a0b3', label: t('search_data'), fullWidth: true, onClick: this.handleSubmit })))));
+        })), h("p", { key: 'ca34b30b31c49ecd86a3438e181d6fa0369b2e74', class: "dialog-search-text" }, t('channel')), h("div", { key: '0ee6a28f8ac45e46dad97742f34c2bd8c39dce36', class: 'mb-2', id: "filter-channel" }, h("autocomplete-multiple-select", { key: '6c7e63ddd0e1a5753934d7302b686d5e654daa99', selectedIds: this.filter.connectionIds, fetchItems: async () => Promise.resolve(this.connectionList), onSelecting: event => this.handleChange('connectionIds', event.detail), referenceSelector: "filter-channel" })), h("p", { key: '4d71377c030b581a0bcd4b9e53032a4569afd165', class: "dialog-search-text" }, t('chat_tab.last_reply')), h("div", { key: '2df73f17583927b47af15ba5d60fc7bcab43f820', class: 'mb-2', id: "filter-last-answer" }, h("autocomplete-multiple-select", { key: 'f9256b294a3014fbdb4459336a5e8fd80e7041d3', selectedIds: this.filter.lastAnswerByIds, fetchItems: async () => Promise.resolve(this.answerList), onSelecting: event => this.handleChange('lastAnswerByIds', event.detail), referenceSelector: "filter-last-answer" })), h("p", { key: 'e7467babc20ac2d3c8eb7dde06675aeafbddd0bb', class: "dialog-search-text" }, t('status')), h("div", { key: '1d788dc6ced7ede7006974c35d01f21c91fe2810', class: 'mb-2', id: "filter-status" }, h("autocomplete-multiple-select", { key: '1849e828de78c03771c7981b6f65bfeffa436410', selectedIds: this.filter.statusIds, fetchItems: handleGetUserStatuses, onSelecting: event => this.handleChange('statusIds', event.detail), referenceSelector: "filter-status" })), h("p", { key: '11144a71e5025102b6ed8016dcbd687d24354bb9', class: "dialog-search-text" }, t('tag')), h("div", { key: 'd9f94480e8fd87d478d84e81e141eafc74d62530', class: 'mb-2', id: "filter-tag" }, h("autocomplete-multiple-select", { key: '48f4da99cc76599d487fd7879f2eea3e44a235da', selectedIds: this.filter.tagIds, fetchItems: handleGetUserTags, onSelecting: event => this.handleChange('tagIds', event.detail), referenceSelector: "filter-tag" }))), h("div", { key: 'dff66f56685aa3b1da22522fea88f66047a4bb2b', class: "dialog-search-action-wrapper" }, h(ZButton, { key: 'e03c5caca165bcfc79f88dee76c6a574c6182e19', label: t('search_data'), fullWidth: true, onClick: this.handleSubmit })))));
     }
     static get is() { return "dialog-search"; }
     static get originalStyleUrls() {

package/dist/collection/components/dialog-search/dialog-search.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dialog-search.js","sourceRoot":"","sources":["../../../src/components/dialog-search/dialog-search.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, Event, Host, State, h, Prop } from '@stencil/core';\nimport { ZButton } from '../internal-component/z-button';\nimport { ZInput } from '../internal-component/z-input';\nimport { configStore, filterChatsStore, responsiveStore } from '../../store/store';\nimport { SearchChatsParams } from '../../api/type';\nimport { handleGetUserStatuses, handleGetUserTags } from '../../store/chat';\nimport { useTranslation } from '../../utils/utils';\nimport { ZIconButton } from '../internal-component/z-icon-button';\n\n@Component({\n tag: 'dialog-search',\n styleUrl: 'dialog-search.css',\n})\nexport class DialogSearch {\n private connectionList = configStore.get('connectionList').map(connection => ({\n iconName: connection.type as string,\n label: connection.name,\n value: connection.id,\n id: connection.id,\n name: connection.name,\n }));\n\n private answerList = configStore.get('memberList').map(connection => {\n const fullName = [connection.member_account.first_name \|\| '', connection.member_account.last_name \|\| ''].join(' ').trim();\n const label = fullName ? `${fullName} (${connection.member_login_data.email})` : connection.member_login_data.email;\n return {\n label,\n value: connection.id,\n id: connection.id,\n name: label,\n };\n });\n\n private defaultFilter: SearchChatsParams = {\n search: '',\n // spam: false,\n read: undefined,\n connectionIds: this.connectionList.map(connection => connection.value) \|\| [],\n lastAnswerByIds: this.answerList.map(answer => answer.value) \|\| [],\n statusIds: [],\n tagIds: [],\n };\n\n @Prop() oldFilter: SearchChatsParams;\n\n @State() filter = this.defaultFilter;\n\n @Event() cancel: EventEmitter<void>;\n @Event() search: EventEmitter<SearchChatsParams>;\n\n componentWillLoad() {\n const _filter = {\n ...filterChatsStore.get('filterChat'),\n ...this.oldFilter,\n };\n\n if (Object.keys(_filter).length) {\n this.filter = _filter;\n }\n }\n\n handleCancel = () => {\n this.filter = this.defaultFilter;\n this.cancel.emit();\n };\n\n handleChange = (field: keyof typeof this.filter, value: string \| string[] \| boolean) => {\n this.filter = { ...this.filter, [field]: value };\n };\n\n handleSubmit = () => {\n this.search.emit(this.filter);\n };\n\n handleReset = () => {\n this.filter = this.defaultFilter;\n };\n\n render() {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const isMobile = responsiveStore.get('isMobile');\n\n const selectReadOptions = [{ label: t('chat_tab.all_chat') }, { label: t('chat_tab.already_read'), value: true }, { label: t('chat_tab.unread'), value: false }];\n\n return (\n <Host>\n <div class={`dialog-search scroll-container z-background-${theme} ${isMobile ? 'w-xs' : 'w-xl'}`}>\n <div class=\"dialog-search-toolbar-action\">\n <div class=\"dialog-search-toolbar-action-wrapper \">\n <span class={`dialog-search-toolbar-action-reset z-text-${theme}`} onClick={this.handleReset}>\n {t('reset')}\n </span>\n <ZIconButton iconName=\"X\" variant=\"none\" onClick={this.handleCancel} />\n </div>\n </div>\n <h2 class={`dialog-search-toolbar-title z-text-${theme}`}>{t('chat_tab.search_chat')}</h2>\n\n <div class=\"space-y-2\">\n <p class={`font-bold z-text-${theme}`}>\n {t('search')} \n <span class={`text-sm z-text-gray-${theme}`}>({t('chat_tab.filter_search_fields')})</span>\n </p>\n <ZInput placeholder={t('search')} value={this.filter.search} onChange={value => this.handleChange('search', value)} />\n\n <p class={`font-bold z-text-${theme}`}>{t('chat_tab.read_status')}</p>\n <div class=\"dialog-search-read-option\">\n {selectReadOptions.map(({ label, value }) => {\n const isSelected = value === this.filter.read;\n return <ZButton variant={isSelected ? 'primary' : 'outlined'} label={label} title={label} onClick={() => this.handleChange('read', value)} />;\n })}\n </div>\n\n <p class={`font-bold z-text-${theme}`}>{t('channel')}</p>\n <div class={'mb-2'} id=\"filter-channel\">\n {/* <checkbox-list itemList={this.connectionList} selected={new Set(this.filter.connectionIds)} onCheckbox={event => this.handleChange('connectionIds', event.detail)} /> /}\n <autocomplete-multiple-select\n selectedIds={this.filter.connectionIds}\n fetchItems={async () => Promise.resolve(this.connectionList)}\n onSelecting={event => this.handleChange('connectionIds', event.detail)}\n referenceSelector=\"filter-channel\"\n />\n </div>\n\n <p class={`font-bold z-text-${theme}`}>{t('chat_tab.last_reply')}</p>\n <div class={'mb-2'} id=\"filter-last-answer\">\n {/ <checkbox-list itemList={this.answerList} selected={new Set(this.filter.lastAnswerByIds)} onCheckbox={event => this.handleChange('lastAnswerByIds', event.detail)} /> */}\n <autocomplete-multiple-select\n selectedIds={this.filter.lastAnswerByIds}\n fetchItems={async () => Promise.resolve(this.answerList)}\n onSelecting={event => this.handleChange('lastAnswerByIds', event.detail)}\n referenceSelector=\"filter-last-answer\"\n />\n </div>\n\n <p class={`font-bold z-text-${theme}`}>{t('status')}</p>\n <div class={'mb-2'} id=\"filter-status\">\n <autocomplete-multiple-select\n selectedIds={this.filter.statusIds}\n fetchItems={handleGetUserStatuses}\n onSelecting={event => this.handleChange('statusIds', event.detail)}\n referenceSelector=\"filter-status\"\n />\n </div>\n\n <p class={`font-bold z-text-${theme}`}>{t('tag')}</p>\n <div class={'mb-2'} id=\"filter-tag\">\n <autocomplete-multiple-select\n selectedIds={this.filter.tagIds}\n fetchItems={handleGetUserTags}\n onSelecting={event => this.handleChange('tagIds', event.detail)}\n referenceSelector=\"filter-tag\"\n />\n </div>\n </div>\n\n <div class=\"dialog-search-action-wrapper\">\n <ZButton label={t('search_data')} fullWidth onClick={this.handleSubmit} />\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"dialog-search.js","sourceRoot":"","sources":["../../../src/components/dialog-search/dialog-search.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, Event, Host, State, h, Prop } from '@stencil/core';\nimport { ZButton } from '../internal-component/z-button';\nimport { ZInput } from '../internal-component/z-input';\nimport { configStore, filterChatsStore, responsiveStore } from '../../store/store';\nimport { SearchChatsParams } from '../../api/type';\nimport { handleGetUserStatuses, handleGetUserTags } from '../../store/chat';\nimport { useTranslation } from '../../utils/utils';\nimport { ZIconButton } from '../internal-component/z-icon-button';\n\n@Component({\n tag: 'dialog-search',\n styleUrl: 'dialog-search.css',\n})\nexport class DialogSearch {\n private connectionList = configStore.get('connectionList').map(connection => ({\n iconName: connection.type as string,\n label: connection.name,\n value: connection.id,\n id: connection.id,\n name: connection.name,\n }));\n\n private answerList = configStore.get('memberList').map(connection => {\n const fullName = [connection.member_account.first_name \|\| '', connection.member_account.last_name \|\| ''].join(' ').trim();\n const label = fullName ? `${fullName} (${connection.member_login_data.email})` : connection.member_login_data.email;\n return {\n label,\n value: connection.id,\n id: connection.id,\n name: label,\n };\n });\n\n private defaultFilter: SearchChatsParams = {\n search: '',\n // spam: false,\n read: undefined,\n connectionIds: this.connectionList.map(connection => connection.value) \|\| [],\n lastAnswerByIds: this.answerList.map(answer => answer.value) \|\| [],\n statusIds: [],\n tagIds: [],\n };\n\n @Prop() oldFilter: SearchChatsParams;\n\n @State() filter = this.defaultFilter;\n\n @Event() cancel: EventEmitter<void>;\n @Event() search: EventEmitter<SearchChatsParams>;\n\n componentWillLoad() {\n const _filter = {\n ...filterChatsStore.get('filterChat'),\n ...this.oldFilter,\n };\n\n if (Object.keys(_filter).length) {\n this.filter = _filter;\n }\n }\n\n handleCancel = () => {\n this.filter = this.defaultFilter;\n this.cancel.emit();\n };\n\n handleChange = (field: keyof typeof this.filter, value: string \| string[] \| boolean) => {\n this.filter = { ...this.filter, [field]: value };\n };\n\n handleSubmit = () => {\n this.search.emit(this.filter);\n };\n\n handleReset = () => {\n this.filter = this.defaultFilter;\n };\n\n render() {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const isMobile = responsiveStore.get('isMobile');\n\n const selectReadOptions = [{ label: t('chat_tab.all_chat') }, { label: t('chat_tab.already_read'), value: true }, { label: t('chat_tab.unread'), value: false }];\n\n return (\n <Host data-theme={theme}>\n <div class={`dialog-search scroll-container ${isMobile ? 'w-xs' : 'w-xl'}`}>\n <div class=\"dialog-search-toolbar-action\">\n <div class=\"dialog-search-toolbar-action-wrapper \">\n <span class=\"dialog-search-toolbar-action-reset\" onClick={this.handleReset}>\n {t('reset')}\n </span>\n <ZIconButton iconName=\"X\" variant=\"none\" onClick={this.handleCancel} />\n </div>\n </div>\n <h2 class=\"dialog-search-toolbar-title\">{t('chat_tab.search_chat')}</h2>\n\n <div class=\"space-y-2\">\n <p class=\"dialog-search-text\">\n {t('search')} \n <span class=\"text-sm text-theme-gray\">({t('chat_tab.filter_search_fields')})</span>\n </p>\n <ZInput placeholder={t('search')} value={this.filter.search} onChange={value => this.handleChange('search', value)} />\n\n <p class=\"dialog-search-text\">{t('chat_tab.read_status')}</p>\n <div class=\"dialog-search-read-option\">\n {selectReadOptions.map(({ label, value }) => {\n const isSelected = value === this.filter.read;\n return <ZButton variant={isSelected ? 'primary' : 'outlined'} label={label} title={label} onClick={() => this.handleChange('read', value)} />;\n })}\n </div>\n\n <p class=\"dialog-search-text\">{t('channel')}</p>\n <div class={'mb-2'} id=\"filter-channel\">\n {/* <checkbox-list itemList={this.connectionList} selected={new Set(this.filter.connectionIds)} onCheckbox={event => this.handleChange('connectionIds', event.detail)} /> /}\n <autocomplete-multiple-select\n selectedIds={this.filter.connectionIds}\n fetchItems={async () => Promise.resolve(this.connectionList)}\n onSelecting={event => this.handleChange('connectionIds', event.detail)}\n referenceSelector=\"filter-channel\"\n />\n </div>\n\n <p class=\"dialog-search-text\">{t('chat_tab.last_reply')}</p>\n <div class={'mb-2'} id=\"filter-last-answer\">\n {/ <checkbox-list itemList={this.answerList} selected={new Set(this.filter.lastAnswerByIds)} onCheckbox={event => this.handleChange('lastAnswerByIds', event.detail)} /> */}\n <autocomplete-multiple-select\n selectedIds={this.filter.lastAnswerByIds}\n fetchItems={async () => Promise.resolve(this.answerList)}\n onSelecting={event => this.handleChange('lastAnswerByIds', event.detail)}\n referenceSelector=\"filter-last-answer\"\n />\n </div>\n\n <p class=\"dialog-search-text\">{t('status')}</p>\n <div class={'mb-2'} id=\"filter-status\">\n <autocomplete-multiple-select\n selectedIds={this.filter.statusIds}\n fetchItems={handleGetUserStatuses}\n onSelecting={event => this.handleChange('statusIds', event.detail)}\n referenceSelector=\"filter-status\"\n />\n </div>\n\n <p class=\"dialog-search-text\">{t('tag')}</p>\n <div class={'mb-2'} id=\"filter-tag\">\n <autocomplete-multiple-select\n selectedIds={this.filter.tagIds}\n fetchItems={handleGetUserTags}\n onSelecting={event => this.handleChange('tagIds', event.detail)}\n referenceSelector=\"filter-tag\"\n />\n </div>\n </div>\n\n <div class=\"dialog-search-action-wrapper\">\n <ZButton label={t('search_data')} fullWidth onClick={this.handleSubmit} />\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/internal-component/about-section.js CHANGED Viewed

@@ -9,7 +9,7 @@ export const AboutSection = ({ user, readOnly = false, activeTabIndex, onOpenDia
     const t = useTranslation();
     const theme = configStore.get('theme');
     const selectedChat = selectedChatStore.get('selectedChat');
-    return (h("div", { class: "profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 border-divider", "data-theme": theme }, h("div", { class: "col-span-3" }, h("span", { class: "text-primary" }, t('about'))), h("div", { class: "col-span-1" }, h("span", { class: "text-sm text-gray" }, t('channel'))), h("div", { class: "col-span-2" }, h("div", { class: "profile-info-connection-wrapper" }, h("span", { class: "text-sm text-primary" }, user.channel === 'zignal' ? 'Zignal' : selectedChat.connection.name), h("img", { src: getChatChannelPictureUrl(selectedChat), alt: "agent avatar", class: "profile-info-avatar", loading: "lazy" }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('email'))), h("div", { class: "col-span-2 profile-info-box-wrapper" }, h("span", { class: `text-sm text-primary` }, user.email ? (Array.isArray(user.email) ? user.email.join(', ') : user.email) : '-'), !readOnly && activeTabIndex === 0 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Email', field: 'email', value: user.email }) }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('phone_no'))), h("div", { class: "col-span-2 profile-info-box-wrapper" }, h("span", { class: `text-sm text-primary` }, user.phone_number ? (Array.isArray(user.phone_number) ? user.phone_number.join(', ') : user.phone_number) : '-'), !readOnly && activeTabIndex === 0 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Phone no.', field: 'phone_number', value: user.phone_number }) }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('address'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: `profile-info-pre-line text-primary` }, getAddressAsText(user.address) || '-'), !readOnly && activeTabIndex === 0 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Address', field: 'address', value: user.address, type: 'address' }) }))), selectedChat.type !== 'group' &&
-        h(Fragment, null, h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('gender'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: `profile-info-capitalize text-primary` }, user.gender ? user.gender : '-'), !readOnly && activeTabIndex === 1 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Gender', field: 'gender', value: user.gender, type: 'input' }) })))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('locale'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: `text-sm text-primary` }, user.locale), !readOnly && activeTabIndex === 1 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Locale', field: 'locale', value: user.locale, type: 'input' }) }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('register_date'))), h("div", { class: "col-span-2" }, h("span", { class: `text-sm text-primary` }, displayDate(user.created_at))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('last_active_date'))), h("div", { class: "col-span-2" }, h("span", { class: `text-sm text-primary` }, displayDate(user.last_active_at))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-gray` }, t('note'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: `profile-info-pre-line text-primary` }, user.note ? user.note : '-'), !readOnly && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Note', field: 'note', value: user.note, type: 'textarea' }) })))));
+    return (h("div", { class: "profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 border-divider", "data-theme": theme }, h("div", { class: "col-span-3" }, h("span", { class: "text-surface" }, t('about'))), h("div", { class: "col-span-1" }, h("span", { class: "text-sm text-theme-gray" }, t('channel'))), h("div", { class: "col-span-2" }, h("div", { class: "profile-info-connection-wrapper" }, h("span", { class: "text-sm text-surface" }, user.channel === 'zignal' ? 'Zignal' : selectedChat.connection.name), h("img", { src: getChatChannelPictureUrl(selectedChat), alt: "agent avatar", class: "profile-info-avatar", loading: "lazy" }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-theme-gray` }, t('email'))), h("div", { class: "col-span-2 profile-info-box-wrapper" }, h("span", { class: `text-sm text-surface` }, user.email ? (Array.isArray(user.email) ? user.email.join(', ') : user.email) : '-'), !readOnly && activeTabIndex === 0 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Email', field: 'email', value: user.email }) }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-theme-gray` }, t('phone_no'))), h("div", { class: "col-span-2 profile-info-box-wrapper" }, h("span", { class: `text-sm text-surface` }, user.phone_number ? (Array.isArray(user.phone_number) ? user.phone_number.join(', ') : user.phone_number) : '-'), !readOnly && activeTabIndex === 0 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Phone no.', field: 'phone_number', value: user.phone_number }) }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-theme-gray` }, t('address'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: `profile-info-pre-line text-surface` }, getAddressAsText(user.address) || '-'), !readOnly && activeTabIndex === 0 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Address', field: 'address', value: user.address, type: 'address' }) }))), selectedChat.type !== 'group' &&
+        h(Fragment, null, h("div", { class: "col-span-1" }, h("span", { class: "text-sm text-theme-gray" }, t('gender'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: "profile-info-capitalize text-surface" }, user.gender ? user.gender : '-'), !readOnly && activeTabIndex === 1 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Gender', field: 'gender', value: user.gender, type: 'input' }) })))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-theme-gray` }, t('locale'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: `text-sm text-surface` }, user.locale), !readOnly && activeTabIndex === 1 && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Locale', field: 'locale', value: user.locale, type: 'input' }) }))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-theme-gray` }, t('register_date'))), h("div", { class: "col-span-2" }, h("span", { class: `text-sm text-surface` }, displayDate(user.created_at))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-theme-gray` }, t('last_active_date'))), h("div", { class: "col-span-2" }, h("span", { class: `text-sm text-surface` }, displayDate(user.last_active_at))), h("div", { class: "col-span-1" }, h("span", { class: `text-sm text-theme-gray` }, t('note'))), h("div", { class: "profile-info-content-wrapper-baseline" }, h("span", { class: `profile-info-pre-line text-surface` }, user.note ? user.note : '-'), !readOnly && (h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: () => onOpenDialogEditor({ label: 'Note', field: 'note', value: user.note, type: 'textarea' }) })))));
 };
 //# sourceMappingURL=about-section.js.map

package/dist/collection/components/internal-component/about-section.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"about-section.js","sourceRoot":"","sources":["../../../src/components/internal-component/about-section.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AAEjE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAS5D,MAAM,CAAC,MAAM,YAAY,GAA2C,CAAC,EAAE,IAAI,EAAE,QAAQ,GAAG,KAAK,EAAE,cAAc,EAAE,kBAAkB,EAAE,EAAE,EAAE;IACrI,MAAM,CAAC,GAAG,cAAc,EAAE,CAAC;IAC3B,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAE3D,OAAO,CACL,WAAK,KAAK,EAAC,wEAAwE,gBAAa,KAAK;QACnG,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAC,cAAc,IAAE,CAAC,CAAC,OAAO,CAAC,CAAQ,CAC1C;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAC,mBAAmB,IAAE,CAAC,CAAC,SAAS,CAAC,CAAQ,CACjD;QACN,WAAK,KAAK,EAAC,YAAY;YACrB,WAAK,KAAK,EAAC,iCAAiC;gBAC1C,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAQ;gBAC/G,WACE,GAAG,EAAE,wBAAwB,CAAC,YAAY,CAAC,EAC3C,GAAG,EAAC,cAAc,EAClB,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAC,MAAM,GACd,CACE,CACF;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,OAAO,CAAC,CAAQ,CACjD;QACN,WAAK,KAAK,EAAC,qCAAqC;YAC9C,YAAM,KAAK,EAAE,sBAAsB,IAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAQ;YAChI,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,QAAQ,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,GAAI,CACjK,CACG;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,UAAU,CAAC,CAAQ,CACpD;QACN,WAAK,KAAK,EAAC,qCAAqC;YAC9C,YAAM,KAAK,EAAE,sBAAsB,IAChC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,GAAG,CAC3G;YACN,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC,GAC1G,CACH,CACG;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,SAAS,CAAC,CAAQ,CACnD;QACN,WAAK,KAAK,EAAC,uCAAuC;YAChD,YAAM,KAAK,EAAE,oCAAoC,IAAG,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,GAAG,CAAQ;YAChG,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,GAC/G,CACH,CACG;QAEL,YAAY,CAAC,IAAI,KAAK,OAAO;YAC5B,EAAC,QAAQ;gBACP,WAAK,KAAK,EAAC,YAAY;oBACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,QAAQ,CAAC,CAAQ,CAClD;gBACN,WAAK,KAAK,EAAC,uCAAuC;oBAChD,YAAM,KAAK,EAAE,sCAAsC,IAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAQ;oBAC5F,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,GAC1G,CACH,CACG,CACG;QAGb,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,QAAQ,CAAC,CAAQ,CAClD;QACN,WAAK,KAAK,EAAC,uCAAuC;YAChD,YAAM,KAAK,EAAE,sBAAsB,IAAG,IAAI,CAAC,MAAM,CAAQ;YACxD,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,GAC1G,CACH,CACG;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,eAAe,CAAC,CAAQ,CACzD;QACN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,sBAAsB,IAAG,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAQ,CACtE;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,kBAAkB,CAAC,CAAQ,CAC5D;QACN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,sBAAsB,IAAG,WAAW,CAAC,IAAI,CAAC,cAAc,CAAC,CAAQ,CAC1E;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,mBAAmB,IAAG,CAAC,CAAC,MAAM,CAAC,CAAQ,CAChD;QACN,WAAK,KAAK,EAAC,uCAAuC;YAChD,YAAM,KAAK,EAAE,oCAAoC,IAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAQ;YACtF,CAAC,QAAQ,IAAI,CACZ,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,GACvG,CACH,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Fragment, FunctionalComponent, h } from '@stencil/core';\nimport { UserItem, UserAddress } from '../../store/type';\nimport { displayDate } from '../../utils/dayjs';\nimport { useTranslation } from '../../utils/utils';\nimport { ZIconButton } from './z-icon-button';\nimport { getAddressAsText } from '../../utils/func';\nimport { configStore, selectedChatStore } from '../../store/store';\nimport { getChatChannelPictureUrl } from '../../store/chat';\n\ninterface AboutSectionProps {\n user: UserItem;\n readOnly?: boolean;\n activeTabIndex: number;\n onOpenDialogEditor: (params: { label: string; field: string; value: string \| string[] \| UserAddress; type?: 'input' \| 'textarea' \| 'address' }) => void;\n}\n\nexport const AboutSection: FunctionalComponent<AboutSectionProps> = ({ user, readOnly = false, activeTabIndex, onOpenDialogEditor }) => {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const selectedChat = selectedChatStore.get('selectedChat');\n\n return (\n <div class=\"profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 border-divider\" data-theme={theme}>\n <div class=\"col-span-3\">\n <span class=\"text-primary\">{t('about')}</span>\n </div>\n\n <div class=\"col-span-1\">\n <span class=\"text-sm text-gray\">{t('channel')}</span>\n </div>\n <div class=\"col-span-2\">\n <div class=\"profile-info-connection-wrapper\">\n <span class=\"text-sm text-primary\">{user.channel === 'zignal' ? 'Zignal' : selectedChat.connection.name}</span>\n <img\n src={getChatChannelPictureUrl(selectedChat)}\n alt=\"agent avatar\"\n class=\"profile-info-avatar\"\n loading=\"lazy\"\n />\n </div>\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('email')}</span>\n </div>\n <div class=\"col-span-2 profile-info-box-wrapper\">\n <span class={`text-sm text-primary`}>{user.email ? (Array.isArray(user.email) ? user.email.join(', ') : user.email) : '-'}</span>\n {!readOnly && activeTabIndex === 0 && (\n <ZIconButton variant=\"text\" iconName=\"Pencil\" addClassIcon=\"size-4\" onClick={() => onOpenDialogEditor({ label: 'Email', field: 'email', value: user.email })} />\n )}\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('phone_no')}</span>\n </div>\n <div class=\"col-span-2 profile-info-box-wrapper\">\n <span class={`text-sm text-primary`}>\n {user.phone_number ? (Array.isArray(user.phone_number) ? user.phone_number.join(', ') : user.phone_number) : '-'}\n </span>\n {!readOnly && activeTabIndex === 0 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Phone no.', field: 'phone_number', value: user.phone_number })}\n />\n )}\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('address')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class={`profile-info-pre-line text-primary`}>{getAddressAsText(user.address) \|\| '-'}</span>\n {!readOnly && activeTabIndex === 0 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Address', field: 'address', value: user.address, type: 'address' })}\n />\n )}\n </div>\n\n {selectedChat.type !== 'group' &&\n <Fragment>\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('gender')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class={`profile-info-capitalize text-primary`}>{user.gender ? user.gender : '-'}</span>\n {!readOnly && activeTabIndex === 1 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Gender', field: 'gender', value: user.gender, type: 'input' })}\n />\n )}\n </div>\n </Fragment>\n }\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('locale')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class={`text-sm text-primary`}>{user.locale}</span>\n {!readOnly && activeTabIndex === 1 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Locale', field: 'locale', value: user.locale, type: 'input' })}\n />\n )}\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('register_date')}</span>\n </div>\n <div class=\"col-span-2\">\n <span class={`text-sm text-primary`}>{displayDate(user.created_at)}</span>\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('last_active_date')}</span>\n </div>\n <div class=\"col-span-2\">\n <span class={`text-sm text-primary`}>{displayDate(user.last_active_at)}</span>\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-gray`}>{t('note')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class={`profile-info-pre-line text-primary`}>{user.note ? user.note : '-'}</span>\n {!readOnly && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Note', field: 'note', value: user.note, type: 'textarea' })}\n />\n )}\n </div>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"about-section.js","sourceRoot":"","sources":["../../../src/components/internal-component/about-section.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AAEjE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AAS5D,MAAM,CAAC,MAAM,YAAY,GAA2C,CAAC,EAAE,IAAI,EAAE,QAAQ,GAAG,KAAK,EAAE,cAAc,EAAE,kBAAkB,EAAE,EAAE,EAAE;IACrI,MAAM,CAAC,GAAG,cAAc,EAAE,CAAC;IAC3B,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAE3D,OAAO,CACL,WAAK,KAAK,EAAC,wEAAwE,gBAAa,KAAK;QACnG,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAC,cAAc,IAAE,CAAC,CAAC,OAAO,CAAC,CAAQ,CAC1C;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAC,yBAAyB,IAAE,CAAC,CAAC,SAAS,CAAC,CAAQ,CACvD;QACN,WAAK,KAAK,EAAC,YAAY;YACrB,WAAK,KAAK,EAAC,iCAAiC;gBAC1C,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,CAAQ;gBAC/G,WACE,GAAG,EAAE,wBAAwB,CAAC,YAAY,CAAC,EAC3C,GAAG,EAAC,cAAc,EAClB,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAC,MAAM,GACd,CACE,CACF;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,yBAAyB,IAAG,CAAC,CAAC,OAAO,CAAC,CAAQ,CACvD;QACN,WAAK,KAAK,EAAC,qCAAqC;YAC9C,YAAM,KAAK,EAAE,sBAAsB,IAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAQ;YAChI,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,QAAQ,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,GAAI,CACjK,CACG;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,yBAAyB,IAAG,CAAC,CAAC,UAAU,CAAC,CAAQ,CAC1D;QACN,WAAK,KAAK,EAAC,qCAAqC;YAC9C,YAAM,KAAK,EAAE,sBAAsB,IAChC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,GAAG,CAC3G;YACN,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC,GAC1G,CACH,CACG;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,yBAAyB,IAAG,CAAC,CAAC,SAAS,CAAC,CAAQ,CACzD;QACN,WAAK,KAAK,EAAC,uCAAuC;YAChD,YAAM,KAAK,EAAE,oCAAoC,IAAG,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,GAAG,CAAQ;YAChG,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,GAC/G,CACH,CACG;QAEL,YAAY,CAAC,IAAI,KAAK,OAAO;YAC5B,EAAC,QAAQ;gBACP,WAAK,KAAK,EAAC,YAAY;oBACrB,YAAM,KAAK,EAAC,yBAAyB,IAAE,CAAC,CAAC,QAAQ,CAAC,CAAQ,CACtD;gBACN,WAAK,KAAK,EAAC,uCAAuC;oBAChD,YAAM,KAAK,EAAC,sCAAsC,IAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAQ;oBAC1F,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,GAC1G,CACH,CACG,CACG;QAGb,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,yBAAyB,IAAG,CAAC,CAAC,QAAQ,CAAC,CAAQ,CACxD;QACN,WAAK,KAAK,EAAC,uCAAuC;YAChD,YAAM,KAAK,EAAE,sBAAsB,IAAG,IAAI,CAAC,MAAM,CAAQ;YACxD,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,GAC1G,CACH,CACG;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,yBAAyB,IAAG,CAAC,CAAC,eAAe,CAAC,CAAQ,CAC/D;QACN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,sBAAsB,IAAG,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAQ,CACtE;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,yBAAyB,IAAG,CAAC,CAAC,kBAAkB,CAAC,CAAQ,CAClE;QACN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,sBAAsB,IAAG,WAAW,CAAC,IAAI,CAAC,cAAc,CAAC,CAAQ,CAC1E;QAEN,WAAK,KAAK,EAAC,YAAY;YACrB,YAAM,KAAK,EAAE,yBAAyB,IAAG,CAAC,CAAC,MAAM,CAAC,CAAQ,CACtD;QACN,WAAK,KAAK,EAAC,uCAAuC;YAChD,YAAM,KAAK,EAAE,oCAAoC,IAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAQ;YACtF,CAAC,QAAQ,IAAI,CACZ,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,QAAQ,EACjB,YAAY,EAAC,QAAQ,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,GACvG,CACH,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { Fragment, FunctionalComponent, h } from '@stencil/core';\nimport { UserItem, UserAddress } from '../../store/type';\nimport { displayDate } from '../../utils/dayjs';\nimport { useTranslation } from '../../utils/utils';\nimport { ZIconButton } from './z-icon-button';\nimport { getAddressAsText } from '../../utils/func';\nimport { configStore, selectedChatStore } from '../../store/store';\nimport { getChatChannelPictureUrl } from '../../store/chat';\n\ninterface AboutSectionProps {\n user: UserItem;\n readOnly?: boolean;\n activeTabIndex: number;\n onOpenDialogEditor: (params: { label: string; field: string; value: string \| string[] \| UserAddress; type?: 'input' \| 'textarea' \| 'address' }) => void;\n}\n\nexport const AboutSection: FunctionalComponent<AboutSectionProps> = ({ user, readOnly = false, activeTabIndex, onOpenDialogEditor }) => {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const selectedChat = selectedChatStore.get('selectedChat');\n\n return (\n <div class=\"profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 border-divider\" data-theme={theme}>\n <div class=\"col-span-3\">\n <span class=\"text-surface\">{t('about')}</span>\n </div>\n\n <div class=\"col-span-1\">\n <span class=\"text-sm text-theme-gray\">{t('channel')}</span>\n </div>\n <div class=\"col-span-2\">\n <div class=\"profile-info-connection-wrapper\">\n <span class=\"text-sm text-surface\">{user.channel === 'zignal' ? 'Zignal' : selectedChat.connection.name}</span>\n <img\n src={getChatChannelPictureUrl(selectedChat)}\n alt=\"agent avatar\"\n class=\"profile-info-avatar\"\n loading=\"lazy\"\n />\n </div>\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-theme-gray`}>{t('email')}</span>\n </div>\n <div class=\"col-span-2 profile-info-box-wrapper\">\n <span class={`text-sm text-surface`}>{user.email ? (Array.isArray(user.email) ? user.email.join(', ') : user.email) : '-'}</span>\n {!readOnly && activeTabIndex === 0 && (\n <ZIconButton variant=\"text\" iconName=\"Pencil\" addClassIcon=\"size-4\" onClick={() => onOpenDialogEditor({ label: 'Email', field: 'email', value: user.email })} />\n )}\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-theme-gray`}>{t('phone_no')}</span>\n </div>\n <div class=\"col-span-2 profile-info-box-wrapper\">\n <span class={`text-sm text-surface`}>\n {user.phone_number ? (Array.isArray(user.phone_number) ? user.phone_number.join(', ') : user.phone_number) : '-'}\n </span>\n {!readOnly && activeTabIndex === 0 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Phone no.', field: 'phone_number', value: user.phone_number })}\n />\n )}\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-theme-gray`}>{t('address')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class={`profile-info-pre-line text-surface`}>{getAddressAsText(user.address) \|\| '-'}</span>\n {!readOnly && activeTabIndex === 0 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Address', field: 'address', value: user.address, type: 'address' })}\n />\n )}\n </div>\n\n {selectedChat.type !== 'group' &&\n <Fragment>\n <div class=\"col-span-1\">\n <span class=\"text-sm text-theme-gray\">{t('gender')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class=\"profile-info-capitalize text-surface\">{user.gender ? user.gender : '-'}</span>\n {!readOnly && activeTabIndex === 1 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Gender', field: 'gender', value: user.gender, type: 'input' })}\n />\n )}\n </div>\n </Fragment>\n }\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-theme-gray`}>{t('locale')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class={`text-sm text-surface`}>{user.locale}</span>\n {!readOnly && activeTabIndex === 1 && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Locale', field: 'locale', value: user.locale, type: 'input' })}\n />\n )}\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-theme-gray`}>{t('register_date')}</span>\n </div>\n <div class=\"col-span-2\">\n <span class={`text-sm text-surface`}>{displayDate(user.created_at)}</span>\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-theme-gray`}>{t('last_active_date')}</span>\n </div>\n <div class=\"col-span-2\">\n <span class={`text-sm text-surface`}>{displayDate(user.last_active_at)}</span>\n </div>\n\n <div class=\"col-span-1\">\n <span class={`text-sm text-theme-gray`}>{t('note')}</span>\n </div>\n <div class=\"profile-info-content-wrapper-baseline\">\n <span class={`profile-info-pre-line text-surface`}>{user.note ? user.note : '-'}</span>\n {!readOnly && (\n <ZIconButton\n variant=\"text\"\n iconName=\"Pencil\"\n addClassIcon=\"size-4\"\n onClick={() => onOpenDialogEditor({ label: 'Note', field: 'note', value: user.note, type: 'textarea' })}\n />\n )}\n </div>\n </div>\n );\n};\n"]}

package/dist/collection/components/internal-component/associated-users-section.js CHANGED Viewed

@@ -7,11 +7,9 @@ export const AssociatedUsersSection = ({ associatedUsers, isOpenDrawer, tempDraw
     const theme = configStore.get('theme');
     const isMobile = responsiveStore.get('isMobile');
     const selectedChat = selectedChatStore.get('selectedChat');
-    return (h("div", { class: `profile-info-user-wrapper pt-2 gap-y-1` }, h("div", { class: "col-span-3 profile-info-box-wrapper" }, h("span", { class: `z-text-${theme}` }, t('profile_tab.related_user'))), h("div", { class: `col-span-3 w-full` }, associatedUsers.map((userItem, index) => {
+    return (h("div", { class: "profile-info-user-wrapper pt-2 gap-y-1", "data-theme": theme }, h("div", { class: "col-span-3 profile-info-box-wrapper" }, h("span", { class: "text-surface" }, t('profile_tab.related_user'))), h("div", { class: `col-span-3 w-full` }, associatedUsers.map((userItem, index) => {
         const isSelected = userItem.id === selectedChat.user.id;
-        const backgroundClass = theme === 'dark' ? 'z-background-dark' : 'z-background-light';
-        const textClass = theme === 'dark' ? 'z-text-dark' : 'z-text-light';
-        return (h("div", { key: index, class: `profile-info-associated-user-wrapper ${isSelected ? 'bg-pink-100' : backgroundClass} z-border-divider-${theme} ${isSelected ? 'text-black' : textClass}` }, h("div", { class: "profile-info-box-wrapper w-full" }, h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${userItem.channel === 'zignal' ? `${theme}-zignal` : userItem.channel}.png`, alt: "agent avatar", class: "size-5 rounded-full", loading: "lazy" }), h("span", { class: `profile-info-capitalize truncate w-1/2`, title: userItem.connection?.name || '' }, userItem.connection?.name), h("z-avatar", { pictureUrl: userItem.picture_url, size: "small" }), h("span", { class: `profile-info-capitalize truncate w-1/2`, title: userItem.name || '' }, userItem.name), h("div", { class: "profile-info-associated-user-action-wrapper" }, !isSelected && (h(ZIconButton, { variant: "none", iconName: "MessageSquareText", addClassIcon: `size-4 z-text-primary-${theme}`, noPaddingY: true, onClick: () => onJumpToChat(userItem) })), !isSelected && (h(ZIconButton, { variant: "none", iconName: "UserSearch", addClassIcon: `size-4 z-text-primary-${theme}`, noPaddingY: true, onClick: () => onViewProfile(userItem) })), h(ZIconButton, { variant: "none", iconName: "Unlink", addClassIcon: `size-4 z-text-primary-${theme}`, noPaddingY: true, onClick: () => onUnlinkUser(userItem) })))));
-    })), h("div", { class: `profile-info-drawer-backdrop z-width-${isMobile ? '100' : '25'} ${isOpenDrawer ? 'opacity-100 pointer-events-auto' : 'opacity-0 pointer-events-none'}`, onClick: () => onSetIsOpenDrawer(false) }), h("div", { class: `profile-info-drawer-wrapper z-width-${isMobile ? '100' : '25'} z-background-${theme} ${isOpenDrawer ? 'translate-y-0' : 'translate-y-full'}` }, h("div", { class: "profile-info-drawer-content scroll-container" }, h("div", { class: "profile-info-drawer-content-close mb-2" }, h(ZIconButton, { variant: "text", iconName: "X", addClassIcon: `size-4 z-text-${theme}`, onClick: () => onSetIsOpenDrawer(false) })), isOpenDrawer && tempDrawerUser && renderUserInfo(tempDrawerUser, true)))));
+        return (h("div", { key: index, class: `profile-info-associated-user-wrapper ${isSelected ? 'bg-pink-100 text-black' : 'bg-background text-surface'} border-divider` }, h("div", { class: "profile-info-box-wrapper w-full" }, h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${userItem.channel === 'zignal' ? `${theme}-zignal` : userItem.channel}.png`, alt: "agent avatar", class: "size-5 rounded-full", loading: "lazy" }), h("span", { class: `profile-info-capitalize truncate w-1/2`, title: userItem.connection?.name || '' }, userItem.connection?.name), h("z-avatar", { pictureUrl: userItem.picture_url, size: "small" }), h("span", { class: `profile-info-capitalize truncate w-1/2`, title: userItem.name || '' }, userItem.name), h("div", { class: "profile-info-associated-user-action-wrapper" }, !isSelected && (h(ZIconButton, { variant: "none", iconName: "MessageSquareText", addClassIcon: "size-4 text-surface", noPaddingY: true, onClick: () => onJumpToChat(userItem) })), !isSelected && (h(ZIconButton, { variant: "none", iconName: "UserSearch", addClassIcon: "size-4 text-surface", noPaddingY: true, onClick: () => onViewProfile(userItem) })), h(ZIconButton, { variant: "none", iconName: "Unlink", addClassIcon: "size-4 text-surface", noPaddingY: true, onClick: () => onUnlinkUser(userItem) })))));
+    })), h("div", { class: `profile-info-drawer-backdrop z-width-${isMobile ? '100' : '25'} ${isOpenDrawer ? 'opacity-100 pointer-events-auto' : 'opacity-0 pointer-events-none'}`, onClick: () => onSetIsOpenDrawer(false) }), h("div", { class: `profile-info-drawer-wrapper z-width-${isMobile ? '100' : '25'} bg-background ${isOpenDrawer ? 'translate-y-0' : 'translate-y-full'}` }, h("div", { class: "profile-info-drawer-content scroll-container" }, h("div", { class: "profile-info-drawer-content-close mb-2" }, h(ZIconButton, { variant: "text", iconName: "X", addClassIcon: "size-4 text-surface", onClick: () => onSetIsOpenDrawer(false) })), isOpenDrawer && tempDrawerUser && renderUserInfo(tempDrawerUser, true)))));
 };
 //# sourceMappingURL=associated-users-section.js.map

package/dist/collection/components/internal-component/associated-users-section.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"associated-users-section.js","sourceRoot":"","sources":["../../../src/components/internal-component/associated-users-section.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAO,MAAM,eAAe,CAAC;AAE5D,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACpF,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAanD,MAAM,CAAC,MAAM,sBAAsB,GAAqD,CAAC,EACvF,eAAe,EACf,YAAY,EACZ,cAAc,EACd,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,iBAAiB,EACjB,cAAc,GACf,EAAE,EAAE;IACH,MAAM,CAAC,GAAG,cAAc,EAAE,CAAC;IAC3B,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,QAAQ,GAAG,eAAe,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;IACjD,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAE3D,OAAO,CACL,WAAK,KAAK,~~EAAE~~,wCAAwC;~~QAClD~~,WAAK,KAAK,EAAC,qCAAqC;YAC9C,YAAM,KAAK,~~EAAE~~,~~UAAU~~,~~KAAK~~,~~EAAE,IAAG,~~CAAC,CAAC,0BAA0B,CAAC,CAAQ,~~CAClE~~;QAEN,WAAK,KAAK,EAAE,mBAAmB,IAC5B,eAAe,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE;YACvC,MAAM,UAAU,GAAG,QAAQ,CAAC,EAAE,KAAK,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC;~~YACxD~~,~~MAAM,eAAe,GAAG,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,oBAAoB,CAAC;YACtF,MAAM,SAAS,GAAG,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,cAAc,CAAC;YAEpE,~~OAAO,CACL,WACE,GAAG,EAAE,KAAK,EACV,KAAK,EAAE,wCAAwC,UAAU,CAAC,CAAC,CAAC,~~aAAa~~,CAAC,CAAC,CAAC,~~eAAe~~,~~qBAAqB,KAAK,IAAI,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,EAAE~~;~~gBAEhK~~,WAAK,KAAK,EAAC,iCAAiC;oBAC1C,WACE,GAAG,EAAE,0EAA0E,QAAQ,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,MAAM,EACzJ,GAAG,EAAC,cAAc,EAClB,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAC,MAAM,GACd;oBACF,YAAM,KAAK,EAAE,wCAAwC,EAAE,KAAK,EAAE,QAAQ,CAAC,UAAU,EAAE,IAAI,IAAI,EAAE,IAC1F,QAAQ,CAAC,UAAU,EAAE,IAAI,CACrB;oBACP,gBAAU,UAAU,EAAE,QAAQ,CAAC,WAAW,EAAE,IAAI,EAAC,OAAO,GAAG;oBAC3D,YAAM,KAAK,EAAE,wCAAwC,EAAE,KAAK,EAAE,QAAQ,CAAC,IAAI,IAAI,EAAE,IAC9E,QAAQ,CAAC,IAAI,CACT;oBAEP,WAAK,KAAK,EAAC,6CAA6C;wBACrD,CAAC,UAAU,IAAI,CACd,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,mBAAmB,EAC5B,YAAY,~~EAAE~~,~~yBAAyB~~,~~KAAK~~,~~EAAE,EAC9C,~~UAAU,QACV,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,GACrC,CACH;wBACA,CAAC,UAAU,IAAI,CACd,EAAC,WAAW,IACV,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,YAAY,EACrB,YAAY,~~EAAE~~,~~yBAAyB~~,~~KAAK~~,~~EAAE,EAC9C,~~UAAU,QACV,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,GACtC,CACH;wBACD,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,QAAQ,EAAC,YAAY,~~EAAE~~,~~yBAAyB~~,~~KAAK~~,~~EAAE,EAAE,~~UAAU,QAAC,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAI,~~CAC9I~~,CACF,CACF,CACP,CAAC;QACJ,CAAC,CAAC,CACE;QACN,WAAK,KAAK,EAAE,wCAAwC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,IAAI,YAAY,CAAC,CAAC,CAAC,iCAAiC,CAAC,CAAC,CAAC,+BAA+B,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAI;QAChN,WAAK,KAAK,EAAE,uCAAuC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,~~iBAAiB~~,~~KAAK,IAAI,~~YAAY,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB,EAAE;~~YACvJ~~,WAAK,KAAK,EAAC,8CAA8C;gBACvD,WAAK,KAAK,EAAC,wCAAwC;oBACjD,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,~~EAAE~~,~~iBAAiB~~,~~KAAK~~,~~EAAE,EAAE,~~OAAO,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAI,~~CACxH~~;gBACL,YAAY,IAAI,cAAc,IAAI,cAAc,CAAC,cAAc,EAAE,IAAI,CAAC,CACnE,CACF,CACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent, h, JSX } from '@stencil/core';\nimport { AssociatedUser, UserItem } from '../../store/type';\nimport { ZIconButton } from './z-icon-button';\nimport { configStore, responsiveStore, selectedChatStore } from '../../store/store';\nimport { useTranslation } from '../../utils/utils';\n\ninterface AssociatedUsersSectionProps {\n associatedUsers: AssociatedUser[];\n isOpenDrawer: boolean;\n tempDrawerUser: UserItem;\n onJumpToChat: (user: AssociatedUser) => void;\n onViewProfile: (user: AssociatedUser) => void;\n onUnlinkUser: (user: AssociatedUser) => void;\n onSetIsOpenDrawer: (value: boolean) => void;\n renderUserInfo: (user: UserItem, readOnly: boolean) => JSX.Element;\n}\n\nexport const AssociatedUsersSection: FunctionalComponent<AssociatedUsersSectionProps> = ({\n associatedUsers,\n isOpenDrawer,\n tempDrawerUser,\n onJumpToChat,\n onViewProfile,\n onUnlinkUser,\n onSetIsOpenDrawer,\n renderUserInfo,\n}) => {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const isMobile = responsiveStore.get('isMobile');\n const selectedChat = selectedChatStore.get('selectedChat');\n\n return (\n <div class~~={`~~profile-info-user-wrapper pt-2 gap-y-1`}>\n <div class=\"col-span-3 profile-info-box-wrapper\">\n <span class~~={`z~~-~~text-${theme}`}~~>{t('profile_tab.related_user')}</span>\n </div>\n\n <div class={`col-span-3 w-full`}>\n {associatedUsers.map((userItem, index) => {\n const isSelected = userItem.id === selectedChat.user.id;\n ~~const backgroundClass = theme === 'dark' ? 'z-background-dark' : 'z-background-light';\n const textClass = theme === 'dark' ? 'z-text-dark' : 'z-text-light';\n~~\n return (\n <div\n key={index}\n class={`profile-info-associated-user-wrapper ${isSelected ? 'bg-pink-100' : ~~backgroundClass} z~~-~~border-divider-${theme}~~ ~~${isSelected ? '~~text-~~black~~' ~~: textClass}~~`}\n >\n <div class=\"profile-info-box-wrapper w-full\">\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${userItem.channel === 'zignal' ? `${theme}-zignal` : userItem.channel}.png`}\n alt=\"agent avatar\"\n class=\"size-5 rounded-full\"\n loading=\"lazy\"\n />\n <span class={`profile-info-capitalize truncate w-1/2`} title={userItem.connection?.name \|\| ''}>\n {userItem.connection?.name}\n </span>\n <z-avatar pictureUrl={userItem.picture_url} size=\"small\" />\n <span class={`profile-info-capitalize truncate w-1/2`} title={userItem.name \|\| ''}>\n {userItem.name}\n </span>\n\n <div class=\"profile-info-associated-user-action-wrapper\">\n {!isSelected && (\n <ZIconButton\n variant=\"none\"\n iconName=\"MessageSquareText\"\n addClassIcon~~={`~~size-4 z-text-~~primary-${theme}`}~~\n noPaddingY\n onClick={() => onJumpToChat(userItem)}\n />\n )}\n {!isSelected && (\n <ZIconButton\n variant=\"none\"\n iconName=\"UserSearch\"\n addClassIcon~~={`~~size-4 z-text-~~primary-${theme}`}~~\n noPaddingY\n onClick={() => onViewProfile(userItem)}\n />\n )}\n <ZIconButton variant=\"none\" iconName=\"Unlink\" addClassIcon~~={`~~size-4 z-text-~~primary-${theme}`}~~ noPaddingY onClick={() => onUnlinkUser(userItem)} />\n </div>\n </div>\n </div>\n );\n })}\n </div>\n <div class={`profile-info-drawer-backdrop z-width-${isMobile ? '100' : '25'} ${isOpenDrawer ? 'opacity-100 pointer-events-auto' : 'opacity-0 pointer-events-none'}`} onClick={() => onSetIsOpenDrawer(false)} />\n <div class={`profile-info-drawer-wrapper z-width-${isMobile ? '100' : '25'} z-background~~-${theme}~~ ${isOpenDrawer ? 'translate-y-0' : 'translate-y-full'}`}>\n <div class=\"profile-info-drawer-content scroll-container\">\n <div class=\"profile-info-drawer-content-close mb-2\">\n <ZIconButton variant=\"text\" iconName=\"X\" addClassIcon~~={`~~size-4 z-~~text-${theme}`}~~ onClick={() => onSetIsOpenDrawer(false)} />\n </div>\n {isOpenDrawer && tempDrawerUser && renderUserInfo(tempDrawerUser, true)}\n </div>\n </div>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"associated-users-section.js","sourceRoot":"","sources":["../../../src/components/internal-component/associated-users-section.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionalComponent, h, JSX } from '@stencil/core';\nimport { AssociatedUser, UserItem } from '../../store/type';\nimport { ZIconButton } from './z-icon-button';\nimport { configStore, responsiveStore, selectedChatStore } from '../../store/store';\nimport { useTranslation } from '../../utils/utils';\n\ninterface AssociatedUsersSectionProps {\n associatedUsers: AssociatedUser[];\n isOpenDrawer: boolean;\n tempDrawerUser: UserItem;\n onJumpToChat: (user: AssociatedUser) => void;\n onViewProfile: (user: AssociatedUser) => void;\n onUnlinkUser: (user: AssociatedUser) => void;\n onSetIsOpenDrawer: (value: boolean) => void;\n renderUserInfo: (user: UserItem, readOnly: boolean) => JSX.Element;\n}\n\nexport const AssociatedUsersSection: FunctionalComponent<AssociatedUsersSectionProps> = ({\n associatedUsers,\n isOpenDrawer,\n tempDrawerUser,\n onJumpToChat,\n onViewProfile,\n onUnlinkUser,\n onSetIsOpenDrawer,\n renderUserInfo,\n}) => {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const isMobile = responsiveStore.get('isMobile');\n const selectedChat = selectedChatStore.get('selectedChat');\n\n return (\n <div class=\"profile-info-user-wrapper pt-2 gap-y-1\" data-theme={theme}>\n <div class=\"col-span-3 profile-info-box-wrapper\">\n <span class=\"text-surface\">{t('profile_tab.related_user')}</span>\n </div>\n\n <div class={`col-span-3 w-full`}>\n {associatedUsers.map((userItem, index) => {\n const isSelected = userItem.id === selectedChat.user.id;\n\n return (\n <div\n key={index}\n class={`profile-info-associated-user-wrapper ${isSelected ? 'bg-pink-100 text-black' : 'bg-background text-surface'} border-divider`}\n >\n <div class=\"profile-info-box-wrapper w-full\">\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${userItem.channel === 'zignal' ? `${theme}-zignal` : userItem.channel}.png`}\n alt=\"agent avatar\"\n class=\"size-5 rounded-full\"\n loading=\"lazy\"\n />\n <span class={`profile-info-capitalize truncate w-1/2`} title={userItem.connection?.name \|\| ''}>\n {userItem.connection?.name}\n </span>\n <z-avatar pictureUrl={userItem.picture_url} size=\"small\" />\n <span class={`profile-info-capitalize truncate w-1/2`} title={userItem.name \|\| ''}>\n {userItem.name}\n </span>\n\n <div class=\"profile-info-associated-user-action-wrapper\">\n {!isSelected && (\n <ZIconButton\n variant=\"none\"\n iconName=\"MessageSquareText\"\n addClassIcon=\"size-4 text-surface\"\n noPaddingY\n onClick={() => onJumpToChat(userItem)}\n />\n )}\n {!isSelected && (\n <ZIconButton\n variant=\"none\"\n iconName=\"UserSearch\"\n addClassIcon=\"size-4 text-surface\"\n noPaddingY\n onClick={() => onViewProfile(userItem)}\n />\n )}\n <ZIconButton variant=\"none\" iconName=\"Unlink\" addClassIcon=\"size-4 text-surface\" noPaddingY onClick={() => onUnlinkUser(userItem)} />\n </div>\n </div>\n </div>\n );\n })}\n </div>\n <div class={`profile-info-drawer-backdrop z-width-${isMobile ? '100' : '25'} ${isOpenDrawer ? 'opacity-100 pointer-events-auto' : 'opacity-0 pointer-events-none'}`} onClick={() => onSetIsOpenDrawer(false)} />\n <div class={`profile-info-drawer-wrapper z-width-${isMobile ? '100' : '25'} bg-background ${isOpenDrawer ? 'translate-y-0' : 'translate-y-full'}`}>\n <div class=\"profile-info-drawer-content scroll-container\">\n <div class=\"profile-info-drawer-content-close mb-2\">\n <ZIconButton variant=\"text\" iconName=\"X\" addClassIcon=\"size-4 text-surface\" onClick={() => onSetIsOpenDrawer(false)} />\n </div>\n {isOpenDrawer && tempDrawerUser && renderUserInfo(tempDrawerUser, true)}\n </div>\n </div>\n </div>\n );\n};\n"]}

package/dist/collection/components/internal-component/chat-item.js CHANGED Viewed

@@ -12,8 +12,6 @@ export const ChatItem = ({ item }) => {
     const platformColor = channel === 'line' ? 'text-green-500' : 'text-blue-500';
     const theme = configStore.get('theme');
     const isSelected = selectedChatStore.get('selectedChat')?.id === id;
-    const backgroundClass = theme === 'dark' ? 'z-background-dark' : 'z-background-light';
-    const textClass = theme === 'dark' ? 'z-text-dark' : 'z-text-light';
     const isUnread = (unread_count > 0) || mark_as_unread;
     const chatName = getChatName(item);
     const getLastMessage = () => {
@@ -59,8 +57,8 @@ export const ChatItem = ({ item }) => {
         selectedChatStore.set('selectedChat', item);
     };
     const _sortedTags = tags.sort((a, b) => a.sequence - b.sequence);
-    return (h("div", { class: `chat-item ${isSelected ? 'bg-pink-100' : backgroundClass}`, "data-theme": theme, onClick: () => handleSelectChatClick() }, pin && (h("div", { class: "chat-item-pin" }, h(Icon, { name: "Pin", addClass: "chat-item-pin-icon text-accent" }))), h("div", { class: "chat-item-content-container" }, h("div", { class: "chat-item-avatar-wrapper" }, h("z-avatar", { pictureUrl: getChatPicture(item) }), type === 'group' &&
+    return (h("div", { class: `chat-item ${isSelected ? 'bg-pink-100' : 'bg-background'}`, "data-theme": theme, onClick: () => handleSelectChatClick() }, pin && (h("div", { class: "chat-item-pin" }, h(Icon, { name: "Pin", addClass: "chat-item-pin-icon text-primary" }))), h("div", { class: "chat-item-content-container" }, h("div", { class: "chat-item-avatar-wrapper" }, h("z-avatar", { pictureUrl: getChatPicture(item) }), type === 'group' &&
         h("div", { class: "chat-item-avatar-badge" }, h(ZAvatarGroup, { size: "x-small" }))), h("div", { class: "chat-item-content-wrapper" }, h("div", { class: "chat-item-content-main" }, connection.type === 'zwiz' &&
-        h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/zwiz.png`, alt: "agent avatar zwiz", class: "chat-item-content-main-image", loading: "lazy" }), h("img", { src: getChatChannelPictureUrl(item), alt: "agent avatar", class: "chat-item-content-main-image", loading: "lazy" }), h("span", { title: connection.name, class: `chat-item-content-main-name ${platformColor} ` }, connection.name), h("div", { title: getLastMessageTime(), class: "chat-item-content-main-time" }, getLastMessageTime())), h("div", { class: `chat-item-content-secondary` }, h("div", null, h("div", { title: chatName, class: `${isUnread ? 'font-bold' : ''} ${isSelected ? 'text-black' : textClass} chat-item-content-secondary-nickname` }, chatName), h("div", { title: getLastMessage(), class: `${isUnread ? 'font-bold' : ''} chat-item-content-secondary-message` }, getLastMessage())), isUnread && (h("span", { class: `chat-item-content-unread ${unread_count === 0 ? 'chat-item-content-unread-mark' : 'chat-item-content-unread-count'}` }, unread_count > 0 && (unread_count > 1000 ? '999+' : unread_count)))), h("tag-list", { tags: _sortedTags, chatId: id, referenceSelector: `chat-tag-${id}` })))));
+        h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/zwiz.png`, alt: "agent avatar zwiz", class: "chat-item-content-main-image", loading: "lazy" }), h("img", { src: getChatChannelPictureUrl(item), alt: "agent avatar", class: "chat-item-content-main-image", loading: "lazy" }), h("span", { title: connection.name, class: `chat-item-content-main-name ${platformColor} ` }, connection.name), h("div", { title: getLastMessageTime(), class: "chat-item-content-main-time" }, getLastMessageTime())), h("div", { class: `chat-item-content-secondary` }, h("div", null, h("div", { title: chatName, class: `${isUnread ? 'font-bold' : ''} ${isSelected ? 'text-black' : 'text-surface'} chat-item-content-secondary-nickname` }, chatName), h("div", { title: getLastMessage(), class: `${isUnread ? 'font-bold' : ''} chat-item-content-secondary-message` }, getLastMessage())), isUnread && (h("span", { class: `chat-item-content-unread ${unread_count === 0 ? 'chat-item-content-unread-mark' : 'chat-item-content-unread-count'}` }, unread_count > 0 && (unread_count > 1000 ? '999+' : unread_count)))), h("tag-list", { tags: _sortedTags, chatId: id, referenceSelector: `chat-tag-${id}` })))));
 };
 //# sourceMappingURL=chat-item.js.map

package/dist/collection/components/internal-component/chat-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"chat-item.js","sourceRoot":"","sources":["../../../src/components/internal-component/chat-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,wBAAwB,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AACzF,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAMhD,MAAM,CAAC,MAAM,QAAQ,GAAuC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IACvE,MAAM,CAAC,GAAG,cAAc,EAAE,CAAC;IAC3B,MAAM,EAAE,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY,EAAE,eAAe,EAAE,IAAI,EAAE,GAAG,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;IACvH,MAAM,aAAa,GAAG,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe,CAAC;IAC9E,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,UAAU,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,EAAE,EAAE,KAAK,EAAE,CAAC;IACpE,MAAM,~~eAAe,GAAG,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,oBAAoB,CAAC;IACtF,MAAM,SAAS,GAAG,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,cAAc,CAAC;IACpE,MAAM,~~QAAQ,GAAG,CAAC,YAAY,GAAG,CAAC,CAAC,IAAI,cAAc,CAAA;IACrD,MAAM,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC;IAEnC,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,WAAW,EAAE,iBAAiB,CAAC,CAAC,QAAQ,CAAC,YAAY,EAAE,WAAW,EAAE,CAAC,EAAE,CAAC;YACzK,MAAM,MAAM,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;YACtE,IAAI,WAAW,GAAG,EAAE,CAAC;YACrB,QAAQ,YAAY,EAAE,CAAC;gBACrB,KAAK,WAAW;oBACd,WAAW,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;oBAC3B,MAAM;gBACR,KAAK,iBAAiB;oBACpB,WAAW,GAAG,CAAC,CAAC,eAAe,CAAC,CAAC;oBACjC,MAAM;gBACR,KAAK,QAAQ;oBACX,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC;oBACxB,MAAM;gBACR,KAAK,SAAS;oBACZ,WAAW,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC;oBACzB,MAAM;gBACR,KAAK,SAAS;oBACZ,WAAW,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC;oBACzB,MAAM;YACV,CAAC;YAED,OAAO,MAAM,GAAG,GAAG,GAAG,CAAC,CAAC,MAAM,CAAC,GAAG,GAAG,GAAG,WAAW,CAAC;QACtD,CAAC;QAED,OAAO,YAAY,CAAC;IACtB,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,IAAI,eAAe,EAAE,CAAC;YACpB,IAAI,OAAO,CAAC,eAAe,CAAC,EAAE,CAAC;gBAC7B,OAAO,WAAW,CAAC,eAAe,CAAC,CAAC;YACtC,CAAC;iBAAM,CAAC;gBACN,OAAO,eAAe,CAAC,eAAe,CAAC,CAAC;YAC1C,CAAC;QACH,CAAC;IACH,CAAC,CAAA;IAED,MAAM,qBAAqB,GAAG,GAAG,EAAE;QACjC,MAAM,YAAY,GAAG,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;QAC3D,IAAI,YAAY,IAAI,YAAY,CAAC,EAAE,KAAK,IAAI,CAAC,EAAE,EAAE,CAAC;YAChD,SAAS,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;QAC7B,CAAC;QAED,iBAAiB,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;IAC9C,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,GAAG,CAAC,CAAC,QAAQ,CAAC,CAAC;IAEjE,OAAO,CACL,WACE,KAAK,EAAE,aAAa,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,eAAe,EAAE,gBACtD,KAAK,EACjB,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,EAAE;QAErC,GAAG,IAAI,CACN,WAAK,KAAK,EAAC,eAAe;YACxB,EAAC,IAAI,IAAC,IAAI,EAAC,KAAK,EAAC,QAAQ,EAAC,~~gCAAgC~~,GAAG,~~CACzD~~,CACP;QAED,WAAK,KAAK,EAAC,6BAA6B;YACtC,WAAK,KAAK,EAAC,0BAA0B;gBACnC,gBAAU,UAAU,EAAE,cAAc,CAAC,IAAI,CAAC,GAAI;gBAC7C,IAAI,KAAK,OAAO;oBACf,WAAK,KAAK,EAAC,wBAAwB;wBACjC,EAAC,YAAY,IAAC,IAAI,EAAC,SAAS,GAAG,CAC3B,CAEJ;YACN,WAAK,KAAK,EAAC,2BAA2B;gBACpC,WAAK,KAAK,EAAC,wBAAwB;oBAChC,UAAU,CAAC,IAAI,KAAK,MAAM;wBACzB,WAAK,GAAG,EAAE,iFAAiF,EAAE,GAAG,EAAC,mBAAmB,EAAC,KAAK,EAAC,8BAA8B,EAAC,OAAO,EAAC,MAAM,GAAG;oBAE7K,WAAK,GAAG,EAAE,wBAAwB,CAAC,IAAI,CAAC,EAAE,GAAG,EAAC,cAAc,EAAC,KAAK,EAAC,8BAA8B,EAAC,OAAO,EAAC,MAAM,GAAG;oBACnH,YAAM,KAAK,EAAE,UAAU,CAAC,IAAI,EAAE,KAAK,EAAE,+BAA+B,aAAa,GAAG,IACjF,UAAU,CAAC,IAAI,CACX;oBAEP,WAAK,KAAK,EAAE,kBAAkB,EAAE,EAAE,KAAK,EAAC,6BAA6B,IAClE,kBAAkB,EAAE,CACjB,CACF;gBACN,WAAK,KAAK,EAAE,6BAA6B;oBACvC;wBACE,WAAK,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,IAAI,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,~~SAAS~~,uCAAuC,~~IACxI~~,QAAQ,CACL;wBACN,WAAK,KAAK,EAAE,cAAc,EAAE,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,sCAAsC,IACtG,cAAc,EAAE,CACb,CACF;oBAEL,QAAQ,IAAI,CACX,YAAM,KAAK,EAAE,4BAA4B,YAAY,KAAK,CAAC,CAAC,CAAC,CAAC,+BAA+B,CAAC,CAAC,CAAC,gCAAgC,EAAE,IAC/H,YAAY,GAAG,CAAC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAC7D,CACR,CACG;gBAEN,gBAAU,IAAI,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE,EAAE,iBAAiB,EAAE,YAAY,EAAE,EAAE,GAAI,CAC5E,CAUF,CACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\nimport { configStore, selectedChatStore } from '../../store/store';\nimport { leaveRoom } from '../../utils/socket';\nimport { TChatItem } from '../../store/type';\nimport { displayDateTime, displayTime, isToday } from '../../utils/dayjs';\nimport { Icon } from './icon';\nimport { useTranslation } from '../../utils/utils';\nimport { getChatChannelPictureUrl, getChatName, getChatPicture } from '../../store/chat';\nimport { ZAvatarGroup } from './z-avatar-group';\n\ninterface ChatItemProps {\n item: TChatItem;\n}\n\nexport const ChatItem: FunctionalComponent<ChatItemProps> = ({ item }) => {\n const t = useTranslation();\n const { id, connection, channel, tags, unread_count, last_message, last_message_at, type, pin, mark_as_unread } = item;\n const platformColor = channel === 'line' ? 'text-green-500' : 'text-blue-500';\n const theme = configStore.get('theme');\n const isSelected = selectedChatStore.get('selectedChat')?.id === id;\n const ~~backgroundClass = theme === 'dark' ? 'z-background-dark' : 'z-background-light';\n const textClass = theme === 'dark' ? 'z-text-dark' : 'z-text-light';\n const~~ isUnread = (unread_count > 0) \|\| mark_as_unread\n const chatName = getChatName(item);\n\n const getLastMessage = () => {\n if (['{image}', '{sticker}', '{audio}', '{video}', '{location}', '{text}', '{file}', '{template}', '{ig_reel}', '{story_mention}'].includes(last_message?.toLowerCase())) {\n const sender = ['user', 'group'].includes(type) ? chatName : t('you');\n let lastMessage = '';\n switch (last_message) {\n case '{ig_reel}':\n lastMessage = t('ig_reel');\n break;\n case '{story_mention}':\n lastMessage = t('story_mention');\n break;\n case '{file}':\n lastMessage = t('file');\n break;\n case '{image}':\n lastMessage = t('image');\n break;\n case '{video}':\n lastMessage = t('video');\n break;\n }\n\n return sender + ' ' + t('sent') + ' ' + lastMessage;\n }\n\n return last_message;\n };\n\n const getLastMessageTime = () => {\n if (last_message_at) {\n if (isToday(last_message_at)) {\n return displayTime(last_message_at);\n } else {\n return displayDateTime(last_message_at);\n }\n }\n }\n\n const handleSelectChatClick = () => {\n const selectedChat = selectedChatStore.get('selectedChat');\n if (selectedChat && selectedChat.id !== item.id) {\n leaveRoom(selectedChat.id);\n }\n\n selectedChatStore.set('selectedChat', item);\n };\n\n const _sortedTags = tags.sort((a, b) => a.sequence - b.sequence);\n\n return (\n <div\n class={`chat-item ${isSelected ? 'bg-pink-100' : ~~backgroundClass~~}`}\n data-theme={theme}\n onClick={() => handleSelectChatClick()}\n >\n {pin && (\n <div class=\"chat-item-pin\">\n <Icon name=\"Pin\" addClass=\"chat-item-pin-icon text-~~accent~~\" />\n </div>\n )}\n\n <div class=\"chat-item-content-container\">\n <div class=\"chat-item-avatar-wrapper\">\n <z-avatar pictureUrl={getChatPicture(item)} />\n {type === 'group' &&\n <div class=\"chat-item-avatar-badge\">\n <ZAvatarGroup size=\"x-small\" />\n </div>\n }\n </div>\n <div class=\"chat-item-content-wrapper\">\n <div class=\"chat-item-content-main\">\n {connection.type === 'zwiz' &&\n <img src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/zwiz.png`} alt=\"agent avatar zwiz\" class=\"chat-item-content-main-image\" loading=\"lazy\" />\n }\n <img src={getChatChannelPictureUrl(item)} alt=\"agent avatar\" class=\"chat-item-content-main-image\" loading=\"lazy\" />\n <span title={connection.name} class={`chat-item-content-main-name ${platformColor} `}>\n {connection.name}\n </span>\n\n <div title={getLastMessageTime()} class=\"chat-item-content-main-time\">\n {getLastMessageTime()}\n </div>\n </div>\n <div class={`chat-item-content-secondary`}>\n <div>\n <div title={chatName} class={`${isUnread ? 'font-bold' : ''} ${isSelected ? 'text-black' : ~~textClass~~} chat-item-content-secondary-nickname`}>\n {chatName}\n </div>\n <div title={getLastMessage()} class={`${isUnread ? 'font-bold' : ''} chat-item-content-secondary-message`}>\n {getLastMessage()}\n </div>\n </div>\n\n {isUnread && (\n <span class={`chat-item-content-unread ${unread_count === 0 ? 'chat-item-content-unread-mark' : 'chat-item-content-unread-count'}`}>\n {unread_count > 0 && (unread_count > 1000 ? '999+' : unread_count)}\n </span>\n )}\n </div>\n\n <tag-list tags={_sortedTags} chatId={id} referenceSelector={`chat-tag-${id}`} />\n </div>\n {/* <div class=\"text-right flex flex-col justify-between\">\n <div class=\"mt-auto ml-auto\">\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/nong-z.png`}\n alt=\"agent avatar\"\n class=\"size-5 rounded-full\"\n />\n </div>\n </div> */}\n </div>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"chat-item.js","sourceRoot":"","sources":["../../../src/components/internal-component/chat-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\nimport { configStore, selectedChatStore } from '../../store/store';\nimport { leaveRoom } from '../../utils/socket';\nimport { TChatItem } from '../../store/type';\nimport { displayDateTime, displayTime, isToday } from '../../utils/dayjs';\nimport { Icon } from './icon';\nimport { useTranslation } from '../../utils/utils';\nimport { getChatChannelPictureUrl, getChatName, getChatPicture } from '../../store/chat';\nimport { ZAvatarGroup } from './z-avatar-group';\n\ninterface ChatItemProps {\n item: TChatItem;\n}\n\nexport const ChatItem: FunctionalComponent<ChatItemProps> = ({ item }) => {\n const t = useTranslation();\n const { id, connection, channel, tags, unread_count, last_message, last_message_at, type, pin, mark_as_unread } = item;\n const platformColor = channel === 'line' ? 'text-green-500' : 'text-blue-500';\n const theme = configStore.get('theme');\n const isSelected = selectedChatStore.get('selectedChat')?.id === id;\n const isUnread = (unread_count > 0) \|\| mark_as_unread\n const chatName = getChatName(item);\n\n const getLastMessage = () => {\n if (['{image}', '{sticker}', '{audio}', '{video}', '{location}', '{text}', '{file}', '{template}', '{ig_reel}', '{story_mention}'].includes(last_message?.toLowerCase())) {\n const sender = ['user', 'group'].includes(type) ? chatName : t('you');\n let lastMessage = '';\n switch (last_message) {\n case '{ig_reel}':\n lastMessage = t('ig_reel');\n break;\n case '{story_mention}':\n lastMessage = t('story_mention');\n break;\n case '{file}':\n lastMessage = t('file');\n break;\n case '{image}':\n lastMessage = t('image');\n break;\n case '{video}':\n lastMessage = t('video');\n break;\n }\n\n return sender + ' ' + t('sent') + ' ' + lastMessage;\n }\n\n return last_message;\n };\n\n const getLastMessageTime = () => {\n if (last_message_at) {\n if (isToday(last_message_at)) {\n return displayTime(last_message_at);\n } else {\n return displayDateTime(last_message_at);\n }\n }\n }\n\n const handleSelectChatClick = () => {\n const selectedChat = selectedChatStore.get('selectedChat');\n if (selectedChat && selectedChat.id !== item.id) {\n leaveRoom(selectedChat.id);\n }\n\n selectedChatStore.set('selectedChat', item);\n };\n\n const _sortedTags = tags.sort((a, b) => a.sequence - b.sequence);\n\n return (\n <div\n class={`chat-item ${isSelected ? 'bg-pink-100' : 'bg-background'}`}\n data-theme={theme}\n onClick={() => handleSelectChatClick()}\n >\n {pin && (\n <div class=\"chat-item-pin\">\n <Icon name=\"Pin\" addClass=\"chat-item-pin-icon text-primary\" />\n </div>\n )}\n\n <div class=\"chat-item-content-container\">\n <div class=\"chat-item-avatar-wrapper\">\n <z-avatar pictureUrl={getChatPicture(item)} />\n {type === 'group' &&\n <div class=\"chat-item-avatar-badge\">\n <ZAvatarGroup size=\"x-small\" />\n </div>\n }\n </div>\n <div class=\"chat-item-content-wrapper\">\n <div class=\"chat-item-content-main\">\n {connection.type === 'zwiz' &&\n <img src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/zwiz.png`} alt=\"agent avatar zwiz\" class=\"chat-item-content-main-image\" loading=\"lazy\" />\n }\n <img src={getChatChannelPictureUrl(item)} alt=\"agent avatar\" class=\"chat-item-content-main-image\" loading=\"lazy\" />\n <span title={connection.name} class={`chat-item-content-main-name ${platformColor} `}>\n {connection.name}\n </span>\n\n <div title={getLastMessageTime()} class=\"chat-item-content-main-time\">\n {getLastMessageTime()}\n </div>\n </div>\n <div class={`chat-item-content-secondary`}>\n <div>\n <div title={chatName} class={`${isUnread ? 'font-bold' : ''} ${isSelected ? 'text-black' : 'text-surface'} chat-item-content-secondary-nickname`}>\n {chatName}\n </div>\n <div title={getLastMessage()} class={`${isUnread ? 'font-bold' : ''} chat-item-content-secondary-message`}>\n {getLastMessage()}\n </div>\n </div>\n\n {isUnread && (\n <span class={`chat-item-content-unread ${unread_count === 0 ? 'chat-item-content-unread-mark' : 'chat-item-content-unread-count'}`}>\n {unread_count > 0 && (unread_count > 1000 ? '999+' : unread_count)}\n </span>\n )}\n </div>\n\n <tag-list tags={_sortedTags} chatId={id} referenceSelector={`chat-tag-${id}`} />\n </div>\n {/* <div class=\"text-right flex flex-col justify-between\">\n <div class=\"mt-auto ml-auto\">\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/nong-z.png`}\n alt=\"agent avatar\"\n class=\"size-5 rounded-full\"\n />\n </div>\n </div> */}\n </div>\n </div>\n );\n};\n"]}

package/dist/collection/components/internal-component/context-section.js CHANGED Viewed

@@ -3,11 +3,11 @@ import { ZIconButton } from "./z-icon-button";
 import { configStore } from "../../store/store";
 export const ContextSection = ({ user, readOnly = false, activeTabIndex, isEditContext, context, onEditContext, onCloseContext, onSaveUserContexts, onContextSelecting, onCreateUserContext, }) => {
     const theme = configStore.get('theme');
-    return (h("div", { class: `profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 z-border-divider-${theme}` }, h("div", { class: "col-span-3 profile-info-box-wrapper" }, h("span", { class: `z-text-${theme} whitespace-nowrap` }, "\u0E1A\u0E23\u0E34\u0E1A\u0E17\u0E02\u0E2D\u0E07\u0E1A\u0E17\u0E2A\u0E19\u0E17\u0E19\u0E32"), !readOnly && activeTabIndex === 0 && (h("slot", null, isEditContext ? (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "X", addClassIcon: "size-4", onClick: onCloseContext }), h(ZIconButton, { variant: "text", iconName: "Save", addClassIcon: "size-4", onClick: onSaveUserContexts }))) : (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: onEditContext })))))), h("div", { class: `profile-info-tag-wrapper scroll-container` }, isEditContext ? (h("autocomplete-select", { value: user.context === context ? user.context : '', fetchItems: () => Promise.resolve([{
+    return (h("div", { class: "profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 border-divider", "data-theme": theme }, h("div", { class: "col-span-3 profile-info-box-wrapper" }, h("span", { class: "text-surface whitespace-nowrap" }, "\u0E1A\u0E23\u0E34\u0E1A\u0E17\u0E02\u0E2D\u0E07\u0E1A\u0E17\u0E2A\u0E19\u0E17\u0E19\u0E32"), !readOnly && activeTabIndex === 0 && (h("slot", null, isEditContext ? (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "X", addClassIcon: "size-4", onClick: onCloseContext }), h(ZIconButton, { variant: "text", iconName: "Save", addClassIcon: "size-4", onClick: onSaveUserContexts }))) : (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: onEditContext })))))), h("div", { class: "profile-info-tag-wrapper scroll-container" }, isEditContext ? (h("autocomplete-select", { value: user.context === context ? user.context : '', fetchItems: () => Promise.resolve([{
                 name: 'contactadmin'
             }]), createItem: async (name) => {
             const result = await onCreateUserContext(name);
             return { name: result };
-        }, onSelecting: item => onContextSelecting(item.detail.name), referenceSelector: "profile-context", showClearButton: true })) : (h("div", { class: "profile-info-box-wrapper" }, h("span", { class: `text-sm z-text-${theme}` }, user.context ? user.context : '-'))))));
+        }, onSelecting: item => onContextSelecting(item.detail.name), referenceSelector: "profile-context", showClearButton: true })) : (h("div", { class: "profile-info-box-wrapper" }, h("span", { class: "text-sm text-surface" }, user.context ? user.context : '-'))))));
 };
 //# sourceMappingURL=context-section.js.map

package/dist/collection/components/internal-component/context-section.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"context-section.js","sourceRoot":"","sources":["../../../src/components/internal-component/context-section.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AAEvD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAehD,MAAM,CAAC,MAAM,cAAc,GAAyC,CAAC,EACnE,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,cAAc,EACd,aAAa,EACb,OAAO,EACP,aAAa,EACb,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,mBAAmB,GACpB,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IAEvC,OAAO,CACL,WAAK,KAAK,~~EAAE~~,~~4EAA4E~~,KAAK~~,EAAE~~;~~QAC7F~~,WAAK,KAAK,EAAC,qCAAqC;YAC9C,YAAM,KAAK,~~EAAE~~,~~UAAU~~,~~KAAK,oBAAoB,iGAAwB~~;~~YAEvE~~,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,gBACG,aAAa,CAAC,CAAC,CAAC,CACf,WAAK,KAAK,EAAC,6CAA6C;gBACtD,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,cAAc,GAAI;gBAC1F,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,MAAM,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,kBAAkB,GAAI,CAC7F,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,6CAA6C;gBACtD,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,QAAQ,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,aAAa,GAAI,CAC1F,CACP,CACI,CACR,CACG;QAEN,WAAK,KAAK,~~EAAE~~,2CAA2C,~~IACpD~~,aAAa,CAAC,CAAC,CAAC,CACf,2BACE,KAAK,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EACnD,UAAU,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;oBACjC,IAAI,EAAE,cAAc;iBACrB,CAAC,CAAC,EACH,UAAU,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE;gBACzB,MAAM,MAAM,GAAG,MAAM,mBAAmB,CAAC,IAAI,CAAC,CAAA;gBAC9C,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;YAC1B,CAAC,EACD,WAAW,EAAE,IAAI,CAAC,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EACzD,iBAAiB,EAAC,iBAAiB,EACnC,eAAe,SACf,CACH,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,0BAA0B;YACnC,YAAM,KAAK,~~EAAE~~,~~kBAAkB~~,~~KAAK~~,~~EAAE,IACnC,~~IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAC7B,CACH,CACP,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\nimport { UserItem } from '../../store/type';\nimport { ZIconButton } from './z-icon-button';\nimport { configStore } from '../../store/store';\n\ninterface TagSectionProps {\n user: UserItem;\n readOnly?: boolean;\n activeTabIndex: number;\n isEditContext: boolean;\n context?: string;\n onEditContext: () => void;\n onCloseContext: () => void;\n onSaveUserContexts: () => void;\n onContextSelecting: (context: string) => void;\n onCreateUserContext: (name: string) => Promise<string>;\n}\n\nexport const ContextSection: FunctionalComponent<TagSectionProps> = ({\n user,\n readOnly = false,\n activeTabIndex,\n isEditContext,\n context,\n onEditContext,\n onCloseContext,\n onSaveUserContexts,\n onContextSelecting,\n onCreateUserContext,\n}) => {\n const theme = configStore.get('theme');\n\n return (\n <div class~~={`~~profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 z-border-divider-${theme}`}>\n <div class=\"col-span-3 profile-info-box-wrapper\">\n <span class~~={`z~~-~~text-${theme}~~ whitespace-nowrap`}>บริบทของบทสนทนา</span>\n\n {!readOnly && activeTabIndex === 0 && (\n <slot>\n {isEditContext ? (\n <div class=\"profile-info-box-wrapper justify-end w-full\">\n <ZIconButton variant=\"text\" iconName=\"X\" addClassIcon=\"size-4\" onClick={onCloseContext} />\n <ZIconButton variant=\"text\" iconName=\"Save\" addClassIcon=\"size-4\" onClick={onSaveUserContexts} />\n </div>\n ) : (\n <div class=\"profile-info-box-wrapper justify-end w-full\">\n <ZIconButton variant=\"text\" iconName=\"Pencil\" addClassIcon=\"size-4\" onClick={onEditContext} />\n </div>\n )}\n </slot>\n )}\n </div>\n\n <div class~~={`~~profile-info-tag-wrapper scroll-container`}>\n {isEditContext ? (\n <autocomplete-select\n value={user.context === context ? user.context : ''}\n fetchItems={() => Promise.resolve([{\n name: 'contactadmin'\n }])}\n createItem={async (name) => {\n const result = await onCreateUserContext(name)\n return { name: result };\n }}\n onSelecting={item => onContextSelecting(item.detail.name)}\n referenceSelector=\"profile-context\"\n showClearButton\n />\n ) : (\n <div class=\"profile-info-box-wrapper\">\n <span class~~={`~~text-sm z-~~text-${theme}`}~~>\n {user.context ? user.context : '-'}\n </span>\n </div>\n )}\n </div>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"context-section.js","sourceRoot":"","sources":["../../../src/components/internal-component/context-section.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,CAAC,EAAE,MAAM,eAAe,CAAC;AAEvD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAehD,MAAM,CAAC,MAAM,cAAc,GAAyC,CAAC,EACnE,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,cAAc,EACd,aAAa,EACb,OAAO,EACP,aAAa,EACb,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,mBAAmB,GACpB,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;IAEvC,OAAO,CACL,WAAK,KAAK,EAAC,wEAAwE,gBAAa,KAAK;QACnG,WAAK,KAAK,EAAC,qCAAqC;YAC9C,YAAM,KAAK,EAAC,gCAAgC,iGAAuB;YAElE,CAAC,QAAQ,IAAI,cAAc,KAAK,CAAC,IAAI,CACpC,gBACG,aAAa,CAAC,CAAC,CAAC,CACf,WAAK,KAAK,EAAC,6CAA6C;gBACtD,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,cAAc,GAAI;gBAC1F,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,MAAM,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,kBAAkB,GAAI,CAC7F,CACP,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,6CAA6C;gBACtD,EAAC,WAAW,IAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,QAAQ,EAAC,YAAY,EAAC,QAAQ,EAAC,OAAO,EAAE,aAAa,GAAI,CAC1F,CACP,CACI,CACR,CACG;QAEN,WAAK,KAAK,EAAC,2CAA2C,IACnD,aAAa,CAAC,CAAC,CAAC,CACf,2BACE,KAAK,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EACnD,UAAU,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;oBACjC,IAAI,EAAE,cAAc;iBACrB,CAAC,CAAC,EACH,UAAU,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE;gBACzB,MAAM,MAAM,GAAG,MAAM,mBAAmB,CAAC,IAAI,CAAC,CAAA;gBAC9C,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;YAC1B,CAAC,EACD,WAAW,EAAE,IAAI,CAAC,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EACzD,iBAAiB,EAAC,iBAAiB,EACnC,eAAe,SACf,CACH,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,0BAA0B;YACnC,YAAM,KAAK,EAAC,sBAAsB,IAC/B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAC7B,CACH,CACP,CACG,CACF,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\nimport { UserItem } from '../../store/type';\nimport { ZIconButton } from './z-icon-button';\nimport { configStore } from '../../store/store';\n\ninterface TagSectionProps {\n user: UserItem;\n readOnly?: boolean;\n activeTabIndex: number;\n isEditContext: boolean;\n context?: string;\n onEditContext: () => void;\n onCloseContext: () => void;\n onSaveUserContexts: () => void;\n onContextSelecting: (context: string) => void;\n onCreateUserContext: (name: string) => Promise<string>;\n}\n\nexport const ContextSection: FunctionalComponent<TagSectionProps> = ({\n user,\n readOnly = false,\n activeTabIndex,\n isEditContext,\n context,\n onEditContext,\n onCloseContext,\n onSaveUserContexts,\n onContextSelecting,\n onCreateUserContext,\n}) => {\n const theme = configStore.get('theme');\n\n return (\n <div class=\"profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 border-divider\" data-theme={theme}>\n <div class=\"col-span-3 profile-info-box-wrapper\">\n <span class=\"text-surface whitespace-nowrap\">บริบทของบทสนทนา</span>\n\n {!readOnly && activeTabIndex === 0 && (\n <slot>\n {isEditContext ? (\n <div class=\"profile-info-box-wrapper justify-end w-full\">\n <ZIconButton variant=\"text\" iconName=\"X\" addClassIcon=\"size-4\" onClick={onCloseContext} />\n <ZIconButton variant=\"text\" iconName=\"Save\" addClassIcon=\"size-4\" onClick={onSaveUserContexts} />\n </div>\n ) : (\n <div class=\"profile-info-box-wrapper justify-end w-full\">\n <ZIconButton variant=\"text\" iconName=\"Pencil\" addClassIcon=\"size-4\" onClick={onEditContext} />\n </div>\n )}\n </slot>\n )}\n </div>\n\n <div class=\"profile-info-tag-wrapper scroll-container\">\n {isEditContext ? (\n <autocomplete-select\n value={user.context === context ? user.context : ''}\n fetchItems={() => Promise.resolve([{\n name: 'contactadmin'\n }])}\n createItem={async (name) => {\n const result = await onCreateUserContext(name)\n return { name: result };\n }}\n onSelecting={item => onContextSelecting(item.detail.name)}\n referenceSelector=\"profile-context\"\n showClearButton\n />\n ) : (\n <div class=\"profile-info-box-wrapper\">\n <span class=\"text-sm text-surface\">\n {user.context ? user.context : '-'}\n </span>\n </div>\n )}\n </div>\n </div>\n );\n};\n"]}

package/dist/collection/components/internal-component/merge-user-view.js CHANGED Viewed

@@ -9,10 +9,10 @@ export const MergeUserView = ({ mergeIndex, onClose, onPrevMergeUser, onNextMerg
     const t = useTranslation();
     const theme = configStore.get('theme');
     const user = userStore.get('user');
-    return (h("div", { class: "z-animate-width" }, h("div", { class: `profile-info-compare-wrapper z-text-${theme}` }, h(ZIconButton, { variant: "none", iconName: "ChevronLeft", onClick: onClose }), h("span", null, t('profile_tab.compare_user'))), h("div", { class: "profile-info-compare-remark-wrapper" }, h("span", { class: `profile-info-compare-remark z-text-gray-${theme} ` }, "*", t('profile_tab.compare_user_info'))), user.match_users && user.match_users.length > 0 && (h("div", null, h("div", { class: "profile-info-match-user-wrapper" }, h(ZIconButton, { variant: "none", iconName: "ChevronLeft", addClassIcon: `size-8 ${mergeIndex === 0 ? `z-text-background-${theme}` : `z-text-primary-${theme}`}`, noPadding: true, onClick: onPrevMergeUser }), (() => {
+    return (h("div", { class: "z-animate-width", "data-theme": theme }, h("div", { class: "profile-info-compare-wrapper text-surface" }, h(ZIconButton, { variant: "none", iconName: "ChevronLeft", onClick: onClose }), h("span", null, t('profile_tab.compare_user'))), h("div", { class: "profile-info-compare-remark-wrapper" }, h("span", { class: "profile-info-compare-remark text-theme-gray" }, "*", t('profile_tab.compare_user_info'))), user.match_users && user.match_users.length > 0 && (h("div", null, h("div", { class: "profile-info-match-user-wrapper" }, h(ZIconButton, { variant: "none", iconName: "ChevronLeft", addClassIcon: `size-8 ${mergeIndex === 0 ? 'text-background' : 'text-primary'}`, noPadding: true, onClick: onPrevMergeUser }), (() => {
         const matchUser = user.match_users[mergeIndex];
-        return (h("div", { class: "profile-info-match-user-container" }, h("div", { class: "profile-info-match-user-box" }, h("div", { class: "relative" }, h("z-avatar", { pictureUrl: user.picture_url, size: "full", isNotRound: true }), h("div", { class: "profile-info-avatar-box-merge" }, h(ZButton, { maxWidth: "max-w-32", label: user.name, endIcon: h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${user.channel}.png`, alt: "agent avatar", class: "profile-info-avatar", loading: "lazy" }) }))), h("div", { class: "relative" }, h("z-avatar", { pictureUrl: matchUser.user.picture_url, size: "full", isNotRound: true }), h("div", { class: "profile-info-avatar-box-merge" }, h(ZButton, { maxWidth: "max-w-32", label: matchUser.user.name, endIcon: h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${matchUser?.channel}.png`, alt: "agent avatar", class: "profile-info-avatar", loading: "lazy" }) })))), h("div", { class: `m-2 z-text-${theme}` }, h("p", { class: "font-semibold" }, t('profile_tab.ai_summary')), h("span", { class: "profile-info-pre-line" }, matchUser.reason, "\u00A0", t('profile_tab.prob'), "\u00A0", matchUser.confidence, "%\u00A0", t('profile_tab.same_user'))), h("div", { class: "profile-info-match-user-action-wrapper" }, h(ZButton, { variant: "text", textVariant: "text", label: t('no'), startIcon: h(Icon, { name: "X", addClass: "size-5 text-red-700" }), onClick: () => onActionMergeUser('reject') }), h(ZButton, { variant: "text", textVariant: "text", label: t('profile_tab.merge_user'), startIcon: h(Icon, { name: "Check", addClass: "size-5 text-green-700" }), onClick: () => onActionMergeUser('merge') }))));
-    })(), h(ZIconButton, { variant: "none", iconName: "ChevronRight", addClassIcon: `size-8 ${mergeIndex === user.match_users.length - 1 ? `z-text-background-${theme}` : `z-text-primary-${theme}`}`, noPadding: true, onClick: onNextMergeUser })), h("p", { class: `font-semibold mx-4 z-text-${theme}` }, t('profile_tab.compare_table')), (() => {
+        return (h("div", { class: "profile-info-match-user-container" }, h("div", { class: "profile-info-match-user-box" }, h("div", { class: "relative" }, h("z-avatar", { pictureUrl: user.picture_url, size: "full", isNotRound: true }), h("div", { class: "profile-info-avatar-box-merge" }, h(ZButton, { maxWidth: "max-w-32", label: user.name, endIcon: h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${user.channel}.png`, alt: "agent avatar", class: "profile-info-avatar", loading: "lazy" }) }))), h("div", { class: "relative" }, h("z-avatar", { pictureUrl: matchUser.user.picture_url, size: "full", isNotRound: true }), h("div", { class: "profile-info-avatar-box-merge" }, h(ZButton, { maxWidth: "max-w-32", label: matchUser.user.name, endIcon: h("img", { src: `https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${matchUser?.channel}.png`, alt: "agent avatar", class: "profile-info-avatar", loading: "lazy" }) })))), h("div", { class: "m-2 text-surface" }, h("p", { class: "font-semibold" }, t('profile_tab.ai_summary')), h("span", { class: "profile-info-pre-line" }, matchUser.reason, "\u00A0", t('profile_tab.prob'), "\u00A0", matchUser.confidence, "%\u00A0", t('profile_tab.same_user'))), h("div", { class: "profile-info-match-user-action-wrapper" }, h(ZButton, { variant: "text", textVariant: "text", label: t('no'), startIcon: h(Icon, { name: "X", addClass: "size-5 text-red-700" }), onClick: () => onActionMergeUser('reject') }), h(ZButton, { variant: "text", textVariant: "text", label: t('profile_tab.merge_user'), startIcon: h(Icon, { name: "Check", addClass: "size-5 text-green-700" }), onClick: () => onActionMergeUser('merge') }))));
+    })(), h(ZIconButton, { variant: "none", iconName: "ChevronRight", addClassIcon: `size-8 ${mergeIndex === user.match_users.length - 1 ? 'text-background' : 'text-primary'}`, noPadding: true, onClick: onNextMergeUser })), h("p", { class: "font-semibold mx-4 text-surface" }, t('profile_tab.compare_table')), (() => {
         const matchUser = user.match_users[mergeIndex];
         const fields = [
             { label: t('channel'), key: 'channel' },
@@ -31,7 +31,7 @@ export const MergeUserView = ({ mergeIndex, onClose, onPrevMergeUser, onNextMerg
                 value = getAddressAsText(user[key]);
                 comparedValue = getAddressAsText(matchUser[key]);
             }
-            return (h("tr", { key: index }, h("td", { class: `z-text-${theme}` }, h("p", { class: "profile-info-match-user-table-label" }, label)), h("td", { class: `z-text-gray-${theme}` }, h("p", { class: `profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}` }, value || '-')), h("td", { class: `z-text-gray-${theme}` }, h("p", { class: `profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}` }, comparedValue || '-'))));
+            return (h("tr", { key: index }, h("td", { class: "text-surface" }, h("p", { class: "profile-info-match-user-table-label" }, label)), h("td", { class: "text-theme-gray" }, h("p", { class: `profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}` }, value || '-')), h("td", { class: "text-theme-gray" }, h("p", { class: `profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}` }, comparedValue || '-'))));
         })))));
     })()))));
 };

package/dist/collection/components/internal-component/merge-user-view.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"merge-user-view.js","sourceRoot":"","sources":["../../../src/components/internal-component/merge-user-view.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\nimport { useTranslation } from '../../utils/utils';\nimport { ZIconButton } from './z-icon-button';\nimport { ZButton } from './z-button';\nimport { Icon } from './icon';\nimport { MatchDecision } from '../../api/type';\nimport { configStore, userStore } from '../../store/store';\nimport { getAddressAsText } from '../../utils/func';\n\ninterface MergeUserViewProps {\n mergeIndex: number;\n onClose: () => void;\n onPrevMergeUser: () => void;\n onNextMergeUser: () => void;\n onActionMergeUser: (decision: MatchDecision) => void;\n}\n\nexport const MergeUserView: FunctionalComponent<MergeUserViewProps> = ({ mergeIndex, onClose, onPrevMergeUser, onNextMergeUser, onActionMergeUser }) => {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const user = userStore.get('user');\n\n return (\n <div class=\"z-animate-width\">\n <div class={`profile-info-compare-wrapper z-text-${theme}`}>\n <ZIconButton variant=\"none\" iconName=\"ChevronLeft\" onClick={onClose} />\n <span>{t('profile_tab.compare_user')}</span>\n </div>\n <div class=\"profile-info-compare-remark-wrapper\">\n <span class={`profile-info-compare-remark z-text-gray-${theme} `}>{t('profile_tab.compare_user_info')}</span>\n </div>\n {user.match_users && user.match_users.length > 0 && (\n <div>\n <div class=\"profile-info-match-user-wrapper\">\n {/ Prev Button /}\n <ZIconButton\n variant=\"none\"\n iconName=\"ChevronLeft\"\n addClassIcon={`size-8 ${mergeIndex === 0 ? `z-text-background-${theme}` : `z-text-primary-${theme}`}`}\n noPadding\n onClick={onPrevMergeUser}\n />\n {(() => {\n const matchUser = user.match_users[mergeIndex];\n return (\n <div class=\"profile-info-match-user-container\">\n <div class=\"profile-info-match-user-box\">\n {/ Current User /}\n <div class=\"relative\">\n <z-avatar pictureUrl={user.picture_url} size=\"full\" isNotRound />\n <div class=\"profile-info-avatar-box-merge\">\n <ZButton\n maxWidth=\"max-w-32\"\n label={user.name}\n endIcon={\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${user.channel}.png`}\n alt=\"agent avatar\"\n class=\"profile-info-avatar\"\n loading=\"lazy\"\n />\n }\n />\n </div>\n </div>\n {/ Match User /}\n <div class=\"relative\">\n <z-avatar pictureUrl={matchUser.user.picture_url} size=\"full\" isNotRound />\n <div class=\"profile-info-avatar-box-merge\">\n <ZButton\n maxWidth=\"max-w-32\"\n label={matchUser.user.name}\n endIcon={\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${matchUser?.channel}.png`}\n alt=\"agent avatar\"\n class=\"profile-info-avatar\"\n loading=\"lazy\"\n />\n }\n />\n </div>\n </div>\n </div>\n <div class={`m-2 z-text-${theme}`}>\n <p class=\"font-semibold\">{t('profile_tab.ai_summary')}</p>\n <span class=\"profile-info-pre-line\">\n {matchUser.reason} {t('profile_tab.prob')} {matchUser.confidence}% {t('profile_tab.same_user')}\n </span>\n </div>\n <div class=\"profile-info-match-user-action-wrapper\">\n <ZButton\n variant=\"text\"\n textVariant=\"text\"\n label={t('no')}\n startIcon={<Icon name=\"X\" addClass=\"size-5 text-red-700\" />}\n onClick={() => onActionMergeUser('reject')}\n />\n <ZButton\n variant=\"text\"\n textVariant=\"text\"\n label={t('profile_tab.merge_user')}\n startIcon={<Icon name=\"Check\" addClass=\"size-5 text-green-700\" />}\n onClick={() => onActionMergeUser('merge')}\n />\n </div>\n </div>\n );\n })()}\n {/ Next Button */}\n <ZIconButton\n variant=\"none\"\n iconName=\"ChevronRight\"\n addClassIcon={`size-8 ${mergeIndex === user.match_users.length - 1 ? `z-text-background-${theme}` : `z-text-primary-${theme}`}`}\n noPadding\n onClick={onNextMergeUser}\n />\n </div>\n <p class={`font-semibold mx-4 z-text-${theme}`}>{t('profile_tab.compare_table')}</p>\n {(() => {\n const matchUser = user.match_users[mergeIndex];\n const fields = [\n { label: t('channel'), key: 'channel' },\n { label: t('email'), key: 'email' },\n { label: t('phone_no'), key: 'phone_number' },\n { label: t('address'), key: 'address' },\n { label: t('gender'), key: 'gender' },\n ];\n return (\n <div class=\"profile-info-match-user-name-wrapper scroll-container\">\n <table class=\"profile-info-match-user-table\">\n <thead class=\"profile-info-match-user-table-header\">\n <tr>\n <th>{t('name')}</th>\n <th>{user.name}</th>\n <th>{matchUser.user.name}</th>\n </tr>\n </thead>\n <tbody>\n {fields.map(({ label, key }, index) => {\n let value = user[key];\n let comparedValue = matchUser.user[key];\n if (key === 'channel') {\n comparedValue = matchUser[key];\n }\n if (key === 'address') {\n value = getAddressAsText(user[key]);\n comparedValue = getAddressAsText(matchUser[key]);\n }\n return (\n <tr key={index}>\n <td class={`z-text-${theme}`}>\n <p class=\"profile-info-match-user-table-label\">{label}</p>\n </td>\n <td class={`z-text-gray-${theme}`}>\n <p class={`profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}`}>{value \|\| '-'}</p>\n </td>\n <td class={`z-text-gray-${theme}`}>\n <p class={`profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}`}>{comparedValue \|\| '-'}</p>\n </td>\n </tr>\n )\n })}\n </tbody>\n </table>\n </div>\n );\n })()}\n </div>\n )}\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"merge-user-view.js","sourceRoot":"","sources":["../../../src/components/internal-component/merge-user-view.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\nimport { useTranslation } from '../../utils/utils';\nimport { ZIconButton } from './z-icon-button';\nimport { ZButton } from './z-button';\nimport { Icon } from './icon';\nimport { MatchDecision } from '../../api/type';\nimport { configStore, userStore } from '../../store/store';\nimport { getAddressAsText } from '../../utils/func';\n\ninterface MergeUserViewProps {\n mergeIndex: number;\n onClose: () => void;\n onPrevMergeUser: () => void;\n onNextMergeUser: () => void;\n onActionMergeUser: (decision: MatchDecision) => void;\n}\n\nexport const MergeUserView: FunctionalComponent<MergeUserViewProps> = ({ mergeIndex, onClose, onPrevMergeUser, onNextMergeUser, onActionMergeUser }) => {\n const t = useTranslation();\n const theme = configStore.get('theme');\n const user = userStore.get('user');\n\n return (\n <div class=\"z-animate-width\" data-theme={theme}>\n <div class=\"profile-info-compare-wrapper text-surface\">\n <ZIconButton variant=\"none\" iconName=\"ChevronLeft\" onClick={onClose} />\n <span>{t('profile_tab.compare_user')}</span>\n </div>\n <div class=\"profile-info-compare-remark-wrapper\">\n <span class=\"profile-info-compare-remark text-theme-gray\">{t('profile_tab.compare_user_info')}</span>\n </div>\n {user.match_users && user.match_users.length > 0 && (\n <div>\n <div class=\"profile-info-match-user-wrapper\">\n {/ Prev Button /}\n <ZIconButton\n variant=\"none\"\n iconName=\"ChevronLeft\"\n addClassIcon={`size-8 ${mergeIndex === 0 ? 'text-background' : 'text-primary'}`}\n noPadding\n onClick={onPrevMergeUser}\n />\n {(() => {\n const matchUser = user.match_users[mergeIndex];\n return (\n <div class=\"profile-info-match-user-container\">\n <div class=\"profile-info-match-user-box\">\n {/ Current User /}\n <div class=\"relative\">\n <z-avatar pictureUrl={user.picture_url} size=\"full\" isNotRound />\n <div class=\"profile-info-avatar-box-merge\">\n <ZButton\n maxWidth=\"max-w-32\"\n label={user.name}\n endIcon={\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${user.channel}.png`}\n alt=\"agent avatar\"\n class=\"profile-info-avatar\"\n loading=\"lazy\"\n />\n }\n />\n </div>\n </div>\n {/ Match User /}\n <div class=\"relative\">\n <z-avatar pictureUrl={matchUser.user.picture_url} size=\"full\" isNotRound />\n <div class=\"profile-info-avatar-box-merge\">\n <ZButton\n maxWidth=\"max-w-32\"\n label={matchUser.user.name}\n endIcon={\n <img\n src={`https://zwizai-platform.s3.ap-southeast-1.amazonaws.com/zignal-package/${matchUser?.channel}.png`}\n alt=\"agent avatar\"\n class=\"profile-info-avatar\"\n loading=\"lazy\"\n />\n }\n />\n </div>\n </div>\n </div>\n <div class=\"m-2 text-surface\">\n <p class=\"font-semibold\">{t('profile_tab.ai_summary')}</p>\n <span class=\"profile-info-pre-line\">\n {matchUser.reason} {t('profile_tab.prob')} {matchUser.confidence}% {t('profile_tab.same_user')}\n </span>\n </div>\n <div class=\"profile-info-match-user-action-wrapper\">\n <ZButton\n variant=\"text\"\n textVariant=\"text\"\n label={t('no')}\n startIcon={<Icon name=\"X\" addClass=\"size-5 text-red-700\" />}\n onClick={() => onActionMergeUser('reject')}\n />\n <ZButton\n variant=\"text\"\n textVariant=\"text\"\n label={t('profile_tab.merge_user')}\n startIcon={<Icon name=\"Check\" addClass=\"size-5 text-green-700\" />}\n onClick={() => onActionMergeUser('merge')}\n />\n </div>\n </div>\n );\n })()}\n {/ Next Button */}\n <ZIconButton\n variant=\"none\"\n iconName=\"ChevronRight\"\n addClassIcon={`size-8 ${mergeIndex === user.match_users.length - 1 ? 'text-background' : 'text-primary'}`}\n noPadding\n onClick={onNextMergeUser}\n />\n </div>\n <p class=\"font-semibold mx-4 text-surface\">{t('profile_tab.compare_table')}</p>\n {(() => {\n const matchUser = user.match_users[mergeIndex];\n const fields = [\n { label: t('channel'), key: 'channel' },\n { label: t('email'), key: 'email' },\n { label: t('phone_no'), key: 'phone_number' },\n { label: t('address'), key: 'address' },\n { label: t('gender'), key: 'gender' },\n ];\n return (\n <div class=\"profile-info-match-user-name-wrapper scroll-container\">\n <table class=\"profile-info-match-user-table\">\n <thead class=\"profile-info-match-user-table-header\">\n <tr>\n <th>{t('name')}</th>\n <th>{user.name}</th>\n <th>{matchUser.user.name}</th>\n </tr>\n </thead>\n <tbody>\n {fields.map(({ label, key }, index) => {\n let value = user[key];\n let comparedValue = matchUser.user[key];\n if (key === 'channel') {\n comparedValue = matchUser[key];\n }\n if (key === 'address') {\n value = getAddressAsText(user[key]);\n comparedValue = getAddressAsText(matchUser[key]);\n }\n return (\n <tr key={index}>\n <td class=\"text-surface\">\n <p class=\"profile-info-match-user-table-label\">{label}</p>\n </td>\n <td class=\"text-theme-gray\">\n <p class={`profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}`}>{value \|\| '-'}</p>\n </td>\n <td class=\"text-theme-gray\">\n <p class={`profile-info-match-user-table-value ${key === 'email' ? '' : 'capitalize'}`}>{comparedValue \|\| '-'}</p>\n </td>\n </tr>\n )\n })}\n </tbody>\n </table>\n </div>\n );\n })()}\n </div>\n )}\n </div>\n );\n};\n"]}

package/dist/collection/components/internal-component/tag-section.js CHANGED Viewed

@@ -9,12 +9,12 @@ export const TagSection = ({ user, readOnly = false, activeTabIndex, isEditTag,
     const t = useTranslation();
     const theme = configStore.get('theme');
     const selectedChat = selectedChatStore.get('selectedChat');
-    return (h("div", { class: `profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 z-border-divider-${theme}` }, h("div", { class: "col-span-3 profile-info-box-wrapper" }, h("span", { class: `z-text-${theme} whitespace-nowrap` }, t('tag')), !readOnly && activeTabIndex === 0 && (h("slot", null, isEditTag ? (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "X", addClassIcon: "size-4", onClick: onCloseTag }), h(ZIconButton, { variant: "text", iconName: "Save", addClassIcon: "size-4", onClick: onSaveUserTags }))) : (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: onEditTag })))))), h("div", { class: `profile-info-tag-wrapper scroll-container` }, isEditTag ? (h("div", { class: "col-span-3" }, h("div", { class: "profile-info-box-wrapper flex-wrap" }, tagItems.length > 0 &&
+    return (h("div", { class: "profile-info-user-wrapper border-b-[0.5px] pt-2 gap-y-1 border-divider", "data-theme": theme }, h("div", { class: "col-span-3 profile-info-box-wrapper" }, h("span", { class: "text-surface whitespace-nowrap" }, t('tag')), !readOnly && activeTabIndex === 0 && (h("slot", null, isEditTag ? (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "X", addClassIcon: "size-4", onClick: onCloseTag }), h(ZIconButton, { variant: "text", iconName: "Save", addClassIcon: "size-4", onClick: onSaveUserTags }))) : (h("div", { class: "profile-info-box-wrapper justify-end w-full" }, h(ZIconButton, { variant: "text", iconName: "Pencil", addClassIcon: "size-4", onClick: onEditTag })))))), h("div", { class: `profile-info-tag-wrapper scroll-container` }, isEditTag ? (h("div", { class: "col-span-3" }, h("div", { class: "profile-info-box-wrapper flex-wrap" }, tagItems.length > 0 &&
         tagItems
             .filter(({ isDelete }) => !isDelete)
             .sort((a, b) => a.item.sequence - b.item.sequence)
             .map(tag => h(ZTagOrStatusItem, { item: tag.item, onDelete: () => onDeleteTag(tag.item.id) }))), selectedChatStore.get('isSyncingTag') && (h("div", { class: "profile-info-status-wrapper" }, h("status-badge", { status: "loading", label: t('chat_tab.syncing_tag') }))), h("div", { class: "mt-2" }, isAddTag ? (h("autocomplete-select", { referenceSelector: "profile-tag", type: "tag", selectedIds: tagItems.filter(({ isDelete }) => !isDelete).map(({ item }) => item.id), fetchItems: handleGetUserTags, createItem: name => onCreateUserTag(name).then(res => res), onSelecting: item => onAddTag(item.detail) })) : (h(ZButton, { variant: "outlined", fullWidth: true, label: `+ ${t('profile_tab.add_tag')}`, onClick: () => onSetIsAddTag(true) }))))) : (h("div", { class: "col-span-3" }, h("div", { class: "profile-info-box-wrapper flex-wrap" }, user.tags && user.tags.length > 0 ? (user.tags
         .sort((a, b) => a.sequence - b.sequence)
-        .map(tag => h("tag-or-status-item", { item: tag, expandText: true, chatId: `profile-status-${selectedChat.id}-${readOnly ? 'readonly' : ''}` }))) : (h("span", { class: `text-sm z-text-gray-${theme}` }, t('profile_tab.tag_empty')))), selectedChatStore.get('isSyncingTag') && (h("div", { class: "profile-info-status-bottom-wrapper" }, h("status-badge", { status: "loading", label: t('chat_tab.syncing_tag') }))))))));
+        .map(tag => h("tag-or-status-item", { item: tag, expandText: true, chatId: `profile-status-${selectedChat.id}-${readOnly ? 'readonly' : ''}` }))) : (h("span", { class: "text-sm text-theme-gray" }, t('profile_tab.tag_empty')))), selectedChatStore.get('isSyncingTag') && (h("div", { class: "profile-info-status-bottom-wrapper" }, h("status-badge", { status: "loading", label: t('chat_tab.syncing_tag') }))))))));
 };
 //# sourceMappingURL=tag-section.js.map