@akinon/pz-b2b 2.0.0-beta.0 → 2.0.0-beta.10

package/CHANGELOG.md

@@ -1,5 +1,46 @@
 # @akinon/pz-b2b
 
+## 2.0.0-beta.10
+
+### Minor Changes
+
+- 2806320: ZERO-3390: Update version tailwindcss, autoprefixer, tailwind-merge, postcss
+
+## 2.0.0-beta.9
+
+### Minor Changes
+
+- 0fe7711: ZERO-3387: Upgrade nextjs, eslint-config-next
+
+## 2.0.0-beta.8
+
+## 2.0.0-beta.7
+
+## 2.0.0-beta.6
+
+### Minor Changes
+
+- 8f05f9b: ZERO-3250: Beta branch synchronized with Main branch
+
+## 2.0.0-beta.5
+
+## 2.0.0-beta.4
+
+## 2.0.0-beta.3
+
+## 2.0.0-beta.2
+
+### Minor Changes
+
+- a006015: ZERO-3116: Add not-found page and update default middleware.
+- 1eeb3d8: ZERO-3116: Add not found page
+
+## 2.0.0-beta.1
+
+### Minor Changes
+
+- ZERO-3091: Upgrade Next.js to v15 and React to v19
+
 ## 2.0.0-beta.0
 
 ### Major Changes

package/README.md

@@ -1,13 +1,13 @@
 # @akinon/pz-b2b
 
-### Install the npm package
+## Installation
+
+You can use the following command to install the extension with the latest plugins:
 
 ```bash
-# For latest version
-yarn add @akinon/pz-b2b
 
-# Preferred installation method
 npx @akinon/projectzero@latest --plugins
+
 ```
 
 ### Installation

package/package.json

@@ -1,18 +1,18 @@
 {
   "name": "@akinon/pz-b2b",
-  "version": "2.0.0-beta.0",
+  "version": "2.0.0-beta.10",
   "license": "MIT",
   "main": "src/index.ts",
   "peerDependencies": {
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0"
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@types/node": "^18.7.8",
-    "@types/react": "^18.0.17",
-    "@types/react-dom": "^18.0.6",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "typescript": "^4.7.4"
+    "@types/node": "^22.10.2",
+    "@types/react": "^19.0.2",
+    "@types/react-dom": "^19.0.2",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "typescript": "^5.7.2"
   }
 }

package/src/basket-b2b/index.tsx

