@redneckz/wildless-cms-uni-blocks 0.11.2 → 0.11.3

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

@@ -1,34 +1,38 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { BlockVersion } from '../../model/BlockVersion';
 import type { IconVersion } from '../../model/IconVersion';
-import { style } from '../../utils/style';
 import { Img } from '../Img/Img';
+import { style } from '../../utils/style';
+import type { BenefitItemCommonProps, BenefitItemProps } from './BenefitItemProps';
+import { labelSize } from './labelSize';
 import { Paragraph } from '../Paragraph/Paragraph';
 import { Text } from '../Text/Text';
-import type { BenefitItemCommonProps, BenefitItemProps } from './BenefitItemProps';
 
 export interface BenefitGeneralProps extends BenefitItemProps, BenefitItemCommonProps {}
 
-export const BenefitItem = JSX<BenefitGeneralProps>(
-  ({ className, icon, label, description, version = 'primary', benefitsVersion = 'normal' }) => (
-    <div className={style('flex gap-5', description ? 'items-start' : 'items-center', className)}>
+export const BenefitItem = JSX<BenefitGeneralProps>((props) => {
+  const { className = '', icon, label, description, benefitsVersion = 'normal' } = props;
+  const listItemAlign = description ? 'items-start' : 'items-center';
+
+  return (
+    <div className={`flex gap-5 ${listItemAlign} ${className}`}>
       {icon ? (
-        <div className={getBenefitIconBgStyle(version, benefitsVersion)}>
+        <div className={getBenefitIconBgStyle(benefitsVersion)}>
           <Img
             className="w-6 h-6"
             image={{ ...icon, iconVersion: icon.iconVersion || benefitsVersion }}
           />
         </div>
       ) : null}
-      <div>
+      <div className="gap-0.5">
         {label ? (
-          <Text size="text-h6" color="text-primary-text group-data-secondary:text-white">
+          <Text color="text-primary-text group-data-secondary:text-white" size={labelSize}>
             {label}
           </Text>
         ) : null}
         {description ? (
           <Paragraph
-            size="text-m-light"
+            font="font-light"
+            size="text-m"
             color="text-secondary-text group-data-secondary:text-white"
           >
             {description}
@@ -36,17 +40,17 @@ export const BenefitItem = JSX<BenefitGeneralProps>(
         ) : null}
       </div>
     </div>
-  ),
-);
-
-function getBenefitIconBgStyle(version: BlockVersion, benefitsVersion: IconVersion) {
-  let bgColorStyle = 'bg-primary-main text-black';
+  );
+});
 
-  if (version === 'secondary') {
-    bgColorStyle = 'bg-white/30 text-black';
-  } else if (benefitsVersion === 'normal') {
-    bgColorStyle = 'bg-secondary-light text-primary-main';
-  }
+  function getBenefitIconBgStyle(benefitsVersion: IconVersion) {
+          const bgColorStyle =
+          benefitsVersion === 'normal'
+          ? 'bg-secondary-light text-primary-main'
+          : 'bg-primary-main text-black group-data-secondary:bg-white/30 group-data-secondary:text-black';
 
-  return `w-12 h-12 min-w-12 rounded-full p-2.5 box-border flex items-center justify-center ${bgColorStyle}`;
-}
+          return style(
+          'w-12 h-12 min-w-12 p-2.5 box-border flex items-center justify-center rounded-icon',
+          bgColorStyle,
+          );
+        }

package/src/ui-kit/BenefitItem/borderRadius.mobile.tsx

@@ -0,0 +1 @@
+export const borderRadius = 'rounded-md';

package/src/ui-kit/BenefitItem/labelSize.mobile.tsx

@@ -0,0 +1 @@
+export const labelSize = 'text-l';

package/src/ui-kit/BenefitItem/labelSize.tsx

@@ -0,0 +1 @@
+export const labelSize = 'text-h6';

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

@@ -15,7 +15,13 @@ export const renderButtonsSection = (
   { className = '', buttonClassName, isVertical }: ButtonsSectionOptions = {},
 ) =>
   buttons?.length && buttons.some((_) => _?.text || _?.icon?.icon) ? (
-    <div className={style('flex', isVertical ? 'flex-col gap-2' : 'flex-wrap gap-4', className)}>
+    <div
+      className={style(
+        'flex',
+        isVertical ? 'flex-col gap-2 justify-items-stretch' : 'flex-wrap gap-4',
+        className,
+      )}
+    >
       {buttons.map(renderButton(buttonClassName))}
     </div>
   ) : null;
@@ -30,7 +36,7 @@ const renderButton =
     return text || icon?.icon ? (
       <Button
         key={index ? String(index) : ''}
-        className={buttonClassName}
+        className={style('basis-full sm:basis-auto', buttonClassName)}
         appendLeft={renderButtonIcon({ ...icon, iconVersion })}
         appendRight={renderButtonIcon({ ...iconRight, iconVersion })}
         version={version}

package/src/ui-kit/Icon/IconProps.ts

@@ -2,6 +2,15 @@ import type { IconName } from '../../icons/IconName';
 import type { IconVersion } from '../../model/IconVersion';
 
 export type { IconName };
+
+/**
+ * @title Цвет фона иконки
+ * @enumNames [
+ *    "Основной",
+ *    "Второстепенный",
+ *    "Второстепенный светлый"
+ * ]
+ */
 export type IconBgVersion = 'primary' | 'secondary' | 'secondary-light';
 
 export interface IconCompatibilityFields {
@@ -21,7 +30,3 @@ export type IconProps = IconCompatibilityFields & {
   name?: IconName;
   iconVersion?: IconVersion;
 };
-
-export interface RoundedIconProps extends IconProps {
-  iconBgVersion?: IconBgVersion;
-}

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

@@ -1,7 +1,12 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { Icon } from './Icon';
-import type { IconBgVersion, RoundedIconProps } from './IconProps';
+import type { IconBgVersion } from './IconProps';
 import { style } from '../../utils/style';
+import type { Picture } from '../../model/Picture';
+
+export interface RoundedIconProps extends Picture {
+  iconBgVersion?: IconBgVersion;
+}
 
 const iconBgStyles: Record<IconBgVersion, string> = {
   primary: 'bg-main-divider',
@@ -9,8 +14,15 @@ const iconBgStyles: Record<IconBgVersion, string> = {
   'secondary-light': 'bg-secondary-light',
 };
 
-export const RoundedIcon = JSX<RoundedIconProps>(({ iconBgVersion = 'primary', ...rest }) => (
-  <div className={style('rounded-icon p-2.5 mr-3', iconBgStyles[iconBgVersion])}>
-    <Icon {...rest} />
-  </div>
-));
+export const RoundedIcon = JSX<RoundedIconProps>(
+  ({ iconBgVersion = 'primary', size, icon, ...rest }) => {
+    const width = String(size?.width || 24);
+    const height = String(size?.height || 24);
+
+    return icon ? (
+      <div className={style('rounded-icon p-2.5 mr-3', iconBgStyles[iconBgVersion])}>
+        <Icon {...rest} width={width} height={height} name={icon} />
+      </div>
+    ) : null;
+  },
+);

package/bundle/components/ButtonBlock/ButtonBlock.d.ts

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { ButtonBlockContent } from './ButtonBlockContent';
-interface ButtonBlockProps extends ButtonBlockContent, UniBlockProps {
-}
-export declare const ButtonBlock: import("@redneckz/uni-jsx").UNIComponent<ButtonBlockProps, any, any>;
-export {};

package/bundle/components/ButtonBlock/ButtonBlockContent.d.ts

@@ -1,8 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-    /** @title Кнопка */
-    button?: ButtonWithIconProps;
-}

package/dist/components/ButtonBlock/ButtonBlock.d.ts

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { ButtonBlockContent } from './ButtonBlockContent';
-interface ButtonBlockProps extends ButtonBlockContent, UniBlockProps {
-}
-export declare const ButtonBlock: import("@redneckz/uni-jsx").UNIComponent<ButtonBlockProps, any, any>;
-export {};

package/dist/components/ButtonBlock/ButtonBlock.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlock.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlock.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AAExC,4DAAyD;AACzD,mFAAgF;AAChF,6CAA0C;AAK7B,QAAA,WAAW,GAAG,IAAA,aAAG,EAAmB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,CACnF,uBAAC,2BAAY,IAAC,SAAS,EAAE,IAAA,aAAK,EAAC,iBAAiB,EAAE,SAAS,CAAC,KAAM,IAAI,YACnE,IAAA,2CAAoB,EAAC,CAAC,MAAM,CAAC,CAAC,GAClB,CAChB,CAAC,CAAC"}

package/dist/components/ButtonBlock/ButtonBlockContent.d.ts

@@ -1,8 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-    /** @title Кнопка */
-    button?: ButtonWithIconProps;
-}

package/dist/components/ButtonBlock/ButtonBlockContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlockContent.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlockContent.ts"],"names":[],"mappings":""}

package/lib/components/ButtonBlock/ButtonBlock.d.ts

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { ButtonBlockContent } from './ButtonBlockContent';
-interface ButtonBlockProps extends ButtonBlockContent, UniBlockProps {
-}
-export declare const ButtonBlock: import("@redneckz/uni-jsx").UNIComponent<ButtonBlockProps, any, any>;
-export {};

package/lib/components/ButtonBlock/ButtonBlock.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlock.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlock.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAK1C,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAmB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,CACnF,KAAC,YAAY,IAAC,SAAS,EAAE,KAAK,CAAC,iBAAiB,EAAE,SAAS,CAAC,KAAM,IAAI,YACnE,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAC,GAClB,CAChB,CAAC,CAAC"}

package/lib/components/ButtonBlock/ButtonBlockContent.d.ts

@@ -1,8 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-    /** @title Кнопка */
-    button?: ButtonWithIconProps;
-}

package/lib/components/ButtonBlock/ButtonBlockContent.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=ButtonBlockContent.js.map

package/lib/components/ButtonBlock/ButtonBlockContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlockContent.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlockContent.ts"],"names":[],"mappings":""}

package/mobile/bundle/components/ButtonBlock/ButtonBlock.d.ts

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { ButtonBlockContent } from './ButtonBlockContent';
-interface ButtonBlockProps extends ButtonBlockContent, UniBlockProps {
-}
-export declare const ButtonBlock: import("@redneckz/uni-jsx").UNIComponent<ButtonBlockProps, any, any>;
-export {};

package/mobile/bundle/components/ButtonBlock/ButtonBlockContent.d.ts

@@ -1,8 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-    /** @title Кнопка */
-    button?: ButtonWithIconProps;
-}

