diff --git a/packages/components/src/informative/UserDisplayItem/UserDisplayItem.js b/packages/components/src/informative/UserDisplayItem/UserDisplayItem.js
index 2ba05ec62..2ee53b019 100644
--- a/packages/components/src/informative/UserDisplayItem/UserDisplayItem.js
+++ b/packages/components/src/informative/UserDisplayItem/UserDisplayItem.js
@@ -13,7 +13,7 @@ import { UserDisplayItemStyles } from './UserDisplayItem.styles';
export const USER_DISPLAY_ITEM_VARIANTS = ['inline', 'block', 'rol', 'email'];
export const USER_DISPLAY_ITEM_LAYOUT = ['left', 'right'];
-export const USER_DISPLAY_ITEM_SIZES = ['xs', 'sm', 'xmd', 'lg'];
+export const USER_DISPLAY_ITEM_SIZES = ['xs', 'sm', 'xsm', 'md', 'lg'];
export const USER_DISPLAY_ITEM_DEFAULT_PROPS = {
variant: 'inline',
diff --git a/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.constants.js b/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.constants.js
index 0c29f8276..8b0fe76b1 100644
--- a/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.constants.js
+++ b/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.constants.js
@@ -9,8 +9,12 @@ export const TOTAL_LAYOUT_STEP_CONTAINER_PROP_TYPES = {
fullWidth: PropTypes.bool,
titleZone: PropTypes.node,
loading: PropTypes.bool,
+ TopZone: PropTypes.node,
+ forceNotMaxWidth: PropTypes.bool,
};
export const TOTAL_LAYOUT_STEP_CONTAINER_DEFAULT_PROPS = {
stepName: '',
titleZone: null,
+ TopZone: null,
+ forceNotMaxWidth: false,
};
diff --git a/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.stories.js b/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.stories.js
index 2e3aa9d59..9877f72b5 100644
--- a/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.stories.js
+++ b/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.stories.js
@@ -3,7 +3,7 @@ import { TotalLayoutStepContainer } from './TotalLayoutStepContainer';
import { TOTAL_LAYOUT_STEP_CONTAINER_DEFAULT_PROPS } from './TotalLayoutStepContainer.constants';
import mdx from './TotalLayoutStepContainer.mdx';
import { ContextContainer } from '../../ContextContainer';
-import { TextInput, Textarea } from '../../../form';
+import { Button, TextInput, Textarea } from '../../../form';
import { Stack } from '../../Stack';
export default {
@@ -69,4 +69,5 @@ Playground.args = {
// myBooleanProp: false,
// mySelectProp: 'Hello'
...TOTAL_LAYOUT_STEP_CONTAINER_DEFAULT_PROPS,
+ TopZone: ,
};
diff --git a/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.styles.js b/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.styles.js
index 9204cf60a..e41752b95 100644
--- a/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.styles.js
+++ b/packages/components/src/layout/TotalLayout/TotalLayoutStepContainer/TotalLayoutStepContainer.styles.js
@@ -2,7 +2,7 @@ import { createStyles } from '@mantine/styles';
import { TOTAL_LAYOUT_HEADER_HEIGHT } from '../TotalLayoutHeader/TotalLayoutHeader.constants';
const TotalLayoutStepContainerStyles = createStyles(
- (theme, { hasFooter, clean, fullWidth, noMargin, footerPadding }) => ({
+ (theme, { hasFooter, clean, fullWidth, noMargin, footerPadding, TopZone, forceNotMaxWidth }) => ({
root: {},
stepContainer: {
padding: clean ? 0 : '30px 0 0 0 ',
@@ -22,6 +22,10 @@ const TotalLayoutStepContainerStyles = createStyles(
stepName: {
marginBottom: 12,
},
+ topZone: {
+ marginBottom: 12,
+ marginTop: 24,
+ },
}),
);
diff --git a/packages/components/src/misc/CardEmptyCover/CardEmptyCover.js b/packages/components/src/misc/CardEmptyCover/CardEmptyCover.js
index f065c2190..8f2ab2ab2 100644
--- a/packages/components/src/misc/CardEmptyCover/CardEmptyCover.js
+++ b/packages/components/src/misc/CardEmptyCover/CardEmptyCover.js
@@ -18,6 +18,7 @@ import { AssetDocumentIconSmall } from '../FileIcon/AssetDocumentIcon';
import { AssetScormIcon } from '../FileIcon/AssetScormIcon';
import { AssetTestIcon } from '../FileIcon/AssetTestIcon';
import { Box } from '../../layout/Box';
+import { AssetCommunityIcon } from '../FileIcon/AsssetCommunityIcon';
const CardEmptyCover = memo(({ icon, fileType, height }) => {
const pairColumnRef = useRef(null);
@@ -55,6 +56,10 @@ const CardEmptyCover = memo(({ icon, fileType, height }) => {
key: 'application',
value:
Lorem ipsum, dolor sitamet consectetur adipisicing elit. Provident omnis laudantium itaque quisquam est, magnam harum, cum molestias necessitatibus obcaecati quod esse debitis velit nemo dolores deserunt. Quia, iure doloremque.
- -- Life is like an npm install – you never know what you are going to get. - – Forrest Gump -- -
This is Code
inside paragraph
import React from 'react'; -import { Avatar } from '@mantine/core'; -import image from './image.png'; - -export function AvatarDemo() { - return <Avatar src={image} alt="it's me" />; -}- -
Element position | Element name | Symbol | Atomic mass |
---|---|---|---|
6 | Carbon | C | 12.011 |
7 | Nitrogen | N | 14.007 |
39 | Yttrium | Y | 88.906 |
56 | Barium | Ba | 137.33 |
58 | Cerium | Ce | 140.12 |
Post muy largo
El aprendizaje continuo en el mundo de la programación es una necesidad ineludible. La tecnología avanza a pasos agigantados, y lo que hoy es innovador, mañana puede quedar obsoleto. Como desarrolladores, nos enfrentamos al desafío constante de mantenernos actualizados en un campo que evoluciona rápidamente.
Uno de los aspectos más fascinantes de este viaje es la diversidad de caminos que podemos tomar. Desde el desarrollo web hasta la inteligencia artificial, pasando por la ciberseguridad y el blockchain, las opciones son casi infinitas. Cada especialización ofrece sus propios retos y recompensas, permitiéndonos encontrar nuestra pasión dentro de este vasto universo digital.
Sin embargo, el verdadero poder de un programador no reside solo en el conocimiento técnico, sino en la capacidad de resolver problemas. La lógica, la creatividad y el pensamiento crítico son habilidades tan importantes como el dominio de cualquier lenguaje de programación. Es la combinación de estas habilidades lo que nos permite crear soluciones innovadoras y eficientes.
Compartir conocimientos, colaborar en proyectos y aprender de los errores y éxitos de otros nos ayuda a crecer más rápido y de manera más integral.
No debemos olvidar la importancia de la ética en nuestro trabajo. A medida que la tecnología se integra más en todos los aspectos de la vida, nuestra responsabilidad como creadores aumenta. Debemos considerar cuidadosamente el impacto de nuestro código en la sociedad y esforzarnos por desarrollar tecnologías que beneficien a la humanidad.
En resumen, ser programador es embarcarse en un viaje de aprendizaje permanente, lleno de desafíos y oportunidades. Es un camino que requiere dedicación, pasión y una mente abierta. Pero para aquellos que abrazan este estilo de vida, las recompensas son inmensas: la satisfacción de crear, la emoción de innovar y la oportunidad de dejar una huella duradera en el mundo digital.
`, }; diff --git a/packages/components/src/typography/HtmlText/helpers.js b/packages/components/src/typography/HtmlText/helpers.js new file mode 100644 index 000000000..a575f84d2 --- /dev/null +++ b/packages/components/src/typography/HtmlText/helpers.js @@ -0,0 +1,38 @@ +const truncateHtml = (element, maxLines) => { + const allElements = element.getElementsByTagName('*'); + let lineCount = 0; + let lastElement; + + for (let i = 0; i < allElements.length; i++) { + const currentElement = allElements[i]; + const lines = Math.ceil( + currentElement.offsetHeight / parseInt(getComputedStyle(currentElement).lineHeight), + ); + + if (lineCount + lines > maxLines) { + const remainingLines = maxLines - lineCount; + currentElement.style.overflow = 'hidden'; + currentElement.style.textOverflow = 'ellipsis'; + currentElement.style.display = '-webkit-box'; + currentElement.style.WebkitLineClamp = remainingLines.toString(); + currentElement.style.WebkitBoxOrient = 'vertical'; + currentElement.style.wordBreak = 'keep-all'; + currentElement.style.overflowWrap = 'break-word'; + + for (let j = i + 1; j < allElements.length; j++) { + allElements[j].style.display = 'none'; + } + break; + } + + lineCount += lines; + lastElement = currentElement; + } + + // Si no se excedió el límite, asegurarse de que el último elemento esté visible + if (lastElement) { + lastElement.style.display = ''; + } +}; + +export { truncateHtml }; diff --git a/packages/editors/src/form/TextEditorInput/TextEditorInput.constants.js b/packages/editors/src/form/TextEditorInput/TextEditorInput.constants.js index 1c1a50945..147711cf5 100644 --- a/packages/editors/src/form/TextEditorInput/TextEditorInput.constants.js +++ b/packages/editors/src/form/TextEditorInput/TextEditorInput.constants.js @@ -12,6 +12,17 @@ export const TEXT_EDITOR_DEFAULT_TOOLBARS = { }; export const TEXT_EDITOR_TEXTAREA_TOOLBARS = { + style: true, + heading: false, + align: false, + list: false, + history: false, + color: false, + formulation: false, + link: true, +}; + +export const TEXT_EDITOR_NO_HEADINGS_TOOLBARS = { style: true, heading: false, align: true, diff --git a/packages/icons/outline/esm/index.d.ts b/packages/icons/outline/esm/index.d.ts index 886849444..8e91fead7 100644 --- a/packages/icons/outline/esm/index.d.ts +++ b/packages/icons/outline/esm/index.d.ts @@ -95,6 +95,7 @@ export { default as LayoutGridIcon } from './LayoutGridIcon' export { default as LayoutHeadlineIcon } from './LayoutHeadlineIcon' export { default as LayoutModuleIcon } from './LayoutModuleIcon' export { default as LayoutTwoColumsIcon } from './LayoutTwoColumsIcon' +export { default as LikeOutlineIcon } from './LikeOutlineIcon' export { default as LinkBrokenIcon } from './LinkBrokenIcon' export { default as ListEditIcon } from './ListEditIcon' export { default as LocationIcon } from './LocationIcon' @@ -102,6 +103,7 @@ export { default as LoveItRemoveIcon } from './LoveItRemoveIcon' export { default as LoveItIcon } from './LoveItIcon' export { default as ManWomanIcon } from './ManWomanIcon' export { default as MeetingCameraIcon } from './MeetingCameraIcon' +export { default as MessagesBubbleSquareIcon } from './MessagesBubbleSquareIcon' export { default as ModuleFourIcon } from './ModuleFourIcon' export { default as ModuleThreeIcon } from './ModuleThreeIcon' export { default as ModuleTwoIcon } from './ModuleTwoIcon' @@ -123,6 +125,7 @@ export { default as PluginAlertsIcon } from './PluginAlertsIcon' export { default as PluginAssignmentsIcon } from './PluginAssignmentsIcon' export { default as PluginCalendarIcon } from './PluginCalendarIcon' export { default as PluginClassesIcon } from './PluginClassesIcon' +export { default as PluginComunicaNoDotsIcon } from './PluginComunicaNoDotsIcon' export { default as PluginComunicaIcon } from './PluginComunicaIcon' export { default as PluginContentCreatorIcon } from './PluginContentCreatorIcon' export { default as PluginCurriculumIcon } from './PluginCurriculumIcon' diff --git a/packages/icons/outline/esm/index.js b/packages/icons/outline/esm/index.js index 7412e0c37..22b29a369 100644 --- a/packages/icons/outline/esm/index.js +++ b/packages/icons/outline/esm/index.js @@ -95,6 +95,7 @@ export { default as LayoutGridIcon } from './LayoutGridIcon.js' export { default as LayoutHeadlineIcon } from './LayoutHeadlineIcon.js' export { default as LayoutModuleIcon } from './LayoutModuleIcon.js' export { default as LayoutTwoColumsIcon } from './LayoutTwoColumsIcon.js' +export { default as LikeOutlineIcon } from './LikeOutlineIcon.js' export { default as LinkBrokenIcon } from './LinkBrokenIcon.js' export { default as ListEditIcon } from './ListEditIcon.js' export { default as LocationIcon } from './LocationIcon.js' @@ -102,6 +103,7 @@ export { default as LoveItRemoveIcon } from './LoveItRemoveIcon.js' export { default as LoveItIcon } from './LoveItIcon.js' export { default as ManWomanIcon } from './ManWomanIcon.js' export { default as MeetingCameraIcon } from './MeetingCameraIcon.js' +export { default as MessagesBubbleSquareIcon } from './MessagesBubbleSquareIcon.js' export { default as ModuleFourIcon } from './ModuleFourIcon.js' export { default as ModuleThreeIcon } from './ModuleThreeIcon.js' export { default as ModuleTwoIcon } from './ModuleTwoIcon.js' @@ -123,6 +125,7 @@ export { default as PluginAlertsIcon } from './PluginAlertsIcon.js' export { default as PluginAssignmentsIcon } from './PluginAssignmentsIcon.js' export { default as PluginCalendarIcon } from './PluginCalendarIcon.js' export { default as PluginClassesIcon } from './PluginClassesIcon.js' +export { default as PluginComunicaNoDotsIcon } from './PluginComunicaNoDotsIcon.js' export { default as PluginComunicaIcon } from './PluginComunicaIcon.js' export { default as PluginContentCreatorIcon } from './PluginContentCreatorIcon.js' export { default as PluginCurriculumIcon } from './PluginCurriculumIcon.js' diff --git a/packages/icons/outline/index.d.ts b/packages/icons/outline/index.d.ts index 886849444..8e91fead7 100644 --- a/packages/icons/outline/index.d.ts +++ b/packages/icons/outline/index.d.ts @@ -95,6 +95,7 @@ export { default as LayoutGridIcon } from './LayoutGridIcon' export { default as LayoutHeadlineIcon } from './LayoutHeadlineIcon' export { default as LayoutModuleIcon } from './LayoutModuleIcon' export { default as LayoutTwoColumsIcon } from './LayoutTwoColumsIcon' +export { default as LikeOutlineIcon } from './LikeOutlineIcon' export { default as LinkBrokenIcon } from './LinkBrokenIcon' export { default as ListEditIcon } from './ListEditIcon' export { default as LocationIcon } from './LocationIcon' @@ -102,6 +103,7 @@ export { default as LoveItRemoveIcon } from './LoveItRemoveIcon' export { default as LoveItIcon } from './LoveItIcon' export { default as ManWomanIcon } from './ManWomanIcon' export { default as MeetingCameraIcon } from './MeetingCameraIcon' +export { default as MessagesBubbleSquareIcon } from './MessagesBubbleSquareIcon' export { default as ModuleFourIcon } from './ModuleFourIcon' export { default as ModuleThreeIcon } from './ModuleThreeIcon' export { default as ModuleTwoIcon } from './ModuleTwoIcon' @@ -123,6 +125,7 @@ export { default as PluginAlertsIcon } from './PluginAlertsIcon' export { default as PluginAssignmentsIcon } from './PluginAssignmentsIcon' export { default as PluginCalendarIcon } from './PluginCalendarIcon' export { default as PluginClassesIcon } from './PluginClassesIcon' +export { default as PluginComunicaNoDotsIcon } from './PluginComunicaNoDotsIcon' export { default as PluginComunicaIcon } from './PluginComunicaIcon' export { default as PluginContentCreatorIcon } from './PluginContentCreatorIcon' export { default as PluginCurriculumIcon } from './PluginCurriculumIcon' diff --git a/packages/icons/outline/index.js b/packages/icons/outline/index.js index b0c1a9af3..0c2041e99 100644 --- a/packages/icons/outline/index.js +++ b/packages/icons/outline/index.js @@ -95,6 +95,7 @@ module.exports.LayoutGridIcon = require("./LayoutGridIcon.js") module.exports.LayoutHeadlineIcon = require("./LayoutHeadlineIcon.js") module.exports.LayoutModuleIcon = require("./LayoutModuleIcon.js") module.exports.LayoutTwoColumsIcon = require("./LayoutTwoColumsIcon.js") +module.exports.LikeOutlineIcon = require("./LikeOutlineIcon.js") module.exports.LinkBrokenIcon = require("./LinkBrokenIcon.js") module.exports.ListEditIcon = require("./ListEditIcon.js") module.exports.LocationIcon = require("./LocationIcon.js") @@ -102,6 +103,7 @@ module.exports.LoveItRemoveIcon = require("./LoveItRemoveIcon.js") module.exports.LoveItIcon = require("./LoveItIcon.js") module.exports.ManWomanIcon = require("./ManWomanIcon.js") module.exports.MeetingCameraIcon = require("./MeetingCameraIcon.js") +module.exports.MessagesBubbleSquareIcon = require("./MessagesBubbleSquareIcon.js") module.exports.ModuleFourIcon = require("./ModuleFourIcon.js") module.exports.ModuleThreeIcon = require("./ModuleThreeIcon.js") module.exports.ModuleTwoIcon = require("./ModuleTwoIcon.js") @@ -123,6 +125,7 @@ module.exports.PluginAlertsIcon = require("./PluginAlertsIcon.js") module.exports.PluginAssignmentsIcon = require("./PluginAssignmentsIcon.js") module.exports.PluginCalendarIcon = require("./PluginCalendarIcon.js") module.exports.PluginClassesIcon = require("./PluginClassesIcon.js") +module.exports.PluginComunicaNoDotsIcon = require("./PluginComunicaNoDotsIcon.js") module.exports.PluginComunicaIcon = require("./PluginComunicaIcon.js") module.exports.PluginContentCreatorIcon = require("./PluginContentCreatorIcon.js") module.exports.PluginCurriculumIcon = require("./PluginCurriculumIcon.js") diff --git a/packages/icons/src/outline/like-outline.svg b/packages/icons/src/outline/like-outline.svg new file mode 100644 index 000000000..26b15a0c2 --- /dev/null +++ b/packages/icons/src/outline/like-outline.svg @@ -0,0 +1,3 @@ + diff --git a/packages/icons/src/outline/messages-bubble-square.svg b/packages/icons/src/outline/messages-bubble-square.svg new file mode 100644 index 000000000..7c94bf31d --- /dev/null +++ b/packages/icons/src/outline/messages-bubble-square.svg @@ -0,0 +1,3 @@ + diff --git a/packages/icons/src/outline/plugin-comunica-no-dots.svg b/packages/icons/src/outline/plugin-comunica-no-dots.svg new file mode 100755 index 000000000..5912ffd61 --- /dev/null +++ b/packages/icons/src/outline/plugin-comunica-no-dots.svg @@ -0,0 +1,6 @@ +