@redneckz/wildless-cms-uni-blocks 0.8.21 → 0.8.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/bundle/blocks.schema.json +1 -1
  2. package/bundle/bundle.umd.js +14 -43
  3. package/bundle/bundle.umd.min.js +1 -1
  4. package/bundle/components/StepsBlock/StepsBlock.d.ts +1 -1
  5. package/bundle/components/StepsBlock/StepsBlockContent.d.ts +2 -1
  6. package/bundle/components/StepsBlock/StepsBlockStyleMaps.d.ts +1 -2
  7. package/dist/components/StepsBlock/StepsBlock.d.ts +1 -1
  8. package/dist/components/StepsBlock/StepsBlock.js +11 -8
  9. package/dist/components/StepsBlock/StepsBlock.js.map +1 -1
  10. package/dist/components/StepsBlock/StepsBlock.mobile.js +2 -6
  11. package/dist/components/StepsBlock/StepsBlock.mobile.js.map +1 -1
  12. package/dist/components/StepsBlock/StepsBlockContent.d.ts +2 -1
  13. package/dist/components/StepsBlock/StepsBlockStyleMaps.d.ts +1 -2
  14. package/dist/components/StepsBlock/StepsBlockStyleMaps.js +7 -39
  15. package/dist/components/StepsBlock/StepsBlockStyleMaps.js.map +1 -1
  16. package/lib/common.css +1 -1
  17. package/lib/components/StepsBlock/StepsBlock.d.ts +1 -1
  18. package/lib/components/StepsBlock/StepsBlock.js +12 -9
  19. package/lib/components/StepsBlock/StepsBlock.js.map +1 -1
  20. package/lib/components/StepsBlock/StepsBlock.mobile.js +3 -7
  21. package/lib/components/StepsBlock/StepsBlock.mobile.js.map +1 -1
  22. package/lib/components/StepsBlock/StepsBlockContent.d.ts +2 -1
  23. package/lib/components/StepsBlock/StepsBlockStyleMaps.d.ts +1 -2
  24. package/lib/components/StepsBlock/StepsBlockStyleMaps.js +6 -38
  25. package/lib/components/StepsBlock/StepsBlockStyleMaps.js.map +1 -1
  26. package/mobile/bundle/bundle.umd.js +9 -45
  27. package/mobile/bundle/bundle.umd.min.js +1 -1
  28. package/mobile/bundle/components/StepsBlock/StepsBlockContent.d.ts +2 -1
  29. package/mobile/bundle/components/StepsBlock/StepsBlockStyleMaps.d.ts +1 -2
  30. package/mobile/dist/components/StepsBlock/StepsBlock.js +2 -6
  31. package/mobile/dist/components/StepsBlock/StepsBlock.js.map +1 -1
  32. package/mobile/dist/components/StepsBlock/StepsBlockContent.d.ts +2 -1
  33. package/mobile/dist/components/StepsBlock/StepsBlockStyleMaps.d.ts +1 -2
  34. package/mobile/dist/components/StepsBlock/StepsBlockStyleMaps.js +7 -39
  35. package/mobile/dist/components/StepsBlock/StepsBlockStyleMaps.js.map +1 -1
  36. package/mobile/lib/components/StepsBlock/StepsBlock.js +3 -7
  37. package/mobile/lib/components/StepsBlock/StepsBlock.js.map +1 -1
  38. package/mobile/lib/components/StepsBlock/StepsBlockContent.d.ts +2 -1
  39. package/mobile/lib/components/StepsBlock/StepsBlockStyleMaps.d.ts +1 -2
  40. package/mobile/lib/components/StepsBlock/StepsBlockStyleMaps.js +6 -38
  41. package/mobile/lib/components/StepsBlock/StepsBlockStyleMaps.js.map +1 -1
  42. package/mobile/src/components/Catalog/Catalog.ui.json +1 -0
  43. package/mobile/src/components/Gallery/Gallery.ui.json +1 -0
  44. package/mobile/src/components/MiniGallery/MiniGallery.ui.json +1 -0
  45. package/mobile/src/components/StepsBlock/StepsBlock.example.json +3 -1
  46. package/mobile/src/components/StepsBlock/StepsBlock.tsx +23 -27
  47. package/mobile/src/components/StepsBlock/StepsBlockContent.ts +2 -1
  48. package/mobile/src/components/StepsBlock/StepsBlockStyleMaps.ts +6 -40
  49. package/package.json +1 -1
  50. package/src/components/Catalog/Catalog.ui.json +1 -0
  51. package/src/components/Gallery/Gallery.ui.json +1 -0
  52. package/src/components/MiniGallery/MiniGallery.ui.json +1 -0
  53. package/src/components/StepsBlock/StepsBlock.example.json +3 -1
  54. package/src/components/StepsBlock/StepsBlock.fixture.tsx +4 -0
  55. package/src/components/StepsBlock/StepsBlock.mobile.tsx +23 -27
  56. package/src/components/StepsBlock/StepsBlock.tsx +34 -27
  57. package/src/components/StepsBlock/StepsBlockContent.ts +2 -1
  58. package/src/components/StepsBlock/StepsBlockStyleMaps.ts +6 -40
package/mobile/lib/components/StepsBlock/StepsBlock.js CHANGED
@@ -7,7 +7,7 @@ import { RichText } from '../../ui-kit/RichText/RichText.js';
7
7
  import { assertUnreachable } from '../../utils/assertUnreachable.js';
8
8
  import { getIconWithVersion } from '../../utils/getIconWithVersion.js';
9
9
  import { checkCanRenderIcon } from './checkCanRenderIcon.js';