package/mobile/dist/components/ButtonBlock/ButtonBlock.d.ts

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { ButtonBlockContent } from './ButtonBlockContent';
-interface ButtonBlockProps extends ButtonBlockContent, UniBlockProps {
-}
-export declare const ButtonBlock: import("@redneckz/uni-jsx").UNIComponent<ButtonBlockProps, any, any>;
-export {};

package/mobile/dist/components/ButtonBlock/ButtonBlock.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlock.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlock.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AAExC,4DAAyD;AACzD,mFAAgF;AAChF,6CAA0C;AAK7B,QAAA,WAAW,GAAG,IAAA,aAAG,EAAmB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,CACnF,uBAAC,2BAAY,IAAC,SAAS,EAAE,IAAA,aAAK,EAAC,iBAAiB,EAAE,SAAS,CAAC,KAAM,IAAI,YACnE,IAAA,2CAAoB,EAAC,CAAC,MAAM,CAAC,CAAC,GAClB,CAChB,CAAC,CAAC"}

package/mobile/dist/components/ButtonBlock/ButtonBlockContent.d.ts

@@ -1,8 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-    /** @title Кнопка */
-    button?: ButtonWithIconProps;
-}

package/mobile/dist/components/ButtonBlock/ButtonBlockContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlockContent.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlockContent.ts"],"names":[],"mappings":""}

