s-platform-landing-section 0.1.10-alpha.10 → 0.1.10-alpha.11

package/dist/index.js

@@ -7412,7 +7412,7 @@ var Input = React.forwardRef(function (props, ref) {
     }
   };
   var _className = "h-10 py-1 px-2 border border-stroke rounded  " + className;
-  var _inputClassName = (isQuantity ? "text-center w-12" : "") + " " + inputClassName + " focus:outline-none focus:ring-0";
+  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";
   }));
@@ -7448,6 +7448,7 @@ var Input = React.forwardRef(function (props, ref) {
 });
 
 var Select = React.forwardRef(function (props, ref) {
+  var _Object$values;
   var _props$label = props.label,
     label = _props$label === void 0 ? "" : _props$label,
     _props$labelClassName = props.labelClassName,
@@ -7456,14 +7457,18 @@ var Select = React.forwardRef(function (props, ref) {
     placeholder = _props$placeholder === void 0 ? "" : _props$placeholder,
     _props$className = props.className,
     className = _props$className === void 0 ? "" : _props$className,
+    _props$optionClassNam = props.optionClassName,
+    optionClassName = _props$optionClassNam === void 0 ? "" : _props$optionClassNam,
+    _props$wrapClassName = props.wrapClassName,
+    wrapClassName = _props$wrapClassName === void 0 ? "" : _props$wrapClassName,
+    _props$selectClassNam = props.selectClassName,
+    selectClassName = _props$selectClassNam === void 0 ? "" : _props$selectClassNam,
     _props$rules = props.rules,
     rules = _props$rules === void 0 ? [] : _props$rules,
     options = props.options,
     _props$defaultValue = props.defaultValue,
     defaultValue = _props$defaultValue === void 0 ? {} : _props$defaultValue,
     handleSearchOption = props.handleSearchOption,
-    _props$wrapClassName = props.wrapClassName,
-    wrapClassName = _props$wrapClassName === void 0 ? "" : _props$wrapClassName,
     _props$isMulti = props.isMulti,
     isMulti = _props$isMulti === void 0 ? false : _props$isMulti,
     _props$onClick = props.onClick,
@@ -7473,7 +7478,8 @@ var Select = React.forwardRef(function (props, ref) {
     _props$funcDelete = props.funcDelete,
     funcDelete = _props$funcDelete === void 0 ? function () {} : _props$funcDelete,
     _props$isSearch = props.isSearch,
-    isSearch = _props$isSearch === void 0 ? true : _props$isSearch;
+    isSearch = _props$isSearch === void 0 ? true : _props$isSearch,
+    renderItem = props.renderItem;
   var _useState = React.useState(false),
     isOpen = _useState[0],
     setIsOpen = _useState[1];
@@ -7507,9 +7513,7 @@ var Select = React.forwardRef(function (props, ref) {
   }, [defaultValue]);
   React.useEffect(function () {
     setListOptions(options);
-    if (!isMulti) {
-      setValue({});
-    }
+    if (!isMulti) setValue(defaultValue);
   }, [options]);
   React.useEffect(function () {
     var _inputRef$current;
@@ -7615,7 +7619,7 @@ var Select = React.forwardRef(function (props, ref) {
     return (value === null || value === void 0 ? void 0 : value.value) == valueId;
   };
   var handleSelection = function handleSelection(item) {
-    if (isMulti === false) setValue(item);
+    if (!isMulti) setValue(item);
     onClick === null || onClick === void 0 ? void 0 : onClick(item);
   };
   var handleDeleteSelection = function handleDeleteSelection(e, item) {
@@ -7631,19 +7635,24 @@ var Select = React.forwardRef(function (props, ref) {
   }, " *") : null;
   return /*#__PURE__*/React__default.createElement("div", {
     ref: selectRef,
-    className: wrapClassName + " relative "
+    className: "relative " + wrapClassName
   }, label ? /*#__PURE__*/React__default.createElement("div", {
-    className: labelClassName + " mb-1"
+    className: "mb-1 " + labelClassName
   }, label, " ", labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
-    className: className + " flex flex-col gap-2 rounded-lg"
+    className: "flex flex-col gap-2 rounded-lg w-full border " + className
   }, /*#__PURE__*/React__default.createElement("button", {
-    className: "w-full h-10 bg-transparent flex justify-between items-center px-3 py-2",
+    className: "w-full h-10 bg-transparent flex justify-between items-center px-3 py-2 " + selectClassName,
     onClick: handleToggleSelect
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "flex justify-between items-center w-full"
   }, isEmpty(value) || isMulti ? /*#__PURE__*/React__default.createElement("div", {
     className: "text-gray3 line-clamp-1"
-  }, placeholder) : /*#__PURE__*/React__default.createElement("div", {
+  }, placeholder) : renderItem && !isEmpty(value) && !isMulti ? /*#__PURE__*/React__default.createElement("div", {
+    className: "w-full",
+    dangerouslySetInnerHTML: {
+      __html: Object === null || Object === void 0 ? void 0 : (_Object$values = Object.values(value)) === null || _Object$values === void 0 ? void 0 : _Object$values[0]
+    }
+  }) : /*#__PURE__*/React__default.createElement("div", {
     className: "line-clamp-1"
   }, value === null || value === void 0 ? void 0 : value.label), isButtonDelete && !isEmpty(value) ? /*#__PURE__*/React__default.createElement("div", {
     onClick: function onClick(e) {
@@ -7660,7 +7669,7 @@ var Select = React.forwardRef(function (props, ref) {
     style: {
       background: "#FFFFFF"
     },
-    className: className + " overflow-y-auto max-h-72  absolute p-1 my-2 rounded-2xl w-full z-50 border " + (dropdownPosition === 'top' ? 'bottom-full mb-2' : 'top-full mt-2')
+    className: "overflow-y-auto max-h-72  absolute p-1 my-2 rounded-2xl w-full z-50 border " + (dropdownPosition === 'top' ? 'bottom-full mb-2' : 'top-full mt-2') + " " + optionClassName
   }, /*#__PURE__*/React__default.createElement("div", null, isSearch ? /*#__PURE__*/React__default.createElement("div", {
     className: "px-3 flex items-center border-b-[1px]"
   }, /*#__PURE__*/React__default.createElement(lu.LuSearch, {
@@ -7683,7 +7692,7 @@ var Select = React.forwardRef(function (props, ref) {
       }
     }, /*#__PURE__*/React__default.createElement(io.IoMdCheckmark, {
       className: (checkSelection(item === null || item === void 0 ? void 0 : item.value) ? "" : 'invisible') + " inline me-2 w-4"
-    }), /*#__PURE__*/React__default.createElement("div", {
+    }), renderItem ? renderItem(item) : /*#__PURE__*/React__default.createElement("div", {
       className: " whitespace-nowrap line-clamp-1"
     }, item === null || item === void 0 ? void 0 : item.label));
   }) : /*#__PURE__*/React__default.createElement("div", {
@@ -7699,6 +7708,8 @@ var DateTimePicker = React.forwardRef(function (props, ref) {
     label = _props$label === void 0 ? "" : _props$label,
     _props$className = props.className,
     className = _props$className === void 0 ? "" : _props$className,
+    _props$labelClassName = props.labelClassName,
+    labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
     _props$defaultValue = props.defaultValue,
     defaultValue = _props$defaultValue === void 0 ? new Date() : _props$defaultValue,
     rules = props.rules;
@@ -7765,7 +7776,7 @@ var DateTimePicker = React.forwardRef(function (props, ref) {
   return /*#__PURE__*/React__default.createElement("div", {
     className: "w-full"
   }, label ? /*#__PURE__*/React__default.createElement("div", {
-    className: "mb-1"
+    className: "mb-1 " + labelClassName
   }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement(DatePicker, {
     selected: value,
     onChange: function onChange(date) {
@@ -7798,12 +7809,17 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
     rules = _props$rules === void 0 ? [] : _props$rules,
     _props$wrapClassName = props.wrapClassName,
     wrapClassName = _props$wrapClassName === void 0 ? "" : _props$wrapClassName,
-    inputClassName = props.inputClassName;
+    _props$inputClassName = props.inputClassName,
+    inputClassName = _props$inputClassName === void 0 ? "" : _props$inputClassName,
+    _props$labelClassName = props.labelClassName,
+    labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
+    buttonClassName = props.buttonClassName;
   var _useState = React.useState(defaultValue),
     value = _useState[0],
     _setValue = _useState[1];
   var _useState2 = React.useState({
-      label: "+84",
+      icons: "<?xml version=\"1.0\" encoding=\"utf-8\"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->\n<svg width=\"20\" height=\"20\" viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-hidden=\"true\" role=\"img\" class=\"iconify iconify--twemoji\" preserveAspectRatio=\"xMidYMid meet\"><path fill=\"#DA251D\" d=\"M32 5H4a4 4 0 0 0-4 4v18a4 4 0 0 0 4 4h28a4 4 0 0 0 4-4V9a4 4 0 0 0-4-4z\"></path><path fill=\"#FF0\" d=\"M19.753 16.037L18 10.642l-1.753 5.395h-5.672l4.589 3.333l-1.753 5.395L18 21.431l4.589 3.334l-1.753-5.395l4.589-3.333z\"></path></svg>",
+      label: "Việt Nam",
       value: "+84"
     }),
     countryCode = _useState2[0],
@@ -7861,25 +7877,41 @@ var InputPhoneNumber = React.forwardRef(function (props, ref) {
   var labelRequired = required ? /*#__PURE__*/React__default.createElement("span", {
     className: "text-danger"
   }, " *") : null;
-  var _inputClassName = "h-10 px-2 focus:outline-none focus:ring-0 " + inputClassName;
+  var _inputClassName = "h-full w-full px-2 focus:outline-none focus:ring-0 " + inputClassName;
   var data = React.useCallback([{
-    label: "+84",
+    icons: "<?xml version=\"1.0\" encoding=\"utf-8\"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->\n<svg width=\"20\" height=\"20\" viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-hidden=\"true\" role=\"img\" class=\"iconify iconify--twemoji\" preserveAspectRatio=\"xMidYMid meet\"><path fill=\"#DA251D\" d=\"M32 5H4a4 4 0 0 0-4 4v18a4 4 0 0 0 4 4h28a4 4 0 0 0 4-4V9a4 4 0 0 0-4-4z\"></path><path fill=\"#FF0\" d=\"M19.753 16.037L18 10.642l-1.753 5.395h-5.672l4.589 3.333l-1.753 5.395L18 21.431l4.589 3.334l-1.753-5.395l4.589-3.333z\"></path></svg>",
+    label: "Việt Nam",
     value: "+84"
   }], []);
   return /*#__PURE__*/React__default.createElement("div", {
-    className: wrapClassName + " flex flex-col"
+    className: "flex flex-col " + wrapClassName
   }, label ? /*#__PURE__*/React__default.createElement("label", {
-    className: "mb-1"
+    className: "mb-1 " + labelClassName
   }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("div", {
-    className: "flex items-center h-10 rounded-lg  px-2 py-1 " + className
+    className: "flex items-center h-10 rounded-lg border px-2 py-1 " + className
   }, /*#__PURE__*/React__default.createElement("button", {
-    className: "flex items-center border-r-2"
+    className: "flex items-center border-r-2 " + buttonClassName
   }, /*#__PURE__*/React__default.createElement(Select$1, {
-    className: 'w-max',
+    className: 'w-max border-0',
     defaultValue: countryCode,
     options: data,
+    optionClassName: "w-max",
     placeholder: "+84",
-    onClick: setCountryCode
+    onClick: setCountryCode,
+    selectClassName: "ps-0 pr-1",
+    renderItem: function renderItem(item) {
+      return /*#__PURE__*/React__default.createElement("div", {
+        className: "flex gap-3 items-center w-full"
+      }, /*#__PURE__*/React__default.createElement("div", {
+        dangerouslySetInnerHTML: {
+          __html: item === null || item === void 0 ? void 0 : item.icons
+        }
+      }), /*#__PURE__*/React__default.createElement("div", {
+        className: "text-start flex-1 text-sm"
+      }, item === null || item === void 0 ? void 0 : item.label), /*#__PURE__*/React__default.createElement("div", {
+        className: "text-gray3"
+      }, item === null || item === void 0 ? void 0 : item.value));
+    }
   })), /*#__PURE__*/React__default.createElement("input", {
     type: type,
     name: name,
@@ -8126,8 +8158,7 @@ var BookingForm = function BookingForm(props) {
       pattern: pattern === null || pattern === void 0 ? void 0 : pattern.phoneNumberPattern,
       message: "Số điện thoại không hợp lệ!"
     }],
-    className: "w-full rounded-lg rounded-lg bg-bgSecondary",
-    inputClassName: "w-full"
+    className: "bg-bgSecondary"
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "grid grid-cols-1 gap-4"
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -8138,7 +8169,7 @@ var BookingForm = function BookingForm(props) {
     defaultValue: listProductSelected,
     onClick: handleSelectedProduct,
     handleSearchOption: handleSearchProducts,
-    className: "bg-bgSecondary rounded-lg",
+    className: "bg-bgSecondary",
     rules: [{
       type: "required",
       message: "Bắt buộc chọn dịch vụ"
@@ -9358,9 +9389,9 @@ var ProductDetail10 = function ProductDetail10(props) {
     }
   }, [product]);
   var initVariant = function initVariant() {
-    var _product$variants;
+    var _product$variants, _variant$index;
     var variant = product === null || product === void 0 ? void 0 : (_product$variants = product.variants) === null || _product$variants === void 0 ? void 0 : _product$variants[0];
-    var indexOptions = variant.index.split(",");
+    var indexOptions = variant === null || variant === void 0 ? void 0 : (_variant$index = variant.index) === null || _variant$index === void 0 ? void 0 : _variant$index.split(",");
     setVariant(variant);
     var options = (product === null || product === void 0 ? void 0 : product.optionValues) || [];
     options = options.map(function (e, i) {
@@ -10269,6 +10300,8 @@ var TextArea = React.forwardRef(function (props, ref) {
     className = _props$className === void 0 ? "" : _props$className,
     _props$defaultValue = props.defaultValue,
     defaultValue = _props$defaultValue === void 0 ? "" : _props$defaultValue,
+    _props$labelClassName = props.labelClassName,
+    labelClassName = _props$labelClassName === void 0 ? "" : _props$labelClassName,
     _props$onChange = props.onChange,
     onChange = _props$onChange === void 0 ? function () {} : _props$onChange;
   var _useState = React.useState(defaultValue),
@@ -10329,11 +10362,11 @@ var TextArea = React.forwardRef(function (props, ref) {
   return /*#__PURE__*/React__default.createElement("div", {
     className: "" + className
   }, label ? /*#__PURE__*/React__default.createElement("div", {
-    className: "mb-1"
+    className: "mb-1 " + labelClassName
   }, label, labelRequired) : null, /*#__PURE__*/React__default.createElement("textarea", {
     name: "",
     id: "",
-    className: textareaClassName + "  focus:outline-none focus:ring-0",
+    className: "focus:outline-none focus:ring-0 " + textareaClassName,
     placeholder: placeholder,
     value: value,
     onChange: function onChange(e) {
@@ -10978,6 +11011,7 @@ exports.Button = Button;
 exports.Carts1 = Carts1;
 exports.Contact1 = Contact1;
 exports.CustomerRating10 = CustomerRating10;
+exports.DateTimePicker = DateTimePicker;
 exports.Employees1 = Employees1;
 exports.Features1 = Features1;
 exports.Features2 = Features2;