@bikdotai/bik-component-library 0.0.725-beta.1 → 0.0.725-beta.10
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/dist/cjs/assets/icons/searchIcon.svg.js +1 -0
- package/dist/cjs/assets/icons/whatsNew.svg.js +1 -0
- package/dist/cjs/components/dropdown/DropdownPopover/index.d.ts +0 -1
- package/dist/cjs/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.d.ts +4 -0
- package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.js +1 -0
- package/dist/cjs/components/feature-announcements/MajorUpdatePopup.d.ts +4 -0
- package/dist/cjs/components/feature-announcements/MajorUpdatePopup.js +1 -0
- package/dist/cjs/components/feature-announcements/MinorUpdatePopup.d.ts +4 -0
- package/dist/cjs/components/feature-announcements/MinorUpdatePopup.js +1 -0
- package/dist/cjs/components/feature-announcements/VideoModal.d.ts +3 -0
- package/dist/cjs/components/feature-announcements/VideoModal.js +1 -0
- package/dist/cjs/components/feature-announcements/constants/animations.d.ts +27 -0
- package/dist/cjs/components/feature-announcements/constants/animations.js +1 -0
- package/dist/cjs/components/feature-announcements/constants/dimensions.d.ts +56 -0
- package/dist/cjs/components/feature-announcements/constants/dimensions.js +1 -0
- package/dist/cjs/components/feature-announcements/constants/index.d.ts +19 -0
- package/dist/cjs/components/feature-announcements/constants/index.js +1 -0
- package/dist/cjs/components/feature-announcements/constants/localStorageKeys.d.ts +18 -0
- package/dist/cjs/components/feature-announcements/constants/localStorageKeys.js +1 -0
- package/dist/cjs/components/feature-announcements/constants/selectors.d.ts +21 -0
- package/dist/cjs/components/feature-announcements/constants/selectors.js +1 -0
- package/dist/cjs/components/feature-announcements/constants/zIndex.d.ts +10 -0
- package/dist/cjs/components/feature-announcements/constants/zIndex.js +1 -0
- package/dist/cjs/components/feature-announcements/hooks/index.d.ts +1 -0
- package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts +13 -0
- package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.js +1 -0
- package/dist/cjs/components/feature-announcements/index.d.ts +7 -0
- package/dist/cjs/components/feature-announcements/styles/index.d.ts +4 -0
- package/dist/cjs/components/feature-announcements/styles/joyride.styles.d.ts +125 -0
- package/dist/cjs/components/feature-announcements/styles/majorPopup.styles.d.ts +23 -0
- package/dist/cjs/components/feature-announcements/styles/majorPopup.styles.js +1 -0
- package/dist/cjs/components/feature-announcements/styles/minorPopup.styles.d.ts +16 -0
- package/dist/cjs/components/feature-announcements/styles/minorPopup.styles.js +1 -0
- package/dist/cjs/components/feature-announcements/styles/videoModal.styles.d.ts +13 -0
- package/dist/cjs/components/feature-announcements/styles/videoModal.styles.js +1 -0
- package/dist/cjs/components/feature-announcements/types/feature.types.d.ts +41 -0
- package/dist/cjs/components/feature-announcements/types/index.d.ts +4 -0
- package/dist/cjs/components/feature-announcements/types/props.types.d.ts +43 -0
- package/dist/cjs/components/feature-announcements/types/repository.types.d.ts +11 -0
- package/dist/cjs/components/feature-announcements/types/router.types.d.ts +7 -0
- package/dist/cjs/components/feature-announcements/useFeatureAnnouncements.d.ts +13 -0
- package/dist/cjs/components/feature-announcements/utils/animationHelpers.d.ts +18 -0
- package/dist/cjs/components/feature-announcements/utils/animationHelpers.js +1 -0
- package/dist/cjs/components/feature-announcements/utils/elementHelpers.d.ts +30 -0
- package/dist/cjs/components/feature-announcements/utils/elementHelpers.js +1 -0
- package/dist/cjs/components/feature-announcements/utils/htmlHelpers.d.ts +18 -0
- package/dist/cjs/components/feature-announcements/utils/htmlHelpers.js +1 -0
- package/dist/cjs/components/feature-announcements/utils/index.d.ts +3 -0
- package/dist/cjs/components/product-picker-v2/collectionScreen.d.ts +2 -0
- package/dist/cjs/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/modal.js +1 -1
- package/dist/cjs/components/product-picker-v2/searchScreen.d.ts +2 -0
- package/dist/cjs/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/cjs/components/whats-new/WhatsNew.d.ts +23 -0
- package/dist/cjs/components/whats-new/WhatsNew.js +1 -0
- package/dist/cjs/components/whats-new/WhatsNew.styles.d.ts +11 -0
- package/dist/cjs/components/whats-new/WhatsNew.styles.js +185 -0
- package/dist/cjs/components/whats-new/WhatsNew.types.d.ts +58 -0
- package/dist/cjs/components/whats-new/WhatsNewButton.d.ts +3 -0
- package/dist/cjs/components/whats-new/WhatsNewButton.js +1 -0
- package/dist/cjs/components/whats-new/WhatsNewPanel.d.ts +3 -0
- package/dist/cjs/components/whats-new/WhatsNewPanel.js +1 -0
- package/dist/cjs/components/whats-new/WhatsNewProvider.d.ts +4 -0
- package/dist/cjs/components/whats-new/WhatsNewProvider.js +1 -0
- package/dist/cjs/components/whats-new/index.d.ts +7 -0
- package/dist/cjs/components/whats-new/useWhatsNew.d.ts +9 -0
- package/dist/cjs/components/whats-new/useWhatsNew.js +1 -0
- package/dist/cjs/index.d.ts +2 -0
- package/dist/cjs/index.js +1 -1
- package/dist/esm/assets/icons/searchIcon.svg.js +1 -0
- package/dist/esm/assets/icons/whatsNew.svg.js +1 -0
- package/dist/esm/components/dropdown/DropdownPopover/index.d.ts +0 -1
- package/dist/esm/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.d.ts +4 -0
- package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.js +1 -0
- package/dist/esm/components/feature-announcements/MajorUpdatePopup.d.ts +4 -0
- package/dist/esm/components/feature-announcements/MajorUpdatePopup.js +1 -0
- package/dist/esm/components/feature-announcements/MinorUpdatePopup.d.ts +4 -0
- package/dist/esm/components/feature-announcements/MinorUpdatePopup.js +1 -0
- package/dist/esm/components/feature-announcements/VideoModal.d.ts +3 -0
- package/dist/esm/components/feature-announcements/VideoModal.js +1 -0
- package/dist/esm/components/feature-announcements/constants/animations.d.ts +27 -0
- package/dist/esm/components/feature-announcements/constants/animations.js +1 -0
- package/dist/esm/components/feature-announcements/constants/dimensions.d.ts +56 -0
- package/dist/esm/components/feature-announcements/constants/dimensions.js +1 -0
- package/dist/esm/components/feature-announcements/constants/index.d.ts +19 -0
- package/dist/esm/components/feature-announcements/constants/index.js +1 -0
- package/dist/esm/components/feature-announcements/constants/localStorageKeys.d.ts +18 -0
- package/dist/esm/components/feature-announcements/constants/localStorageKeys.js +1 -0
- package/dist/esm/components/feature-announcements/constants/selectors.d.ts +21 -0
- package/dist/esm/components/feature-announcements/constants/selectors.js +1 -0
- package/dist/esm/components/feature-announcements/constants/zIndex.d.ts +10 -0
- package/dist/esm/components/feature-announcements/constants/zIndex.js +1 -0
- package/dist/esm/components/feature-announcements/hooks/index.d.ts +1 -0
- package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts +13 -0
- package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.js +1 -0
- package/dist/esm/components/feature-announcements/index.d.ts +7 -0
- package/dist/esm/components/feature-announcements/styles/index.d.ts +4 -0
- package/dist/esm/components/feature-announcements/styles/joyride.styles.d.ts +125 -0
- package/dist/esm/components/feature-announcements/styles/majorPopup.styles.d.ts +23 -0
- package/dist/esm/components/feature-announcements/styles/majorPopup.styles.js +1 -0
- package/dist/esm/components/feature-announcements/styles/minorPopup.styles.d.ts +16 -0
- package/dist/esm/components/feature-announcements/styles/minorPopup.styles.js +1 -0
- package/dist/esm/components/feature-announcements/styles/videoModal.styles.d.ts +13 -0
- package/dist/esm/components/feature-announcements/styles/videoModal.styles.js +1 -0
- package/dist/esm/components/feature-announcements/types/feature.types.d.ts +41 -0
- package/dist/esm/components/feature-announcements/types/index.d.ts +4 -0
- package/dist/esm/components/feature-announcements/types/props.types.d.ts +43 -0
- package/dist/esm/components/feature-announcements/types/repository.types.d.ts +11 -0
- package/dist/esm/components/feature-announcements/types/router.types.d.ts +7 -0
- package/dist/esm/components/feature-announcements/useFeatureAnnouncements.d.ts +13 -0
- package/dist/esm/components/feature-announcements/utils/animationHelpers.d.ts +18 -0
- package/dist/esm/components/feature-announcements/utils/animationHelpers.js +1 -0
- package/dist/esm/components/feature-announcements/utils/elementHelpers.d.ts +30 -0
- package/dist/esm/components/feature-announcements/utils/elementHelpers.js +1 -0
- package/dist/esm/components/feature-announcements/utils/htmlHelpers.d.ts +18 -0
- package/dist/esm/components/feature-announcements/utils/htmlHelpers.js +1 -0
- package/dist/esm/components/feature-announcements/utils/index.d.ts +3 -0
- package/dist/esm/components/product-picker-v2/collectionScreen.d.ts +2 -0
- package/dist/esm/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/modal.js +1 -1
- package/dist/esm/components/product-picker-v2/searchScreen.d.ts +2 -0
- package/dist/esm/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/esm/components/whats-new/WhatsNew.d.ts +23 -0
- package/dist/esm/components/whats-new/WhatsNew.js +1 -0
- package/dist/esm/components/whats-new/WhatsNew.styles.d.ts +11 -0
- package/dist/esm/components/whats-new/WhatsNew.styles.js +185 -0
- package/dist/esm/components/whats-new/WhatsNew.types.d.ts +58 -0
- package/dist/esm/components/whats-new/WhatsNewButton.d.ts +3 -0
- package/dist/esm/components/whats-new/WhatsNewButton.js +1 -0
- package/dist/esm/components/whats-new/WhatsNewPanel.d.ts +3 -0
- package/dist/esm/components/whats-new/WhatsNewPanel.js +1 -0
- package/dist/esm/components/whats-new/WhatsNewProvider.d.ts +4 -0
- package/dist/esm/components/whats-new/WhatsNewProvider.js +1 -0
- package/dist/esm/components/whats-new/index.d.ts +7 -0
- package/dist/esm/components/whats-new/useWhatsNew.d.ts +9 -0
- package/dist/esm/components/whats-new/useWhatsNew.js +1 -0
- package/dist/esm/index.d.ts +2 -0
- package/dist/esm/index.js +1 -1
- package/package.json +2 -1
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { FeatureAnnouncement } from './feature.types';
|
|
3
|
+
import { FeatureAnnouncementRepository } from './repository.types';
|
|
4
|
+
import { RouterProps } from './router.types';
|
|
5
|
+
/**
|
|
6
|
+
* Base popup component props
|
|
7
|
+
*/
|
|
8
|
+
export interface PopupBaseProps {
|
|
9
|
+
feature: FeatureAnnouncement;
|
|
10
|
+
currentIndex: number;
|
|
11
|
+
totalFeatures: number;
|
|
12
|
+
onSkip: () => void;
|
|
13
|
+
onExplore: () => void;
|
|
14
|
+
onPrevious: () => void;
|
|
15
|
+
onNext: () => void;
|
|
16
|
+
setIsClosing?: (isClosing: boolean) => void;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Major update popup props
|
|
20
|
+
*/
|
|
21
|
+
export interface MajorUpdatePopupProps extends PopupBaseProps {
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Minor update popup props
|
|
25
|
+
*/
|
|
26
|
+
export interface MinorUpdatePopupProps extends PopupBaseProps {
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* Video modal props
|
|
30
|
+
*/
|
|
31
|
+
export interface VideoModalProps {
|
|
32
|
+
isOpen: boolean;
|
|
33
|
+
videoUrl: string;
|
|
34
|
+
onClose: () => void;
|
|
35
|
+
}
|
|
36
|
+
/**
|
|
37
|
+
* Feature announcement provider props
|
|
38
|
+
*/
|
|
39
|
+
export interface FeatureAnnouncementProviderProps extends FeatureAnnouncementRepository {
|
|
40
|
+
children: React.ReactNode;
|
|
41
|
+
module?: string;
|
|
42
|
+
router?: RouterProps;
|
|
43
|
+
}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { FeatureAnnouncement, StoreFeatureProgress } from './feature.types';
|
|
2
|
+
/**
|
|
3
|
+
* Repository function types for dependency injection
|
|
4
|
+
*/
|
|
5
|
+
export interface FeatureAnnouncementRepository {
|
|
6
|
+
fetchVisibleFeatures: (module?: string) => Promise<[Error | null, FeatureAnnouncement[] | null]>;
|
|
7
|
+
getStoreFeatureProgress: (storeId: string) => Promise<[Error | null, StoreFeatureProgress | null]>;
|
|
8
|
+
fetchFeatureById: (featureId: string) => Promise<[Error | null, FeatureAnnouncement | null]>;
|
|
9
|
+
markFeatureAsViewedForStore: (storeId: string, featureId: string) => Promise<[Error | null]>;
|
|
10
|
+
isFeatureApplicableToCurrentPage: (feature: FeatureAnnouncement) => boolean;
|
|
11
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { FeatureAnnouncement, FeatureAnnouncementRepository, RouterProps } from './types';
|
|
2
|
+
export declare const useFeatureAnnouncements: ({ fetchVisibleFeatures, getStoreFeatureProgress, fetchFeatureById, markFeatureAsViewedForStore, isFeatureApplicableToCurrentPage, module, router, }: FeatureAnnouncementRepository & {
|
|
3
|
+
module?: string | undefined;
|
|
4
|
+
router?: RouterProps | undefined;
|
|
5
|
+
}) => {
|
|
6
|
+
features: FeatureAnnouncement[];
|
|
7
|
+
majorUpdateFeatures: FeatureAnnouncement[];
|
|
8
|
+
minorUpdateFeatures: FeatureAnnouncement[];
|
|
9
|
+
isLoading: boolean;
|
|
10
|
+
error: string | null;
|
|
11
|
+
markFeatureAsViewed: (featureId: string) => Promise<void>;
|
|
12
|
+
refetch: () => Promise<void>;
|
|
13
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Calculate transform for closing animation
|
|
3
|
+
* @param popupElement - Popup element reference
|
|
4
|
+
* @param targetElement - Target element to animate towards
|
|
5
|
+
* @returns Transform CSS string
|
|
6
|
+
*/
|
|
7
|
+
export declare const calculateCloseTransform: (popupElement: HTMLElement, targetElement: Element) => string;
|
|
8
|
+
/**
|
|
9
|
+
* Hide Joyride arrow element
|
|
10
|
+
* @param popupRef - Reference to popup element
|
|
11
|
+
*/
|
|
12
|
+
export declare const hideJoyrideArrow: (popupRef: HTMLElement | null) => void;
|
|
13
|
+
/**
|
|
14
|
+
* Execute callback after animation completes
|
|
15
|
+
* @param callback - Function to execute
|
|
16
|
+
* @param delay - Optional delay override
|
|
17
|
+
*/
|
|
18
|
+
export declare const executeAfterAnimation: (callback: () => void, delay?: number) => void;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../constants/animations.js");exports.calculateCloseTransform=(e,t)=>{const i=e.getBoundingClientRect(),o=t.getBoundingClientRect();return`translate(${o.left+o.width/2-(i.left+i.width/2)}px, ${o.top+o.height/2-(i.top+i.height/2)}px) scale(0)`},exports.executeAfterAnimation=function(t){let i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:e.ANIMATION_TIMING.CLOSE_DURATION;setTimeout(t,i)},exports.hideJoyrideArrow=e=>{if(!e)return;const t=e.closest('[class*="react-joyride__tooltip"]');if(!t)return;const i=t.querySelector('[class*="react-joyride__arrow"]');i&&(i.style.display="none",i.style.visibility="hidden",i.style.opacity="0")};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Find What's New button using multiple strategies
|
|
3
|
+
* @returns Element or null
|
|
4
|
+
*/
|
|
5
|
+
export declare const findWhatsNewButton: () => Element | null;
|
|
6
|
+
/**
|
|
7
|
+
* Find target element for minor update
|
|
8
|
+
* @param featureTag - Feature tag selector
|
|
9
|
+
* @returns Element or null
|
|
10
|
+
*/
|
|
11
|
+
export declare const findFeatureTagElement: (featureTag: string) => Element | null;
|
|
12
|
+
/**
|
|
13
|
+
* Normalize selector string
|
|
14
|
+
* @param selector - Selector string
|
|
15
|
+
* @returns Normalized selector
|
|
16
|
+
*/
|
|
17
|
+
export declare const normalizeSelector: (selector: string) => string;
|
|
18
|
+
/**
|
|
19
|
+
* Check if element is fully visible in viewport
|
|
20
|
+
* @param element - Element to check
|
|
21
|
+
* @returns True if element is fully visible
|
|
22
|
+
*/
|
|
23
|
+
export declare const isElementInViewport: (element: Element) => boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Scroll to element smoothly with offset
|
|
26
|
+
* @param element - Element to scroll to
|
|
27
|
+
* @param offset - Offset from top (default 120px for popup space)
|
|
28
|
+
* @returns Promise that resolves when scroll completes
|
|
29
|
+
*/
|
|
30
|
+
export declare const scrollToElementSmooth: (element: Element, offset?: number) => Promise<void>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("../constants/animations.js");var e=require("../constants/selectors.js");const t=e=>{const t=e.getBoundingClientRect(),o=window.innerHeight||document.documentElement.clientHeight,n=window.innerWidth||document.documentElement.clientWidth,r=t.top>=120&&t.bottom<=o,s=t.left>=0&&t.right<=n;return r&&s};exports.findFeatureTagElement=e=>{const t=e.startsWith("#")||e.startsWith(".")||e.startsWith("[")?e:`#${e}`;return document.querySelector(t)},exports.findWhatsNewButton=()=>{let t=document.querySelector(e.SELECTORS.WHATS_NEW_BUTTON);if(t)return t;if(t=document.querySelector(e.SELECTORS.MAIN_ICON_CLASS),t)return t;const o=document.querySelector(e.SELECTORS.SVG_VIEWBOX);if(o){if(o.querySelector(e.SELECTORS.CLIPPATH_PATTERN))return o.closest(e.SELECTORS.WHATS_NEW_BUTTON)||o.parentElement}return null},exports.isElementInViewport=t,exports.normalizeSelector=e=>e.startsWith("#")||e.startsWith(".")||e.startsWith("[")?e:`#${e}`,exports.scrollToElementSmooth=function(e){let o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:120;return new Promise((n=>{if(t(e))return void n();const r=e.getBoundingClientRect().top+window.pageYOffset-o;let s;window.scrollTo({top:r,behavior:"smooth"});const i=()=>{clearTimeout(s),s=setTimeout((()=>{window.removeEventListener("scroll",i),setTimeout((()=>n()),100)}),100)};window.addEventListener("scroll",i,{passive:!0}),setTimeout((()=>{window.removeEventListener("scroll",i),n()}),1e3)}))};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Decode HTML entities in text
|
|
3
|
+
* @param text - Text containing HTML entities
|
|
4
|
+
* @returns Decoded text
|
|
5
|
+
*/
|
|
6
|
+
export declare const decodeHTMLEntities: (text: string) => string;
|
|
7
|
+
/**
|
|
8
|
+
* Format video URL for embedding
|
|
9
|
+
* @param videoUrl - Original video URL
|
|
10
|
+
* @returns Formatted video URL
|
|
11
|
+
*/
|
|
12
|
+
export declare const formatVideoUrl: (videoUrl: string) => string;
|
|
13
|
+
/**
|
|
14
|
+
* Check if URL is a YouTube video
|
|
15
|
+
* @param videoUrl - Video URL to check
|
|
16
|
+
* @returns True if YouTube video
|
|
17
|
+
*/
|
|
18
|
+
export declare const isYouTubeVideo: (videoUrl: string) => boolean;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.decodeHTMLEntities=e=>{if(!e)return"";const t=document.createElement("textarea");return t.innerHTML=e,t.value},exports.formatVideoUrl=e=>e.replace("watch?v=","embed/").replace("youtu.be/","youtube.com/embed/"),exports.isYouTubeVideo=e=>e.includes("youtube.com")||e.includes("youtu.be");
|
|
@@ -27,6 +27,8 @@ interface CollectionsScreenInterface {
|
|
|
27
27
|
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
28
28
|
scrollContainerRef: React.RefObject<HTMLDivElement>;
|
|
29
29
|
appType: ApplicationType;
|
|
30
|
+
limit?: number;
|
|
31
|
+
exactLimit?: number;
|
|
30
32
|
}
|
|
31
33
|
export declare const CollectionsScreen: (props: CollectionsScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
32
34
|
export interface CollectionCardInterface {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("../../assets/icons/chevronRight.svg.js"),s=require("react"),i=require("../checkBox/CheckBox.js"),l=require("../icon-button/IconButton.js"),o=require("../tag/Tag.js"),r=require("../tooltips/Tooltip.js"),n=require("../TypographyStyle.js"),c=require("./emptyState.js"),u=require("./ProductPickerShimmer.js"),d=require("./style.js"),a=require("./utility.js");const x=s=>{const{customCollectionRestriction:c,data:u,selectedCollectionsDispatch:a,setCollectionId:x,setSelectedCollectionId:p,isPartiallyChecked:j,setScreen:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("../../assets/icons/chevronRight.svg.js"),s=require("react"),i=require("../checkBox/CheckBox.js"),l=require("../icon-button/IconButton.js"),o=require("../tag/Tag.js"),r=require("../tooltips/Tooltip.js"),n=require("../TypographyStyle.js"),c=require("./emptyState.js"),u=require("./ProductPickerShimmer.js"),d=require("./style.js"),a=require("./utility.js");const x=s=>{const{customCollectionRestriction:c,data:u,selectedCollectionsDispatch:a,setCollectionId:x,setSelectedCollectionId:p,isPartiallyChecked:j,setScreen:C,id:h,isChecked:m,isDisabled:y,hideCollectionCheckbox:g,pickerType:v,usedInSearch:R}=s;return u?e.jsxRuntimeExports.jsxs(d.CollectionCardStyle,Object.assign({isDisabled:y,onClick:e=>{if(!y){if("COLLECTION"===v)return e.stopPropagation(),a({type:"reset",data:{}}),a({type:"selected",data:{id:h,val:u,isRestricted:c}}),x(h),void p(h);x(h),p(h),C("products")}},isActive:m,usedInSearch:null!=R&&R},{children:[e.jsxRuntimeExports.jsxs(d.CollectionCardInfoStyle,{children:[!g&&e.jsxRuntimeExports.jsx(i.CheckBox,{isDisabled:y,isChecked:m,isPartiallyChecked:j,onValueChange:function(e,t,s){null==s||s.stopPropagation(),a(e?{type:"selected",data:{id:h,val:u,isRestricted:c}}:{type:"unselected",data:{id:h}}),p(e?h:"")}}),e.jsxRuntimeExports.jsx(d.CollectionCardDetailStyle,{children:e.jsxRuntimeExports.jsx(r.Tooltip,Object.assign({body:u.name,placement:"bottom",delay:400,variant:"light"},{children:e.jsxRuntimeExports.jsxs(d.CollectionNameHolder,{children:[R?e.jsxRuntimeExports.jsx(n.BodyPrimary,Object.assign({numberOfLines:1},{children:u.name})):e.jsxRuntimeExports.jsx(n.TitleRegular,Object.assign({numberOfLines:1},{children:u.name})),u.isSmartCollection?e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsxRuntimeExports.jsx(o.Tag,{tagText:"Smart Collection",type:"warning"})})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]})}))})]}),"COLLECTION"!==v&&e.jsxRuntimeExports.jsx(l.IconButton,{height:12,width:12,disabled:y,Icon:t.default})]})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})};exports.CollectionCard=x,exports.CollectionsScreen=t=>{var i;const{customCollectionRestriction:l,dataLoading:o,collections:r,selectedCollectionsDispatch:n,setCollectionId:d,setSelectedCollectionId:p,selectedCollections:j,setScreen:C,collectionFetcher:h,collectionsDispatch:m,pagingControls:y,storeId:g,setSaveDisabled:v,hideCollectionCheckbox:R,renderWithoutModal:E,pickerType:b,scrollContainerRef:k,appType:f,limit:S,exactLimit:O}=t,P=s.useRef(y.curPage),I=!!l&&(null==j?void 0:j.isCustom),[T,q]=s.useState(!1),L=s.useRef(!1),D=s.useRef(!1),B=()=>{if(!k||!(null==k?void 0:k.current))return;const{scrollTop:e,clientHeight:t,scrollHeight:s}=k.current;e+t>=s-20&&!L.current&&!D.current&&(v(!0),q(!0),D.current=!0,v(!0),q(!0),h(P.current,g,f).then((e=>{m({type:"paged",data:(null==e?void 0:e.collections)||{}}),y.setCurPage(P.current+1),q(!1),v(!1),D.current=!1,Object.keys(null==e?void 0:e.collections).length||(L.current=!0)})).catch())};s.useEffect((()=>{var e;return null===(e=null==k?void 0:k.current)||void 0===e||e.addEventListener("scroll",B),()=>{var e;null===(e=null==k?void 0:k.current)||void 0===e||e.removeEventListener("scroll",B)}}),[]),s.useEffect((()=>{P.current=y.curPage}),[y.curPage]);const N=Object.keys(j||{}).filter((e=>"isCustom"!==e)).length;return e.jsxRuntimeExports.jsxs("div",{children:[(null===(i=Object.keys(null!=r?r:{}))||void 0===i?void 0:i.length)?Object.keys(r).map((t=>{var s,i;const o=!!(null==j?void 0:j[t])&&("PRODUCT"!==b||!!Object.keys(null!==(i=null===(s=null==j?void 0:j[t])||void 0===s?void 0:s.products)&&void 0!==i?i:{}).length),c="COLLECTION"===b&&!o&&(!!O&&N>=O||!!S&&N>=S);return e.jsxRuntimeExports.jsx(x,{customCollectionRestriction:l,data:r[t],isDisabled:I&&!(null==j?void 0:j[t])||c,isChecked:o,isPartiallyChecked:a.isCollectionPartiallyChecked(t,null==r?void 0:r[t],j),selectedCollectionsDispatch:n,setCollectionId:d,setSelectedCollectionId:p,setScreen:C,id:t,hideCollectionCheckbox:R||"-1"===t,selectedCollections:j,renderWithoutModal:E,pickerType:b},t)})):o?e.jsxRuntimeExports.jsx(u.ProductPickerShimmer,{}):e.jsxRuntimeExports.jsx(c.EmptyState,{title:"No collections to show",subtitle:"We couldn’t find any collection."}),T&&e.jsxRuntimeExports.jsx(u.ProductPickerShimmer,{})]})},exports.truncate=(e,t,s)=>{if(!e)return"";if(e.length<=t)return e;const i=e.slice(0,t-1);return(s?i.slice(0,i.lastIndexOf(" ")):i)+"..."};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("@bikdotai/bik-models/growth/models/bik-store"),o=require("../../assets/icons/search.svg.js"),s=require("react"),r=require("../../constants/Theme.js"),c=require("../../assets/icons/cross.svg.js"),n=require("../button/Button.js"),i=require("../input/Input.js"),l=require("../modals/styledModal.js"),a=require("../spinner/Spinner.js"),d=require("../tag/Tag.js"),u=require("./collectionScreen.js"),p=require("./productInfoOverlay.js"),x=require("./productScreen.js"),h=require("./rearrangeScreen.js"),j=require("./reducers.js"),m=require("./searchScreen.js"),S=require("./selectedScreen.js"),C=require("./style.js"),g=require("./type.js"),y=require("./utility.js");exports.ProductPickerModal=R=>{const{storeId:b,selectedItems:f,onClose:E,visible:k,zIndex:v,exactLimit:I,limit:O,hideCollectionCheckbox:F,hideProductCheckbox:P,outOfStockAction:T=g.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,hideSelectionCount:N,title:A,width:B,left:w,renderWithoutModal:L,onClickSave:M,pickerType:V,hideProductVariants:z=!1,startupScreen:$=g.ScreenName.Collections,rearrangeEnabled:_,selectSingleItem:H=!1,showProductDetails:K,containerStyle:W,crossButtonInsideHeader:G=!1,footerForNonModal:U={},primaryButton:Y,secondaryButton:J,subtitle:Q}=R,X=R.appType||t.ApplicationType.BIK,[Z,ee]=s.useReducer(j.collectionsReducer,{}),[te,oe]=s.useState([g.ScreenName.Collections,g.ScreenName.RearrangeProducts].includes($)?$:g.ScreenName.Collections),[se,re]=s.useState("grid"),[ce,ne]=s.useState(""),[ie,le]=s.useState(""),[ae,de]=s.useState(0),[ue,pe]=s.useState(!1),[xe,he]=s.useState(0),[je,me]=s.useState(""),[Se,Ce]=s.useState(!1),[ge,ye]=s.useState(!1),[Re,be]=s.useReducer(j.searchReducer,{collections:{},products:{}}),[fe,Ee]=s.useReducer(j.selectedColectionsReducer,Object.keys(f).length>0?f:{}),ke=s.useRef(null),[ve,Ie]=s.useState(!1),[Oe,Fe]=s.useState();s.useEffect((()=>{pe(!0),ye(!0),R.collectionFetcher(ae,b,X).then((e=>{ee({type:"fetched",data:(null==e?void 0:e.collections)||{}}),pe(!1),de((e=>e+1)),ye(!1)})).catch()}),[]),s.useEffect((()=>{let e=0;z?Object.keys(fe||[]).forEach((t=>{var o;Object.keys((null===(o=fe[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var s;"-1"!==t&&fe[-1]&&(null===(s=fe[-1].products)||void 0===s?void 0:s[o])||(e+=1)}))})):Object.keys(fe||[]).forEach((t=>{var o;Object.keys((null===(o=fe[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var s,r;Object.keys((null===(r=null===(s=fe[t].products)||void 0===s?void 0:s[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),he(e)}),[Z,fe,z]),s.useEffect((()=>{ie&&(pe(!0),R.productFetcher(ie,b,X).then((e=>{Object.keys(e).length&&ee({type:"productsFetched",data:{collectionId:ie,products:e}}),pe(!1)})).catch())}),[ie]),s.useEffect((()=>{const e=setTimeout((()=>{"rearrange"!==te&&(je.length||"collections"!==te)&&(je.length?(Ce(!0),R.searchFetcher(b,je,X).then((e=>{"collections"in e&&"products"in e?(be({type:"set",data:e}),ee({type:"searched",data:e.collections}),ee({type:"searched",data:e.products})):(be({type:"set",data:{collections:{},products:e}}),ee({type:"searched",data:e})),oe("searchProducts"),pe(!1),Ce(!1)}))):oe("collections"))}),800);return()=>clearTimeout(e)}),[je]),s.useEffect((()=>{M&&(R.onAdd(fe,xe),Pe())}),[M]),s.useEffect((()=>{H&&Object.keys(fe||{}).length&&xe&&(R.onAdd(fe,xe),Pe())}),[H,fe,xe]);const Pe=()=>{Ee({type:"reset",data:{}})},Te=()=>I&&xe>I?e.jsxRuntimeExports.jsx(d.Tag,{tagText:`You can only select ${I} products`,type:"negative"}):O&&xe>O?e.jsxRuntimeExports.jsx(d.Tag,{tagText:`You can only select ${O} products`,type:"negative"}):xe>0?e.jsxRuntimeExports.jsx(n.Button,{onClick:()=>{oe(_?g.ScreenName.RearrangeProducts:g.ScreenName.SelectedProducts)},buttonText:I?`${xe}/${I} products selected`:`${xe} products selected`,buttonType:["rearrange","view"].includes(te)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(te)}):e.jsxRuntimeExports.jsx(n.Button,{disabled:!0,buttonText:I?`${xe}/${I} products selected`:`${xe} products selected`,buttonType:"tertiaryGray"}),De=e=>ue?"Loading...":te===g.ScreenName.RearrangeProducts?null!=e?e:"Done":null!=e?e:"Add",qe=e.jsxRuntimeExports.jsxs(C.ContainerStyle,Object.assign({style:null!=W?W:{}},{children:[R.postHeader&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:R.postHeader})),!R.hideGlobalSearch&&e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:("collections"===te||"searchProducts"===te)&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:L?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:e.jsxRuntimeExports.jsx(i.Input,{placeholder:"Search using ID, Name or SKU ID",noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>Se?e.jsxRuntimeExports.jsx(a.Spinner,{size:"small",color:r.COLORS.content.primary}):e.jsxRuntimeExports.jsx(o.default,{})},id:"listInput",height:"24px",type:"text",value:je,onChangeText:e=>{e.length&&e.trim().length?me(e):me("")}})}))}),e.jsxRuntimeExports.jsxs(C.ScrollContainerStyle,Object.assign({ref:ke,screenName:te},{children:["collections"===te&&e.jsxRuntimeExports.jsx(u.CollectionsScreen,{customCollectionRestriction:R.customCollectionRestriction,dataLoading:ge,collections:Z,selectedCollectionsDispatch:Ee,setCollectionId:ne,setSelectedCollectionId:le,setScreen:oe,selectedCollections:fe,collectionFetcher:R.collectionFetcher,storeId:b,appType:X,collectionsDispatch:ee,setSaveDisabled:pe,pagingControls:{curPage:ae,setCurPage:de},hideCollectionCheckbox:F,renderWithoutModal:L,pickerType:V,scrollContainerRef:ke}),"products"===te&&ce&&e.jsxRuntimeExports.jsx(j.CollectionIdContext.Provider,Object.assign({value:ce},{children:e.jsxRuntimeExports.jsx(x.ProductsScreen,{hideInCollectionSearch:R.hideInCollectionSearch,customCollectionRestriction:R.customCollectionRestriction,productFetcher:R.productFetcher,setScreen:oe,storeId:b,appType:X,data:Z[ce],collectionsDispatch:ee,selectedCollectionsDispatch:Ee,selectedData:fe,setSaveDisabled:pe,searchInCollectionFetcher:R.searchInCollectionFetcher,hideProductCheckbox:P,outOfStockAction:T,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,renderWithoutModal:L,pickerType:V,hideProductVariants:z,fbStatusFetcher:R.fbStatusFetcher,onProductDetailClick:e=>{Ie(!0),Fe(e)},showProductDetailInfoIcon:K,scrollContainerRef:ke})})),"view"===te&&e.jsxRuntimeExports.jsx(S.SelectedScreen,{selectedCollections:fe||{},selectedCollectionsDispatch:Ee,setScreen:oe,collections:Z,hideProductVariants:z,outOfStockAction:T,storeId:b,appType:X,fbStatusFetcher:R.fbStatusFetcher}),"rearrange"===te&&e.jsxRuntimeExports.jsx(h.RearrangeScreen,{selectedCollections:fe||{},selectedCollectionsDispatch:Ee,setScreen:oe,outOfStockAction:T,rearrangeViewType:"grid"===se?"list":"grid",scrollContainerRef:ke,storeId:b,appType:X,fbStatusFetcher:R.fbStatusFetcher}),"searchProducts"===te&&e.jsxRuntimeExports.jsx(m.SearchScreen,{customCollectionRestriction:R.customCollectionRestriction,selectedCollections:fe||{},searchedCollections:Re||{},searchedCollectionsDispatch:be,selectedCollectionsDispatch:Ee,setScreen:oe,collections:Z,onBackPress:()=>{me(""),be({type:"set",data:{collections:{},products:{}}})},pickerType:V,hideProductCheckbox:P,hideProductVariants:z,hideVariantCheckbox:D,storeId:b,appType:X,fbStatusFetcher:R.fbStatusFetcher,setCollectionId:ne,setSelectedCollectionId:le,renderWithoutModal:L,hideCollectionCheckbox:F,outOfStockAction:T})]}))]}));return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:L?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[qe,U.renderFooter?e.jsxRuntimeExports.jsxs(C.StyledFooterForNonModal,{children:[Te(),e.jsxRuntimeExports.jsx(n.Button,{buttonText:De(U.primaryButtonText),disabled:!U.isLoading&&(ue||xe<1||I&&xe<I||!I&&O&&xe>O)||U.primaryButtonDisabled,isLoading:U.isLoading,onClick:()=>{R.onAdd(fe,xe),Pe(),oe([g.ScreenName.Collections,g.ScreenName.RearrangeProducts].includes($)?$:g.ScreenName.Collections)}})]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),ve&&Oe?e.jsxRuntimeExports.jsx(p.ProductInfoOverlay,{productData:Oe,outOfStockAction:T,useDynamicInfoImageSize:R.useDynamicInfoImageSize,onClose:()=>{Ie(!1)}}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}):e.jsxRuntimeExports.jsxs(l.StyledModal,Object.assign({zIndex:v,open:k,onClose:()=>{null==E||E(),Pe()},headingTitle:A||("collections"===te||"products"===te?"Select Products":"view"===te?"Selected Products":"searchProducts"===te?"Searched Results":"rearrange"===te?"Rearrange Products":void 0),headingSubtitle:Q,footerShadow:!0,centralContainerStyles:{width:B||"600px",left:w||"auto"},headerRightCustomElement:G?e.jsxRuntimeExports.jsx("div",Object.assign({style:{cursor:"pointer",display:"flex"},onClick:E},{children:e.jsxRuntimeExports.jsx(c.default,{width:20,height:20,color:r.COLORS.content.secondary})})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),footerContainerStyle:R.stickyFooter?{position:"absolute",bottom:0,left:0,width:"100%",zIndex:9,background:r.COLORS.surface.standard}:void 0,primaryButton:Y?(e=>Object.assign(Object.assign({},e),{disabled:!e.isLoading&&(ue||xe<1||I&&xe<I||!I&&O&&xe>O)||e.disabled,onClick:()=>{R.onAdd(fe,xe),Pe(),oe([g.ScreenName.Collections,g.ScreenName.RearrangeProducts].includes($)?$:g.ScreenName.Collections)}}))(Y):{buttonText:De(),disabled:ue||xe<1||I&&xe<I||!I&&O&&xe>O||!1,onClick:()=>{R.onAdd(fe,xe),Pe()}},secondaryButton:J?(e=>Object.assign(Object.assign({},e),{disabled:ue||xe<1||I&&xe<I||!I&&O&&xe>O||!1,onClick:()=>{const e=y.updateAllVariantsForSelectedProducts(fe,Z,Re);R.onAdd(e,xe,!0)}}))(J):void 0,wrapperStyle:R.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:N?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):Te(),hideCrossButton:ve||G},{children:[qe,ve&&Oe?e.jsxRuntimeExports.jsx(p.ProductInfoOverlay,{productData:Oe,useDynamicInfoImageSize:R.useDynamicInfoImageSize,outOfStockAction:T,onClose:()=>{Ie(!1)}}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}))})};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("@bikdotai/bik-models/growth/models/bik-store"),o=require("../../assets/icons/search.svg.js"),s=require("react"),r=require("../../constants/Theme.js"),c=require("../../assets/icons/cross.svg.js"),n=require("../button/Button.js"),i=require("../input/Input.js"),l=require("../modals/styledModal.js"),a=require("../spinner/Spinner.js"),d=require("../tag/Tag.js"),u=require("./collectionScreen.js"),p=require("./productInfoOverlay.js"),x=require("./productScreen.js"),h=require("./rearrangeScreen.js"),j=require("./reducers.js"),m=require("./searchScreen.js"),S=require("./selectedScreen.js"),C=require("./style.js"),g=require("./type.js"),y=require("./utility.js");exports.ProductPickerModal=R=>{const{storeId:b,selectedItems:f,onClose:E,visible:v,zIndex:k,exactLimit:I,limit:O,hideCollectionCheckbox:F,hideProductCheckbox:P,outOfStockAction:T=g.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,hideSelectionCount:N,title:L,width:A,left:B,renderWithoutModal:w,onClickSave:$,pickerType:M,hideProductVariants:V=!1,startupScreen:z=g.ScreenName.Collections,rearrangeEnabled:_,selectSingleItem:H=!1,showProductDetails:K,containerStyle:W,crossButtonInsideHeader:G=!1,footerForNonModal:U={},primaryButton:Y,secondaryButton:J,subtitle:Q}=R,X=R.appType||t.ApplicationType.BIK,[Z,ee]=s.useReducer(j.collectionsReducer,{}),[te,oe]=s.useState([g.ScreenName.Collections,g.ScreenName.RearrangeProducts].includes(z)?z:g.ScreenName.Collections),[se,re]=s.useState("grid"),[ce,ne]=s.useState(""),[ie,le]=s.useState(""),[ae,de]=s.useState(0),[ue,pe]=s.useState(!1),[xe,he]=s.useState(0),[je,me]=s.useState(""),[Se,Ce]=s.useState(!1),[ge,ye]=s.useState(!1),[Re,be]=s.useReducer(j.searchReducer,{collections:{},products:{}}),[fe,Ee]=s.useReducer(j.selectedColectionsReducer,Object.keys(f).length>0?f:{}),ve=s.useRef(null),[ke,Ie]=s.useState(!1),[Oe,Fe]=s.useState();s.useEffect((()=>{pe(!0),ye(!0),R.collectionFetcher(ae,b,X).then((e=>{ee({type:"fetched",data:(null==e?void 0:e.collections)||{}}),pe(!1),de((e=>e+1)),ye(!1)})).catch()}),[]),s.useEffect((()=>{let e=0;"COLLECTION"===M?e=Object.keys(fe||{}).filter((e=>"isCustom"!==e)).length:V?Object.keys(fe||[]).forEach((t=>{var o;Object.keys((null===(o=fe[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var s;"-1"!==t&&fe[-1]&&(null===(s=fe[-1].products)||void 0===s?void 0:s[o])||(e+=1)}))})):Object.keys(fe||[]).forEach((t=>{var o;Object.keys((null===(o=fe[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var s,r;Object.keys((null===(r=null===(s=fe[t].products)||void 0===s?void 0:s[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),he(e)}),[Z,fe,V,M]),s.useEffect((()=>{ie&&(pe(!0),R.productFetcher(ie,b,X).then((e=>{Object.keys(e).length&&ee({type:"productsFetched",data:{collectionId:ie,products:e}}),pe(!1)})).catch())}),[ie]),s.useEffect((()=>{const e=setTimeout((()=>{"rearrange"!==te&&(je.length||"collections"!==te)&&(je.length?(Ce(!0),R.searchFetcher(b,je,X).then((e=>{"collections"in e&&"products"in e?(be({type:"set",data:e}),ee({type:"searched",data:e.collections}),ee({type:"searched",data:e.products})):(be({type:"set",data:{collections:{},products:e}}),ee({type:"searched",data:e})),oe("searchProducts"),pe(!1),Ce(!1)}))):oe("collections"))}),800);return()=>clearTimeout(e)}),[je]),s.useEffect((()=>{$&&(R.onAdd(fe,xe),Pe())}),[$]),s.useEffect((()=>{H&&Object.keys(fe||{}).length&&xe&&(R.onAdd(fe,xe),Pe())}),[H,fe,xe]);const Pe=()=>{Ee({type:"reset",data:{}})},Te=()=>{let t,o;return"COLLECTION"===M?(t="collection",o="collections"):V?(t="product",o="products"):(t="variant",o="variants"),I&&xe>I?e.jsxRuntimeExports.jsx(d.Tag,{tagText:`You can only select ${I} ${1===I?t:o}`,type:"negative"}):O&&xe>O?e.jsxRuntimeExports.jsx(d.Tag,{tagText:`You can only select ${O} ${1===O?t:o}`,type:"negative"}):xe>0?e.jsxRuntimeExports.jsx(n.Button,{onClick:()=>{oe(_?g.ScreenName.RearrangeProducts:g.ScreenName.SelectedProducts)},buttonText:I?`${xe}/${I} ${1===xe?t:o} selected`:`${xe} ${1===xe?t:o} selected`,buttonType:["rearrange","view"].includes(te)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(te)}):e.jsxRuntimeExports.jsx(n.Button,{disabled:!0,buttonText:I?`${xe}/${I} ${1===I?t:o} selected`:`${xe} ${1===xe?t:o} selected`,buttonType:"tertiaryGray"})},De=e=>ue?"Loading...":te===g.ScreenName.RearrangeProducts?null!=e?e:"Done":null!=e?e:"Add",qe=e.jsxRuntimeExports.jsxs(C.ContainerStyle,Object.assign({style:null!=W?W:{}},{children:[R.postHeader&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:R.postHeader})),!R.hideGlobalSearch&&e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:("collections"===te||"searchProducts"===te)&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{padding:w?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:e.jsxRuntimeExports.jsx(i.Input,{placeholder:"Search using ID, Name or SKU ID",noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>Se?e.jsxRuntimeExports.jsx(a.Spinner,{size:"small",color:r.COLORS.content.primary}):e.jsxRuntimeExports.jsx(o.default,{})},id:"listInput",height:"24px",type:"text",value:je,onChangeText:e=>{e.length&&e.trim().length?me(e):me("")}})}))}),e.jsxRuntimeExports.jsxs(C.ScrollContainerStyle,Object.assign({ref:ve,screenName:te},{children:["collections"===te&&e.jsxRuntimeExports.jsx(u.CollectionsScreen,{customCollectionRestriction:R.customCollectionRestriction,dataLoading:ge,collections:Z,selectedCollectionsDispatch:Ee,setCollectionId:ne,setSelectedCollectionId:le,setScreen:oe,selectedCollections:fe,collectionFetcher:R.collectionFetcher,storeId:b,appType:X,collectionsDispatch:ee,setSaveDisabled:pe,pagingControls:{curPage:ae,setCurPage:de},hideCollectionCheckbox:F,renderWithoutModal:w,pickerType:M,scrollContainerRef:ve,limit:O,exactLimit:I}),"products"===te&&ce&&e.jsxRuntimeExports.jsx(j.CollectionIdContext.Provider,Object.assign({value:ce},{children:e.jsxRuntimeExports.jsx(x.ProductsScreen,{hideInCollectionSearch:R.hideInCollectionSearch,customCollectionRestriction:R.customCollectionRestriction,productFetcher:R.productFetcher,setScreen:oe,storeId:b,appType:X,data:Z[ce],collectionsDispatch:ee,selectedCollectionsDispatch:Ee,selectedData:fe,setSaveDisabled:pe,searchInCollectionFetcher:R.searchInCollectionFetcher,hideProductCheckbox:P,outOfStockAction:T,hideVariantCheckbox:D,selectProductsFromCustomCollection:q,renderWithoutModal:w,pickerType:M,hideProductVariants:V,fbStatusFetcher:R.fbStatusFetcher,onProductDetailClick:e=>{Ie(!0),Fe(e)},showProductDetailInfoIcon:K,scrollContainerRef:ve})})),"view"===te&&e.jsxRuntimeExports.jsx(S.SelectedScreen,{selectedCollections:fe||{},selectedCollectionsDispatch:Ee,setScreen:oe,collections:Z,hideProductVariants:V,outOfStockAction:T,storeId:b,appType:X,fbStatusFetcher:R.fbStatusFetcher}),"rearrange"===te&&e.jsxRuntimeExports.jsx(h.RearrangeScreen,{selectedCollections:fe||{},selectedCollectionsDispatch:Ee,setScreen:oe,outOfStockAction:T,rearrangeViewType:"grid"===se?"list":"grid",scrollContainerRef:ve,storeId:b,appType:X,fbStatusFetcher:R.fbStatusFetcher}),"searchProducts"===te&&e.jsxRuntimeExports.jsx(m.SearchScreen,{customCollectionRestriction:R.customCollectionRestriction,selectedCollections:fe||{},searchedCollections:Re||{},searchedCollectionsDispatch:be,selectedCollectionsDispatch:Ee,setScreen:oe,collections:Z,onBackPress:()=>{me(""),be({type:"set",data:{collections:{},products:{}}})},pickerType:M,hideProductCheckbox:P,hideProductVariants:V,hideVariantCheckbox:D,storeId:b,appType:X,fbStatusFetcher:R.fbStatusFetcher,setCollectionId:ne,setSelectedCollectionId:le,renderWithoutModal:w,hideCollectionCheckbox:F,outOfStockAction:T,limit:O,exactLimit:I})]}))]}));return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:w?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[qe,U.renderFooter?e.jsxRuntimeExports.jsxs(C.StyledFooterForNonModal,{children:[Te(),e.jsxRuntimeExports.jsx(n.Button,{buttonText:De(U.primaryButtonText),disabled:!U.isLoading&&(ue||xe<1||I&&xe<I||!I&&O&&xe>O)||U.primaryButtonDisabled,isLoading:U.isLoading,onClick:()=>{R.onAdd(fe,xe),Pe(),oe([g.ScreenName.Collections,g.ScreenName.RearrangeProducts].includes(z)?z:g.ScreenName.Collections)}})]}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),ke&&Oe?e.jsxRuntimeExports.jsx(p.ProductInfoOverlay,{productData:Oe,outOfStockAction:T,useDynamicInfoImageSize:R.useDynamicInfoImageSize,onClose:()=>{Ie(!1)}}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}):e.jsxRuntimeExports.jsxs(l.StyledModal,Object.assign({zIndex:k,open:v,onClose:()=>{null==E||E(),Pe()},headingTitle:L||("collections"===te||"products"===te?"Select Products":"view"===te?"Selected Products":"searchProducts"===te?"Searched Results":"rearrange"===te?"Rearrange Products":void 0),headingSubtitle:Q,footerShadow:!0,centralContainerStyles:{width:A||"600px",left:B||"auto"},headerRightCustomElement:G?e.jsxRuntimeExports.jsx("div",Object.assign({style:{cursor:"pointer",display:"flex"},onClick:E},{children:e.jsxRuntimeExports.jsx(c.default,{width:20,height:20,color:r.COLORS.content.secondary})})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),footerContainerStyle:R.stickyFooter?{position:"absolute",bottom:0,left:0,width:"100%",zIndex:9,background:r.COLORS.surface.standard}:void 0,primaryButton:Y?(e=>Object.assign(Object.assign({},e),{disabled:!e.isLoading&&(ue||xe<1||I&&xe<I||!I&&O&&xe>O)||e.disabled,onClick:()=>{R.onAdd(fe,xe),Pe(),oe([g.ScreenName.Collections,g.ScreenName.RearrangeProducts].includes(z)?z:g.ScreenName.Collections)}}))(Y):{buttonText:De(),disabled:ue||xe<1||I&&xe<I||!I&&O&&xe>O||!1,onClick:()=>{R.onAdd(fe,xe),Pe()}},secondaryButton:J?(e=>Object.assign(Object.assign({},e),{disabled:ue||xe<1||I&&xe<I||!I&&O&&xe>O||!1,onClick:()=>{const e=y.updateAllVariantsForSelectedProducts(fe,Z,Re);R.onAdd(e,xe,!0)}}))(J):void 0,wrapperStyle:R.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:N?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):Te(),hideCrossButton:ke||G},{children:[qe,ke&&Oe?e.jsxRuntimeExports.jsx(p.ProductInfoOverlay,{productData:Oe,useDynamicInfoImageSize:R.useDynamicInfoImageSize,outOfStockAction:T,onClose:()=>{Ie(!1)}}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}))})};
|
|
@@ -26,6 +26,8 @@ interface SearchScreenInterface {
|
|
|
26
26
|
hideCollectionCheckbox?: boolean;
|
|
27
27
|
renderWithoutModal?: boolean;
|
|
28
28
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
29
|
+
limit?: number;
|
|
30
|
+
exactLimit?: number;
|
|
29
31
|
}
|
|
30
32
|
export declare const SearchScreen: (props: SearchScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
31
33
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("../../assets/icons/arrow_left.svg.js"),o=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("../../assets/icons/arrow_left.svg.js"),o=require("react"),i=require("../icon-button/IconButton.js"),s=require("../TypographyStyle.js"),l=require("./collectionScreen.js"),c=require("./emptyState.js"),r=require("./product.js"),n=require("./style.js"),d=require("./utility.js");exports.SearchScreen=u=>{var a;const{customCollectionRestriction:p,selectedCollections:x,searchedCollections:h,searchedCollectionsDispatch:j,selectedCollectionsDispatch:v,setScreen:C,collections:m,onBackPress:y,hideVariantCheckbox:k,pickerType:b,hideProductVariants:S,hideProductCheckbox:E,storeId:R,fbStatusFetcher:P,setCollectionId:f,setSelectedCollectionId:O,hideCollectionCheckbox:g,renderWithoutModal:I,outOfStockAction:q,appType:T,limit:D,exactLimit:F}=u;o.useEffect((()=>{var e;d.fetchFbStatusCollection(null!==(e=h.products)&&void 0!==e?e:{},R,T,j,P,"setProducts")}),[null==h?void 0:h.products]);const B=!!p&&(null==x?void 0:x.isCustom),V=Object.keys(x||{}).filter((e=>"isCustom"!==e)).length;return e.jsxRuntimeExports.jsxs("div",{children:[e.jsxRuntimeExports.jsxs(n.SelectedScreenHeader,{children:[e.jsxRuntimeExports.jsx(i.IconButton,{Icon:t.default,onClick:()=>{C("collections"),y()}}),e.jsxRuntimeExports.jsx(s.BodyCaption,{children:(null===(a=Object.keys(null==h?void 0:h.collections))||void 0===a?void 0:a.length)?"Searched Collections & Products":"Searched Products"})]}),e.jsxRuntimeExports.jsx("div",{children:Object.keys(null==h?void 0:h.products).length||Object.keys(null==h?void 0:h.collections).length?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:Object.keys(null==h?void 0:h.collections).map((t=>{const o=!!(null==x?void 0:x[t]),i="COLLECTION"===b&&!o&&(!!F&&V>=F||!!D&&V>=D);return e.jsxRuntimeExports.jsx(l.CollectionCard,{customCollectionRestriction:p,data:null==m?void 0:m[t],isDisabled:B&&!(null==x?void 0:x[t])||i,isChecked:o,isPartiallyChecked:d.isCollectionPartiallyChecked(t,null==m?void 0:m[t],x,S),selectedCollectionsDispatch:v,setCollectionId:f,setSelectedCollectionId:O,setScreen:C,id:t,hideCollectionCheckbox:g||"-1"===t,selectedCollections:x,renderWithoutModal:I,pickerType:b,usedInSearch:!0},t)}))}),e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:Object.keys(null==h?void 0:h.products).map((t=>{var o,i;return Object.keys((null===(i=null===(o=null==h?void 0:h.products)||void 0===o?void 0:o[t])||void 0===i?void 0:i.products)||[]).map((o=>{var i,s,l;let c=!1;return(null===(i=null==h?void 0:h.products)||void 0===i?void 0:i.isCustom)&&(c=!0),e.jsxRuntimeExports.jsx(r.ProductGroup,{collectionId:t,upliftAdditions:(e,o)=>((e,t,o)=>{var i;const s=d.liftTheStateUp(o,null===(i=null==h?void 0:h.products)||void 0===i?void 0:i[e]);v({type:t,data:Object.assign(Object.assign({},s),{isRestricted:p})})})(t,e,o),productId:o,data:(null===(s=null==h?void 0:h.products)||void 0===s?void 0:s[t].products)[o],isProductPartiallyChecked:d.isProductPartiallyChecked(t,o,x,null===(l=h.products)||void 0===l?void 0:l[t],S),selectedData:x,selectedCollectionsDispatch:v,viewOnly:c,hideProductCheckbox:E,hideVariantCheckbox:k,hideProductVariants:S,pickerType:b,outOfStockAction:q},o)}))}))})]}):e.jsxRuntimeExports.jsx(c.EmptyState,{title:"No search results found",subtitle:"We couldn’t find the product you were looking for."})})]})};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { WhatsNewContent } from './WhatsNew.types';
|
|
3
|
+
interface WhatsNewProps {
|
|
4
|
+
title?: string;
|
|
5
|
+
tooltip?: string;
|
|
6
|
+
searchPlaceholder?: string;
|
|
7
|
+
emptyStateTitle?: string;
|
|
8
|
+
emptyStateDescription?: string;
|
|
9
|
+
noResultsText?: string;
|
|
10
|
+
width?: string;
|
|
11
|
+
onContentClick?: (content: WhatsNewContent) => void;
|
|
12
|
+
renderCustomContent?: (content: WhatsNewContent) => React.ReactNode;
|
|
13
|
+
buttonTestId?: string;
|
|
14
|
+
iconWidth?: number;
|
|
15
|
+
iconHeight?: number;
|
|
16
|
+
customIcon?: React.ComponentType<{
|
|
17
|
+
width?: number;
|
|
18
|
+
height?: number;
|
|
19
|
+
color?: string;
|
|
20
|
+
}>;
|
|
21
|
+
}
|
|
22
|
+
export declare const WhatsNew: React.FC<WhatsNewProps>;
|
|
23
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../node_modules/react/jsx-runtime.js"),e=require("react"),n=require("./WhatsNewButton.js"),o=require("./WhatsNewPanel.js"),s=require("./WhatsNewProvider.js");exports.WhatsNew=r=>{let{title:i="What's new",tooltip:a="What's new",searchPlaceholder:u="Search posts",emptyStateTitle:c="Nothing new!",emptyStateDescription:h="There are no new updates or features at the moment. Check back soon!",noResultsText:l="Sorry, no results found.",width:d="480px",onContentClick:p,renderCustomContent:w,buttonTestId:x="whats-new-button",iconWidth:m=32,iconHeight:C=32,customIcon:j}=r;const[W,N]=e.useState(!1),{whatsNewContent:g,isLoading:S,newContentCount:y}=s.useWhatsNewContext();return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(n.WhatsNewButton,{onClick:()=>N(!0),newContentCount:y,isOpen:W,isLoading:S,tooltip:a,testId:x,iconWidth:m,iconHeight:C,customIcon:j}),t.jsxRuntimeExports.jsx(o.WhatsNewPanel,{isOpen:W,onClose:()=>N(!1),content:g,isLoading:S,title:i,searchPlaceholder:u,emptyStateTitle:c,emptyStateDescription:h,noResultsText:l,width:d,onContentClick:t=>{p&&p(t)},renderCustomContent:w})]})};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare const WhatsNewIconContainer: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
+
count?: number | undefined;
|
|
3
|
+
}, never>;
|
|
4
|
+
export declare const WhatsNewWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
|
+
export declare const MainContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
+
export declare const MainCardContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
|
+
export declare const BackgroundImageContainer: import("styled-components").StyledComponent<"div", any, {
|
|
8
|
+
imageUrl: string;
|
|
9
|
+
height?: string | undefined;
|
|
10
|
+
width?: string | undefined;
|
|
11
|
+
}, never>;
|
|
@@ -0,0 +1,185 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(e);const r=n.default.div`
|
|
2
|
+
cursor: pointer;
|
|
3
|
+
position: relative;
|
|
4
|
+
|
|
5
|
+
.main-icon-class {
|
|
6
|
+
padding: 6px;
|
|
7
|
+
border-radius: 32px;
|
|
8
|
+
display: flex;
|
|
9
|
+
justify-content: center;
|
|
10
|
+
align-items: center;
|
|
11
|
+
transition: background-color 0.2s ease;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.icon-active {
|
|
15
|
+
background: ${t.COLORS.background.brandLight};
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
.main-icon-class:hover {
|
|
19
|
+
background: ${t.COLORS.background.base};
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.notification--count {
|
|
23
|
+
box-sizing: border-box;
|
|
24
|
+
position: absolute;
|
|
25
|
+
right: 6px;
|
|
26
|
+
top: 4px;
|
|
27
|
+
border-radius: 50%;
|
|
28
|
+
width: 14px;
|
|
29
|
+
height: 14px;
|
|
30
|
+
background: ${t.COLORS.background.negative.vibrant};
|
|
31
|
+
border: 1.25px solid ${t.COLORS.surface.standard};
|
|
32
|
+
display: flex;
|
|
33
|
+
justify-content: center;
|
|
34
|
+
align-items: center;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.count--text {
|
|
38
|
+
font-size: 8px;
|
|
39
|
+
line-height: 7.2px;
|
|
40
|
+
font-weight: 400;
|
|
41
|
+
color: ${t.COLORS.surface.standard};
|
|
42
|
+
}
|
|
43
|
+
`,a=n.default.div`
|
|
44
|
+
overflow-y: auto;
|
|
45
|
+
display: flex;
|
|
46
|
+
flex-direction: column;
|
|
47
|
+
height: 100%;
|
|
48
|
+
max-height: calc(100vh - 60px);
|
|
49
|
+
|
|
50
|
+
&::-webkit-scrollbar {
|
|
51
|
+
display: block;
|
|
52
|
+
width: 6px;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
::-webkit-scrollbar-thumb {
|
|
56
|
+
background: ${t.COLORS.content.inactive};
|
|
57
|
+
border-radius: 3px;
|
|
58
|
+
min-height: 30px;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.icon--wrapper {
|
|
62
|
+
display: flex;
|
|
63
|
+
justify-content: center;
|
|
64
|
+
align-items: center;
|
|
65
|
+
width: 64px;
|
|
66
|
+
height: 64px;
|
|
67
|
+
border-radius: 50%;
|
|
68
|
+
background: ${t.COLORS.background.base};
|
|
69
|
+
margin-bottom: 16px;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.no--data--found {
|
|
73
|
+
display: flex;
|
|
74
|
+
flex-direction: column;
|
|
75
|
+
justify-content: center;
|
|
76
|
+
align-items: center;
|
|
77
|
+
height: 300px;
|
|
78
|
+
text-align: center;
|
|
79
|
+
padding: 24px;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.text--align {
|
|
83
|
+
text-align: center;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.scroller {
|
|
87
|
+
display: flex;
|
|
88
|
+
flex-direction: column;
|
|
89
|
+
gap: 16px;
|
|
90
|
+
padding: 16px 0;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.full--width {
|
|
94
|
+
width: 100%;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.flex {
|
|
98
|
+
display: flex;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.flex--row {
|
|
102
|
+
flex-direction: row;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.flex--column {
|
|
106
|
+
flex-direction: column;
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
.mt-8 {
|
|
110
|
+
margin-top: 8px;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
.mt-20 {
|
|
114
|
+
margin-top: 20px;
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.mt--8 {
|
|
118
|
+
margin-top: 8px;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.mt--12 {
|
|
122
|
+
margin-top: 12px;
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
.mb-mt-8 {
|
|
126
|
+
margin-bottom: 8px;
|
|
127
|
+
margin-top: 8px;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
.padding--16 {
|
|
131
|
+
padding: 16px;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.card--desc {
|
|
135
|
+
max-height: 200px;
|
|
136
|
+
overflow-y: auto;
|
|
137
|
+
font-size: 12px;
|
|
138
|
+
color: ${t.COLORS.content.secondary};
|
|
139
|
+
|
|
140
|
+
p {
|
|
141
|
+
margin-bottom: 0px;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.created--at {
|
|
146
|
+
align-items: center;
|
|
147
|
+
gap: 4px;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
.new--content--tag {
|
|
151
|
+
padding: 2px 6px;
|
|
152
|
+
gap: 4px;
|
|
153
|
+
border-radius: 14px;
|
|
154
|
+
background: ${t.COLORS.background.warning.vibrant};
|
|
155
|
+
display: flex;
|
|
156
|
+
justify-content: center;
|
|
157
|
+
align-items: center;
|
|
158
|
+
margin-right: 8px;
|
|
159
|
+
}
|
|
160
|
+
`,o=n.default.div`
|
|
161
|
+
display: flex;
|
|
162
|
+
flex-direction: column;
|
|
163
|
+
height: 100%;
|
|
164
|
+
`,d=n.default.div`
|
|
165
|
+
background: ${t.COLORS.surface.standard};
|
|
166
|
+
border-radius: 8px;
|
|
167
|
+
border: 1px solid ${t.COLORS.stroke.primary};
|
|
168
|
+
padding: 16px;
|
|
169
|
+
display: flex;
|
|
170
|
+
flex-direction: column;
|
|
171
|
+
gap: 8px;
|
|
172
|
+
transition: all 0.2s ease;
|
|
173
|
+
|
|
174
|
+
&:hover {
|
|
175
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
|
176
|
+
}
|
|
177
|
+
`,p=n.default.div`
|
|
178
|
+
background-image: url(${e=>e.imageUrl});
|
|
179
|
+
background-size: cover;
|
|
180
|
+
background-position: center;
|
|
181
|
+
background-repeat: no-repeat;
|
|
182
|
+
height: ${e=>e.height||"200px"};
|
|
183
|
+
width: ${e=>e.width||"100%"};
|
|
184
|
+
border-radius: 4px;
|
|
185
|
+
`;exports.BackgroundImageContainer=p,exports.MainCardContainer=d,exports.MainContainer=o,exports.WhatsNewIconContainer=r,exports.WhatsNewWrapper=a;
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export interface WhatsNewContent {
|
|
3
|
+
id: string;
|
|
4
|
+
title: string;
|
|
5
|
+
body: string;
|
|
6
|
+
content: string;
|
|
7
|
+
image: string;
|
|
8
|
+
buttonText: string;
|
|
9
|
+
redirectUrl: string;
|
|
10
|
+
productVideo?: string;
|
|
11
|
+
docId?: string;
|
|
12
|
+
createdAt: any;
|
|
13
|
+
module: string[];
|
|
14
|
+
visibility: boolean;
|
|
15
|
+
}
|
|
16
|
+
export interface WhatsNewProviderProps {
|
|
17
|
+
children: React.ReactNode;
|
|
18
|
+
fetchWhatsNewContent: () => Promise<[Error | null, WhatsNewContent[] | null]>;
|
|
19
|
+
markContentAsViewed?: (contentId: string) => Promise<void>;
|
|
20
|
+
module?: string;
|
|
21
|
+
isLoading?: boolean;
|
|
22
|
+
}
|
|
23
|
+
export interface WhatsNewButtonProps {
|
|
24
|
+
onClick?: () => void;
|
|
25
|
+
newContentCount?: number;
|
|
26
|
+
isOpen?: boolean;
|
|
27
|
+
isLoading?: boolean;
|
|
28
|
+
tooltip?: string;
|
|
29
|
+
testId?: string;
|
|
30
|
+
iconWidth?: number;
|
|
31
|
+
iconHeight?: number;
|
|
32
|
+
customIcon?: React.ComponentType<{
|
|
33
|
+
width?: number;
|
|
34
|
+
height?: number;
|
|
35
|
+
color?: string;
|
|
36
|
+
}>;
|
|
37
|
+
}
|
|
38
|
+
export interface WhatsNewPanelProps {
|
|
39
|
+
isOpen: boolean;
|
|
40
|
+
onClose: () => void;
|
|
41
|
+
content: WhatsNewContent[];
|
|
42
|
+
isLoading?: boolean;
|
|
43
|
+
title?: string;
|
|
44
|
+
searchPlaceholder?: string;
|
|
45
|
+
emptyStateTitle?: string;
|
|
46
|
+
emptyStateDescription?: string;
|
|
47
|
+
noResultsText?: string;
|
|
48
|
+
width?: string;
|
|
49
|
+
onContentClick?: (content: WhatsNewContent) => void;
|
|
50
|
+
renderCustomContent?: (content: WhatsNewContent) => React.ReactNode;
|
|
51
|
+
}
|
|
52
|
+
export interface WhatsNewHookReturn {
|
|
53
|
+
whatsNewContent: WhatsNewContent[];
|
|
54
|
+
isLoading: boolean;
|
|
55
|
+
newContentCount: number;
|
|
56
|
+
markAsViewed: (contentId: string) => Promise<void>;
|
|
57
|
+
refreshContent: () => Promise<void>;
|
|
58
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../node_modules/react/jsx-runtime.js"),s=require("../../assets/icons/whatsNew.svg.js"),e=require("../../constants/Theme.js"),n=require("../tooltips/Tooltip.js"),i=require("./WhatsNew.styles.js");exports.WhatsNewButton=o=>{let{onClick:r,newContentCount:a=0,isOpen:c=!1,isLoading:x=!1,tooltip:d="What's new",testId:j="whats-new-button",iconWidth:l=32,iconHeight:u=32,customIcon:p}=o;return x?t.jsxRuntimeExports.jsxs("div",Object.assign({style:{margin:"0px 8px"}},{children:[t.jsxRuntimeExports.jsx("div",{style:{width:16,height:16,border:"2px solid #f3f3f3",borderTop:"2px solid #731DCF",borderRadius:"50%",animation:"spin 1s linear infinite"}}),t.jsxRuntimeExports.jsx("style",{children:"\n\t\t\t\t\t\t@keyframes spin {\n\t\t\t\t\t\t\t0% { transform: rotate(0deg); }\n\t\t\t\t\t\t\t100% { transform: rotate(360deg); }\n\t\t\t\t\t\t}\n\t\t\t\t\t"})]})):t.jsxRuntimeExports.jsx(i.WhatsNewIconContainer,Object.assign({count:a},{children:t.jsxRuntimeExports.jsxs("div",Object.assign({className:"main-icon-class "+(c?"icon-active":""),style:{color:c?e.COLORS.content.brand:e.COLORS.content.primary},onClick:r,"data-testid":j},{children:[t.jsxRuntimeExports.jsx(n.Tooltip,Object.assign({body:d},{children:t.jsxRuntimeExports.jsx("div",{children:p?t.jsxRuntimeExports.jsx(p,{width:l,height:u,color:c?e.COLORS.content.brand:e.COLORS.content.primary}):t.jsxRuntimeExports.jsx(s.default,{width:l,height:u})})})),a>0&&t.jsxRuntimeExports.jsx("div",Object.assign({className:"notification--count"},{children:t.jsxRuntimeExports.jsx("div",Object.assign({className:"count--text"},{children:a}))}))]}))}))};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("date-fns"),s=require("react"),r=require("../../assets/icons/searchIcon.svg.js"),n=require("../../assets/icons/whatsNew.svg.js"),i=require("../../constants/Theme.js"),a=require("../button/Button.js"),o=require("../feature-announcements/VideoModal.js"),d=require("../searchBar/searchBar.js"),c=require("../side-modal/SideModal.js"),x=require("../TypographyStyle.js"),l=require("./WhatsNew.styles.js");exports.WhatsNewPanel=u=>{let{isOpen:j,onClose:m,content:h,isLoading:p=!1,title:g="What's new on BIK",searchPlaceholder:R="Search posts",emptyStateTitle:E="Nothing new!",emptyStateDescription:w="There are no new updates or features at the moment. Check back soon!",noResultsText:b="Sorry, no results found.",width:C="480px",onContentClick:O,renderCustomContent:y}=u;const[f,N]=s.useState(""),[S,v]=s.useState(!1),[M,q]=s.useState(""),L=e=>{if(!e.createdAt)return!1;const s=e.createdAt.toDate?e.createdAt.toDate():new Date(e.createdAt);return t.differenceInBusinessDays(new Date,s)<7},T=s.useMemo((()=>{if(!f.trim())return h;const e=f.toLowerCase();return h.filter((t=>t.title.toLowerCase().includes(e)||t.body.toLowerCase().includes(e)||t.content&&t.content.toLowerCase().includes(e)))}),[h,f]),k=0===h.length,B=0===T.length;return j?e.jsxRuntimeExports.jsxs(c.SideModal,Object.assign({width:C,onClose:m,header:"",headerCustomComponent:e.jsxRuntimeExports.jsx(x.TitleMedium,Object.assign({color:i.COLORS.background.inverse},{children:g})),headerStyle:{background:i.COLORS.background.brandLight},hideFooter:!0},{children:[e.jsxRuntimeExports.jsxs(l.MainContainer,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-8"},{children:e.jsxRuntimeExports.jsx(d.SearchBar,{width:"100%",isEnabled:!k,onChange:e=>{N(e)},onEnter:e=>{N(e)},placeholder:R,variant:"default",searchValue:f,onClickCross:()=>{N("")}})})),e.jsxRuntimeExports.jsx(l.WhatsNewWrapper,{children:k||B?e.jsxRuntimeExports.jsxs("div",Object.assign({className:"no--data--found"},{children:[e.jsxRuntimeExports.jsx("div",Object.assign({className:"icon--wrapper"},{children:k?e.jsxRuntimeExports.jsx(n.default,{width:32,height:32}):e.jsxRuntimeExports.jsx(r.default,{width:32,height:32})})),k?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(x.TitleRegular,{children:E}),e.jsxRuntimeExports.jsx(x.BodyPrimary,Object.assign({color:i.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:w}))]}):B?e.jsxRuntimeExports.jsx(x.BodyPrimary,Object.assign({color:i.COLORS.content.secondary,className:"text--align",style:{maxWidth:300}},{children:b})):null]})):e.jsxRuntimeExports.jsx("div",Object.assign({className:"scroller"},{children:T.map(((s,r)=>y?y(s):e.jsxRuntimeExports.jsxs(l.MainCardContainer,Object.assign({className:"padding--16 mb-mt-8"},{children:[e.jsxRuntimeExports.jsx(l.BackgroundImageContainer,{imageUrl:s.image,height:"209px",width:"100%",style:{borderRadius:"4px"}}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt-20 full--width"},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"created--at flex flex--row"},{children:[L(s)?e.jsxRuntimeExports.jsx("div",Object.assign({className:"new--content--tag"},{children:e.jsxRuntimeExports.jsx(x.Caption,{children:"New"})})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}),e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{color:i.COLORS.content.placeholder}},{children:s.createdAt?t.format(s.createdAt.toDate?s.createdAt.toDate():new Date(s.createdAt),"dd MMMM yyyy"):""}))]}))})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"mt--8"},{children:e.jsxRuntimeExports.jsx(x.TitleSmall,{children:s.title})})),e.jsxRuntimeExports.jsx("div",{dangerouslySetInnerHTML:{__html:s.body},className:"card--desc mt--12"}),e.jsxRuntimeExports.jsx("div",Object.assign({className:"flex flex--row mt-20 full--width"},{children:e.jsxRuntimeExports.jsx(a.Button,{buttonText:s.buttonText||"Explore the feature",onClick:()=>(e=>{e.productVideo?(q(e.productVideo),v(!0)):e.redirectUrl&&window.open(e.redirectUrl,"_blank"),O&&O(e)})(s),matchParentWidth:!0,size:"medium"})}))]}),`whats-new-${r}`)))}))})]}),e.jsxRuntimeExports.jsx(o.VideoModal,{isOpen:S,videoUrl:M,onClose:()=>{v(!1)}})]})):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react"),r=require("./useWhatsNew.js");const s=t.createContext(null);exports.WhatsNewProvider=t=>{let{children:n,fetchWhatsNewContent:o,markContentAsViewed:u,module:a}=t;const i=r.useWhatsNew({fetchWhatsNewContent:o,markContentAsViewed:u,module:a});return e.jsxRuntimeExports.jsx(s.Provider,Object.assign({value:i},{children:n}))},exports.useWhatsNewContext=()=>{const e=t.useContext(s);if(!e)throw new Error("useWhatsNewContext must be used within a WhatsNewProvider");return e};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { WhatsNewContent, WhatsNewHookReturn } from './WhatsNew.types';
|
|
2
|
+
interface UseWhatsNewProps {
|
|
3
|
+
fetchWhatsNewContent: () => Promise<[Error | null, WhatsNewContent[] | null]>;
|
|
4
|
+
markContentAsViewed?: (contentId: string) => Promise<void>;
|
|
5
|
+
module?: string;
|
|
6
|
+
newContentThresholdDays?: number;
|
|
7
|
+
}
|
|
8
|
+
export declare const useWhatsNew: ({ fetchWhatsNewContent, markContentAsViewed, module, newContentThresholdDays, }: UseWhatsNewProps) => WhatsNewHookReturn;
|
|
9
|
+
export {};
|