kamotive_ui 1.2.28 → 1.2.29

package/dist/components/Comment/Comment.js

@@ -4,12 +4,13 @@ import classNames from 'classnames';
 import { Typography } from '../Typography/Typography';
 import { TextEditor } from '../TextEditor/TextEditor';
 import { AttachedFilesPreview } from '../AttachedFilesPreview/AttachedFilesPreview';
-import { IconDeleteFilled, IconPencilFilled } from '../../Icons';
+import { IconAccount, IconDeleteFilled, IconPencilFilled } from '../../Icons';
 import { IconButton } from '../IconButton/IconButton';
 export const Comment = ({ id, value, style, className, username, avatar, creationDate, canAttachFiles = false, files = [], canEdit = false, isEdit = false, label, error = false, helperText, onChange, onSubmit, onDelete, }) => {
     const [commentText, setCommentText] = useState(value || '');
     const [isEditMode, setIsEditMode] = useState(isEdit);
     const [attachedFiles, setAttachedFiles] = useState(files);
+    const [imageError, setImageError] = useState(false);
     const wrapperClassess = classNames(styles['wrapper--input'], className, {
         [styles['wrapper--input-label']]: label,
         [styles['wrapper--input-helperText']]: error,
@@ -38,7 +39,8 @@ export const Comment = ({ id, value, style, className, username, avatar, creatio
     return (React.createElement("div", { className: wrapperClassess, style: style },
         React.createElement("div", { style: { display: 'flex', justifyContent: 'space-between' } },
             React.createElement("div", { className: styles.labelWrapper },
-                React.createElement("div", { className: "profile" }, avatar ? (React.createElement("img", { src: avatar, alt: "Avatar", className: styles.avatar })) : (React.createElement("div", { className: styles.avatar }, "\uD83D\uDC64"))),
+                React.createElement("div", { className: styles.flexBox }, avatar && !imageError ? (React.createElement("img", { src: avatar, alt: "Avatar", className: styles.avatar, onError: () => setImageError(true) })) : (React.createElement("div", { className: `${styles.avatar} ${styles.avatarIcon} ${styles.flexBox}` },
+                    React.createElement(IconAccount, null)))),
                 React.createElement("div", { className: styles.infoWrapper },
                     React.createElement(Typography, { variant: "Body2-Medium", className: labelClasses }, username),
                     React.createElement(Typography, { variant: "Caption", className: styles.label, style: { color: '#8E8E93' } }, creationDate))),

package/dist/components/Comment/Comment.module.css

@@ -39,6 +39,18 @@
 	object-fit: cover;
 }
 
+.avatarIcon {
+	background-color: var(--grey-extraLight);
+	border-radius: 25px;
+	border: none;
+}
+
+.flexBox {
+	align-items: center;
+	display: flex;
+	justify-content: center;
+}
+
 .input {
 	font-family: var(--font-family-content);
 	font-style: normal;

package/dist/components/Link/Link.js

@@ -4,7 +4,7 @@ import styles from './Link.module.css';
 import { Typography } from '../Typography/Typography';
 import { ETypographyVariants } from '../Typography/enums';
 import { Tooltip } from '../Tooltip/Tooltip';
-export const Link = ({ href, onClick, children, title, className, style, underline = 'hover', variant = ETypographyVariants.Body1, color = 'var(--text-dark)', maxWidth, size, widthInPixels, }) => {
+export const Link = ({ href, onClick, children, title, className, style, contentStyle, underline = 'hover', variant = ETypographyVariants.Body1, color = 'var(--text-dark)', maxWidth, size, widthInPixels, }) => {
     const stylesUnderline = underline === 'hover' ? styles.linkHover : underline === 'none' ? styles.linkNone : '';
     const stylesTooltipWidth = maxWidth ? { maxWidth: maxWidth } : {};
     const textRef = useRef(null);
@@ -24,7 +24,7 @@ export const Link = ({ href, onClick, children, title, className, style, underli
         const shouldShow = actualSize > widthInPixels;
         return shouldShow;
     }, [actualSize, widthInPixels, size]);
-    const linkContent = (React.createElement(Typography, { variant: variant, color: color }, children));
+    const linkContent = (React.createElement(Typography, { variant: variant, color: color, style: contentStyle }, children));
     const link = onClick ? (React.createElement("div", { onClick: onClick, className: classNames(styles.link, stylesUnderline, isTooltipVisible && styles.tooltipStyle, className), style: Object.assign(Object.assign({}, linkStyle), stylesTooltipWidth) },
         !size && (React.createElement("div", { ref: textRef, style: {
                 position: 'absolute',

package/dist/components/List/List.js

@@ -5,6 +5,7 @@ import { Typography } from '../Typography/Typography';
 import { Checkbox } from '../Checkbox/Checkbox';
 import { RadioButton } from '../RadioButton/RadioButton';
 import { ChevronDown } from '../../Icons';
+import { ListItem } from '../ListItem/ListItem';
 export const List = ({ onClick, onCheck, onRadioSelect, checked = false, selected = false, disabled = false, label, id, style, className, collapsible = false, open = false, withCheckbox = false, checkboxColor, checkboxFilled, withRadioButton = false, customBullet, customItemBullet, bulletClassName, titleContent, children, isHeader = false, parentChecked = false, }) => {
     const [isOpen, setIsOpen] = useState(open);
     const [isChecked, setIsChecked] = useState(checked || parentChecked);
@@ -37,7 +38,7 @@ export const List = ({ onClick, onCheck, onRadioSelect, checked = false, selecte
         const newCheckedState = !isChecked;
         setIsChecked(newCheckedState);
         if (onCheck) {
-            onCheck(id || "", newCheckedState);
+            onCheck(id || '', newCheckedState);
         }
         if (childIds.length > 0 && onCheck) {
             childIds.forEach((childId) => {
@@ -69,23 +70,18 @@ export const List = ({ onClick, onCheck, onRadioSelect, checked = false, selecte
             collapsible && (React.createElement("span", { className: styles.indicator }, isOpen ? React.createElement(ChevronDown, null) : React.createElement(ChevronDown, { rotation: 270 }))))),
         React.createElement("div", { className: collapsible ? contentClassNames : styles.content, style: { paddingLeft: !label ? 0 : '16px' } }, React.Children.map(children, (child) => {
             if (React.isValidElement(child)) {
-                return React.cloneElement(child, {
-                    bulletClassName: classNames(styles.bullet, child.props.bulletClassName || bulletClassName),
-                    customBullet: child.props.customBullet !== undefined
-                        ? child.props.customBullet
-                        : customItemBullet !== undefined
-                            ? customItemBullet
-                            : customBullet,
-                    withCheckbox: child.props.withCheckbox !== undefined ? child.props.withCheckbox : withCheckbox,
-                    checkboxFilled: child.props.checkboxFilled !== undefined ? child.props.checkboxFilled : checkboxFilled,
-                    withRadioButton: child.props.withRadioButton !== undefined ? child.props.withRadioButton : withRadioButton,
-                    onCheck: handleChildCheck,
-                    onRadioSelect: handleChildRadioSelect,
-                    parentChecked: isChecked,
-                    selected: child.props.selected,
+                const commonProps = {
                     style: child.props.style || style,
                     className: child.props.className,
-                });
+                };
+                if (child.type === ListItem || child.type === List) {
+                    return React.cloneElement(child, Object.assign(Object.assign({}, commonProps), { bulletClassName: classNames(styles.bullet, child.props.bulletClassName || bulletClassName), customBullet: child.props.customBullet !== undefined
+                            ? child.props.customBullet
+                            : customItemBullet !== undefined
+                                ? customItemBullet
+                                : customBullet, withCheckbox: child.props.withCheckbox !== undefined ? child.props.withCheckbox : withCheckbox, checkboxFilled: child.props.checkboxFilled !== undefined ? child.props.checkboxFilled : checkboxFilled, withRadioButton: child.props.withRadioButton !== undefined ? child.props.withRadioButton : withRadioButton, onCheck: handleChildCheck, onRadioSelect: handleChildRadioSelect, parentChecked: isChecked, selected: child.props.selected }));
+                }
+                return React.cloneElement(child, commonProps);
             }
             return child;
         }))));

package/dist/types/index.d.ts

@@ -649,6 +649,8 @@ export interface LinkProps {
     className?: string;
     /** Стили передаваемые напрямую */
     style?: CSSProperties;
+    /** Стили текста */
+    contentStyle?: CSSProperties;
     /**Подчеркивание */
     underline?: 'hover' | 'underline' | 'none';
     /** Вариант шрифта */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kamotive_ui",
-  "version": "1.2.28",
+  "version": "1.2.29",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [