@redneckz/wildless-cms-uni-blocks 0.3.44 → 0.3.47

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

@@ -1,20 +1,7 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { Button } from './Button';
 import { ButtonProps } from './ButtonProps';
-import { SVG } from '../SVG';
-
-const ARROW_PATHS = [
-  {
-    d: 'm9 12 4-4-4-4',
-    stroke: 'currentColor',
-    strokeWidth: '2',
-    strokeLinecap: 'round',
-    fill: 'none',
-  },
-  {
-    d: 'M2 9a1 1 0 0 1 0-2v2Zm6-2a1 1 0 0 1 0 2V7ZM2 7h6v2H2V7Z',
-  },
-];
+import { Img } from '../Img/Img';
 
 export const ArrowButton = JSX<ButtonProps>(({ className, disabled, ...rest }) => (
   <Button
@@ -27,6 +14,12 @@ export const ArrowButton = JSX<ButtonProps>(({ className, disabled, ...rest }) =
     disabled={disabled}
     {...rest}
   >
-    <SVG paths={ARROW_PATHS} viewBox="0 0 16 16" fill="none" width="16" height="16" />
+    <Img
+      className="w-4 h-4 min-w-4 min-h-4 rounded-full box-border"
+      image={{ icon: 'ArrowLeftIcon' }}
+      width="16"
+      height="16"
+      asSVG
+    />
   </Button>
 ));

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

@@ -21,22 +21,26 @@ const buttonStyle = 'text-center font-sans select-none';
 export interface ButtonCommonProps extends ButtonProps, ButtonWithIconProps {}
 
 export const Button = JSX<ButtonCommonProps>((props) => {
-  const { text, aboveText, appendLeft, children, disabled, rounded } = props;
+  const { text, aboveText, appendLeft, children, disabled, rounded, ...rest } = props;
 
   const buttonInner = children ?? (
     <ButtonInner text={text} aboveText={aboveText} appendLeft={appendLeft} rounded={rounded} />
   );
 
   return disabled ? (
-    <DisabledButton {...props}>{buttonInner}</DisabledButton>
+    <DisabledButton rounded={rounded} {...rest}>
+      {buttonInner}
+    </DisabledButton>
   ) : (
-    <RegularButton {...props}>{buttonInner}</RegularButton>
+    <RegularButton rounded={rounded} {...rest}>
+      {buttonInner}
+    </RegularButton>
   );
 });
 
 export const RegularButton = JSX<ButtonCommonProps>(
   ({
-    className,
+    className = '',
     ariaLabel,
     version = 'none',
     rounded,
@@ -46,20 +50,17 @@ export const RegularButton = JSX<ButtonCommonProps>(
     onClick,
     ...rest
   }) => {
-    // Pick Button props to prevent forwarding into HTML <a> tag leading to errors being printed in console.
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const { aboveText, appendLeft, ...linkProps } = rest;
     return (
       <a
         className={`${buttonStyle} inline-block cursor-pointer no-underline ${
           buttonStyleMap[version] || ''
-        } ${rounded ? 'rounded-full' : 'rounded-md'} ${className || ''}`}
+        } ${rounded ? 'rounded-full' : 'rounded-md'} ${className}`}
         href={href}
         target={target}
         onClick={onClick}
         aria-label={ariaLabel}
         role={href ? 'link' : 'button'}
-        {...linkProps}
+        {...rest}
       >
         {children}
       </a>

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-button text-left">{text}</div>
+          <div className="text-button-sm text-left">{text}</div>
         </div>
       ) : null}
     </div>

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

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

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

@@ -34,4 +34,24 @@ export default {
       <List items={items} version="gray" isDotted={false} />
     </div>
   ),
+  'tile dotted': (
+    <div className="bg-white p-12">
+      <List items={items} version="tile" />
+    </div>
+  ),
+  'tile w/o dots': (
+    <div className="bg-white p-12">
+      <List items={items} version="tile" isDotted={false} />
+    </div>
+  ),
+  'tile white dotted': (
+    <div className="bg-primary-main p-12">
+      <List items={items} version="tile-white" />
+    </div>
+  ),
+  'tile white w/o dots': (
+    <div className="bg-primary-main p-12">
+      <List items={items} version="tile-white" isDotted={false} />
+    </div>
+  ),
 };

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

@@ -15,8 +15,8 @@ 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',
+  tile: 'rounded-full inline-block mr-4 mt-3',
+  'tile-white': 'rounded-full inline-block mr-4 mt-3',
 };
 
 const LIST_DOT_STYLE_MAP: Record<ListItemVersion, string> = {

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

@@ -8,13 +8,14 @@ export const TableArrowScrollControl = JSX<TableArrowScrollControlProps>(
       <div>
         <div className="absolute top-7 right-7 z-10">
           <ArrowButton
+            className="mt-4 rotate-180"
             onClick={onNextClick}
             disabled={!showNextButton}
             ariaLabel="Пролистать вправо"
             data-block-control="scroll-right"
           />
           <ArrowButton
-            className="mt-4 rotate-180"
+            className="mt-4"
             onClick={onPrevClick}
             disabled={!showPrevButton}
             ariaLabel="Пролистать влево"