@pisell/private-materials 6.12.376 → 6.12.378

package/lib/components/HDLKiosk/slices/customization/PrimaryProductSelection/index.less

@@ -1,110 +1,140 @@
-// Fill the workflow content area while leaving room for the shell's floating bar.
+// The shell owns the header and floating cart bar; fill the space between them.
 .pisell-hdl-kiosk .hdl-primary-selection {
+  container-type: inline-size;
   display: flex;
+  flex: 1;
   width: 100%;
   min-width: 0;
   min-height: 0;
-  flex: 1;
-  overflow: hidden;
   padding-bottom: var(--hdl-bottom-bar-clearance);
-  background: #faf8f5;
+  overflow: hidden;
+  background: #eee8dc url('./assets/order-background.svg') center top /
+    max(100%, 1080px) auto;
 }
 
 .hdl-ps-dialog {
-  --hdl-ps-red: #b20d12;
-  --hdl-ps-ink: #292523;
-  --hdl-ps-muted: #736b65;
   display: flex;
-  width: 100%;
+  flex: 1;
   min-width: 0;
   min-height: 0;
-  flex-direction: column;
-  padding: 24px;
-  overflow: hidden;
-  color: var(--hdl-ps-ink);
-  font-size: 16px;
-  line-height: 1.5;
+  color: #252323;
   text-align: left;
-  animation: hdl-ps-dialog-enter 180ms ease-out both;
 }
 .hdl-ps-dialog button {
-  font: inherit;
+  appearance: none;
+  font-family: inherit;
   cursor: pointer;
   touch-action: manipulation;
   -webkit-tap-highlight-color: transparent;
 }
-.hdl-ps-dialog button:focus-visible {
-  outline: 3px solid #2563eb;
-  outline-offset: 4px;
-}
 .hdl-ps-content {
   display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: clamp(12px, 1.85cqw, 20px);
+  min-width: 0;
   min-height: 0;
+  padding: clamp(12px, 1.67cqw, 18px) clamp(24px, 4.9cqw, 53px);
+}
+.hdl-ps-choices {
+  --hdl-ps-gap: clamp(24px, 3.7cqw, 40px);
+  display: flex;
   flex: 1;
+  flex-direction: column;
+  gap: var(--hdl-ps-gap);
+  min-height: 0;
   overflow: auto;
   overscroll-behavior: contain;
-  padding: 24px 8px;
+  // Leave room for keyboard focus inside the scroll region.
+  padding: 4px;
+  margin: -4px;
 }
