@hhgtech/hhg-components 1.29.458 → 1.29.459-beta-2

package/build/{index-ac289d0b.js → index-50954ba5.js}

@@ -1,14 +1,14 @@
 'use strict';
 
 var React = require('react');
-var index$2 = require('./index-57f9287f.js');
-var utils = require('./utils-66b200b6.js');
-var index = require('./index-983e482a.js');
-var togetherComponentGlobalContext = require('./utils-9d243050.js');
+var index$2 = require('./index-0c15ebe9.js');
+var utils = require('./utils-e457e31d.js');
+var index = require('./index-a9de5108.js');
+var togetherComponentGlobalContext = require('./utils-1be9f0d9.js');
 var core = require('@mantine/core');
-var index$1 = require('./index-a465058a.js');
+var index$1 = require('./index-6e38bb7f.js');
 var styled = require('@emotion/styled');
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var miscTheme = require('./miscTheme.js');
 var miscDefaultClassWrapper = require('./miscDefaultClassWrapper.js');
 

package/build/{index-4e5ed562.js → index-5b97a3c7.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var core = require('@mantine/core');
-var index$1 = require('./index-9dfb56b0.js');
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var index$1 = require('./index-1c91ed35.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var hooks = require('@mantine/hooks');
 var react = require('@emotion/react');

package/build/{index-545cf353.js → index-5bfb0a6e.js}

@@ -1,12 +1,12 @@
 'use strict';
 
 var locale = require('date-fns/locale');
-require('./index-04d022fd.js');
+require('./index-e5c55531.js');
 var constantsSite = require('./constantsSite.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var constantsRiskScreener = require('./constantsRiskScreener.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
-var Locale = require('./Locale-b28334b7.js');
+var Locale = require('./Locale-6a02bb49.js');
 
 const basePath = process.env.NEXT_PUBLIC_DEPLOY_LOCALE === 'tl-PH' ? '/fil' : '';
 const SSO_URL = process.env.NEXT_PUBLIC_SSO;

package/build/{index-7e7b26c5.js → index-6298383f.js}

@@ -1,29 +1,29 @@
 'use strict';
 
 var React = require('react');
-var index$1 = require('./index-1df8ff56.js');
+var index$1 = require('./index-83ab1b95.js');
 var dayjs = require('dayjs');
-require('./index-545cf353.js');
-require('./index-ebd6b547.js');
+require('./index-5bfb0a6e.js');
+require('./index-74d4e6b1.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-require('./index-04d022fd.js');
-require('./index-d3955224.js');
-require('./index-4150461e.js');
-var index$2 = require('./index-a465058a.js');
-require('./index-5f760ee0.js');
-require('./index-9dfb56b0.js');
-require('./index.styles-5ecfeda0.js');
-require('./translationsContext-93c5f4d6.js');
+require('./index-e5c55531.js');
+require('./index-b9faa20d.js');
+require('./index-07e07fd4.js');
+var index$2 = require('./index-6e38bb7f.js');
+require('./index-ef20efde.js');
+require('./index-1c91ed35.js');
+require('./index.styles-c75c2ee2.js');
+require('./translationsContext-c3a43b4d.js');
 require('@mantine/hooks');
-var utils = require('./utils-66b200b6.js');
-require('./index-4bbc9631.js');
-var index = require('./index-f215070c.js');
+var utils = require('./utils-e457e31d.js');
+require('./index-a9ae42f4.js');
+var index = require('./index-8f09bf95.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
-var index$4 = require('./index-37c2303e.js');
-var index$3 = require('./index-ca4a7ba9.js');
+var index$4 = require('./index-cfcda0dc.js');
+var index$3 = require('./index-f1398cab.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-e5c74272.js → index-66f96154.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-ba517441.js');
-var togetherComponentGlobalContext = require('./utils-9d243050.js');
+var index = require('./index-ab4ce4bf.js');
+var togetherComponentGlobalContext = require('./utils-1be9f0d9.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
 

package/build/{index-03b267b2.js → index-6ab0611b.js}

@@ -5,24 +5,24 @@ var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
 var dayjs = require('dayjs');
 var relativeTime = require('dayjs/plugin/relativeTime');
-var index$2 = require('./index-983e482a.js');
-var utils = require('./utils-66b200b6.js');
-var index$1 = require('./index-e9ebd3cf.js');
-var index$a = require('./index-e68730b9.js');
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
-var index = require('./index-3aa7bc2f.js');
-var index$4 = require('./index-f215070c.js');
-require('./index-545cf353.js');
-var index$7 = require('./index-d3955224.js');
-var togetherComponentGlobalContext = require('./utils-9d243050.js');
-var index$6 = require('./index-ba517441.js');
-var index$5 = require('./index-a465058a.js');
+var index$2 = require('./index-a9de5108.js');
+var utils = require('./utils-e457e31d.js');
+var index$1 = require('./index-9b77db59.js');
+var index$a = require('./index-72197851.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
+var index = require('./index-b2f5b739.js');
+var index$4 = require('./index-8f09bf95.js');
+require('./index-5bfb0a6e.js');
+var index$7 = require('./index-b9faa20d.js');
+var togetherComponentGlobalContext = require('./utils-1be9f0d9.js');
+var index$6 = require('./index-ab4ce4bf.js');
+var index$5 = require('./index-6e38bb7f.js');
 var miscTheme = require('./miscTheme.js');
 var styled = require('@emotion/styled');
 var togetherApiPaths = require('./togetherApiPaths.js');
-var index$3 = require('./index-2bba7fd9.js');
-var index$8 = require('./index-57f9287f.js');
-var index$9 = require('./index-f58cfd23.js');
+var index$3 = require('./index-248f2291.js');
+var index$8 = require('./index-0c15ebe9.js');
+var index$9 = require('./index-c62567a1.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -920,7 +920,7 @@ const _CardAuthor = (props) => {
     React.useEffect(() => {
         if (open && !ProfileDetail) {
             if (userType === 'chatbot') {
-                Promise.resolve().then(function () { return require('./index-0bf97f76.js'); }).then((module) => {
+                Promise.resolve().then(function () { return require('./index-f628c9f4.js'); }).then((module) => {
                     setProfileDetail(() => module.ProfileChatbot);
                 });
             }

package/build/{index-a465058a.js → index-6e38bb7f.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index = require('./index-9dfb56b0.js');
+var index = require('./index-1c91ed35.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-72c2fbb0.js → index-6e501931.js}

@@ -1,23 +1,23 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var LastPeriod = require('./LastPeriod-a2eab3a8.js');
-var index$3 = require('./index-ebd6b547.js');
-var index$2 = require('./index-2e7ebd7d.js');
-var index$4 = require('./index-a465058a.js');
-require('./index-5f760ee0.js');
-require('./index-9dfb56b0.js');
-require('./index.styles-5ecfeda0.js');
-var index = require('./index-983e482a.js');
+var LastPeriod = require('./LastPeriod-7438ccff.js');
+var index$3 = require('./index-74d4e6b1.js');
+var index$2 = require('./index-ded51447.js');
+var index$4 = require('./index-6e38bb7f.js');
+require('./index-ef20efde.js');
+require('./index-1c91ed35.js');
+require('./index.styles-c75c2ee2.js');
+var index = require('./index-a9de5108.js');
 require('@mantine/hooks');
-require('./index-4150461e.js');
-require('./utils-66b200b6.js');
-require('./index-4bbc9631.js');
-var context = require('./context-e2f5fc7b.js');
-var index$1 = require('./index-e5629079.js');
+require('./index-07e07fd4.js');
+require('./utils-e457e31d.js');
+require('./index-a9ae42f4.js');
+var context = require('./context-7d9437f6.js');
+var index$1 = require('./index-0cdba686.js');
 var other = require('@hhgtech/icons/other');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-e68730b9.js → index-72197851.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var miscTheme = require('./miscTheme.js');
-var WhatsApp = require('./WhatsApp-4610b570.js');
-var Spinner = require('./Spinner-213c419b.js');
+var WhatsApp = require('./WhatsApp-a1e3722b.js');
+var Spinner = require('./Spinner-3b982312.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-ebd6b547.js → index-74d4e6b1.js}

@@ -1,25 +1,25 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
 var hooks = require('@mantine/hooks');
-var index$1 = require('./index-d3955224.js');
-var index = require('./index-9dfb56b0.js');
-var index$3 = require('./index-f215070c.js');
+var index$1 = require('./index-b9faa20d.js');
+var index = require('./index-1c91ed35.js');
+var index$3 = require('./index-8f09bf95.js');
 var styled = require('@emotion/styled');
 var carousel = require('@mantine/carousel');
-var index$2 = require('./index-a465058a.js');
-var index$4 = require('./index-4150461e.js');
+var index$2 = require('./index-6e38bb7f.js');
+var index$4 = require('./index-07e07fd4.js');
 var miscTheme = require('./miscTheme.js');
 var cn = require('classnames');
 var uuid = require('uuid');
-var useUniqueId = require('./useUniqueId-98311b21.js');
+var useUniqueId = require('./useUniqueId-8099faeb.js');
 var constantsSite = require('./constantsSite.js');
 var react = require('@emotion/react');
 var core$1 = require('@hhgtech/icons/core');
-var index$5 = require('./index-5f760ee0.js');
+var index$5 = require('./index-ef20efde.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-f1336f67.js → index-76e6bc6f.js}

@@ -2,24 +2,24 @@
 
 var React = require('react');
 var styled = require('@emotion/styled');
-var utils = require('./utils-66b200b6.js');
+var utils = require('./utils-e457e31d.js');
 var miscTheme = require('./miscTheme.js');
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
-var index = require('./index-d76f09a4.js');
-var index$1 = require('./index-ebd6b547.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
+var index = require('./index-fb101201.js');
+var index$1 = require('./index-74d4e6b1.js');
 require('@mantine/core');
 require('@mantine/dates');
-require('./index-545cf353.js');
-require('./index-04d022fd.js');
-require('./index-d3955224.js');
-require('./index-4150461e.js');
-require('./index-a465058a.js');
-require('./index-5f760ee0.js');
-require('./index-9dfb56b0.js');
-require('./index.styles-5ecfeda0.js');
-require('./translationsContext-93c5f4d6.js');
+require('./index-5bfb0a6e.js');
+require('./index-e5c55531.js');
+require('./index-b9faa20d.js');
+require('./index-07e07fd4.js');
+require('./index-6e38bb7f.js');
+require('./index-ef20efde.js');
+require('./index-1c91ed35.js');
+require('./index.styles-c75c2ee2.js');
+require('./translationsContext-c3a43b4d.js');
 require('@mantine/hooks');
-require('./index-4bbc9631.js');
+require('./index-a9ae42f4.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-c33cdbaa.js → index-7763df81.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-983e482a.js');
-var index$1 = require('./index-ba517441.js');
+var index = require('./index-a9de5108.js');
+var index$1 = require('./index-ab4ce4bf.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-5fbef10c.js → index-78acc1fd.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var core = require('@mantine/core');
 var vaul = require('vaul');
 var styled = require('@emotion/styled');
-var index = require('./index-545cf353.js');
+var index = require('./index-5bfb0a6e.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-7bdb319a.js → index-7e9ff949.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index$1 = require('./index-a465058a.js');
-var index = require('./index-983e482a.js');
+var index$1 = require('./index-6e38bb7f.js');
+var index = require('./index-a9de5108.js');
 var miscTheme = require('./miscTheme.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-c77df961.js → index-7fd35436.js}

@@ -1,30 +1,30 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
 var reactHookForm = require('react-hook-form');
-var useHealthToolCache = require('./useHealthToolCache-f2dde4f2.js');
-var constants = require('./constants-b70d710a.js');
+var useHealthToolCache = require('./useHealthToolCache-ab3a082f.js');
+var constants = require('./constants-c0c8a2ed.js');
 var core = require('@mantine/core');
-var index$2 = require('./index-347a2a0a.js');
-var index$3 = require('./index-ebd6b547.js');
+var index$2 = require('./index-b7d104d9.js');
+var index$3 = require('./index-74d4e6b1.js');
 require('@mantine/dates');
-require('./index-545cf353.js');
-require('./index-04d022fd.js');
-require('./index-d3955224.js');
-require('./index-4150461e.js');
-var index$4 = require('./index-a465058a.js');
-require('./index-5f760ee0.js');
+require('./index-5bfb0a6e.js');
+require('./index-e5c55531.js');
+require('./index-b9faa20d.js');
+require('./index-07e07fd4.js');
+var index$4 = require('./index-6e38bb7f.js');
+require('./index-ef20efde.js');
 var miscTheme = require('./miscTheme.js');
-require('./index-9dfb56b0.js');
-require('./index.styles-5ecfeda0.js');
-var index = require('./index-983e482a.js');
+require('./index-1c91ed35.js');
+require('./index.styles-c75c2ee2.js');
+var index = require('./index-a9de5108.js');
 require('@mantine/hooks');
-require('./utils-66b200b6.js');
-require('./index-4bbc9631.js');
-var index$1 = require('./index-e5629079.js');
-var context = require('./context-e2f5fc7b.js');
-var Locale = require('./Locale-b28334b7.js');
+require('./utils-e457e31d.js');
+require('./index-a9ae42f4.js');
+var index$1 = require('./index-0cdba686.js');
+var context = require('./context-7d9437f6.js');
+var Locale = require('./Locale-6a02bb49.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var embeddedHeathToolCards_helpers = require('./embeddedHeathToolCards_helpers.js');
 

package/build/{index-a3c02e87.js → index-83b30f73.js}

@@ -1,52 +1,53 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-a8b7036a.js');
+var tslib_es6 = require('./tslib.es6-3b23f0d5.js');
 var React = require('react');
-var index$5 = require('./index-ebd6b547.js');
+var index$5 = require('./index-74d4e6b1.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-var index$7 = require('./index-545cf353.js');
-require('./index-04d022fd.js');
-var index$b = require('./index-d3955224.js');
-require('./index-4150461e.js');
-var index$3 = require('./index-a465058a.js');
-var index$f = require('./index-5f760ee0.js');
-require('./index-9dfb56b0.js');
-require('./index.styles-5ecfeda0.js');
-require('./translationsContext-93c5f4d6.js');
+var index$7 = require('./index-5bfb0a6e.js');
+require('./index-e5c55531.js');
+var index$b = require('./index-b9faa20d.js');
+require('./index-07e07fd4.js');
+var index$3 = require('./index-6e38bb7f.js');
+var index$f = require('./index-ef20efde.js');
+require('./index-1c91ed35.js');
+require('./index.styles-c75c2ee2.js');
+require('./translationsContext-c3a43b4d.js');
 require('@mantine/hooks');
-var utils = require('./utils-66b200b6.js');
-require('./index-4bbc9631.js');
-var index$2 = require('./index-13966467.js');
+var utils = require('./utils-e457e31d.js');
+require('./index-a9ae42f4.js');
+var index$2 = require('./index-cdbac97f.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var index$4 = require('./index-f1336f67.js');
+var index$4 = require('./index-76e6bc6f.js');
 var dateFns = require('date-fns');
 var DayPickerInput = require('react-day-picker/DayPickerInput');
-var index$6 = require('./index-37c2303e.js');
+var index$6 = require('./index-cfcda0dc.js');
 var throttle = require('lodash/throttle');
 var parse = require('html-react-parser');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
-var useOutsideClick = require('./useOutsideClick-f45f6aa3.js');
+var useOutsideClick = require('./useOutsideClick-69fbe673.js');
 var enUS = require('date-fns/locale/en-US');
 var id = require('date-fns/locale/id');
 var vi = require('date-fns/locale/vi');
 var zhTW = require('date-fns/locale/zh-TW');
-var index$a = require('./index-ba517441.js');
-var index$8 = require('./index-f215070c.js');
-var index$9 = require('./index-983e482a.js');
-var index$c = require('./index-da9cd2be.js');
+var index$a = require('./index-ab4ce4bf.js');
+var index$8 = require('./index-8f09bf95.js');
+var index$9 = require('./index-a9de5108.js');
+var index$c = require('./index-28020ef7.js');
 var miscGetSocialList = require('./miscGetSocialList.js');
-var index$e = require('./index-d76f09a4.js');
-var index$d = require('./index-124e979c.js');
+var index$e = require('./index-fb101201.js');
+var index$d = require('./index-eda62e19.js');
 var uuid = require('uuid');
-var Locale = require('./Locale-b28334b7.js');
+var Locale = require('./Locale-6a02bb49.js');
 var arrow = require('@hhgtech/icons/arrow');
 var other = require('@hhgtech/icons/other');
 var Lottie = require('lottie-light-react');
-var index$g = require('./index-5bfff55e.js');
-var index$h = require('./index-869ec7e8.js');
+var index$g = require('./index-b5bbc716.js');
+var cn = require('classnames');
+var index$h = require('./index-be297ee2.js');
 var get = require('lodash/get');
 var debounce = require('lodash/debounce');
 
@@ -80,6 +81,7 @@ var id__default = /*#__PURE__*/_interopDefault(id);
 var vi__default = /*#__PURE__*/_interopDefault(vi);
 var zhTW__default = /*#__PURE__*/_interopDefault(zhTW);
 var Lottie__default = /*#__PURE__*/_interopDefault(Lottie);
+var cn__default = /*#__PURE__*/_interopDefault(cn);
 var get__default = /*#__PURE__*/_interopDefault(get);
 var debounce__default = /*#__PURE__*/_interopDefault(debounce);
 
@@ -4812,7 +4814,7 @@ const HPVScreener = ({ onClick, className, style, image, }) => {
                     React__namespace["default"].createElement(index$g.ArrowRightBlue, { style: { width: '0.5rem', height: '0.5rem' } }))))));
 };
 
-const StyledHorizontalContainer = styled__default["default"].div `
+const StyledTwoItemHorizontalContainer = styled__default["default"].div `
   display: grid;
   grid-template-columns: 1fr 2px 1fr;
   column-gap: ${core.rem(16)};
@@ -4826,11 +4828,15 @@ const StyledVerticalContainer = styled__default["default"].div `
     grid-column: 1 / span 2;
   }
 `;
+const StyledHorizontalContainer = styled__default["default"].div `
+  display: flex;
+  align-items: center;
+`;
 const StyledVerticalContent = styled__default["default"].div `
   display: flex;
   flex-direction: column;
   gap: ${core.rem(2)};
-  align-items: ${({ layout }) => (layout === 'vertical' ? 'left' : 'center')};
+  align-items: ${({ align }) => align};
 `;
 const StyledTitle$1 = styled__default["default"].div `
   font-size: ${core.rem(15)};
@@ -4845,23 +4851,22 @@ const StyledDescription$1 = styled__default["default"].div `
   font-size: ${core.rem(13)};
 `;
 
-const SummaryInfo = ({ infoItems, className, layout = 'vertical', }) => {
-    const isHorizontalLayout = layout === 'horizontal';
-    const StyledContainer = isHorizontalLayout
-        ? StyledHorizontalContainer
-        : StyledVerticalContainer;
-    return (React__namespace["default"].createElement(StyledContainer, { className: className }, infoItems.map((item) => {
-        const lenOfInfoItems = infoItems.length;
-        if (lenOfInfoItems > 2 &&
-            lenOfInfoItems % 2 !== 0 &&
-            item.id === infoItems[lenOfInfoItems - 1].id) {
-            item.cssItem = 'span-2';
+const SummaryInfo = ({ infoItems, className, layout = 'vertical', align = 'start', isMobile = false, }) => {
+    const StyledContainer = React.useMemo(() => {
+        if (layout === 'two-item-horizontal' && isMobile) {
+            return StyledTwoItemHorizontalContainer;
+        }
+        if (layout === 'horizontal') {
+            return StyledHorizontalContainer;
         }
+        return StyledVerticalContainer;
+    }, [layout]);
+    return (React__namespace["default"].createElement(StyledContainer, { className: className }, infoItems.map((item) => {
         return (React__namespace["default"].createElement(React__namespace["default"].Fragment, { key: item.id },
-            React__namespace["default"].createElement(StyledVerticalContent, { layout: layout, className: item.cssItem },
-                React__namespace["default"].createElement(StyledTitle$1, null, item.title),
-                React__namespace["default"].createElement(StyledDescription$1, null, item.description)),
-            isHorizontalLayout && (React__namespace["default"].createElement(core.Divider, { className: item.cssItem, sx: {
+            React__namespace["default"].createElement(StyledVerticalContent, { align: align, className: cn__default["default"](item.cssItem, 'flex-1') },
+                React__namespace["default"].createElement(StyledTitle$1, { className: 'summary-title' }, item.title),
+                React__namespace["default"].createElement(StyledDescription$1, { className: 'summary-description' }, item.description)),
+            layout === 'two-item-horizontal' && (React__namespace["default"].createElement(core.Divider, { className: item.cssItem, sx: {
                     borderColor: '#0000001a',
                     height: '75%',
                     alignSelf: 'center',
@@ -5384,8 +5389,7 @@ styled__default["default"].div `
 `;
 const GeneralInfoContainer = styled__default["default"].div `
   background-color: #fff;
-`;
-
+`;
 const ProductImage = styled__default["default"](index$4.ImageWrapV2) `
   width: 100%;
   object-fit: contain;
@@ -5398,33 +5402,26 @@ const ProductContent = styled__default["default"].div `
   .description {
     margin-top: 0.5rem;
   }
-`;
-const ProductTitle = styled__default["default"].h1 `
-  font-size: 1.375rem;
-  font-weight: 600;
-  line-height: 1.75rem;
-  color: #111111;
-`;
-const ProductDescription = styled__default["default"].p `
-  font-size: 0.8125rem;
-  line-height: 1.25rem;
-  font-weight: 400;
-  color: ${miscTheme.theme.colors.gray700};
-`;
-function GeneralInfo({ generalInfo, backupSrc, className, contentClassName, bannerProps = {}, children, }) {
+
+  .product-info {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+`;
+
+function GeneralInfo({ generalInfo, backupSrc, className, contentClassName, bannerProps = {}, imagesSelect, children, isMobile = false, }) {
     return (React__namespace["default"].createElement(GeneralInfoContainer, { className: className },
-        React__namespace["default"].createElement(ProductImage, Object.assign({ backupSrc: backupSrc, src: generalInfo.banner || generalInfo.logo, alt: "product" }, bannerProps)),
+        React__namespace["default"].createElement("div", { id: "product-image-section" }, imagesSelect ? (imagesSelect) : (React__namespace["default"].createElement(ProductImage, Object.assign({ backupSrc: backupSrc, src: generalInfo.banner || generalInfo.logo, alt: "product" }, bannerProps)))),
         React__namespace["default"].createElement(ProductContent, { className: contentClassName },
-            React__namespace["default"].createElement("div", null,
-                React__namespace["default"].createElement(ProductTitle, null, generalInfo.name),
-                generalInfo.description && (React__namespace["default"].createElement(ProductDescription, { className: "description" }, generalInfo.description))),
+            React__namespace["default"].createElement("div", { className: "product-info" },
+                React__namespace["default"].createElement(index$3.Text, { size: "h3", fw: 600, color: "gray1000" }, generalInfo.name),
+                generalInfo.description && (React__namespace["default"].createElement(index$3.Text, { size: isMobile ? 'p3' : 'p1', color: "gray700" }, generalInfo.description))),
             children)));
 }
 GeneralInfo.Container = GeneralInfoContainer;
 GeneralInfo.Image = ProductImage;
-GeneralInfo.Content = ProductContent;
-GeneralInfo.Title = ProductTitle;
-GeneralInfo.Description = ProductDescription;
+GeneralInfo.Content = ProductContent;
 
 const StyledContainer$2 = styled__default["default"].div `
   border-radius: 12px;
@@ -5575,7 +5572,8 @@ const RatingStars = ({ value, max = MAX_RATING, onChange, readOnly = false, }) =
             return starComponent(starValue, true);
         }
         if (diff >= HALF_STAR_THRESHOLD) {
-            return React__namespace["default"].createElement(StarHalf, { key: `star-${index}` });
+            return (React__namespace["default"].createElement("div", { key: `star-${index}` },
+                React__namespace["default"].createElement(StarHalf, null)));
         }
         return starComponent(starValue, false);
     })));