@redneckz/wildless-cms-uni-blocks 0.3.34 → 0.3.35

package/src/ui-kit/Button/ButtonInner.tsx

@@ -14,7 +14,7 @@ export const ButtonInner = JSX<ButtonInnerProps>((props) => {
       {isWithText(props) ? (
         <div>
           <div className="text-m-2xs font-light text-left">{aboveText}</div>
-          <div className="text-base text-left">{text}</div>
+          <div className="text-button-sm text-left">{text}</div>
         </div>
       ) : null}
     </div>
@@ -28,7 +28,7 @@ const getButtonStyle = (props: ButtonInnerProps) => {
     return '';
   }
 
-  const withTextStyle = `px-8 gap-2 ${aboveText ? 'py-2' : 'py-4'}`;
+  const withTextStyle = `px-8 gap-2 ${aboveText ? 'py-2' : 'py-[18px]'}`;
 
   return [
     'flex items-center justify-center',

package/src/ui-kit/HeaderItem/HeaderItem.tsx

@@ -2,16 +2,27 @@ import { JSX } from '@redneckz/uni-jsx';
 import { BgColorVersion } from '../../model/BgColorVersion';
 import type { TopItemProps } from '../TopItem/TopItem';
 
-const TEXT_CLASSES = 'font-sans font-normal text-base';
+const TEXT_CLASSES = 'font-sans font-light text-base';
 const BORDER_CLASSES = 'absolute left-0 -bottom-3 w-full h-[2px]';
 
 export const HeaderItem = JSX<TopItemProps>(
-  ({ className, text, href, target, active, onClick, children, bgColor = 'bg-white' }) => (
+  ({
+    className = '',
+    text,
+    href,
+    target,
+    active,
+    onClick,
+    children,
+    bgColor = 'bg-white',
+    dataItemName,
+  }) => (
     <a
-      className={`relative inline-block bg-transparent text-center no-underline ${className || ''}`}
+      className={`relative inline-block bg-transparent text-center no-underline ${className}`}
       href={href}
       target={target}
       onClick={onClick}
+      data-item-name={dataItemName}
     >
       <span className={getTextClasses(bgColor, active)}>{text || children}</span>
       {active ? <div className={getBorderClasses(bgColor, active)} /> : null}

package/src/ui-kit/Heading/Heading.tsx

@@ -6,8 +6,8 @@ export interface HeadingProps extends HeadingContent, HeadingTypeContent {
 }
 
 const HEADING_STYLE_MAP: Record<HeadingType, string> = {
-  h1: 'text-title-lg tracking-[-0.3px]',
-  h2: 'text-title',
+  h1: 'text-title-xl tracking-[-0.3px]',
+  h2: 'text-title-lg',
   h3: 'text-title-sm',
   h4: 'text-title-xs',
   h5: 'text-title-2xs tracking-[0.2px]',

package/src/ui-kit/Icon/Icon.tsx

@@ -5,8 +5,8 @@ import { IconTitleMap } from '../../icons/IconName';
 
 const svgColorsMap: Record<IconColor, string> = {
   none: '',
-  primary: 'text-primary-main',
-  secondary: 'text-primary-text',
+  primary: 'text-white',
+  secondary: 'text-white',
 };
 
 export const Icon = JSX<IconProps>(

package/src/ui-kit/List/List.tsx

@@ -6,6 +6,8 @@ const TEXT_STYLE_MAP: Record<ListItemVersion, string> = {
   primary: 'text-primary-text',
   secondary: 'text-white',
   gray: 'text-secondary-text',
+  tile: 'text-primary-text',
+  'tile-white': 'text-white',
 };
 
 export const List = JSX<ListProps>((props) => {

package/src/ui-kit/List/ListItem.tsx

@@ -11,18 +11,26 @@ export interface ListItemProps {
   isDotted?: boolean;
 }
 
-const LIST_STYLE_CLASSES = 'rounded-full inline-block mr-3';
+const LIST_STYLE_CLASSES = {
+  primary: 'rounded-full inline-block mr-3 mt-2',
+  secondary: 'rounded-full inline-block mr-3 mt-2',
+  gray: 'rounded-full inline-block mr-3 mt-2',
+  tile: 'rounded-full inline-block mr-4',
+  'tile-white': 'rounded-full inline-block mr-4',
+};
 
 const LIST_DOT_STYLE_MAP: Record<ListItemVersion, string> = {
-  primary: 'bg-primary-main',
+  primary: 'bg-primary-text',
   secondary: 'bg-white',
   gray: 'bg-secondary-text',
+  tile: 'bg-black',
+  'tile-white': 'bg-white',
 };
 
 export const ListItem = JSX<ListItemProps>(
   ({ className = '', isDotted = true, children, version = 'primary' }) => {
     return (
-      <div className={`font-sans flex items-center ${className}`} role="listitem">
+      <div className={`font-sans flex items-start ${className}`} role="listitem">
         {isDotted && <div className={getListStyle(version)} />}
         <span>{children}</span>
       </div>
@@ -31,6 +39,12 @@ export const ListItem = JSX<ListItemProps>(
 );
 
 const getListStyle = (version: ListItemVersion) => {
-  const size = version === 'gray' ? 'w-1.5 h-1.5 min-w-1.5 min-h-1.5' : 'w-2 h-2 min-w-2 min-h-2';
-  return `${LIST_STYLE_CLASSES} ${LIST_DOT_STYLE_MAP[version]} ${size}`;
+  const size = {
+    primary: 'w-2 h-2 min-w-2 min-h-2',
+    secondary: 'w-2 h-2 min-w-2 min-h-2',
+    gray: 'w-1.5 h-1.5 min-w-1.5 min-h-1.5',
+    tile: 'w-[7px] h-[7px] min-w-[7px] min-h-[7px]',
+    'tile-white': 'w-[7px] h-[7px] min-w-[7px] min-h-[7px]',
+  };
+  return `${LIST_STYLE_CLASSES[version]} ${LIST_DOT_STYLE_MAP[version]} ${size[version]}`;
 };

package/src/ui-kit/List/ListProps.ts

@@ -4,7 +4,7 @@ import type { ListContent } from './ListContent';
  * @title Версия списка
  * @enumNames ["Основной", "Второстепенный", "Серый"]
  */
-export type ListItemVersion = 'primary' | 'secondary' | 'gray';
+export type ListItemVersion = 'primary' | 'secondary' | 'gray' | 'tile' | 'tile-white';
 
 /**
  * @title Содержимое списка

package/src/ui-kit/Logo/Logo.tsx

@@ -41,7 +41,7 @@ export const Logo = JSX<Partial<LogoProps>>(
           paths={LOGO_PATHS.map((d) => ({ d }))}
         />
         {!hideTitle && (
-          <span className={`${TEXT_COLOR[bgColor]} text-base font-medium ml-2.5`}>
+          <span className={`${TEXT_COLOR[bgColor]} text-m-title-xs font-medium ml-2.5`}>
             {children || 'Россельхозбанк'}
           </span>
         )}

package/src/ui-kit/SearchBar/SearchBar.tsx

@@ -14,7 +14,7 @@ export const SearchBar = JSX<UniBlockProps>(({ className, context }) => {
         {!term && (
           <label
             htmlFor="search-bar-input"
-            className="font-sans font-normal text-base text-secondary-text"
+            className="font-sans font-light text-base text-secondary-text"
           >
             Поиск по сайту
           </label>
@@ -23,7 +23,7 @@ export const SearchBar = JSX<UniBlockProps>(({ className, context }) => {
       <input
         id="search-bar-input"
         className={
-          'h-12 pl-12 w-full peer font-sans font-normal text-base text-black border border-solid rounded h-full box-border outline-none pr-[6%] border-main-divider focus:border-primary-text'
+          'h-12 pl-12 w-full peer font-sans font-light text-base text-black border border-solid rounded h-full box-border outline-none pr-[6%] border-main-divider focus:border-primary-text'
         }
         value={term}
         onChange={(e) => setTerm(e.target.value)}

package/src/ui-kit/TopItem/TopItem.tsx

@@ -12,9 +12,10 @@ export interface TopItemProps extends TopItemContent {
   ariaLabel?: string;
   onClick?: (ev: MouseEvent) => any;
   bgColor?: BgColorVersion;
+  dataItemName?: string;
 }
 
-const TEXT_CLASSES = 'font-sans font-normal text-sm';
+const TEXT_CLASSES = 'font-sans font-light text-sm';
 const LINK_CLASSES = 'inline-block border border-solid bg-transparent text-center no-underline';
 
 export const TopItem = JSX<TopItemProps>(

package/src/utils/isSSR.ts

@@ -0,0 +1,2 @@
+export const isSSR = () =>
+  !(typeof window !== 'undefined' && window.document && window.document.createElement);