@pisell/private-materials 6.3.36 → 6.3.37

package/es/components/Sales/Summary/utils.d.ts

@@ -30,7 +30,7 @@ export declare const calculateSubtotal: (items: CartItem[]) => string;
  * @return {*}
  * @Author: xiangfeng.xue
  */
-export declare const calculateTaxFee: (shopInfo: any, items: CartItem[]) => Decimal | "0.00";
+export declare const calculateTaxFee: (shopInfo: any, items: CartItem[]) => "0.00" | Decimal;
 /**
  * 计算所有价格明细
  * @param items - 购物车商品数组

package/es/components/booking/info/service2/utils.d.ts

@@ -244,4 +244,4 @@ export declare const updateAppointmentServicePrice: (state: any, { start_date, e
  * @Author: WangHan
  * @Date: 2024-12-24 11:32
  */
-export declare const updateServicePrice: (state: any) => Promise<any> | never[];
+export declare const updateServicePrice: (state: any) => never[] | Promise<any>;

package/es/components/booking/utils.d.ts

@@ -165,10 +165,10 @@ export declare const getProductTotalPrice: (item: any) => number;
 export declare const getDuration: (duration: number | {
     type: string;
     value: number;
-}) => number | {
+}) => number | "flexible" | {
     type: string;
     value: number;
-} | "flexible";
+};
 export declare const isWalkIn: (customer_id?: number | string) => boolean;
 export declare const getIsEdit: (state: any) => boolean;
 export {};

package/es/components/eftposPay/amount.d.ts

