@gravity-ui/page-constructor 3.16.0 → 4.0.0

package/build/cjs/models/constructor-items/blocks.d.ts

@@ -249,10 +249,6 @@ interface ContentLayoutBlockParams {
     textWidth?: ContentTextSize;
 }
 export interface ContentLayoutBlockProps extends ContentLayoutBlockParams {
-    /**
-     * @deprecated Use params on top level instead
-     */
-    properties?: ContentLayoutBlockParams;
     textContent: ContentBlockProps;
     fileContent?: FileLinkProps[];
 }

package/build/cjs/models/constructor-items/common.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties, ReactNode } from 'react';
 import { ButtonView, ButtonProps as UikitButtonProps } from '@gravity-ui/uikit';
 import { ThemeSupporting } from '../../utils/theme';
-import { AnalyticsEventsBase, ClassNameProps, PixelEventType } from '../common';
+import { AnalyticsEventsBase, ClassNameProps, PixelEventType, QAProps } from '../common';
 export declare enum AuthorType {
     Column = "column",
     Line = "line"
@@ -90,11 +90,10 @@ export interface ImageDeviceProps extends ImageInfoProps {
 }
 export type ImageProps = string | ImageObjectProps | ImageDeviceProps;
 export type ThemedImage = ThemeSupporting<ImageProps>;
-export interface BackgroundImageProps extends React.HTMLProps<HTMLDivElement>, Partial<ImageDeviceProps>, Partial<ImageObjectProps> {
+export interface BackgroundImageProps extends React.HTMLProps<HTMLDivElement>, Partial<ImageDeviceProps>, Partial<ImageObjectProps>, QAProps {
     style?: CSSProperties;
     imageClassName?: string;
     hide?: boolean;
-    qa?: string;
 }
 export interface MediaVideoProps extends AnalyticsEventsBase {
     src: string[];
@@ -327,12 +326,11 @@ export interface PriceDetailedProps extends CardBaseProps {
     foldable?: PriceFoldableDetailsProps;
     labelsDefaultText?: Record<PriceLabelColor, string>;
 }
-export interface AuthorProps {
+export interface AuthorProps extends QAProps {
     author: AuthorItem;
     className?: string;
     authorContainerClassName?: string;
     type?: AuthorType;
-    dataQa?: string;
 }
 export interface TitleProps {
     title?: TitleItemProps | string;

package/build/cjs/navigation/components/DesktopNavigation/DesktopNavigation.css

@@ -30,8 +30,8 @@ unpredictable css rules order in build */
 .pc-desktop-navigation__right {
   flex: 0;
   justify-content: flex-end;
-  font-size: var(--yc-text-body-2-font-size);
-  line-height: var(--yc-text-body-2-line-height);
+  font-size: var(--g-text-body-2-font-size);
+  line-height: var(--g-text-body-2-line-height);
 }
 .pc-desktop-navigation__navigation-container {
   display: flex;
@@ -65,8 +65,8 @@ unpredictable css rules order in build */
 }
 .pc-desktop-navigation__links {
   position: relative;
-  font-size: var(--yc-text-body-2-font-size);
-  line-height: var(--yc-text-body-2-line-height);
+  font-size: var(--g-text-body-2-font-size);
+  line-height: var(--g-text-body-2-line-height);
 }
 .pc-desktop-navigation__item {
   position: relative;

package/build/cjs/navigation/components/Logo/Logo.css

@@ -14,9 +14,9 @@ unpredictable css rules order in build */
   object-fit: contain;
 }
 .pc-logo__text {
-  font-size: var(--yc-text-header-1-font-size);
-  line-height: var(--yc-text-header-1-line-height);
+  font-size: var(--g-text-header-1-font-size);
+  line-height: var(--g-text-header-1-line-height);
   color: var(--pc-text-header-color);
-  font-weight: var(--yc-text-accent-font-weight);
+  font-weight: var(--g-text-accent-font-weight);
   white-space: nowrap;
 }

package/build/cjs/navigation/components/Logo/Logo.js

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const react_1 = tslib_1.__importDefault(require("react"));
 const components_1 = require("../../../components");
 const utils_1 = require("../../../components/Media/Image/utils");
 const RouterLink_1 = tslib_1.__importDefault(require("../../../components/RouterLink/RouterLink"));
-const ThemeValueContext_1 = require("../../../context/theme/ThemeValueContext");
+const theme_1 = require("../../../context/theme");
 const utils_2 = require("../../../utils");
 const b = (0, utils_2.block)('logo');
 const Logo = (props) => {
-    const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
+    const theme = (0, theme_1.useTheme)();
     const themedLogoProps = (0, utils_2.getThemedValue)(props, theme) || props;
     const imageData = (0, utils_1.getMediaImage)(themedLogoProps.icon || props.icon);
     const textData = themedLogoProps.text || props.text;

package/build/cjs/navigation/components/MobileNavigation/MobileNavigation.css

@@ -8,14 +8,14 @@ unpredictable css rules order in build */
   width: 100%;
   border-bottom-right-radius: var(--pc-border-radius);
   border-bottom-left-radius: var(--pc-border-radius);
-  background-color: var(--yc-color-base-background);
-  box-shadow: 0 3px 10px var(--yc-color-sfx-shadow);
+  background-color: var(--g-color-base-background);
+  box-shadow: 0 3px 10px var(--g-color-sfx-shadow);
   max-height: calc(100vh - 2 * var(--header-height));
   overflow-y: scroll;
   scrollbar-width: none;
   -ms-overflow-style: none;
-  font-size: var(--yc-text-body-2-font-size);
-  line-height: var(--yc-text-body-2-line-height);
+  font-size: var(--g-text-body-2-font-size);
+  line-height: var(--g-text-body-2-line-height);
 }
 .pc-mobile-navigation::-webkit-scrollbar {
   display: none;
@@ -53,11 +53,11 @@ unpredictable css rules order in build */
   flex-direction: column;
   min-width: 220px;
   padding: 16px;
-  border: 1px solid var(--yc-color-line-generic);
+  border: 1px solid var(--g-color-line-generic);
   border-top-width: 0;
   border-radius: calc(var(--pc-border-radius) / 2);
-  background: var(--yc-color-base-float);
-  box-shadow: 0 3px 10px var(--yc-color-sfx-shadow);
+  background: var(--g-color-base-float);
+  box-shadow: 0 3px 10px var(--g-color-sfx-shadow);
 }
 @media (min-width: 769px) {
   .pc-mobile-navigation__popup {

package/build/cjs/navigation/components/Navigation/Navigation.css

@@ -8,8 +8,8 @@ unpredictable css rules order in build */
   justify-content: center;
   align-items: center;
   height: var(--header-height);
-  background-color: var(--yc-color-base-background);
+  background-color: var(--g-color-base-background);
 }
 .pc-navigation_with-border {
-  box-shadow: inset 0 -1px 0 var(--yc-color-line-generic);
+  box-shadow: inset 0 -1px 0 var(--g-color-line-generic);
 }

package/build/cjs/navigation/components/NavigationItem/NavigationItem.css

@@ -13,7 +13,7 @@ unpredictable css rules order in build */
   outline: 2px solid #ffdb4d;
 }
 .pc-navigation-item__content:hover, .pc-navigation-item__content:active {
-  color: var(--yc-color-text-link);
+  color: var(--g-color-text-link);
 }
 .pc-navigation-item_menu-layout_desktop {
   height: var(--header-height);

package/build/cjs/navigation/components/NavigationItem/components/NavigationDropdown/NavigationDropdown.css

@@ -6,5 +6,5 @@
 }
 .pc-navigation-dropdown__arrow {
   margin-left: 7px;
-  color: var(--yc-color-text-secondary);
+  color: var(--g-color-text-secondary);
 }

package/build/cjs/navigation/components/NavigationItem/components/NavigationLink/NavigationLink.css

@@ -1,7 +1,7 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
 .pc-navigation-link {
-  color: var(--yc-color-text-primary);
+  color: var(--g-color-text-primary);
   color: inherit;
   text-decoration: none;
   outline: none;
@@ -14,7 +14,7 @@ unpredictable css rules order in build */
   outline: 2px solid #ffdb4d;
 }
 .pc-navigation-link:hover, .pc-navigation-link_active {
-  color: var(--yc-color-text-link);
+  color: var(--g-color-text-link);
 }
 .pc-navigation-link__arrow {
   position: relative;

package/build/cjs/navigation/components/NavigationPopup/NavigationPopup.css

@@ -8,11 +8,11 @@ unpredictable css rules order in build */
   flex-direction: column;
   min-width: 220px;
   padding: 16px;
-  border: 1px solid var(--yc-color-line-generic);
+  border: 1px solid var(--g-color-line-generic);
   border-top-width: 0;
   border-radius: calc(var(--pc-border-radius) / 2);
-  background: var(--yc-color-base-float);
-  box-shadow: 0 3px 10px var(--yc-color-sfx-shadow);
+  background: var(--g-color-base-float);
+  box-shadow: 0 3px 10px var(--g-color-sfx-shadow);
 }
 .pc-navigation-popup__list {
   margin: 0;
@@ -26,6 +26,6 @@ unpredictable css rules order in build */
   border-radius: 8px;
 }
 .pc-navigation-popup__link:hover {
-  color: var(--yc-color-text-primary);
-  background-color: var(--yc-color-base-simple-hover);
+  color: var(--g-color-text-primary);
+  background-color: var(--g-color-base-simple-hover);
 }

package/build/cjs/navigation/components/NavigationPopup/NavigationPopup.js

@@ -13,7 +13,7 @@ const NavigationPopup = ({ anchorRef, items, onClose, className, open, }) => (re
 // Workaround to recalculate position on every opening. Required for valid position calculation for scrolled header links.
 , { 
     // Workaround to recalculate position on every opening. Required for valid position calculation for scrolled header links.
-    anchorRef: open ? anchorRef : undefined, className: b(null, className), open: open, onClose: onClose, onOutsideClick: onClose, keepMounted: true, disablePortal: true, strategy: "fixed", placement: "bottom-start", offset: OFFSET_RESET },
+    anchorRef: open ? anchorRef : undefined, contentClassName: b(null, className), open: open, onClose: onClose, onOutsideClick: onClose, keepMounted: true, disablePortal: true, strategy: "fixed", placement: "bottom-start", offset: OFFSET_RESET },
     react_1.default.createElement("ul", { className: b('list') }, items.map((item) => (react_1.default.createElement(NavigationItem_1.default, { key: item.text, className: b('link'), data: item, menuLayout: models_1.NavigationLayout.Dropdown }))))));
 exports.NavigationPopup = NavigationPopup;
 exports.default = exports.NavigationPopup;

package/build/cjs/navigation/components/SocialIcon/SocialIcon.css

@@ -7,12 +7,12 @@ unpredictable css rules order in build */
   width: 40px;
   height: 40px;
   margin-right: 8px;
-  color: var(--yc-color-base-background);
+  color: var(--g-color-base-background);
   border-radius: 50%;
-  background-color: var(--yc-color-base-generic);
+  background-color: var(--g-color-base-generic);
 }
 .pc-social-icon:hover {
-  background-color: var(--yc-color-base-generic-hover);
+  background-color: var(--g-color-base-generic-hover);
 }
 .pc-social-icon__icon {
   width: 16px;

package/build/cjs/sub-blocks/BackgroundCard/BackgroundCard.css

@@ -4,10 +4,10 @@ unpredictable css rules order in build */
   position: relative;
 }
 .pc-background-card_theme_light {
-  background-color: var(--yc-color-promo-base-silver);
+  background-color: var(--pc-color-base-silver);
 }
 .pc-background-card_theme_dark {
-  background-color: var(--yc-color-promo-base-asphalt);
+  background-color: var(--pc-color-base-asphalt);
 }
 .pc-background-card_padding_s {
   padding-bottom: 80px;
@@ -39,8 +39,8 @@ unpredictable css rules order in build */
 }
 
 a.pc-background-card_theme_light {
-  background-color: var(--yc-color-promo-base-silver);
+  background-color: var(--pc-color-base-silver);
 }
 a.pc-background-card_theme_dark {
-  background-color: var(--yc-color-promo-base-asphalt);
+  background-color: var(--pc-color-base-asphalt);
 }

package/build/cjs/sub-blocks/BackgroundCard/BackgroundCard.js

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const react_1 = tslib_1.__importDefault(require("react"));
 const components_1 = require("../../components/");
-const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
+const theme_1 = require("../../context/theme");
 const utils_1 = require("../../utils");
 const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
 const b = (0, utils_1.block)('background-card');
 const BackgroundCard = (props) => {
     const { url, title, text, border, background, paddingBottom, backgroundColor, additionalInfo, theme: cardTheme = 'default', links, buttons, } = props;
-    const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
+    const theme = (0, theme_1.useTheme)();
     const hasBackgroundColor = backgroundColor || cardTheme !== 'default';
     const link = hasBackgroundColor || border === 'line' ? undefined : url;
     const borderType = hasBackgroundColor ? 'none' : border;

package/build/cjs/sub-blocks/BannerCard/BannerCard.css

@@ -6,28 +6,28 @@
 unpredictable css rules order in build */
 .pc-banner-card_theme_dark.pc-banner-card_theme_dark .pc-banner-card__title,
 .pc-banner-card_theme_dark.pc-banner-card_theme_dark .pc-banner-card__subtitle {
-  color: var(--yc-color-text-light-primary);
+  color: var(--g-color-text-light-primary);
 }
 .pc-banner-card_theme_dark.pc-banner-card_theme_dark .pc-banner-card__title p,
 .pc-banner-card_theme_dark.pc-banner-card_theme_dark .pc-banner-card__subtitle p {
-  color: var(--yc-color-text-light-primary);
+  color: var(--g-color-text-light-primary);
 }
 
 .pc-banner-card__title {
-  font-size: var(--yc-text-display-2-font-size);
-  line-height: var(--yc-text-display-2-line-height);
+  font-size: var(--g-text-display-2-font-size);
+  line-height: var(--g-text-display-2-line-height);
   color: var(--pc-text-header-color);
-  font-weight: var(--yc-text-accent-font-weight);
+  font-weight: var(--g-text-accent-font-weight);
 }
 @media (max-width: 576px) {
   .pc-banner-card__title {
-    font-size: var(--yc-text-display-1-font-size);
-    line-height: var(--yc-text-display-1-line-height);
+    font-size: var(--g-text-display-1-font-size);
+    line-height: var(--g-text-display-1-line-height);
   }
 }
 .pc-banner-card__title a {
   outline: none;
-  color: var(--yc-color-text-link);
+  color: var(--g-color-text-link);
   text-decoration: none;
   cursor: pointer;
 }
@@ -35,8 +35,8 @@ unpredictable css rules order in build */
   outline: 2px solid #ffdb4d;
 }
 .pc-banner-card__title a:hover, .pc-banner-card__title a:active {
-  --pc-text-header-color: var(--yc-color-text-link-hover);
-  color: var(--yc-color-text-link-hover);
+  --pc-text-header-color: var(--g-color-text-link-hover);
+  color: var(--g-color-text-link-hover);
 }
 .pc-banner-card__content {
   width: 100%;
@@ -57,17 +57,17 @@ unpredictable css rules order in build */
 .pc-banner-card__subtitle {
   display: inline-block;
   margin-top: 8px;
-  font-size: var(--yc-text-body-3-font-size);
-  line-height: var(--yc-text-body-3-line-height);
+  font-size: var(--g-text-body-3-font-size);
+  line-height: var(--g-text-body-3-line-height);
   color: var(--pc-text-header-color);
-  font-weight: var(--yc-text-accent-font-weight);
+  font-weight: var(--g-text-accent-font-weight);
   font-weight: normal;
 }
 .pc-banner-card__subtitle p {
-  font-size: var(--yc-text-body-3-font-size);
-  line-height: var(--yc-text-body-3-line-height);
+  font-size: var(--g-text-body-3-font-size);
+  line-height: var(--g-text-body-3-line-height);
   color: var(--pc-text-header-color);
-  font-weight: var(--yc-text-accent-font-weight);
+  font-weight: var(--g-text-accent-font-weight);
   font-weight: normal;
 }
 .pc-banner-card__button.pc-banner-card__button {

package/build/cjs/sub-blocks/BannerCard/BannerCard.js

@@ -2,14 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BannerCard = void 0;
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const react_1 = tslib_1.__importDefault(require("react"));
 const components_1 = require("../../components");
-const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
+const theme_1 = require("../../context/theme");
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('banner-card');
 const BannerCard = (props) => {
     const { title, subtitle, button: { url, text, target }, color, theme: textTheme = 'light', image, disableCompress, } = props;
-    const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
+    const theme = (0, theme_1.useTheme)();
     const contentStyle = {};
     if (color) {
         contentStyle.backgroundColor = (0, utils_1.getThemedValue)(color, theme);

package/build/cjs/sub-blocks/Content/Content.css

@@ -8,7 +8,7 @@ unpredictable css rules order in build */
 .pc-content {
   --pc-monochrome-button-background-color: #262626;
   --pc-monochrome-button-background-color-hover: #393939;
-  --pc-monochrome-button-color: var(--yc-color-text-light-primary);
+  --pc-monochrome-button-color: var(--g-color-text-light-primary);
 }
 .pc-content__notice .yfm ol,
 .pc-content__notice .yfm ul, .pc-content__text .yfm ol,
@@ -17,14 +17,14 @@ unpredictable css rules order in build */
 }
 .pc-content__notice.pc-content__notice .yfm,
 .pc-content__notice.pc-content__notice .yfm > * {
-  color: var(--yc-color-text-secondary);
+  color: var(--g-color-text-secondary);
 }
 .pc-content__notice.pc-content__notice .yfm a {
-  color: var(--yc-color-text-secondary);
+  color: var(--g-color-text-secondary);
   text-decoration: underline;
 }
 .pc-content__notice.pc-content__notice .yfm a:hover {
-  color: var(--yc-color-text-primary);
+  color: var(--g-color-text-primary);
 }
 
 .pc-content__button.pc-content__button {
@@ -82,8 +82,8 @@ unpredictable css rules order in build */
 }
 .pc-content_size_l .pc-content__text .yfm,
 .pc-content_size_l .pc-content__notice .yfm {
-  font-size: var(--yc-text-body-3-font-size);
-  line-height: var(--yc-text-body-3-line-height);
+  font-size: var(--g-text-body-3-font-size);
+  line-height: var(--g-text-body-3-line-height);
 }
 .pc-content_size_l .pc-content__links,
 .pc-content_size_l .pc-content__link,
@@ -95,63 +95,63 @@ unpredictable css rules order in build */
 .pc-content_theme_dark .pc-content__text .yfm,
 .pc-content_theme_dark .pc-content__text .yfm *,
 .pc-content_theme_dark .pc-content__link a {
-  color: var(--yc-color-text-light-primary);
+  color: var(--g-color-text-light-primary);
 }
 .pc-content_theme_dark .pc-content__notice .yfm,
 .pc-content_theme_dark .pc-content__notice .yfm * {
-  color: var(--yc-color-text-light-secondary);
+  color: var(--g-color-text-light-secondary);
 }
 .pc-content_theme_dark .pc-content__notice .yfm a {
-  color: var(--yc-color-text-light-secondary);
+  color: var(--g-color-text-light-secondary);
   text-decoration: underline;
 }
 .pc-content_theme_dark .pc-content__notice .yfm a:hover {
-  color: var(--yc-color-text-light-primary);
+  color: var(--g-color-text-light-primary);
 }
 .pc-content_theme_dark .pc-content__text .yfm a {
-  color: var(--yc-color-text-light-primary);
+  color: var(--g-color-text-light-primary);
   text-decoration: underline;
 }
 .pc-content_theme_dark .pc-content__text .yfm a:hover {
-  color: var(--yc-color-text-light-secondary);
+  color: var(--g-color-text-light-secondary);
 }
 .pc-content_theme_dark .pc-content__title a {
-  color: var(--yc-color-text-light-primary);
+  color: var(--g-color-text-light-primary);
   text-decoration: underline;
   text-decoration: none;
 }
 .pc-content_theme_dark .pc-content__title a:hover {
-  color: var(--yc-color-text-light-secondary);
+  color: var(--g-color-text-light-secondary);
 }
 .pc-content_theme_light .pc-content__title *,
 .pc-content_theme_light .pc-content__text .yfm,
 .pc-content_theme_light .pc-content__text .yfm *,
 .pc-content_theme_light .pc-content__link a {
-  color: var(--yc-color-text-dark-primary);
+  color: var(--g-color-text-dark-primary);
 }
 .pc-content_theme_light .pc-content__notice .yfm,
 .pc-content_theme_light .pc-content__notice .yfm * {
-  color: var(--yc-color-text-dark-secondary);
+  color: var(--g-color-text-dark-secondary);
 }
 .pc-content_theme_light .pc-content__notice .yfm a {
-  color: var(--yc-color-text-dark-secondary);
+  color: var(--g-color-text-dark-secondary);
   text-decoration: underline;
 }
 .pc-content_theme_light .pc-content__notice .yfm a:hover {
-  color: var(--yc-color-text-dark-primary);
+  color: var(--g-color-text-dark-primary);
 }
 .pc-content_theme_light .pc-content__text .yfm a {
-  color: var(--yc-color-text-dark-primary);
+  color: var(--g-color-text-dark-primary);
   text-decoration: underline;
 }
 .pc-content_theme_light .pc-content__text .yfm a:hover {
-  color: var(--yc-color-text-dark-secondary);
+  color: var(--g-color-text-dark-secondary);
 }
 .pc-content_theme_light .pc-content__title a {
-  color: var(--yc-color-text-dark-primary);
+  color: var(--g-color-text-dark-primary);
   text-decoration: underline;
   text-decoration: none;
 }
 .pc-content_theme_light .pc-content__title a:hover {
-  color: var(--yc-color-text-dark-secondary);
+  color: var(--g-color-text-dark-secondary);
 }

package/build/cjs/sub-blocks/Content/ContentList/ContentList.css

@@ -4,8 +4,8 @@ unpredictable css rules order in build */
   margin-top: 24px;
 }
 .pc-content-list_size_l .pc-content-list__title {
-  font-size: var(--yc-text-header-1-font-size);
-  line-height: var(--yc-text-header-1-line-height);
+  font-size: var(--g-text-header-1-font-size);
+  line-height: var(--g-text-header-1-line-height);
   margin: 0 0 8px;
 }
 .pc-content-list_size_l .pc-content-list__icon {
@@ -22,8 +22,8 @@ unpredictable css rules order in build */
   margin-top: 16px;
 }
 .pc-content-list_size_s .pc-content-list__title {
-  font-size: var(--yc-text-subheader-3-font-size);
-  line-height: var(--yc-text-subheader-3-line-height);
+  font-size: var(--g-text-subheader-3-font-size);
+  line-height: var(--g-text-subheader-3-line-height);
   margin: 0 0 calc(8px / 2);
 }
 .pc-content-list_size_s .pc-content-list__icon {
@@ -34,8 +34,8 @@ unpredictable css rules order in build */
   margin-right: 8px;
 }
 .pc-content-list_size_s .pc-content-list__text {
-  font-size: var(--yc-text-body-1-font-size);
-  line-height: var(--yc-text-body-1-line-height);
+  font-size: var(--g-text-body-1-font-size);
+  line-height: var(--g-text-body-1-line-height);
 }
 .pc-content-list_size_s .pc-content-list__item:not(:last-child) {
   margin-bottom: 12px;

package/build/cjs/sub-blocks/Content/ContentList/ContentList.js

@@ -1,16 +1,16 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+const react_1 = tslib_1.__importDefault(require("react"));
 const uuid_1 = require("uuid");
 const components_1 = require("../../../components");
 const Image_1 = tslib_1.__importDefault(require("../../../components/Image/Image"));
 const utils_1 = require("../../../components/Media/Image/utils");
-const ThemeValueContext_1 = require("../../../context/theme/ThemeValueContext");
+const theme_1 = require("../../../context/theme");
 const utils_2 = require("../../../utils");
 const b = (0, utils_2.block)('content-list');
 const ContentList = ({ list, size }) => {
-    const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
+    const theme = (0, theme_1.useTheme)();
     return (react_1.default.createElement("div", { className: b({ size }) }, list === null || list === void 0 ? void 0 : list.map((item) => {
         const { icon, title, text } = item;
         const iconThemed = (0, utils_2.getThemedValue)(icon, theme);

package/build/cjs/sub-blocks/Divider/Divider.css

@@ -23,5 +23,5 @@
   padding-top: 128px;
 }
 .pc-divider-block_border {
-  border-top: 1px solid var(--yc-color-line-generic);
+  border-top: 1px solid var(--g-color-line-generic);
 }