@linagora/twake-mui 18.3.0 → 18.4.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# @linagora/twake-mui [18.4.0](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@18.3.0...@linagora/twake-mui@18.4.0) (2026-10-22)
+
+
+### Features
+
+* **twake-mui:** Add getPlainTextFromMarkdown helper ([a47e189](https://github.com/linagora/twake-ui/commit/a47e1897ecdd14e8d2e8b7c6663815272c00aad4)), closes [cozy/cozy-ui#2965](https://github.com/cozy/cozy-ui/issues/2965)
+
 # @linagora/twake-mui [18.3.0](https://github.com/linagora/twake-ui/compare/@linagora/twake-mui@18.2.0...@linagora/twake-mui@18.3.0) (2026-10-22)
 
 

package/dist/components/Markdown/Markdown.stories.d.ts

@@ -5,3 +5,4 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const Screenshot: Story;
+export declare const PlainText: Story;

package/dist/components/Markdown/Markdown.stories.js

@@ -1,3 +1,6 @@
+import { Typography } from '@mui/material';
+import React from 'react';
+import { getPlainTextFromMarkdown } from './helpers';
 import Markdown from './index';
 const content = `
 # Demo
@@ -76,3 +79,9 @@ export const Screenshot = {
     tags: ['argos'],
     args: { content }
 };
+export const PlainText = {
+    args: {
+        content: '# Demo\n\nSome **bold** text, a [link](https://twake.app) and a list:\n\n- first\n- second'
+    },
+    render: ({ content }) => (React.createElement(Typography, { noWrap: true }, getPlainTextFromMarkdown(content)))
+};

package/dist/components/Markdown/helpers.d.ts

@@ -0,0 +1,7 @@
+import remarkGfm from 'remark-gfm';
+export declare const remarkPlugins: (typeof remarkGfm)[];
+/**
+ * Gives the words of a Markdown content on one line, without its syntax,
+ * as the Markdown component shows them: for a preview
+ */
+export declare const getPlainTextFromMarkdown: (content: string) => string;

package/dist/components/Markdown/helpers.js

@@ -0,0 +1,33 @@
+import remarkGfm from 'remark-gfm';
+import remarkParse from 'remark-parse';
+import { unified } from 'unified';
+export const remarkPlugins = [remarkGfm];
+const markdown = unified().use(remarkParse).use(remarkPlugins);
+// Nodes whose children are blocks or cells: a space keeps their words apart
+const BLOCKS = [
+    'root',
+    'blockquote',
+    'footnoteDefinition',
+    'list',
+    'listItem',
+    'table',
+    'tableRow'
+];
+const getWords = (node) => {
+    if (node.type === 'image' || node.type === 'imageReference')
+        return node.alt ?? '';
+    if (node.type === 'break')
+        return ' ';
+    if (typeof node.value === 'string')
+        return node.value;
+    return (node.children ?? [])
+        .map(getWords)
+        .join(BLOCKS.includes(node.type) ? ' ' : '');
+};
+/**
+ * Gives the words of a Markdown content on one line, without its syntax,
+ * as the Markdown component shows them: for a preview
+ */
+export const getPlainTextFromMarkdown = (content) => getWords(markdown.runSync(markdown.parse(content)))
+    .replace(/\s+/g, ' ')
+    .trim();

package/dist/components/Markdown/index.js

@@ -1,7 +1,7 @@
 import { Link, Typography } from '@mui/material';
 import React from 'react';
 import ReactMarkdown from 'react-markdown';
-import remarkGfm from 'remark-gfm';
+import { remarkPlugins } from './helpers';
 const makeHeading = (variant) => {
     const Heading = ({ children }) => (React.createElement(Typography, { variant: variant, sx: { mb: 2 } }, children));
     return Heading;
@@ -16,6 +16,5 @@ const components = {
     h5: makeHeading('h5'),
     h6: makeHeading('h6')
 };
-const remarkPlugins = [remarkGfm];
 const Markdown = ({ content }) => (React.createElement(ReactMarkdown, { remarkPlugins: remarkPlugins, components: components }, content));
 export default Markdown;

package/dist/index.d.ts

@@ -31,7 +31,7 @@ export { copyToClipboard } from './components/ActionsMenu/Actions/copyToClipboar
 export { editAttribute } from './components/ActionsMenu/Actions/editAttribute';
 export { others } from './components/ActionsMenu/Actions/others';
 export { exportToText } from './components/ActionsMenu/Actions/exportToText';
-export { default as AppTitle } from './components/Apptitle';
+export { default as AppTitle } from './components/AppTitle';
 export { default as Avatar } from './components/Avatar';
 export { default as BarTitle } from './components/BarTitle';
 export { default as Button } from './components/Button';
@@ -70,6 +70,7 @@ export { default as ListSkeleton } from './components/ListSkeleton';
 export { default as ListSubheader } from './components/ListSubheader';
 export { default as LoadMore } from './components/LoadMore';
 export { default as Markdown } from './components/Markdown';
+export { getPlainTextFromMarkdown } from './components/Markdown/helpers';
 export { default as MidEllipsis } from './components/MidEllipsis';
 export { default as NavigationList } from './components/NavigationList';
 export { default as NavigationListHeader } from './components/NavigationList/NavigationListHeader';
@@ -128,7 +129,7 @@ export type { FavoritesActionOptions } from './components/ActionsMenu/Actions/fa
 export type { DownloadActionOptions, DownloadFileOptions } from './components/ActionsMenu/Actions/download';
 export type { PrintActionOptions, PrintClient } from './components/ActionsMenu/Actions/print';
 export type { ExportToTextActionOptions } from './components/ActionsMenu/Actions/exportToText';
-export type { AppTitleProps } from './components/Apptitle';
+export type { AppTitleProps } from './components/AppTitle';
 export type { AvatarProps } from './components/Avatar';
 export type { BarTitleProps } from './components/BarTitle';
 export type { ButtonProps } from './components/Button';

package/dist/index.js

@@ -34,7 +34,7 @@ export { copyToClipboard } from './components/ActionsMenu/Actions/copyToClipboar
 export { editAttribute } from './components/ActionsMenu/Actions/editAttribute';
 export { others } from './components/ActionsMenu/Actions/others';
 export { exportToText } from './components/ActionsMenu/Actions/exportToText';
-export { default as AppTitle } from './components/Apptitle';
+export { default as AppTitle } from './components/AppTitle';
 export { default as Avatar } from './components/Avatar';
 export { default as BarTitle } from './components/BarTitle';
 export { default as Button } from './components/Button';
@@ -73,6 +73,7 @@ export { default as ListSkeleton } from './components/ListSkeleton';
 export { default as ListSubheader } from './components/ListSubheader';
 export { default as LoadMore } from './components/LoadMore';
 export { default as Markdown } from './components/Markdown';
+export { getPlainTextFromMarkdown } from './components/Markdown/helpers';
 export { default as MidEllipsis } from './components/MidEllipsis';
 export { default as NavigationList } from './components/NavigationList';
 export { default as NavigationListHeader } from './components/NavigationList/NavigationListHeader';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@linagora/twake-mui",
   "type": "module",
-  "version": "18.3.0",
+  "version": "18.4.0",
   "description": "MUI v9 theme system for Twake applications",
   "author": "Twake",
   "license": "MIT",
@@ -69,8 +69,10 @@
     "react-markdown": "^10.1.0",
     "react-use-measure": "2.1.7",
     "react-virtuoso": "4.13.0",
-    "remark-gfm": "^4.0.1",
-    "rooks": "8.4.0"
+    "remark-gfm": "4.0.1",
+    "remark-parse": "11.0.0",
+    "rooks": "8.4.0",
+    "unified": "11.0.5"
   },
   "devDependencies": {
     "@argos-ci/cli": "6.9.5",