tycho-components 0.18.0 → 0.18.2

package/dist/Header/HeaderApps/style.scss

@@ -133,6 +133,10 @@
       .header-profile-apps {
         display: block;
         margin-left: auto;
+
+        > .profile-container {
+          display: flex;
+        }
       }
     }
 

package/dist/Header/HeaderButtons/HeaderButtons.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { IconButton } from 'tycho-storybook';
@@ -14,5 +14,5 @@ export default function HeaderButtons({ hideKeyboard, notifications, keyboardLay
     const { getCorpus } = useCorpusUtils();
     const { isLogged } = useLoggedUtils();
     const [openKeyboard, setOpenKeyboard] = useState(false);
-    return (_jsxs(_Fragment, { children: [!hideKeyboard && (_jsx(IconButton, { onClick: () => setOpenKeyboard(!openKeyboard), name: "keyboard", size: "medium", title: t('tooltip.keyboard'), mode: mobile ? 'outlined' : 'filled' })), _jsx(HelpButton, { helpActions: helpActions, mobile: mobile }), notifications && isLogged() && (_jsx(HeaderNotifications, { uid: notifications.ref, mode: notifications.mode, mobile: mobile })), _jsx(LanguageSelector, { openToTop: mobile ? true : false, mobile: mobile }), openKeyboard && (_jsx(VirtualKeyboard, { onClose: () => setOpenKeyboard(false), closeLabel: t('button.close'), defaultLayout: keyboardLayout || getCorpus().keyboardLayout || 'english' }))] }));
+    return (_jsxs("div", { className: "header-buttons", children: [!hideKeyboard && (_jsx(IconButton, { onClick: () => setOpenKeyboard(!openKeyboard), name: "keyboard", size: "medium", title: t('tooltip.keyboard'), mode: mobile ? 'outlined' : 'filled' })), _jsx(HelpButton, { helpActions: helpActions, mobile: mobile }), notifications && isLogged() && (_jsx(HeaderNotifications, { uid: notifications.ref, mode: notifications.mode, mobile: mobile })), _jsx(LanguageSelector, { openToTop: mobile ? true : false, mobile: mobile }), openKeyboard && (_jsx(VirtualKeyboard, { onClose: () => setOpenKeyboard(false), closeLabel: t('button.close'), defaultLayout: keyboardLayout || getCorpus().keyboardLayout || 'english' }))] }));
 }

package/dist/Header/HeaderButtons/styles.scss

@@ -0,0 +1,11 @@
+.header-buttons {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+@media (max-width: 768px) {
+  .header-buttons {
+    display: none;
+  }
+}

package/dist/Header/HeaderUser/HeaderUser.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Button, Icon, ProfileDropdown } from 'tycho-storybook';
+import { Avatar, Button, Icon } from 'tycho-storybook';
 import { useLoggedUtils } from '../../configs/useLoggedUtils';
 import './style.scss';
 export default function HeaderUser({ navigateLogout, navigateNotLogged, }) {
@@ -12,7 +12,7 @@ export default function HeaderUser({ navigateLogout, navigateNotLogged, }) {
         setOpen(false);
         window.open(import.meta.env.VITE_APP_RESERVED_URL, '_blank');
     };
-    return (_jsxs("div", { className: "profile-container", children: [isLogged() ? (_jsx(ProfileDropdown, { src: getLogged()?.picture, title: getLogged()?.name || getLogged()?.sub, onClick: (b) => setOpen(b) })) : (_jsx(Button, { text: t('button.sign.in'), size: "small", onClick: navigateNotLogged })), open && isLogged() && (_jsxs("div", { className: "ds-dropdown-list", children: [_jsx("div", { className: "ds-dropdown-itemlist", children: _jsx("span", { className: "label", children: `${t('profile.label.hello')} ${getLogged()?.name || getLogged()?.sub}` }) }), _jsxs("div", { className: "ds-dropdown-itemlist d-none", children: [_jsx(Icon, { name: "colors", size: "x-small" }), _jsx("span", { className: "label", children: t('profile.label.theme') })] }), _jsxs("div", { className: "ds-dropdown-itemlist", onClick: handleProfile, children: [_jsx(Icon, { name: "person", size: "x-small" }), _jsx("span", { className: "label", children: t('profile.label.home') })] }), _jsxs("div", { className: "ds-dropdown-itemlist", children: [_jsx(Icon, { name: "live_help", size: "x-small" }), _jsx("span", { className: "label", children: t('profile.label.help') })] }), _jsxs("div", { className: "ds-dropdown-itemlist", onClick: () => {
+    return (_jsxs("div", { className: "profile-container", children: [isLogged() ? (_jsx("div", { onClick: () => setOpen(!open), children: _jsx(Avatar, { size: "small", src: getLogged()?.picture, title: getLogged()?.name || getLogged()?.sub }) })) : (_jsx(Button, { text: t('button.sign.in'), size: "small", onClick: navigateNotLogged })), open && isLogged() && (_jsxs("div", { className: "ds-dropdown-list", children: [_jsx("div", { className: "ds-dropdown-itemlist", children: _jsx("span", { className: "label", children: `${t('profile.label.hello')} ${getLogged()?.name || getLogged()?.sub}` }) }), _jsxs("div", { className: "ds-dropdown-itemlist d-none", children: [_jsx(Icon, { name: "colors", size: "x-small" }), _jsx("span", { className: "label", children: t('profile.label.theme') })] }), _jsxs("div", { className: "ds-dropdown-itemlist", onClick: handleProfile, children: [_jsx(Icon, { name: "person", size: "x-small" }), _jsx("span", { className: "label", children: t('profile.label.home') })] }), _jsxs("div", { className: "ds-dropdown-itemlist", children: [_jsx(Icon, { name: "live_help", size: "x-small" }), _jsx("span", { className: "label", children: t('profile.label.help') })] }), _jsxs("div", { className: "ds-dropdown-itemlist", onClick: () => {
                             setOpen(false);
                             navigateLogout && navigateLogout();
                         }, children: [_jsx(Icon, { name: "logout", size: "x-small" }), _jsx("span", { className: "label", children: t('profile.label.logout') })] })] }))] }));

package/dist/Header/HeaderUser/style.scss

@@ -24,3 +24,9 @@
     }
   }
 }
+
+@media (max-width: 767px) {
+  .profile-container {
+    display: none;
+  }
+}

package/dist/Header/styles.scss

@@ -35,7 +35,7 @@
     align-items: center;
     justify-content: flex-end;
     padding-right: var(--spacing-150);
-    gap: 4px;
+    gap: 8px;
   }
 }
 

package/dist/functions/ToolsUtils.d.ts

@@ -13,6 +13,7 @@ export type RedirectPageParams = {
     hasParameter: (corpus: Corpus, param: string) => boolean;
     tool?: PlatformTools;
     ctxPath?: string;
+    sameWindow?: boolean;
 };
 type EditionToolsMenu = {
     parameter: string;
@@ -24,7 +25,7 @@ type EditionToolsMenu = {
 };
 export declare const EDITION_TOOLS: EditionToolsMenu[];
 declare const ToolsUtils: {
-    redirectPage: ({ corpus, uid, hasParameter, tool, ctxPath, }: RedirectPageParams) => void;
+    redirectPage: ({ corpus, uid, hasParameter, tool, ctxPath, sameWindow, }: RedirectPageParams) => void;
     getIcon: (defaultTool?: PlatformTools) => string;
     openDocument: ({ page, corpus, hasParameter, defaultTool, ctxPath, }: OpenDocumentParams) => void;
     getTitle: (defaultTool?: PlatformTools) => string;

package/dist/functions/ToolsUtils.js

@@ -47,34 +47,42 @@ const withCtxPath = (absolutePath, ctxPath) => {
     const path = absolutePath.startsWith('/') ? absolutePath : `/${absolutePath}`;
     return `${base}${path}`;
 };
-const openTranslations = (uid, ctxPath) => {
-    window.open(withCtxPath(`/translation/${uid}`, ctxPath));
+const navigateTo = (path, ctxPath, sameWindow) => {
+    const targetPath = withCtxPath(path, ctxPath);
+    if (sameWindow) {
+        window.location.assign(targetPath);
+        return;
+    }
+    window.open(targetPath);
+};
+const openTranslations = (uid, ctxPath, sameWindow) => {
+    navigateTo(`/translation/${uid}`, ctxPath, sameWindow);
 };
-const openTranscriber = (uid, ctxPath) => {
-    window.open(withCtxPath(`/transcriber/${uid}`, ctxPath));
+const openTranscriber = (uid, ctxPath, sameWindow) => {
+    navigateTo(`/transcriber/${uid}`, ctxPath, sameWindow);
 };
-const openEdictor = (uid, ctxPath) => {
-    window.open(withCtxPath(`/editor/${uid}`, ctxPath));
+const openEdictor = (uid, ctxPath, sameWindow) => {
+    navigateTo(`/editor/${uid}`, ctxPath, sameWindow);
 };
-const openDesign = (uid, ctxPath) => {
-    window.open(withCtxPath(`/editor/box/${uid}`, ctxPath));
+const openDesign = (uid, ctxPath, sameWindow) => {
+    navigateTo(`/editor/box/${uid}`, ctxPath, sameWindow);
 };
-const redirectPage = ({ corpus, uid, hasParameter, tool, ctxPath, }) => {
+const redirectPage = ({ corpus, uid, hasParameter, tool, ctxPath, sameWindow, }) => {
     if (tool) {
-        window.open(withCtxPath(`${EDITION_TOOLS.find((t) => t.name === tool)?.path}/${uid}`, ctxPath));
+        navigateTo(`${EDITION_TOOLS.find((t) => t.name === tool)?.path}/${uid}`, ctxPath, sameWindow);
         return;
     }
     if (hasParameter(corpus, 'useEdictor')) {
-        openEdictor(uid, ctxPath);
+        openEdictor(uid, ctxPath, sameWindow);
     }
     else if (hasParameter(corpus, 'useTranslations')) {
-        openTranslations(uid, ctxPath);
+        openTranslations(uid, ctxPath, sameWindow);
     }
     else if (hasParameter(corpus, 'useDesigner')) {
-        openDesign(uid, ctxPath);
+        openDesign(uid, ctxPath, sameWindow);
     }
     else if (hasParameter(corpus, 'useTranscriber')) {
-        openTranscriber(uid, ctxPath);
+        openTranscriber(uid, ctxPath, sameWindow);
     }
 };
 const openDocument = ({ page, corpus, hasParameter, defaultTool, ctxPath, }) => {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tycho-components",
   "private": false,
-  "version": "0.18.0",
+  "version": "0.18.2",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {
@@ -49,7 +49,7 @@
     "react-hook-form": "^7.45.2",
     "react-i18next": "^13.0.2",
     "react-router-dom": "^6.14.2",
-    "tycho-storybook": "0.6.3",
+    "tycho-storybook": "0.6.4",
     "yup": "^1.2.0"
   },
   "devDependencies": {