package/mobile/lib/components/ButtonBlock/ButtonBlock.d.ts

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../model/JSXBlock';
-import type { ButtonBlockContent } from './ButtonBlockContent';
-interface ButtonBlockProps extends ButtonBlockContent, UniBlockProps {
-}
-export declare const ButtonBlock: import("@redneckz/uni-jsx").UNIComponent<ButtonBlockProps, any, any>;
-export {};

package/mobile/lib/components/ButtonBlock/ButtonBlock.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlock.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlock.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AAChF,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAK1C,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAmB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,CACnF,KAAC,YAAY,IAAC,SAAS,EAAE,KAAK,CAAC,iBAAiB,EAAE,SAAS,CAAC,KAAM,IAAI,YACnE,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAC,GAClB,CAChB,CAAC,CAAC"}

package/mobile/lib/components/ButtonBlock/ButtonBlockContent.d.ts

@@ -1,8 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-    /** @title Кнопка */
-    button?: ButtonWithIconProps;
-}

package/mobile/lib/components/ButtonBlock/ButtonBlockContent.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=ButtonBlockContent.js.map

package/mobile/lib/components/ButtonBlock/ButtonBlockContent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonBlockContent.js","sourceRoot":"","sources":["../../../src/components/ButtonBlock/ButtonBlockContent.ts"],"names":[],"mappings":""}

