@antscorp/antsomi-ui 1.3.5-beta.34 → 1.3.5-beta.340

package/es/components/organism/AccountSharing/AccountSharing.js

@@ -0,0 +1,445 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+/* eslint-disable react/no-this-in-sfc */
+/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */
+import axios from 'axios';
+import React, { useEffect, useMemo, useRef, useState } from 'react';
+import { CookiesProvider, useCookies } from 'react-cookie';
+// Icons
+import { Button, Flex, Popover, Spin } from '../../atoms';
+import CloseIcon from './icons/close';
+import SearchIcon from './icons/search';
+import { InnerCardStyled, InputSearchStyled, PackageSharingStyled, TriggerPopoverStyled, } from './styled';
+// Utils
+import { formatUserId } from '@antscorp/antsomi-ui/es/utils';
+import { translate } from './utils';
+import Icon from '@antscorp/icons';
+import { useDebounce } from '@antscorp/antsomi-ui/es/hooks/useDebounceV2';
+import { DEFAULT_TRANSLATE_DATA } from './constant';
+import { THEME } from '@antscorp/antsomi-ui/es/constants';
+const STEP = {
+    SWITCH_ACCOUNT: 'SWITCH_ACCOUNT',
+    SELECT_NETWORK: 'SELECT_NETWORK',
+};
+const InputSearch = props => {
+    const { value, onChange, className, onClickRemove } = props;
+    return (React.createElement(InputSearchStyled, { className: className || '' },
+        React.createElement("input", { className: "input-search-account", placeholder: "Search...", value: value, onChange: e => onChange(e.target.value) }),
+        value ? (React.createElement(CloseIcon, { className: "remove-icon", onClick: onClickRemove })) : (React.createElement(SearchIcon, { className: "search-icon" }))));
+};
+export const AccountSharing = props => {
+    var _a;
+    const { permissionDomain = '', iamDomain = '', token = '', accountId = 0, networkId = 0, appCode = '', lang = 'en', translateData = DEFAULT_TRANSLATE_DATA, urlEditProfile = '', callbackGetInfoAccount, urlLogout = '', isShowSharing = false, isShareAccountAccess = false, u_ogs = '', callbackLogout, } = props;
+    const selectedNetworkRef = useRef();
+    const [isShowSearchAccount, setIsShowSearchAccount] = useState(false);
+    const [infoAccount, setInfoAccount] = useState({});
+    const [listAccountSharing, setListAccountSharing] = useState([]);
+    const [listAccountRecent, setListAccountRecent] = useState([]);
+    const [limitAccount, setLimitAccount] = useState(10);
+    const [isShowLoading, setIsShowLoading] = useState(false);
+    const [accountSearch, setAccountSearch] = useState('');
+    const [portalSearch, setPortalSearch] = useState('');
+    const [step, setStep] = useState(STEP.SWITCH_ACCOUNT);
+    const [listNetworks, setListNetworks] = useState([]);
+    const [currentNetwork, setCurrentNetwork] = useState();
+    const [serverTranslateData, setServerTranslateData] = useState({});
+    const [language, setLanguage] = useState(lang || 'en');
+    const debounceSearch = useDebounce(accountSearch, 500);
+    const [cookies, setCookie, removeCookie] = useCookies();
+    const domain = iamDomain.charAt(iamDomain.length - 1) === '/' ? iamDomain : `${iamDomain}/`;
+    const translateLang = useMemo(() => translate(translateData, serverTranslateData, language), [serverTranslateData, language, translateData]);
+    const getInfoAccount = () => {
+        const params = {
+            type: 'user-info',
+            userId: +accountId,
+            networkId: +networkId,
+        };
+        return axios.get(`${domain}api/3rd/info`, { params });
+    };
+    const getTranslateData = () => {
+        if ((translateData && Object.keys(translateData).length > 0) || !permissionDomain) {
+            return true;
+        }
+        const response = axios.get(`${permissionDomain}/api/language/info`, {
+            params: {
+                type: 'get-language-by-code',
+                locale: language,
+            },
+        });
+        if (response) {
+            response.then(res => {
+                if (res && res.data && res.data.data && res.data.data.languages) {
+                    setServerTranslateData(res.data.data.languages);
+                }
+            });
+        }
+        return response;
+    };
+    const handleInfoAccount = () => {
+        getInfoAccount().then(res => {
+            var _a;
+            if ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.data) {
+                setInfoAccount(res.data.data);
+            }
+        });
+    };
+    const getListNetworkSelect = () => {
+        if (!token)
+            return;
+        fetch(`${domain}api/network/info?type=get-list-network&token=${token}`)
+            .then(response => response.json())
+            .then(res => {
+            var _a;
+            if ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.length) {
+                const convertedNetworks = res.data.map(network => ({
+                    networkId: network.network_id,
+                    networkName: network.network_name,
+                    homePage: network.home_page,
+                    logo: network.logo,
+                }));
+                setListNetworks(convertedNetworks);
+                const curNetwork = convertedNetworks.find(item => +item.networkId === +networkId);
+                if (curNetwork) {
+                    setCurrentNetwork(curNetwork);
+                }
+            }
+        });
+    };
+    const getListAccountSharing = () => {
+        if (isShareAccountAccess) {
+            const params = {
+                type: 'get-list-access',
+                _token: token,
+                _user_id: +accountId,
+                _account_id: +accountId,
+                app_code: appCode,
+                _lang: lang,
+                limit: 1000,
+                search: accountSearch,
+            };
+            setIsShowLoading(true);
+            return axios.get(`${permissionDomain}/api/account/share-access`, {
+                params,
+            });
+        }
+        const params = {
+            type: 'get-list-access-by-app-code',
+            _token: token,
+            _user_id: +accountId,
+            _account_id: +accountId,
+            app_code: appCode,
+            _lang: lang,
+            limit: 1000,
+            search: accountSearch,
+        };
+        setIsShowLoading(true);
+        return axios.get(`${permissionDomain}/api/account/share`, {
+            params,
+        });
+    };
+    useEffect(() => {
+        if (!iamDomain || !accountId || !networkId)
+            return;
+        getTranslateData();
+        handleInfoAccount();
+        getListNetworkSelect();
+        const handleChangeUserLanguage = (e) => {
+            var _a, _b, _c;
+            if (((_a = e === null || e === void 0 ? void 0 : e.data) === null || _a === void 0 ? void 0 : _a.action) === 'change-user-language') {
+                if ((_b = e === null || e === void 0 ? void 0 : e.data) === null || _b === void 0 ? void 0 : _b.language)
+                    setLanguage(e.data.language);
+                if ((_c = e === null || e === void 0 ? void 0 : e.data) === null || _c === void 0 ? void 0 : _c.translateData)
+                    setServerTranslateData(e.data.translateData);
+            }
+        };
+        window.addEventListener('message', handleChangeUserLanguage);
+        return () => {
+            window.removeEventListener('message', handleChangeUserLanguage);
+        };
+    }, []);
+    useEffect(() => {
+        if (!iamDomain || !accountId || !networkId)
+            return;
+        handleInfoAccount();
+    }, [accountId]);
+    useEffect(() => {
+        if (lang && lang !== language) {
+            setLanguage(lang);
+        }
+    }, [lang]);
+    useEffect(() => {
+        if (!permissionDomain || !token || !accountId || !appCode) {
+            return;
+        }
+        setIsShowLoading(true);
+        getListAccountSharing().then(res => {
+            var _a, _b, _c, _d, _e;
+            setIsShowLoading(false);
+            if ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.data) {
+                setListAccountSharing(((_c = (_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.list_access) || []);
+                setListAccountRecent(((_e = (_d = res === null || res === void 0 ? void 0 : res.data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.recent_access) || []);
+            }
+        });
+    }, [debounceSearch]);
+    useEffect(() => {
+        if (limitAccount > 10) {
+            getListAccountSharing().then(res => {
+                var _a, _b, _c, _d, _e;
+                setIsShowLoading(false);
+                if ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.data) {
+                    setListAccountSharing(((_c = (_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.list_access) || []);
+                    setListAccountRecent(((_e = (_d = res === null || res === void 0 ? void 0 : res.data) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.recent_access) || []);
+                }
+            });
+        }
+    }, [limitAccount]);
+    const filterListNetwork = useMemo(() => {
+        const draftListNetwork = [...listNetworks];
+        return draftListNetwork.filter((netWork) => netWork.networkName.toLocaleLowerCase().indexOf(portalSearch.toLocaleLowerCase()) !== -1);
+    }, [listNetworks, portalSearch]);
+    const logAccountSwitch = (switchAccountId) => __awaiter(void 0, void 0, void 0, function* () {
+        // setIsShowLoading(true)
+        if (switchAccountId && isShareAccountAccess) {
+            const params = {
+                type: 'update-recent-shared-access',
+                _token: token,
+                _user_id: +accountId,
+                _account_id: +accountId,
+                access_user_id: switchAccountId,
+            };
+            yield axios.get(`${permissionDomain}/api/account/share-access`, {
+                params,
+            });
+            // await delay(2000)
+            // setIsShowLoading(false)
+            // .then((res) => console.log('LOG DONE', res))
+        }
+    });
+    // const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms))
+    const onClickButtonLogout = () => {
+        removeCookie(`uogs_${networkId}`);
+        if (callbackLogout)
+            callbackLogout();
+        setTimeout(() => {
+            window.location.href = urlLogout;
+        }, 300);
+    };
+    const switchStep = toStep => {
+        setStep(toStep);
+    };
+    function urlDomain(data) {
+        const a = document.createElement('a');
+        a.href = data;
+        return a;
+    }
+    const postMessage = postParam => {
+        var _a, _b;
+        if (postParam.error && postParam.error !== '')
+            return;
+        const newUrlObj = urlDomain((_a = selectedNetworkRef === null || selectedNetworkRef === void 0 ? void 0 : selectedNetworkRef.current) === null || _a === void 0 ? void 0 : _a.homePage);
+        const arrTmp = newUrlObj.hostname.split('.');
+        if (postParam.action === 'ogs-authenticate') {
+            const loginData = Object.assign({}, postParam);
+            if (loginData.full_name) {
+                delete loginData.full_name;
+            }
+            if (loginData.email) {
+                delete loginData.email;
+            }
+            if (loginData.avatar) {
+                delete loginData.avatar;
+            }
+            if (loginData.action) {
+                delete loginData.action;
+            }
+            if (loginData.env) {
+                delete loginData.env;
+            }
+            // if (loginData.hasOwnProperty('account_id')) {
+            //     delete loginData.account_id;
+            // }
+            // if (loginData.hasOwnProperty('conversion_id')) {
+            //     delete loginData.conversion_id;
+            // }
+            // if (loginData.hasOwnProperty('seller_role')) {
+            //     delete loginData.seller_role;
+            // }
+            if (u_ogs && typeof u_ogs === 'string' && u_ogs.trim()) {
+                const index = u_ogs.indexOf(`${networkId}`);
+                let prefix = `${u_ogs}_`;
+                if (index >= 0) {
+                    prefix = u_ogs.slice(0, index);
+                }
+                const newU_ogs = prefix + ((_b = selectedNetworkRef === null || selectedNetworkRef === void 0 ? void 0 : selectedNetworkRef.current) === null || _b === void 0 ? void 0 : _b.networkId);
+                if (newUrlObj.protocol !== 'https:') {
+                    if (arrTmp.length < 4) {
+                        setCookie(newU_ogs, JSON.stringify(loginData), {
+                            domain: arrTmp.slice(-2).join('.'),
+                            path: '/; samesite=None',
+                        });
+                    }
+                    else {
+                        setCookie(newU_ogs, JSON.stringify(loginData), {
+                            domain: arrTmp.slice(-3).join('.'),
+                            path: '/; samesite=None',
+                        });
+                    }
+                }
+                else {
+                    if (arrTmp.length < 4) {
+                        setCookie(newU_ogs, JSON.stringify(loginData), {
+                            domain: arrTmp.slice(-2).join('.'),
+                            path: '/; samesite=None; secure',
+                        });
+                    }
+                    else {
+                        setCookie(newU_ogs, JSON.stringify(loginData), {
+                            domain: arrTmp.slice(-3).join('.'),
+                            path: '/; samesite=None; secure',
+                        });
+                    }
+                }
+            }
+        }
+        if (selectedNetworkRef.current && selectedNetworkRef.current.homePage) {
+            window.location.href = selectedNetworkRef.current.homePage.replaceAll(':user_id', accountId);
+        }
+    };
+    const handleLoginData = (data = null) => {
+        if (!data.token) {
+            return;
+        }
+        const postParam = {
+            action: 'ogs-authenticate',
+            user_id: data.personal.user_id,
+            account_id: data.personal.user_id,
+            full_name: data.personal.full_name,
+            role: data.personal.role,
+            seller_role: data.personal.seller_role,
+            conversion_id: data.personal.conversion_id,
+            email: data.personal.email,
+            avatar: data.personal.avatar,
+            token: data.token,
+            language: data.personal.language,
+        };
+        postMessage(postParam);
+    };
+    const loginNetworkWithToken = (networkItem) => __awaiter(void 0, void 0, void 0, function* () {
+        if (!token || !networkItem || !networkItem.networkId) {
+            return;
+        }
+        selectedNetworkRef.current = networkItem;
+        const loginUrl = `${domain}api/account/authenticate`;
+        const { networkId: networkIdSelected } = networkItem;
+        const data = {
+            token,
+            app_id: networkIdSelected,
+        };
+        const xhr = new XMLHttpRequest();
+        xhr.open('POST', loginUrl, true);
+        // Send the proper header information along with the request
+        xhr.setRequestHeader('Content-Type', 'application/json');
+        xhr.withCredentials = false;
+        xhr.onreadystatechange = function () {
+            // Call a function when the state changes.
+            // if (this.readyState === XMLHttpRequest.DONE) {
+            //   setLoading(false)
+            // }
+            if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
+                const res = JSON.parse(this.responseText);
+                if (res && res.data && res.data.token) {
+                    handleLoginData(res.data);
+                }
+            }
+        };
+        xhr.send(JSON.stringify(data));
+    });
+    const selectNetwork = network => {
+        if (networkId === network.networkId) {
+            return;
+        }
+        loginNetworkWithToken(network);
+    };
+    const handleSwitchAccount = (account) => __awaiter(void 0, void 0, void 0, function* () {
+        yield logAccountSwitch(account.user_id);
+        if (callbackGetInfoAccount)
+            callbackGetInfoAccount(account);
+        // setLimitAccount(limitAccount + 10)
+        // if (isShowDetail) {
+        //   setIsShowDetail(false);
+        // }
+        setLimitAccount(limitAccount + 1);
+    });
+    const renderAccounts = (listAccountsRender, customStyle = {}) => (React.createElement("ul", { style: Object.assign(Object.assign({}, customStyle), { opacity: `${isShowLoading ? 0.2 : 1}` }) }, (listAccountsRender === null || listAccountsRender === void 0 ? void 0 : listAccountsRender.length) ? (listAccountsRender.map((account) => (React.createElement("li", { key: account.user_id, onClick: () => handleSwitchAccount(account) },
+        React.createElement("span", { className: "account-name" }, account.full_name),
+        React.createElement("span", { className: "account-number" }, formatUserId(account.user_id)))))) : (React.createElement("div", null, translateLang('KEY_NO_ACCOUNTS')))));
+    return (React.createElement(CookiesProvider, null,
+        React.createElement(Popover, { content: React.createElement(PackageSharingStyled, null,
+                React.createElement("div", { className: "div-info-account" }, infoAccount ? (React.createElement(React.Fragment, null,
+                    React.createElement("div", { className: "div-info-left" },
+                        React.createElement("img", { src: infoAccount.avatar, alt: "" }),
+                        React.createElement("a", { className: "edit-profile", href: urlEditProfile, target: "_blank", rel: "noreferrer" },
+                            React.createElement(Icon, { type: "icon-ants-edit-2", style: { color: '#aaa' } }))),
+                    React.createElement("div", { className: "div-info-right" },
+                        React.createElement("p", { style: { fontWeight: 600 } }, infoAccount.full_name),
+                        React.createElement("p", { style: { color: '#aaa', marginTop: 2 } }, infoAccount.email)))) : (React.createElement("div", null,
+                    translateLang('KEY_LOADING'),
+                    "..."))),
+                React.createElement(InnerCardStyled, null,
+                    React.createElement("div", { className: "network-block" }, step === STEP.SWITCH_ACCOUNT ? (React.createElement("div", { className: "current-network" },
+                        currentNetwork && currentNetwork.logo ? (React.createElement("div", null,
+                            React.createElement("img", { src: currentNetwork.logo, style: {
+                                    maxHeight: 28,
+                                    maxWidth: 200,
+                                    borderRadius: 0,
+                                    border: 'none',
+                                    boxShadow: 'none',
+                                }, alt: "network-logo" }))) : null,
+                        React.createElement(Button, { type: "text", className: "change-network-btn", onClick: () => switchStep(STEP.SELECT_NETWORK), icon: React.createElement(Icon, { type: "icon-ants-angle-right", style: { fontSize: '12px' } }) }, translateLang('KEY_CHANGE_PORTAL')))) : (React.createElement("div", { className: "network-select-wrapper" },
+                        React.createElement(Flex, { gap: 10 },
+                            React.createElement(Button, { type: "text", onClick: () => switchStep(STEP.SWITCH_ACCOUNT), icon: React.createElement(Icon, { type: "icon-ants-angle-left", style: { fontSize: '12px' } }) }, translateLang('KEY_BACK')),
+                            React.createElement(InputSearch, { className: "--portal", translateLang: translateLang, value: portalSearch, onChange: value => setPortalSearch(value), onClickRemove: () => setPortalSearch('') })),
+                        filterListNetwork && filterListNetwork.length ? (React.createElement("div", { className: "network-select" }, filterListNetwork.map((network) => (React.createElement("div", { key: network.networkId, className: `network-item ${networkId === +network.networkId ? 'disabled' : ''}`, onClick: () => selectNetwork(network) },
+                            React.createElement("div", { className: "image-wrapper" },
+                                React.createElement("img", { src: network.logo, style: {
+                                        // maxWidth: 55,
+                                        // maxHeight: 55,
+                                        borderRadius: 0,
+                                        border: 'none',
+                                        boxShadow: 'none',
+                                    }, alt: "logo" })),
+                            React.createElement("p", { className: "network-name" }, network.networkName)))))) : (React.createElement("div", { style: {
+                                display: 'flex',
+                                justifyContent: 'center',
+                                alignItems: 'center',
+                            } },
+                            React.createElement("p", { style: { fontSize: 12, color: '#aaa', margin: 0 } }, "No networks")))))),
+                    step === STEP.SWITCH_ACCOUNT ? (isShowSharing ? (React.createElement("div", { className: "div-account-sharing mt-10" },
+                        React.createElement("div", { className: "div-cover-account" },
+                            isShowLoading ? React.createElement(Spin, null) : null,
+                            isShowSearchAccount || !(listAccountRecent === null || listAccountRecent === void 0 ? void 0 : listAccountRecent.length) ? (React.createElement(InputSearch, { value: accountSearch, onChange: value => setAccountSearch(value), onClickRemove: () => {
+                                    setAccountSearch('');
+                                    setIsShowSearchAccount(false);
+                                } })) : (React.createElement(React.Fragment, null,
+                                React.createElement("div", { className: "div-recent-account" },
+                                    React.createElement("span", { className: "recent-title" }, "Recent accounts"),
+                                    React.createElement(SearchIcon, { onClick: () => setIsShowSearchAccount(true), className: "search-icon" })),
+                                renderAccounts(listAccountRecent, {
+                                    minHeight: 32,
+                                    maxHeight: 162,
+                                    padding: '0 10px',
+                                }))),
+                            renderAccounts(listAccountSharing)))) : (React.createElement("hr", { style: { margin: '10px 0 20px', background: '#E3EEF1' } }))) : null),
+                React.createElement(Flex, { align: "center", justify: "center" },
+                    React.createElement(Button, { onClick: () => onClickButtonLogout(), icon: React.createElement(Icon, { type: "icon-ants-exit" }) }, translateLang('KEY_LOGOUT')))), arrow: false, trigger: ['click'], placement: "bottomRight", overlayInnerStyle: { backgroundColor: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.blue1_2, padding: '20px 15px' } },
+            React.createElement(TriggerPopoverStyled, null,
+                React.createElement("div", { className: "brand-logo" }, (currentNetwork === null || currentNetwork === void 0 ? void 0 : currentNetwork.logo) ? React.createElement("img", { src: currentNetwork.logo, alt: "" }) : null),
+                React.createElement("div", { className: "avatar" }, infoAccount ? React.createElement("img", { src: infoAccount.avatar, alt: "" }) : null)))));
+};

package/es/components/organism/AccountSharing/constant.d.ts

@@ -0,0 +1,20 @@
+export declare const appConfig: {
+    DEFAULT_KEY: {
+        KEY_EDIT_PROFILE: string;
+        KEY_LOADING: string;
+        KEY_CHANGE_PORTAL: string;
+        KEY_BACK: string;
+        KEY_SEARCH_PLACEHOLDER: string;
+        KEY_LOGOUT: string;
+        KEY_NO_ACCOUNTS: string;
+        KEY_PLEASE_WAITING: string;
+    };
+};
+export declare const DEFAULT_TRANSLATE_DATA: {
+    KEY_CHANGE_PORTAL: string;
+    KEY_EDIT_PROFILE: string;
+    KEY_SEARCH_PLACEHOLDER: string;
+    KEY_LOADING: string;
+    KEY_LOGOUT: string;
+    KEY_BACK: string;
+};

package/es/components/organism/AccountSharing/constant.js

@@ -0,0 +1,20 @@
+export const appConfig = {
+    DEFAULT_KEY: {
+        KEY_EDIT_PROFILE: 'Edit profile',
+        KEY_LOADING: 'Loading',
+        KEY_CHANGE_PORTAL: 'Change Portal',
+        KEY_BACK: 'Back',
+        KEY_SEARCH_PLACEHOLDER: 'Search',
+        KEY_LOGOUT: 'Logout',
+        KEY_NO_ACCOUNTS: 'No accounts',
+        KEY_PLEASE_WAITING: 'Please waiting',
+    },
+};
+export const DEFAULT_TRANSLATE_DATA = {
+    KEY_CHANGE_PORTAL: 'Change Portal',
+    KEY_EDIT_PROFILE: 'Edit profile',
+    KEY_SEARCH_PLACEHOLDER: 'Search',
+    KEY_LOADING: 'loading',
+    KEY_LOGOUT: 'Logout',
+    KEY_BACK: 'Back',
+};

package/es/components/organism/AccountSharing/icons/close.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const CloseIcon: (props: any) => React.JSX.Element;
+export default CloseIcon;

package/es/components/organism/AccountSharing/icons/close.js

@@ -0,0 +1,5 @@
+import React from 'react';
+const CloseIcon = props => (React.createElement("svg", Object.assign({ version: "1.1", xmlns: "http://www.w3.org/2000/svg", width: "31", height: "32", viewBox: "0 0 31 32" }, props),
+    React.createElement("title", null, "close"),
+    React.createElement("path", { d: "M30.719 3.733l-12.267 12.267 12.267 12.267-3.093 3.093-12.267-12.267-12.267 12.267-3.092-3.093 12.267-12.267-12.267-12.267 3.092-3.092 12.267 12.267 12.267-12.267z" })));
+export default CloseIcon;

package/es/components/organism/AccountSharing/icons/search.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const SearchIcon: (props: any) => React.JSX.Element;
+export default SearchIcon;

package/es/components/organism/AccountSharing/icons/search.js

@@ -0,0 +1,5 @@
+import React from 'react';
+const SearchIcon = props => (React.createElement("svg", Object.assign({ version: "1.1", xmlns: "http://www.w3.org/2000/svg", width: "31", height: "32", viewBox: "0 0 31 32" }, props),
+    React.createElement("title", null, "search"),
+    React.createElement("path", { d: "M5.847 17.688q2.306 2.306 5.6 2.306t5.6-2.306 2.306-5.6-2.306-5.6-5.6-2.306-5.6 2.306-2.306 5.6 2.306 5.6zM21.989 19.994l8.73 8.73-2.635 2.635-8.73-8.73v-1.4l-0.494-0.494q-3.13 2.718-7.412 2.718-4.777 0-8.153-3.294-3.294-3.294-3.294-8.071t3.294-8.071q3.377-3.377 8.153-3.377t8.071 3.377q3.294 3.294 3.294 8.071 0 1.729-0.824 3.953-0.824 2.141-1.894 3.459l0.494 0.494z" })));
+export default SearchIcon;

package/es/components/organism/AccountSharing/index.d.ts

@@ -0,0 +1 @@
+export { AccountSharing, type AccountSharingProps } from './AccountSharing';

package/es/components/organism/AccountSharing/index.js

@@ -0,0 +1 @@
+export { AccountSharing } from './AccountSharing';

package/es/components/organism/AccountSharing/styled.d.ts

@@ -0,0 +1,4 @@
+export declare const InputSearchStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TriggerPopoverStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const PackageSharingStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const InnerCardStyled: import("styled-components").StyledComponent<"div", any, {}, never>;