-.hdl-ps-selection {
-  width: min(960px, 100%);
-  min-width: 0;
+.hdl-ps-group {
+  --hdl-ps-zone-ink: #963047;
+  --hdl-ps-zone-line: #d5bfa5;
+  position: relative;
+  display: flex;
+  // Every product keeps its own height; additional products scroll instead of shrinking.
   flex: none;
-  margin: auto;
+  flex-direction: column;
+  gap: clamp(4px, 0.74cqw, 8px);
+  min-width: 0;
+  padding: clamp(8px, 1.4cqw, 15px);
+  border: 1px solid #cfbda5;
+  border-radius: clamp(18px, 2.8cqw, 30px);
+  background: #faf4e8;
+}
+.hdl-ps-group[data-zone='standard'] {
+  --hdl-ps-zone-ink: #3f4b45;
+  --hdl-ps-zone-line: #c1c7bd;
+  border-color: #bfc6bc;
+  background: #f2f4ee;
+}
+.hdl-ps-group + .hdl-ps-group::before {
+  position: absolute;
+  inset: calc(var(--hdl-ps-gap) / -2) 0 auto;
+  height: 1px;
+  background: #cbbba6;
+  content: '';
+  pointer-events: none;
 }
-.hdl-ps-heading {
-  margin: 0 0 32px;
-  text-align: center;
+.hdl-ps-marker {
+  display: flex;
+  flex: none;
+  align-items: center;
+  gap: clamp(12px, 1.8cqw, 20px);
+  min-height: clamp(26px, 3.9cqw, 42px);
+  padding-inline: clamp(4px, 0.74cqw, 8px);
 }
-.hdl-ps-heading h2 {
+.hdl-ps-marker h3 {
+  flex: none;
   margin: 0;
-  font-size: 40px;
-  font-weight: 850;
-  line-height: 1.25;
-  letter-spacing: -0.025em;
-  outline: none;
+  color: var(--hdl-ps-zone-ink);
+  font-size: clamp(18px, 3.15cqw, 34px);
+  font-weight: 650;
+  line-height: 1.2;
 }
-.hdl-ps-heading .hdl-ps-description {
-  margin: 10px 0 0;
-  font-size: 20px;
-  color: var(--hdl-ps-muted);
+.hdl-ps-marker-line {
+  flex: 1;
+  height: 1px;
+  background: var(--hdl-ps-zone-line);
 }
 .hdl-ps-products {
-  --hdl-ps-product-height: 250px;
   display: grid;
-  grid-template-columns: repeat(2, minmax(0, 1fr));
-  gap: 20px;
+  grid-template-columns: minmax(0, 1fr);
+  gap: clamp(12px, 1.85cqw, 20px);
+  min-width: 0;
 }
-.hdl-ps-products > :first-child,
-.hdl-ps-products > :last-child:nth-child(even) {
-  grid-column: 1 / -1;
+.hdl-ps-image-area {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  min-height: 0;
+  padding: 4px;
 }
-.hdl-ps-dialog .hdl-ps-product {
-  display: grid;
-  grid-template-columns: minmax(0, 24%) minmax(0, 1fr) auto;
-  align-items: center;
+.hdl-ps-poster-area {
+  width: 100%;
   min-width: 0;
-  min-height: var(--hdl-ps-product-height);
-  padding: 12px;
-  border: 1.5px solid #d8d1ca;
-  border-radius: 24px;
-  color: var(--hdl-ps-ink);
-  background: #fff;
-  text-align: left;
-  transition: border-color 160ms, background 160ms, box-shadow 160ms;
+  min-height: 0;
 }
-.hdl-ps-dialog .hdl-ps-products > :first-child {
-  min-height: calc(var(--hdl-ps-product-height) * 1.4);
+.hdl-ps-dialog .hdl-ps-product {
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  border-radius: clamp(10px, 1.6cqw, 18px);
+  background: transparent;
+  overflow: hidden;
+  transition: transform 160ms ease, filter 160ms ease;
 }
 .hdl-ps-product-image {
   position: relative;
-  display: grid;
-  place-items: center;
+  display: block;
   width: 100%;
-  min-height: 0;
-  aspect-ratio: 1 / 1;
-  overflow: hidden;
-  border-radius: 14px;
-  background: #f1ece6;
+  // Keep every poster at the same display ratio, including square source images.
+  aspect-ratio: 16 / 10;
 }
 .hdl-ps-product-image img {
   position: absolute;
@@ -113,86 +143,106 @@
   width: 100%;
   height: 100%;
   object-fit: cover;
+  object-position: center;
+  user-select: none;
+  -webkit-user-drag: none;
 }
 .hdl-ps-image-fallback {
-  padding: 12px;
-  color: var(--hdl-ps-muted);
-  text-align: center;
-}
-.hdl-ps-product-details {
+  position: absolute;
+  inset: 0;
   display: flex;
-  min-width: 0;
   align-self: stretch;
-  flex-direction: column;
+  align-items: center;
   justify-content: center;
-  padding: 12px 28px;
+  flex-direction: column;
+  gap: 12px;
+  width: 100%;
+  height: 100%;
+  padding: 16px;
+  background: #ebe5da;
+  color: #645b52;
+  font-size: clamp(16px, 2.2cqw, 24px);
+  text-align: center;
 }
-.hdl-ps-product-name {
-  display: block;
-  font-size: 32px;
-  font-weight: 800;
-  line-height: 1.3;
+.hdl-ps-image-fallback strong {
+  color: #252323;
+  font-size: clamp(20px, 3cqw, 32px);
 }
-.hdl-ps-product-subtitle {
-  display: block;
+.hdl-ps-unavailable {
+  flex: none;
   margin-top: 8px;
-  font-size: 20px;
-  line-height: 1.5;
-  color: var(--hdl-ps-muted);
+  color: #645b52;
+  font-size: clamp(14px, 1.85cqw, 20px);
+  line-height: 1.4;
+  text-align: center;
 }
-.hdl-ps-select-arrow {
-  display: grid;
-  place-items: center;
-  width: 64px;
-  height: 64px;
-  margin-right: 12px;
-  border-radius: 16px;
-  background: #fff2ef;
-  color: var(--hdl-ps-red);
-}
-.hdl-ps-select-arrow svg {
-  width: 36px;
-  height: 36px;
+.hdl-ps-dialog .hdl-ps-skip {
+  display: block;
+  flex: none;
+  width: 100%;
+  min-height: clamp(64px, 10cqw, 108px);
+  margin: 0;
+  padding: 12px 20px;
+  border: 1px solid #cdbbb1;
+  border-radius: clamp(8px, 1.6cqw, 18px);
+  background: #faf7ef;
+  color: #b80020;
+  font-size: clamp(16px, 2.65cqw, 29px);
+  font-weight: 650;
+  line-height: 1.3;
+  text-align: center;
+  transition: background-color 160ms ease;
 }
 .hdl-ps-dialog .hdl-ps-product:not(:disabled):active {
-  border-color: var(--hdl-ps-red);
-  background: #fff3f1;
-  box-shadow: inset 0 0 0 1px var(--hdl-ps-red);
+  transform: scale(0.975);
+  filter: brightness(0.92);
 }
 @media (hover: hover) {
-  .hdl-ps-dialog .hdl-ps-product:not(:disabled):hover {
-    border-color: var(--hdl-ps-red);
-    background: #fffaf8;
+  .hdl-ps-product:not(:disabled):hover {
+    filter: brightness(0.97);
+  }
+  .hdl-ps-skip:not(:disabled):hover {
+    background: #f8eeee;
   }
 }
-.hdl-ps-unavailable {
-  margin-top: 12px;
-  color: var(--hdl-ps-muted);
-  font-size: 18px;
-  line-height: 1.5;
+.hdl-ps-dialog .hdl-ps-skip:not(:disabled):active {
+  filter: brightness(0.96);
 }
-.hdl-ps-dialog .hdl-ps-skip {
-  flex: none;
-  width: 100%;
-  margin-top: 24px;
+.hdl-ps-dialog button:focus-visible {
+  outline: 3px solid #b80020;
+  outline-offset: 4px;
 }
-.pisell-hdl-kiosk .hdl-ps-dialog button:disabled {
-  background: #ebe6e1;
-  color: #847b75;
+.hdl-ps-dialog button:disabled {
   cursor: not-allowed;
 }
-@keyframes hdl-ps-dialog-enter {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
+.hdl-ps-dialog .hdl-ps-product:disabled {
+  filter: grayscale(0.65);
+}
+.hdl-ps-dialog .hdl-ps-skip:disabled {
+  color: #645b52;
+}
+.hdl-ps-empty {
+  margin: auto;
+  color: #645b52;
+  font-size: clamp(18px, 2.2cqw, 24px);
+  text-align: center;
+}
+.hdl-ps-sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  border: 0;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
 }
 @media (prefers-reduced-motion: reduce) {
-  .hdl-ps-dialog,
-  .hdl-ps-dialog * {
-    animation: none !important;
-    transition: none !important;
+  .hdl-ps-dialog button {
+    transition: none;
+  }
+  .hdl-ps-dialog .hdl-ps-product:not(:disabled):active {
+    transform: none;
   }
 }

package/lib/components/HDLKiosk/slices/customization/Screen/index.js

@@ -446,7 +446,7 @@ function CustomizationScreen({ product, loading, errorReference, errorMessage, b
 			});
 		}
 	}) : null, /* @__PURE__ */ react.default.createElement("div", { className: "hdl-customization-hero" }, /* @__PURE__ */ react.default.createElement("article", { className: "hdl-customization-product" }, /* @__PURE__ */ react.default.createElement("div", { className: "hdl-customization-product__media" }, (productFacts === null || productFacts === void 0 ? void 0 : productFacts.imageUrl) ? /* @__PURE__ */ react.default.createElement("img", {
-		src: productFacts.imageUrl,
+		src: _pisell_utils.image.ali(productFacts.imageUrl, 540),
 		alt: ""
 	}) : /* @__PURE__ */ react.default.createElement(require_artwork.ProductFallback, null)), /* @__PURE__ */ react.default.createElement("div", { className: "hdl-customization-product__copy" }, /* @__PURE__ */ react.default.createElement("p", null, _pisell_utils.locales.getText("pisell2.hdl-kiosk.customization-product-eyebrow")), /* @__PURE__ */ react.default.createElement("h1", { id: "hdl-customization-title" }, (productFacts === null || productFacts === void 0 ? void 0 : productFacts.name) || _pisell_utils.locales.getText("pisell2.hdl-kiosk.primary-product-loading"), " ", /* @__PURE__ */ react.default.createElement("span", { className: "hdl-customization-product__price" }, productFacts ? require_model.formatMoney(unitPricePerStandardWeight, orderBar.currencySymbol) : "—", /* @__PURE__ */ react.default.createElement("small", null, "/", standardProduct ? _pisell_utils.locales.getText("pisell2.hdl-kiosk.primary-per-item") : STANDARD_WEIGHT_UNIT_LABEL))))), standardProduct ? /* @__PURE__ */ react.default.createElement("aside", { className: "hdl-customization-weight hdl-customization-description" }, /* @__PURE__ */ react.default.createElement("div", { className: "hdl-customization-description__content" }, productFacts.description ? /* @__PURE__ */ react.default.createElement("div", {
 		className: "hdl-customization-description__body",

package/lib/plus/salesSdk/context/SalesSdkProvider.js

@@ -1625,6 +1625,7 @@ const SalesSdkProvider = ({ osKey, enableMultiCurrencySettlement = false, soluti
 			const resolver = require_createOpenGiftSelectHost.createOpenGiftSelectHost(hostBridges.giftSelect, () => bookingTicketRef.current, {
 				getUiHosts: () => uiHostsValue,
 				apiPrefix: context === null || context === void 0 || (_context$appHelper2 = context.appHelper) === null || _context$appHelper2 === void 0 || (_context$appHelper2 = _context$appHelper2.constants) === null || _context$appHelper2 === void 0 ? void 0 : _context$appHelper2.apiPrefix,
+				autoSelectSingleGift: !(moduleOtherParams.businessCode === "venue_ticket" && productLoadChannel === "online_ordering"),
 				salesSettingsSource,
 				ensureSalesSettings
 			});
@@ -1639,6 +1640,8 @@ const SalesSdkProvider = ({ osKey, enableMultiCurrencySettlement = false, soluti
 		utils === null || utils === void 0 ? void 0 : utils.promotionEvaluator,
 		context === null || context === void 0 || (_context$appHelper3 = context.appHelper) === null || _context$appHelper3 === void 0 || (_context$appHelper3 = _context$appHelper3.constants) === null || _context$appHelper3 === void 0 ? void 0 : _context$appHelper3.apiPrefix,
 		hostBridges.giftSelect,
+		moduleOtherParams.businessCode,
+		productLoadChannel,
 		uiHostsValue,
 		salesSettingsSource,
 		ensureSalesSettings

package/lib/plus/salesSdk/giftSelect/buildGiftOrderProducts.js

@@ -80,7 +80,7 @@ function buildGiftOrderProduct(choice, productData, ctx) {
 		product_bundle: [],
 		metadata: {
 			unique_identification_number: uid,
-			source_product_price: "0.00",
+			source_product_price: finalOriginal,
 			main_product_original_price: finalOriginal,
 			main_product_selling_price: "0.00",
 			price_schema_version: 2,
@@ -139,7 +139,7 @@ function applyGiftMetadataToOrderProduct(orderLine, choice, productData, ctx) {
 		}],
 		metadata: require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, metadata), {}, {
 			unique_identification_number: metadata.unique_identification_number || orderLine.unique_identification_number || createUuidV4(),
-			source_product_price: "0.00",
+			source_product_price: finalOriginal,
 			main_product_original_price: finalOriginal,
 			main_product_selling_price: "0.00",
 			price_schema_version: 2,

package/lib/plus/salesSdk/giftSelect/createOpenGiftSelectHost.js

@@ -130,7 +130,7 @@ function _resolveSingleBookingGiftChoice() {
 * 行为：
 * - 唯一且无规格/套餐的普通赠品：自动构造赠品行
 * - 唯一且无规格/套餐的预约赠品：复用 sale 加车决策链补齐预约信息
-* - 有规格/套餐、多候选或购物车重选：通过 bridge 打开赠品弹窗
+* - 关闭自动选择、有规格/套餐、多候选或购物车重选：通过 bridge 打开赠品弹窗
 * - 用户取消：返回 null
 *
 * @example
@@ -148,7 +148,7 @@ function createOpenGiftSelectHost(bridge, getBookingTicket, options) {
 			if (!require_mapGiftSelectContext.shouldOpenGiftSelectModal(ctx)) return null;
 			yield require_giftSalesSettings.ensureGiftSalesSettings(options || {}, bookingTicket);
 			let choices = null;
-			if (ctx.giftOptions.length === 1 && ctx.mode !== "edit") {
+			if ((options === null || options === void 0 ? void 0 : options.autoSelectSingleGift) !== false && ctx.giftOptions.length === 1 && ctx.mode !== "edit") {
 				var _bookingTicket$getPro;
 				const option = ctx.giftOptions[0];
 				const products = yield (_bookingTicket$getPro = bookingTicket.getProductByIds) === null || _bookingTicket$getPro === void 0 ? void 0 : _bookingTicket$getPro.call(bookingTicket, [Number(option.product_id)]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/private-materials",
-  "version": "6.12.376",
+  "version": "6.12.378",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -74,10 +74,10 @@
     "styled-components": "^6.0.0-rc.3",
     "use-sync-external-store": "^1.6.0",
     "@pisell/pi-payment-sdk": "0.0.4",
-    "@pisell/materials": "6.12.88",
-    "@pisell/date-picker": "3.0.12",
+    "@pisell/utils": "3.0.7",
     "@pisell/icon": "0.0.11",
-    "@pisell/utils": "3.0.7"
+    "@pisell/materials": "6.12.88",
+    "@pisell/date-picker": "3.0.12"
   },
   "peerDependencies": {
     "react": "^18.0.0",

package/es/plus/pisellReservation/index.js

@@ -1,17 +0,0 @@
-import "./serve/formResourcePage.js";
-import "./floorRoomCard/mapRowToFloorRoomCardData.js";
-import "./floorRoomCard/ReservationFloorRoomCard.js";
-import "./floorMap/reservationMock.js";
-import "./floorMap/floorPlanApi.js";
-import "./reservationConstants.js";
-import "./data/bookingToReservationTables.js";
-import "./data/formResourceToReservationTables.js";
-import "./data/salesEmbeddedResourceToTableRows.js";
-import "./floorMap/reservationCards.js";
-import "./PisellReservation.js";
-import "./PisellReservationBookingPage.js";
-import "./PisellVenueControlPage.js";
-import "./PisellVenueWallPage.js";
-import "./PisellReservationTablePage.js";
-import "./components/SelectFloorMapResourceDialog.js";
-export {};

package/es/plus/salesSdk/index.js

@@ -1,54 +0,0 @@
-import "./hosts/createInstanceHostBridge.js";
-import "./holderConfirm/createHolderConfirmBridge.js";
-import "./giftSelect/createGiftSelectBridge.js";
-import "./context/SalesSdkHostBridgesContext.js";
-import "./utils/formatHolderOptions.js";
-import "./utils/enrichCartLineHolderDisplay.js";
-import "./context/SalesSdkHolderContext.js";
-import "../multiCurrencySettlement/index.js";
-import "./utils/customerAuthGate.js";
-import "./context/SalesSdkBusinessAvailabilityContext.js";
-import "./utils/appendPromotionTags.js";
-import "./utils/productSkuOptions.js";
-import "./context/SalesSdkUIHostsContext.js";
-import "./utils/runAddProductFlow.js";
-import "./components/showAddToCartToast.js";
-import "./utils/resolveAddProductDebounceKey.js";
-import "./utils/identity.js";
-import "./utils/resolveInCartQuantityForAddToast.js";
-import "./utils/addProductWithFlowDebounced.js";
-import "./utils/bookingDate.js";
-import "./utils/holderSubmitValidation.js";
-import "./utils/removeOrderProducts.js";
-import "./selectors.js";
-import "./utils/enrich.js";
-import "./giftSelect/createOpenGiftSelectHost.js";
-import "./utils/ensureHoldersBeforeSubmit.js";
-import "./hooks/useSalesSdk.js";
-import "./bookingEditService/BookingEditServiceDrawer.js";
-import "./hosts/BookingEditHostRenderer.js";
-import "./hosts/CustomerAuthHostRenderer.js";
-import "./hooks/useSalesSdkCart.js";
-import "./hooks/useSalesSdkCustomer.js";
-import "./normalProductDetail/NormalProductDetailHostRenderer.js";
-import "./hosts/createOpenBookingEditHost.js";
-import "./hosts/createOpenMultiDaySelectHost.js";
-import "./hosts/createOpenHolderSelectHost.js";
-import "./hosts/createOpenCustomerAuthHost.js";
-import "./demo/hosts/legacyOpenProductDetail.js";
-import "./hosts/createCompositeOpenProductDetailHost.js";
-import "./normalProductDetail/createOpenNormalProductDetailHost.js";
-import "./normalProductDetail/createOpenBookingSelectionFlowHost.js";
-import "./giftSelect/GiftSelectModal.js";
-import "./giftSelect/GiftSelectHostRenderer.js";
-import "./allergy/AllergySelectionModal.js";
-import "./context/SalesSdkProvider.js";
-import "./context/SalesSdkDishContext.js";
-import "./context/SalesSdkBookingContext.js";
-import "./hooks/useSalesSdkSummary.js";
-import "./hooks/useSalesSdkProducts.js";
-import "./demo/index.js";
-import "./hooks/useSalesSdkDish.js";
-import "./hooks/useCurrentSalesSdkDish.js";
-import "./hooks/useSyncOsModule.js";
-export {};