package/mobile/src/components/ButtonBlock/ButtonBlock.example.json

@@ -1,12 +0,0 @@
-{
-  "content": {
-    "button": {
-      "href": "#",
-      "text": "Кнопка",
-      "target": "_blank",
-      "version": "primary",
-      "icon": { "format": "webp", "size": { "width": 24, "height": 24 } },
-      "iconRight": { "format": "webp", "size": { "width": 24, "height": 24 } }
-    }
-  }
-}

package/mobile/src/components/ButtonBlock/ButtonBlock.ui.json

@@ -1,12 +0,0 @@
-{
-  "content": {
-    "button": {
-      "icon": {
-        "ui:field": "icon"
-      },
-      "iconRight": {
-        "ui:field": "icon"
-      }
-    }
-  }
-}

package/mobile/src/components/ButtonBlock/ButtonBlockContent.ts

@@ -1,9 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-  /** @title Кнопка */
-  button?: ButtonWithIconProps;
-}

package/src/components/ButtonBlock/ButtonBlock.example.json

@@ -1,12 +0,0 @@
-{
-  "content": {
-    "button": {
-      "href": "#",
-      "text": "Кнопка",
-      "target": "_blank",
-      "version": "primary",
-      "icon": { "format": "webp", "size": { "width": 24, "height": 24 } },
-      "iconRight": { "format": "webp", "size": { "width": 24, "height": 24 } }
-    }
-  }
-}

package/src/components/ButtonBlock/ButtonBlock.fixture.tsx

@@ -1,19 +0,0 @@
-import '../../setup-fixture';
-
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-import { ButtonBlock } from './ButtonBlock';
-
-const button: ButtonWithIconProps = {
-  href: '/credit-cards',
-  text: 'Подробнее',
-  target: '_blank',
-  version: 'primary',
-};
-
-export default {
-  default: (
-    <div className="container grid grid-cols-12 p-4">
-      <ButtonBlock className="col-span-12" button={button} />
-    </div>
-  ),
-};

package/src/components/ButtonBlock/ButtonBlock.ui.json

@@ -1,12 +0,0 @@
-{
-  "content": {
-    "button": {
-      "icon": {
-        "ui:field": "icon"
-      },
-      "iconRight": {
-        "ui:field": "icon"
-      }
-    }
-  }
-}

package/src/components/ButtonBlock/ButtonBlockContent.ts

@@ -1,9 +0,0 @@
-import type { ButtonWithIconProps } from '../../ui-kit/Button/ButtonProps';
-
-/**
- * @title Блок Кнопка
- */
-export interface ButtonBlockContent {
-  /** @title Кнопка */
-  button?: ButtonWithIconProps;
-}