10
- import { STEPS_BLOCK_STYLE_MAPS } from './StepsBlockStyleMaps.js';
10
+ import { STEPS_BLOCK_STYLE } from './StepsBlockStyleMaps.js';
11
11
  const STEPS_SIZE_MAP = {
12
12
  normal: 'h-[70px] w-[70px] min-w-[70px] min-h-[70px]',
13
13
  small: 'h-12 w-12 min-w-12 min-h-12',
@@ -16,10 +16,8 @@ const STEPS_TILE_DESCRIPTION_HEIGHT_MAP = {
16
16
  normal: 'min-h-[70px]',
17
17
  small: 'min-h-12',
18
18
  };
19
- export const StepsBlock = JSX(({ className = '', title, description, showLines = true, steps, size = 'normal', version = 'primary', ...rest }) => {
20
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
21
- return (_jsxs(BlockWrapper, { className: `box-border px-4 py-6 flex flex-col ${className}`, version: version, ...rest, children: [title ? _jsx(Heading, { headingType: "h3", className: "text-center", title: title }) : null, description ? (_jsx("p", { className: `text-m-light text-center ${styleMap.description} ${title ? 'mt-2' : ''}`, children: description })) : null, steps?.length ? (_jsx("div", { className: `box-border py-0.5 mb-0.5 mt-5`, children: _jsx("div", { className: "flex flex-col justify-between gap-x-[101px]", children: steps.map(renderStep(size, version, showLines)) }) })) : null] }));
22
- });
19
+ const styleMap = STEPS_BLOCK_STYLE;
20
+ export const StepsBlock = JSX(({ className = '', title, description, showLines = true, steps, size = 'normal', version = 'primary', ...rest }) => (_jsxs(BlockWrapper, { className: `box-border px-4 py-6 flex flex-col ${className}`, version: version, ...rest, children: [title ? _jsx(Heading, { headingType: "h3", className: "text-center", title: title }) : null, description ? (_jsx("p", { className: `text-m-light text-center ${styleMap.description} ${title ? 'mt-2' : ''}`, children: description })) : null, steps?.length ? (_jsx("div", { className: `box-border py-0.5 mb-0.5 mt-5`, children: _jsx("div", { className: "flex flex-col justify-between gap-x-[101px]", children: steps.map(renderStep(size, version, showLines)) }) })) : null] })));
23
21
  // TODO: Create universal function for this case
24
22
  const renderStep = (size, version, showLines) =>
25
23
  // Linter doesn't understand that switch processes all cases
@@ -41,11 +39,9 @@ const renderStep = (size, version, showLines) =>
41
39
  const renderDefaultStep = (size, version, showLines) => (step, i, steps) => {
42
40
  const isLastStep = steps.length - 1 === i;
43
41
  const margin = size === 'normal' ? 'ml-[34px]' : 'ml-6';
44
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
45
42
  return (_jsx("div", { children: _jsxs("div", { className: "flex flex-row text-center relative", children: [_jsxs("div", { className: "overflow-hidden flex-shrink-0", children: [renderIconArea(size, version)(step, i), isLastStep ? null : (_jsx("div", { className: `min-h-8 h-full w-0.5 ${showLines ? styleMap.iconConnector : ''} ${margin}` }))] }), _jsxs("div", { className: `flex flex-col justify-center h-fit ${STEPS_TILE_DESCRIPTION_HEIGHT_MAP[size]}`, children: [step.label ? (_jsx("div", { className: "text-m-title-xs font-medium m-0 text-left mb-1", children: step.label })) : null, step.description ? (_jsx("div", { className: `text-s ${styleMap.description} text-left`, children: step.description })) : null] })] }) }, String(i)));
46
43
  };
47
44
  const renderIconArea = (size, version) => (step, i) => {
48
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
49
45
  const iconAreaSize = STEPS_SIZE_MAP[size];
50
46
  const iconSize = size === 'normal' ? '38' : '27';
51
47
  const iconTextSize = size === 'normal' ? 'text-m-title' : 'text-m-title-xs';
package/mobile/lib/components/StepsBlock/StepsBlock.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"StepsBlock.js","sourceRoot":"","sources":["../../../src/components/StepsBlock/StepsBlock.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAIxC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AACvD,OAAO,EAAE,GAAG,EAAE,MAAM,sBAAsB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAI/D,MAAM,cAAc,GAAgC;IAClD,MAAM,EAAE,6CAA6C;IACrD,KAAK,EAAE,6BAA6B;CACrC,CAAC;AAEF,MAAM,iCAAiC,GAAgC;IACrE,MAAM,EAAE,cAAc;IACtB,KAAK,EAAE,UAAU;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAC3B,CAAC,EACC,SAAS,GAAG,EAAE,EACd,KAAK,EACL,WAAW,EACX,SAAS,GAAG,IAAI,EAChB,KAAK,EACL,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,SAAS,EACnB,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,QAAQ,GAAG,sBAAsB,CAAC,OAAO,CAAC,CAAC;IAEjD,OAAO,CACL,MAAC,YAAY,IACX,SAAS,EAAE,sCAAsC,SAAS,EAAE,EAC5D,OAAO,EAAE,OAAO,KACZ,IAAI,aAEP,KAAK,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,WAAW,EAAC,IAAI,EAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI,EACjF,WAAW,CAAC,CAAC,CAAC,CACb,YAAG,SAAS,EAAE,4BAA4B,QAAQ,CAAC,WAAW,IAAI,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,YACpF,WAAW,GACV,CACL,CAAC,CAAC,CAAC,IAAI,EACP,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CACf,cAAK,SAAS,EAAE,+BAA+B,YAC7C,cAAK,SAAS,EAAC,6CAA6C,YACzD,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,GAC5C,GACF,CACP,CAAC,CAAC,CAAC,IAAI,IACK,CAChB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gDAAgD;AAChD,MAAM,UAAU,GACd,CAAC,IAAiB,EAAE,OAAqB,EAAE,SAAkB,EAAE,EAAE;AACjE,4DAA4D;AAC5D,6CAA6C;AAC7C,CAAC,IAAU,EAAE,CAAS,EAAE,KAAa,EAAE,EAAE;IACvC,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IAEtB,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,KAAK,CAAC,EAAE;QAC3C,OAAO,IAAI,CAAC;KACb;IAED,QAAQ,IAAI,EAAE;QACZ,KAAK,SAAS;YACZ,OAAO,iBAAiB,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC;QACrE,KAAK,KAAK;YACR,OAAO,KAAC,QAAQ,IAAC,MAAM,EAAE,IAAI,CAAC,MAAM,GAAI,CAAC;QAC3C;YACE,iBAAiB,CAAC,IAAI,CAAC,CAAC;KAC3B;AACH,CAAC,CAAC;AAEJ,MAAM,iBAAiB,GACrB,CAAC,IAAiB,EAAE,OAAqB,EAAE,SAAkB,EAAE,EAAE,CACjE,CAAC,IAAiB,EAAE,CAAS,EAAE,KAAa,EAAE,EAAE;IAC9C,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,KAAK,CAAC,CAAC;IAC1C,MAAM,MAAM,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC;IACxD,MAAM,QAAQ,GAAG,sBAAsB,CAAC,OAAO,CAAC,CAAC;IAEjD,OAAO,CACL,wBACE,eAAK,SAAS,EAAC,oCAAoC,aACjD,eAAK,SAAS,EAAC,+BAA+B,aAC3C,cAAc,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,EACtC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACnB,cACE,SAAS,EAAE,wBACT,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,EACvC,IAAI,MAAM,EAAE,GACZ,CACH,IACG,EACN,eACE,SAAS,EAAE,sCAAsC,iCAAiC,CAAC,IAAI,CAAC,EAAE,aAEzF,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACZ,cAAK,SAAS,EAAC,gDAAgD,YAAE,IAAI,CAAC,KAAK,GAAO,CACnF,CAAC,CAAC,CAAC,IAAI,EACP,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAClB,cAAK,SAAS,EAAE,UAAU,QAAQ,CAAC,WAAW,YAAY,YAAG,IAAI,CAAC,WAAW,GAAO,CACrF,CAAC,CAAC,CAAC,IAAI,IACJ,IACF,IAtBE,MAAM,CAAC,CAAC,CAAC,CAuBb,CACP,CAAC;AACJ,CAAC,CAAC;AAEJ,MAAM,cAAc,GAAG,CAAC,IAAiB,EAAE,OAAqB,EAAE,EAAE,CAAC,CAAC,IAAU,EAAE,CAAS,EAAE,EAAE;IAC7F,MAAM,QAAQ,GAAG,sBAAsB,CAAC,OAAO,CAAC,CAAC;IACjD,MAAM,YAAY,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;IAE1C,MAAM,QAAQ,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IACjD,MAAM,YAAY,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,iBAAiB,CAAC;IAE5E,OAAO,CACL,cACE,SAAS,EAAE,GAAG,YAAY,IAAI,QAAQ,CAAC,cAAc,4DAA4D,YAEjH,eAAM,SAAS,EAAE,gCAAgC,YAAY,EAAE,YAC5D,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAChC,KAAC,GAAG,IACF,KAAK,EAAE,kBAAkB,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,OAAO,CAAC,EACpD,KAAK,EAAE,QAAQ,EACf,MAAM,EAAE,QAAQ,EAChB,KAAK,SACL,CACH,CAAC,CAAC,CAAC,CACF,yBAAO,CAAC,GAAG,CAAC,GAAQ,CACrB,GACI,GACH,CACP,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"StepsBlock.js","sourceRoot":"","sources":["../../../src/components/StepsBlock/StepsBlock.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAIxC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AACvD,OAAO,EAAE,GAAG,EAAE,MAAM,sBAAsB,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAI1D,MAAM,cAAc,GAAgC;IAClD,MAAM,EAAE,6CAA6C;IACrD,KAAK,EAAE,6BAA6B;CACrC,CAAC;AAEF,MAAM,iCAAiC,GAAgC;IACrE,MAAM,EAAE,cAAc;IACtB,KAAK,EAAE,UAAU;CAClB,CAAC;AAEF,MAAM,QAAQ,GAAG,iBAAiB,CAAC;AAEnC,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAC3B,CAAC,EACC,SAAS,GAAG,EAAE,EACd,KAAK,EACL,WAAW,EACX,SAAS,GAAG,IAAI,EAChB,KAAK,EACL,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,SAAS,EACnB,GAAG,IAAI,EACR,EAAE,EAAE,CAAC,CACJ,MAAC,YAAY,IACX,SAAS,EAAE,sCAAsC,SAAS,EAAE,EAC5D,OAAO,EAAE,OAAO,KACZ,IAAI,aAEP,KAAK,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,WAAW,EAAC,IAAI,EAAC,SAAS,EAAC,aAAa,EAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI,EACjF,WAAW,CAAC,CAAC,CAAC,CACb,YAAG,SAAS,EAAE,4BAA4B,QAAQ,CAAC,WAAW,IAAI,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,YACpF,WAAW,GACV,CACL,CAAC,CAAC,CAAC,IAAI,EACP,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,CACf,cAAK,SAAS,EAAE,+BAA+B,YAC7C,cAAK,SAAS,EAAC,6CAA6C,YACzD,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,GAC5C,GACF,CACP,CAAC,CAAC,CAAC,IAAI,IACK,CAChB,CACF,CAAC;AAEF,gDAAgD;AAChD,MAAM,UAAU,GACd,CAAC,IAAiB,EAAE,OAAqB,EAAE,SAAkB,EAAE,EAAE;AACjE,4DAA4D;AAC5D,6CAA6C;AAC7C,CAAC,IAAU,EAAE,CAAS,EAAE,KAAa,EAAE,EAAE;IACvC,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IAEtB,IAAI,CAAC,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,KAAK,CAAC,EAAE;QAC3C,OAAO,IAAI,CAAC;KACb;IAED,QAAQ,IAAI,EAAE;QACZ,KAAK,SAAS;YACZ,OAAO,iBAAiB,CAAC,IAAI,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC;QACrE,KAAK,KAAK;YACR,OAAO,KAAC,QAAQ,IAAC,MAAM,EAAE,IAAI,CAAC,MAAM,GAAI,CAAC;QAC3C;YACE,iBAAiB,CAAC,IAAI,CAAC,CAAC;KAC3B;AACH,CAAC,CAAC;AAEJ,MAAM,iBAAiB,GACrB,CAAC,IAAiB,EAAE,OAAqB,EAAE,SAAkB,EAAE,EAAE,CACjE,CAAC,IAAiB,EAAE,CAAS,EAAE,KAAa,EAAE,EAAE;IAC9C,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,KAAK,CAAC,CAAC;IAC1C,MAAM,MAAM,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC;IAExD,OAAO,CACL,wBACE,eAAK,SAAS,EAAC,oCAAoC,aACjD,eAAK,SAAS,EAAC,+BAA+B,aAC3C,cAAc,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,EACtC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACnB,cACE,SAAS,EAAE,wBACT,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,EACvC,IAAI,MAAM,EAAE,GACZ,CACH,IACG,EACN,eACE,SAAS,EAAE,sCAAsC,iCAAiC,CAAC,IAAI,CAAC,EAAE,aAEzF,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACZ,cAAK,SAAS,EAAC,gDAAgD,YAAE,IAAI,CAAC,KAAK,GAAO,CACnF,CAAC,CAAC,CAAC,IAAI,EACP,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAClB,cAAK,SAAS,EAAE,UAAU,QAAQ,CAAC,WAAW,YAAY,YAAG,IAAI,CAAC,WAAW,GAAO,CACrF,CAAC,CAAC,CAAC,IAAI,IACJ,IACF,IAtBE,MAAM,CAAC,CAAC,CAAC,CAuBb,CACP,CAAC;AACJ,CAAC,CAAC;AAEJ,MAAM,cAAc,GAAG,CAAC,IAAiB,EAAE,OAAqB,EAAE,EAAE,CAAC,CAAC,IAAU,EAAE,CAAS,EAAE,EAAE;IAC7F,MAAM,YAAY,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;IAE1C,MAAM,QAAQ,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IACjD,MAAM,YAAY,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,iBAAiB,CAAC;IAE5E,OAAO,CACL,cACE,SAAS,EAAE,GAAG,YAAY,IAAI,QAAQ,CAAC,cAAc,4DAA4D,YAEjH,eAAM,SAAS,EAAE,gCAAgC,YAAY,EAAE,YAC5D,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAChC,KAAC,GAAG,IACF,KAAK,EAAE,kBAAkB,CAAC,EAAE,GAAG,IAAI,CAAC,IAAI,EAAE,EAAE,OAAO,CAAC,EACpD,KAAK,EAAE,QAAQ,EACf,MAAM,EAAE,QAAQ,EAChB,KAAK,SACL,CACH,CAAC,CAAC,CAAC,CACF,yBAAO,CAAC,GAAG,CAAC,GAAQ,CACrB,GACI,GACH,CACP,CAAC;AACJ,CAAC,CAAC"}
package/mobile/lib/components/StepsBlock/StepsBlockContent.d.ts CHANGED
@@ -43,10 +43,11 @@ export declare type StepsBlockContent = HeadlineCommonProps & {
43
43
  * @maxItems 5
44
44
  */
45
45
  steps?: Step[];
46
+ stepVersion?: BlockVersion;
46
47
  /** @title Кнопка */
47
48
  button?: ButtonWithIconProps;
48
49
  /**
49
- * @title Размер шагов (моб.)
50
+ * @title Размер шагов
50
51
  * @default normal
51
52
  */
52
53
  size?: SizeVersion;
package/mobile/lib/components/StepsBlock/StepsBlockStyleMaps.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- import type { BlockVersion } from '../../model/BlockVersion';
2
1
  export declare type StyleType = {
3
2
  description: string;
4
3
  iconText: string;
@@ -6,4 +5,4 @@ export declare type StyleType = {
6
5
  iconConnector: string;
7
6
  dot: string;
8
7
  };
9
- export declare const STEPS_BLOCK_STYLE_MAPS: Record<BlockVersion, StyleType>;
8
+ export declare const STEPS_BLOCK_STYLE: StyleType;
package/mobile/lib/components/StepsBlock/StepsBlockStyleMaps.js CHANGED
@@ -1,40 +1,8 @@
1
- export const STEPS_BLOCK_STYLE_MAPS = {
2
- primary: {
3
- description: '!text-secondary-text text-l-light',
4
- iconText: 'text-secondary-text',
5
- iconBackground: 'bg-main-divider',
6
- iconConnector: 'bg-secondary-light',
7
- dot: 'bg-secondary-text',
8
- },
9
- secondary: {
10
- description: '!text-white/80 text-l-light',
11
- iconText: 'text-white',
12
- iconBackground: 'bg-white/30',
13
- iconConnector: 'bg-white',
14
- dot: 'bg-white/80',
15
- },
16
- gray: {
17
- // TODO Replace this Map with group-data-*
18
- description: '!text-white/80 text-l-light',
19
- iconText: 'text-white',
20
- iconBackground: 'bg-white/30',
21
- iconConnector: 'bg-white',
22
- dot: 'bg-white/80',
23
- },
24
- transparent: {
25
- description: '!text-white/80 text-l-light',
26
- iconText: 'text-white',
27
- iconBackground: 'bg-white/30',
28
- iconConnector: 'bg-white',
29
- dot: 'bg-white/80',
30
- },
31
- '': {
32
- // TODO Replace this Map with group-data-*
33
- description: '!text-white/80 text-l-light',
34
- iconText: 'text-white',
35
- iconBackground: 'bg-white/30',
36
- iconConnector: 'bg-white',
37
- dot: 'bg-white/80',
38
- },
1
+ export const STEPS_BLOCK_STYLE = {
2
+ description: 'text-white/80 text-l-light group-data-primary:text-secondary-text',
3
+ iconText: 'text-white group-data-primary:text-secondary-text',
4
+ iconBackground: 'bg-white/30 group-data-primary:bg-main-divider',
5
+ iconConnector: 'bg-white group-data-primary:bg-secondary-light',
6
+ dot: 'bg-white/80 group-data-primary:bg-secondary-text',
39
7
  };
40
8
  //# sourceMappingURL=StepsBlockStyleMaps.js.map
package/mobile/lib/components/StepsBlock/StepsBlockStyleMaps.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"StepsBlockStyleMaps.js","sourceRoot":"","sources":["../../../src/components/StepsBlock/StepsBlockStyleMaps.ts"],"names":[],"mappings":"AAUA,MAAM,CAAC,MAAM,sBAAsB,GAAoC;IACrE,OAAO,EAAE;QACP,WAAW,EAAE,mCAAmC;QAChD,QAAQ,EAAE,qBAAqB;QAC/B,cAAc,EAAE,iBAAiB;QACjC,aAAa,EAAE,oBAAoB;QACnC,GAAG,EAAE,mBAAmB;KACzB;IACD,SAAS,EAAE;QACT,WAAW,EAAE,6BAA6B;QAC1C,QAAQ,EAAE,YAAY;QACtB,cAAc,EAAE,aAAa;QAC7B,aAAa,EAAE,UAAU;QACzB,GAAG,EAAE,aAAa;KACnB;IACD,IAAI,EAAE;QACJ,0CAA0C;QAC1C,WAAW,EAAE,6BAA6B;QAC1C,QAAQ,EAAE,YAAY;QACtB,cAAc,EAAE,aAAa;QAC7B,aAAa,EAAE,UAAU;QACzB,GAAG,EAAE,aAAa;KACnB;IACD,WAAW,EAAE;QACX,WAAW,EAAE,6BAA6B;QAC1C,QAAQ,EAAE,YAAY;QACtB,cAAc,EAAE,aAAa;QAC7B,aAAa,EAAE,UAAU;QACzB,GAAG,EAAE,aAAa;KACnB;IACD,EAAE,EAAE;QACF,0CAA0C;QAC1C,WAAW,EAAE,6BAA6B;QAC1C,QAAQ,EAAE,YAAY;QACtB,cAAc,EAAE,aAAa;QAC7B,aAAa,EAAE,UAAU;QACzB,GAAG,EAAE,aAAa;KACnB;CACF,CAAC"}
1
+ {"version":3,"file":"StepsBlockStyleMaps.js","sourceRoot":"","sources":["../../../src/components/StepsBlock/StepsBlockStyleMaps.ts"],"names":[],"mappings":"AAQA,MAAM,CAAC,MAAM,iBAAiB,GAAc;IAC1C,WAAW,EAAE,mEAAmE;IAChF,QAAQ,EAAE,mDAAmD;IAC7D,cAAc,EAAE,gDAAgD;IAChE,aAAa,EAAE,gDAAgD;IAC/D,GAAG,EAAE,kDAAkD;CACxD,CAAC"}
package/mobile/src/components/StepsBlock/StepsBlock.example.json CHANGED
@@ -4,6 +4,8 @@
4
4
  "title": "Шаги",
5
5
  "description": "Описание",
6
6
  "showLines": true,
7
+ "size": "normal",
8
+ "stepVersion": "gray",
7
9
  "steps": [
8
10
  {
9
11
  "label": "Шаг №1",
@@ -20,7 +22,7 @@
20
22
  "text": "Кнопка",
21
23
  "target": "_blank",
22
24
  "version": "primary"
23
- }
25
+ }
24
26
  },
25
27
  {
26
28
  "label": "Шаг №2",
package/mobile/src/components/StepsBlock/StepsBlock.tsx CHANGED
@@ -10,7 +10,7 @@ import { assertUnreachable } from '../../utils/assertUnreachable';
10
10
  import { getIconWithVersion } from '../../utils/getIconWithVersion';
11
11
  import { checkCanRenderIcon } from './checkCanRenderIcon';
12
12
  import type { DefaultStep, Step, StepsBlockContent } from './StepsBlockContent';
13
- import { STEPS_BLOCK_STYLE_MAPS } from './StepsBlockStyleMaps';
13
+ import { STEPS_BLOCK_STYLE } from './StepsBlockStyleMaps';
14
14
 
15
15
  export interface StepsBlockProps extends StepsBlockContent, UniBlockProps {}
16
16
 
@@ -24,6 +24,8 @@ const STEPS_TILE_DESCRIPTION_HEIGHT_MAP: Record<SizeVersion, string> = {
24
24
  small: 'min-h-12',
25
25
  };
26
26
 
27
+ const styleMap = STEPS_BLOCK_STYLE;
28
+
27
29
  export const StepsBlock = JSX<StepsBlockProps>(
28
30
  ({
29
31
  className = '',
@@ -34,31 +36,27 @@ export const StepsBlock = JSX<StepsBlockProps>(
34
36
  size = 'normal',
35
37
  version = 'primary',
36
38
  ...rest
37
- }) => {
38
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
39
-
40
- return (
41
- <BlockWrapper
42
- className={`box-border px-4 py-6 flex flex-col ${className}`}
43
- version={version}
44
- {...rest}
45
- >
46
- {title ? <Heading headingType="h3" className="text-center" title={title} /> : null}
47
- {description ? (
48
- <p className={`text-m-light text-center ${styleMap.description} ${title ? 'mt-2' : ''}`}>
49
- {description}
50
- </p>
51
- ) : null}
52
- {steps?.length ? (
53
- <div className={`box-border py-0.5 mb-0.5 mt-5`}>
54
- <div className="flex flex-col justify-between gap-x-[101px]">
55
- {steps.map(renderStep(size, version, showLines))}
56
- </div>
39
+ }) => (
40
+ <BlockWrapper
41
+ className={`box-border px-4 py-6 flex flex-col ${className}`}
42
+ version={version}
43
+ {...rest}
44
+ >
45
+ {title ? <Heading headingType="h3" className="text-center" title={title} /> : null}
46
+ {description ? (
47
+ <p className={`text-m-light text-center ${styleMap.description} ${title ? 'mt-2' : ''}`}>
48
+ {description}
49
+ </p>
50
+ ) : null}
51
+ {steps?.length ? (
52
+ <div className={`box-border py-0.5 mb-0.5 mt-5`}>
53
+ <div className="flex flex-col justify-between gap-x-[101px]">
54
+ {steps.map(renderStep(size, version, showLines))}
57
55
  </div>
58
- ) : null}
59
- </BlockWrapper>
60
- );
61
- },
56
+ </div>
57
+ ) : null}
58
+ </BlockWrapper>
59
+ ),
62
60
  );
63
61
 
64
62
  // TODO: Create universal function for this case
@@ -88,7 +86,6 @@ const renderDefaultStep =
88
86
  (step: DefaultStep, i: number, steps: Step[]) => {
89
87
  const isLastStep = steps.length - 1 === i;
90
88
  const margin = size === 'normal' ? 'ml-[34px]' : 'ml-6';
91
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
92
89
 
93
90
  return (
94
91
  <div key={String(i)}>
@@ -119,7 +116,6 @@ const renderDefaultStep =
119
116
  };
120
117
 
121
118
  const renderIconArea = (size: SizeVersion, version: BlockVersion) => (step: Step, i: number) => {
122
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
123
119
  const iconAreaSize = STEPS_SIZE_MAP[size];
124
120
 
125
121
  const iconSize = size === 'normal' ? '38' : '27';
package/mobile/src/components/StepsBlock/StepsBlockContent.ts CHANGED
@@ -48,10 +48,11 @@ export type StepsBlockContent = HeadlineCommonProps & {
48
48
  * @maxItems 5
49
49
  */
50
50
  steps?: Step[];
51
+ stepVersion?: BlockVersion;
51
52
  /** @title Кнопка */
52
53
  button?: ButtonWithIconProps;
53
54
  /**
54
- * @title Размер шагов (моб.)
55
+ * @title Размер шагов
55
56
  * @default normal
56
57
  */
57
58
  size?: SizeVersion; // TODO: mobile content
package/mobile/src/components/StepsBlock/StepsBlockStyleMaps.ts CHANGED
@@ -1,5 +1,3 @@
1
- import type { BlockVersion } from '../../model/BlockVersion';
2
-
3
1
  export type StyleType = {
4
2
  description: string;
5
3
  iconText: string;
@@ -8,42 +6,10 @@ export type StyleType = {
8
6
  dot: string;
9
7
  };
10
8
 
11
- export const STEPS_BLOCK_STYLE_MAPS: Record<BlockVersion, StyleType> = {
12
- primary: {
13
- description: '!text-secondary-text text-l-light',
14
- iconText: 'text-secondary-text',
15
- iconBackground: 'bg-main-divider',
16
- iconConnector: 'bg-secondary-light',
17
- dot: 'bg-secondary-text',
18
- },
19
- secondary: {
20
- description: '!text-white/80 text-l-light',
21
- iconText: 'text-white',
22
- iconBackground: 'bg-white/30',
23
- iconConnector: 'bg-white',
24
- dot: 'bg-white/80',
25
- },
26
- gray: {
27
- // TODO Replace this Map with group-data-*
28
- description: '!text-white/80 text-l-light',
29
- iconText: 'text-white',
30
- iconBackground: 'bg-white/30',
31
- iconConnector: 'bg-white',
32
- dot: 'bg-white/80',
33
- },
34
- transparent: {
35
- description: '!text-white/80 text-l-light',
36
- iconText: 'text-white',
37
- iconBackground: 'bg-white/30',
38
- iconConnector: 'bg-white',
39
- dot: 'bg-white/80',
40
- },
41
- '': {
42
- // TODO Replace this Map with group-data-*
43
- description: '!text-white/80 text-l-light',
44
- iconText: 'text-white',
45
- iconBackground: 'bg-white/30',
46
- iconConnector: 'bg-white',
47
- dot: 'bg-white/80',
48
- },
9
+ export const STEPS_BLOCK_STYLE: StyleType = {
10
+ description: 'text-white/80 text-l-light group-data-primary:text-secondary-text',
11
+ iconText: 'text-white group-data-primary:text-secondary-text',
12
+ iconBackground: 'bg-white/30 group-data-primary:bg-main-divider',
13
+ iconConnector: 'bg-white group-data-primary:bg-secondary-light',
14
+ dot: 'bg-white/80 group-data-primary:bg-secondary-text',
49
15
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redneckz/wildless-cms-uni-blocks",
3
- "version": "0.8.21",
3
+ "version": "0.8.22",
4
4
  "private": false,
5
5
  "license": "MIT",
6
6
  "author": "ЦК",
package/src/components/Catalog/Catalog.ui.json ADDED
@@ -0,0 +1 @@
1
+ {}
package/src/components/Gallery/Gallery.ui.json ADDED
@@ -0,0 +1 @@
1
+ {}
package/src/components/StepsBlock/StepsBlock.example.json CHANGED
@@ -4,6 +4,8 @@
4
4
  "title": "Шаги",
5
5
  "description": "Описание",
6
6
  "showLines": true,
7
+ "size": "normal",
8
+ "stepVersion": "gray",
7
9
  "steps": [
8
10
  {
9
11
  "label": "Шаг №1",
@@ -20,7 +22,7 @@
20
22
  "text": "Кнопка",
21
23
  "target": "_blank",
22
24
  "version": "primary"
23
- }
25
+ }
24
26
  },
25
27
  {
26
28
  "label": "Шаг №2",
package/src/components/StepsBlock/StepsBlock.fixture.tsx CHANGED
@@ -65,6 +65,7 @@ const BUTTONS: DefaultStep['button'][] = [
65
65
  const STEPS_WITH_BUTTONS_AND_ICONS: Step[] = STEPS_WITH_ICONS.map((step, i) => ({
66
66
  ...step,
67
67
  button: BUTTONS[i],
68
+ stepVersion: 'primary',
68
69
  }));
69
70
 
70
71
  const STEPS_WITH_LIST_PROPS: StepsBlockProps = {
@@ -75,6 +76,7 @@ const STEPS_WITH_LIST_PROPS: StepsBlockProps = {
75
76
  const STEPS_WITH_LIST_AND_DESC_PROPS: StepsBlockProps = {
76
77
  ...COMMON_PROPS,
77
78
  steps: STEPS_WITH_ICONS.map((step) => ({ ...step, items: ITEMS })),
79
+ stepVersion: 'secondary',
78
80
  };
79
81
 
80
82
  const STEPS_WITH_BUTTON_PROPS: StepsBlockProps = {
@@ -84,6 +86,8 @@ const STEPS_WITH_BUTTON_PROPS: StepsBlockProps = {
84
86
  button: { text: 'Оформить' },
85
87
  })),
86
88
  title: TITLE,
89
+ stepVersion: 'primary',
90
+ size: 'small',
87
91
  };
88
92
 
89
93
  export default {
package/src/components/StepsBlock/StepsBlock.mobile.tsx CHANGED
@@ -10,7 +10,7 @@ import { assertUnreachable } from '../../utils/assertUnreachable';
10
10
  import { getIconWithVersion } from '../../utils/getIconWithVersion';
11
11
  import { checkCanRenderIcon } from './checkCanRenderIcon';
12
12
  import type { DefaultStep, Step, StepsBlockContent } from './StepsBlockContent';
13
- import { STEPS_BLOCK_STYLE_MAPS } from './StepsBlockStyleMaps';
13
+ import { STEPS_BLOCK_STYLE } from './StepsBlockStyleMaps';
14
14
 
15
15
  export interface StepsBlockProps extends StepsBlockContent, UniBlockProps {}
16
16
 
@@ -24,6 +24,8 @@ const STEPS_TILE_DESCRIPTION_HEIGHT_MAP: Record<SizeVersion, string> = {
24
24
  small: 'min-h-12',
25
25
  };
26
26
 
27
+ const styleMap = STEPS_BLOCK_STYLE;
28
+
27
29
  export const StepsBlock = JSX<StepsBlockProps>(
28
30
  ({
29
31
  className = '',
@@ -34,31 +36,27 @@ export const StepsBlock = JSX<StepsBlockProps>(
34
36
  size = 'normal',
35
37
  version = 'primary',
36
38
  ...rest
37
- }) => {
38
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
39
-
40
- return (
41
- <BlockWrapper
42
- className={`box-border px-4 py-6 flex flex-col ${className}`}
43
- version={version}
44
- {...rest}
45
- >
46
- {title ? <Heading headingType="h3" className="text-center" title={title} /> : null}
47
- {description ? (
48
- <p className={`text-m-light text-center ${styleMap.description} ${title ? 'mt-2' : ''}`}>
49
- {description}
50
- </p>
51
- ) : null}
52
- {steps?.length ? (
53
- <div className={`box-border py-0.5 mb-0.5 mt-5`}>
54
- <div className="flex flex-col justify-between gap-x-[101px]">
55
- {steps.map(renderStep(size, version, showLines))}
56
- </div>
39
+ }) => (
40
+ <BlockWrapper
41
+ className={`box-border px-4 py-6 flex flex-col ${className}`}
42
+ version={version}
43
+ {...rest}
44
+ >
45
+ {title ? <Heading headingType="h3" className="text-center" title={title} /> : null}
46
+ {description ? (
47
+ <p className={`text-m-light text-center ${styleMap.description} ${title ? 'mt-2' : ''}`}>
48
+ {description}
49
+ </p>
50
+ ) : null}
51
+ {steps?.length ? (
52
+ <div className={`box-border py-0.5 mb-0.5 mt-5`}>
53
+ <div className="flex flex-col justify-between gap-x-[101px]">
54
+ {steps.map(renderStep(size, version, showLines))}
57
55
  </div>
58
- ) : null}
59
- </BlockWrapper>
60
- );
61
- },
56
+ </div>
57
+ ) : null}
58
+ </BlockWrapper>
59
+ ),
62
60
  );
63
61
 
64
62
  // TODO: Create universal function for this case
@@ -88,7 +86,6 @@ const renderDefaultStep =
88
86
  (step: DefaultStep, i: number, steps: Step[]) => {
89
87
  const isLastStep = steps.length - 1 === i;
90
88
  const margin = size === 'normal' ? 'ml-[34px]' : 'ml-6';
91
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
92
89
 
93
90
  return (
94
91
  <div key={String(i)}>
@@ -119,7 +116,6 @@ const renderDefaultStep =
119
116
  };
120
117
 
121
118
  const renderIconArea = (size: SizeVersion, version: BlockVersion) => (step: Step, i: number) => {
122
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
123
119
  const iconAreaSize = STEPS_SIZE_MAP[size];
124
120
 
125
121
  const iconSize = size === 'normal' ? '38' : '27';
package/src/components/StepsBlock/StepsBlock.tsx CHANGED
@@ -1,18 +1,18 @@
1
1
  import { JSX } from '@redneckz/uni-jsx';
2
- import type { BlockVersion } from '../../model/BlockVersion';
3
- import type { UniBlockProps } from '../../model/JSXBlock';
4
2
  import { BlockWrapper } from '../../ui-kit/BlockWrapper';
5
- import { Button } from '../../ui-kit/Button/Button';
3
+ import { checkCanRenderIcon } from './checkCanRenderIcon';
4
+ import { getIconWithVersion } from '../../utils/getIconWithVersion';
6
5
  import { Heading } from '../../ui-kit/Heading/Heading';
7
6
  import { Img } from '../../ui-kit/Img/Img';
8
- import { getIconWithVersion } from '../../utils/getIconWithVersion';
9
7
  import { joinList } from '../../utils/joinList';
10
- import { style } from '../../utils/style';
11
- import { checkCanRenderIcon } from './checkCanRenderIcon';
8
+ import { renderButtonsSection } from '../../ui-kit/Button/renderButtonsSection';
12
9
  import { renderStep } from './renderStep';
10
+ import { STEPS_BLOCK_STYLE } from './StepsBlockStyleMaps';
11
+ import { style } from '../../utils/style';
12
+ import type { BlockVersion } from '../../model/BlockVersion';
13
13
  import type { Step, StepsBlockContent } from './StepsBlockContent';
14
14
  import type { StyleType } from './StepsBlockStyleMaps';
15
- import { STEPS_BLOCK_STYLE_MAPS } from './StepsBlockStyleMaps';
15
+ import type { UniBlockProps } from '../../model/JSXBlock';
16
16
 
17
17
  export interface StepsBlockProps extends StepsBlockContent, UniBlockProps {}
18
18
 
@@ -26,13 +26,15 @@ export const StepsBlock = JSX<StepsBlockProps>(
26
26
  showLines = true,
27
27
  steps = [],
28
28
  button,
29
+ size = 'normal',
29
30
  version = 'primary',
31
+ stepVersion = 'gray',
30
32
  title,
31
33
  ...rest
32
34
  }) => {
33
35
  const shortGaps = steps.length > 3;
34
36
 
35
- const styleMap = STEPS_BLOCK_STYLE_MAPS[version];
37
+ const styleMap = STEPS_BLOCK_STYLE;
36
38
 
37
39
  const lineOpacity = getLineOpacity(showLines);
38
40
  const paddingX = getPaddingX(steps.length);
@@ -49,14 +51,14 @@ export const StepsBlock = JSX<StepsBlockProps>(
49
51
  {...rest}
50
52
  >
51
53
  {title ? (
52
- <Heading headingType="h3" className="max-w-[752px] text-center mb-9" title={title} />
54
+ <Heading headingType="h4" className="max-w-[752px] text-center mb-9" title={title} />
53
55
  ) : null}
54
56
  {steps?.length ? (
55
57
  <div className="box-border">
56
58
  <div className={style('flex items-center', paddingX)}>
57
- {joinList(<div className={style('h-0.5 w-full bg-secondary-light', lineOpacity)} />)(
58
- steps.map(renderStepIcon(styleMap, version)),
59
- )}
59
+ {joinList(
60
+ <div className={style('h-0.5 w-full bg-secondary-light flex-1', lineOpacity)} />,
61
+ )(steps.map(renderStepIcon(styleMap, size, stepVersion)))}
60
62
  </div>
61
63
  <div
62
64
  className={style(
@@ -68,25 +70,30 @@ export const StepsBlock = JSX<StepsBlockProps>(
68
70
  </div>
69
71
  </div>
70
72
  ) : null}
71
- {button?.text ? <Button className="mt-8 min-w-60" version="primary" {...button} /> : null}
73
+ {button?.text ? renderButtonsSection([button], { className: 'mt-8 min-w-60' }) : null}
72
74
  </BlockWrapper>
73
75
  );
74
76
  },
75
77
  );
76
78
 
77
79
  const renderStepIcon =
78
- (styleMap: StyleType, version?: BlockVersion) =>
79
- ({ icon }: Step, i: number) =>
80
- (
81
- <div key={String(i)} className="flex flex-col items-center text-center">
82
- <div
83
- className={`h-[100px] w-[100px] min-w-[100px] min-h-[100px] rounded-full p-[26px] box-border z-10 flex justify-center items-center ${styleMap.iconBackground}`}
84
- >
85
- {checkCanRenderIcon(icon) ? (
86
- <Img image={getIconWithVersion(icon || {}, version)} width="48" height="48" asSVG />
87
- ) : (
88
- <span className={`text-h4 ${styleMap.iconText}`}>{i + 1}</span>
89
- )}
90
- </div>
91
- </div>
80
+ (styleMap: StyleType, size: string, stepVersion: BlockVersion) =>
81
+ ({ icon }: Step, i: number) => {
82
+ const styleStepIconSize = size === 'normal' ? 'h-[100px] w-[100px]' : 'h-[63px] w-[63px]';
83
+
84
+ return (
85
+ <BlockWrapper
86
+ key={String(i)}
87
+ className={`${styleStepIconSize} flex justify-center items-center text-center rounded-full p-[26px] box-border z-10`}
88
+ version={stepVersion}
89
+ >
90
+ {checkCanRenderIcon(icon) ? (
91
+ <Img image={getIconWithVersion(icon || {}, stepVersion)} width="48" height="48" asSVG />
92
+ ) : (
93
+ <span className={`text-h4 group-data-transparent:${styleMap.iconText} text-primary-text`}>
94
+ {i + 1}
95
+ </span>
96
+ )}
97
+ </BlockWrapper>
92
98
  );
99
+ };
package/src/components/StepsBlock/StepsBlockContent.ts CHANGED
@@ -48,10 +48,11 @@ export type StepsBlockContent = HeadlineCommonProps & {
48
48
  * @maxItems 5
49
49
  */
50
50
  steps?: Step[];
51
+ stepVersion?: BlockVersion;
51
52
  /** @title Кнопка */
52
53
  button?: ButtonWithIconProps;
53
54
  /**
54
- * @title Размер шагов (моб.)
55
+ * @title Размер шагов
55
56
  * @default normal
56
57
  */
57
58
  size?: SizeVersion; // TODO: mobile content
package/src/components/StepsBlock/StepsBlockStyleMaps.ts CHANGED
@@ -1,5 +1,3 @@
1
- import type { BlockVersion } from '../../model/BlockVersion';
2
-
3
1
  export type StyleType = {
4
2
  description: string;
5
3
  iconText: string;
@@ -8,42 +6,10 @@ export type StyleType = {
8
6
  dot: string;
9
7
  };
10
8
 
11
- export const STEPS_BLOCK_STYLE_MAPS: Record<BlockVersion, StyleType> = {
12
- primary: {
13
- description: '!text-secondary-text text-l-light',
14
- iconText: 'text-secondary-text',
15
- iconBackground: 'bg-main-divider',
16
- iconConnector: 'bg-secondary-light',
17
- dot: 'bg-secondary-text',
18
- },
19
- secondary: {
20
- description: '!text-white/80 text-l-light',
21
- iconText: 'text-white',
22
- iconBackground: 'bg-white/30',
23
- iconConnector: 'bg-white',
24
- dot: 'bg-white/80',
25
- },
26
- gray: {
27
- // TODO Replace this Map with group-data-*
28
- description: '!text-white/80 text-l-light',
29
- iconText: 'text-white',
30
- iconBackground: 'bg-white/30',
31
- iconConnector: 'bg-white',
32
- dot: 'bg-white/80',
33
- },
34
- transparent: {
35
- description: '!text-white/80 text-l-light',
36
- iconText: 'text-white',
37
- iconBackground: 'bg-white/30',
38
- iconConnector: 'bg-white',
39
- dot: 'bg-white/80',
40
- },
41
- '': {
42
- // TODO Replace this Map with group-data-*
43
- description: '!text-white/80 text-l-light',
44
- iconText: 'text-white',
45
- iconBackground: 'bg-white/30',
46
- iconConnector: 'bg-white',
47
- dot: 'bg-white/80',
48
- },
9
+ export const STEPS_BLOCK_STYLE: StyleType = {
10
+ description: 'text-white/80 text-l-light group-data-primary:text-secondary-text',
11
+ iconText: 'text-white group-data-primary:text-secondary-text',
12
+ iconBackground: 'bg-white/30 group-data-primary:bg-main-divider',
13
+ iconConnector: 'bg-white group-data-primary:bg-secondary-light',
14
+ dot: 'bg-white/80 group-data-primary:bg-secondary-text',
49
15
  };