@snack-uikit/alert 0.12.1 → 0.13.1-preview-93df0b94.0

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 0.13.0 (2024-08-02)
+
+
+### Bug Fixes
+
+* **FF-3788:** updated typescript to v5 ([89e3338](https://github.com/cloud-ru-tech/snack-uikit/commit/89e3338a3ef4df24e4c20d9a9c8cd16e7934ba63))
+
+
+### BREAKING CHANGES
+
+
+* **PDS-349:** link property external deleted ([fe15016](https://github.com/cloud-ru-tech/snack-uikit/commit/fe150162c9a6bdec5d43dabe1e1a8296ddbe0cd4))
+
+
+
+
 ## 0.12.1 (2024-07-29)
 
 

package/README.md

@@ -58,7 +58,7 @@ import { InfoFilledSVG } from '@snack-uikit/icons';
 | icon | `boolean` | true | Отображать иконку |
 | title | `string` | - | Заголовок |
 | truncate | `{ title?: number; }` | '{ <br>title: 1 }' | Максимальное кол-во строк <br> - `title` - в заголовке |
-| link | `Pick<LinkProps, "text" \| "target" \| "onClick" \| "href" \| "appearance" \| "external">` | - | Cсылка |
+| link | `Pick<LinkProps, "text" \| "target" \| "onClick" \| "href" \| "appearance">` | - | Cсылка |
 | onClose | `() => void` | - | Колбек закрытия |
 | appearance | enum Appearance: `"neutral"`, `"primary"`, `"error"`, `"warning"`, `"success"`, `"info"` | neutral | Внешний вид |
 | outline | `boolean` | - | Внешний бордер |
@@ -74,7 +74,7 @@ import { InfoFilledSVG } from '@snack-uikit/icons';
 | icon | `boolean` | true | Отображать иконку |
 | title | `string` | - | Заголовок |
 | truncate | `{ title?: number; }` | '{ <br>title: 1 }' | Максимальное кол-во строк <br> - `title` - в заголовке |
-| link | `Pick<LinkProps, "text" \| "target" \| "onClick" \| "href" \| "appearance" \| "external">` | - | Cсылка |
+| link | `Pick<LinkProps, "text" \| "target" \| "onClick" \| "href" \| "appearance">` | - | Cсылка |
 | action | `AlertButtonProps` | - | Кнопка дополнительного действия |
 | onClose | `() => void` | - | Колбек закрытия |
 | appearance | enum Appearance: `"neutral"`, `"primary"`, `"error"`, `"warning"`, `"success"`, `"info"` | neutral | Внешний вид |

package/dist/components/Alert/Alert.d.ts

@@ -19,7 +19,7 @@ export type AlertProps = WithSupportProps<{
     /** Описание */
     description: ReactNode;
     /** Cсылка */
-    link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance' | 'external'>;
+    link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance'>;
     /** Колбек закрытия */
     onClose?: () => void;
     /** Внешний вид */

package/dist/components/Alert/Alert.js

@@ -15,7 +15,7 @@ import { CrossSVG } from '@snack-uikit/icons';
 import { Link } from '@snack-uikit/link';
 import { TruncateString } from '@snack-uikit/truncate-string';
 import { extractSupportProps } from '@snack-uikit/utils';
-import { APPEARANCE, APPEARANCE_TO_COLOR_MAP } from '../../constants';
+import { APPEARANCE, APPEARANCE_TO_COLOR_MAP, APPEARANCE_TO_LINK_COLOR_MAP } from '../../constants';
 import { AlertButton } from '../../helperComponents';
 import { getIcon } from '../../utils';
 import styles from './styles.module.css';
@@ -27,5 +27,5 @@ export function Alert(_a) {
     var { icon = true, title, truncate, link, description, onClose, appearance = APPEARANCE.Neutral, className, actions, outline, size = 'm' } = _a, rest = __rest(_a, ["icon", "title", "truncate", "link", "description", "onClose", "appearance", "className", "actions", "outline", "size"]);
     return (_jsxs("div", Object.assign({ className: cn(styles.alert, {
             [styles.alertOutline]: outline,
-        }, className) }, extractSupportProps(rest), { "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-size": size, children: [_jsxs("div", { className: styles.body, "data-size": size, children: [icon && (_jsx("div", { className: styles.icon, "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-test-id": 'alert__icon', "data-size": size, children: getIcon(appearance, size === 's' ? 16 : 24) })), _jsxs("div", { className: styles.contentLayout, children: [title && (_jsx(TruncateString, { text: title, maxLines: (_b = truncate === null || truncate === void 0 ? void 0 : truncate.title) !== null && _b !== void 0 ? _b : 1, className: styles.title, "data-test-id": 'alert__title', "data-size": size })), _jsx("span", { "data-test-id": 'alert__description', className: styles.description, "data-size": size, children: description }), link && (_jsx("span", { children: _jsx(Link, Object.assign({ external: true }, link, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], textMode: 'default', size: size, "data-test-id": 'alert__link' })) }))] }), onClose && (_jsx(AlertButton, { onClick: onClose, appearance: APPEARANCE_TO_COLOR_MAP[appearance], icon: _jsx(CrossSVG, {}), variant: 'simple', dataTestId: 'alert__close-button' }))] }), actions && (_jsxs("div", { className: styles.footer, "data-size": size, children: [actions.primary && (_jsx(AlertButton, Object.assign({}, actions.primary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size }))), (actions === null || actions === void 0 ? void 0 : actions.secondary) && (_jsx(AlertButton, Object.assign({}, actions.secondary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size })))] }))] })));
+        }, className) }, extractSupportProps(rest), { "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-size": size, children: [_jsxs("div", { className: styles.body, "data-size": size, children: [icon && (_jsx("div", { className: styles.icon, "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-test-id": 'alert__icon', "data-size": size, children: getIcon(appearance, size === 's' ? 16 : 24) })), _jsxs("div", { className: styles.contentLayout, children: [title && (_jsx(TruncateString, { text: title, maxLines: (_b = truncate === null || truncate === void 0 ? void 0 : truncate.title) !== null && _b !== void 0 ? _b : 1, className: styles.title, "data-test-id": 'alert__title', "data-size": size })), _jsx("span", { "data-test-id": 'alert__description', className: styles.description, "data-size": size, children: description }), link && (_jsx("span", { children: _jsx(Link, Object.assign({}, link, { appearance: APPEARANCE_TO_LINK_COLOR_MAP[appearance], textMode: 'default', size: size, "data-test-id": 'alert__link' })) }))] }), onClose && (_jsx(AlertButton, { onClick: onClose, appearance: APPEARANCE_TO_COLOR_MAP[appearance], icon: _jsx(CrossSVG, {}), variant: 'simple', dataTestId: 'alert__close-button' }))] }), actions && (_jsxs("div", { className: styles.footer, "data-size": size, children: [actions.primary && (_jsx(AlertButton, Object.assign({}, actions.primary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size }))), (actions === null || actions === void 0 ? void 0 : actions.secondary) && (_jsx(AlertButton, Object.assign({}, actions.secondary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size })))] }))] })));
 }

