s-platform-landing-section 0.1.10-alpha.16 → 0.1.10-alpha.17

package/dist/index.modern.js

@@ -1,7 +1,7 @@
 import React__default, { useState, useRef, useEffect, createElement, forwardRef, useImperativeHandle, memo } from 'react';
 import { IoCartOutline, IoChevronDownOutline, IoInformationCircleOutline, IoLogOutOutline, IoLocationOutline, IoChevronBackOutline, IoChevronForwardOutline, IoCallOutline } from 'react-icons/io5';
 import { FaUserCircle, FaPhone, FaChevronLeft, FaChevronRight, FaAngleUp, FaAngleDown, FaCheckCircle, FaArrowLeft, FaArrowRight as FaArrowRight$1, FaFacebookSquare, FaFacebookMessenger, FaFacebookF } from 'react-icons/fa';
-import { FiMenu } from 'react-icons/fi';
+import { FiMenu, FiSearch } from 'react-icons/fi';
 import { RxCross2 } from 'react-icons/rx';
 import { PiHandbagSimpleLight } from 'react-icons/pi';
 import { CiSearch } from 'react-icons/ci';
@@ -128,6 +128,7 @@ var LinkToPage = function LinkToPage(props) {
     otherProps = _objectWithoutPropertiesLoose(props, _excluded);
   return Link ? /*#__PURE__*/React__default.createElement(Link, otherProps, props.children) : /*#__PURE__*/React__default.createElement("a", otherProps, props.children);
 };