@@ -184,7 +184,7 @@ export function BasketB2b({ translations }: BasketB2bProps) {
 
   return (
     <>
-      <div className="max-w-screen-xl p-4 flex flex-col text-primary-800 lg:p-8 xl:flex-row xl:mx-auto">
+      <div className="max-w-(--breakpoint-xl) p-4 flex flex-col text-primary-800 lg:p-8 xl:flex-row xl:mx-auto">
         {isLoading && (
           <div className="flex justify-center w-full">
             <LoaderSpinner />
@@ -232,7 +232,7 @@ export function BasketB2b({ translations }: BasketB2bProps) {
                 </div>
 
                 <div className="w-full overflow-x-auto">
-                  <table className="border table-fixed overflow-scroll align-middle lg:w-full">
+                  <table className="border border-gray-200 table-fixed overflow-scroll align-middle lg:w-full">
                     <thead className="bg-[#eff1f8]">
                       <tr>
                         <th className="w-7 border border-[#d5dadb]"></th>
@@ -313,7 +313,7 @@ export function BasketB2b({ translations }: BasketB2bProps) {
             </div>
           ) : (
             <div
-              className="flex flex-col items-center container max-w-screen-sm py-4 px-4 xs:py-6 xs:px-6 sm:py-8 sm:px-8 lg:max-w-screen-xl
+              className="flex flex-col items-center container max-w-(--breakpoint-sm) py-4 px-4 xs:py-6 xs:px-6 sm:py-8 sm:px-8 lg:max-w-(--breakpoint-xl)
           shadow-[0_0_4px_0_rgba(194,194,194,0.5)]"
             >
               <div className="w-full text-sm text-black-800 text-center my-4 mb-2 sm:text-base">
@@ -331,7 +331,7 @@ export function BasketB2b({ translations }: BasketB2bProps) {
                   <i className="pz-icon-chevron-down absolute right-4 top-1/2 -translate-y-1/2 pointer-events-none"></i>
                   <select
                     onChange={(e) => setSelectedDraft(e.target.value)}
-                    className="w-[230px] h-[40px] mb-1 border border-[#d4d4d4] px-4 appearance-none text-sm outline-none cursor-pointer"
+                    className="w-[230px] h-[40px] mb-1 border border-[#d4d4d4] px-4 appearance-none text-sm outline-hidden cursor-pointer"
                   >
                     <option value="">
                       {_translations.empty.choose_cart_placeholder}

package/src/hook/use-b2b.tsx

@@ -29,7 +29,7 @@ const B2bButton = useCallback(({buttonText}) => {
     return isVisible ? (
       <Button
         className={twMerge(
-          'fixed bottom-0 right-0 w-1/2 h-14 z-[20] flex items-center justify-center fill-primary-foreground hover:fill-primary sm:relative sm:w-full sm:mt-3 sm:font-semibold',
+          'fixed bottom-0 right-0 w-1/2 h-14 z-20 flex items-center justify-center fill-primary-foreground hover:fill-primary sm:relative sm:w-full sm:mt-3 sm:font-semibold',
           divisionLoading && 'bg-black/50'
         )}
         onClick={() => setOpenSelectStoreModal(true)}

package/src/views/basket-b2b/basket-item.tsx

@@ -50,7 +50,7 @@ export const BasketItem = (props: Props) => {
       <tr>
         <td>
           <div className="h-[183px] w-full flex flex-col justify-between items-center text-xs">
-            <div className="w-full flex items-center justify-center py-3 mb-3 border-b">
+            <div className="w-full flex items-center justify-center py-3 mb-3 border-b border-gray-200">
               <Icon name="chevron-down" size={10} />
             </div>
 
@@ -74,7 +74,7 @@ export const BasketItem = (props: Props) => {
               onClick={() => {
                 setProductToBeDeleted(basketItem), setRemoveProduct(true);
               }}
-              className="py-1.5 border-t w-full flex items-center justify-center"
+              className="py-1.5 border-t border-gray-200 w-full flex items-center justify-center"
               style={{ writingMode: 'vertical-rl', textOrientation: 'mixed' }}
             >
               {deleteText}
@@ -82,7 +82,7 @@ export const BasketItem = (props: Props) => {
           </div>
         </td>
 
-        <td className="border text-center">
+        <td className="border border-gray-200 text-center">
           <div className="min-w-[80px] w-full h-full flex items-center justify-center">
             <Image
               src={basketItem.product.product_image}
@@ -93,26 +93,26 @@ export const BasketItem = (props: Props) => {
           </div>
         </td>
 
-        <td className="min-w-[181px] text-sm border text-[#3f4b5c] leading-normal">
+        <td className="min-w-[181px] text-sm border border-gray-200 text-[#3f4b5c] leading-normal">
           <div className="px-4">
             <div className="break-words">{basketItem.product.name}</div>
             <div className="break-words">SKU: {basketItem.product.sku}</div>
           </div>
         </td>
 
-        <td className="text-sm border text-[#3f4b5c] leading-normal text-right px-3">
+        <td className="text-sm border border-gray-200 text-[#3f4b5c] leading-normal text-right px-3">
           <Price value={basketItem.price} className="w-max block" />
         </td>
 
-        <td className="text-sm border text-[#3f4b5c] leading-normal text-center">
+        <td className="text-sm border border-gray-200 text-[#3f4b5c] leading-normal text-center">
           <div className="min-w-[90px]">{basketItem.quantity}</div>
         </td>
 
-        <td className="border">
+        <td className="border border-gray-200">
           <div className="min-w-[140px]">
             {basketItem.divisions.map((division) => (
               <div
-                className="py-5 px-1 border-b last:border-0 text-center flex items-center justify-center gap-x-1"
+                className="py-5 px-1 border-b border-gray-200 last:border-0 text-center flex items-center justify-center gap-x-1"
                 key={division.name}
               >
                 <Icon name="b2b-info" size={18} className="text-[#293245]" />
@@ -133,7 +133,7 @@ export const BasketItem = (props: Props) => {
           </div>
         </td>
 
-        <td className="border">
+        <td className="border border-gray-200">
           <div className="min-w-[120px]">
             {basketItem.divisions.map((division, index) => (
               <div
@@ -141,7 +141,7 @@ export const BasketItem = (props: Props) => {
                 key={`division-${division.id}`}
               >
                 <Input
-                  className="appearance-none outline-none w-20 h-6 px-2 py-0 border border-[#c8daec] rounded text-right"
+                  className="appearance-none outline-hidden w-20 h-6 px-2 py-0 border border-[#c8daec] rounded-sm text-right"
                   type="number"
                   value={division.quantity}
                   onChange={(e) => handleChange(division.id, e, index)}
@@ -159,7 +159,7 @@ export const BasketItem = (props: Props) => {
           </div>
         </td>
 
-        <td className="text-sm border text-[#3f4b5c] leading-normal text-right px-6">
+        <td className="text-sm border border-gray-200 text-[#3f4b5c] leading-normal text-right px-6">
           <Price value={basketItem.total_amount} className="w-max block" />
         </td>
       </tr>

package/src/views/basket-b2b/request-quote-modal.tsx

@@ -69,7 +69,7 @@ export const RequestQuoteModal = ({
               id="cart-name-input"
               name="name"
               type="text"
-              className="h-8 border border-[#eeeeee] text-sm mb-2.5 outline-none px-2 w-full"
+              className="h-8 border border-[#eeeeee] text-sm mb-2.5 outline-hidden px-2 w-full"
               onChange={(e) => setCartName(e.target.value)}
             />
 

package/src/views/basket-b2b/save-cart-modal.tsx

@@ -60,7 +60,7 @@ export const SaveCartModal = ({
               id="cart-name-input"
               name="name"
               type="text"
-              className="h-8 border border-[#eeeeee] text-sm mb-2.5 outline-none px-2 w-full"
+              className="h-8 border border-[#eeeeee] text-sm mb-2.5 outline-hidden px-2 w-full"
               onChange={(e) => setCartName(e.target.value)}
             />
             <button

package/src/views/basket-b2b/upload-modal.tsx

@@ -70,7 +70,7 @@ export const UploadModal = ({
                 onChange={handleFileChange}
                 className="opacity-0 w-full absolute left-0 top-0 h-full text-[0px] cursor-pointer"
               />
-              <Button className="pointer-events-none h-9 text-white border rounded mb-1">
+              <Button className="pointer-events-none h-9 text-white border border-gray-200 rounded-sm mb-1">
                 {t('basket.b2b.upload_file_modal.select_file')}
               </Button>
 

package/src/views/product/store-modal.tsx

@@ -129,7 +129,7 @@ export function StoreModal({
         </header>
         <div className="p-[15px] md:p-[30px]">
           <table className="w-full flex flex-col h-full md:h-auto md:table md:w-[540px]">
-            <thead className="w-full flex-grow-0 shrink-0 basis-auto table">
+            <thead className="w-full grow-0 shrink-0 basis-auto table">
               <tr className="border border-[#d7d7d7] bg-[#fafafa]">
                 <th className="w-[43px] border-r border-[#d7d7d7]"></th>
                 <th className="w-[190px] md:w-auto text-[11px] text-[#99999d] py-[18px] px-4 border-r border-[#d7d7d7] text-left font-normal">
@@ -162,9 +162,11 @@ export function StoreModal({
                   <td className="text-right pr-6 md:pr-[37px] max-w-[111px] w-[111px] md:w-[180px] md:max-w-[180px]">
                     <input
                       type="number"
-                      className="w-[64px] md:w-[84px] h-[31px] border border-[#d7d7d7] outline-none text-xs text-right pr-1 appearance-none"
+                      className="w-[64px] md:w-[84px] h-[31px] border border-[#d7d7d7] outline-hidden text-xs text-right pr-1 appearance-none"
                       onChange={(e) => handleQuantityChange(store.id, e)}
-                      ref={(ref) => (inputRefs[store.id] = ref)}
+                      ref={(ref) => {
+                        inputRefs[store.id] = ref;
+                      }}
                     />
                   </td>
                 </tr>