@redneckz/wildless-cms-uni-blocks 0.3.4 → 0.3.7

package/src/components/ProductGallery/ProductGalleryBlock.mobile.tsx

@@ -12,7 +12,7 @@ export interface ProductGalleryBlockProps extends UniBlockProps {
 export const ProductGalleryBlock = JSX<ProductGalleryBlockProps>(
   ({ block, headingType, context }) => {
     return (
-      <section className="flex grow-0 shrink-0 basis-full px-4 py-6" role="listitem">
+      <section className="flex grow-0 shrink-0 basis-full px-4 pt-6" role="listitem">
         <div className="flex grow">
           <ProductBlockInner context={context} headingType={headingType || 'h2'} {...block} />
         </div>

package/src/components/ProductTile/ProductTileContent.ts

@@ -1,6 +1,6 @@
 import type { BlockVersion } from '../../model/BlockVersion';
 import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
-import type { DescriptionContent } from '../../ui-kit/Description/DescriptionProps';
+import type { DescriptionContent } from '../../ui-kit/Description/DescriptionContent';
 import type { HeadingContent } from '../../ui-kit/Heading/HeadingContent';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
 import type { TextBenefit } from '../BenefitsBlock/BenefitsBlockContent';

package/src/components/PromoTile/PromoTileContent.ts

@@ -1,6 +1,6 @@
 import type { BlockVersion } from '../../model/BlockVersion';
 import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
-import type { DescriptionContent } from '../../ui-kit/Description/DescriptionProps';
+import type { DescriptionContent } from '../../ui-kit/Description/DescriptionContent';
 import type { HeadingContent } from '../../ui-kit/Heading/HeadingContent';
 
 /**

package/src/components/StepsBlock/StepsBlock.mobile.tsx

@@ -49,7 +49,7 @@ const renderStepTitle = (params: RenderStepTitleParams) => {
           {renderIconArea(step, size, i)}
           {!isLastStep && <div className={`min-h-8 h-full w-[2px] bg-secondary-light ${margin}`} />}
         </div>
-        <div className="flex flex-col justify-center relative">
+        <div className="flex flex-col justify-start relative">
           {step.label && (
             <div className="font-medium text-m-title-xs m-0 text-left">{step.label}</div>
           )}
@@ -82,7 +82,7 @@ const renderIconArea = (step: Step, size: SizeVersion, i: number) => {
       className={`${iconAreaSize} bg-secondary-light rounded-full z-10 mr-3 flex justify-center content-center`}
     >
       <span className={`font-medium text-secondary-text self-center ${iconTextSize}`}>
-        {(step.icon && <Icon name={step.icon} width={iconSize} height={iconSize} asSVG />) || i + 1}
+        {(step.icon && <Icon name={step.icon} width={iconSize} height={iconSize} />) || i + 1}
       </span>
     </div>
   );

package/src/components/Tile/Tile.tsx

@@ -49,9 +49,8 @@ export const Tile = JSX<TileProps>((props) => {
             <Heading
               headingType={getTileHeadingType(className)}
               title={title}
-              className={`whitespace-pre-wrap max-w-[600px] ${
-                version === 'primary' ? 'text-primary-text' : ''
-              }`}
+              className={`whitespace-pre-wrap max-w-[600px] ${title ? 'mb-3' : ''}
+              ${version === 'primary' ? 'text-primary-text' : ''}`}
             />
           )
         }
@@ -64,8 +63,12 @@ export const Tile = JSX<TileProps>((props) => {
       >
         {description && <Description className="mt-4 max-w-[600px]" description={description} />}
         {children}
-        {items?.length ? <List items={items} /> : null}
+        {renderList(items, version)}
       </BaseTile>
     </section>
   );
 });
+
+function renderList(items, version) {
+  return items?.length ? <List items={items} version={version} /> : null;
+}

package/src/components/Tile/TileContent.ts

@@ -1,6 +1,6 @@
 import type { BlockVersion } from '../../model/BlockVersion';
 import type { ButtonContent } from '../../ui-kit/Button/ButtonProps';
-import type { DescriptionContent } from '../../ui-kit/Description/DescriptionProps';
+import type { DescriptionContent } from '../../ui-kit/Description/DescriptionContent';
 import type { HeadingContent } from '../../ui-kit/Heading/HeadingContent';
 import type { ImageContent } from '../../ui-kit/Img/ImgProps';
 import type { ListContent } from '../../ui-kit/List/ListContent';

package/src/types.ts

@@ -5,7 +5,7 @@ import type { BlockVersion } from './model/BlockVersion';
 export type ColorPalette = 'pc' | 'bc' | 'eo' | 'eo2' | 'eo3' | 'eo4';
 
 export interface BaseBlockDef {
-  type: string;
+  type?: string;
   style?: string[];
   content?: BlockContent;
   version?: BlockVersion;
@@ -28,10 +28,17 @@ export interface SlotsMap {
 export interface ContentPageMeta {
   title: string;
   slug: string;
+  main: ContentPageMetaMain;
+  og?: Record<string, string>;
+  twitter?: Record<string, string>;
+  jsonLd?: string;
+}
+
+export interface ContentPageMetaMain {
   description?: string;
   keywords?: string[];
+  canonical?: string;
   robots?: string[];
-  og?: Record<string, string>;
 }
 
 export interface ContentPageDef extends ContentPageMeta {

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

@@ -1,10 +1,10 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { BlockItemProps, BlockItemVersion } from './BlockItemProps';
 
-const LIST_STYLE_CLASSES = 'rounded-full inline-block mr-3';
+const LIST_STYLE_CLASSES = 'rounded-full inline-block mr-3 mt-2';
 
 const TEXT_STYLE_MAP: Record<BlockItemVersion, string> = {
-  primary: 'text-primary-text',
+  primary: 'text-secondary-text',
   secondary: 'text-white',
   gray: 'text-secondary-text',
 };
@@ -18,8 +18,8 @@ const LIST_STYLE_MAP: Record<BlockItemVersion, string> = {
 export const BlockItem = JSX<BlockItemProps>(
   ({ className = '', isDotted = true, text, children, version = 'primary' }) => {
     return (
-      <div className={`font-sans flex items-center ${className}`} role="listitem">
-        {isDotted && <div className={getListStyle(version)} />}
+      <div className={`font-sans flex items-start ${className}`} role="listitem">
+        {isDotted && <div className={getListStyle(version)} />}!!!!!
         <span className={TEXT_STYLE_MAP[version]}>{text || children}</span>
       </div>
     );

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

@@ -1,8 +1,12 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { DescriptionProps } from './DescriptionProps';
+import { DescriptionContent } from './DescriptionContent';
+
+export interface DescriptionProps extends DescriptionContent {
+  className?: string;
+}
 
 export const Description = JSX<DescriptionProps>((props) => {
   const { className, description } = props;
 
-  return <div className={`font-normal text-base ${className || ''}`}>{description}</div>;
+  return <div className={`font-normal text-m-md ${className || ''}`}>{description}</div>;
 });

package/src/ui-kit/Description/{DescriptionProps.ts → DescriptionContent.ts}

@@ -2,7 +2,3 @@ export interface DescriptionContent {
   /** @title Описание */
   description?: string;
 }
-
-export interface DescriptionProps extends DescriptionContent {
-  className?: string;
-}

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

@@ -1,4 +1,3 @@
-import React from 'react';
 import { Heading } from './Heading';
 
 export default {

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

@@ -22,7 +22,7 @@ export const Heading = JSX<HeadingProps>((props) => {
   const Tag = headingType;
 
   return (
-    <Tag className={`font-sans font-medium ${HeadingClass[headingType]} ${className || ''}`}>
+    <Tag className={`font-sans font-medium m-0 ${HeadingClass[headingType]} ${className || ''}`}>
       {title}
     </Tag>
   );

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

@@ -22,7 +22,9 @@ export const Heading = JSX<HeadingProps>((props) => {
   const Tag = headingType;
 
   return (
-    <Tag className={`font-sans font-medium ${HEADING_STYLE_MAP[headingType]} ${className || ''}`}>
+    <Tag
+      className={`font-sans font-medium m-0 ${HEADING_STYLE_MAP[headingType]} ${className || ''}`}
+    >
       {title}
     </Tag>
   );

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

@@ -11,7 +11,7 @@ export interface ListItemProps {
   isDotted?: boolean;
 }
 
-const LIST_STYLE_CLASSES = 'rounded-full inline-block mr-3';
+const LIST_STYLE_CLASSES = 'rounded-full inline-block mr-3 mt-2';
 
 const TEXT_STYLE_MAP: Record<ListItemVersion, string> = {
   primary: 'text-primary-text',
@@ -28,9 +28,9 @@ const LIST_STYLE_MAP: Record<ListItemVersion, string> = {
 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 className={TEXT_STYLE_MAP[version]}>{children}</span>
+        <span className={`text-m-md ${TEXT_STYLE_MAP[version]}`}>{children}</span>
       </div>
     );
   },

package/src/ui-kit/SwipeListControl/SwipeListControlDots.tsx

@@ -15,7 +15,7 @@ export interface SwipeListControlDotsProps {
 export const SwipeListControlDots = JSX<SwipeListControlDotsProps>(
   ({ children, activeIndex, indexFraction, showDots }) => {
     return showDots && children?.length ? (
-      <div className="flex gap-2 mx-auto mt-[22px] w-fit">
+      <div className="flex gap-2 mx-auto mt-5 w-fit">
         {children?.map((_, idx) => (
           <div
             key={String(idx)}

package/src/ui-kit/SwipeListControl/SwipeListControlItem.tsx

@@ -12,7 +12,11 @@ export interface SwipeListControlItemProps {
 export const SwipeListControlItem = JSX<SwipeListControlItemProps>(
   ({ className = '', children, ...rest }) => {
     return (
-      <div className={`snap-center snap-always min-w-full ${className}`} role="listitem" {...rest}>
+      <div
+        className={`snap-center snap-always min-w-full box-border ${className}`}
+        role="listitem"
+        {...rest}
+      >
         {children}
       </div>
     );

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

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../types';
-import type { PlaceholderContent } from './PlaceholderContent';
-export interface PlaceholderProps extends PlaceholderContent, UniBlockProps {
-    className?: string;
-}
-export declare const Placeholder: (props: import("@redneckz/uni-jsx").PropsWithChildren<PlaceholderProps, any>, context?: any) => any;

package/dist/components/Placeholder/Placeholder.mobile.js

@@ -1,15 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Placeholder = void 0;
-const jsx_runtime_1 = require("@redneckz/uni-jsx/jsx-runtime");
-const uni_jsx_1 = require("@redneckz/uni-jsx");
-const Tile_1 = require("../Tile/Tile");
-const GOLDEN_RATIO = 1.618;
-exports.Placeholder = (0, uni_jsx_1.JSX)(({ className = '', context, title }) => {
-    return ((0, jsx_runtime_1.jsx)(Tile_1.Tile, { className: `pr-0 min-h-0 ${className}`, context: context, title: title, description: "\u0411\u043B\u043E\u043A \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043E\u0442\u043A\u0435...", children: (0, jsx_runtime_1.jsx)("figure", { className: "m-0", children: renderShimmer() }) }));
-});
-const renderShimmer = (size = 3) => goldenSequence(100, size)
-    .map((_) => Math.floor(_))
-    .map(renderShimmerItem);
-const renderShimmerItem = (width = 100, index) => ((0, jsx_runtime_1.jsx)("div", { style: { width: `${width}%` }, className: "h-4 mt-2 bg-secondary-light" }, String(index)));
-const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
-//# sourceMappingURL=Placeholder.mobile.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Placeholder.mobile.js","sourceRoot":"","sources":["../../../src/components/Placeholder/Placeholder.mobile.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AAExC,uCAAoC;AAOpC,MAAM,YAAY,GAAG,KAAK,CAAC;AAEd,QAAA,WAAW,GAAG,IAAA,aAAG,EAAmB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;IACtF,OAAO,CACL,uBAAC,WAAI,IACH,SAAS,EAAE,gBAAgB,SAAS,EAAE,EACtC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAC,iGAAsB,YAElC,mCAAQ,SAAS,EAAC,KAAK,YAAE,aAAa,EAAE,GAAU,GAC7C,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,aAAa,GAAG,CAAC,IAAI,GAAG,CAAC,EAAE,EAAE,CACjC,cAAc,CAAC,GAAG,EAAE,IAAI,CAAC;KACtB,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;KACzB,GAAG,CAAC,iBAAiB,CAAC,CAAC;AAE5B,MAAM,iBAAiB,GAAG,CAAC,KAAK,GAAG,GAAG,EAAE,KAAa,EAAE,EAAE,CAAC,CACxD,gCAAyB,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,GAAG,EAAE,EAAE,SAAS,EAAC,6BAA6B,IAArF,MAAM,CAAC,KAAK,CAAC,CAA2E,CACnG,CAAC;AAEF,MAAM,cAAc,GAAG,CAAC,KAAa,EAAE,IAAY,EAAY,EAAE,CAC/D,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,GAAG,YAAY,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC"}

package/dist/ui-kit/Description/DescriptionProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DescriptionProps.js","sourceRoot":"","sources":["../../../src/ui-kit/Description/DescriptionProps.ts"],"names":[],"mappings":""}

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

@@ -1,6 +0,0 @@
-import type { UniBlockProps } from '../../types';
-import type { PlaceholderContent } from './PlaceholderContent';
-export interface PlaceholderProps extends PlaceholderContent, UniBlockProps {
-    className?: string;
-}
-export declare const Placeholder: (props: import("@redneckz/uni-jsx").PropsWithChildren<PlaceholderProps, any>, context?: any) => any;

package/lib/components/Placeholder/Placeholder.mobile.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "@redneckz/uni-jsx/jsx-runtime";
-import { JSX } from '@redneckz/uni-jsx';
-import { Tile } from '../Tile/Tile.js';
-const GOLDEN_RATIO = 1.618;
-export const Placeholder = JSX(({ className = '', context, title }) => {
-    return (_jsx(Tile, { className: `pr-0 min-h-0 ${className}`, context: context, title: title, description: "\u0411\u043B\u043E\u043A \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043E\u0442\u043A\u0435...", children: _jsx("figure", { className: "m-0", children: renderShimmer() }) }));
-});
-const renderShimmer = (size = 3) => goldenSequence(100, size)
-    .map((_) => Math.floor(_))
-    .map(renderShimmerItem);
-const renderShimmerItem = (width = 100, index) => (_jsx("div", { style: { width: `${width}%` }, className: "h-4 mt-2 bg-secondary-light" }, String(index)));
-const goldenSequence = (first, size) => [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);
-//# sourceMappingURL=Placeholder.mobile.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Placeholder.mobile.js","sourceRoot":"","sources":["../../../src/components/Placeholder/Placeholder.mobile.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAExC,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAOpC,MAAM,YAAY,GAAG,KAAK,CAAC;AAE3B,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,CAAmB,CAAC,EAAE,SAAS,GAAG,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;IACtF,OAAO,CACL,KAAC,IAAI,IACH,SAAS,EAAE,gBAAgB,SAAS,EAAE,EACtC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAC,iGAAsB,YAElC,iBAAQ,SAAS,EAAC,KAAK,YAAE,aAAa,EAAE,GAAU,GAC7C,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,aAAa,GAAG,CAAC,IAAI,GAAG,CAAC,EAAE,EAAE,CACjC,cAAc,CAAC,GAAG,EAAE,IAAI,CAAC;KACtB,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;KACzB,GAAG,CAAC,iBAAiB,CAAC,CAAC;AAE5B,MAAM,iBAAiB,GAAG,CAAC,KAAK,GAAG,GAAG,EAAE,KAAa,EAAE,EAAE,CAAC,CACxD,cAAyB,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,GAAG,EAAE,EAAE,SAAS,EAAC,6BAA6B,IAArF,MAAM,CAAC,KAAK,CAAC,CAA2E,CACnG,CAAC;AAEF,MAAM,cAAc,GAAG,CAAC,KAAa,EAAE,IAAY,EAAY,EAAE,CAC/D,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,KAAK,GAAG,YAAY,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC"}

package/lib/ui-kit/Description/DescriptionProps.js

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

package/lib/ui-kit/Description/DescriptionProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DescriptionProps.js","sourceRoot":"","sources":["../../../src/ui-kit/Description/DescriptionProps.ts"],"names":[],"mappings":""}

package/mobile/dist/ui-kit/Description/DescriptionProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DescriptionProps.js","sourceRoot":"","sources":["../../../src/ui-kit/Description/DescriptionProps.ts"],"names":[],"mappings":""}

package/mobile/lib/ui-kit/Description/DescriptionProps.js

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

package/mobile/lib/ui-kit/Description/DescriptionProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DescriptionProps.js","sourceRoot":"","sources":["../../../src/ui-kit/Description/DescriptionProps.ts"],"names":[],"mappings":""}

package/src/components/Placeholder/Placeholder.mobile.tsx

@@ -1,35 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import type { UniBlockProps } from '../../types';
-import { Tile } from '../Tile/Tile';
-import type { PlaceholderContent } from './PlaceholderContent';
-
-export interface PlaceholderProps extends PlaceholderContent, UniBlockProps {
-  className?: string;
-}
-
-const GOLDEN_RATIO = 1.618;
-
-export const Placeholder = JSX<PlaceholderProps>(({ className = '', context, title }) => {
-  return (
-    <Tile
-      className={`pr-0 min-h-0 ${className}`}
-      context={context}
-      title={title}
-      description="Блок в разработке..."
-    >
-      <figure className="m-0">{renderShimmer()}</figure>
-    </Tile>
-  );
-});
-
-const renderShimmer = (size = 3) =>
-  goldenSequence(100, size)
-    .map((_) => Math.floor(_))
-    .map(renderShimmerItem);
-
-const renderShimmerItem = (width = 100, index: number) => (
-  <div key={String(index)} style={{ width: `${width}%` }} className="h-4 mt-2 bg-secondary-light" />
-);
-
-const goldenSequence = (first: number, size: number): number[] =>
-  [first].concat(size > 0 ? goldenSequence(first / GOLDEN_RATIO, size - 1) : []);