package/dist/components/AlertTop/AlertTop.d.ts

@@ -19,7 +19,7 @@ export type AlertTopProps = WithSupportProps<{
     /** Описание */
     description: ReactNode;
     /** Cсылка */
-    link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance' | 'external'>;
+    link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance'>;
     /** Кнопка дополнительного действия */
     action?: AlertButtonProps;
     /** Колбек закрытия */

package/dist/components/AlertTop/AlertTop.js

@@ -26,5 +26,5 @@ import styles from './styles.module.css';
 export function AlertTop(_a) {
     var _b;
     var { icon = true, title, description, link, onClose, truncate, appearance = APPEARANCE.Neutral, action, className } = _a, rest = __rest(_a, ["icon", "title", "description", "link", "onClose", "truncate", "appearance", "action", "className"]);
-    return (_jsxs("div", Object.assign({ className: cn(styles.alertTop, className) }, extractSupportProps(rest), { "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], children: [_jsxs("div", { className: styles.contentWrapper, children: [icon && (_jsx("div", { className: styles.icon, "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], "data-test-id": 'alert-top__icon', children: getIcon(appearance, 24) })), _jsxs("div", { className: styles.contentLayout, children: [_jsxs("div", { className: styles.textLayout, children: [title && (_jsx("div", { className: styles.title, "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], "data-test-id": 'alert-top__title', children: _jsx(TruncateString, { text: title, maxLines: (_b = truncate === null || truncate === void 0 ? void 0 : truncate.title) !== null && _b !== void 0 ? _b : 1 }) })), _jsx("span", { className: styles.description, "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], "data-test-id": 'alert-top__description', children: description })] }), link && (_jsx("span", { children: _jsx(Link, Object.assign({ external: true }, link, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], textMode: 'on-accent', size: 'm', "data-test-id": 'alert-top__link' })) }))] })] }), _jsxs("div", { className: styles.actions, children: [action && _jsx(AlertButton, Object.assign({}, action, { appearance: APPEARANCE_TO_COLOR_MAP_INVERT[appearance], variant: 'tonal' })), onClose && (_jsx(AlertButton, { onClick: onClose, appearance: APPEARANCE_TO_COLOR_MAP_INVERT[appearance], icon: _jsx(CrossSVG, {}), variant: 'tonal', dataTestId: 'alert-top__close-button' }))] })] })));
+    return (_jsxs("div", Object.assign({ className: cn(styles.alertTop, className) }, extractSupportProps(rest), { "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], children: [_jsxs("div", { className: styles.contentWrapper, children: [icon && (_jsx("div", { className: styles.icon, "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], "data-test-id": 'alert-top__icon', children: getIcon(appearance, 24) })), _jsxs("div", { className: styles.contentLayout, children: [_jsxs("div", { className: styles.textLayout, children: [title && (_jsx("div", { className: styles.title, "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], "data-test-id": 'alert-top__title', children: _jsx(TruncateString, { text: title, maxLines: (_b = truncate === null || truncate === void 0 ? void 0 : truncate.title) !== null && _b !== void 0 ? _b : 1 }) })), _jsx("span", { className: styles.description, "data-color": APPEARANCE_TO_COLOR_MAP_INVERT[appearance], "data-test-id": 'alert-top__description', children: description })] }), link && (_jsx("span", { children: _jsx(Link, Object.assign({}, link, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], textMode: 'on-accent', size: 'm', "data-test-id": 'alert-top__link' })) }))] })] }), _jsxs("div", { className: styles.actions, children: [action && _jsx(AlertButton, Object.assign({}, action, { appearance: APPEARANCE_TO_COLOR_MAP_INVERT[appearance], variant: 'tonal' })), onClose && (_jsx(AlertButton, { onClick: onClose, appearance: APPEARANCE_TO_COLOR_MAP_INVERT[appearance], icon: _jsx(CrossSVG, {}), variant: 'tonal', dataTestId: 'alert-top__close-button' }))] })] })));
 }

package/dist/constants.d.ts

@@ -13,3 +13,4 @@ export declare const SIZE: {
     readonly M: "m";
 };
 export declare const APPEARANCE_TO_COLOR_MAP: Record<ValueOf<typeof APPEARANCE>, LinkProps['appearance']>;
+export declare const APPEARANCE_TO_LINK_COLOR_MAP: Record<ValueOf<typeof APPEARANCE>, LinkProps['appearance']>;

package/dist/constants.js

@@ -18,3 +18,11 @@ export const APPEARANCE_TO_COLOR_MAP = {
     [APPEARANCE.Success]: 'green',
     [APPEARANCE.Info]: 'blue',
 };
+export const APPEARANCE_TO_LINK_COLOR_MAP = {
+    [APPEARANCE.Neutral]: 'primary',
+    [APPEARANCE.Primary]: 'primary',
+    [APPEARANCE.Error]: 'red',
+    [APPEARANCE.Warning]: 'yellow',
+    [APPEARANCE.Success]: 'green',
+    [APPEARANCE.Info]: 'blue',
+};

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Alert",
-  "version": "0.12.1",
+  "version": "0.13.1-preview-93df0b94.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -33,11 +33,11 @@
   "scripts": {},
   "dependencies": {
     "@snack-uikit/icons": "0.22.0",
-    "@snack-uikit/link": "0.12.4",
+    "@snack-uikit/link": "0.13.0",
     "@snack-uikit/loaders": "0.5.2",
     "@snack-uikit/truncate-string": "0.4.20",
     "@snack-uikit/utils": "3.3.0",
     "classnames": "2.3.2"
   },
-  "gitHead": "d1b1ac720c6ea300a6c8cc3b4765609899200af7"
+  "gitHead": "3f8cea2f1205605b31f27416fd444075f2373484"
 }

package/src/components/Alert/Alert.tsx

@@ -6,7 +6,7 @@ import { Link, LinkProps } from '@snack-uikit/link';
 import { TruncateString } from '@snack-uikit/truncate-string';
 import { extractSupportProps, WithSupportProps } from '@snack-uikit/utils';
 
-import { APPEARANCE, APPEARANCE_TO_COLOR_MAP } from '../../constants';
+import { APPEARANCE, APPEARANCE_TO_COLOR_MAP, APPEARANCE_TO_LINK_COLOR_MAP } from '../../constants';
 import { AlertButton, AlertButtonProps } from '../../helperComponents';
 import { Appearance, Size } from '../../types';
 import { getIcon } from '../../utils';
@@ -28,7 +28,7 @@ export type AlertProps = WithSupportProps<{
   /** Описание */
   description: ReactNode;
   /** Cсылка */
-  link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance' | 'external'>;
+  link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance'>;
   /** Колбек закрытия */
   onClose?: () => void;
   /** Внешний вид */
@@ -106,9 +106,8 @@ export function Alert({
           {link && (
             <span>
               <Link
-                external
                 {...link}
-                appearance={APPEARANCE_TO_COLOR_MAP[appearance]}
+                appearance={APPEARANCE_TO_LINK_COLOR_MAP[appearance]}
                 textMode='default'
                 size={size}
                 data-test-id='alert__link'

package/src/components/AlertTop/AlertTop.tsx

@@ -29,7 +29,7 @@ export type AlertTopProps = WithSupportProps<{
   /** Описание */
   description: ReactNode;
   /** Cсылка */
-  link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance' | 'external'>;
+  link?: Pick<LinkProps, 'text' | 'target' | 'onClick' | 'href' | 'appearance'>;
   /** Кнопка дополнительного действия */
   action?: AlertButtonProps;
   /** Колбек закрытия */
@@ -96,7 +96,6 @@ export function AlertTop({
           {link && (
             <span>
               <Link
-                external
                 {...link}
                 appearance={APPEARANCE_TO_COLOR_MAP[appearance]}
                 textMode='on-accent'

package/src/constants.ts

@@ -23,3 +23,12 @@ export const APPEARANCE_TO_COLOR_MAP: Record<ValueOf<typeof APPEARANCE>, LinkPro
   [APPEARANCE.Success]: 'green',
   [APPEARANCE.Info]: 'blue',
 } as const;
+
+export const APPEARANCE_TO_LINK_COLOR_MAP: Record<ValueOf<typeof APPEARANCE>, LinkProps['appearance']> = {
+  [APPEARANCE.Neutral]: 'primary',
+  [APPEARANCE.Primary]: 'primary',
+  [APPEARANCE.Error]: 'red',
+  [APPEARANCE.Warning]: 'yellow',
+  [APPEARANCE.Success]: 'green',
+  [APPEARANCE.Info]: 'blue',
+} as const;