@cloud-ru/uikit-product-site-banner 0.3.13 → 0.3.14

package/dist/cjs/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./components"), exports);

package/dist/cjs/types.d.ts

@@ -0,0 +1,3 @@
+export type BetterOmit<Type, Prop> = {
+    [Property in keyof Type as Exclude<Property, Prop>]: Type[Property];
+};

package/dist/cjs/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/esm/components/BannerPrimary/BannerPrimary.d.ts

@@ -0,0 +1,11 @@
+import { TagSpecialProps } from '@sbercloud/uikit-product-site-tag';
+import { BannerCommonProps } from '../../helperComponents/BannerCommon';
+import { BetterOmit } from '../../types';
+export type BannerPrimaryProps = BetterOmit<BannerCommonProps, 'sizes'> & {
+    imgType: 'rectangle' | 'square';
+    /** Дата окончания действия */
+    expirationDate?: string;
+    /** Тэги */
+    tags?: TagSpecialProps[];
+};
+export declare function BannerPrimary({ tags, imgType, layoutType, expirationDate, ...props }: BannerPrimaryProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/BannerPrimary/BannerPrimary.js

@@ -0,0 +1,27 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TagSpecial } from '@sbercloud/uikit-product-site-tag';
+import { LAYOUT_TYPE } from '@sbercloud/uikit-product-utils';
+import { PromoTag } from '@snack-uikit/promo-tag';
+import { BannerCommon } from '../../helperComponents/BannerCommon';
+import styles from './styles.module.css';
+const IMAGE_SIZE = {
+    [LAYOUT_TYPE.Desktop]: { rectangle: [396, 272], square: [272, 272] },
+    [LAYOUT_TYPE.DesktopSmall]: { rectangle: [396, 272], square: [272, 272] },
+    [LAYOUT_TYPE.Tablet]: { rectangle: [396, 272], square: [272, 272] },
+    [LAYOUT_TYPE.Mobile]: { rectangle: [360, 247], square: [272, 272] },
+};
+export function BannerPrimary(_a) {
+    var { tags, imgType, layoutType, expirationDate } = _a, props = __rest(_a, ["tags", "imgType", "layoutType", "expirationDate"]);
+    return (_jsx(BannerCommon, Object.assign({ sizes: { image: IMAGE_SIZE[layoutType][imgType], mainGap: layoutType === 'mobile' ? 24 : 32 }, layoutType: layoutType, topSlot: (tags || expirationDate) && (_jsxs("div", { className: styles.tags, children: [expirationDate && (_jsx(PromoTag, { size: 'xs', text: `Действует до ${expirationDate}`, appearance: 'neutral', color: 'decor' })), tags === null || tags === void 0 ? void 0 : tags.map((props, index) => (_jsx(TagSpecial, Object.assign({}, props), index)))] })) }, props)));
+}

package/dist/esm/components/BannerPrimary/index.d.ts

@@ -0,0 +1 @@
+export * from './BannerPrimary';

package/dist/esm/components/BannerPrimary/index.js

@@ -0,0 +1 @@
+export * from './BannerPrimary';

package/dist/esm/components/BannerPrimary/styles.module.css

@@ -0,0 +1,5 @@
+.tags{
+  display:flex;
+  flex-wrap:wrap;
+  gap:4px;
+}

package/dist/esm/components/BannerSecondary/BannerSecondary.d.ts