@@ -8,7 +8,7 @@ import { PosProps } from './const';
  */
 declare const _default: ({ className, onChange, onClose, formatAmount, isMobile, net, client }: {
     className?: string | undefined;
-    onChange?: ((status: "success" | "page" | "fail" | "print" | "mark_tx_processed", params?: string | {
+    onChange?: ((status: "page" | "success" | "print" | "fail" | "mark_tx_processed", params?: string | {
         [keys: string]: unknown;
     } | undefined, other?: any) => void) | undefined;
     onClose: () => void;

package/es/components/eftposPay/device.d.ts

@@ -10,7 +10,7 @@ import './device.less';
 declare const _default: ({ api, onChange, onClose, className, device_number, isMobile, net, client, formatAmount, }: {
     api: PayProps['api'];
     className?: string | undefined;
-    onChange?: ((status: "success" | "page" | "fail" | "print" | "mark_tx_processed", params?: string | {
+    onChange?: ((status: "page" | "success" | "print" | "fail" | "mark_tx_processed", params?: string | {
         [keys: string]: unknown;
     } | undefined, other?: any) => void) | undefined;
     onClose: () => void;

package/es/components/eftposPay/hooks.d.ts

@@ -15,11 +15,11 @@ export declare const useStoreRef: <T extends {
     readonly numRef: React.MutableRefObject<string | number | undefined>;
     readonly orderIdRef: React.MutableRefObject<string | number>;
     readonly modeRef: React.MutableRefObject<ModeEnum>;
-    readonly statusRef: React.MutableRefObject<"success" | "warn" | "loading" | "fail" | "pedding" | "resove" | "reject" | "question">;
+    readonly statusRef: React.MutableRefObject<"loading" | "warn" | "success" | "fail" | "pedding" | "resove" | "reject" | "question">;
     readonly netRef: React.MutableRefObject<boolean | undefined>;
     readonly symbolRef: React.MutableRefObject<string>;
     readonly amountRef: React.MutableRefObject<string | number>;
-    readonly eftposRef: React.MutableRefObject<"payo" | "tyro" | "windcave" | "stripe" | "linkly">;
+    readonly eftposRef: React.MutableRefObject<"stripe" | "payo" | "tyro" | "windcave" | "linkly">;
     readonly clientRef: React.MutableRefObject<ClientEnum>;
     readonly dataRef: React.MutableRefObject<import("./store").State>;
 };

package/es/components/eftposPay/store/index.d.ts

@@ -174,7 +174,7 @@ export declare const updateCustom: (payload: {
 export declare const updateStatus: (status: 'loading' | 'warn' | 'fail' | 'success' | 'question') => {
     type: EActionTypes;
     payload: {
-        status: "success" | "warn" | "loading" | "fail" | "question";
+        status: "loading" | "warn" | "success" | "fail" | "question";
     };
 };
 /**
@@ -295,20 +295,20 @@ export declare const backUpFree: (payload: Partial<State>) => {
         name?: string | undefined;
         symbol?: string | undefined;
         amount?: string | number | undefined;
-        mode?: "pay" | "fullPay" | "refund" | "query" | undefined;
+        mode?: "refund" | "pay" | "fullPay" | "query" | undefined;
         order_id?: string | number | undefined;
-        eftpos?: "payo" | "tyro" | "windcave" | "stripe" | "linkly" | undefined;
-        action?: "amount" | "deviceList" | "pay" | undefined;
+        eftpos?: "stripe" | "payo" | "tyro" | "windcave" | "linkly" | undefined;
+        action?: "amount" | "pay" | "deviceList" | undefined;
         key?: number | undefined;
         step?: number | undefined;
         title?: string | undefined;
         subTitle?: string | undefined;
-        type?: "step" | "unset" | undefined;
+        type?: "unset" | "step" | undefined;
         render?: boolean | undefined;
         net?: boolean | undefined;
         component?: string | undefined;
         form?: string | undefined;
-        status?: "success" | "warn" | "loading" | "fail" | "pedding" | "resove" | "reject" | "question" | undefined;
+        status?: "loading" | "warn" | "success" | "fail" | "pedding" | "resove" | "reject" | "question" | undefined;
         warn?: string | undefined;
         steps?: {
             /** 用于重置当前步骤 */

package/es/pro/Login2.0/Login2.js

@@ -117,17 +117,11 @@ var Login2 = function Login2(_ref) {
   // 初始化 currentLoginMethod（当 loginMethods 变化时）
   useEffect(function () {
     if (loginMethods.length > 0 && !currentLoginMethod) {
-      // 优先选择非OAuth类型的登录方式作为当前激活方式
-      var nonOAuthMethod = loginMethods.find(function (method) {
-        return method.type === 'email' || method.type === 'phone';
-      });
-      var first = nonOAuthMethod || loginMethods[0];
-      setCurrentLoginMethod(first);
-
-      // 设置默认验证方式
-      if (first.type === 'email' || first.type === 'phone') {
-        var _first$verificationMe;
-        setCurrentVerificationMethod(((_first$verificationMe = first.verificationMethods) === null || _first$verificationMe === void 0 ? void 0 : _first$verificationMe[0]) || 'password');
+      var initialMethod = loginMethods[0];
+      setCurrentLoginMethod(initialMethod);
+      if ((initialMethod === null || initialMethod === void 0 ? void 0 : initialMethod.type) === 'email' || (initialMethod === null || initialMethod === void 0 ? void 0 : initialMethod.type) === 'phone') {
+        var _initialMethod$verifi;
+        setCurrentVerificationMethod(((_initialMethod$verifi = initialMethod.verificationMethods) === null || _initialMethod$verifi === void 0 ? void 0 : _initialMethod$verifi[0]) || 'password');
       }
     }
     // 如果只有 guest 登录，则默认直接使用 guest 登录
@@ -1885,14 +1879,18 @@ var Login2 = function Login2(_ref) {
   // 渲染底部切换选项区域
   var renderSwitchOptions = function renderSwitchOptions() {
     if (!currentLoginMethod) return null;
-    var nonOauthButtons = [];
-    if (currentLoginMethod.type === 'email' || currentLoginMethod.type === 'phone') {
+    var primaryMethod = loginMethods[0];
+    var currentIsFormMethod = currentLoginMethod.type === 'email' || currentLoginMethod.type === 'phone';
+    var primaryIsFormMethod = (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'email' || (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'phone';
+    var shouldUseFormLayout = currentIsFormMethod || primaryIsFormMethod;
+    var verificationSwitchButtons = [];
+    if (currentIsFormMethod) {
       (currentLoginMethod.verificationMethods || []).filter(function (method) {
         return method !== currentVerificationMethod;
       }).forEach(function (method) {
         if (method === 'verification_code') {
           var text = currentLoginMethod.type === 'email' ? locales.getText('pisell-login2-switch-to-email-code') : locales.getText('pisell-login2-switch-to-sms-code');
-          nonOauthButtons.push( /*#__PURE__*/React.createElement("button", {
+          verificationSwitchButtons.push( /*#__PURE__*/React.createElement("button", {
             key: "switch-to-code",
             className: "login2-switch-option-button",
             onClick: function onClick() {
@@ -1906,7 +1904,7 @@ var Login2 = function Login2(_ref) {
             className: "option-text"
           }, text)));
         } else {
-          nonOauthButtons.push( /*#__PURE__*/React.createElement("button", {
+          verificationSwitchButtons.push( /*#__PURE__*/React.createElement("button", {
             key: "switch-to-password",
             className: "login2-switch-option-button",
             onClick: function onClick() {
@@ -1920,16 +1918,15 @@ var Login2 = function Login2(_ref) {
         }
       });
     }
+    var emailPhoneSwitchButtons = [];
     loginMethods.forEach(function (method, index) {
       if (method.type === 'email' || method.type === 'phone') {
-        if (method.type === currentLoginMethod.type) {
-          return;
-        }
+        if (method.type === currentLoginMethod.type) return;
         var isLast = isLastLoginMethod(method.type);
         var _className = classNames('login2-switch-option-button', {
           'has-last-login-badge': isLast
         });
-        nonOauthButtons.push( /*#__PURE__*/React.createElement("button", {
+        emailPhoneSwitchButtons.push( /*#__PURE__*/React.createElement("button", {
           key: "".concat(method.type, "-").concat(index),
           className: _className,
           onClick: function onClick() {
@@ -1944,7 +1941,7 @@ var Login2 = function Login2(_ref) {
         }, method.type === 'email' ? locales.getText('pisell-login2-switch-to-email') : locales.getText('pisell-login2-switch-to-phone'))));
       }
     });
-    var showDivider = nonOauthButtons.length > 0 && oauthProviders.length > 0;
+    var nonOauthButtons = [].concat(verificationSwitchButtons, emailPhoneSwitchButtons);
     var registerPrompt = onSwitchToRegister && /*#__PURE__*/React.createElement("div", {
       className: "login2-register-prompt"
     }, /*#__PURE__*/React.createElement("span", {
@@ -1956,18 +1953,72 @@ var Login2 = function Login2(_ref) {
     if (!nonOauthButtons.length && !oauthProviders.length) {
       return registerPrompt;
     }
-    return /*#__PURE__*/React.createElement(React.Fragment, null, showDivider && /*#__PURE__*/React.createElement("div", {
-      className: "login2-divider"
-    }, locales.getText('pisell-login2-or')), (nonOauthButtons.length > 0 || oauthProviders.length > 0) && /*#__PURE__*/React.createElement("div", {
+    if (shouldUseFormLayout) {
+      var groups = [];
+      if (nonOauthButtons.length > 0) {
+        groups.push( /*#__PURE__*/React.createElement("div", {
+          key: "non-oauth",
+          className: "login2-switch-options"
+        }, nonOauthButtons));
+      }
+      if (oauthProviders.length > 0) {
+        groups.push( /*#__PURE__*/React.createElement(OAuthButtonGroup, {
+          key: "oauth",
+          providers: oauthProviders,
+          wrapperClassName: "login2-oauth-buttons",
+          buttonClassName: "login2-oauth-button",
+          gap: 12
+        }));
+      }
+      if (!groups.length) {
+        return registerPrompt;
+      }
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+        className: "login2-divider"
+      }, locales.getText('pisell-login2-or')), /*#__PURE__*/React.createElement("div", {
+        className: "login2-switch-groups"
+      }, groups), registerPrompt);
+    }
+    var primaryProvider = oauthProviders.find(function (provider) {
+      return provider.key === (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type);
+    });
+    var secondaryOauthProviders = oauthProviders.filter(function (provider) {
+      return provider.key !== (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type);
+    });
+    var hasSecondaryButtons = nonOauthButtons.length > 0 || secondaryOauthProviders.length > 0;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
       className: "login2-switch-groups"
-    }, nonOauthButtons.length > 0 && /*#__PURE__*/React.createElement("div", {
+    }, primaryProvider ? /*#__PURE__*/React.createElement(OAuthButtonGroup, {
+      providers: [primaryProvider],
+      wrapperClassName: "login2-oauth-buttons",
+      buttonClassName: "login2-oauth-button",
+      gap: 12
+    }) : /*#__PURE__*/React.createElement("div", {
+      className: "login2-switch-options"
+    }, /*#__PURE__*/React.createElement("button", {
+      key: "primary-fallback",
+      className: "login2-switch-option-button",
+      onClick: function onClick() {
+        if ((primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'guest') {
+          handleGuestLogin();
+        } else if ((primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'google' || (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'facebook' || (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'apple') {
+          handleOAuthClick(primaryMethod.type);
+        }
+      }
+    }, /*#__PURE__*/React.createElement(Iconfont, {
+      type: (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'guest' ? 'pisell2-user-01' : (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'google' ? 'pisell2-google' : (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'facebook' ? 'pisell2-facebook' : 'pisell2-apple'
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "option-text"
+    }, (primaryMethod === null || primaryMethod === void 0 ? void 0 : primaryMethod.type) === 'guest' ? locales.getText('pisell-login2-login-as-guest') : "".concat(locales.getText('pisell-login2-continue-with'), " ").concat(primaryMethod !== null && primaryMethod !== void 0 && primaryMethod.type ? primaryMethod.type.charAt(0).toUpperCase() + primaryMethod.type.slice(1) : '')))), hasSecondaryButtons && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+      className: "login2-divider"
+    }, locales.getText('pisell-login2-or')), nonOauthButtons.length > 0 && /*#__PURE__*/React.createElement("div", {
       className: "login2-switch-options"
-    }, nonOauthButtons), oauthProviders.length > 0 && /*#__PURE__*/React.createElement(OAuthButtonGroup, {
-      providers: oauthProviders,
+    }, nonOauthButtons), secondaryOauthProviders.length > 0 && /*#__PURE__*/React.createElement(OAuthButtonGroup, {
+      providers: secondaryOauthProviders,
       wrapperClassName: "login2-oauth-buttons",
       buttonClassName: "login2-oauth-button",
       gap: 12
-    })), registerPrompt);
+    }))), registerPrompt);
   };
 
   // 渲染 OAuth 按钮

package/lib/components/Sales/Summary/utils.d.ts

@@ -30,7 +30,7 @@ export declare const calculateSubtotal: (items: CartItem[]) => string;
  * @return {*}
  * @Author: xiangfeng.xue
  */
-export declare const calculateTaxFee: (shopInfo: any, items: CartItem[]) => Decimal | "0.00";
+export declare const calculateTaxFee: (shopInfo: any, items: CartItem[]) => "0.00" | Decimal;
 /**
  * 计算所有价格明细
  * @param items - 购物车商品数组

package/lib/components/booking/info/service2/utils.d.ts

@@ -244,4 +244,4 @@ export declare const updateAppointmentServicePrice: (state: any, { start_date, e
  * @Author: WangHan
  * @Date: 2024-12-24 11:32
  */
-export declare const updateServicePrice: (state: any) => Promise<any> | never[];
+export declare const updateServicePrice: (state: any) => never[] | Promise<any>;

package/lib/components/booking/utils.d.ts

@@ -165,10 +165,10 @@ export declare const getProductTotalPrice: (item: any) => number;
 export declare const getDuration: (duration: number | {
     type: string;
     value: number;
-}) => number | {
+}) => number | "flexible" | {
     type: string;
     value: number;
-} | "flexible";
+};
 export declare const isWalkIn: (customer_id?: number | string) => boolean;
 export declare const getIsEdit: (state: any) => boolean;
 export {};

package/lib/components/eftposPay/amount.d.ts

@@ -8,7 +8,7 @@ import { PosProps } from './const';
  */
 declare const _default: ({ className, onChange, onClose, formatAmount, isMobile, net, client }: {
     className?: string | undefined;
-    onChange?: ((status: "success" | "page" | "fail" | "print" | "mark_tx_processed", params?: string | {
+    onChange?: ((status: "page" | "success" | "print" | "fail" | "mark_tx_processed", params?: string | {
         [keys: string]: unknown;
     } | undefined, other?: any) => void) | undefined;
     onClose: () => void;

package/lib/components/eftposPay/device.d.ts

@@ -10,7 +10,7 @@ import './device.less';
 declare const _default: ({ api, onChange, onClose, className, device_number, isMobile, net, client, formatAmount, }: {
     api: PayProps['api'];
     className?: string | undefined;
-    onChange?: ((status: "success" | "page" | "fail" | "print" | "mark_tx_processed", params?: string | {
+    onChange?: ((status: "page" | "success" | "print" | "fail" | "mark_tx_processed", params?: string | {
         [keys: string]: unknown;
     } | undefined, other?: any) => void) | undefined;
     onClose: () => void;

package/lib/components/eftposPay/hooks.d.ts

@@ -15,11 +15,11 @@ export declare const useStoreRef: <T extends {
     readonly numRef: React.MutableRefObject<string | number | undefined>;
     readonly orderIdRef: React.MutableRefObject<string | number>;
     readonly modeRef: React.MutableRefObject<ModeEnum>;
-    readonly statusRef: React.MutableRefObject<"success" | "warn" | "loading" | "fail" | "pedding" | "resove" | "reject" | "question">;
+    readonly statusRef: React.MutableRefObject<"loading" | "warn" | "success" | "fail" | "pedding" | "resove" | "reject" | "question">;
     readonly netRef: React.MutableRefObject<boolean | undefined>;
     readonly symbolRef: React.MutableRefObject<string>;
     readonly amountRef: React.MutableRefObject<string | number>;
-    readonly eftposRef: React.MutableRefObject<"payo" | "tyro" | "windcave" | "stripe" | "linkly">;
+    readonly eftposRef: React.MutableRefObject<"stripe" | "payo" | "tyro" | "windcave" | "linkly">;
     readonly clientRef: React.MutableRefObject<ClientEnum>;
     readonly dataRef: React.MutableRefObject<import("./store").State>;
 };

package/lib/components/eftposPay/store/index.d.ts

@@ -174,7 +174,7 @@ export declare const updateCustom: (payload: {
 export declare const updateStatus: (status: 'loading' | 'warn' | 'fail' | 'success' | 'question') => {
     type: EActionTypes;
     payload: {
-        status: "success" | "warn" | "loading" | "fail" | "question";
+        status: "loading" | "warn" | "success" | "fail" | "question";
     };
 };
 /**
@@ -295,20 +295,20 @@ export declare const backUpFree: (payload: Partial<State>) => {
         name?: string | undefined;
         symbol?: string | undefined;
         amount?: string | number | undefined;
-        mode?: "pay" | "fullPay" | "refund" | "query" | undefined;
+        mode?: "refund" | "pay" | "fullPay" | "query" | undefined;
         order_id?: string | number | undefined;
-        eftpos?: "payo" | "tyro" | "windcave" | "stripe" | "linkly" | undefined;
-        action?: "amount" | "deviceList" | "pay" | undefined;
+        eftpos?: "stripe" | "payo" | "tyro" | "windcave" | "linkly" | undefined;
+        action?: "amount" | "pay" | "deviceList" | undefined;
         key?: number | undefined;
         step?: number | undefined;
         title?: string | undefined;
         subTitle?: string | undefined;
-        type?: "step" | "unset" | undefined;
+        type?: "unset" | "step" | undefined;
         render?: boolean | undefined;
         net?: boolean | undefined;
         component?: string | undefined;
         form?: string | undefined;
-        status?: "success" | "warn" | "loading" | "fail" | "pedding" | "resove" | "reject" | "question" | undefined;
+        status?: "loading" | "warn" | "success" | "fail" | "pedding" | "resove" | "reject" | "question" | undefined;
         warn?: string | undefined;
         steps?: {
             /** 用于重置当前步骤 */

package/lib/pro/Login2.0/Login2.js

@@ -104,14 +104,11 @@ var Login2 = ({
   (0, import_react.useEffect)(() => {
     var _a2;
     if (loginMethods.length > 0 && !currentLoginMethod) {
-      const nonOAuthMethod = loginMethods.find(
-        (method) => method.type === "email" || method.type === "phone"
-      );
-      const first = nonOAuthMethod || loginMethods[0];
-      setCurrentLoginMethod(first);
-      if (first.type === "email" || first.type === "phone") {
+      const initialMethod = loginMethods[0];
+      setCurrentLoginMethod(initialMethod);
+      if ((initialMethod == null ? void 0 : initialMethod.type) === "email" || (initialMethod == null ? void 0 : initialMethod.type) === "phone") {
         setCurrentVerificationMethod(
-          ((_a2 = first.verificationMethods) == null ? void 0 : _a2[0]) || "password"
+          ((_a2 = initialMethod.verificationMethods) == null ? void 0 : _a2[0]) || "password"
         );
       }
     }
@@ -1219,12 +1216,16 @@ var Login2 = ({
   };
   const renderSwitchOptions = () => {
     if (!currentLoginMethod) return null;
-    const nonOauthButtons = [];
-    if (currentLoginMethod.type === "email" || currentLoginMethod.type === "phone") {
+    const primaryMethod = loginMethods[0];
+    const currentIsFormMethod = currentLoginMethod.type === "email" || currentLoginMethod.type === "phone";
+    const primaryIsFormMethod = (primaryMethod == null ? void 0 : primaryMethod.type) === "email" || (primaryMethod == null ? void 0 : primaryMethod.type) === "phone";
+    const shouldUseFormLayout = currentIsFormMethod || primaryIsFormMethod;
+    const verificationSwitchButtons = [];
+    if (currentIsFormMethod) {
       (currentLoginMethod.verificationMethods || []).filter((method) => method !== currentVerificationMethod).forEach((method) => {
         if (method === "verification_code") {
           const text = currentLoginMethod.type === "email" ? import_utils.locales.getText("pisell-login2-switch-to-email-code") : import_utils.locales.getText("pisell-login2-switch-to-sms-code");
-          nonOauthButtons.push(
+          verificationSwitchButtons.push(
             /* @__PURE__ */ import_react.default.createElement(
               "button",
               {
@@ -1237,7 +1238,7 @@ var Login2 = ({
             )
           );
         } else {
-          nonOauthButtons.push(
+          verificationSwitchButtons.push(
             /* @__PURE__ */ import_react.default.createElement(
               "button",
               {
@@ -1252,17 +1253,15 @@ var Login2 = ({
         }
       });
     }
+    const emailPhoneSwitchButtons = [];
     loginMethods.forEach((method, index) => {
       if (method.type === "email" || method.type === "phone") {
-        if (method.type === currentLoginMethod.type) {
-          return;
-        }
+        if (method.type === currentLoginMethod.type) return;
         const isLast = isLastLoginMethod(method.type);
-        const className2 = (0, import_classnames.default)(
-          "login2-switch-option-button",
-          { "has-last-login-badge": isLast }
-        );
-        nonOauthButtons.push(
+        const className2 = (0, import_classnames.default)("login2-switch-option-button", {
+          "has-last-login-badge": isLast
+        });
+        emailPhoneSwitchButtons.push(
           /* @__PURE__ */ import_react.default.createElement(
             "button",
             {
@@ -1282,7 +1281,10 @@ var Login2 = ({
         );
       }
     });
-    const showDivider = nonOauthButtons.length > 0 && oauthProviders.length > 0;
+    const nonOauthButtons = [
+      ...verificationSwitchButtons,
+      ...emailPhoneSwitchButtons
+    ];
     const registerPrompt = onSwitchToRegister && /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-register-prompt" }, /* @__PURE__ */ import_react.default.createElement("span", { className: "register-prompt-text" }, import_utils.locales.getText("pisell-login2-no-account")), /* @__PURE__ */ import_react.default.createElement(
       "button",
       {
@@ -1294,15 +1296,76 @@ var Login2 = ({
     if (!nonOauthButtons.length && !oauthProviders.length) {
       return registerPrompt;
     }
-    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, showDivider && /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-divider" }, import_utils.locales.getText("pisell-login2-or")), (nonOauthButtons.length > 0 || oauthProviders.length > 0) && /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-switch-groups" }, nonOauthButtons.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-switch-options" }, nonOauthButtons), oauthProviders.length > 0 && /* @__PURE__ */ import_react.default.createElement(
+    if (shouldUseFormLayout) {
+      const groups = [];
+      if (nonOauthButtons.length > 0) {
+        groups.push(
+          /* @__PURE__ */ import_react.default.createElement("div", { key: "non-oauth", className: "login2-switch-options" }, nonOauthButtons)
+        );
+      }
+      if (oauthProviders.length > 0) {
+        groups.push(
+          /* @__PURE__ */ import_react.default.createElement(
+            import_OAuthButtonGroup.default,
+            {
+              key: "oauth",
+              providers: oauthProviders,
+              wrapperClassName: "login2-oauth-buttons",
+              buttonClassName: "login2-oauth-button",
+              gap: 12
+            }
+          )
+        );
+      }
+      if (!groups.length) {
+        return registerPrompt;
+      }
+      return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-divider" }, import_utils.locales.getText("pisell-login2-or")), /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-switch-groups" }, groups), registerPrompt);
+    }
+    const primaryProvider = oauthProviders.find(
+      (provider) => provider.key === (primaryMethod == null ? void 0 : primaryMethod.type)
+    );
+    const secondaryOauthProviders = oauthProviders.filter(
+      (provider) => provider.key !== (primaryMethod == null ? void 0 : primaryMethod.type)
+    );
+    const hasSecondaryButtons = nonOauthButtons.length > 0 || secondaryOauthProviders.length > 0;
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-switch-groups" }, primaryProvider ? /* @__PURE__ */ import_react.default.createElement(
+      import_OAuthButtonGroup.default,
+      {
+        providers: [primaryProvider],
+        wrapperClassName: "login2-oauth-buttons",
+        buttonClassName: "login2-oauth-button",
+        gap: 12
+      }
+    ) : /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-switch-options" }, /* @__PURE__ */ import_react.default.createElement(
+      "button",
+      {
+        key: "primary-fallback",
+        className: "login2-switch-option-button",
+        onClick: () => {
+          if ((primaryMethod == null ? void 0 : primaryMethod.type) === "guest") {
+            handleGuestLogin();
+          } else if ((primaryMethod == null ? void 0 : primaryMethod.type) === "google" || (primaryMethod == null ? void 0 : primaryMethod.type) === "facebook" || (primaryMethod == null ? void 0 : primaryMethod.type) === "apple") {
+            handleOAuthClick(primaryMethod.type);
+          }
+        }
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_materials2.Iconfont,
+        {
+          type: (primaryMethod == null ? void 0 : primaryMethod.type) === "guest" ? "pisell2-user-01" : (primaryMethod == null ? void 0 : primaryMethod.type) === "google" ? "pisell2-google" : (primaryMethod == null ? void 0 : primaryMethod.type) === "facebook" ? "pisell2-facebook" : "pisell2-apple"
+        }
+      ),
+      /* @__PURE__ */ import_react.default.createElement("span", { className: "option-text" }, (primaryMethod == null ? void 0 : primaryMethod.type) === "guest" ? import_utils.locales.getText("pisell-login2-login-as-guest") : `${import_utils.locales.getText("pisell-login2-continue-with")} ${(primaryMethod == null ? void 0 : primaryMethod.type) ? primaryMethod.type.charAt(0).toUpperCase() + primaryMethod.type.slice(1) : ""}`)
+    )), hasSecondaryButtons && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-divider" }, import_utils.locales.getText("pisell-login2-or")), nonOauthButtons.length > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "login2-switch-options" }, nonOauthButtons), secondaryOauthProviders.length > 0 && /* @__PURE__ */ import_react.default.createElement(
       import_OAuthButtonGroup.default,
       {
-        providers: oauthProviders,
+        providers: secondaryOauthProviders,
         wrapperClassName: "login2-oauth-buttons",
         buttonClassName: "login2-oauth-button",
         gap: 12
       }
-    )), registerPrompt);
+    ))), registerPrompt);
   };
   if (!visible) {
     return null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/private-materials",
-  "version": "6.3.36",
+  "version": "6.3.37",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",