@redneckz/wildless-cms-uni-blocks 0.14.13 → 0.14.15

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

@@ -11,6 +11,7 @@
     },
     "version": "primary",
     "isTabularBenefits": true,
+    "isFullWidthTitle": true,
     "benefits": [
       {
         "type": "default",

package/mobile/src/components/ProductTile/ProductTile.tsx

@@ -15,6 +15,7 @@ export const ProductTile = JSX<ProductTileProps>(
     isTabularBenefits = true,
     additionalDescription,
     imageOptions,
+    isFullWidthTitle = true,
     ...rest
   }) => (
     <BlockWrapper className={className} padding="p-0" {...rest}>
@@ -25,6 +26,7 @@ export const ProductTile = JSX<ProductTileProps>(
         headlineVersion={headlineVersion}
         isTabularBenefits={isTabularBenefits}
         imageOptions={{ isImageSecondary: true, ...imageOptions }}
+        isFullWidthTitle={isFullWidthTitle}
         {...rest}
       >
         {additionalDescription ? (

package/mobile/src/ui-kit/BaseProductTile/BaseProductTile.tsx

@@ -28,7 +28,7 @@ export const BaseProductTile = JSX<BaseProductTileProps>(
     isTabularBenefits,
     benefits,
     __html,
-    isFullWidthTitle = true,
+    isFullWidthTitle,
     items,
     isDotted = true,
     listItemSize,

package/mobile/src/ui-kit/BaseTile/BaseTile.tsx

@@ -57,7 +57,7 @@ export const BaseTile = JSX<BaseTileProps>(
             leftImage ? '' : 'grow',
           )}
         >
-          <div className="grow grid gap-3xl row-span-1">
+          <div className="grow space-y-lg">
             {insetTitle}
             {children}
           </div>
@@ -69,7 +69,7 @@ export const BaseTile = JSX<BaseTileProps>(
             ),
             imageAlign,
           })}
-          <div className="self-end">{buttons}</div>
+          {buttons ? <div className="self-end">{buttons}</div> : null}
         </div>
       </div>
     </div>
@@ -78,7 +78,7 @@ export const BaseTile = JSX<BaseTileProps>(
 
 const positionStyle = (isImageAlwaysOnRight: boolean) =>
   isImageAlwaysOnRight
-    ? 'ml-xl justify-self-end row-start-1 row-end-3 col-start-2 self-center'
+    ? 'justify-self-end row-start-1 row-end-3 col-start-2 self-center'
     : '';
 
 const renderImageContainer = (

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

@@ -1,8 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { style } from '../../utils/style';
 import { iconStyleMap } from './buttonClassNameConstants';
-import type { ButtonProps } from './ButtonProps';
 import type { ButtonContent } from './ButtonContent';
+import type { ButtonProps } from './ButtonProps';
 
 export const ButtonInner = JSX<ButtonProps>((props) => {
   const { text, aboveText, appendLeft, appendRight, version = 'primary' } = props;
@@ -11,7 +11,7 @@ export const ButtonInner = JSX<ButtonProps>((props) => {
     <div className={style(getButtonStyle(props), 'flex gap-xs')}>
       {appendLeft ? <div className={iconStyleMap[version]}>{appendLeft}</div> : null}
       {isWithText(props) ? (
-        <div>
+        <div className="whitespace-pre">
           {aboveText ? <div className="text-xs font-light text-left">{aboveText}</div> : null}
           <div className={`text-left ${aboveText ? 'text-s -mt-3xs' : 'text-l'}`}>{text}</div>
         </div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.13",
+  "version": "0.14.15",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/components/MobileAppTile/MobileAppTile.tsx

@@ -5,9 +5,9 @@ import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { Img } from '../../ui-kit/Img/Img';
+import { Text } from '../../ui-kit/Text/Text';
 import { style } from '../../utils/style';
 import type { MobileAppTileContent } from './MobileAppTileContent';
-import { renderDescription } from './renderDescription';
 import { renderList } from './renderList';
 
 export interface MobileAppTileProps extends MobileAppTileContent, UniBlockProps {}
@@ -53,21 +53,25 @@ export const MobileAppTile = JSX<MobileAppTileProps>(
             ) : null
           }
           rightImage={img}
-          buttons={renderButtonsSection(buttons)}
+          buttons={renderButtonsSection(buttons, { className: 'flex-wrap' })}
         >
-          {renderDescription(description)}
+          {description ? (
+            <Text size="text-xl" font-weight="font-light">
+              {description}
+            </Text>
+          ) : null}
           <div
             className={style(
               'gap-m',
               'flex flex-1 flex-col',
-              'flex-col items-start @4xl:flex-row @4xl:items-center',
+              'flex-col items-start @xl:flex-row @xl:items-center',
             )}
           >
             {renderList(items, listItemSize)}
             {qr?.src ? (
               <div
                 className={style(
-                  'flex justify-center bg-white rounded-md @4xl:-order-1',
+                  'flex justify-center bg-white rounded-md @xl:-order-1',
                   containerStyle,
                 )}
               >

package/src/components/ProductBlock/ProductBlock.tsx

@@ -1,13 +1,13 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
+import { useRouter } from '../../hooks/useRouter';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { BaseProductTile } from '../../ui-kit/BaseProductTile/BaseProductTile';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
+import type { PreventableEvent } from '../../ui-kit/PreventableEvent';
 import { style } from '../../utils/style';
 import type { ProductBlockContent } from './ProductBlockContent';
 import { renderBackwardButton } from './renderBackwardButton';
-import { useCallback } from '@redneckz/uni-jsx/lib/hooks';
-import type { PreventableEvent } from '../../ui-kit/PreventableEvent';
-import { useRouter } from '../../hooks/useRouter';
 
 export interface ProductBlockProps extends UniBlockProps, ProductBlockContent {}
 

package/src/components/ProductGallery/ProductGallery.tsx

@@ -29,6 +29,7 @@ export const ProductGallery = JSX<ProductGalleryProps>(
               <BaseProductTile
                 className="pl-6xl h-full"
                 headlineVersion="XXL"
+                isFullWidthTitle={false}
                 {...productBlock}
                 {...rest}
               />

package/src/components/ProductTile/ProductTile.example.json

@@ -11,6 +11,7 @@
     },
     "version": "primary",
     "isTabularBenefits": true,
+    "isFullWidthTitle": true,
     "benefits": [
       {
         "type": "default",

package/src/components/ProductTile/ProductTile.tsx

@@ -15,6 +15,7 @@ export const ProductTile = JSX<ProductTileProps>(
     isTabularBenefits = true,
     additionalDescription,
     imageOptions,
+    isFullWidthTitle = true,
     ...rest
   }) => (
     <BlockWrapper className={className} padding="p-0" {...rest}>
@@ -25,6 +26,7 @@ export const ProductTile = JSX<ProductTileProps>(
         headlineVersion={headlineVersion}
         isTabularBenefits={isTabularBenefits}
         imageOptions={{ isImageSecondary: true, ...imageOptions }}
+        isFullWidthTitle={isFullWidthTitle}
         {...rest}
       >
         {additionalDescription ? (

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

@@ -28,7 +28,7 @@ export const BaseProductTile = JSX<BaseProductTileProps>(
     isTabularBenefits,
     benefits,
     __html,
-    isFullWidthTitle = true,
+    isFullWidthTitle,
     items,
     isDotted = true,
     listItemSize,

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

@@ -57,7 +57,7 @@ export const BaseTile = JSX<BaseTileProps>(
             leftImage ? '' : 'grow',
           )}
         >
-          <div className="grow grid gap-3xl row-span-1">
+          <div className="grow space-y-lg">
             {insetTitle}
             {children}
           </div>
@@ -69,7 +69,7 @@ export const BaseTile = JSX<BaseTileProps>(
             ),
             imageAlign,
           })}
-          <div className="self-end">{buttons}</div>
+          {buttons ? <div className="self-end">{buttons}</div> : null}
         </div>
       </div>
     </div>
@@ -78,7 +78,7 @@ export const BaseTile = JSX<BaseTileProps>(
 
 const positionStyle = (isImageAlwaysOnRight: boolean) =>
   isImageAlwaysOnRight
-    ? 'ml-xl justify-self-end row-start-1 row-end-3 col-start-2 self-center'
+    ? 'justify-self-end row-start-1 row-end-3 col-start-2 self-center'
     : '';
 
 const renderImageContainer = (

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

@@ -1,8 +1,8 @@
 import { JSX } from '@redneckz/uni-jsx';
 import { style } from '../../utils/style';
 import { iconStyleMap } from './buttonClassNameConstants';
-import type { ButtonProps } from './ButtonProps';
 import type { ButtonContent } from './ButtonContent';
+import type { ButtonProps } from './ButtonProps';
 
 export const ButtonInner = JSX<ButtonProps>((props) => {
   const { text, aboveText, appendLeft, appendRight, version = 'primary' } = props;
@@ -11,7 +11,7 @@ export const ButtonInner = JSX<ButtonProps>((props) => {
     <div className={style(getButtonStyle(props), 'flex gap-xs')}>
       {appendLeft ? <div className={iconStyleMap[version]}>{appendLeft}</div> : null}
       {isWithText(props) ? (
-        <div>
+        <div className="whitespace-pre">
           {aboveText ? <div className="text-xs font-light text-left">{aboveText}</div> : null}
           <div className={`text-left ${aboveText ? 'text-s -mt-3xs' : 'text-l'}`}>{text}</div>
         </div>

package/bundle/components/BenefitsBlock/benefitImageStyles.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-12 h-12 min-w-12 rounded-full";

package/bundle/components/BenefitsBlock/benefitImageStyles.mobile.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-56 h-56 min-w-56";

package/bundle/components/MobileAppTile/renderDescription.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const renderDescription: (description?: string) => JSX.Element | null;

package/dist/components/BenefitsBlock/benefitImageStyles.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-12 h-12 min-w-12 rounded-full";

package/dist/components/BenefitsBlock/benefitImageStyles.js

@@ -1,4 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.benefitImageStyles = void 0;
-exports.benefitImageStyles = 'w-12 h-12 min-w-12 rounded-full';
-//# sourceMappingURL=benefitImageStyles.js.map

package/dist/components/BenefitsBlock/benefitImageStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"benefitImageStyles.js","sourceRoot":"","sources":["../../../src/components/BenefitsBlock/benefitImageStyles.tsx"],"names":[],"mappings":";;AAAa,QAAA,kBAAkB,GAAG,iCAAiC,CAAC"}

package/dist/components/BenefitsBlock/benefitImageStyles.mobile.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-56 h-56 min-w-56";

package/dist/components/BenefitsBlock/benefitImageStyles.mobile.js

@@ -1,4 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.benefitImageStyles = void 0;
-exports.benefitImageStyles = 'w-56 h-56 min-w-56';
-//# sourceMappingURL=benefitImageStyles.mobile.js.map

package/dist/components/BenefitsBlock/benefitImageStyles.mobile.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"benefitImageStyles.mobile.js","sourceRoot":"","sources":["../../../src/components/BenefitsBlock/benefitImageStyles.mobile.tsx"],"names":[],"mappings":";;AAAa,QAAA,kBAAkB,GAAG,oBAAoB,CAAC"}

package/dist/components/MobileAppTile/renderDescription.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const renderDescription: (description?: string) => JSX.Element | null;

package/dist/components/MobileAppTile/renderDescription.js

@@ -1,7 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderDescription = void 0;
-const jsx_runtime_1 = require("@redneckz/uni-jsx/jsx-runtime");
-const Text_1 = require("../../ui-kit/Text/Text");
-const renderDescription = (description) => description ? ((0, jsx_runtime_1.jsx)("div", { className: "mb-lg pt-3xs", children: (0, jsx_runtime_1.jsx)(Text_1.Text, { size: "text-xl", "font-weight": "font-light", children: description }) })) : null;
-exports.renderDescription = renderDescription;
-//# sourceMappingURL=renderDescription.js.map

package/dist/components/MobileAppTile/renderDescription.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderDescription.js","sourceRoot":"","sources":["../../../src/components/MobileAppTile/renderDescription.tsx"],"names":[],"mappings":";;;AAAA,iDAA8C;AAEvC,MAAM,iBAAiB,GAAG,CAAC,WAAoB,EAAE,EAAE,CACxD,WAAW,CAAC,CAAC,CAAC,CACZ,gCAAK,SAAS,EAAC,cAAc,YAC3B,uBAAC,WAAI,IAAC,IAAI,EAAC,SAAS,iBAAa,YAAY,YAC1C,WAAW,GACP,GACH,CACP,CAAC,CAAC,CAAC,IAAI,CAAC;AAPE,QAAA,iBAAiB,qBAOnB"}

package/lib/components/BenefitsBlock/benefitImageStyles.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-12 h-12 min-w-12 rounded-full";

package/lib/components/BenefitsBlock/benefitImageStyles.js

@@ -1,2 +0,0 @@
-export const benefitImageStyles = 'w-12 h-12 min-w-12 rounded-full';
-//# sourceMappingURL=benefitImageStyles.js.map

package/lib/components/BenefitsBlock/benefitImageStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"benefitImageStyles.js","sourceRoot":"","sources":["../../../src/components/BenefitsBlock/benefitImageStyles.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,kBAAkB,GAAG,iCAAiC,CAAC"}

package/lib/components/BenefitsBlock/benefitImageStyles.mobile.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-56 h-56 min-w-56";

package/lib/components/BenefitsBlock/benefitImageStyles.mobile.js

@@ -1,2 +0,0 @@
-export const benefitImageStyles = 'w-56 h-56 min-w-56';
-//# sourceMappingURL=benefitImageStyles.mobile.js.map

package/lib/components/BenefitsBlock/benefitImageStyles.mobile.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"benefitImageStyles.mobile.js","sourceRoot":"","sources":["../../../src/components/BenefitsBlock/benefitImageStyles.mobile.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,kBAAkB,GAAG,oBAAoB,CAAC"}

package/lib/components/MobileAppTile/renderDescription.d.ts

@@ -1 +0,0 @@
-export declare const renderDescription: (description?: string) => JSX.Element | null;

package/lib/components/MobileAppTile/renderDescription.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
-import { Text } from '../../ui-kit/Text/Text.js';
-export const renderDescription = (description) => description ? (_jsx("div", { className: "mb-lg pt-3xs", children: _jsx(Text, { size: "text-xl", "font-weight": "font-light", children: description }) })) : null;
-//# sourceMappingURL=renderDescription.js.map

package/lib/components/MobileAppTile/renderDescription.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderDescription.js","sourceRoot":"","sources":["../../../src/components/MobileAppTile/renderDescription.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,WAAoB,EAAE,EAAE,CACxD,WAAW,CAAC,CAAC,CAAC,CACZ,cAAK,SAAS,EAAC,cAAc,YAC3B,KAAC,IAAI,IAAC,IAAI,EAAC,SAAS,iBAAa,YAAY,YAC1C,WAAW,GACP,GACH,CACP,CAAC,CAAC,CAAC,IAAI,CAAC"}

package/mobile/bundle/components/BenefitsBlock/benefitImageStyles.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-56 h-56 min-w-56";

package/mobile/bundle/components/MobileAppTile/renderDescription.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const renderDescription: (description?: string) => JSX.Element | null;

package/mobile/dist/components/BenefitsBlock/benefitImageStyles.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-56 h-56 min-w-56";

package/mobile/dist/components/BenefitsBlock/benefitImageStyles.js

@@ -1,4 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.benefitImageStyles = void 0;
-exports.benefitImageStyles = 'w-56 h-56 min-w-56';
-//# sourceMappingURL=benefitImageStyles.js.map

package/mobile/dist/components/BenefitsBlock/benefitImageStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"benefitImageStyles.js","sourceRoot":"","sources":["../../../src/components/BenefitsBlock/benefitImageStyles.tsx"],"names":[],"mappings":";;AAAa,QAAA,kBAAkB,GAAG,oBAAoB,CAAC"}

package/mobile/dist/components/MobileAppTile/renderDescription.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const renderDescription: (description?: string) => JSX.Element | null;

package/mobile/dist/components/MobileAppTile/renderDescription.js

@@ -1,7 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderDescription = void 0;
-const jsx_runtime_1 = require("@redneckz/uni-jsx/jsx-runtime");
-const Text_1 = require("../../ui-kit/Text/Text");
-const renderDescription = (description) => description ? ((0, jsx_runtime_1.jsx)("div", { className: "mb-lg pt-3xs", children: (0, jsx_runtime_1.jsx)(Text_1.Text, { size: "text-xl", "font-weight": "font-light", children: description }) })) : null;
-exports.renderDescription = renderDescription;
-//# sourceMappingURL=renderDescription.js.map

package/mobile/dist/components/MobileAppTile/renderDescription.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderDescription.js","sourceRoot":"","sources":["../../../src/components/MobileAppTile/renderDescription.tsx"],"names":[],"mappings":";;;AAAA,iDAA8C;AAEvC,MAAM,iBAAiB,GAAG,CAAC,WAAoB,EAAE,EAAE,CACxD,WAAW,CAAC,CAAC,CAAC,CACZ,gCAAK,SAAS,EAAC,cAAc,YAC3B,uBAAC,WAAI,IAAC,IAAI,EAAC,SAAS,iBAAa,YAAY,YAC1C,WAAW,GACP,GACH,CACP,CAAC,CAAC,CAAC,IAAI,CAAC;AAPE,QAAA,iBAAiB,qBAOnB"}

package/mobile/lib/components/BenefitsBlock/benefitImageStyles.d.ts

@@ -1 +0,0 @@
-export declare const benefitImageStyles = "w-56 h-56 min-w-56";

package/mobile/lib/components/BenefitsBlock/benefitImageStyles.js

@@ -1,2 +0,0 @@
-export const benefitImageStyles = 'w-56 h-56 min-w-56';
-//# sourceMappingURL=benefitImageStyles.js.map

package/mobile/lib/components/BenefitsBlock/benefitImageStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"benefitImageStyles.js","sourceRoot":"","sources":["../../../src/components/BenefitsBlock/benefitImageStyles.tsx"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,kBAAkB,GAAG,oBAAoB,CAAC"}

package/mobile/lib/components/MobileAppTile/renderDescription.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const renderDescription: (description?: string) => JSX.Element | null;

package/mobile/lib/components/MobileAppTile/renderDescription.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
-import { Text } from '../../ui-kit/Text/Text.js';
-export const renderDescription = (description) => description ? (_jsx("div", { className: "mb-lg pt-3xs", children: _jsx(Text, { size: "text-xl", "font-weight": "font-light", children: description }) })) : null;
-//# sourceMappingURL=renderDescription.js.map

package/mobile/lib/components/MobileAppTile/renderDescription.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderDescription.js","sourceRoot":"","sources":["../../../src/components/MobileAppTile/renderDescription.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAE9C,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,WAAoB,EAAE,EAAE,CACxD,WAAW,CAAC,CAAC,CAAC,CACZ,cAAK,SAAS,EAAC,cAAc,YAC3B,KAAC,IAAI,IAAC,IAAI,EAAC,SAAS,iBAAa,YAAY,YAC1C,WAAW,GACP,GACH,CACP,CAAC,CAAC,CAAC,IAAI,CAAC"}

package/mobile/src/components/BenefitsBlock/benefitImageStyles.tsx

@@ -1 +0,0 @@
-export const benefitImageStyles = 'w-56 h-56 min-w-56';

package/mobile/src/components/MobileAppTile/renderDescription.tsx

@@ -1,10 +0,0 @@
-import { Text } from '../../ui-kit/Text/Text';
-
-export const renderDescription = (description?: string) =>
-  description ? (
-    <div className="mb-lg pt-3xs">
-      <Text size="text-xl" font-weight="font-light">
-        {description}
-      </Text>
-    </div>
-  ) : null;

package/src/components/BenefitsBlock/benefitImageStyles.mobile.tsx

@@ -1 +0,0 @@
-export const benefitImageStyles = 'w-56 h-56 min-w-56';

package/src/components/BenefitsBlock/benefitImageStyles.tsx

@@ -1 +0,0 @@
-export const benefitImageStyles = 'w-12 h-12 min-w-12 rounded-full';

package/src/components/MobileAppTile/renderDescription.tsx

@@ -1,10 +0,0 @@
-import { Text } from '../../ui-kit/Text/Text';
-
-export const renderDescription = (description?: string) =>
-  description ? (
-    <div className="mb-lg pt-3xs">
-      <Text size="text-xl" font-weight="font-light">
-        {description}
-      </Text>
-    </div>
-  ) : null;