@pisell/materials 6.12.47 → 6.12.50
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/lowcode/assets-daily.json +11 -11
- package/build/lowcode/assets-dev.json +2 -2
- package/build/lowcode/assets-prod.json +11 -11
- package/build/lowcode/meta.js +3 -3
- package/build/lowcode/preview.js +1 -1
- package/build/lowcode/render/default/view.css +1 -1
- package/build/lowcode/render/default/view.js +2 -2
- package/build/lowcode/view.css +1 -1
- package/build/lowcode/view.js +2 -2
- package/es/components/productCard/cartSkuCard/index.js +24 -3
- package/es/components/productCard/cartSkuCard/index.less +18 -0
- package/es/components/productCard/cartSkuCard/types.d.ts +55 -0
- package/es/components/productCard/cartSkuCard/variants/A12/index.js +124 -0
- package/es/components/productCard/cartSkuCard/variants/A12/index.less +245 -0
- package/es/components/productCard/lineItem/index.js +42 -11
- package/es/components/productCard/types.d.ts +4 -1
- package/es/index.d.ts +2 -1
- package/lib/components/productCard/cartSkuCard/index.js +24 -3
- package/lib/components/productCard/cartSkuCard/index.less +18 -0
- package/lib/components/productCard/cartSkuCard/types.d.ts +55 -0
- package/lib/components/productCard/cartSkuCard/variants/A12/index.js +127 -0
- package/lib/components/productCard/cartSkuCard/variants/A12/index.less +245 -0
- package/lib/components/productCard/lineItem/index.js +42 -11
- package/lib/components/productCard/types.d.ts +4 -1
- package/lib/index.d.ts +2 -1
- package/package.json +3 -3
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { CartSkuCardA12Display } from "./cartSkuCard/types.js";
|
|
2
|
+
|
|
1
3
|
//#region src/components/productCard/types.d.ts
|
|
2
4
|
type bundleType = {
|
|
3
5
|
id: number;
|
|
@@ -59,7 +61,8 @@ type productType = {
|
|
|
59
61
|
is_show_week?: boolean;
|
|
60
62
|
promotions?: any[];
|
|
61
63
|
isGift?: boolean;
|
|
62
|
-
giftData?: any;
|
|
64
|
+
giftData?: any; /** A12 横向购物车卡片的归一化展示数据。 */
|
|
65
|
+
a12?: CartSkuCardA12Display;
|
|
63
66
|
};
|
|
64
67
|
/**
|
|
65
68
|
* 排序总配置
|
package/es/index.d.ts
CHANGED
|
@@ -253,6 +253,7 @@ import { PisellSort } from "./components/pisellSort/index.js";
|
|
|
253
253
|
import { useToast } from "./components/pisellToast/squareToast/index.js";
|
|
254
254
|
import { PisellToast } from "./components/pisellToast/index.js";
|
|
255
255
|
import { PisellTooltip } from "./components/pisellTooltip/index.js";
|
|
256
|
+
import { CartSkuCardA12Display, CartSkuCardA12Presentation, CartSkuCardA12Slots, CartSkuCardVariant } from "./components/productCard/cartSkuCard/types.js";
|
|
256
257
|
import { ProductCard } from "./components/productCard/index.js";
|
|
257
258
|
import { ProfileMenu } from "./components/profileMenu/index.js";
|
|
258
259
|
import { QRCode } from "./components/qrcode/index.js";
|
|
@@ -278,4 +279,4 @@ import { Number } from "./components/virtual-keyboard/Number/index.js";
|
|
|
278
279
|
import { VirtualInput } from "./components/virtualInput/index.js";
|
|
279
280
|
import { WalletCard } from "./components/walletCard/index.js";
|
|
280
281
|
import { Affix, Alert, Anchor, Avatar, Breadcrumb, Card, Carousel, Col, ColorPicker, Descriptions, Divider, Empty, Grid, InputNumber as InputNumber$1, Mentions, Menu, Pagination, Popconfirm, Popover, Progress, Rate, Result, Row, Space, Spin, Statistic, Steps, Switch as Switch$1, Tag, Timeline, Tooltip, Transfer, Tree, message, notification, version } from "antd";
|
|
281
|
-
export { type AdaptColumnsForPhoneLayoutOptions, Affix, Alert, Anchor, AppVersionControl, AutoComplete, AutoCompleteNumber, AutoResizeText, Avatar, Badge, type BadgeConfig, Translation as BaseTranslation, type BatchActionBarPosition, type BatchActionConfirmConfig, type BatchActionItem, BatchEditor, Breadcrumb, Button, _default as ButtonGroupEdit, _default$1 as ButtonGroupPreview, Calendar, type CalendarPersistContextValue, type CalendarPersistKind, CalendarPersistProvider, Card, CardMetricItem, type PisellStatisticProps as CardMetricItemProps, _default$2 as CardPro, Carousel, Cascader, Checkbox, ClassicLayout, Col, Collapse, ColorPicker, type CompiledSelectionFlowModuleConfig, type CompiledSelectionFlowStep, Component, type CompoundedComponent, ConfigProvider, type CountryCode, type CreateShopFloorPlanClientOptions, CropPhoto, type CursorMode, CustomSelect, DEFAULT_CALENDAR_SLOT_STEP_MINUTES, DEFAULT_RESOURCE_WALL_FILTER_FIELD_KEY, DEFAULT_RESOURCE_WALL_LAYOUT_PERSIST, type DataSourceContainerProps, _default$3 as DataSourceForm, DataSourceImage, DataSourceMenu, DataSourceQRCode, DataSourceSubForm, type DataSourceSubFormProps, _default$4 as DataSourceTable, DataSourceTypography, DataSourceWrapper, DatePicker, type DefaultActionsConfig, Descriptions, _default$5 as Div, Divider, DragSortTree, Drawer, Dropdown, EMPTY_FLOOR_MAP_LAYOUT_CONTEXT, Empty, type EnsureShopFloorPlanByCodeOptions, FIND_FALLBACK_SCANNER_COUNT_KEY, FLOOR_MAP_BUILTIN_SHAPES, FLOOR_MAP_BUILTIN_SHAPE_ELEMENT_KIND, FLOOR_MAP_IMAGE_ELEMENT_KIND, FLOOR_MAP_SELECTION_ZONE_ELEMENT_KIND, FLOOR_MAP_STAGE_ELEMENT_KIND, Filter, type FloorMapBindingPlaceholderReason, FloorMapBuiltinShapeElement, type FloorMapCanvasNameI18n, type FloorMapDataSourceRow, type FloorMapDataSources, type FloorMapEdge, type FloorMapEdgeAnchor, type FloorMapEdgeStatus, type FloorMapElementKindCategory, type FloorMapElementKindConfig, type FloorMapFullscreenMode, FloorMapImageElement, type FloorMapItemBase, type FloorMapLayoutContextValue, FloorMapLayoutProvider, type FloorMapLayoutProviderProps, type FloorMapMergedItem, type FloorMapRenderOptions, type FloorMapResourcePickerRecord, type FloorMapResourcePickerSlotProps, type FloorMapSceneElement, FloorMapSelectionZoneElement, type FloorMapViewConfig, type FloorMapViewportOverlayRenderArgs, type FlowModuleBeforeLeaveResult, type FlowModuleBeforeLeaveReturn, type FlowModuleDataMap, type FlowModuleHandle, type FlowModuleState, type FlowModuleStateMap, type FlowModuleStatus, type FlowModuleValidationResult, type FlowModuleValidationReturn, _default$6 as Form, FormGroup, Checkbox$1 as FormItemCheckbox, ColorPicker$1 as FormItemColorPicker, DatePicker$1 as FormItemDatePicker, IconSelect as FormItemIconSelect, Input as FormItemInput, InputNumber as FormItemInputNumber, Radio as FormItemRadio, RecordListWrapperWithDataSource as FormItemRecordListWrapper, SelectWithDataSource as FormItemSelect, Switch as FormItemSwitch, FormItemTabs, TimePicker as FormItemTimePicker, Translation$1 as FormItemTranslation, Upload as FormItemUpload, Provider as GraphicTextCard, type GraphicTextCardProps, type GraphicTextCardSize, type GraphicTextCardVariant, Grid, type GridProProps, type GridViewProps, type GroupBlocks, type GroupModel, type GroupViewVariant, PREFIX_CLS as HIERARCHICAL_SUMMARY_LIST_PREFIX_CLS, _default$7 as Icon, IconSelect$1 as IconSelect, IconFont as Iconfont, Image, type ImageDataSource, type ImageFillMode, Input$1 as Input, InputNumber$1 as InputNumber, InputNumberRange, type ItemContext, type ItemLayout, JsonWrapperProvider as JsonWrapper, _default$8 as Keyboard, type LevelType, List, type LookupInputRenderContext, LowCodePage, type MailtoOptions, Mentions, Menu, Modal, Provider$1 as MultilevelCard, type MultilevelCardProps, type MultipleSelectRef, NAME_AS_TITLE_EXT_KEY, OrganizationTenantSwitcher, Page, PageHeader, Pagination, PisellAdjustPrice, PisellAdjustPriceInputNumber, PisellAlert, PisellAnchor, PisellAppCard, type PisellAppCardProps, PisellAvatar, type PisellBasicCardProps, MemoizedPisellBasicGrid as PisellBasicGrid, type PisellBasicGridProps, PisellBatchActionBar, type PisellBatchActionBarProps, PisellCard, _default$9 as PisellCardList, type PisellCardPickerCardMeta, type PisellCardPickerCategoryConfig, type PisellCardPickerCategoryLevelConfig, type PisellCardPickerCategoryMode, type PisellCardPickerCategoryPath, type PisellCardPickerItem, type PisellCardPickerMode, PisellCards, PisellCheckboxGroup, PisellConfigProvider, PisellContainer, PisellContent, PisellContext, PisellCountdown, MemoizedPisellCurrency as PisellCurrency, type PisellCurrencyProps, PisellCustomCheckboxGroup, PisellDataSourceContainer, PisellDatePicker, _default$10 as PisellDateTimeDisplay, type PisellDateTimeDisplayProps, Demo as PisellDraggable, PisellDropSort, PisellDropdown, _default$11 as PisellEmail, type PisellEmailProps, PisellEmpty, PisellFields, PisellFilter, type PisellFilterProps, PisellFind, type PisellFindProps, type PisellFindRef, PisellFloatingPanel, PisellFloorMapLayout, type PisellFloorMapLayoutProps, type PisellFloorMapLayoutRef, PisellFooter, index as PisellGoodPassCard, PisellGridPro, GridView as PisellGridView, MemoizedPisellGroupView as PisellGroupView, type PisellGroupViewProps, PisellHeader, PisellHeaderProgressBar, PisellHierarchicalSummaryList, type PisellHierarchicalSummaryListAggregateConfig, type PisellHierarchicalSummaryListAggregateMode, type PisellHierarchicalSummaryListItem, type PisellHierarchicalSummaryListKey, type PisellHierarchicalSummaryListLevelConfig, type PisellHierarchicalSummaryListProps, Provider$2 as PisellImageCard, type PisellImageCardProps, PisellImageCarousels, PisellInformationEntry, PisellInput, PisellLayout, type PisellLayoutProps, PisellLayouts, PisellList01, PisellLoading, _default$12 as PisellLongText, type PisellLongTextProps, PisellLookup, type PisellLookupProps, type PisellLookupRef, PisellMenu, type PisellMenuProps, PisellMetricCard, type PisellMetricCardProps, PisellMetrics, PisellMobileDateRangePicker, type PisellMobileDateRangePickerProps, PisellModal, PisellMultipleSelect, type PisellMultipleSelectProps, PisellNavigationMenu, MemoizedPisellNumber as PisellNumber, Number as PisellNumberKeyboard, type PisellNumberProps, MemoizedPisellPercent as PisellPercent, type PisellPercentProps, _default$13 as PisellPhone, type PisellPhoneProps, Amount as PisellPriceKeyboard, PisellProcedure, ProcedureHeader as PisellProcedureHeader, type ProcedureHeaderProps as PisellProcedureHeaderProps, type PisellProcedureProps, type PisellProcedureRef, PisellQRScanner, type PisellQRScannerProps, PisellQrcode, pisellQuickFilter as PisellQuickFilter, type PisellQuickFilterProps, _default$14 as PisellRating, type PisellRatingProps, PisellRecordBoard, PisellRecordBoardCalendarView, type PisellRecordBoardCalendarViewProps, PisellRecordBoardResourceWallView, PisellReservationSchedule, PisellReservationScheduleBand, type PisellReservationScheduleBandProps, type PisellReservationScheduleProps, PisellRow, type PisellRowProps, PisellScan, PisellScrollView, type PisellScrollViewProps, PisellSectionHeaders, _default$15 as PisellSelectionFlow, type PisellSelectionFlowController, type PisellSelectionFlowProps, PisellShellFrame, type PisellShellFrameConfig, type PisellShellFrameProps, type PisellShellFrameScrollConfig, PisellSider, _default$16 as PisellSingleLineText, type PisellSingleLineTextProps, PisellSingleSelect, type PisellSingleSelectProps, PisellSort, type PisellSortProps, PisellStatisticList, type PisellStatisticListProps, type PisellStatisticProps, type PisellStepItem, PisellSteps, type PisellStepsProps, _default$17 as PisellSuperTabs, type PisellSuperTabsProps, PisellTabbar, PisellTabbar$1 as PisellTabbar2, type PisellTabbarProps, _default$18 as PisellTabbarTemplate1, type PisellTabbarTemplate1Direction, type PisellTabbarTemplate1Props, PisellTags, type PisellTagsProps, PisellText, PisellTimeNavigator, type PisellTimeNavigatorProps, PisellTimeRangeDisplay, type PisellTimeRangeDisplayProps, PisellToast, Toolbar as PisellToolBar, PisellTooltip, PisellUpload, _default$19 as PisellUrl, type PisellUrlProps, PisellViewGrid, PisellWalletPassCard, type PisellWalletPassCardProps, Popconfirm, Popover, type PostShopFloorPlanBody, type ProcedureBodyProps, type ProcedureFooterProps, type ProcedureHeaderProps$1 as ProcedureHeaderProps, ProductCard, ProfileMenu, Progress, PublishVersionModal, type PutShopFloorPlanBody, QRCode, RECORD_BOARD_PHONE_GRID_CLASS, Radio$1 as Radio, Rate, type RecordBoardBlockedTimeMergedRange, type RecordBoardBlockedTimePanelPayload, type RecordBoardBodyView, type RecordBoardBookingMoveDraft, type RecordBoardCalendarBlockedTimePayload, type RecordBoardCalendarBookingLike, type RecordBoardCalendarBookingRenderArgs, type RecordBoardCalendarDayOverlayBooking, type RecordBoardCalendarProps, type RecordBoardCalendarResource, type RecordBoardCalendarResourceRenderArgs, type RecordBoardCalendarSelectedFreeSlot, type RecordBoardCalendarTimelineHeaderGroup, type RecordBoardCalendarTimelineHeaderRenderContext, type RecordBoardChildComponentProps, type RecordBoardColumnFilterConfig, type RecordBoardColumnType, type RecordBoardContextValue, type RecordBoardCreateBookingDayGroup, type RecordBoardCreateBookingFromSelectionPayload, type RecordBoardFieldType, type RecordBoardFloorMapProps, type RecordBoardGetOptions, type RecordBoardGridProps, type RecordBoardLayoutType, type RecordBoardLayoutVariant, type RecordBoardOptionItem, type RecordBoardProps, type RecordBoardResourceWallCardModel, type RecordBoardResourceWallLayoutPersist, type RecordBoardResourceWallProps, type RecordBoardToolBarProps, _default$20 as RecordView, type ReservationScheduleBandValue, type ReservationScheduleValue, Result, Row, SHOP_FLOOR_PLAN_DUPLICATE_CODE, SafeAreaTop, SectionFooters, Segmented, Select, SelectTime, SelectionFlowCompileError, type SelectionFlowCompileIssue, type SelectionFlowCompileIssueCode, type SelectionFlowContextValue, type SelectionFlowDraftAdapter, type SelectionFlowDraftChange, type SelectionFlowDraftUpdateMeta, type SelectionFlowMessageCode, type SelectionFlowMetadata, type SelectionFlowModuleAdapter, type SelectionFlowModuleConfig, type SelectionFlowModuleInput, type SelectionFlowModuleRegistry, type SelectionFlowRef, type SelectionFlowRuntimeIssue, type SelectionFlowSnapshot, type SelectionFlowStepConfig, type SelectionFlowValidationFeedback, type ShopFloorPlanByCodeRequestOptions, type ShopFloorPlanDetail, type ShopFloorPlanHttpAdapter, type ShopFloorPlanLayoutItem, type SingleSelectRef, Skeleton, SliderOuter as Slider, Sort, SortableList, Space, Spin, Statistic, Steps, SubmitButton, Switch$1 as Switch, Provider$3 as TabCard, type TabCardProps, type TabDataItem, type TabbarActionItem, type TabbarDataSource, _default$21 as Table, Tabs, Tag, Provider$4 as TextCard, type TimeNavigatorOrientation, type TimeNavigatorPassthroughProps, type TimeNavigatorValue, TimePicker$1 as TimePicker, type TimeRangeOption, Timeline, type ToolBarProps, Tooltip, Transfer, Translation$2 as Translation, Tree, TreeSelect, Typography, Upload$1 as Upload, type VenueWallAppearanceSlot, type VenueWallAppearanceTheme, type VenueWallStatusKey, type VenueWallStatusTone, type VenueWallStatusToneOverrides, VirtualInput, VirtualKeyboard, VirtualKeyboardTime, WalletCard, type WrapFloorMapOnSaveWithRemotePersistParams, adaptColumnsForPhoneLayout, buildCalendarHourSlotsFromRange, buildCalendarTimelineSlotStartsFromRange, buildFloorPlanPutBody, buildNameAsTitleExtensionsPatch, compileSelectionFlow, compileSelectionFlowSteps, computeSelectionZoneMemberIds, createShopFloorPlanClient, diffVenueWallStatusToneOverrides, findFloorMapRowByDataBinding, _default$22 as floorMapLayoutLocales, floorMapResourcePickerRecordSearchText, floorMapSavedConfigToRemotePatch, formatScheduleAtLabel, getBankCardTypeImg, getFigmaTableCardFromMerged, getFloorMapBindingPlaceholderReason, getFloorMapBuiltinShapeDef, getFloorMapCardPickerCategoryConfig, getFloorMapDisplayLocale, getFloorMapResourcePickerCardMeta, getHorizontalAxisSlotCount, getRangeBounds, getRenderItemByKindRoundTable, getRenderItemByKindTable, getVenueWallStatusToneMap, globalConfig, hasSelectionDraftFieldValue, inferCanvasSizeFromScene, initFloorMapLayoutLocales, isElementNameAsTitleEnabled, isFloorMapBuiltinShapeElementKind, isFloorMapImageElementKind, isFloorPlanDuplicateCodeError, isHttpNotFoundError, isSelectionModuleType, isSelectionZoneItem, isShopFloorPlanNotFoundResponse, loginAndRegister, mergeFloorMapLayoutPropsFromContext, mergeFloorPlanViewRemote, message, notification, parseLayoutFieldToViewConfigPatch, parseNestedPathSegments, pickFloorPlanDetail, pickReferenceDateContainingNow, _default$23 as pisellTimeNavigatorLocales, renderFigmaStyleRoundTableCard, renderFigmaStyleTableCard, renderFloorMapFallbackPlaceholder, resolveFlowModuleAdapter, resolveSceneElementDisplayTitle, sceneElementsToShopLayout, shopLayoutToSceneElements, useFloorMapLayoutContext, usePisellConfig, useRecordBoardContext, useRecordBoardShellBodyMeta, useSelectionFlowContext, useShopFloorPlanSubscription, useToast, useTypedSelectionFlowContext, version, viewConfigToLayoutPayload, wrapFloorMapOnSaveWithRemotePersist };
|
|
282
|
+
export { type AdaptColumnsForPhoneLayoutOptions, Affix, Alert, Anchor, AppVersionControl, AutoComplete, AutoCompleteNumber, AutoResizeText, Avatar, Badge, type BadgeConfig, Translation as BaseTranslation, type BatchActionBarPosition, type BatchActionConfirmConfig, type BatchActionItem, BatchEditor, Breadcrumb, Button, _default as ButtonGroupEdit, _default$1 as ButtonGroupPreview, Calendar, type CalendarPersistContextValue, type CalendarPersistKind, CalendarPersistProvider, Card, CardMetricItem, type PisellStatisticProps as CardMetricItemProps, _default$2 as CardPro, Carousel, type CartSkuCardA12Display, type CartSkuCardA12Presentation, type CartSkuCardA12Slots, type CartSkuCardVariant, Cascader, Checkbox, ClassicLayout, Col, Collapse, ColorPicker, type CompiledSelectionFlowModuleConfig, type CompiledSelectionFlowStep, Component, type CompoundedComponent, ConfigProvider, type CountryCode, type CreateShopFloorPlanClientOptions, CropPhoto, type CursorMode, CustomSelect, DEFAULT_CALENDAR_SLOT_STEP_MINUTES, DEFAULT_RESOURCE_WALL_FILTER_FIELD_KEY, DEFAULT_RESOURCE_WALL_LAYOUT_PERSIST, type DataSourceContainerProps, _default$3 as DataSourceForm, DataSourceImage, DataSourceMenu, DataSourceQRCode, DataSourceSubForm, type DataSourceSubFormProps, _default$4 as DataSourceTable, DataSourceTypography, DataSourceWrapper, DatePicker, type DefaultActionsConfig, Descriptions, _default$5 as Div, Divider, DragSortTree, Drawer, Dropdown, EMPTY_FLOOR_MAP_LAYOUT_CONTEXT, Empty, type EnsureShopFloorPlanByCodeOptions, FIND_FALLBACK_SCANNER_COUNT_KEY, FLOOR_MAP_BUILTIN_SHAPES, FLOOR_MAP_BUILTIN_SHAPE_ELEMENT_KIND, FLOOR_MAP_IMAGE_ELEMENT_KIND, FLOOR_MAP_SELECTION_ZONE_ELEMENT_KIND, FLOOR_MAP_STAGE_ELEMENT_KIND, Filter, type FloorMapBindingPlaceholderReason, FloorMapBuiltinShapeElement, type FloorMapCanvasNameI18n, type FloorMapDataSourceRow, type FloorMapDataSources, type FloorMapEdge, type FloorMapEdgeAnchor, type FloorMapEdgeStatus, type FloorMapElementKindCategory, type FloorMapElementKindConfig, type FloorMapFullscreenMode, FloorMapImageElement, type FloorMapItemBase, type FloorMapLayoutContextValue, FloorMapLayoutProvider, type FloorMapLayoutProviderProps, type FloorMapMergedItem, type FloorMapRenderOptions, type FloorMapResourcePickerRecord, type FloorMapResourcePickerSlotProps, type FloorMapSceneElement, FloorMapSelectionZoneElement, type FloorMapViewConfig, type FloorMapViewportOverlayRenderArgs, type FlowModuleBeforeLeaveResult, type FlowModuleBeforeLeaveReturn, type FlowModuleDataMap, type FlowModuleHandle, type FlowModuleState, type FlowModuleStateMap, type FlowModuleStatus, type FlowModuleValidationResult, type FlowModuleValidationReturn, _default$6 as Form, FormGroup, Checkbox$1 as FormItemCheckbox, ColorPicker$1 as FormItemColorPicker, DatePicker$1 as FormItemDatePicker, IconSelect as FormItemIconSelect, Input as FormItemInput, InputNumber as FormItemInputNumber, Radio as FormItemRadio, RecordListWrapperWithDataSource as FormItemRecordListWrapper, SelectWithDataSource as FormItemSelect, Switch as FormItemSwitch, FormItemTabs, TimePicker as FormItemTimePicker, Translation$1 as FormItemTranslation, Upload as FormItemUpload, Provider as GraphicTextCard, type GraphicTextCardProps, type GraphicTextCardSize, type GraphicTextCardVariant, Grid, type GridProProps, type GridViewProps, type GroupBlocks, type GroupModel, type GroupViewVariant, PREFIX_CLS as HIERARCHICAL_SUMMARY_LIST_PREFIX_CLS, _default$7 as Icon, IconSelect$1 as IconSelect, IconFont as Iconfont, Image, type ImageDataSource, type ImageFillMode, Input$1 as Input, InputNumber$1 as InputNumber, InputNumberRange, type ItemContext, type ItemLayout, JsonWrapperProvider as JsonWrapper, _default$8 as Keyboard, type LevelType, List, type LookupInputRenderContext, LowCodePage, type MailtoOptions, Mentions, Menu, Modal, Provider$1 as MultilevelCard, type MultilevelCardProps, type MultipleSelectRef, NAME_AS_TITLE_EXT_KEY, OrganizationTenantSwitcher, Page, PageHeader, Pagination, PisellAdjustPrice, PisellAdjustPriceInputNumber, PisellAlert, PisellAnchor, PisellAppCard, type PisellAppCardProps, PisellAvatar, type PisellBasicCardProps, MemoizedPisellBasicGrid as PisellBasicGrid, type PisellBasicGridProps, PisellBatchActionBar, type PisellBatchActionBarProps, PisellCard, _default$9 as PisellCardList, type PisellCardPickerCardMeta, type PisellCardPickerCategoryConfig, type PisellCardPickerCategoryLevelConfig, type PisellCardPickerCategoryMode, type PisellCardPickerCategoryPath, type PisellCardPickerItem, type PisellCardPickerMode, PisellCards, PisellCheckboxGroup, PisellConfigProvider, PisellContainer, PisellContent, PisellContext, PisellCountdown, MemoizedPisellCurrency as PisellCurrency, type PisellCurrencyProps, PisellCustomCheckboxGroup, PisellDataSourceContainer, PisellDatePicker, _default$10 as PisellDateTimeDisplay, type PisellDateTimeDisplayProps, Demo as PisellDraggable, PisellDropSort, PisellDropdown, _default$11 as PisellEmail, type PisellEmailProps, PisellEmpty, PisellFields, PisellFilter, type PisellFilterProps, PisellFind, type PisellFindProps, type PisellFindRef, PisellFloatingPanel, PisellFloorMapLayout, type PisellFloorMapLayoutProps, type PisellFloorMapLayoutRef, PisellFooter, index as PisellGoodPassCard, PisellGridPro, GridView as PisellGridView, MemoizedPisellGroupView as PisellGroupView, type PisellGroupViewProps, PisellHeader, PisellHeaderProgressBar, PisellHierarchicalSummaryList, type PisellHierarchicalSummaryListAggregateConfig, type PisellHierarchicalSummaryListAggregateMode, type PisellHierarchicalSummaryListItem, type PisellHierarchicalSummaryListKey, type PisellHierarchicalSummaryListLevelConfig, type PisellHierarchicalSummaryListProps, Provider$2 as PisellImageCard, type PisellImageCardProps, PisellImageCarousels, PisellInformationEntry, PisellInput, PisellLayout, type PisellLayoutProps, PisellLayouts, PisellList01, PisellLoading, _default$12 as PisellLongText, type PisellLongTextProps, PisellLookup, type PisellLookupProps, type PisellLookupRef, PisellMenu, type PisellMenuProps, PisellMetricCard, type PisellMetricCardProps, PisellMetrics, PisellMobileDateRangePicker, type PisellMobileDateRangePickerProps, PisellModal, PisellMultipleSelect, type PisellMultipleSelectProps, PisellNavigationMenu, MemoizedPisellNumber as PisellNumber, Number as PisellNumberKeyboard, type PisellNumberProps, MemoizedPisellPercent as PisellPercent, type PisellPercentProps, _default$13 as PisellPhone, type PisellPhoneProps, Amount as PisellPriceKeyboard, PisellProcedure, ProcedureHeader as PisellProcedureHeader, type ProcedureHeaderProps as PisellProcedureHeaderProps, type PisellProcedureProps, type PisellProcedureRef, PisellQRScanner, type PisellQRScannerProps, PisellQrcode, pisellQuickFilter as PisellQuickFilter, type PisellQuickFilterProps, _default$14 as PisellRating, type PisellRatingProps, PisellRecordBoard, PisellRecordBoardCalendarView, type PisellRecordBoardCalendarViewProps, PisellRecordBoardResourceWallView, PisellReservationSchedule, PisellReservationScheduleBand, type PisellReservationScheduleBandProps, type PisellReservationScheduleProps, PisellRow, type PisellRowProps, PisellScan, PisellScrollView, type PisellScrollViewProps, PisellSectionHeaders, _default$15 as PisellSelectionFlow, type PisellSelectionFlowController, type PisellSelectionFlowProps, PisellShellFrame, type PisellShellFrameConfig, type PisellShellFrameProps, type PisellShellFrameScrollConfig, PisellSider, _default$16 as PisellSingleLineText, type PisellSingleLineTextProps, PisellSingleSelect, type PisellSingleSelectProps, PisellSort, type PisellSortProps, PisellStatisticList, type PisellStatisticListProps, type PisellStatisticProps, type PisellStepItem, PisellSteps, type PisellStepsProps, _default$17 as PisellSuperTabs, type PisellSuperTabsProps, PisellTabbar, PisellTabbar$1 as PisellTabbar2, type PisellTabbarProps, _default$18 as PisellTabbarTemplate1, type PisellTabbarTemplate1Direction, type PisellTabbarTemplate1Props, PisellTags, type PisellTagsProps, PisellText, PisellTimeNavigator, type PisellTimeNavigatorProps, PisellTimeRangeDisplay, type PisellTimeRangeDisplayProps, PisellToast, Toolbar as PisellToolBar, PisellTooltip, PisellUpload, _default$19 as PisellUrl, type PisellUrlProps, PisellViewGrid, PisellWalletPassCard, type PisellWalletPassCardProps, Popconfirm, Popover, type PostShopFloorPlanBody, type ProcedureBodyProps, type ProcedureFooterProps, type ProcedureHeaderProps$1 as ProcedureHeaderProps, ProductCard, ProfileMenu, Progress, PublishVersionModal, type PutShopFloorPlanBody, QRCode, RECORD_BOARD_PHONE_GRID_CLASS, Radio$1 as Radio, Rate, type RecordBoardBlockedTimeMergedRange, type RecordBoardBlockedTimePanelPayload, type RecordBoardBodyView, type RecordBoardBookingMoveDraft, type RecordBoardCalendarBlockedTimePayload, type RecordBoardCalendarBookingLike, type RecordBoardCalendarBookingRenderArgs, type RecordBoardCalendarDayOverlayBooking, type RecordBoardCalendarProps, type RecordBoardCalendarResource, type RecordBoardCalendarResourceRenderArgs, type RecordBoardCalendarSelectedFreeSlot, type RecordBoardCalendarTimelineHeaderGroup, type RecordBoardCalendarTimelineHeaderRenderContext, type RecordBoardChildComponentProps, type RecordBoardColumnFilterConfig, type RecordBoardColumnType, type RecordBoardContextValue, type RecordBoardCreateBookingDayGroup, type RecordBoardCreateBookingFromSelectionPayload, type RecordBoardFieldType, type RecordBoardFloorMapProps, type RecordBoardGetOptions, type RecordBoardGridProps, type RecordBoardLayoutType, type RecordBoardLayoutVariant, type RecordBoardOptionItem, type RecordBoardProps, type RecordBoardResourceWallCardModel, type RecordBoardResourceWallLayoutPersist, type RecordBoardResourceWallProps, type RecordBoardToolBarProps, _default$20 as RecordView, type ReservationScheduleBandValue, type ReservationScheduleValue, Result, Row, SHOP_FLOOR_PLAN_DUPLICATE_CODE, SafeAreaTop, SectionFooters, Segmented, Select, SelectTime, SelectionFlowCompileError, type SelectionFlowCompileIssue, type SelectionFlowCompileIssueCode, type SelectionFlowContextValue, type SelectionFlowDraftAdapter, type SelectionFlowDraftChange, type SelectionFlowDraftUpdateMeta, type SelectionFlowMessageCode, type SelectionFlowMetadata, type SelectionFlowModuleAdapter, type SelectionFlowModuleConfig, type SelectionFlowModuleInput, type SelectionFlowModuleRegistry, type SelectionFlowRef, type SelectionFlowRuntimeIssue, type SelectionFlowSnapshot, type SelectionFlowStepConfig, type SelectionFlowValidationFeedback, type ShopFloorPlanByCodeRequestOptions, type ShopFloorPlanDetail, type ShopFloorPlanHttpAdapter, type ShopFloorPlanLayoutItem, type SingleSelectRef, Skeleton, SliderOuter as Slider, Sort, SortableList, Space, Spin, Statistic, Steps, SubmitButton, Switch$1 as Switch, Provider$3 as TabCard, type TabCardProps, type TabDataItem, type TabbarActionItem, type TabbarDataSource, _default$21 as Table, Tabs, Tag, Provider$4 as TextCard, type TimeNavigatorOrientation, type TimeNavigatorPassthroughProps, type TimeNavigatorValue, TimePicker$1 as TimePicker, type TimeRangeOption, Timeline, type ToolBarProps, Tooltip, Transfer, Translation$2 as Translation, Tree, TreeSelect, Typography, Upload$1 as Upload, type VenueWallAppearanceSlot, type VenueWallAppearanceTheme, type VenueWallStatusKey, type VenueWallStatusTone, type VenueWallStatusToneOverrides, VirtualInput, VirtualKeyboard, VirtualKeyboardTime, WalletCard, type WrapFloorMapOnSaveWithRemotePersistParams, adaptColumnsForPhoneLayout, buildCalendarHourSlotsFromRange, buildCalendarTimelineSlotStartsFromRange, buildFloorPlanPutBody, buildNameAsTitleExtensionsPatch, compileSelectionFlow, compileSelectionFlowSteps, computeSelectionZoneMemberIds, createShopFloorPlanClient, diffVenueWallStatusToneOverrides, findFloorMapRowByDataBinding, _default$22 as floorMapLayoutLocales, floorMapResourcePickerRecordSearchText, floorMapSavedConfigToRemotePatch, formatScheduleAtLabel, getBankCardTypeImg, getFigmaTableCardFromMerged, getFloorMapBindingPlaceholderReason, getFloorMapBuiltinShapeDef, getFloorMapCardPickerCategoryConfig, getFloorMapDisplayLocale, getFloorMapResourcePickerCardMeta, getHorizontalAxisSlotCount, getRangeBounds, getRenderItemByKindRoundTable, getRenderItemByKindTable, getVenueWallStatusToneMap, globalConfig, hasSelectionDraftFieldValue, inferCanvasSizeFromScene, initFloorMapLayoutLocales, isElementNameAsTitleEnabled, isFloorMapBuiltinShapeElementKind, isFloorMapImageElementKind, isFloorPlanDuplicateCodeError, isHttpNotFoundError, isSelectionModuleType, isSelectionZoneItem, isShopFloorPlanNotFoundResponse, loginAndRegister, mergeFloorMapLayoutPropsFromContext, mergeFloorPlanViewRemote, message, notification, parseLayoutFieldToViewConfigPatch, parseNestedPathSegments, pickFloorPlanDetail, pickReferenceDateContainingNow, _default$23 as pisellTimeNavigatorLocales, renderFigmaStyleRoundTableCard, renderFigmaStyleTableCard, renderFloorMapFallbackPlaceholder, resolveFlowModuleAdapter, resolveSceneElementDisplayTitle, sceneElementsToShopLayout, shopLayoutToSceneElements, useFloorMapLayoutContext, usePisellConfig, useRecordBoardContext, useRecordBoardShellBodyMeta, useSelectionFlowContext, useShopFloorPlanSubscription, useToast, useTypedSelectionFlowContext, version, viewConfigToLayoutPayload, wrapFloorMapOnSaveWithRemotePersist };
|
|
@@ -20,6 +20,7 @@ const require_index$12 = require("./components/Promotion/index.js");
|
|
|
20
20
|
const require_index$13 = require("./components/Gift/index.js");
|
|
21
21
|
const require_index$14 = require("./components/BookingItem/index.js");
|
|
22
22
|
const require_index$15 = require("./components/inlineActions/index.js");
|
|
23
|
+
const require_index$16 = require("./variants/A12/index.js");
|
|
23
24
|
let react = require("react");
|
|
24
25
|
react = require_runtime.__toESM(react);
|
|
25
26
|
let _pisell_utils = require("@pisell/utils");
|
|
@@ -59,12 +60,14 @@ const _excluded = [
|
|
|
59
60
|
"rightActionsDisplay",
|
|
60
61
|
"escapeDom",
|
|
61
62
|
"maxSpecsCount",
|
|
62
|
-
"isShowRelatedProduct"
|
|
63
|
+
"isShowRelatedProduct",
|
|
64
|
+
"a12Slots",
|
|
65
|
+
"a12Presentation"
|
|
63
66
|
];
|
|
64
67
|
const PREFIX = "pisell-cart-sku-card";
|
|
65
68
|
const CartSkuCard = (props) => {
|
|
66
69
|
var _context$appHelper$ut;
|
|
67
|
-
const { dataSource = require_status.defaultValue.dataSource, isShowImage = require_status.defaultValue.isShowImage, isShowQuantityBadge = true, isShowOriginalPrice = require_status.defaultValue.isShowOriginalPrice, isShowHolder = require_status.defaultValue.isShowHolder, isShowNote = require_status.defaultValue.isShowNote, isShowDelete = require_status.defaultValue.isShowDelete, isShowInlineDelete = isShowDelete, isShowAmountFooter = require_status.defaultValue.isShowAmountFooter, isShowPackageNote = require_status.defaultValue.isShowPackageNote, isShowEditProduct = require_status.defaultValue.isShowEditProduct, disabledClick = require_status.defaultValue.disabledClick, disabledEditClick = require_status.defaultValue.disabledEditClick, disabledNoteEdit, externalNoteEditor = false, onEditProduct, onAction, onDelete, onNote, onLike, onCard, onChangeResource, onPromotion, onGift, onChangeHolder, itemType = "product", type, rightActions = [], rightActionsDisplay = "swipe", escapeDom, maxSpecsCount = 1, isShowRelatedProduct = true } = props, other = require_objectWithoutProperties._objectWithoutProperties(props, _excluded);
|
|
70
|
+
const { dataSource = require_status.defaultValue.dataSource, isShowImage = require_status.defaultValue.isShowImage, isShowQuantityBadge = true, isShowOriginalPrice = require_status.defaultValue.isShowOriginalPrice, isShowHolder = require_status.defaultValue.isShowHolder, isShowNote = require_status.defaultValue.isShowNote, isShowDelete = require_status.defaultValue.isShowDelete, isShowInlineDelete = isShowDelete, isShowAmountFooter = require_status.defaultValue.isShowAmountFooter, isShowPackageNote = require_status.defaultValue.isShowPackageNote, isShowEditProduct = require_status.defaultValue.isShowEditProduct, disabledClick = require_status.defaultValue.disabledClick, disabledEditClick = require_status.defaultValue.disabledEditClick, disabledNoteEdit, externalNoteEditor = false, onEditProduct, onAction, onDelete, onNote, onLike, onCard, onChangeResource, onPromotion, onGift, onChangeHolder, itemType = "product", type, rightActions = [], rightActionsDisplay = "swipe", escapeDom, maxSpecsCount = 1, isShowRelatedProduct = true, a12Slots, a12Presentation } = props, other = require_objectWithoutProperties._objectWithoutProperties(props, _excluded);
|
|
68
71
|
const useOpenNoteRef = (0, react.useRef)();
|
|
69
72
|
const context = require_useEngineContext.default();
|
|
70
73
|
_pisell_utils.locales.init(require_locales.default, ((_context$appHelper$ut = context.appHelper.utils) === null || _context$appHelper$ut === void 0 || (_context$appHelper$ut = _context$appHelper$ut.storage) === null || _context$appHelper$ut === void 0 ? void 0 : _context$appHelper$ut.get("umi_locale")) || "en");
|
|
@@ -222,13 +225,28 @@ const CartSkuCard = (props) => {
|
|
|
222
225
|
openNote: openNoteEditor
|
|
223
226
|
})) : null);
|
|
224
227
|
};
|
|
228
|
+
const renderA12 = () => /* @__PURE__ */ react.default.createElement(require_index$16.default, {
|
|
229
|
+
dataSource,
|
|
230
|
+
isShowImage,
|
|
231
|
+
isShowDelete,
|
|
232
|
+
isShowOriginalPrice,
|
|
233
|
+
isShowEditProduct,
|
|
234
|
+
disabled: Boolean(disabledClick),
|
|
235
|
+
disabledEditClick,
|
|
236
|
+
slots: a12Slots,
|
|
237
|
+
presentation: a12Presentation,
|
|
238
|
+
onDelete,
|
|
239
|
+
onEditProduct
|
|
240
|
+
});
|
|
225
241
|
const renderContent = () => {
|
|
242
|
+
if (type === "a12") return renderA12();
|
|
226
243
|
if (type === "a9") return renderA9();
|
|
227
244
|
if (type === "a5") return renderA5();
|
|
228
245
|
return renderA2();
|
|
229
246
|
};
|
|
230
247
|
if (dataSource === null || dataSource === void 0 ? void 0 : dataSource.isGift) return null;
|
|
231
248
|
const content = renderContent();
|
|
249
|
+
const useIntegratedWrapper = type === "a12" || rightActionsDisplay === "inline";
|
|
232
250
|
const cardContent = /* @__PURE__ */ react.default.createElement("div", {
|
|
233
251
|
className: (0, classnames.default)(PREFIX, `${PREFIX}--${type}`),
|
|
234
252
|
onClick: (e) => {
|
|
@@ -242,7 +260,10 @@ const CartSkuCard = (props) => {
|
|
|
242
260
|
isShowRelatedProduct,
|
|
243
261
|
isShowDelete
|
|
244
262
|
}, content) : content);
|
|
245
|
-
return /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)(`${PREFIX}-wrapper-container`, {
|
|
263
|
+
return /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)(`${PREFIX}-wrapper-container`, {
|
|
264
|
+
[`${PREFIX}-wrapper-container--inline`]: useIntegratedWrapper,
|
|
265
|
+
[`${PREFIX}-wrapper-container--a12`]: type === "a12"
|
|
266
|
+
}) }, useIntegratedWrapper ? /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)(`${PREFIX}-wrapper`, `${PREFIX}-wrapper--inline`, type === "a12" && `pisell-cart-sku-card-wrapper--a12`) }, cardContent) : /* @__PURE__ */ react.default.createElement(require_index$8.SwipeAction, {
|
|
246
267
|
closeOnAction: false,
|
|
247
268
|
className: (0, classnames.default)(`${PREFIX}-wrapper`),
|
|
248
269
|
rightActions: _rightActions,
|
|
@@ -3,6 +3,10 @@
|
|
|
3
3
|
width: 100%;
|
|
4
4
|
min-width: 0;
|
|
5
5
|
}
|
|
6
|
+
|
|
7
|
+
&--a12 {
|
|
8
|
+
container-type: inline-size;
|
|
9
|
+
}
|
|
6
10
|
}
|
|
7
11
|
|
|
8
12
|
.pisell-cart-sku-card-wrapper {
|
|
@@ -15,6 +19,14 @@
|
|
|
15
19
|
width: 100%;
|
|
16
20
|
overflow: hidden;
|
|
17
21
|
}
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
&--a12 {
|
|
25
|
+
border: 0;
|
|
26
|
+
border-radius: 18px;
|
|
27
|
+
background: transparent;
|
|
28
|
+
overflow: visible;
|
|
29
|
+
}
|
|
18
30
|
}
|
|
19
31
|
|
|
20
32
|
.pisell-cart-sku-card__main-row {
|
|
@@ -52,6 +64,12 @@
|
|
|
52
64
|
cursor: pointer;
|
|
53
65
|
}
|
|
54
66
|
|
|
67
|
+
&--a12 {
|
|
68
|
+
display: block;
|
|
69
|
+
padding: 0;
|
|
70
|
+
gap: 0;
|
|
71
|
+
}
|
|
72
|
+
|
|
55
73
|
&__delete-btn {
|
|
56
74
|
cursor: pointer;
|
|
57
75
|
position: absolute;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { CSSProperties, ReactNode } from "react";
|
|
2
|
+
|
|
3
|
+
//#region src/components/productCard/cartSkuCard/types.d.ts
|
|
4
|
+
type CartSkuCardVariant = 'a2' | 'a5' | 'a9' | 'a12';
|
|
5
|
+
interface CartSkuCardA12Display {
|
|
6
|
+
eyebrow?: ReactNode;
|
|
7
|
+
quantityText?: ReactNode;
|
|
8
|
+
}
|
|
9
|
+
interface CartSkuCardSlotContext {
|
|
10
|
+
item: any;
|
|
11
|
+
disabled: boolean;
|
|
12
|
+
}
|
|
13
|
+
interface CartSkuCardA12Slots {
|
|
14
|
+
quantityControl?: (context: CartSkuCardSlotContext) => ReactNode;
|
|
15
|
+
actionRail?: (context: CartSkuCardSlotContext & {
|
|
16
|
+
defaultPrice: ReactNode;
|
|
17
|
+
defaultEdit: ReactNode;
|
|
18
|
+
defaultQuantityControl: ReactNode;
|
|
19
|
+
}) => ReactNode;
|
|
20
|
+
specifications?: (context: CartSkuCardSlotContext & {
|
|
21
|
+
defaultSpecifications: ReactNode;
|
|
22
|
+
}) => ReactNode;
|
|
23
|
+
}
|
|
24
|
+
interface CartSkuCardA12Tokens {
|
|
25
|
+
background: string;
|
|
26
|
+
borderColor: string;
|
|
27
|
+
borderRadius: string;
|
|
28
|
+
minHeight: string;
|
|
29
|
+
mediaWidth: string;
|
|
30
|
+
actionRailWidth: string;
|
|
31
|
+
contentPadding: string;
|
|
32
|
+
actionRailPadding: string;
|
|
33
|
+
accentColor: string;
|
|
34
|
+
titleColor: string;
|
|
35
|
+
titleFontSize: string;
|
|
36
|
+
titleFontWeight: number;
|
|
37
|
+
priceColor: string;
|
|
38
|
+
priceFontSize: string;
|
|
39
|
+
optionBackground: string;
|
|
40
|
+
optionLabelColor: string;
|
|
41
|
+
optionValueColor: string;
|
|
42
|
+
optionGap: string;
|
|
43
|
+
shadow: string;
|
|
44
|
+
}
|
|
45
|
+
interface CartSkuCardA12Presentation {
|
|
46
|
+
density?: 'compact' | 'comfortable';
|
|
47
|
+
optionColumns?: 1 | 2 | 3;
|
|
48
|
+
mediaFit?: 'cover' | 'contain';
|
|
49
|
+
contentAlign?: 'start' | 'center';
|
|
50
|
+
className?: string;
|
|
51
|
+
style?: CSSProperties;
|
|
52
|
+
tokens?: Partial<CartSkuCardA12Tokens>;
|
|
53
|
+
}
|
|
54
|
+
//#endregion
|
|
55
|
+
export { CartSkuCardA12Display, CartSkuCardA12Presentation, CartSkuCardA12Slots, CartSkuCardVariant };
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
const require_runtime = require("../../../../../_virtual/_rolldown/runtime.js");
|
|
2
|
+
const require_objectSpread2 = require("../../../../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
|
|
3
|
+
const require_index = require("../../../../iconfont/index.js");
|
|
4
|
+
const require_index$1 = require("../../components/weighing/index.js");
|
|
5
|
+
const require_index$2 = require("../../index.js");
|
|
6
|
+
let react = require("react");
|
|
7
|
+
react = require_runtime.__toESM(react);
|
|
8
|
+
let _pisell_utils = require("@pisell/utils");
|
|
9
|
+
let classnames = require("classnames");
|
|
10
|
+
classnames = require_runtime.__toESM(classnames);
|
|
11
|
+
require("./index.less");
|
|
12
|
+
//#region src/components/productCard/cartSkuCard/variants/A12/index.tsx
|
|
13
|
+
const TOKEN_VARIABLES = {
|
|
14
|
+
background: "--pc-a12-bg",
|
|
15
|
+
borderColor: "--pc-a12-border-color",
|
|
16
|
+
borderRadius: "--pc-a12-radius",
|
|
17
|
+
minHeight: "--pc-a12-min-height",
|
|
18
|
+
mediaWidth: "--pc-a12-media-width",
|
|
19
|
+
actionRailWidth: "--pc-a12-rail-width",
|
|
20
|
+
contentPadding: "--pc-a12-content-padding",
|
|
21
|
+
actionRailPadding: "--pc-a12-rail-padding",
|
|
22
|
+
accentColor: "--pc-a12-accent",
|
|
23
|
+
titleColor: "--pc-a12-title-color",
|
|
24
|
+
titleFontSize: "--pc-a12-title-size",
|
|
25
|
+
titleFontWeight: "--pc-a12-title-weight",
|
|
26
|
+
priceColor: "--pc-a12-price-color",
|
|
27
|
+
priceFontSize: "--pc-a12-price-size",
|
|
28
|
+
optionBackground: "--pc-a12-option-bg",
|
|
29
|
+
optionLabelColor: "--pc-a12-option-label-color",
|
|
30
|
+
optionValueColor: "--pc-a12-option-value-color",
|
|
31
|
+
optionGap: "--pc-a12-option-gap",
|
|
32
|
+
shadow: "--pc-a12-shadow"
|
|
33
|
+
};
|
|
34
|
+
/** 复用其它变体使用的 options,只在展示阶段合并同组已选项。 */
|
|
35
|
+
function resolveSpecifications(dataSource) {
|
|
36
|
+
if (!Array.isArray(dataSource === null || dataSource === void 0 ? void 0 : dataSource.options)) return [];
|
|
37
|
+
const groups = /* @__PURE__ */ new Map();
|
|
38
|
+
dataSource.options.forEach((option, index) => {
|
|
39
|
+
var _ref, _option$name, _ref2, _option$quantity, _ref3, _ref4, _option$option_group_, _ref5, _ref6, _ref7, _option$option_group_2;
|
|
40
|
+
const name = (_ref = (_option$name = option === null || option === void 0 ? void 0 : option.name) !== null && _option$name !== void 0 ? _option$name : option === null || option === void 0 ? void 0 : option.title) !== null && _ref !== void 0 ? _ref : option === null || option === void 0 ? void 0 : option.variant_item_name;
|
|
41
|
+
if (name === void 0 || name === null || name === "") return;
|
|
42
|
+
const quantity = Math.max(1, Number((_ref2 = (_option$quantity = option.quantity) !== null && _option$quantity !== void 0 ? _option$quantity : option.num) !== null && _ref2 !== void 0 ? _ref2 : 1));
|
|
43
|
+
const value = quantity > 1 ? `${String(name)} × ${quantity}` : name;
|
|
44
|
+
const groupKey = String((_ref3 = (_ref4 = (_option$option_group_ = option.option_group_id) !== null && _option$option_group_ !== void 0 ? _option$option_group_ : option.group_id) !== null && _ref4 !== void 0 ? _ref4 : option.variant_group_id) !== null && _ref3 !== void 0 ? _ref3 : `option-${index}`);
|
|
45
|
+
const label = (_ref5 = (_ref6 = (_ref7 = (_option$option_group_2 = option.option_group_name) !== null && _option$option_group_2 !== void 0 ? _option$option_group_2 : option.group_name) !== null && _ref7 !== void 0 ? _ref7 : option.option_group_title) !== null && _ref6 !== void 0 ? _ref6 : option.group_title) !== null && _ref5 !== void 0 ? _ref5 : option.variant_group_name;
|
|
46
|
+
const current = groups.get(groupKey);
|
|
47
|
+
if (current) {
|
|
48
|
+
current.values.push(value);
|
|
49
|
+
if (!current.label && label) current.label = label;
|
|
50
|
+
return;
|
|
51
|
+
}
|
|
52
|
+
groups.set(groupKey, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({ key: groupKey }, label ? { label } : {}), {}, { values: [value] }));
|
|
53
|
+
});
|
|
54
|
+
return Array.from(groups.values()).map((group) => ({
|
|
55
|
+
key: group.key,
|
|
56
|
+
label: group.label,
|
|
57
|
+
value: group.values.map(String).join(", ")
|
|
58
|
+
}));
|
|
59
|
+
}
|
|
60
|
+
function getPresentationStyle(presentation) {
|
|
61
|
+
const style = require_objectSpread2._objectSpread2({}, (presentation === null || presentation === void 0 ? void 0 : presentation.style) || {});
|
|
62
|
+
Object.entries((presentation === null || presentation === void 0 ? void 0 : presentation.tokens) || {}).forEach(([key, value]) => {
|
|
63
|
+
if (value !== void 0) style[TOKEN_VARIABLES[key]] = value;
|
|
64
|
+
});
|
|
65
|
+
style["--pc-a12-option-columns"] = (presentation === null || presentation === void 0 ? void 0 : presentation.optionColumns) || 2;
|
|
66
|
+
return style;
|
|
67
|
+
}
|
|
68
|
+
const A12 = ({ dataSource, isShowImage = true, isShowDelete = false, isShowOriginalPrice = false, isShowEditProduct = false, disabled = false, disabledEditClick = false, slots, presentation, onDelete, onEditProduct }) => {
|
|
69
|
+
var _ref8, _dataSource$num, _dataSource$total, _dataSource$origin_to;
|
|
70
|
+
const display = (dataSource === null || dataSource === void 0 ? void 0 : dataSource.a12) || {};
|
|
71
|
+
const specificationsData = (0, react.useMemo)(() => resolveSpecifications(dataSource), [dataSource]);
|
|
72
|
+
const weighingInfo = (0, react.useMemo)(() => (0, _pisell_utils.resolveWeighingSnapshot)(dataSource), [dataSource]);
|
|
73
|
+
const quantity = Number((_ref8 = (_dataSource$num = dataSource === null || dataSource === void 0 ? void 0 : dataSource.num) !== null && _dataSource$num !== void 0 ? _dataSource$num : dataSource === null || dataSource === void 0 ? void 0 : dataSource.quantity) !== null && _ref8 !== void 0 ? _ref8 : 1) || 1;
|
|
74
|
+
const lineTotal = Number((_dataSource$total = dataSource === null || dataSource === void 0 ? void 0 : dataSource.total) !== null && _dataSource$total !== void 0 ? _dataSource$total : 0) * quantity - Number((dataSource === null || dataSource === void 0 ? void 0 : dataSource.totalDifference) || 0);
|
|
75
|
+
const originalTotal = Number((_dataSource$origin_to = dataSource === null || dataSource === void 0 ? void 0 : dataSource.origin_total) !== null && _dataSource$origin_to !== void 0 ? _dataSource$origin_to : 0) * quantity;
|
|
76
|
+
const symbol = dataSource === null || dataSource === void 0 ? void 0 : dataSource.symbol;
|
|
77
|
+
const slotContext = (0, react.useMemo)(() => ({
|
|
78
|
+
item: dataSource,
|
|
79
|
+
disabled
|
|
80
|
+
}), [dataSource, disabled]);
|
|
81
|
+
const style = (0, react.useMemo)(() => getPresentationStyle(presentation), [presentation]);
|
|
82
|
+
const defaultSpecifications = specificationsData.length ? /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__specifications` }, specificationsData.map((specification) => /* @__PURE__ */ react.default.createElement("div", {
|
|
83
|
+
className: `${require_index$2.PREFIX}-a12__specification`,
|
|
84
|
+
key: specification.key
|
|
85
|
+
}, specification.label ? /* @__PURE__ */ react.default.createElement("span", { className: `${require_index$2.PREFIX}-a12__specification-label` }, specification.label) : null, /* @__PURE__ */ react.default.createElement("strong", { className: `${require_index$2.PREFIX}-a12__specification-value` }, specification.value)))) : (dataSource === null || dataSource === void 0 ? void 0 : dataSource.product_option_string) ? /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__specification-summary` }, dataSource.product_option_string) : null;
|
|
86
|
+
const specifications = (slots === null || slots === void 0 ? void 0 : slots.specifications) ? slots.specifications(require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, slotContext), {}, { defaultSpecifications })) : defaultSpecifications;
|
|
87
|
+
const defaultPrice = /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__price` }, /* @__PURE__ */ react.default.createElement("strong", null, (0, _pisell_utils.formatAmount)(lineTotal, 2, symbol)), isShowOriginalPrice && originalTotal > 0 && originalTotal !== lineTotal ? /* @__PURE__ */ react.default.createElement("del", null, (0, _pisell_utils.formatAmount)(originalTotal, 2, symbol)) : null);
|
|
88
|
+
const defaultEdit = Boolean(isShowEditProduct && onEditProduct) ? /* @__PURE__ */ react.default.createElement("button", {
|
|
89
|
+
type: "button",
|
|
90
|
+
className: `${require_index$2.PREFIX}-a12__edit`,
|
|
91
|
+
disabled: disabled || disabledEditClick,
|
|
92
|
+
onClick: (event) => {
|
|
93
|
+
event.preventDefault();
|
|
94
|
+
event.stopPropagation();
|
|
95
|
+
onEditProduct === null || onEditProduct === void 0 || onEditProduct(dataSource);
|
|
96
|
+
}
|
|
97
|
+
}, _pisell_utils.locales.getText("pisell2.product.card.edit")) : null;
|
|
98
|
+
const defaultQuantityControl = (slots === null || slots === void 0 ? void 0 : slots.quantityControl) ? slots.quantityControl(slotContext) : /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__quantity-fallback` }, isShowDelete && onDelete ? /* @__PURE__ */ react.default.createElement("button", {
|
|
99
|
+
type: "button",
|
|
100
|
+
"aria-label": "Delete item",
|
|
101
|
+
disabled,
|
|
102
|
+
onClick: (event) => {
|
|
103
|
+
event.preventDefault();
|
|
104
|
+
event.stopPropagation();
|
|
105
|
+
onDelete(dataSource);
|
|
106
|
+
}
|
|
107
|
+
}, /* @__PURE__ */ react.default.createElement(require_index.default, { type: "pisell2-trash-01" })) : null, /* @__PURE__ */ react.default.createElement("span", null, display.quantityText || `× ${quantity}`));
|
|
108
|
+
const defaultActionRail = /* @__PURE__ */ react.default.createElement("aside", { className: `${require_index$2.PREFIX}-a12__rail` }, defaultPrice, defaultEdit, /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__quantity-control` }, defaultQuantityControl));
|
|
109
|
+
const actionRail = (slots === null || slots === void 0 ? void 0 : slots.actionRail) ? slots.actionRail(require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, slotContext), {}, {
|
|
110
|
+
defaultPrice,
|
|
111
|
+
defaultEdit,
|
|
112
|
+
defaultQuantityControl
|
|
113
|
+
})) : defaultActionRail;
|
|
114
|
+
return /* @__PURE__ */ react.default.createElement("div", {
|
|
115
|
+
className: (0, classnames.default)(`${require_index$2.PREFIX}-a12`, `${require_index$2.PREFIX}-a12--${(presentation === null || presentation === void 0 ? void 0 : presentation.density) || "comfortable"}`, `${require_index$2.PREFIX}-a12--align-${(presentation === null || presentation === void 0 ? void 0 : presentation.contentAlign) || "start"}`, !isShowImage && `pisell-cart-sku-card-a12--without-media`, presentation === null || presentation === void 0 ? void 0 : presentation.className),
|
|
116
|
+
style
|
|
117
|
+
}, isShowImage ? /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__media` }, (dataSource === null || dataSource === void 0 ? void 0 : dataSource.image) ? /* @__PURE__ */ react.default.createElement("img", {
|
|
118
|
+
alt: "",
|
|
119
|
+
src: _pisell_utils.image.ali(dataSource.image, 320),
|
|
120
|
+
style: { objectFit: (presentation === null || presentation === void 0 ? void 0 : presentation.mediaFit) || "cover" }
|
|
121
|
+
}) : /* @__PURE__ */ react.default.createElement("span", { "aria-hidden": "true" }, String((dataSource === null || dataSource === void 0 ? void 0 : dataSource.name) || "").slice(0, 2))) : null, /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__content` }, display.eyebrow ? /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__eyebrow` }, display.eyebrow) : null, /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__name` }, dataSource === null || dataSource === void 0 ? void 0 : dataSource.name), weighingInfo ? /* @__PURE__ */ react.default.createElement("div", { className: `${require_index$2.PREFIX}-a12__weighing` }, /* @__PURE__ */ react.default.createElement(require_index$1.default, {
|
|
122
|
+
dataSource: weighingInfo,
|
|
123
|
+
symbol
|
|
124
|
+
})) : null, specifications), actionRail);
|
|
125
|
+
};
|
|
126
|
+
//#endregion
|
|
127
|
+
exports.default = A12;
|
|
@@ -0,0 +1,245 @@
|
|
|
1
|
+
.pisell-cart-sku-card-a12 {
|
|
2
|
+
--pc-a12-bg: #fff;
|
|
3
|
+
--pc-a12-border-color: #e4e7ec;
|
|
4
|
+
--pc-a12-radius: 18px;
|
|
5
|
+
--pc-a12-min-height: 164px;
|
|
6
|
+
--pc-a12-media-width: 228px;
|
|
7
|
+
--pc-a12-rail-width: 174px;
|
|
8
|
+
--pc-a12-content-padding: 20px 22px;
|
|
9
|
+
--pc-a12-rail-padding: 18px 20px;
|
|
10
|
+
--pc-a12-accent: #b20d12;
|
|
11
|
+
--pc-a12-title-color: #101828;
|
|
12
|
+
--pc-a12-title-size: 32px;
|
|
13
|
+
--pc-a12-title-weight: 800;
|
|
14
|
+
--pc-a12-price-color: var(--pc-a12-accent);
|
|
15
|
+
--pc-a12-price-size: 30px;
|
|
16
|
+
--pc-a12-option-bg: #f5f6f8;
|
|
17
|
+
--pc-a12-option-label-color: #667085;
|
|
18
|
+
--pc-a12-option-value-color: #101828;
|
|
19
|
+
--pc-a12-option-gap: 6px;
|
|
20
|
+
--pc-a12-shadow: 0 12px 28px rgba(16, 24, 40, 0.08);
|
|
21
|
+
|
|
22
|
+
display: grid;
|
|
23
|
+
grid-template-columns:
|
|
24
|
+
var(--pc-a12-media-width)
|
|
25
|
+
minmax(0, 1fr)
|
|
26
|
+
var(--pc-a12-rail-width);
|
|
27
|
+
min-height: var(--pc-a12-min-height);
|
|
28
|
+
overflow: hidden;
|
|
29
|
+
border: 1px solid var(--pc-a12-border-color);
|
|
30
|
+
border-radius: var(--pc-a12-radius);
|
|
31
|
+
background: var(--pc-a12-bg);
|
|
32
|
+
box-shadow: var(--pc-a12-shadow);
|
|
33
|
+
hyphens: none;
|
|
34
|
+
overflow-wrap: normal;
|
|
35
|
+
word-break: normal;
|
|
36
|
+
|
|
37
|
+
&--without-media {
|
|
38
|
+
grid-template-columns: minmax(0, 1fr) var(--pc-a12-rail-width);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
&__media {
|
|
42
|
+
position: relative;
|
|
43
|
+
display: grid;
|
|
44
|
+
min-height: var(--pc-a12-min-height);
|
|
45
|
+
place-items: center;
|
|
46
|
+
overflow: hidden;
|
|
47
|
+
background: #f2f4f7;
|
|
48
|
+
color: var(--pc-a12-accent);
|
|
49
|
+
font-size: 32px;
|
|
50
|
+
font-weight: 800;
|
|
51
|
+
|
|
52
|
+
img {
|
|
53
|
+
position: absolute;
|
|
54
|
+
inset: 0;
|
|
55
|
+
display: block;
|
|
56
|
+
width: 100%;
|
|
57
|
+
height: 100%;
|
|
58
|
+
min-height: 0;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
&__content {
|
|
63
|
+
display: flex;
|
|
64
|
+
min-width: 0;
|
|
65
|
+
flex-direction: column;
|
|
66
|
+
justify-content: flex-start;
|
|
67
|
+
padding: var(--pc-a12-content-padding);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
&--align-center &__content {
|
|
71
|
+
justify-content: center;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
&__eyebrow {
|
|
75
|
+
overflow: hidden;
|
|
76
|
+
margin-bottom: 4px;
|
|
77
|
+
color: var(--pc-a12-accent);
|
|
78
|
+
font-size: 14px;
|
|
79
|
+
font-weight: 800;
|
|
80
|
+
line-height: 20px;
|
|
81
|
+
text-overflow: ellipsis;
|
|
82
|
+
text-transform: uppercase;
|
|
83
|
+
white-space: nowrap;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
&__name {
|
|
87
|
+
min-width: 0;
|
|
88
|
+
overflow: hidden;
|
|
89
|
+
color: var(--pc-a12-title-color);
|
|
90
|
+
font-size: var(--pc-a12-title-size);
|
|
91
|
+
font-weight: var(--pc-a12-title-weight);
|
|
92
|
+
line-height: 1.15;
|
|
93
|
+
text-overflow: ellipsis;
|
|
94
|
+
white-space: nowrap;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
&__weighing {
|
|
98
|
+
min-width: 0;
|
|
99
|
+
margin-top: 8px;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
&__specifications {
|
|
103
|
+
display: grid;
|
|
104
|
+
grid-template-columns: repeat(
|
|
105
|
+
var(--pc-a12-option-columns, 2),
|
|
106
|
+
minmax(0, 1fr)
|
|
107
|
+
);
|
|
108
|
+
gap: var(--pc-a12-option-gap);
|
|
109
|
+
margin-top: 10px;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
&__specification,
|
|
113
|
+
&__specification-summary {
|
|
114
|
+
min-width: 0;
|
|
115
|
+
padding: 7px 9px;
|
|
116
|
+
border-radius: 7px;
|
|
117
|
+
background: var(--pc-a12-option-bg);
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
&__specification {
|
|
121
|
+
display: flex;
|
|
122
|
+
flex-direction: column;
|
|
123
|
+
gap: 2px;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
&__specification-label {
|
|
127
|
+
overflow: hidden;
|
|
128
|
+
color: var(--pc-a12-option-label-color);
|
|
129
|
+
font-size: 11px;
|
|
130
|
+
font-weight: 700;
|
|
131
|
+
line-height: 16px;
|
|
132
|
+
text-overflow: ellipsis;
|
|
133
|
+
white-space: nowrap;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
&__specification-value,
|
|
137
|
+
&__specification-summary {
|
|
138
|
+
overflow: hidden;
|
|
139
|
+
color: var(--pc-a12-option-value-color);
|
|
140
|
+
font-size: 16px;
|
|
141
|
+
font-weight: 700;
|
|
142
|
+
line-height: 20px;
|
|
143
|
+
text-overflow: ellipsis;
|
|
144
|
+
white-space: nowrap;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
&__rail {
|
|
148
|
+
display: flex;
|
|
149
|
+
min-width: 0;
|
|
150
|
+
flex-direction: column;
|
|
151
|
+
align-items: center;
|
|
152
|
+
justify-content: center;
|
|
153
|
+
padding: var(--pc-a12-rail-padding);
|
|
154
|
+
border-left: 1px solid var(--pc-a12-border-color);
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
&__price {
|
|
158
|
+
display: flex;
|
|
159
|
+
flex-direction: column;
|
|
160
|
+
align-items: center;
|
|
161
|
+
color: var(--pc-a12-price-color);
|
|
162
|
+
|
|
163
|
+
strong {
|
|
164
|
+
font-size: var(--pc-a12-price-size);
|
|
165
|
+
font-weight: 800;
|
|
166
|
+
line-height: 1.15;
|
|
167
|
+
white-space: nowrap;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
del {
|
|
171
|
+
color: #667085;
|
|
172
|
+
font-size: 13px;
|
|
173
|
+
}
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
&__edit {
|
|
177
|
+
min-width: 62px;
|
|
178
|
+
min-height: 38px;
|
|
179
|
+
margin-top: 10px;
|
|
180
|
+
padding: 7px 14px;
|
|
181
|
+
border: 1px solid #f5b7ba;
|
|
182
|
+
border-radius: 999px;
|
|
183
|
+
background: #fff;
|
|
184
|
+
color: var(--pc-a12-accent);
|
|
185
|
+
font: inherit;
|
|
186
|
+
font-size: 14px;
|
|
187
|
+
font-weight: 700;
|
|
188
|
+
white-space: nowrap;
|
|
189
|
+
cursor: pointer;
|
|
190
|
+
|
|
191
|
+
&:disabled {
|
|
192
|
+
cursor: not-allowed;
|
|
193
|
+
opacity: 0.5;
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
&__quantity-control {
|
|
198
|
+
display: flex;
|
|
199
|
+
width: 100%;
|
|
200
|
+
min-height: 44px;
|
|
201
|
+
align-items: center;
|
|
202
|
+
justify-content: center;
|
|
203
|
+
margin-top: 10px;
|
|
204
|
+
padding-top: 10px;
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
&__quantity-fallback {
|
|
208
|
+
display: flex;
|
|
209
|
+
align-items: center;
|
|
210
|
+
justify-content: center;
|
|
211
|
+
gap: 16px;
|
|
212
|
+
font-weight: 700;
|
|
213
|
+
|
|
214
|
+
button {
|
|
215
|
+
display: grid;
|
|
216
|
+
width: 40px;
|
|
217
|
+
height: 40px;
|
|
218
|
+
place-items: center;
|
|
219
|
+
border: 1px solid #f5b7ba;
|
|
220
|
+
border-radius: 50%;
|
|
221
|
+
background: #fff;
|
|
222
|
+
color: var(--pc-a12-accent);
|
|
223
|
+
cursor: pointer;
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
&--compact {
|
|
228
|
+
--pc-a12-min-height: 132px;
|
|
229
|
+
--pc-a12-media-width: 124px;
|
|
230
|
+
--pc-a12-rail-width: 156px;
|
|
231
|
+
--pc-a12-content-padding: 15px 18px;
|
|
232
|
+
--pc-a12-rail-padding: 14px 16px;
|
|
233
|
+
--pc-a12-price-size: 25px;
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
@container (max-width: 620px) {
|
|
238
|
+
.pisell-cart-sku-card-a12 {
|
|
239
|
+
--pc-a12-media-width: 112px;
|
|
240
|
+
--pc-a12-rail-width: 150px;
|
|
241
|
+
--pc-a12-content-padding: 14px;
|
|
242
|
+
--pc-a12-price-size: 24px;
|
|
243
|
+
--pc-a12-option-columns: 1;
|
|
244
|
+
}
|
|
245
|
+
}
|