+var SSHOP_SPA_TOKEN = "sshop-spa-token";
 
 var Options = function Options(props) {
   var _props$className = props.className,
@@ -213,15 +214,17 @@ var NavBar7 = function NavBar7(props) {
     _props$logout = props.logout,
     logout = _props$logout === void 0 ? function () {} : _props$logout;
   var cartItems = useSelector === null || useSelector === void 0 ? void 0 : useSelector(function (state) {
-    return state.cart.items;
+    var _state$cart;
+    return state === null || state === void 0 ? void 0 : (_state$cart = state.cart) === null || _state$cart === void 0 ? void 0 : _state$cart.items;
   });
   var userInfo = useSelector === null || useSelector === void 0 ? void 0 : useSelector(function (state) {
-    return state.user.info;
+    var _state$user;
+    return state === null || state === void 0 ? void 0 : (_state$user = state.user) === null || _state$user === void 0 ? void 0 : _state$user.info;
   });
   var _useState2 = useState(""),
     totalItem = _useState2[0],
     setTotalItem = _useState2[1];
-  var profileRoute = (_routes$find = routes.find(function (e) {
+  var profileRoute = routes === null || routes === void 0 ? void 0 : (_routes$find = routes.find(function (e) {
     return (e === null || e === void 0 ? void 0 : e.name) === "profile";
   })) === null || _routes$find === void 0 ? void 0 : _routes$find.route;
   var profileOptions = [{
@@ -241,8 +244,8 @@ var NavBar7 = function NavBar7(props) {
   }];
   useEffect(function () {
     console.log("NavBar7 cartItems", cartItems);
-    var totalItem = cartItems.reduce(function (total, item) {
-      return total + item.quantity;
+    var totalItem = cartItems === null || cartItems === void 0 ? void 0 : cartItems.reduce(function (total, item) {
+      return total + (item === null || item === void 0 ? void 0 : item.quantity);
     }, 0);
     if (totalItem > 9) {
       totalItem = "9+";
@@ -288,7 +291,7 @@ var NavBar7 = function NavBar7(props) {
     }, (item === null || item === void 0 ? void 0 : item.name) === (route === null || route === void 0 ? void 0 : route.name) ? /*#__PURE__*/React__default.createElement("div", {
       className: "py-1 border-b text-textHeading border-textHeading"
     }, item === null || item === void 0 ? void 0 : item.label) : /*#__PURE__*/React__default.createElement("div", {
-      className: "py-1"
+      className: "py-1 text-textBody"
     }, item === null || item === void 0 ? void 0 : item.label));
   })), cart(), userInfo ?
   /*#__PURE__*/
@@ -7107,10 +7110,32 @@ var ProductController = function ProductController(props) {
       return Promise.reject(e);
     }
   };
+  var getProductListSearch = function getProductListSearch(data) {
+    try {
+      return Promise.resolve(_catch(function () {
+        setLoading(true);
+        var filterParams = _extends({}, defaultParams, data);
+        return Promise.resolve(getProductListApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopId, filterParams)).then(function (res) {
+          var _res$data4, _res$data4$status;
+          if ((res === null || res === void 0 ? void 0 : (_res$data4 = res.data) === null || _res$data4 === void 0 ? void 0 : (_res$data4$status = _res$data4.status) === null || _res$data4$status === void 0 ? void 0 : _res$data4$status.code) == 200) {
+            var _res$data5;
+            setLoading(false);
+            return res === null || res === void 0 ? void 0 : (_res$data5 = res.data) === null || _res$data5 === void 0 ? void 0 : _res$data5.data;
+          }
+          setLoading(false);
+        });
+      }, function (e) {
+        console.log(e);
+      }));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
   return {
     products: products,
     loading: loading,
-    page: page
+    page: page,
+    getProductListSearch: getProductListSearch
   };
 };
 
@@ -7293,12 +7318,13 @@ var BookingController = function BookingController(props) {
   var createSchedule = function createSchedule(customerName, customerPhone, scheduleDate, services, shopId) {
     try {
       return Promise.resolve(_catch(function () {
+        var _Date;
         var data = {
           appId: "SSPA",
           customerName: customerName,
-          customerPhone: customerPhone.replace("+", ""),
+          customerPhone: customerPhone === null || customerPhone === void 0 ? void 0 : customerPhone.replace("+", ""),
           isSellService: true,
-          scheduleDate: new Date(scheduleDate).getTime(),
+          scheduleDate: (_Date = new Date(scheduleDate)) === null || _Date === void 0 ? void 0 : _Date.getTime(),
           services: services === null || services === void 0 ? void 0 : services.map(function (_ref) {
             var productName = _ref.productName,
               rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
@@ -7334,6 +7360,8 @@ var Input = forwardRef(function (props, ref) {
     labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
     _props$name = props.name,
     name = _props$name === void 0 ? "" : _props$name,
+    _props$style = props.style,
+    style = _props$style === void 0 ? {} : _props$style,
     _props$onChange = props.onChange,
     onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
     _props$defaultValue = props.defaultValue,
@@ -7423,7 +7451,7 @@ var Input = forwardRef(function (props, ref) {
       setTypeInput("text");
     }
   };
-  var _className = "h-10 py-1 px-2 border border-stroke rounded  " + className;
+  var _className = "h-10 py-1 px-2 border border-stroke rounded-lg  " + className;
   var _inputClassName = (isQuantity ? "text-center w-12" : "") + " focus:outline-none focus:ring-0 " + inputClassName;
   var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
     return (e === null || e === void 0 ? void 0 : e.type) === "required";
@@ -7436,7 +7464,8 @@ var Input = forwardRef(function (props, ref) {
   }, label ? /*#__PURE__*/React__default.createElement("div", {
     className: "mb-1 " + labelClassName
   }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
-    className: "flex gap-2 " + _className
+    className: "flex gap-2 " + _className,
+    style: style
   }, isQuantity ? /*#__PURE__*/React__default.createElement("button", {
     onClick: function onClick() {
       return changeQuantity(-1);
@@ -7759,7 +7788,7 @@ var DateTimePicker = forwardRef(function (props, ref) {
   });
   var _validateData = function _validateData() {
     var count = 0;
-    rules.forEach(function (e) {
+    rules === null || rules === void 0 ? void 0 : rules.forEach(function (e) {
       var _e$pattern;
       if ((e === null || e === void 0 ? void 0 : e.type) === 'required' && value === '') {
         _setError(e === null || e === void 0 ? void 0 : e.message);
@@ -7961,6 +7990,147 @@ var dayjs_min = createCommonjsModule(function (module, exports) {
 !function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return "["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return !r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return (e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return -t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,c),s=n-i<0,u=e.clone().add(r+(s?-1:1),c);return +(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return {M:c,y:h,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:f}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p="$isDayjsObject",S=function(t){return t instanceof _||!(!t||!t[p])},w=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else {var a=e.name;D[a]=e,i=a;}return !r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0;}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init();},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds();},m.$utils=function(){return b},m.isValid=function(){return !(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<O(t)},m.$g=function(t,e,n){return b.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!b.u(e)||e,f=b.p(t),l=function(t,e){var i=b.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return b.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(f){case h:return r?l(1,0):l(31,11);case c:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=b.p(t),f="set"+(this.$u?"UTC":""),l=(n={},n[a]=f+"Date",n[d]=f+"Date",n[c]=f+"Month",n[h]=f+"FullYear",n[u]=f+"Hours",n[s]=f+"Minutes",n[i]=f+"Seconds",n[r]=f+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===c||o===h){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d;}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[b.p(t)]()},m.add=function(r,f){var d,l=this;r=Number(r);var $=b.p(f),y=function(t){var e=O(l);return b.w(e.date(e.date()+Math.round(t*r)),l)};if($===c)return this.set(c,this.$M+r);if($===h)return this.set(h,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return b.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=b.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,c=n.months,f=n.meridiem,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},d=function(t){return b.s(s%12||12,t,"0")},$=f||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r};return r.replace(y,(function(t,r){return r||function(t){switch(t){case"YY":return String(e.$y).slice(-2);case"YYYY":return b.s(e.$y,4,"0");case"M":return a+1;case"MM":return b.s(a+1,2,"0");case"MMM":return h(n.monthsShort,a,c,3);case"MMMM":return h(c,a);case"D":return e.$D;case"DD":return b.s(e.$D,2,"0");case"d":return String(e.$W);case"dd":return h(n.weekdaysMin,e.$W,o,2);case"ddd":return h(n.weekdaysShort,e.$W,o,3);case"dddd":return o[e.$W];case"H":return String(s);case"HH":return b.s(s,2,"0");case"h":return d(1);case"hh":return d(2);case"a":return $(s,u,!0);case"A":return $(s,u,!1);case"m":return String(u);case"mm":return b.s(u,2,"0");case"s":return String(e.$s);case"ss":return b.s(e.$s,2,"0");case"SSS":return b.s(e.$ms,3,"0");case"Z":return i}return null}(t)||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=this,M=b.p(d),m=O(r),v=(m.utcOffset()-this.utcOffset())*e,g=this-m,D=function(){return b.m(y,m)};switch(M){case h:$=D()/12;break;case c:$=D();break;case f:$=D()/3;break;case o:$=(g-v)/6048e5;break;case a:$=(g-v)/864e5;break;case u:$=g/n;break;case s:$=g/e;break;case i:$=g/t;break;default:$=g;}return l?$:b.a($)},m.daysInMonth=function(){return this.endOf(c).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=w(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return b.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),k=_.prototype;return O.prototype=k,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",c],["$y",h],["$D",d]].forEach((function(t){k[t[1]]=function(e){return this.$g(e,t[0],t[1])};})),O.extend=function(t,e){return t.$i||(t(e,_,O),t.$i=!0),O},O.locale=w,O.isDayjs=S,O.unix=function(t){return O(1e3*t)},O.en=D[g],O.Ls=D,O.p={},O}));
 });
 
+var js_cookie = createCommonjsModule(function (module, exports) {
+(function (global, factory) {
+   module.exports = factory() ;
+})(commonjsGlobal, (function () {
+  /* eslint-disable no-var */
+  function assign (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        target[key] = source[key];
+      }
+    }
+    return target
+  }
+  /* eslint-enable no-var */
+
+  /* eslint-disable no-var */
+  var defaultConverter = {
+    read: function (value) {
+      if (value[0] === '"') {
+        value = value.slice(1, -1);
+      }
+      return value.replace(/(%[\dA-F]{2})+/gi, decodeURIComponent)
+    },
+    write: function (value) {
+      return encodeURIComponent(value).replace(
+        /%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,
+        decodeURIComponent
+      )
+    }
+  };
+  /* eslint-enable no-var */
+
+  /* eslint-disable no-var */
+
+  function init (converter, defaultAttributes) {
+    function set (name, value, attributes) {
+      if (typeof document === 'undefined') {
+        return
+      }
+
+      attributes = assign({}, defaultAttributes, attributes);
+
+      if (typeof attributes.expires === 'number') {
+        attributes.expires = new Date(Date.now() + attributes.expires * 864e5);
+      }
+      if (attributes.expires) {
+        attributes.expires = attributes.expires.toUTCString();
+      }
+
+      name = encodeURIComponent(name)
+        .replace(/%(2[346B]|5E|60|7C)/g, decodeURIComponent)
+        .replace(/[()]/g, escape);
+
+      var stringifiedAttributes = '';
+      for (var attributeName in attributes) {
+        if (!attributes[attributeName]) {
+          continue
+        }
+
+        stringifiedAttributes += '; ' + attributeName;
+
+        if (attributes[attributeName] === true) {
+          continue
+        }
+
+        // Considers RFC 6265 section 5.2:
+        // ...
+        // 3.  If the remaining unparsed-attributes contains a %x3B (";")
+        //     character:
+        // Consume the characters of the unparsed-attributes up to,
+        // not including, the first %x3B (";") character.
+        // ...
+        stringifiedAttributes += '=' + attributes[attributeName].split(';')[0];
+      }
+
+      return (document.cookie =
+        name + '=' + converter.write(value, name) + stringifiedAttributes)
+    }
+
+    function get (name) {
+      if (typeof document === 'undefined' || (arguments.length && !name)) {
+        return
+      }
+
+      // To prevent the for loop in the first place assign an empty array
+      // in case there are no cookies at all.
+      var cookies = document.cookie ? document.cookie.split('; ') : [];
+      var jar = {};
+      for (var i = 0; i < cookies.length; i++) {
+        var parts = cookies[i].split('=');
+        var value = parts.slice(1).join('=');
+
+        try {
+          var found = decodeURIComponent(parts[0]);
+          jar[found] = converter.read(value, found);
+
+          if (name === found) {
+            break
+          }
+        } catch (e) {}
+      }
+
+      return name ? jar[name] : jar
+    }
+
+    return Object.create(
+      {
+        set,
+        get,
+        remove: function (name, attributes) {
+          set(
+            name,
+            '',
+            assign({}, attributes, {
+              expires: -1
+            })
+          );
+        },
+        withAttributes: function (attributes) {
+          return init(this.converter, assign({}, this.attributes, attributes))
+        },
+        withConverter: function (converter) {
+          return init(assign({}, this.converter, converter), this.attributes)
+        }
+      },
+      {
+        attributes: { value: Object.freeze(defaultAttributes) },
+        converter: { value: Object.freeze(converter) }
+      }
+    )
+  }
+
+  var api = init(defaultConverter, { path: '/' });
+  /* eslint-enable no-var */
+
+  return api;
+
+}));
+});
+
 var BookingForm = function BookingForm(props) {
   var _props$shopConfig = props.shopConfig,
     shopConfig = _props$shopConfig === void 0 ? {} : _props$shopConfig,
@@ -8004,6 +8174,10 @@ var BookingForm = function BookingForm(props) {
   var _EmployeeController = EmployeeController(_extends({}, props)),
     _EmployeeController$l = _EmployeeController.listEmployment,
     listEmployment = _EmployeeController$l === void 0 ? [] : _EmployeeController$l;
+  var token = js_cookie === null || js_cookie === void 0 ? void 0 : js_cookie.get(SSHOP_SPA_TOKEN);
+  useEffect(function () {
+    console.log("check kkkkk", token, token > 0);
+  }, [token]);
   var _ProductController = ProductController(_extends({}, props, {
       params: productsParams
     })),
@@ -8280,7 +8454,7 @@ var BookingForm = function BookingForm(props) {
     onCloseFormBooking: onCloseFormBooking,
     onClose: handleClosePopup
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "bg-white rounded-lg shadow-lg p-6 max-w-sm text-center md:min-w-[650px] min-h-[420px] md:min-h-[380px] lg:h-auto "
+    className: "bg-white rounded-lg shadow-lg p-6 max-w-sm flex flex-col items-center justify-center min-w-[320px] md:min-w-[650px] min-h-[420px] md:min-h-[380px] lg:h-auto "
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "h-20 mb-4 flex items-center justify-center"
   }, /*#__PURE__*/React__default.createElement(FaCheckCircle, {
@@ -8294,12 +8468,14 @@ var BookingForm = function BookingForm(props) {
     className: "mb-2"
   }, "S\u1ED1 \u0111i\u1EC7n tho\u1EA1i: ", dataBooking === null || dataBooking === void 0 ? void 0 : dataBooking.customerPhone), /*#__PURE__*/React__default.createElement("div", {
     className: "mb-4"
-  }, "Th\u1EDDi gian: ", dayjs_min(dataBooking === null || dataBooking === void 0 ? void 0 : dataBooking.scheduleDate).format("DD/MM/YYYY")), /*#__PURE__*/React__default.createElement("p", {
-    className: "mb-4"
+  }, "Th\u1EDDi gian: ", dayjs_min(dataBooking === null || dataBooking === void 0 ? void 0 : dataBooking.scheduleDate).format("DD/MM/YYYY")), token ? /*#__PURE__*/React__default.createElement("div", null) : /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-col items-center"
+  }, /*#__PURE__*/React__default.createElement("p", {
+    className: "mb-4 text-center"
   }, "B\u1EA1n \u0111\xE3 c\xF3 t\xE0i kho\u1EA3n, vui l\xF2ng \u0111\u0103ng nh\u1EADp \u0111\u1EC3 xem chi ti\u1EBFt c\xE1c s\u1EA3n ph\u1EA9m, d\u1ECBch v\u1EE5 li\u1EC7u tr\xECnh m\xE0 b\u1EA1n \u0111ang s\u1EDF h\u1EEFu"), /*#__PURE__*/React__default.createElement(Button, {
     label: "Đăng nhập",
     shopConfigStyle: shopConfigStyle
-  }))));
+  })))));
 };
 
 var Treatments1 = function Treatments1(props) {
@@ -8765,8 +8941,11 @@ var ServiceDetail1 = function ServiceDetail1(props) {
 };
 
 var ProductItem2 = function ProductItem2(props) {
-  var product = props.product;
-  return /*#__PURE__*/React__default.createElement("a", {
+  var product = props.product,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
+  return /*#__PURE__*/React__default.createElement(LinkToPage, {
+    Link: Link,
     href: getLinkProductDetail(product)
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "text-center relative group"
@@ -8787,7 +8966,9 @@ var Products1 = function Products1(props) {
     _props$data = props.data,
     data = _props$data === void 0 ? {} : _props$data,
     _props$SectionTitle = props.SectionTitle,
-    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
+    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
     secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
@@ -8810,6 +8991,7 @@ var Products1 = function Products1(props) {
     className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-10 mt-12"
   }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
     return /*#__PURE__*/React__default.createElement(ProductItem2, {
+      Link: Link,
       key: index,
       product: product === null || product === void 0 ? void 0 : product.productInfo
     });
@@ -9008,7 +9190,9 @@ var Products3 = function Products3(props) {
     _props$data = props.data,
     data = _props$data === void 0 ? {} : _props$data,
     _props$SectionTitle = props.SectionTitle,
-    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
+    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
     secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
@@ -9090,6 +9274,7 @@ var Products3 = function Products3(props) {
     className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-12 mt-12"
   }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
     return /*#__PURE__*/React__default.createElement(ProductItem2, {
+      Link: Link,
       key: index,
       product: product === null || product === void 0 ? void 0 : product.productInfo
     });
@@ -9302,7 +9487,9 @@ var ProductHot3 = function ProductHot3(props) {
     _props$data = props.data,
     data = _props$data === void 0 ? {} : _props$data,
     _props$SectionTitle = props.SectionTitle,
-    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
+    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
     secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
@@ -9326,6 +9513,7 @@ var ProductHot3 = function ProductHot3(props) {
     className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-10 mt-12"
   }, products === null || products === void 0 ? void 0 : products.map(function (product, index) {
     return /*#__PURE__*/React__default.createElement(ProductItem2, {
+      Link: Link,
       key: index,
       product: product === null || product === void 0 ? void 0 : product.productInfo
     });
@@ -10073,7 +10261,7 @@ var PageTitle1 = function PageTitle1(props) {
     className: "relative w-full p-20 z-10 flex flex-col gap-6 items-center justify-center"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "text-3xl md:text-5xl text-white leading-[1.6] md:leading-[1.6] text-center font-headingFont"
-  }, route === null || route === void 0 ? void 0 : route.label)));
+  }, sectionData !== null && sectionData !== void 0 && sectionData.sectionTitle ? sectionData === null || sectionData === void 0 ? void 0 : sectionData.sectionTitle : route === null || route === void 0 ? void 0 : route.label)));
 };
 
 var About5 = function About5(props) {
@@ -10143,7 +10331,9 @@ var Breadcrumb1 = function Breadcrumb1(props) {
   var shopConfigStyle = props.shopConfigStyle,
     route = props.route,
     _props$routes = props.routes,
-    routes = _props$routes === void 0 ? [] : _props$routes;
+    routes = _props$routes === void 0 ? [] : _props$routes,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo3 = _shopConfigStyle$colo.textHeading,
     textHeading = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
@@ -10154,18 +10344,21 @@ var Breadcrumb1 = function Breadcrumb1(props) {
     getItems();
   }, [route]);
   var getItems = function getItems() {
-    var _route$route, _route$route$split, _route$route$split$fi;
+    var _route$route, _route$route$split, _route$route$split$fi, _items, _items2;
     var items = route === null || route === void 0 ? void 0 : (_route$route = route.route) === null || _route$route === void 0 ? void 0 : (_route$route$split = _route$route.split("/")) === null || _route$route$split === void 0 ? void 0 : (_route$route$split$fi = _route$route$split.filter(function (e) {
       return e === null || e === void 0 ? void 0 : e.length;
     })) === null || _route$route$split$fi === void 0 ? void 0 : _route$route$split$fi.slice(0, 2);
-    items = items.map(function (e) {
+    items = (_items = items) === null || _items === void 0 ? void 0 : _items.map(function (e) {
+      if (e === "product") {
+        e = "products";
+      }
       return (routes === null || routes === void 0 ? void 0 : routes.find(function (r) {
         return (r === null || r === void 0 ? void 0 : r.name) === e;
       })) || {
         label: e
       };
     });
-    items.unshift({
+    (_items2 = items) === null || _items2 === void 0 ? void 0 : _items2.unshift({
       name: "home",
       label: "Trang chủ",
       route: "/"
@@ -10180,7 +10373,8 @@ var Breadcrumb1 = function Breadcrumb1(props) {
       className: "flex gap-2"
     }, index ? /*#__PURE__*/React__default.createElement("div", {
       className: "text-gray4"
-    }, "/") : null, item !== null && item !== void 0 && item.route ? /*#__PURE__*/React__default.createElement("a", {
+    }, "/") : null, item !== null && item !== void 0 && item.route ? /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
       href: item === null || item === void 0 ? void 0 : item.route,
       style: {
         color: textHeading
@@ -11021,5 +11215,77 @@ var CartItem = function CartItem(props) {
   }, /*#__PURE__*/React__default.createElement(RiDeleteBin7Line, null), /*#__PURE__*/React__default.createElement("span", null, "X\xF3a"))));
 };
 
-export { About5, Address1, Banner1, Booking1, Breadcrumb1, Button, Carts1, Contact1, CustomerRating10, DateTimePicker, Employees1, Features1, Features2, Features3, Footer1, Footer7, Gallery1, Hero10, Hero11, Hero11$1 as Hero12, Hero13, Input, InputPhoneNumber, Links1, ModalNotification, NavBar7, PageTitle1, Partner1, ProductDetail10, ProductHot3, ProductSale2, Products1, Products10, Products2, Products3, ProductsTop1, SectionTitle1, Select$1 as Select, ServiceDetail1, TextArea, Treatments1, Treatments1$1 as Treatments2 };
+var SearchProduct1 = function SearchProduct1(props) {
+  var _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
+  var _props$shopConfigStyl = props.shopConfigStyle,
+    shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
+    data = props.data;
+  var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
+    _shopConfigStyle$colo6 = _shopConfigStyle$colo.bgSecondary,
+    bgSecondary = _shopConfigStyle$colo6 === void 0 ? "#fffff" : _shopConfigStyle$colo6;
+  var _useState = useState([]),
+    listProducts = _useState[0],
+    setListProducts = _useState[1];
+  var _ProductController = ProductController(_extends({}, props)),
+    getProductListSearch = _ProductController.getProductListSearch;
+  var handleSearch = function handleSearch(productName) {
+    try {
+      var _temp = function () {
+        if (productName) {
+          return Promise.resolve(getProductListSearch({
+            productName: productName
+          })).then(function (data) {
+            setListProducts(data);
+          });
+        } else {
+          setListProducts([]);
+        }
+      }();
+      return Promise.resolve(_temp && _temp.then ? _temp.then(function () {}) : void 0);
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-col gap-2 w-[720px] rounded-lg mx-auto mt-12 "
+  }, /*#__PURE__*/React__default.createElement(Input, {
+    className: "flex items-center w-full h-14",
+    style: {
+      backgroundColor: bgSecondary
+    },
+    inputClassName: "w-full h-full p-2 text-lg",
+    placeholder: (data === null || data === void 0 ? void 0 : data.sectionTitle) || "Tìm kiếm sản phẩm",
+    onChange: handleSearch,
+    icons: /*#__PURE__*/React__default.createElement("div", {
+      className: "px-2"
+    }, /*#__PURE__*/React__default.createElement(FiSearch, {
+      style: {
+        color: "#828282"
+      }
+    }))
+  }), (listProducts === null || listProducts === void 0 ? void 0 : listProducts.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
+    className: "max-h-64 overflow-y-auto flex flex-col gap-2 pr-3"
+  }, listProducts === null || listProducts === void 0 ? void 0 : listProducts.map(function (item) {
+    var _item$productInfo, _item$productInfo2;
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
+      href: getLinkProductDetail(item === null || item === void 0 ? void 0 : item.productInfo),
+      className: "flex gap-2 text-Body"
+    }, /*#__PURE__*/React__default.createElement(ProductImage, {
+      product: item,
+      className: "h-20 max-w-20 rounded-lg border"
+    }), /*#__PURE__*/React__default.createElement("div", {
+      className: "flex flex-col px-1 gap-2 border-b w-full"
+    }, /*#__PURE__*/React__default.createElement("div", {
+      className: "mt-1  text-lg font-medium\t"
+    }, item === null || item === void 0 ? void 0 : (_item$productInfo = item.productInfo) === null || _item$productInfo === void 0 ? void 0 : _item$productInfo.productName), /*#__PURE__*/React__default.createElement("div", {
+      className: " text-lg font-medium\t"
+    }, formatCurrency(item === null || item === void 0 ? void 0 : (_item$productInfo2 = item.productInfo) === null || _item$productInfo2 === void 0 ? void 0 : _item$productInfo2.price))));
+  })) : /*#__PURE__*/React__default.createElement("div", {
+    className: "text-center"
+  }, data === null || data === void 0 ? void 0 : data.sectionDescription));
+};
+
+export { About5, Address1, Banner1, Booking1, Breadcrumb1, Button, Carts1, Contact1, CustomerRating10, DateTimePicker, Employees1, Features1, Features2, Features3, Footer1, Footer7, Gallery1, Hero10, Hero11, Hero11$1 as Hero12, Hero13, Input, InputPhoneNumber, Links1, ModalNotification, NavBar7, PageTitle1, Partner1, ProductDetail10, ProductHot3, ProductSale2, Products1, Products10, Products2, Products3, ProductsTop1, SearchProduct1, SectionTitle1, Select$1 as Select, ServiceDetail1, TextArea, Treatments1, Treatments1$1 as Treatments2 };
 //# sourceMappingURL=index.modern.js.map