@@ -0,0 +1,4 @@
+import { BannerCommonProps } from '../../helperComponents/BannerCommon';
+import { BetterOmit } from '../../types';
+export type BannerSecondaryProps = BetterOmit<BannerCommonProps, 'topSlot' | 'sizes'>;
+export declare function BannerSecondary(props: BannerSecondaryProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/BannerSecondary/BannerSecondary.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { BannerCommon } from '../../helperComponents/BannerCommon';
+const IMAGE_SIZE = [303, 208];
+const getGapValue = (layouType) => (layouType === 'tablet' ? 32 : 24);
+export function BannerSecondary(props) {
+    return (_jsx(BannerCommon, Object.assign({ topSlot: null, sizes: { image: IMAGE_SIZE, mainGap: getGapValue(props.layoutType) } }, props)));
+}

package/dist/esm/components/BannerSecondary/index.d.ts

@@ -0,0 +1 @@
+export * from './BannerSecondary';

package/dist/esm/components/BannerSecondary/index.js

@@ -0,0 +1 @@
+export * from './BannerSecondary';

package/dist/esm/components/BannerTertiary/BannerTertiary.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+import { ButtonPromoProps } from '@sbercloud/uikit-product-button-predefined';
+import { EridProps } from '@sbercloud/uikit-product-site-tag';
+import { WithLayoutType, WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { ColorWrapperProps } from '../../helperComponents/ColorWrapper';
+export type BannerTertiaryProps = WithSupportProps<WithLayoutType<{
+    /** id компонента */
+    id?: string;
+    /** Заголовок */
+    title: string;
+    /** Описание */
+    description?: string;
+    /** Кнопка */
+    button?: Omit<ButtonPromoProps, 'size' | 'appearance'>;
+    /** Ссылка на картинку */
+    img: string;
+    /** элемент в правом верхнем углу */
+    topRightCornerSlot?: ReactNode;
+    /** Плашка рекламы с tooltip */
+    erid?: Pick<EridProps, 'tip'>;
+    /** css-класс */
+    className?: string;
+}> & ColorWrapperProps>;
+export declare function BannerTertiary({ layoutType, title, description, img, button, erid, className, topRightCornerSlot, ...rest }: BannerTertiaryProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/BannerTertiary/BannerTertiary.js

@@ -0,0 +1,31 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import cn from 'classnames';
+import { ButtonPromo } from '@sbercloud/uikit-product-button-predefined';
+import { RichText } from '@sbercloud/uikit-product-site-rich-text';
+import { Erid } from '@sbercloud/uikit-product-site-tag';
+import { LAYOUT_TYPE } from '@sbercloud/uikit-product-utils';
+import { Typography } from '@snack-uikit/typography';
+import { ColorWrapper } from '../../helperComponents/ColorWrapper';
+import styles from './styles.module.css';
+const MAP_LAYOUT_TO_TEXT_SIZE = {
+    [LAYOUT_TYPE.Desktop]: 'l',
+    [LAYOUT_TYPE.DesktopSmall]: 'l',
+    [LAYOUT_TYPE.Tablet]: 'l',
+    [LAYOUT_TYPE.Mobile]: 'm',
+};
+export function BannerTertiary(_a) {
+    var { layoutType, title, description, img, button, erid, className, topRightCornerSlot } = _a, rest = __rest(_a, ["layoutType", "title", "description", "img", "button", "erid", "className", "topRightCornerSlot"]);
+    const isMobile = layoutType === 'mobile';
+    return (_jsxs(ColorWrapper, Object.assign({}, rest, { className: cn(className, styles.root), "data-layout-type": layoutType, children: [(topRightCornerSlot || erid) && (_jsxs("div", { className: styles.topRightCorner, children: [erid && (_jsx(Erid, { className: styles.erid, tip: erid.tip, appearance: ColorWrapper.getEridAppearance(rest.appearance) })), topRightCornerSlot] })), _jsxs("div", { className: styles.content, children: [_jsx("img", { className: styles.image, src: img, alt: title }), _jsxs("div", { "data-color-wrapper-role": 'text', className: styles.texts, children: [_jsx(Typography, { size: MAP_LAYOUT_TO_TEXT_SIZE[layoutType], className: styles.title, purpose: 'title', family: 'sans', children: _jsx(RichText, { richText: title }) }), _jsx(Typography, { size: MAP_LAYOUT_TO_TEXT_SIZE[layoutType], className: styles.description, purpose: 'body', family: 'sans', children: _jsx(RichText, { richText: description }) })] }), _jsx(ButtonPromo, Object.assign({ target: '_self' }, button, { size: 'l', appearance: ColorWrapper.getButtonAppearance(rest.appearance), fullWidth: isMobile }))] })] })));
+}

package/dist/esm/components/BannerTertiary/index.d.ts

@@ -0,0 +1 @@
+export * from './BannerTertiary';

package/dist/esm/components/BannerTertiary/index.js

@@ -0,0 +1 @@
+export * from './BannerTertiary';

package/dist/esm/components/BannerTertiary/styles.module.css

@@ -0,0 +1,36 @@
+.root{
+  position:relative;
+}
+
+.topRightCorner{
+  position:absolute;
+  top:0;
+  right:0;
+  display:flex;
+  align-items:center;
+  gap:4px;
+}
+
+.content{
+  gap:16px;
+  padding:16px;
+  display:flex;
+  flex-direction:row;
+  align-items:center;
+}
+[data-layout-type=mobile] .content{
+  flex-direction:column;
+}
+
+.image{
+  max-width:105px;
+  max-height:72px;
+}
+
+.texts{
+  display:flex;
+  flex:1 1 auto;
+  flex-direction:column;
+  align-self:stretch;
+  gap:4px;
+}

package/dist/esm/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from './BannerPrimary';
+export * from './BannerSecondary';
+export * from './BannerTertiary';

package/dist/esm/components/index.js

@@ -0,0 +1,3 @@
+export * from './BannerPrimary';
+export * from './BannerSecondary';
+export * from './BannerTertiary';

package/dist/esm/helperComponents/BannerCommon/BannerCommon.d.ts

@@ -0,0 +1,31 @@
+import { ReactNode } from 'react';
+import { ButtonPromoOutlineProps, ButtonPromoProps } from '@sbercloud/uikit-product-button-predefined';
+import { EridProps } from '@sbercloud/uikit-product-site-tag';
+import { WithLayoutType, WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { ColorWrapperProps } from '../ColorWrapper';
+export type BannerCommonProps = WithSupportProps<WithLayoutType<{
+    /** id компонента */
+    id?: string;
+    /** Заголовок*/
+    title: string;
+    /** Описание*/
+    description?: string;
+    /** Ссылка на картинку */
+    img: string;
+    /** Массив с настройками кнопок ButtonFilled */
+    buttons?: [Omit<ButtonPromoProps, 'size' | 'appearance'>, Omit<ButtonPromoOutlineProps, 'size' | 'appearance'>?];
+    /** CSS-класс */
+    className?: string;
+    /** Плашка рекламы с tooltip */
+    erid?: Pick<EridProps, 'tip' | 'appearance'>;
+    /** Слот под контент */
+    topSlot?: ReactNode;
+    /** Размеры */
+    sizes: {
+        /** Размеры картинки */
+        image: [number, number];
+        /** Отступ между текстом и кнопками */
+        mainGap: number;
+    };
+} & ColorWrapperProps>>;
+export declare function BannerCommon({ id, title, description, img, erid, buttons, layoutType, className, topSlot, sizes: { image: [maxImageWith, maxImageHeight], mainGap, }, ...rest }: BannerCommonProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/helperComponents/BannerCommon/BannerCommon.js

@@ -0,0 +1,28 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import cn from 'classnames';
+import { ButtonPromo, ButtonPromoOutline, } from '@sbercloud/uikit-product-button-predefined';
+import { RichText } from '@sbercloud/uikit-product-site-rich-text';
+import { Erid } from '@sbercloud/uikit-product-site-tag';
+import { Typography } from '@snack-uikit/typography';
+import { ColorWrapper } from '../ColorWrapper';
+import styles from './styles.module.css';
+import { getBlockTitleProps } from './util';
+export function BannerCommon(_a) {
+    var { id, title, description, img, erid, buttons, layoutType, className, topSlot, sizes: { image: [maxImageWith, maxImageHeight], mainGap, } } = _a, rest = __rest(_a, ["id", "title", "description", "img", "erid", "buttons", "layoutType", "className", "topSlot", "sizes"]);
+    return (_jsxs(ColorWrapper, Object.assign({ id: id, className: cn(styles.root, className), "data-layout-type": layoutType, style: {
+            '--site-banner-main-gap': `${mainGap}px`,
+            '--site-banner-image-max-width': `${maxImageWith}px`,
+            '--site-banner-image-max-height': `${maxImageHeight}px`,
+        } }, rest, { children: [erid && _jsx(Erid, { className: styles.erid, tip: erid.tip, appearance: erid.appearance }), _jsxs("div", { className: styles.content, children: [topSlot, _jsxs("div", { "data-color-wrapper-role": 'text', className: styles.text, children: [_jsx(Typography, Object.assign({ className: styles.title, family: 'sans' }, getBlockTitleProps(layoutType), { children: _jsx(RichText, { richText: title }) })), _jsx(Typography.SansBodyL, { className: styles.description, children: _jsx(RichText, { richText: description }) })] }), buttons && buttons.length > 0 && (_jsxs("div", { className: styles.buttons, children: [_jsx(ButtonPromo, Object.assign({ className: styles.button, target: '_self' }, buttons[0], { size: 'l', appearance: ColorWrapper.getButtonAppearance(rest.appearance) })), (buttons === null || buttons === void 0 ? void 0 : buttons.length) > 1 && (_jsx(ButtonPromoOutline, Object.assign({ className: styles.button, target: '_self' }, buttons[1], { size: 'l', appearance: ColorWrapper.getButtonAppearance(rest.appearance) })))] }))] }), _jsx("div", { className: styles.imgWrapper, children: _jsx("img", { className: styles.img, src: img, alt: title }) })] })));
+}

package/dist/esm/helperComponents/BannerCommon/constants.d.ts

@@ -0,0 +1,11 @@
+export declare const Appearance: {
+    readonly Decor: "decor";
+    readonly Brand: "brand";
+    readonly Graphite: "graphite";
+};
+export declare const Color: {
+    readonly Neutral: "neutral";
+    readonly White: "white";
+    readonly Violet: "violet";
+    readonly Blue: "blue";
+};

package/dist/esm/helperComponents/BannerCommon/constants.js

@@ -0,0 +1,11 @@
+export const Appearance = {
+    Decor: 'decor',
+    Brand: 'brand',
+    Graphite: 'graphite',
+};
+export const Color = {
+    Neutral: 'neutral',
+    White: 'white',
+    Violet: 'violet',
+    Blue: 'blue',
+};

package/dist/esm/helperComponents/BannerCommon/index.d.ts

@@ -0,0 +1 @@
+export * from './BannerCommon';

package/dist/esm/helperComponents/BannerCommon/index.js

@@ -0,0 +1 @@
+export * from './BannerCommon';

package/dist/esm/helperComponents/BannerCommon/styles.module.css

@@ -0,0 +1,81 @@
+.content{
+  display:flex;
+  flex-direction:column;
+  gap:var(--site-banner-main-gap);
+  padding:32px;
+}
+
+.title,
+.description{
+  word-break:break-word;
+}
+
+.text{
+  display:flex;
+  flex-direction:column;
+  gap:12px;
+}
+
+.buttons{
+  display:flex;
+  margin-top:auto;
+  gap:16px;
+}
+
+.img{
+  width:100%;
+  max-width:var(--site-banner-image-max-width);
+  max-height:var(--site-banner-image-max-height);
+  flex-shrink:0;
+}
+.imgWrapper{
+  width:100%;
+  display:flex;
+  justify-content:center;
+  align-items:center;
+}
+
+.erid{
+  position:absolute;
+  right:2px;
+  top:2px;
+}
+
+.root{
+  position:relative;
+  display:grid;
+  grid-template-columns:1fr var(--site-banner-image-max-width);
+}
+.root[data-layout-type=tablet]{
+  display:flex;
+  flex-direction:column;
+}
+.root[data-layout-type=tablet] .content{
+  padding:24px;
+}
+.root[data-layout-type=tablet] .text{
+  gap:8px;
+}
+.root[data-layout-type=tablet] .buttons{
+  flex-direction:column;
+}
+.root[data-layout-type=tablet] .button{
+  width:100%;
+}
+.root[data-layout-type=mobile]{
+  display:flex;
+  flex-direction:column;
+}
+.root[data-layout-type=mobile] .content{
+  padding:16px;
+}
+.root[data-layout-type=mobile] .text{
+  gap:4px;
+}
+.root[data-layout-type=mobile] .buttons{
+  flex-direction:column;
+  gap:8px;
+}
+.root[data-layout-type=mobile] .button{
+  width:100%;
+}

package/dist/esm/helperComponents/BannerCommon/types.d.ts

@@ -0,0 +1,13 @@
+import { ValueOf } from '@snack-uikit/utils';
+import { Appearance, Color } from './constants';
+type ColorType = ValueOf<typeof Color>;
+export type AppearanceType = ValueOf<typeof Appearance>;
+export type WithColor = {
+    appearance: Exclude<AppearanceType, 'brand' | 'graphite'>;
+    color?: ColorType;
+};
+export type WithoutColor = {
+    appearance: Exclude<AppearanceType, 'decor'>;
+    color?: never;
+};
+export {};

package/dist/esm/helperComponents/BannerCommon/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/helperComponents/BannerCommon/util.d.ts

@@ -0,0 +1,3 @@
+import { LayoutType } from '@sbercloud/uikit-product-utils';
+import { TypographyProps } from '@snack-uikit/typography';
+export declare const getBlockTitleProps: (layoutType: LayoutType) => Pick<TypographyProps, "purpose" | "size">;

package/dist/esm/helperComponents/BannerCommon/util.js

@@ -0,0 +1,19 @@
+export const getBlockTitleProps = (layoutType) => {
+    switch (layoutType) {
+        case 'mobile':
+            return {
+                purpose: 'title',
+                size: 'm',
+            };
+        case 'tablet':
+            return {
+                purpose: 'title',
+                size: 'l',
+            };
+        default:
+            return {
+                purpose: 'headline',
+                size: 'm',
+            };
+    }
+};

package/dist/esm/helperComponents/ColorWrapper/ColorWrapper.d.ts

@@ -0,0 +1,15 @@
+import { DetailedHTMLProps, HTMLAttributes, PropsWithChildren } from 'react';
+import { ButtonPromoProps } from '@sbercloud/uikit-product-button-predefined';
+import { EridProps } from '@sbercloud/uikit-product-site-tag';
+import { WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { AppearanceType, WithColor, WithoutColor } from '../BannerCommon/types';
+type DivProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
+export type ColorWrapperProps = PropsWithChildren<WithSupportProps<{
+    className?: string;
+} & (WithColor | WithoutColor)>>;
+export declare function ColorWrapper({ id, className, children, color, appearance, ...other }: ColorWrapperProps & DivProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ColorWrapper {
+    var getButtonAppearance: (appearance: AppearanceType) => ButtonPromoProps["appearance"];
+    var getEridAppearance: (appearance: AppearanceType) => EridProps["appearance"];
+}
+export {};

package/dist/esm/helperComponents/ColorWrapper/ColorWrapper.js

@@ -0,0 +1,20 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import cn from 'classnames';
+import styles from './styles.module.css';
+export function ColorWrapper(_a) {
+    var { id, className, children, color, appearance } = _a, other = __rest(_a, ["id", "className", "children", "color", "appearance"]);
+    return (_jsx("div", Object.assign({ id: id, "data-appearance": appearance, "data-color": color, className: cn(styles.root, className) }, other, { children: children })));
+}
+ColorWrapper.getButtonAppearance = (appearance) => appearance !== 'graphite' ? 'secondary' : 'tertiary';
+ColorWrapper.getEridAppearance = (appearance) => appearance === 'graphite' ? 'invert-neutral' : 'neutral';

package/dist/esm/helperComponents/ColorWrapper/index.d.ts

@@ -0,0 +1 @@
+export * from './ColorWrapper';

package/dist/esm/helperComponents/ColorWrapper/index.js

@@ -0,0 +1 @@
+export * from './ColorWrapper';

package/dist/esm/helperComponents/ColorWrapper/styles.module.css

@@ -0,0 +1,28 @@
+.root{
+  background-color:var(--sys-neutral-background, #eeeff3);
+}
+.root[data-color=neutral][data-appearance=decor]{
+  background-color:var(--sys-neutral-background, #eeeff3);
+}
+.root[data-color=white][data-appearance=decor]{
+  background-color:var(--sys-neutral-background1-level, #fdfdfd);
+}
+.root[data-color=violet][data-appearance=decor]{
+  background-color:var(--sys-violet-background, #f7f3ff);
+}
+.root[data-color=blue][data-appearance=decor]{
+  background-color:var(--sys-blue-background, #eef4fd);
+}
+.root[data-appearance=graphite]{
+  background-color:var(--sys-graphite-accent-default, #222222);
+}
+.root[data-appearance=graphite] [data-color-wrapper-role=text]{
+  color:var(--sys-invert-neutral-text-main, #e6e8ef);
+}
+.root[data-appearance=brand]{
+  background-color:var(--sys-primary-accent-default, #26d07c);
+}
+
+[data-color-wrapper-role=text]{
+  color:var(--sys-graphite-text-main, #222222);
+}

package/dist/esm/index.d.ts

@@ -0,0 +1 @@
+export * from './components';

package/dist/esm/index.js

@@ -0,0 +1 @@
+export * from './components';

package/dist/esm/types.d.ts

@@ -0,0 +1,3 @@
+export type BetterOmit<Type, Prop> = {
+    [Property in keyof Type as Exclude<Property, Prop>]: Type[Property];
+};

package/dist/esm/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloud-ru/uikit-product-site-banner",
   "title": "Site Banner",
-  "version": "0.3.13",
+  "version": "0.3.14",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -30,20 +30,21 @@
     "name": "Akhremenko Grigorii",
     "url": "https://github.com/AGrigorii"
   },
+  "contributors": [],
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public"
   },
   "scripts": {},
   "dependencies": {
-    "@cloud-ru/uikit-product-button-predefined": "0.7.4",
-    "@cloud-ru/uikit-product-site-rich-text": "0.2.10",
-    "@cloud-ru/uikit-product-site-tag": "0.3.10",
-    "@cloud-ru/uikit-product-utils": "7.0.0",
+    "@cloud-ru/uikit-product-button-predefined": "0.7.5",
+    "@cloud-ru/uikit-product-site-rich-text": "0.2.11",
+    "@cloud-ru/uikit-product-site-tag": "0.3.11",
+    "@cloud-ru/uikit-product-utils": "7.0.1",
     "@snack-uikit/promo-tag": "0.7.1",
     "@snack-uikit/typography": "0.8.4",
     "@snack-uikit/utils": "3.7.0",
     "classnames": "2.5.1"
   },
-  "gitHead": "e8bd79bc92b26a8f52611972eec98a867536ccd3"
+  "gitHead": "9c11b1e33e716c874534a1c162266c8591f2ed03"
 }