npm - @bikdotai/bik-component-library - Versions diffs - 0.0.814 → 0.0.815 - Mend

@bikdotai/bik-component-library 0.0.814 → 0.0.815

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.

Files changed (733) hide show

package/dist/cjs/components/BikGiftedChat/GiftedChat/GiftedChat.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GiftedChat.js","sources":["../../../../../src/components/BikGiftedChat/GiftedChat/GiftedChat.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseImperativeHandle,\n\tuseMemo,\n\tuseRef,\n} from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { BodySecondary } from '../../TypographyStyle';\nimport { BubbleProps, GiftedChatAppType } from '../Bubble/types';\nimport { IMessage } from '../types';\nimport { Day } from './Day';\nimport { getMessagePlacement, shouldCenterAlign } from './messageHelpers';\nimport {\n\tuseAutoScrollOnNewMessages,\n\tuseInitialMountScroll,\n\tuseResizeObserverForFirstMessage,\n\tuseRestoreScrollPosition,\n\tuseScrollCleanup,\n\tuseScrollHandler,\n\tuseScrollToBottom,\n} from './scrollHooks';\nimport { AvatarProps, GiftedChatProps, MESSAGE_CHANNELS } from './types';\nimport { isSameDay, normalizeRef } from './utils';\nimport { Constants, TOP_THRESHOLD } from './utils';\n\nconst GiftedChatInner = (\n\tprops: Omit<GiftedChatProps<IMessage>, 'ref'>,\n\tforwardedRef: React.Ref<HTMLDivElement>,\n) => {\n\tconst {\n\t\tmessages = [],\n\t\tuser,\n\t\trenderBubble,\n\t\trenderAvatar,\n\t\trenderDay,\n\t\trenderLoading,\n\t\trenderChatEmpty,\n\t\tlistViewProps = {},\n\t\trenderAvatarOnTop = false,\n\t\tshowUserAvatar = false,\n\t\tshowAvatarForEveryMessage = false,\n\t\tinverted = false,\n\t\tmessageIdGenerator,\n\t\ttopThreshold = TOP_THRESHOLD,\n\t\tappType = GiftedChatAppType.Bik,\n\t\t...extraProps\n\t} = props \|\| {};\n\n\tconst isMobile = useWindowSize();\n\n\tconst internalScrollRef = useRef<HTMLDivElement \| null>(null);\n\tconst scrollRef = normalizeRef(\n\t\tlistViewProps.ref \|\| forwardedRef,\n\t\tinternalScrollRef,\n\t);\n\n\tconst scrollState = useRef({\n\t\tisInitialMount: true,\n\t\tisUserScrolling: false,\n\t\tisLoadingOldMessages: false,\n\t\tisAtBottom: true,\n\t\thasTriggeredEndReached: false,\n\t\tlastMessagesLength: messages?.length ?? 0,\n\t\tpreviousScrollHeight: 0,\n\t\tpreviousScrollTop: 0,\n\t\tscrollTimeout: null,\n\t});\n\n\t// Reverse messages so newest appears last in DOM (natural reading order)\n\tconst reversedMessages = useMemo(() => {\n\t\tif (!messages \|\| messages.length === 0) return [] as IMessage[];\n\t\treturn [...messages].reverse() as IMessage[];\n\t}, [messages]);\n\n\tconst scrollToBottom = useScrollToBottom(scrollRef, scrollState);\n\n\tuseImperativeHandle(forwardedRef, () => scrollRef.current!);\n\n\tuseInitialMountScroll(\n\t\tscrollRef,\n\t\tscrollState,\n\t\treversedMessages.length,\n\t\tscrollToBottom,\n\t);\n\n\tuseScrollCleanup(scrollState);\n\n\tuseRestoreScrollPosition(scrollRef, scrollState, reversedMessages.length);\n\n\tuseAutoScrollOnNewMessages(\n\t\tscrollRef,\n\t\tscrollState,\n\t\tmessages.length,\n\t\tscrollToBottom,\n\t);\n\n\tuseResizeObserverForFirstMessage(\n\t\tmessages?.[0],\n\t\tscrollState,\n\t\tscrollToBottom,\n\t\tmessageIdGenerator,\n\t);\n\n\tconst handleScroll = useScrollHandler(\n\t\tscrollState,\n\t\tlistViewProps.onEndReached,\n\t\tlistViewProps.onScroll,\n\t\ttopThreshold,\n\t);\n\n\t// Check if a message belongs to the current user\n\tconst isUserMessage = useCallback(\n\t\t(message: IMessage) => {\n\t\t\treturn Boolean(message && user && message.user?._id === user._id);\n\t\t},\n\t\t[user],\n\t);\n\n\t// Determine if avatar should be shown for this message\n\tconst shouldShowAvatar = useCallback(\n\t\t(message: IMessage, nextMessage?: IMessage) => {\n\t\t\tif (!showUserAvatar) return false;\n\t\t\tif (showAvatarForEveryMessage) return true;\n\n\t\t\t// Show avatar only when next message is from different user\n\t\t\treturn !nextMessage \|\| nextMessage.user._id !== message.user._id;\n\t\t},\n\t\t[showUserAvatar, showAvatarForEveryMessage],\n\t);\n\n\t// Render a message bubble (or call custom renderBubble)\n\tconst renderMessageBubble = useCallback(\n\t\t(message: IMessage, previousMessage?: IMessage, nextMessage?: IMessage) => {\n\t\t\tconst position = isUserMessage(message) ? 'right' : 'left';\n\n\t\t\tconst bubbleProps: BubbleProps<IMessage> = {\n\t\t\t\tcurrentMessage: message,\n\t\t\t\tpreviousMessage,\n\t\t\t\tnextMessage,\n\t\t\t\tposition,\n\t\t\t\tuser,\n\t\t\t\t...extraProps,\n\t\t\t};\n\n\t\t\t// Use custom render function if provided\n\t\t\tif (renderBubble) {\n\t\t\t\treturn renderBubble(bubbleProps);\n\t\t\t}\n\n\t\t\t// Default bubble rendering\n\t\t\treturn (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmaxWidth: appType === GiftedChatAppType.Manifest ? '50%' : '70%',\n\t\t\t\t\t\twidth: 'fit-content',\n\t\t\t\t\t\t...(appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t? { minWidth: '130px' }\n\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\tpadding: '8px 12px',\n\t\t\t\t\t\tborderRadius: appType === GiftedChatAppType.Manifest ? 16 : 4,\n\t\t\t\t\t\tborder:\n\t\t\t\t\t\t\tposition === 'left' && appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t? '1px solid rgb(224, 224, 224)'\n\t\t\t\t\t\t\t\t: 'none',\n\t\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\t\tposition === 'right'\n\t\t\t\t\t\t\t\t? appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t? COLORS.background.brandTint\n\t\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t\t: appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t? COLORS.background.pureWhite\n\t\t\t\t\t\t\t\t: COLORS.background.inactive,\n\t\t\t\t\t\tcolor: COLORS.content.primary,\n\t\t\t\t\t\twordBreak: 'break-word',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodySecondary>{message.text}</BodySecondary>\n\t\t\t\t</div>\n\t\t\t);\n\t\t},\n\t\t[isUserMessage, user, renderBubble, extraProps],\n\t);\n\n\t// Render a message avatar (or call custom renderAvatar)\n\tconst renderMessageAvatar = useCallback(\n\t\t(message: IMessage, previousMessage?: IMessage, nextMessage?: IMessage) => {\n\t\t\tconst shouldShow = shouldShowAvatar(message, nextMessage);\n\n\t\t\tif (!shouldShow) return null;\n\n\t\t\tconst position = isUserMessage(message) ? 'right' : 'left';\n\n\t\t\tconst avatarProps: AvatarProps<IMessage> = {\n\t\t\t\tcurrentMessage: message,\n\t\t\t\tpreviousMessage,\n\t\t\t\tnextMessage,\n\t\t\t\tposition,\n\t\t\t\tuser,\n\t\t\t\trenderAvatarOnTop,\n\t\t\t\tshowUserAvatar,\n\t\t\t\tshowAvatarForEveryMessage,\n\t\t\t};\n\n\t\t\treturn renderAvatar ? renderAvatar(avatarProps) : null;\n\t\t},\n\t\t[\n\t\t\tshouldShowAvatar,\n\t\t\tisUserMessage,\n\t\t\tuser,\n\t\t\trenderAvatarOnTop,\n\t\t\tshowUserAvatar,\n\t\t\tshowAvatarForEveryMessage,\n\t\t\trenderAvatar,\n\t\t],\n\t);\n\n\t// Render: Empty State\n\tif (!messages \|\| messages.length === 0) {\n\t\treturn renderChatEmpty ? <>{renderChatEmpty()}</> : null;\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={scrollRef as React.RefObject<HTMLDivElement>}\n\t\t\tstyle={{\n\t\t\t\tflex: 1,\n\t\t\t\toverflowY: 'auto',\n\t\t\t\toverflowX: 'hidden',\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tflexDirection: 'column',\n\t\t\t\t...listViewProps.style,\n\t\t\t}}\n\t\t\tonScroll={handleScroll}\n\t\t>\n\t\t\t{/* Spacer to push messages to bottom (newest appears last in DOM) /}\n\t\t\t<div style={{ flex: '1 0 auto' }} />\n\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tflex: '0 0 auto',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{reversedMessages.map((message, index) => {\n\t\t\t\t\tconst position = isUserMessage(message) ? 'right' : 'left';\n\t\t\t\t\tconst previousMessage = reversedMessages[index - 1];\n\t\t\t\t\tconst nextMessage = reversedMessages[index + 1];\n\t\t\t\t\tconst shouldShowDay = !isSameDay(message, previousMessage);\n\t\t\t\t\tconst placement = getMessagePlacement(message, position);\n\t\t\t\t\tconst isCentered = shouldCenterAlign(message);\n\t\t\t\t\tconst isSmtp =\n\t\t\t\t\t\tmessage?.['channelId'] === MESSAGE_CHANNELS.SMTP \|\|\n\t\t\t\t\t\tmessage?.['channelName'] === MESSAGE_CHANNELS.SMTP;\n\t\t\t\t\t// Check if message is a private note\n\t\t\t\t\tconst isPrivateNote =\n\t\t\t\t\t\tmessage['category'] === Constants.ChatActivity.Category.ACTIVITY &&\n\t\t\t\t\t\tmessage['activityType'] ===\n\t\t\t\t\t\t\tConstants.ChatActivity.Type.PRIVATE_NOTE;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<React.Fragment\n\t\t\t\t\t\t\tkey={message._id ?? `${index}-${messageIdGenerator?.() ?? 'id'}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{/ Day separator /}\n\t\t\t\t\t\t\t{shouldShowDay &&\n\t\t\t\t\t\t\t\t(renderDay ? (\n\t\t\t\t\t\t\t\t\trenderDay({ createdAt: message.createdAt })\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<Day createdAt={message.createdAt} appType={appType} />\n\t\t\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t\t{/ Message container /}\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t...(isMobile ? { margin: '0 4px' } : {}),\n\t\t\t\t\t\t\t\t\t...(isCentered ? {} : { display: 'flex' }),\n\t\t\t\t\t\t\t\t\t...(appType !== GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t\t? !isMobile && message?.user?._id === 2\n\t\t\t\t\t\t\t\t\t\t\t? { marginLeft: 8 }\n\t\t\t\t\t\t\t\t\t\t\t: { marginRight: 8 }\n\t\t\t\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\t\t\t\t...(isSmtp && !isPrivateNote && isMobile\n\t\t\t\t\t\t\t\t\t\t? { marginLeft: 8, marginRight: 8 }\n\t\t\t\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\t\t\t\tjustifyContent: placement,\n\t\t\t\t\t\t\t\t\tmarginBottom: 8,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{/ Left avatar (for mobile, avatar is hidden) /}\n\t\t\t\t\t\t\t\t{!isMobile && position === 'left' && (\n\t\t\t\t\t\t\t\t\t<div style={{ margin: '0 8px' }}>\n\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(message, previousMessage, nextMessage)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t{/ Message bubble /}\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tid={`message-bubble-${\n\t\t\t\t\t\t\t\t\t\tmessage._id ?? `${index}-${messageIdGenerator?.() ?? 'id'}`\n\t\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\tappType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t\t\t? { width: '100%' }\n\t\t\t\t\t\t\t\t\t\t\t: isMobile && isSmtp\n\t\t\t\t\t\t\t\t\t\t\t? { display: 'flex', flexGrow: 1 }\n\t\t\t\t\t\t\t\t\t\t\t: {}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{renderMessageBubble(message, previousMessage, nextMessage)}\n\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t{/ Right avatar (for mobile, avatar is hidden) */}\n\t\t\t\t\t\t\t\t{!isMobile && position === 'right' && (\n\t\t\t\t\t\t\t\t\t<div style={{ margin: '0 8px' }}>\n\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(message, previousMessage, nextMessage)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</React.Fragment>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default forwardRef<HTMLDivElement, GiftedChatProps<IMessage>>(\n\tGiftedChatInner,\n);\n"],"names":["GiftedChatInner","props","forwardedRef","messages","user","renderBubble","renderAvatar","renderDay","renderLoading","renderChatEmpty","listViewProps","renderAvatarOnTop","showUserAvatar","showAvatarForEveryMessage","inverted","messageIdGenerator","topThreshold","TOP_THRESHOLD","appType","GiftedChatAppType","extraProps","isMobile","useWindowSize","internalScrollRef","useRef","scrollRef","normalizeRef","scrollState","reversedMessages","useMemo","scrollToBottom","useScrollToBottom","useImperativeHandle","useInitialMountScroll","useScrollCleanup","useRestoreScrollPosition","useAutoScrollOnNewMessages","useResizeObserverForFirstMessage","handleScroll","useScrollHandler","isUserMessage","useCallback","message","shouldShowAvatar","nextMessage","renderMessageBubble","previousMessage","position","bubbleProps","jsx","COLORS","BodySecondary","renderMessageAvatar","Fragment","jsxs","index","shouldShowDay","isSameDay","placement","getMessagePlacement","isCentered","shouldCenterAlign","isSmtp","MESSAGE_CHANNELS","isPrivateNote","Constants","React","Day","GiftedChat","forwardRef"],"mappings":"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"}
1	+ {"version":3,"file":"GiftedChat.js","sources":["../../../../../src/components/BikGiftedChat/GiftedChat/GiftedChat.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseImperativeHandle,\n\tuseMemo,\n\tuseRef,\n} from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { BodySecondary } from '../../TypographyStyle';\nimport { BubbleProps, GiftedChatAppType } from '../Bubble/types';\nimport { IMessage } from '../types';\nimport { Day } from './Day';\nimport { getMessagePlacement, shouldCenterAlign } from './messageHelpers';\nimport {\n\tuseAutoScrollOnNewMessages,\n\tuseInitialMountScroll,\n\tuseResizeObserverForFirstMessage,\n\tuseRestoreScrollPosition,\n\tuseScrollCleanup,\n\tuseScrollHandler,\n\tuseScrollToBottom,\n} from './scrollHooks';\nimport { AvatarProps, GiftedChatProps, MESSAGE_CHANNELS } from './types';\nimport { isSameDay, normalizeRef } from './utils';\nimport { Constants, TOP_THRESHOLD } from './utils';\n\nconst GiftedChatInner = (\n\tprops: Omit<GiftedChatProps<IMessage>, 'ref'>,\n\tforwardedRef: React.Ref<HTMLDivElement>,\n) => {\n\tconst {\n\t\tmessages = [],\n\t\tuser,\n\t\trenderBubble,\n\t\trenderAvatar,\n\t\trenderDay,\n\t\trenderLoading,\n\t\trenderChatEmpty,\n\t\tlistViewProps = {},\n\t\trenderAvatarOnTop = false,\n\t\tshowUserAvatar = false,\n\t\tshowAvatarForEveryMessage = false,\n\t\tinverted = false,\n\t\tmessageIdGenerator,\n\t\ttopThreshold = TOP_THRESHOLD,\n\t\tappType = GiftedChatAppType.Bik,\n\t\t...extraProps\n\t} = props \|\| {};\n\n\tconst isMobile = useWindowSize();\n\n\tconst internalScrollRef = useRef<HTMLDivElement \| null>(null);\n\tconst scrollRef = normalizeRef(\n\t\tlistViewProps.ref \|\| forwardedRef,\n\t\tinternalScrollRef,\n\t);\n\n\tconst scrollState = useRef({\n\t\tisInitialMount: true,\n\t\tisUserScrolling: false,\n\t\tisLoadingOldMessages: false,\n\t\tisAtBottom: true,\n\t\thasTriggeredEndReached: false,\n\t\tlastMessagesLength: messages?.length ?? 0,\n\t\tpreviousScrollHeight: 0,\n\t\tpreviousScrollTop: 0,\n\t\tscrollTimeout: null,\n\t});\n\n\t// Reverse messages so newest appears last in DOM (natural reading order)\n\tconst reversedMessages = useMemo(() => {\n\t\tif (!messages \|\| messages.length === 0) return [] as IMessage[];\n\t\treturn [...messages].reverse() as IMessage[];\n\t}, [messages]);\n\n\tconst scrollToBottom = useScrollToBottom(scrollRef, scrollState);\n\n\tuseImperativeHandle(forwardedRef, () => scrollRef.current!);\n\n\tuseInitialMountScroll(\n\t\tscrollRef,\n\t\tscrollState,\n\t\treversedMessages.length,\n\t\tscrollToBottom,\n\t);\n\n\tuseScrollCleanup(scrollState);\n\n\tuseRestoreScrollPosition(scrollRef, scrollState, reversedMessages.length);\n\n\tuseAutoScrollOnNewMessages(\n\t\tscrollRef,\n\t\tscrollState,\n\t\tmessages.length,\n\t\tscrollToBottom,\n\t);\n\n\tuseResizeObserverForFirstMessage(\n\t\tmessages?.[0],\n\t\tscrollState,\n\t\tscrollToBottom,\n\t\tmessageIdGenerator,\n\t);\n\n\tconst handleScroll = useScrollHandler(\n\t\tscrollState,\n\t\tlistViewProps.onEndReached,\n\t\tlistViewProps.onScroll,\n\t\ttopThreshold,\n\t);\n\n\t// Check if a message belongs to the current user\n\tconst isUserMessage = useCallback(\n\t\t(message: IMessage) => {\n\t\t\treturn Boolean(message && user && message.user?._id === user._id);\n\t\t},\n\t\t[user],\n\t);\n\n\t// Determine if avatar should be shown for this message\n\tconst shouldShowAvatar = useCallback(\n\t\t(message: IMessage, nextMessage?: IMessage) => {\n\t\t\tif (!showUserAvatar) return false;\n\t\t\tif (showAvatarForEveryMessage) return true;\n\n\t\t\t// Show avatar only when next message is from different user\n\t\t\treturn !nextMessage \|\| nextMessage.user._id !== message.user._id;\n\t\t},\n\t\t[showUserAvatar, showAvatarForEveryMessage],\n\t);\n\n\t// Render a message bubble (or call custom renderBubble)\n\tconst renderMessageBubble = useCallback(\n\t\t(message: IMessage, previousMessage?: IMessage, nextMessage?: IMessage) => {\n\t\t\tconst position = isUserMessage(message) ? 'right' : 'left';\n\n\t\t\tconst bubbleProps: BubbleProps<IMessage> = {\n\t\t\t\tcurrentMessage: message,\n\t\t\t\tpreviousMessage,\n\t\t\t\tnextMessage,\n\t\t\t\tposition,\n\t\t\t\tuser,\n\t\t\t\t...extraProps,\n\t\t\t};\n\n\t\t\t// Use custom render function if provided\n\t\t\tif (renderBubble) {\n\t\t\t\treturn renderBubble(bubbleProps);\n\t\t\t}\n\n\t\t\t// Default bubble rendering\n\t\t\treturn (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmaxWidth: appType === GiftedChatAppType.Manifest ? '50%' : '70%',\n\t\t\t\t\t\twidth: 'fit-content',\n\t\t\t\t\t\t...(appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t? { minWidth: '130px' }\n\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\tpadding: '8px 12px',\n\t\t\t\t\t\tborderRadius: appType === GiftedChatAppType.Manifest ? 16 : 4,\n\t\t\t\t\t\tborder:\n\t\t\t\t\t\t\tposition === 'left' && appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t? '1px solid rgb(224, 224, 224)'\n\t\t\t\t\t\t\t\t: 'none',\n\t\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\t\tposition === 'right'\n\t\t\t\t\t\t\t\t? appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t? COLORS.background.brandTint\n\t\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t\t: appType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t? COLORS.background.pureWhite\n\t\t\t\t\t\t\t\t: COLORS.background.inactive,\n\t\t\t\t\t\tcolor: COLORS.content.primary,\n\t\t\t\t\t\twordBreak: 'break-word',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodySecondary>{message.text}</BodySecondary>\n\t\t\t\t</div>\n\t\t\t);\n\t\t},\n\t\t[isUserMessage, user, renderBubble, extraProps],\n\t);\n\n\t// Render a message avatar (or call custom renderAvatar)\n\tconst renderMessageAvatar = useCallback(\n\t\t(message: IMessage, previousMessage?: IMessage, nextMessage?: IMessage) => {\n\t\t\tconst shouldShow = shouldShowAvatar(message, nextMessage);\n\n\t\t\tif (!shouldShow) return null;\n\n\t\t\tconst position = isUserMessage(message) ? 'right' : 'left';\n\n\t\t\tconst avatarProps: AvatarProps<IMessage> = {\n\t\t\t\tcurrentMessage: message,\n\t\t\t\tpreviousMessage,\n\t\t\t\tnextMessage,\n\t\t\t\tposition,\n\t\t\t\tuser,\n\t\t\t\trenderAvatarOnTop,\n\t\t\t\tshowUserAvatar,\n\t\t\t\tshowAvatarForEveryMessage,\n\t\t\t};\n\n\t\t\treturn renderAvatar ? renderAvatar(avatarProps) : null;\n\t\t},\n\t\t[\n\t\t\tshouldShowAvatar,\n\t\t\tisUserMessage,\n\t\t\tuser,\n\t\t\trenderAvatarOnTop,\n\t\t\tshowUserAvatar,\n\t\t\tshowAvatarForEveryMessage,\n\t\t\trenderAvatar,\n\t\t],\n\t);\n\n\t// Render: Empty State\n\tif (!messages \|\| messages.length === 0) {\n\t\treturn renderChatEmpty ? <>{renderChatEmpty()}</> : null;\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={scrollRef as React.RefObject<HTMLDivElement>}\n\t\t\tstyle={{\n\t\t\t\tflex: 1,\n\t\t\t\toverflowY: 'auto',\n\t\t\t\toverflowX: 'hidden',\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tflexDirection: 'column',\n\t\t\t\t...listViewProps.style,\n\t\t\t}}\n\t\t\tonScroll={handleScroll}\n\t\t>\n\t\t\t{/* Spacer to push messages to bottom (newest appears last in DOM) /}\n\t\t\t<div style={{ flex: '1 0 auto' }} />\n\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tflex: '0 0 auto',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{reversedMessages.map((message, index) => {\n\t\t\t\t\tconst position = isUserMessage(message) ? 'right' : 'left';\n\t\t\t\t\tconst previousMessage = reversedMessages[index - 1];\n\t\t\t\t\tconst nextMessage = reversedMessages[index + 1];\n\t\t\t\t\tconst shouldShowDay = !isSameDay(message, previousMessage);\n\t\t\t\t\tconst placement = getMessagePlacement(message, position);\n\t\t\t\t\tconst isCentered = shouldCenterAlign(message);\n\t\t\t\t\tconst isSmtp =\n\t\t\t\t\t\tmessage?.['channelId'] === MESSAGE_CHANNELS.SMTP \|\|\n\t\t\t\t\t\tmessage?.['channelName'] === MESSAGE_CHANNELS.SMTP;\n\t\t\t\t\t// Check if message is a private note\n\t\t\t\t\tconst isPrivateNote =\n\t\t\t\t\t\tmessage['category'] === Constants.ChatActivity.Category.ACTIVITY &&\n\t\t\t\t\t\tmessage['activityType'] ===\n\t\t\t\t\t\t\tConstants.ChatActivity.Type.PRIVATE_NOTE;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<React.Fragment\n\t\t\t\t\t\t\tkey={message._id ?? `${index}-${messageIdGenerator?.() ?? 'id'}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{/ Day separator /}\n\t\t\t\t\t\t\t{shouldShowDay &&\n\t\t\t\t\t\t\t\t(renderDay ? (\n\t\t\t\t\t\t\t\t\trenderDay({ createdAt: message.createdAt })\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<Day createdAt={message.createdAt} appType={appType} />\n\t\t\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t\t{/ Message container /}\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t...(isMobile ? { margin: '0 4px' } : {}),\n\t\t\t\t\t\t\t\t\t...(isCentered ? {} : { display: 'flex' }),\n\t\t\t\t\t\t\t\t\t...(appType !== GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t\t? !isMobile && message?.user?._id === 2\n\t\t\t\t\t\t\t\t\t\t\t? { marginLeft: 8 }\n\t\t\t\t\t\t\t\t\t\t\t: { marginRight: 8 }\n\t\t\t\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\t\t\t\t...(isSmtp && !isPrivateNote && isMobile\n\t\t\t\t\t\t\t\t\t\t? { marginLeft: 8, marginRight: 8 }\n\t\t\t\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\t\t\t\tjustifyContent: placement,\n\t\t\t\t\t\t\t\t\tmarginBottom: 8,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{/ Left avatar (for mobile, avatar is hidden) /}\n\t\t\t\t\t\t\t\t{!isMobile && position === 'left' && (\n\t\t\t\t\t\t\t\t\t<div style={{ margin: '0 8px' }}>\n\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(message, previousMessage, nextMessage)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t{/ Message bubble /}\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tid={`message-bubble-${\n\t\t\t\t\t\t\t\t\t\tmessage._id ?? `${index}-${messageIdGenerator?.() ?? 'id'}`\n\t\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\tappType === GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t\t\t? { width: '100%' }\n\t\t\t\t\t\t\t\t\t\t\t: isMobile && isSmtp\n\t\t\t\t\t\t\t\t\t\t\t? { display: 'flex', flexGrow: 1 }\n\t\t\t\t\t\t\t\t\t\t\t: {}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{renderMessageBubble(message, previousMessage, nextMessage)}\n\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t{/ Right avatar (for mobile, avatar is hidden) */}\n\t\t\t\t\t\t\t\t{!isMobile && position === 'right' && (\n\t\t\t\t\t\t\t\t\t<div style={{ margin: '0 8px' }}>\n\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(message, previousMessage, nextMessage)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</React.Fragment>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default forwardRef<HTMLDivElement, GiftedChatProps<IMessage>>(\n\tGiftedChatInner,\n);\n"],"names":["GiftedChatInner","props","forwardedRef","messages","user","renderBubble","renderAvatar","renderDay","renderLoading","renderChatEmpty","listViewProps","renderAvatarOnTop","showUserAvatar","showAvatarForEveryMessage","inverted","messageIdGenerator","topThreshold","TOP_THRESHOLD","appType","GiftedChatAppType","extraProps","isMobile","useWindowSize","internalScrollRef","useRef","scrollRef","normalizeRef","scrollState","reversedMessages","useMemo","scrollToBottom","useScrollToBottom","useImperativeHandle","useInitialMountScroll","useScrollCleanup","useRestoreScrollPosition","useAutoScrollOnNewMessages","useResizeObserverForFirstMessage","handleScroll","useScrollHandler","isUserMessage","useCallback","message","shouldShowAvatar","nextMessage","renderMessageBubble","previousMessage","position","bubbleProps","jsx","COLORS","BodySecondary","renderMessageAvatar","Fragment","jsxs","index","shouldShowDay","isSameDay","placement","getMessagePlacement","isCentered","shouldCenterAlign","isSmtp","MESSAGE_CHANNELS","isPrivateNote","Constants","React","Day","GiftedChat","forwardRef"],"mappings":"ogBA2BMA,EAAkB,CACvBC,EACAC,IACI,CACJ,KAAM,CACL,SAAAC,EAAW,CAAA,EACX,KAAAC,EACA,aAAAC,EACA,aAAAC,EACA,UAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,cAAAC,EAAgB,CAAA,EAChB,kBAAAC,EAAoB,GACpB,eAAAC,EAAiB,GACjB,0BAAAC,EAA4B,GAC5B,SAAAC,EAAW,GACX,mBAAAC,EACA,aAAAC,EAAeC,EAAAA,cACf,QAAAC,EAAUC,EAAAA,kBAAkB,IAC5B,GAAGC,CAAA,EACAnB,GAAS,CAAA,EAEPoB,EAAWC,EAAAA,cAAA,EAEXC,EAAoBC,EAAAA,OAA8B,IAAI,EACtDC,EAAYC,EAAAA,aACjBhB,EAAc,KAAOR,EACrBqB,CAAA,EAGKI,EAAcH,EAAAA,OAAO,CAC1B,eAAgB,GAChB,gBAAiB,GACjB,qBAAsB,GACtB,WAAY,GACZ,uBAAwB,GACxB,mBAAoBrB,GAAU,QAAU,EACxC,qBAAsB,EACtB,kBAAmB,EACnB,cAAe,IAAA,CACf,EAGKyB,EAAmBC,EAAAA,QAAQ,IAC5B,CAAC1B,GAAYA,EAAS,SAAW,EAAU,CAAA,EACxC,CAAC,GAAGA,CAAQ,EAAE,QAAA,EACnB,CAACA,CAAQ,CAAC,EAEP2B,EAAiBC,EAAAA,kBAAkBN,EAAWE,CAAW,EAE/DK,EAAAA,oBAAoB9B,EAAc,IAAMuB,EAAU,OAAQ,EAE1DQ,EAAAA,sBACCR,EACAE,EACAC,EAAiB,OACjBE,CAAA,EAGDI,EAAAA,iBAAiBP,CAAW,EAE5BQ,EAAAA,yBAAyBV,EAAWE,EAAaC,EAAiB,MAAM,EAExEQ,EAAAA,2BACCX,EACAE,EACAxB,EAAS,OACT2B,CAAA,EAGDO,EAAAA,iCACClC,IAAW,CAAC,EACZwB,EACAG,EACAf,CAAA,EAGD,MAAMuB,EAAeC,EAAAA,iBACpBZ,EACAjB,EAAc,aACdA,EAAc,SACdM,CAAA,EAIKwB,EAAgBC,EAAAA,YACpBC,GACO,GAAQA,GAAWtC,GAAQsC,EAAQ,MAAM,MAAQtC,EAAK,KAE9D,CAACA,CAAI,CAAA,EAIAuC,EAAmBF,EAAAA,YACxB,CAACC,EAAmBE,IACdhC,EACDC,EAAkC,GAG/B,CAAC+B,GAAeA,EAAY,KAAK,MAAQF,EAAQ,KAAK,IAJjC,GAM7B,CAAC9B,EAAgBC,CAAyB,CAAA,EAIrCgC,EAAsBJ,EAAAA,YAC3B,CAACC,EAAmBI,EAA4BF,IAA2B,CAC1E,MAAMG,EAAWP,EAAcE,CAAO,EAAI,QAAU,OAE9CM,EAAqC,CAC1C,eAAgBN,EAChB,gBAAAI,EACA,YAAAF,EACA,SAAAG,EACA,KAAA3C,EACA,GAAGgB,CAAA,EAIJ,OAAIf,EACIA,EAAa2C,CAAW,EAK/BC,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,SAAU/B,IAAYC,EAAAA,kBAAkB,SAAW,MAAQ,MAC3D,MAAO,cACP,GAAID,IAAYC,EAAAA,kBAAkB,SAC/B,CAAE,SAAU,OAAA,EACZ,CAAA,EACH,QAAS,WACT,aAAcD,IAAYC,EAAAA,kBAAkB,SAAW,GAAK,EAC5D,OACC4B,IAAa,QAAU7B,IAAYC,EAAAA,kBAAkB,SAClD,+BACA,OACJ,gBACC4B,IAAa,QACV7B,IAAYC,EAAAA,kBAAkB,SAC7B+B,EAAAA,OAAO,WAAW,UAClBA,EAAAA,OAAO,WAAW,WACnBhC,IAAYC,EAAAA,kBAAkB,SAC9B+B,EAAAA,OAAO,WAAW,UAClBA,SAAO,WAAW,SACtB,MAAOA,EAAAA,OAAO,QAAQ,QACtB,UAAW,YAAA,EAGZ,SAAAD,EAAAA,IAACE,EAAAA,cAAA,CAAe,SAAAT,EAAQ,IAAA,CAAK,CAAA,CAAA,CAGhC,EACA,CAACF,EAAepC,EAAMC,EAAce,CAAU,CAAA,EAIzCgC,EAAsBX,EAAAA,YAC3B,CAACC,EAAmBI,EAA4BF,IAA2B,CAG1E,GAAI,CAFeD,EAAiBD,EAASE,CAAW,EAEvC,OAAO,KAExB,MAAMG,EAAWP,EAAcE,CAAO,EAAI,QAAU,OAapD,OAAOpC,EAAeA,EAXqB,CAC1C,eAAgBoC,EAChB,gBAAAI,EACA,YAAAF,EACA,SAAAG,EACA,KAAA3C,EACA,kBAAAO,EACA,eAAAC,EACA,0BAAAC,CAAA,CAG6C,EAAI,IACnD,EACA,CACC8B,EACAH,EACApC,EACAO,EACAC,EACAC,EACAP,CAAA,CACD,EAID,MAAI,CAACH,GAAYA,EAAS,SAAW,EAC7BM,EAAkBwC,EAAAA,IAAAI,EAAAA,SAAA,CAAG,SAAA5C,EAAA,CAAgB,CAAE,EAAM,KAIpD6C,EAAAA,KAAC,MAAA,CACA,IAAK7B,EACL,MAAO,CACN,KAAM,EACN,UAAW,OACX,UAAW,SACX,QAAS,OACT,cAAe,SACf,GAAGf,EAAc,KAAA,EAElB,SAAU4B,EAGV,SAAA,CAAAW,EAAAA,IAAC,MAAA,CAAI,MAAO,CAAE,KAAM,YAAc,EAElCA,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,SACf,KAAM,UAAA,EAGN,SAAArB,EAAiB,IAAI,CAACc,EAASa,IAAU,CACzC,MAAMR,EAAWP,EAAcE,CAAO,EAAI,QAAU,OAC9CI,EAAkBlB,EAAiB2B,EAAQ,CAAC,EAC5CX,EAAchB,EAAiB2B,EAAQ,CAAC,EACxCC,EAAgB,CAACC,YAAUf,EAASI,CAAe,EACnDY,EAAYC,EAAAA,oBAAoBjB,EAASK,CAAQ,EACjDa,EAAaC,EAAAA,kBAAkBnB,CAAO,EACtCoB,EACLpB,GAAU,YAAiBqB,EAAAA,iBAAiB,MAC5CrB,GAAU,cAAmBqB,EAAAA,iBAAiB,KAEzCC,EACLtB,EAAQ,WAAgBuB,EAAAA,UAAU,aAAa,SAAS,UACxDvB,EAAQ,eACPuB,EAAAA,UAAU,aAAa,KAAK,aAC9B,OACCX,EAAAA,KAACY,EAAAA,QAAM,SAAN,CAIC,SAAA,CAAAV,IACCjD,EACAA,EAAU,CAAE,UAAWmC,EAAQ,SAAA,CAAW,EAE1CO,EAAAA,IAACkB,EAAAA,IAAA,CAAI,UAAWzB,EAAQ,UAAW,QAAAxB,CAAA,CAAkB,GAIvDoC,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,GAAIjC,EAAW,CAAE,OAAQ,OAAA,EAAY,CAAA,EACrC,GAAIuC,EAAa,CAAA,EAAK,CAAE,QAAS,MAAA,EACjC,GAAI1C,IAAYC,EAAAA,kBAAkB,SAC/B,CAACE,GAAYqB,GAAS,MAAM,MAAQ,EACnC,CAAE,WAAY,CAAA,EACd,CAAE,YAAa,CAAA,EAChB,CAAA,EACH,GAAIoB,GAAU,CAACE,GAAiB3C,EAC7B,CAAE,WAAY,EAAG,YAAa,CAAA,EAC9B,CAAA,EACH,eAAgBqC,EAChB,aAAc,CAAA,EAId,SAAA,CAAA,CAACrC,GAAY0B,IAAa,QAC1BE,EAAAA,IAAC,OAAI,MAAO,CAAE,OAAQ,OAAA,EACpB,SAAAG,EAAoBV,EAASI,EAAiBF,CAAW,EAC3D,EAIDK,EAAAA,IAAC,MAAA,CACA,GAAI,kBACHP,EAAQ,KAAO,GAAGa,CAAK,IAAIxC,IAAA,GAA0B,IAAI,EAC1D,GACA,MACCG,IAAYC,EAAAA,kBAAkB,SAC3B,CAAE,MAAO,MAAA,EACTE,GAAYyC,EACZ,CAAE,QAAS,OAAQ,SAAU,CAAA,EAC7B,CAAA,EAGH,SAAAjB,EAAoBH,EAASI,EAAiBF,CAAW,CAAA,CAAA,EAI1D,CAACvB,GAAY0B,IAAa,eACzB,MAAA,CAAI,MAAO,CAAE,OAAQ,SACpB,SAAAK,EAAoBV,EAASI,EAAiBF,CAAW,CAAA,CAC3D,CAAA,CAAA,CAAA,CAEF,CAAA,EAxDKF,EAAQ,KAAO,GAAGa,CAAK,IAAIxC,IAAA,GAA0B,IAAI,EAAA,CA2DjE,CAAC,CAAA,CAAA,CACF,CAAA,CAAA,CAGH,EAEAqD,EAAeC,EAAAA,WACdrE,CACD"}

package/dist/cjs/components/ProgressChecklist/ProgressChecklist.style.js CHANGED Viewed

@@ -1,25 +1,25 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),t=require("../../constants/Theme.js"),r=i.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),i=require("../../constants/Theme.js"),r=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=r(o),n=t.default.div`
 	border-radius: ${e=>e.noBorder?"0":"8px"};
 	border: ${e=>e.noBorder?"none":"1px solid #e0e0e0"};
 	padding: ${e=>e.noBorder?"0":"24px"};
 	display: flex;
 	flex-direction: column;
 	gap: 10px;
-	background: ${t.COLORS.surface.standard};
+	background: ${i.COLORS.surface.standard};
 	.accordion__overview {
 		padding: 16px !important;
 		border-bottom: none;
 	}
-`,o=i.div`
+`,l=t.default.div`
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
-`,n=i.div`
+`,a=t.default.div`
 	display: flex;
 	flex-direction: row;
 	gap: 12px;
-`;i.div`
+`;t.default.div`
 	display: flex;
 	flex-direction: column;
 	gap: 16px;
@@ -35,100 +35,100 @@
 	}
 	&::-webkit-scrollbar-thumb {
-		background: ${t.COLORS.stroke.primary};
+		background: ${i.COLORS.stroke.primary};
 		border-radius: 3px;
 	}
-`;i.div`
+`;t.default.div`
 	display: flex;
 	align-items: flex-start;
 	gap: 12px;
 	padding: 12px;
-	background: ${e=>e.completed?"#F0F7F4":t.COLORS.surface.standard};
+	background: ${e=>e.completed?"#F0F7F4":i.COLORS.surface.standard};
 	border: 1px solid
-		${e=>e.completed?"#D4E9E3":t.COLORS.stroke.primary};
+		${e=>e.completed?"#D4E9E3":i.COLORS.stroke.primary};
 	border-radius: 6px;
 	cursor: pointer;
 	transition: all 0.2s ease;
 	&:hover {
-		background: ${e=>e.completed?"#E8F4F0":t.COLORS.background.base};
+		background: ${e=>e.completed?"#E8F4F0":i.COLORS.background.base};
 	}
-`;i.input`
+`;t.default.input`
 	width: 18px;
 	height: 18px;
 	margin-top: 2px;
 	cursor: pointer;
 	flex-shrink: 0;
-`;i.div`
+`;t.default.div`
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 	flex: 1;
-`;i.p`
+`;t.default.p`
 	margin: 0;
 	font-size: 14px;
 	font-weight: 500;
 	line-height: 20px;
-	color: ${e=>e.completed?t.COLORS.content.secondary:t.COLORS.content.primary};
+	color: ${e=>e.completed?i.COLORS.content.secondary:i.COLORS.content.primary};
 	text-decoration: ${e=>e.completed?"line-through":"none"};
-`;i.p`
+`;t.default.p`
 	margin: 0;
 	font-size: 12px;
 	font-weight: 400;
 	line-height: 16px;
-	color: ${t.COLORS.content.secondary};
+	color: ${i.COLORS.content.secondary};
 	opacity: ${e=>e.completed?.6:1};
-`;const l=i.div`
+`;const d=t.default.div`
 	border-radius: 8px;
 	border: 1px solid
-		${e=>e.isActive?t.COLORS.stroke.primary:"#E0E0E0"};
+		${e=>e.isActive?i.COLORS.stroke.primary:"#E0E0E0"};
 	padding: 16px;
 	display: flex;
 	flex-direction: column;
 	gap: 12px;
-	background: ${t.COLORS.surface.standard};
+	background: ${i.COLORS.surface.standard};
 	transition: all 0.2s ease;
 	&:hover {
-		border-color: ${e=>e.isActive?t.COLORS.stroke.primary:"#D0D0D0"};
+		border-color: ${e=>e.isActive?i.COLORS.stroke.primary:"#D0D0D0"};
 	}
-`,c=i.div`
+`,c=t.default.div`
 	display: flex;
 	align-items: center;
 	gap: 16px;
 	width: 100%;
-`,a=i.div`
+`,s=t.default.div`
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	flex-shrink: 0;
-`,s=i.div`
+`,p=t.default.div`
 	display: flex;
 	flex-direction: column;
 	gap: 4px;
 	flex: 1;
-`,d=i.div`
+`,g=t.default.div`
 	font-size: 16px;
 	font-weight: 600;
 	line-height: 24px;
-	color: ${e=>e.completed?t.COLORS.background.positive.vibrant:e.isActive?t.COLORS.content.primary:t.COLORS.content.placeholder} !important;
+	color: ${e=>e.completed?i.COLORS.background.positive.vibrant:e.isActive?i.COLORS.content.primary:i.COLORS.content.placeholder} !important;
 	margin: 0;
 	display: flex;
 	flex-direction: row;
 	gap: 12px;
-`,p=i.div`
+`,f=t.default.div`
 	font-size: 14px;
 	font-weight: 400;
 	line-height: 20px;
-	color: ${e=>e.isActive?t.COLORS.content.secondary:t.COLORS.content.placeholder};
+	color: ${e=>e.isActive?i.COLORS.content.secondary:i.COLORS.content.placeholder};
 	margin: 0;
-`,g=i.div`
+`,x=t.default.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
 	flex-shrink: 0;
-`,x=i.div`
+`,u=t.default.div`
 	width: 100%;
 	margin-top: 8px;
-`;exports.HeaderSection=o;exports.ProgressBarSection=n;exports.ProgressChecklistContainer=r;exports.SingleChecklistActionWrapper=g;exports.SingleChecklistAlertRow=x;exports.SingleChecklistContent=s;exports.SingleChecklistHeader=d;exports.SingleChecklistIconWrapper=a;exports.SingleChecklistItem=l;exports.SingleChecklistMainRow=c;exports.SingleChecklistSubheader=p;
+`;exports.HeaderSection=l;exports.ProgressBarSection=a;exports.ProgressChecklistContainer=n;exports.SingleChecklistActionWrapper=x;exports.SingleChecklistAlertRow=u;exports.SingleChecklistContent=p;exports.SingleChecklistHeader=g;exports.SingleChecklistIconWrapper=s;exports.SingleChecklistItem=d;exports.SingleChecklistMainRow=c;exports.SingleChecklistSubheader=f;
 //# sourceMappingURL=ProgressChecklist.style.js.map

package/dist/cjs/components/ProgressChecklist/ProgressChecklist.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProgressChecklist.style.js","sources":["../../../../src/components/ProgressChecklist/ProgressChecklist.style.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const ProgressChecklistContainer = styled.div<{ noBorder?: boolean }>`\n\tborder-radius: ${(props) => (props.noBorder ? '0' : '8px')};\n\tborder: ${(props) => (props.noBorder ? 'none' : '1px solid #e0e0e0')};\n\tpadding: ${(props) => (props.noBorder ? '0' : '24px')};\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 10px;\n\tbackground: ${COLORS.surface.standard};\n\n\t.accordion__overview {\n\t\tpadding: 16px !important;\n\t\tborder-bottom: none;\n\t}\n`;\n\nexport const HeaderSection = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nexport const ProgressBarSection = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n`;\n\nexport const ChecklistItemsSection = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 16px;\n\toverflow-y: auto;\n\tflex: 1;\n\n\t&::-webkit-scrollbar {\n\t\twidth: 6px;\n\t}\n\n\t&::-webkit-scrollbar-track {\n\t\tbackground: transparent;\n\t}\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: ${COLORS.stroke.primary};\n\t\tborder-radius: 3px;\n\t}\n`;\n\nexport const ChecklistItem = styled.div<{ completed?: boolean }>`\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 12px;\n\tpadding: 12px;\n\tbackground: ${(props) =>\n\t\tprops.completed ? '#F0F7F4' : COLORS.surface.standard};\n\tborder: 1px solid\n\t\t${(props) => (props.completed ? '#D4E9E3' : COLORS.stroke.primary)};\n\tborder-radius: 6px;\n\tcursor: pointer;\n\ttransition: all 0.2s ease;\n\n\t&:hover {\n\t\tbackground: ${(props) =>\n\t\t\tprops.completed ? '#E8F4F0' : COLORS.background.base};\n\t}\n`;\n\nexport const ChecklistCheckbox = styled.input`\n\twidth: 18px;\n\theight: 18px;\n\tmargin-top: 2px;\n\tcursor: pointer;\n\tflex-shrink: 0;\n`;\n\nexport const ChecklistItemContent = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tflex: 1;\n`;\n\nexport const ChecklistItemText = styled.p<{ completed?: boolean }>`\n\tmargin: 0;\n\tfont-size: 14px;\n\tfont-weight: 500;\n\tline-height: 20px;\n\tcolor: ${(props) =>\n\t\tprops.completed ? COLORS.content.secondary : COLORS.content.primary};\n\ttext-decoration: ${(props) => (props.completed ? 'line-through' : 'none')};\n`;\n\nexport const ChecklistItemDescription = styled.p<{ completed?: boolean }>`\n\tmargin: 0;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tline-height: 16px;\n\tcolor: ${COLORS.content.secondary};\n\topacity: ${(props) => (props.completed ? 0.6 : 1)};\n`;\n\n// Single Checklist Styles\nexport const SingleChecklistItem = styled.div<{ isActive: boolean }>`\n\tborder-radius: 8px;\n\tborder: 1px solid\n\t\t${(props) => (props.isActive ? COLORS.stroke.primary : '#E0E0E0')};\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 12px;\n\tbackground: ${COLORS.surface.standard};\n\ttransition: all 0.2s ease;\n\n\t&:hover {\n\t\tborder-color: ${(props) =>\n\t\t\tprops.isActive ? COLORS.stroke.primary : '#D0D0D0'};\n\t}\n`;\n\nexport const SingleChecklistMainRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 16px;\n\twidth: 100%;\n`;\n\nexport const SingleChecklistIconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n`;\n\nexport const SingleChecklistContent = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tflex: 1;\n`;\n\nexport const SingleChecklistHeader = styled.div<{\n\tcompleted?: boolean;\n\tisActive?: boolean;\n}>`\n\tfont-size: 16px;\n\tfont-weight: 600;\n\tline-height: 24px;\n\tcolor: ${(props) =>\n\t\tprops.completed\n\t\t\t? COLORS.background.positive.vibrant\n\t\t\t: props.isActive\n\t\t\t? COLORS.content.primary\n\t\t\t: COLORS.content.placeholder} !important;\n\tmargin: 0;\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n`;\n\nexport const SingleChecklistSubheader = styled.div<{ isActive?: boolean }>`\n\tfont-size: 14px;\n\tfont-weight: 400;\n\tline-height: 20px;\n\tcolor: ${(props) =>\n\t\tprops.isActive ? COLORS.content.secondary : COLORS.content.placeholder};\n\tmargin: 0;\n`;\n\nexport const SingleChecklistActionWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex-shrink: 0;\n`;\n\nexport const SingleChecklistAlertRow = styled.div`\n\twidth: 100%;\n\tmargin-top: 8px;\n`;\n"],"names":["ProgressChecklistContainer","styled","props","COLORS","HeaderSection","ProgressBarSection","SingleChecklistItem","SingleChecklistMainRow","SingleChecklistIconWrapper","SingleChecklistContent","SingleChecklistHeader","SingleChecklistSubheader","SingleChecklistActionWrapper","SingleChecklistAlertRow"],"mappings":"~~2JAGaA~~,EAA6BC,~~EAAO~~;AAAA,kBAC9BC,GAAWA,EAAM,SAAW,IAAM,KAAM;AAAA,WAC/CA,GAAWA,EAAM,SAAW,OAAS,mBAAoB;AAAA,YACxDA,GAAWA,EAAM,SAAW,IAAM,MAAO;AAAA;AAAA;AAAA;AAAA,eAIvCC,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQzBC,EAAgBH,~~EAAO~~;AAAA;AAAA;AAAA;AAAA,EAMvBI,EAAqBJ,~~EAAO~~;AAAA;AAAA;AAAA;AAAA,EAMJA,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAgB5BE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA,EAKRF,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,eAKpBC,GACdA,EAAM,UAAY,UAAYC,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA,IAElDD,GAAWA,EAAM,UAAY,UAAYC,EAAAA,OAAO,OAAO,OAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAMnDD,GACdA,EAAM,UAAY,UAAYC,EAAAA,OAAO,WAAW,IAAI;AAAA;AAAA,EAItBF,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQJA,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,EAOVA,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,UAK7BC,GACTA,EAAM,UAAYC,EAAAA,OAAO,QAAQ,UAAYA,EAAAA,OAAO,QAAQ,OAAO;AAAA,oBAChDD,GAAWA,EAAM,UAAY,eAAiB,MAAO;AAAA,EAGlCD,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,UAKrCE,EAAAA,OAAO,QAAQ,SAAS;AAAA,YACrBD,GAAWA,EAAM,UAAY,GAAM,CAAE;AAAA,EAI3C,MAAMI,EAAsBL,~~EAAO~~;AAAA;AAAA;AAAA,IAGrCC,GAAWA,EAAM,SAAWC,EAAAA,OAAO,OAAO,QAAU,SAAU;AAAA;AAAA;AAAA;AAAA;AAAA,eAKpDA,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA,kBAInBD,GAChBA,EAAM,SAAWC,EAAAA,OAAO,OAAO,QAAU,SAAS;AAAA;AAAA,EAIxCI,EAAyBN,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,EAOhCO,EAA6BP,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,EAOpCQ,EAAyBR,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,EAOhCS,EAAwBT,~~EAAO~~;AAAA;AAAA;AAAA;AAAA,UAOjCC,GACTA,EAAM,UACHC,EAAAA,OAAO,WAAW,SAAS,QAC3BD,EAAM,SACNC,EAAAA,OAAO,QAAQ,QACfA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,EAOlBQ,EAA2BV,~~EAAO~~;AAAA;AAAA;AAAA;AAAA,UAIpCC,GACTA,EAAM,SAAWC,EAAAA,OAAO,QAAQ,UAAYA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA,EAI3DS,EAA+BX,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,EAOtCY,EAA0BZ,~~EAAO~~;AAAA;AAAA;AAAA"}
1	+ {"version":3,"file":"ProgressChecklist.style.js","sources":["../../../../src/components/ProgressChecklist/ProgressChecklist.style.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const ProgressChecklistContainer = styled.div<{ noBorder?: boolean }>`\n\tborder-radius: ${(props) => (props.noBorder ? '0' : '8px')};\n\tborder: ${(props) => (props.noBorder ? 'none' : '1px solid #e0e0e0')};\n\tpadding: ${(props) => (props.noBorder ? '0' : '24px')};\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 10px;\n\tbackground: ${COLORS.surface.standard};\n\n\t.accordion__overview {\n\t\tpadding: 16px !important;\n\t\tborder-bottom: none;\n\t}\n`;\n\nexport const HeaderSection = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nexport const ProgressBarSection = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n`;\n\nexport const ChecklistItemsSection = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 16px;\n\toverflow-y: auto;\n\tflex: 1;\n\n\t&::-webkit-scrollbar {\n\t\twidth: 6px;\n\t}\n\n\t&::-webkit-scrollbar-track {\n\t\tbackground: transparent;\n\t}\n\n\t&::-webkit-scrollbar-thumb {\n\t\tbackground: ${COLORS.stroke.primary};\n\t\tborder-radius: 3px;\n\t}\n`;\n\nexport const ChecklistItem = styled.div<{ completed?: boolean }>`\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: 12px;\n\tpadding: 12px;\n\tbackground: ${(props) =>\n\t\tprops.completed ? '#F0F7F4' : COLORS.surface.standard};\n\tborder: 1px solid\n\t\t${(props) => (props.completed ? '#D4E9E3' : COLORS.stroke.primary)};\n\tborder-radius: 6px;\n\tcursor: pointer;\n\ttransition: all 0.2s ease;\n\n\t&:hover {\n\t\tbackground: ${(props) =>\n\t\t\tprops.completed ? '#E8F4F0' : COLORS.background.base};\n\t}\n`;\n\nexport const ChecklistCheckbox = styled.input`\n\twidth: 18px;\n\theight: 18px;\n\tmargin-top: 2px;\n\tcursor: pointer;\n\tflex-shrink: 0;\n`;\n\nexport const ChecklistItemContent = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tflex: 1;\n`;\n\nexport const ChecklistItemText = styled.p<{ completed?: boolean }>`\n\tmargin: 0;\n\tfont-size: 14px;\n\tfont-weight: 500;\n\tline-height: 20px;\n\tcolor: ${(props) =>\n\t\tprops.completed ? COLORS.content.secondary : COLORS.content.primary};\n\ttext-decoration: ${(props) => (props.completed ? 'line-through' : 'none')};\n`;\n\nexport const ChecklistItemDescription = styled.p<{ completed?: boolean }>`\n\tmargin: 0;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\tline-height: 16px;\n\tcolor: ${COLORS.content.secondary};\n\topacity: ${(props) => (props.completed ? 0.6 : 1)};\n`;\n\n// Single Checklist Styles\nexport const SingleChecklistItem = styled.div<{ isActive: boolean }>`\n\tborder-radius: 8px;\n\tborder: 1px solid\n\t\t${(props) => (props.isActive ? COLORS.stroke.primary : '#E0E0E0')};\n\tpadding: 16px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 12px;\n\tbackground: ${COLORS.surface.standard};\n\ttransition: all 0.2s ease;\n\n\t&:hover {\n\t\tborder-color: ${(props) =>\n\t\t\tprops.isActive ? COLORS.stroke.primary : '#D0D0D0'};\n\t}\n`;\n\nexport const SingleChecklistMainRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 16px;\n\twidth: 100%;\n`;\n\nexport const SingleChecklistIconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n`;\n\nexport const SingleChecklistContent = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tflex: 1;\n`;\n\nexport const SingleChecklistHeader = styled.div<{\n\tcompleted?: boolean;\n\tisActive?: boolean;\n}>`\n\tfont-size: 16px;\n\tfont-weight: 600;\n\tline-height: 24px;\n\tcolor: ${(props) =>\n\t\tprops.completed\n\t\t\t? COLORS.background.positive.vibrant\n\t\t\t: props.isActive\n\t\t\t? COLORS.content.primary\n\t\t\t: COLORS.content.placeholder} !important;\n\tmargin: 0;\n\tdisplay: flex;\n\tflex-direction: row;\n\tgap: 12px;\n`;\n\nexport const SingleChecklistSubheader = styled.div<{ isActive?: boolean }>`\n\tfont-size: 14px;\n\tfont-weight: 400;\n\tline-height: 20px;\n\tcolor: ${(props) =>\n\t\tprops.isActive ? COLORS.content.secondary : COLORS.content.placeholder};\n\tmargin: 0;\n`;\n\nexport const SingleChecklistActionWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex-shrink: 0;\n`;\n\nexport const SingleChecklistAlertRow = styled.div`\n\twidth: 100%;\n\tmargin-top: 8px;\n`;\n"],"names":["ProgressChecklistContainer","styled","props","COLORS","HeaderSection","ProgressBarSection","SingleChecklistItem","SingleChecklistMainRow","SingleChecklistIconWrapper","SingleChecklistContent","SingleChecklistHeader","SingleChecklistSubheader","SingleChecklistActionWrapper","SingleChecklistAlertRow"],"mappings":"0NAGaA,EAA6BC,EAAAA,QAAO;AAAA,kBAC9BC,GAAWA,EAAM,SAAW,IAAM,KAAM;AAAA,WAC/CA,GAAWA,EAAM,SAAW,OAAS,mBAAoB;AAAA,YACxDA,GAAWA,EAAM,SAAW,IAAM,MAAO;AAAA;AAAA;AAAA;AAAA,eAIvCC,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQzBC,EAAgBH,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMvBI,EAAqBJ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMJA,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAgB5BE,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA,EAKRF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKpBC,GACdA,EAAM,UAAY,UAAYC,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA,IAElDD,GAAWA,EAAM,UAAY,UAAYC,EAAAA,OAAO,OAAO,OAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAMnDD,GACdA,EAAM,UAAY,UAAYC,EAAAA,OAAO,WAAW,IAAI;AAAA;AAAA,EAItBF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQJA,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOVA,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,UAK7BC,GACTA,EAAM,UAAYC,EAAAA,OAAO,QAAQ,UAAYA,EAAAA,OAAO,QAAQ,OAAO;AAAA,oBAChDD,GAAWA,EAAM,UAAY,eAAiB,MAAO;AAAA,EAGlCD,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,UAKrCE,EAAAA,OAAO,QAAQ,SAAS;AAAA,YACrBD,GAAWA,EAAM,UAAY,GAAM,CAAE;AAAA,EAI3C,MAAMI,EAAsBL,EAAAA,QAAO;AAAA;AAAA;AAAA,IAGrCC,GAAWA,EAAM,SAAWC,EAAAA,OAAO,OAAO,QAAU,SAAU;AAAA;AAAA;AAAA;AAAA;AAAA,eAKpDA,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA,kBAInBD,GAChBA,EAAM,SAAWC,EAAAA,OAAO,OAAO,QAAU,SAAS;AAAA;AAAA,EAIxCI,EAAyBN,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOhCO,EAA6BP,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOpCQ,EAAyBR,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOhCS,EAAwBT,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,UAOjCC,GACTA,EAAM,UACHC,EAAAA,OAAO,WAAW,SAAS,QAC3BD,EAAM,SACNC,EAAAA,OAAO,QAAQ,QACfA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,EAOlBQ,EAA2BV,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,UAIpCC,GACTA,EAAM,SAAWC,EAAAA,OAAO,QAAQ,UAAYA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA,EAI3DS,EAA+BX,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOtCY,EAA0BZ,EAAAA,QAAO;AAAA;AAAA;AAAA"}

package/dist/cjs/components/ProgressChecklist/ProgressStepper.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),o=require("react"),u=require("../../constants/Theme.js"),h=require("../../assets/icons/SmallCheckIcon.js"),m=require("../button/Button.js"),f=require("../../assets/icons/Redirect2Icon.js"),g=({steps:d=[],onStepClick:s,isStepperActive:l})=>{const n=d.length>0?d:[{id:"step-1",text:"Step One"},{id:"step-2",text:"Step Two"},{id:"step-3",text:"Step Three"}],[a,c]=o.useState(n[0]?.id??null);return i.jsx("div",{style:{paddingLeft:52},children:i.jsx("div",{style:{margin:0,padding:0,display:"flex",flexDirection:"column",gap:12},children:n.map((e,t)=>i.jsxs(o.Fragment,{children:[i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[(()=>{const r=(t===0||n[t-1]?.isCompleted)&&l===!0;return e.isCompleted===!0?i.jsx("div",{style:{width:24,height:24,flex:"0 0 24px"},"aria-hidden":!0,children:i.jsx(h.SmallCheckIcon,{})}):i.jsx("div",{style:{width:24,height:24,borderRadius:30,padding:4,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box",background:r?"#4B1583":"transparent",color:r?"#FFFFFF":"#BDBDBD",border:`1px solid ${r?"#4B1583":"#E0E0E0"}`,fontSize:12,lineHeight:"12px",flex:"0 0 24px"},"aria-hidden":!0,children:i.jsx("span",{style:{fontSize:12,fontWeight:500},children:t+1})})})(),i.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"flex-start",minWidth:0},"aria-label":`Open ${e.label??e.text??`step ${t+1}`}`,children:i.jsx(m.Button,{buttonText:e.label??e.text??`Step ${t+1}`,buttonType:"text",buttonTextColor:e.isCompleted?u.COLORS.text.secondary:(t===0||n[t-1]?.isCompleted===!0)&&l?"#4B1583":u.COLORS.content.inactive,matchParentWidth:!1,size:"small",style:{width:"fit-content",paddingLeft:0,textDecoration:"none",textDecorationLine:"none"},onClick:()=>{c(e.id??a),(!e.isCompleted&&l&&(t===0||n[t-1]?.isCompleted===!0)||e.isCompleted)&&(e.onClick?e.onClick():e.id&&s?.(e.id))}})}),!e.isCompleted&&(t===0||n[t-1]?.isCompleted===!0)&&l&&i.jsx("div",{style:{width:20,height:20,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},"aria-hidden":!0,onClick:r=>{c(e.id??a),!e.isCompleted&&l&&(t===0||n[t-1]?.isCompleted===!0)&&(e.onClick?e.onClick():e.id&&s?.(e.id))},children:i.jsx(f.Redirect2Icon,{})})]}),t!==n.length-1&&i.jsx("div",{"aria-hidden":!0,style:{width:8,height:1,borderRadius:2,background:"#BDBDBD",transform:"rotate(90deg)",marginLeft:8}})]},e.id??`step-${t}`))})})},x=o.memo(g);exports.default=x;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),u=require("react"),c=require("../../constants/Theme.js"),h=require("../../assets/icons/SmallCheckIcon.js"),m=require("../button/Button.js"),g=require("../../assets/icons/Redirect2Icon.js"),C=n=>n&&typeof n=="object"&&"default"in n?n:{default:n},f=C(u),x=({steps:n=[],onStepClick:d,isStepperActive:o})=>{const l=n.length>0?n:[{id:"step-1",text:"Step One"},{id:"step-2",text:"Step Two"},{id:"step-3",text:"Step Three"}],[s,a]=u.useState(l[0]?.id??null);return i.jsx("div",{style:{paddingLeft:52},children:i.jsx("div",{style:{margin:0,padding:0,display:"flex",flexDirection:"column",gap:12},children:l.map((e,t)=>i.jsxs(f.default.Fragment,{children:[i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[(()=>{const r=(t===0||l[t-1]?.isCompleted)&&o===!0;return e.isCompleted===!0?i.jsx("div",{style:{width:24,height:24,flex:"0 0 24px"},"aria-hidden":!0,children:i.jsx(h.SmallCheckIcon,{})}):i.jsx("div",{style:{width:24,height:24,borderRadius:30,padding:4,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box",background:r?"#4B1583":"transparent",color:r?"#FFFFFF":"#BDBDBD",border:`1px solid ${r?"#4B1583":"#E0E0E0"}`,fontSize:12,lineHeight:"12px",flex:"0 0 24px"},"aria-hidden":!0,children:i.jsx("span",{style:{fontSize:12,fontWeight:500},children:t+1})})})(),i.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"flex-start",minWidth:0},"aria-label":`Open ${e.label??e.text??`step ${t+1}`}`,children:i.jsx(m.Button,{buttonText:e.label??e.text??`Step ${t+1}`,buttonType:"text",buttonTextColor:e.isCompleted?c.COLORS.text.secondary:(t===0||l[t-1]?.isCompleted===!0)&&o?"#4B1583":c.COLORS.content.inactive,matchParentWidth:!1,size:"small",style:{width:"fit-content",paddingLeft:0,textDecoration:"none",textDecorationLine:"none"},onClick:()=>{a(e.id??s),(!e.isCompleted&&o&&(t===0||l[t-1]?.isCompleted===!0)||e.isCompleted)&&(e.onClick?e.onClick():e.id&&d?.(e.id))}})}),!e.isCompleted&&(t===0||l[t-1]?.isCompleted===!0)&&o&&i.jsx("div",{style:{width:20,height:20,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},"aria-hidden":!0,onClick:r=>{a(e.id??s),!e.isCompleted&&o&&(t===0||l[t-1]?.isCompleted===!0)&&(e.onClick?e.onClick():e.id&&d?.(e.id))},children:i.jsx(g.Redirect2Icon,{})})]}),t!==l.length-1&&i.jsx("div",{"aria-hidden":!0,style:{width:8,height:1,borderRadius:2,background:"#BDBDBD",transform:"rotate(90deg)",marginLeft:8}})]},e.id??`step-${t}`))})})},y=f.default.memo(x);exports.default=y;
 //# sourceMappingURL=ProgressStepper.js.map

package/dist/cjs/components/ProgressChecklist/ProgressStepper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProgressStepper.js","sources":["../../../../src/components/ProgressChecklist/ProgressStepper.tsx"],"sourcesContent":["import { Redirect2Icon, SmallCheckIcon } from '@src/assets/icons';\nimport React, { useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { Button } from '../button';\n\ninterface StepItem {\n\tid?: string;\n\t// New step shape used across the onboarding checklist\n\t// `text` is the primary content shown on the small button.\n\ttext: string;\n\tlabel?: string; // kept for backward-compatibility\n\tonClick?: () => void;\n\tisCompleted?: boolean;\n}\n\ninterface ProgressStepperProps {\n\tsteps?: StepItem[];\n\tonStepClick?: (id: string) => void;\n\tisStepperActive?: boolean;\n}\n\n// Render a lightweight stepper list. Each item has: left-number-icon (placeholder), a small content button, and the provided right icon.\nconst ProgressStepper: React.FC<ProgressStepperProps> = ({\n\tsteps = [],\n\tonStepClick,\n\tisStepperActive,\n}) => {\n\tconst items =\n\t\tsteps.length > 0\n\t\t\t? steps\n\t\t\t: [\n\t\t\t\t\t{ id: 'step-1', text: 'Step One' },\n\t\t\t\t\t{ id: 'step-2', text: 'Step Two' },\n\t\t\t\t\t{ id: 'step-3', text: 'Step Three' },\n\t\t\t ];\n\n\t// Track locally selected/active step so we can render the active state for the number icon\n\tconst [selectedId, setSelectedId] = useState<string \| null>(\n\t\titems[0]?.id ?? null,\n\t);\n\n\treturn (\n\t\t<div style={{ paddingLeft: 52 }}>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tmargin: 0,\n\t\t\t\t\tpadding: 0,\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tgap: 12,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{items.map((step, idx) => (\n\t\t\t\t\t<React.Fragment key={step.id ?? `step-${idx}`}>\n\t\t\t\t\t\t<div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n\t\t\t\t\t\t\t{/* Left: number icon /}\n\t\t\t\t\t\t\t{(() => {\n\t\t\t\t\t\t\t\t// Step is active if it's the first step OR if the previous step is completed\n\t\t\t\t\t\t\t\tconst isActive =\n\t\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted) &&\n\t\t\t\t\t\t\t\t\tisStepperActive === true;\n\t\t\t\t\t\t\t\tconst isCompleted = step.isCompleted === true;\n\n\t\t\t\t\t\t\t\t// If completed, show checkmark icon\n\t\t\t\t\t\t\t\tif (isCompleted) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\twidth: 24,\n\t\t\t\t\t\t\t\t\t\t\t\theight: 24,\n\t\t\t\t\t\t\t\t\t\t\t\tflex: '0 0 24px',\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<SmallCheckIcon />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t// Otherwise show numbered circle\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\twidth: 24,\n\t\t\t\t\t\t\t\t\t\t\theight: 24,\n\t\t\t\t\t\t\t\t\t\t\tborderRadius: 30,\n\t\t\t\t\t\t\t\t\t\t\tpadding: 4,\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\t\t\t\tboxSizing: 'border-box',\n\t\t\t\t\t\t\t\t\t\t\tbackground: isActive ? '#4B1583' : 'transparent',\n\t\t\t\t\t\t\t\t\t\t\tcolor: isActive ? '#FFFFFF' : '#BDBDBD',\n\t\t\t\t\t\t\t\t\t\t\tborder: `1px solid ${isActive ? '#4B1583' : '#E0E0E0'}`,\n\t\t\t\t\t\t\t\t\t\t\tfontSize: 12,\n\t\t\t\t\t\t\t\t\t\t\tlineHeight: '12px',\n\t\t\t\t\t\t\t\t\t\t\tflex: '0 0 24px',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span style={{ fontSize: 12, fontWeight: 500 }}>\n\t\t\t\t\t\t\t\t\t\t\t{idx + 1}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})()}\n\n\t\t\t\t\t\t\t{/ Center: small content button (do not grow) /}\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'flex-start',\n\t\t\t\t\t\t\t\t\tminWidth: 0,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\taria-label={`Open ${\n\t\t\t\t\t\t\t\t\tstep.label ?? step.text ?? `step ${idx + 1}`\n\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tbuttonText={step.label ?? step.text ?? `Step ${idx + 1}`}\n\t\t\t\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\t\t\t\tbuttonTextColor={\n\t\t\t\t\t\t\t\t\t\tstep.isCompleted\n\t\t\t\t\t\t\t\t\t\t\t? COLORS.text.secondary\n\t\t\t\t\t\t\t\t\t\t\t: (idx === 0 \|\| items[idx - 1]?.isCompleted === true) &&\n\t\t\t\t\t\t\t\t\t\t\t isStepperActive\n\t\t\t\t\t\t\t\t\t\t\t? '#4B1583'\n\t\t\t\t\t\t\t\t\t\t\t: COLORS.content.inactive\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tmatchParentWidth={false}\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\twidth: 'fit-content',\n\t\t\t\t\t\t\t\t\t\tpaddingLeft: 0,\n\t\t\t\t\t\t\t\t\t\ttextDecoration: 'none',\n\t\t\t\t\t\t\t\t\t\ttextDecorationLine: 'none',\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetSelectedId(step.id ?? selectedId);\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t(!step.isCompleted &&\n\t\t\t\t\t\t\t\t\t\t\t\tisStepperActive &&\n\t\t\t\t\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted === true)) \|\|\n\t\t\t\t\t\t\t\t\t\t\tstep.isCompleted\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tif (step.onClick) step.onClick();\n\t\t\t\t\t\t\t\t\t\t\telse if (step.id) onStepClick?.(step.id);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t{/ Rightmost icon (provided SVG) */}\n\t\t\t\t\t\t\t{!step.isCompleted &&\n\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted === true) &&\n\t\t\t\t\t\t\t\tisStepperActive && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\twidth: 20,\n\t\t\t\t\t\t\t\t\t\t\theight: 20,\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tsetSelectedId(step.id ?? selectedId);\n\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\t!step.isCompleted &&\n\t\t\t\t\t\t\t\t\t\t\t\tisStepperActive &&\n\t\t\t\t\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted === true)\n\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\tif (step.onClick) step.onClick();\n\t\t\t\t\t\t\t\t\t\t\t\telse if (step.id) onStepClick?.(step.id);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Redirect2Icon />\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{idx !== items.length - 1 && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\twidth: 8,\n\t\t\t\t\t\t\t\t\theight: 1,\n\t\t\t\t\t\t\t\t\tborderRadius: 2,\n\t\t\t\t\t\t\t\t\tbackground: '#BDBDBD',\n\t\t\t\t\t\t\t\t\ttransform: 'rotate(90deg)',\n\t\t\t\t\t\t\t\t\tmarginLeft: 8,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</React.Fragment>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default React.memo(ProgressStepper);\n"],"names":["ProgressStepper","steps","onStepClick","isStepperActive","items","selectedId","setSelectedId","useState","jsx","step","idx","jsxs","React","isActive","SmallCheckIcon","Button","COLORS","e","Redirect2Icon"],"mappings":"~~8UAsBMA~~,EAAkD,CAAC,CACxD,MAAAC,EAAQ,CAAA,EACR,YAAAC,EACA,gBAAAC,CACD,IAAM,CACL,MAAMC,EACLH,EAAM,OAAS,EACZA,EACA,CACA,CAAE,GAAI,SAAU,KAAM,UAAA,EACtB,CAAE,GAAI,SAAU,KAAM,UAAA,EACtB,CAAE,GAAI,SAAU,KAAM,YAAA,CAAa,EAIjC,CAACI,EAAYC,CAAa,EAAIC,EAAAA,SACnCH,EAAM,CAAC,GAAG,IAAM,IAAA,EAGjB,aACE,MAAA,CAAI,MAAO,CAAE,YAAa,IAC1B,SAAAI,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,OAAQ,EACR,QAAS,EACT,QAAS,OACT,cAAe,SACf,IAAK,EAAA,EAGL,SAAAJ,EAAM,IAAI,CAACK,EAAMC,IACjBC,EAAAA,KAACC,~~EAAM~~,SAAN,CACA,SAAA,CAAAD,EAAAA,KAAC,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,WAAY,SAAU,IAAK,CAAA,EAEvD,SAAA,EAAA,IAAM,CAEP,MAAME,GACJH,IAAQ,GAAKN,EAAMM,EAAM,CAAC,GAAG,cAC9BP,IAAoB,GAIrB,OAHoBM,EAAK,cAAgB,GAKvCD,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,MAAO,GACP,OAAQ,GACR,KAAM,UAAA,EAEP,cAAW,GAEX,eAACM,EAAAA,eAAA,CAAA,CAAe,CAAA,CAAA,EAOlBN,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,MAAO,GACP,OAAQ,GACR,aAAc,GACd,QAAS,EACT,QAAS,OACT,WAAY,SACZ,eAAgB,SAChB,UAAW,aACX,WAAYK,EAAW,UAAY,cACnC,MAAOA,EAAW,UAAY,UAC9B,OAAQ,aAAaA,EAAW,UAAY,SAAS,GACrD,SAAU,GACV,WAAY,OACZ,KAAM,UAAA,EAEP,cAAW,GAEX,SAAAL,EAAAA,IAAC,OAAA,CAAK,MAAO,CAAE,SAAU,GAAI,WAAY,GAAA,EACvC,SAAAE,EAAM,CAAA,CACR,CAAA,CAAA,CAGH,GAAA,EAGAF,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,WAAY,SACZ,eAAgB,aAChB,SAAU,CAAA,EAEX,aAAY,QACXC,EAAK,OAASA,EAAK,MAAQ,QAAQC,EAAM,CAAC,EAC3C,GAEA,SAAAF,EAAAA,IAACO,EAAAA,OAAA,CACA,WAAYN,EAAK,OAASA,EAAK,MAAQ,QAAQC,EAAM,CAAC,GACtD,WAAW,OACX,gBACCD,EAAK,YACFO,EAAAA,OAAO,KAAK,WACXN,IAAQ,GAAKN,EAAMM,EAAM,CAAC,GAAG,cAAgB,KAC9CP,EACA,UACAa,EAAAA,OAAO,QAAQ,SAEnB,iBAAkB,GAClB,KAAK,QACL,MAAO,CACN,MAAO,cACP,YAAa,EACb,eAAgB,OAChB,mBAAoB,MAAA,EAErB,QAAS,IAAM,CACdV,EAAcG,EAAK,IAAMJ,CAAU,GAEjC,CAACI,EAAK,aACNN,IACCO,IAAQ,GAAKN,EAAMM,EAAM,CAAC,GAAG,cAAgB,KAC/CD,EAAK,eAEDA,EAAK,QAASA,EAAK,QAAA,EACdA,EAAK,IAAIP,IAAcO,EAAK,EAAE,EAEzC,CAAA,CAAA,CACD,CAAA,EAIA,CAACA,EAAK,cACLC,IAAQ,GAAKN,EAAMM,EAAM,CAAC,GAAG,cAAgB,KAC9CP,GACCK,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,MAAO,GACP,OAAQ,GACR,QAAS,OACT,WAAY,SACZ,eAAgB,SAChB,OAAQ,SAAA,EAET,cAAW,GACX,QAAUS,GAAM,CACfX,EAAcG,EAAK,IAAMJ,CAAU,EAElC,CAACI,EAAK,aACNN,IACCO,IAAQ,GAAKN,EAAMM,EAAM,CAAC,GAAG,cAAgB,MAE1CD,EAAK,QAASA,EAAK,QAAA,EACdA,EAAK,IAAIP,IAAcO,EAAK,EAAE,EAEzC,EAEA,eAACS,EAAAA,cAAA,CAAA,CAAc,CAAA,CAAA,CAChB,EAEH,EACCR,IAAQN,EAAM,OAAS,GACvBI,EAAAA,IAAC,MAAA,CACA,cAAW,GACX,MAAO,CACN,MAAO,EACP,OAAQ,EACR,aAAc,EACd,WAAY,UACZ,UAAW,gBACX,WAAY,CAAA,CACb,CAAA,CACD,CAAA,EA7ImBC,EAAK,IAAM,QAAQC,CAAG,EA+I3C,CACA,CAAA,CAAA,EAEH,CAEF,EAEAV,EAAeY,~~EAAM~~,KAAKZ,CAAe"}
1	+ {"version":3,"file":"ProgressStepper.js","sources":["../../../../src/components/ProgressChecklist/ProgressStepper.tsx"],"sourcesContent":["import { Redirect2Icon, SmallCheckIcon } from '@src/assets/icons';\nimport React, { useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { Button } from '../button';\n\ninterface StepItem {\n\tid?: string;\n\t// New step shape used across the onboarding checklist\n\t// `text` is the primary content shown on the small button.\n\ttext: string;\n\tlabel?: string; // kept for backward-compatibility\n\tonClick?: () => void;\n\tisCompleted?: boolean;\n}\n\ninterface ProgressStepperProps {\n\tsteps?: StepItem[];\n\tonStepClick?: (id: string) => void;\n\tisStepperActive?: boolean;\n}\n\n// Render a lightweight stepper list. Each item has: left-number-icon (placeholder), a small content button, and the provided right icon.\nconst ProgressStepper: React.FC<ProgressStepperProps> = ({\n\tsteps = [],\n\tonStepClick,\n\tisStepperActive,\n}) => {\n\tconst items =\n\t\tsteps.length > 0\n\t\t\t? steps\n\t\t\t: [\n\t\t\t\t\t{ id: 'step-1', text: 'Step One' },\n\t\t\t\t\t{ id: 'step-2', text: 'Step Two' },\n\t\t\t\t\t{ id: 'step-3', text: 'Step Three' },\n\t\t\t ];\n\n\t// Track locally selected/active step so we can render the active state for the number icon\n\tconst [selectedId, setSelectedId] = useState<string \| null>(\n\t\titems[0]?.id ?? null,\n\t);\n\n\treturn (\n\t\t<div style={{ paddingLeft: 52 }}>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tmargin: 0,\n\t\t\t\t\tpadding: 0,\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tgap: 12,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{items.map((step, idx) => (\n\t\t\t\t\t<React.Fragment key={step.id ?? `step-${idx}`}>\n\t\t\t\t\t\t<div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>\n\t\t\t\t\t\t\t{/* Left: number icon /}\n\t\t\t\t\t\t\t{(() => {\n\t\t\t\t\t\t\t\t// Step is active if it's the first step OR if the previous step is completed\n\t\t\t\t\t\t\t\tconst isActive =\n\t\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted) &&\n\t\t\t\t\t\t\t\t\tisStepperActive === true;\n\t\t\t\t\t\t\t\tconst isCompleted = step.isCompleted === true;\n\n\t\t\t\t\t\t\t\t// If completed, show checkmark icon\n\t\t\t\t\t\t\t\tif (isCompleted) {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\twidth: 24,\n\t\t\t\t\t\t\t\t\t\t\t\theight: 24,\n\t\t\t\t\t\t\t\t\t\t\t\tflex: '0 0 24px',\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<SmallCheckIcon />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t// Otherwise show numbered circle\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\twidth: 24,\n\t\t\t\t\t\t\t\t\t\t\theight: 24,\n\t\t\t\t\t\t\t\t\t\t\tborderRadius: 30,\n\t\t\t\t\t\t\t\t\t\t\tpadding: 4,\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\t\t\t\tboxSizing: 'border-box',\n\t\t\t\t\t\t\t\t\t\t\tbackground: isActive ? '#4B1583' : 'transparent',\n\t\t\t\t\t\t\t\t\t\t\tcolor: isActive ? '#FFFFFF' : '#BDBDBD',\n\t\t\t\t\t\t\t\t\t\t\tborder: `1px solid ${isActive ? '#4B1583' : '#E0E0E0'}`,\n\t\t\t\t\t\t\t\t\t\t\tfontSize: 12,\n\t\t\t\t\t\t\t\t\t\t\tlineHeight: '12px',\n\t\t\t\t\t\t\t\t\t\t\tflex: '0 0 24px',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span style={{ fontSize: 12, fontWeight: 500 }}>\n\t\t\t\t\t\t\t\t\t\t\t{idx + 1}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t})()}\n\n\t\t\t\t\t\t\t{/ Center: small content button (do not grow) /}\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tjustifyContent: 'flex-start',\n\t\t\t\t\t\t\t\t\tminWidth: 0,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\taria-label={`Open ${\n\t\t\t\t\t\t\t\t\tstep.label ?? step.text ?? `step ${idx + 1}`\n\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tbuttonText={step.label ?? step.text ?? `Step ${idx + 1}`}\n\t\t\t\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\t\t\t\tbuttonTextColor={\n\t\t\t\t\t\t\t\t\t\tstep.isCompleted\n\t\t\t\t\t\t\t\t\t\t\t? COLORS.text.secondary\n\t\t\t\t\t\t\t\t\t\t\t: (idx === 0 \|\| items[idx - 1]?.isCompleted === true) &&\n\t\t\t\t\t\t\t\t\t\t\t isStepperActive\n\t\t\t\t\t\t\t\t\t\t\t? '#4B1583'\n\t\t\t\t\t\t\t\t\t\t\t: COLORS.content.inactive\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tmatchParentWidth={false}\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\twidth: 'fit-content',\n\t\t\t\t\t\t\t\t\t\tpaddingLeft: 0,\n\t\t\t\t\t\t\t\t\t\ttextDecoration: 'none',\n\t\t\t\t\t\t\t\t\t\ttextDecorationLine: 'none',\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetSelectedId(step.id ?? selectedId);\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t(!step.isCompleted &&\n\t\t\t\t\t\t\t\t\t\t\t\tisStepperActive &&\n\t\t\t\t\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted === true)) \|\|\n\t\t\t\t\t\t\t\t\t\t\tstep.isCompleted\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tif (step.onClick) step.onClick();\n\t\t\t\t\t\t\t\t\t\t\telse if (step.id) onStepClick?.(step.id);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t{/ Rightmost icon (provided SVG) */}\n\t\t\t\t\t\t\t{!step.isCompleted &&\n\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted === true) &&\n\t\t\t\t\t\t\t\tisStepperActive && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\twidth: 20,\n\t\t\t\t\t\t\t\t\t\t\theight: 20,\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tsetSelectedId(step.id ?? selectedId);\n\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\t!step.isCompleted &&\n\t\t\t\t\t\t\t\t\t\t\t\tisStepperActive &&\n\t\t\t\t\t\t\t\t\t\t\t\t(idx === 0 \|\| items[idx - 1]?.isCompleted === true)\n\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\tif (step.onClick) step.onClick();\n\t\t\t\t\t\t\t\t\t\t\t\telse if (step.id) onStepClick?.(step.id);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Redirect2Icon />\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{idx !== items.length - 1 && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\twidth: 8,\n\t\t\t\t\t\t\t\t\theight: 1,\n\t\t\t\t\t\t\t\t\tborderRadius: 2,\n\t\t\t\t\t\t\t\t\tbackground: '#BDBDBD',\n\t\t\t\t\t\t\t\t\ttransform: 'rotate(90deg)',\n\t\t\t\t\t\t\t\t\tmarginLeft: 8,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</React.Fragment>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default React.memo(ProgressStepper);\n"],"names":["ProgressStepper","steps","onStepClick","isStepperActive","items","selectedId","setSelectedId","useState","jsx","step","idx","jsxs","React","isActive","SmallCheckIcon","Button","COLORS","e","Redirect2Icon"],"mappings":"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"}

package/dist/cjs/components/QueryBuilder/QueryBuilder.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),j=require("../TypographyStyle.js"),Q=require("./components/QueryBuilderNodes.js"),g=require("./hooks/useQueryBuilder.js"),o=u.forwardRef(({queryPreText:c,infinite:d,addNodeBtnText:y,typesAPIHandlers:r,onStateChange:f,mode:a,selectorKey:t,state:s,errorState:i},B)=>{const{init:m,fillState:l}=g.useQueryBuilder(t),n=r?Object.keys(r):[];return u.useEffect(()=>{s?l(s):m(n?.[0])},[]),u.useEffect(()=>{i&&l(i)},[i]),e.jsxs(e.Fragment,{children:[e.jsx(j.BodyPrimary,{style:{marginBottom:12},children:c}),e.jsx(Q.default,{ref:B,selectorKey:t,onStateChange:f,typesAPIHandlers:r,allowedNodes:n,infinite:d??!0,addNodeBtnText:y,mode:a})]})});o.displayName="QueryBuilder";exports.QueryBuilder=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),r=require("react"),j=require("../TypographyStyle.js"),Q=require("./components/QueryBuilderNodes.js"),g=require("./hooks/useQueryBuilder.js"),p=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},q=p(r),c=q.default.forwardRef(({queryPreText:e,infinite:d,addNodeBtnText:f,typesAPIHandlers:u,onStateChange:a,mode:y,selectorKey:o,state:l,errorState:i},m)=>{const{init:B,fillState:n}=g.useQueryBuilder(o),s=u?Object.keys(u):[];return r.useEffect(()=>{l?n(l):B(s?.[0])},[]),r.useEffect(()=>{i&&n(i)},[i]),t.jsxs(t.Fragment,{children:[t.jsx(j.BodyPrimary,{style:{marginBottom:12},children:e}),t.jsx(Q.default,{ref:m,selectorKey:o,onStateChange:a,typesAPIHandlers:u,allowedNodes:s,infinite:d??!0,addNodeBtnText:f,mode:y})]})});c.displayName="QueryBuilder";exports.QueryBuilder=c;
 //# sourceMappingURL=QueryBuilder.js.map

package/dist/cjs/components/QueryBuilder/QueryBuilder.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"QueryBuilder.js","sources":["../../../../src/components/QueryBuilder/QueryBuilder.tsx"],"sourcesContent":["import React, { Ref, useEffect } from 'react';\nimport { BodyPrimary } from '../TypographyStyle';\nimport QueryBuilderNodes from './components/QueryBuilderNodes';\nimport { useQueryBuilder } from './hooks/useQueryBuilder';\nimport { QueryBuilderType } from './types/QueryBuilder.type';\nimport {\n\tQueryBuilderProps,\n\tQueryBuilderRef,\n} from './types/QueryBuilderProps.type';\n\n/*\n @exported\n * @statfull\n * @param param0\n * @returns\n */\nexport const QueryBuilder = React.forwardRef<\n\tQueryBuilderRef,\n\tQueryBuilderProps\n>(\n\t(\n\t\t{\n\t\t\tqueryPreText,\n\t\t\tinfinite,\n\t\t\taddNodeBtnText,\n\t\t\ttypesAPIHandlers,\n\t\t\tonStateChange,\n\t\t\tmode,\n\t\t\tselectorKey,\n\t\t\tstate,\n\t\t\terrorState,\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst { init, fillState } = useQueryBuilder(selectorKey);\n\t\tconst allowedNodes = (\n\t\t\ttypesAPIHandlers ? Object.keys(typesAPIHandlers) : []\n\t\t) as QueryBuilderType[];\n\n\t\tuseEffect(() => {\n\t\t\tif (state) {\n\t\t\t\tfillState(state);\n\t\t\t} else {\n\t\t\t\tinit(allowedNodes?.[0]);\n\t\t\t}\n\t\t}, []);\n\n\t\tuseEffect(() => {\n\t\t\tif (errorState) {\n\t\t\t\tfillState(errorState);\n\t\t\t}\n\t\t}, [errorState]);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<BodyPrimary style={{ marginBottom: 12 }}>{queryPreText}</BodyPrimary>\n\t\t\t\t<QueryBuilderNodes\n\t\t\t\t\tref={ref as Ref<QueryBuilderRef>}\n\t\t\t\t\tselectorKey={selectorKey}\n\t\t\t\t\tonStateChange={onStateChange}\n\t\t\t\t\ttypesAPIHandlers={typesAPIHandlers}\n\t\t\t\t\tallowedNodes={allowedNodes}\n\t\t\t\t\tinfinite={infinite ?? true}\n\t\t\t\t\taddNodeBtnText={addNodeBtnText}\n\t\t\t\t\tmode={mode}\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t},\n);\n\nQueryBuilder.displayName = 'QueryBuilder';\n"],"names":["QueryBuilder","React","queryPreText","infinite","addNodeBtnText","typesAPIHandlers","onStateChange","mode","selectorKey","state","errorState","ref","init","fillState","useQueryBuilder","allowedNodes","useEffect","jsxs","Fragment","jsx","BodyPrimary","QueryBuilderNodes"],"mappings":"~~kQAgBaA~~,EAAeC,~~EAAM~~,WAIjC,CACC,CACC,aAAAC,EACA,SAAAC,EACA,eAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,KAAAC,EACA,YAAAC,EACA,MAAAC,EACA,WAAAC,CAAA,EAEDC,IACI,CACJ,KAAM,CAAE,KAAAC,EAAM,UAAAC,GAAcC,EAAAA,gBAAgBN,CAAW,EACjDO,EACLV,EAAmB,OAAO,KAAKA,CAAgB,EAAI,CAAA,EAGpDW,OAAAA,EAAAA,UAAU,IAAM,CACXP,EACHI,EAAUJ,CAAK,EAEfG,EAAKG,IAAe,CAAC,CAAC,CAExB,EAAG,CAAA,CAAE,EAELC,EAAAA,UAAU,IAAM,CACXN,GACHG,EAAUH,CAAU,CAEtB,EAAG,CAACA,CAAU,CAAC,EAGdO,EAAAA,KAAAC,WAAA,CACC,SAAA,CAAAC,MAACC,EAAAA,aAAY,MAAO,CAAE,aAAc,EAAA,EAAO,SAAAlB,EAAa,EACxDiB,EAAAA,IAACE,EAAAA,QAAA,CACA,IAAAV,EACA,YAAAH,EACA,cAAAF,EACA,iBAAAD,EACA,aAAAU,EACA,SAAUZ,GAAY,GACtB,eAAAC,EACA,KAAAG,CAAA,CAAA,CACD,EACD,CAEF,CACD,EAEAP,EAAa,YAAc"}
1	+ {"version":3,"file":"QueryBuilder.js","sources":["../../../../src/components/QueryBuilder/QueryBuilder.tsx"],"sourcesContent":["import React, { Ref, useEffect } from 'react';\nimport { BodyPrimary } from '../TypographyStyle';\nimport QueryBuilderNodes from './components/QueryBuilderNodes';\nimport { useQueryBuilder } from './hooks/useQueryBuilder';\nimport { QueryBuilderType } from './types/QueryBuilder.type';\nimport {\n\tQueryBuilderProps,\n\tQueryBuilderRef,\n} from './types/QueryBuilderProps.type';\n\n/*\n @exported\n * @statfull\n * @param param0\n * @returns\n */\nexport const QueryBuilder = React.forwardRef<\n\tQueryBuilderRef,\n\tQueryBuilderProps\n>(\n\t(\n\t\t{\n\t\t\tqueryPreText,\n\t\t\tinfinite,\n\t\t\taddNodeBtnText,\n\t\t\ttypesAPIHandlers,\n\t\t\tonStateChange,\n\t\t\tmode,\n\t\t\tselectorKey,\n\t\t\tstate,\n\t\t\terrorState,\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst { init, fillState } = useQueryBuilder(selectorKey);\n\t\tconst allowedNodes = (\n\t\t\ttypesAPIHandlers ? Object.keys(typesAPIHandlers) : []\n\t\t) as QueryBuilderType[];\n\n\t\tuseEffect(() => {\n\t\t\tif (state) {\n\t\t\t\tfillState(state);\n\t\t\t} else {\n\t\t\t\tinit(allowedNodes?.[0]);\n\t\t\t}\n\t\t}, []);\n\n\t\tuseEffect(() => {\n\t\t\tif (errorState) {\n\t\t\t\tfillState(errorState);\n\t\t\t}\n\t\t}, [errorState]);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<BodyPrimary style={{ marginBottom: 12 }}>{queryPreText}</BodyPrimary>\n\t\t\t\t<QueryBuilderNodes\n\t\t\t\t\tref={ref as Ref<QueryBuilderRef>}\n\t\t\t\t\tselectorKey={selectorKey}\n\t\t\t\t\tonStateChange={onStateChange}\n\t\t\t\t\ttypesAPIHandlers={typesAPIHandlers}\n\t\t\t\t\tallowedNodes={allowedNodes}\n\t\t\t\t\tinfinite={infinite ?? true}\n\t\t\t\t\taddNodeBtnText={addNodeBtnText}\n\t\t\t\t\tmode={mode}\n\t\t\t\t/>\n\t\t\t</>\n\t\t);\n\t},\n);\n\nQueryBuilder.displayName = 'QueryBuilder';\n"],"names":["QueryBuilder","React","queryPreText","infinite","addNodeBtnText","typesAPIHandlers","onStateChange","mode","selectorKey","state","errorState","ref","init","fillState","useQueryBuilder","allowedNodes","useEffect","jsxs","Fragment","jsx","BodyPrimary","QueryBuilderNodes"],"mappings":"iUAgBaA,EAAeC,EAAAA,QAAM,WAIjC,CACC,CACC,aAAAC,EACA,SAAAC,EACA,eAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,KAAAC,EACA,YAAAC,EACA,MAAAC,EACA,WAAAC,CAAA,EAEDC,IACI,CACJ,KAAM,CAAE,KAAAC,EAAM,UAAAC,GAAcC,EAAAA,gBAAgBN,CAAW,EACjDO,EACLV,EAAmB,OAAO,KAAKA,CAAgB,EAAI,CAAA,EAGpDW,OAAAA,EAAAA,UAAU,IAAM,CACXP,EACHI,EAAUJ,CAAK,EAEfG,EAAKG,IAAe,CAAC,CAAC,CAExB,EAAG,CAAA,CAAE,EAELC,EAAAA,UAAU,IAAM,CACXN,GACHG,EAAUH,CAAU,CAEtB,EAAG,CAACA,CAAU,CAAC,EAGdO,EAAAA,KAAAC,WAAA,CACC,SAAA,CAAAC,MAACC,EAAAA,aAAY,MAAO,CAAE,aAAc,EAAA,EAAO,SAAAlB,EAAa,EACxDiB,EAAAA,IAACE,EAAAA,QAAA,CACA,IAAAV,EACA,YAAAH,EACA,cAAAF,EACA,iBAAAD,EACA,aAAAU,EACA,SAAUZ,GAAY,GACtB,eAAAC,EACA,KAAAG,CAAA,CAAA,CACD,EACD,CAEF,CACD,EAEAP,EAAa,YAAc"}

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/EmojiPicker.js CHANGED Viewed

@@ -1,8 +1,8 @@
-"use strict";var x=Object.create;var d=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var v=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty;var k=(e,t,o,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of f(t))!y.call(e,s)&&s!==o&&d(e,s,{get:()=>t[s],enumerable:!(r=m(t,s))||r.enumerable});return e};var C=(e,t,o)=>(o=e!=null?x(v(e)):{},k(t||!e||!e.__esModule?d(o,"default",{value:e,enumerable:!0}):o,e));Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),b=require("../../../../../assets/icons/emoji.svg.js"),c=require("react"),p=require("styled-components"),w=require("../../../../input/ChipInput.js"),q=require("../../../../../hooks/useOutside.js"),P=require("../../../../icon-button/IconButton.js"),S=c.lazy(async()=>({default:(await import("emoji-picker-react")).default})),g=({val:e,onChange:t,errors:o,nativeID:r,disabled:s})=>{const[j,a]=c.useState(!1),u=(Array.isArray(e)?e:[]).map(n=>n),l=c.useRef();return q.useOutside(l,()=>{a(!1)}),i.jsxs("div",{style:{position:"relative",opacity:s?.5:1,width:300},id:r,children:[!!s&&i.jsx("div",{style:{position:"absolute",width:"100%",height:"100%",top:0,left:0,zIndex:1}}),i.jsxs(z,{children:[i.jsx(w.default,{error:o?.val,onChipsChange:t,chipsContainerCustomStyle:{padding:"0px 32px 0px 8px"},createChipKeys:[13,188],placeholder:"add emojis",chips:u}),i.jsx(I,{children:i.jsx(P.IconButton,{Icon:b.default,onClick:()=>a(!0)})}),j&&i.jsx("div",{ref:l,className:"absolute-picker",children:i.jsx(c.Suspense,{fallback:null,children:i.jsx(S,{previewConfig:{showPreview:!1},skinTonesDisabled:!0,searchDisabled:!0,theme:"dark",emojiStyle:"native",onEmojiClick:n=>{u.find(h=>n.emoji===h)||t?.([...u,n.emoji])}})})})]})]})};function E(e){return i.jsx(g,{...e})}const I=p.div`
+"use strict";var m=Object.create;var d=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var y=Object.getOwnPropertyNames;var v=Object.getPrototypeOf,k=Object.prototype.hasOwnProperty;var C=(e,t,o,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of y(t))!k.call(e,s)&&s!==o&&d(e,s,{get:()=>t[s],enumerable:!(n=x(t,s))||n.enumerable});return e};var b=(e,t,o)=>(o=e!=null?m(v(e)):{},C(t||!e||!e.__esModule?d(o,"default",{value:e,enumerable:!0}):o,e));Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),w=require("../../../../../assets/icons/emoji.svg.js"),u=require("react"),q=require("styled-components"),P=require("../../../../input/ChipInput.js"),S=require("../../../../../hooks/useOutside.js"),_=require("../../../../icon-button/IconButton.js"),p=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},g=p(u),f=p(q),E=g.default.lazy(async()=>({default:(await import("emoji-picker-react")).default})),I=({val:e,onChange:t,errors:o,nativeID:n,disabled:s})=>{const[j,c]=u.useState(!1),a=(Array.isArray(e)?e:[]).map(r=>r),l=u.useRef();return S.useOutside(l,()=>{c(!1)}),i.jsxs("div",{style:{position:"relative",opacity:s?.5:1,width:300},id:n,children:[!!s&&i.jsx("div",{style:{position:"absolute",width:"100%",height:"100%",top:0,left:0,zIndex:1}}),i.jsxs(A,{children:[i.jsx(P.default,{error:o?.val,onChipsChange:t,chipsContainerCustomStyle:{padding:"0px 32px 0px 8px"},createChipKeys:[13,188],placeholder:"add emojis",chips:a}),i.jsx(R,{children:i.jsx(_.IconButton,{Icon:w.default,onClick:()=>c(!0)})}),j&&i.jsx("div",{ref:l,className:"absolute-picker",children:i.jsx(u.Suspense,{fallback:null,children:i.jsx(E,{previewConfig:{showPreview:!1},skinTonesDisabled:!0,searchDisabled:!0,theme:"dark",emojiStyle:"native",onEmojiClick:r=>{a.find(h=>r.emoji===h)||t?.([...a,r.emoji])}})})})]})]})};function z(e){return i.jsx(I,{...e})}const R=f.default.div`
 	position: absolute;
 	right: 0;
 	top: 0;
-`,z=p.div`
+`,A=f.default.div`
 	input {
 		pointer-events: none;
 	}
@@ -11,5 +11,5 @@
 		top: 50px;
 		z-index: 1;
 	}
-`;exports.default=E;
+`;exports.default=z;
 //# sourceMappingURL=EmojiPicker.js.map

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/EmojiPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmojiPicker.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/EmojiPicker.tsx"],"sourcesContent":["import EmojiIcon from '@src/assets/icons/emoji.svg';\nimport React, { LegacyRef, Suspense, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { IconButton } from '@src/components/icon-button';\nimport ChipInput from '@src/components/input/ChipInput';\nimport { CONNECTOR_VALUE_TYPE } from '@src/components/QueryBuilder/types/QueryBuilderConnector';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { useOutside } from '@src/hooks/useOutside';\n\ntype EmojiClickData = {\n\temoji: string;\n};\n\nconst LazyEmojiPicker = React.lazy(async () => {\n\tconst mod = await import('emoji-picker-react');\n\treturn { default: mod.default };\n});\n\ntype Props = Omit<Omit<ConnectorComponentProps, 'val'>, 'onChange'> & {\n\tval: string[];\n\tonChange: (val: (string \| number)[]) => void;\n};\n\nconst EmojiPicker: React.FC<ConnectorComponentProps> = ({\n\tval,\n\tonChange,\n\terrors,\n\tnativeID,\n\tdisabled,\n}) => {\n\tconst [showPicker, setShowPicker] = useState<boolean>(false);\n\tconst valArr = (Array.isArray(val) ? val : []).map((valEl) => {\n\t\treturn valEl;\n\t});\n\tconst ref = useRef();\n\n\tuseOutside(ref, () => {\n\t\tsetShowPicker(false);\n\t});\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ position: 'relative', opacity: disabled ? 0.5 : 1, width: 300 }}\n\t\t\tid={nativeID}\n\t\t>\n\t\t\t{!!disabled && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\tzIndex: 1,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<EmojiInput>\n\t\t\t\t<ChipInput\n\t\t\t\t\terror={errors?.val as string}\n\t\t\t\t\tonChipsChange={onChange as Props['onChange']}\n\t\t\t\t\tchipsContainerCustomStyle={{\n\t\t\t\t\t\tpadding: '0px 32px 0px 8px',\n\t\t\t\t\t}}\n\t\t\t\t\tcreateChipKeys={[13, 188]}\n\t\t\t\t\tplaceholder={'add emojis'}\n\t\t\t\t\tchips={valArr}\n\t\t\t\t/>\n\n\t\t\t\t<EmojiContainer>\n\t\t\t\t\t<IconButton Icon={EmojiIcon} onClick={() => setShowPicker(true)} />\n\t\t\t\t</EmojiContainer>\n\t\t\t\t{showPicker && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tref={ref as unknown as LegacyRef<HTMLDivElement>}\n\t\t\t\t\t\tclassName=\"absolute-picker\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Suspense fallback={null}>\n\t\t\t\t\t\t\t<LazyEmojiPicker\n\t\t\t\t\t\t\t\tpreviewConfig={{ showPreview: false }}\n\t\t\t\t\t\t\t\tskinTonesDisabled\n\t\t\t\t\t\t\t\tsearchDisabled\n\t\t\t\t\t\t\t\ttheme={'dark' as unknown as never}\n\t\t\t\t\t\t\t\temojiStyle={'native' as unknown as never}\n\t\t\t\t\t\t\t\tonEmojiClick={(emoji: EmojiClickData) => {\n\t\t\t\t\t\t\t\t\tconst exists = valArr.find((em) => emoji.emoji === em);\n\t\t\t\t\t\t\t\t\tif (exists) return;\n\t\t\t\t\t\t\t\t\tonChange?.([\n\t\t\t\t\t\t\t\t\t\t...valArr,\n\t\t\t\t\t\t\t\t\t\temoji.emoji,\n\t\t\t\t\t\t\t\t\t] as unknown as CONNECTOR_VALUE_TYPE);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Suspense>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</EmojiInput>\n\t\t</div>\n\t);\n};\n\nexport default function EmojiPickerConnector(props: ConnectorComponentProps) {\n\treturn <EmojiPicker {...props} />;\n}\n\nconst EmojiContainer = styled.div`\n\tposition: absolute;\n\tright: 0;\n\ttop: 0;\n`;\n\nconst EmojiInput = styled.div`\n\tinput {\n\t\tpointer-events: none;\n\t}\n\t.absolute-picker {\n\t\tposition: absolute;\n\t\ttop: 50px;\n\t\tz-index: 1;\n\t}\n`;\n"],"names":["LazyEmojiPicker","React","EmojiPicker","val","onChange","errors","nativeID","disabled","showPicker","setShowPicker","useState","valArr","valEl","ref","useRef","useOutside","jsxs","jsx","EmojiInput","ChipInput","EmojiContainer","IconButton","EmojiIcon","Suspense","emoji","em","EmojiPickerConnector","props","styled"],"mappings":"~~m1BAaMA~~,EAAkBC,~~EAAM~~,KAAK,UAE3B,CAAE,SADG,KAAM,QAAO,oBAAoB,GACvB,OAAA,EACtB,EAOKC,EAAiD,CAAC,CACvD,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EACA,SAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAAA,SAAkB,EAAK,EACrDC,GAAU,MAAM,QAAQR,CAAG,EAAIA,EAAM,CAAA,GAAI,IAAKS,GAC5CA,CACP,EACKC,EAAMC,EAAAA,OAAA,EAEZC,OAAAA,EAAAA,WAAWF,EAAK,IAAM,CACrBJ,EAAc,EAAK,CACpB,CAAC,EAGAO,EAAAA,KAAC,MAAA,CACA,MAAO,CAAE,SAAU,WAAY,QAAST,EAAW,GAAM,EAAG,MAAO,GAAA,EACnE,GAAID,EAEH,SAAA,CAAA,CAAC,CAACC,GACFU,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,SAAU,WACV,MAAO,OACP,OAAQ,OACR,IAAK,EACL,KAAM,EACN,OAAQ,CAAA,CACT,CAAA,SAGDC,EAAA,CACA,SAAA,CAAAD,EAAAA,IAACE,EAAAA,QAAA,CACA,MAAOd,GAAQ,IACf,cAAeD,EACf,0BAA2B,CAC1B,QAAS,kBAAA,EAEV,eAAgB,CAAC,GAAI,GAAG,EACxB,YAAa,aACb,MAAOO,CAAA,CAAA,EAGRM,EAAAA,IAACG,EAAA,CACA,SAAAH,EAAAA,IAACI,EAAAA,WAAA,CAAW,KAAMC,EAAAA,QAAW,QAAS,IAAMb,EAAc,EAAI,CAAA,CAAG,CAAA,CAClE,EACCD,GACAS,EAAAA,IAAC,MAAA,CACA,IAAAJ,EACA,UAAU,kBAEV,SAAAI,EAAAA,IAACM,EAAAA,SAAA,CAAS,SAAU,KACnB,SAAAN,EAAAA,IAACjB,EAAA,CACA,cAAe,CAAE,YAAa,EAAA,EAC9B,kBAAiB,GACjB,eAAc,GACd,MAAO,OACP,WAAY,SACZ,aAAewB,GAA0B,CACzBb,EAAO,KAAMc,GAAOD,EAAM,QAAUC,CAAE,GAErDrB,IAAW,CACV,GAAGO,EACHa,EAAM,KAAA,CAC6B,CACrC,CAAA,CAAA,CACD,CACD,CAAA,CAAA,CACD,CAAA,CAEF,CAAA,CAAA,CAAA,CAGH,EAEA,SAAwBE,EAAqBC,EAAgC,CAC5E,OAAOV,MAACf,EAAA,CAAa,GAAGyB,CAAA,CAAO,CAChC,CAEA,MAAMP,EAAiBQ,~~EAAO~~;AAAA;AAAA;AAAA;AAAA,EAMxBV,EAAaU,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
1	+ {"version":3,"file":"EmojiPicker.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/EmojiPicker.tsx"],"sourcesContent":["import EmojiIcon from '@src/assets/icons/emoji.svg';\nimport React, { LegacyRef, Suspense, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { IconButton } from '@src/components/icon-button';\nimport ChipInput from '@src/components/input/ChipInput';\nimport { CONNECTOR_VALUE_TYPE } from '@src/components/QueryBuilder/types/QueryBuilderConnector';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { useOutside } from '@src/hooks/useOutside';\n\ntype EmojiClickData = {\n\temoji: string;\n};\n\nconst LazyEmojiPicker = React.lazy(async () => {\n\tconst mod = await import('emoji-picker-react');\n\treturn { default: mod.default };\n});\n\ntype Props = Omit<Omit<ConnectorComponentProps, 'val'>, 'onChange'> & {\n\tval: string[];\n\tonChange: (val: (string \| number)[]) => void;\n};\n\nconst EmojiPicker: React.FC<ConnectorComponentProps> = ({\n\tval,\n\tonChange,\n\terrors,\n\tnativeID,\n\tdisabled,\n}) => {\n\tconst [showPicker, setShowPicker] = useState<boolean>(false);\n\tconst valArr = (Array.isArray(val) ? val : []).map((valEl) => {\n\t\treturn valEl;\n\t});\n\tconst ref = useRef();\n\n\tuseOutside(ref, () => {\n\t\tsetShowPicker(false);\n\t});\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ position: 'relative', opacity: disabled ? 0.5 : 1, width: 300 }}\n\t\t\tid={nativeID}\n\t\t>\n\t\t\t{!!disabled && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\tzIndex: 1,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<EmojiInput>\n\t\t\t\t<ChipInput\n\t\t\t\t\terror={errors?.val as string}\n\t\t\t\t\tonChipsChange={onChange as Props['onChange']}\n\t\t\t\t\tchipsContainerCustomStyle={{\n\t\t\t\t\t\tpadding: '0px 32px 0px 8px',\n\t\t\t\t\t}}\n\t\t\t\t\tcreateChipKeys={[13, 188]}\n\t\t\t\t\tplaceholder={'add emojis'}\n\t\t\t\t\tchips={valArr}\n\t\t\t\t/>\n\n\t\t\t\t<EmojiContainer>\n\t\t\t\t\t<IconButton Icon={EmojiIcon} onClick={() => setShowPicker(true)} />\n\t\t\t\t</EmojiContainer>\n\t\t\t\t{showPicker && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tref={ref as unknown as LegacyRef<HTMLDivElement>}\n\t\t\t\t\t\tclassName=\"absolute-picker\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Suspense fallback={null}>\n\t\t\t\t\t\t\t<LazyEmojiPicker\n\t\t\t\t\t\t\t\tpreviewConfig={{ showPreview: false }}\n\t\t\t\t\t\t\t\tskinTonesDisabled\n\t\t\t\t\t\t\t\tsearchDisabled\n\t\t\t\t\t\t\t\ttheme={'dark' as unknown as never}\n\t\t\t\t\t\t\t\temojiStyle={'native' as unknown as never}\n\t\t\t\t\t\t\t\tonEmojiClick={(emoji: EmojiClickData) => {\n\t\t\t\t\t\t\t\t\tconst exists = valArr.find((em) => emoji.emoji === em);\n\t\t\t\t\t\t\t\t\tif (exists) return;\n\t\t\t\t\t\t\t\t\tonChange?.([\n\t\t\t\t\t\t\t\t\t\t...valArr,\n\t\t\t\t\t\t\t\t\t\temoji.emoji,\n\t\t\t\t\t\t\t\t\t] as unknown as CONNECTOR_VALUE_TYPE);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Suspense>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</EmojiInput>\n\t\t</div>\n\t);\n};\n\nexport default function EmojiPickerConnector(props: ConnectorComponentProps) {\n\treturn <EmojiPicker {...props} />;\n}\n\nconst EmojiContainer = styled.div`\n\tposition: absolute;\n\tright: 0;\n\ttop: 0;\n`;\n\nconst EmojiInput = styled.div`\n\tinput {\n\t\tpointer-events: none;\n\t}\n\t.absolute-picker {\n\t\tposition: absolute;\n\t\ttop: 50px;\n\t\tz-index: 1;\n\t}\n`;\n"],"names":["LazyEmojiPicker","React","EmojiPicker","val","onChange","errors","nativeID","disabled","showPicker","setShowPicker","useState","valArr","valEl","ref","useRef","useOutside","jsxs","jsx","EmojiInput","ChipInput","EmojiContainer","IconButton","EmojiIcon","Suspense","emoji","em","EmojiPickerConnector","props","styled"],"mappings":"y5BAaMA,EAAkBC,EAAAA,QAAM,KAAK,UAE3B,CAAE,SADG,KAAM,QAAO,oBAAoB,GACvB,OAAA,EACtB,EAOKC,EAAiD,CAAC,CACvD,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EACA,SAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAAA,SAAkB,EAAK,EACrDC,GAAU,MAAM,QAAQR,CAAG,EAAIA,EAAM,CAAA,GAAI,IAAKS,GAC5CA,CACP,EACKC,EAAMC,EAAAA,OAAA,EAEZC,OAAAA,EAAAA,WAAWF,EAAK,IAAM,CACrBJ,EAAc,EAAK,CACpB,CAAC,EAGAO,EAAAA,KAAC,MAAA,CACA,MAAO,CAAE,SAAU,WAAY,QAAST,EAAW,GAAM,EAAG,MAAO,GAAA,EACnE,GAAID,EAEH,SAAA,CAAA,CAAC,CAACC,GACFU,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,SAAU,WACV,MAAO,OACP,OAAQ,OACR,IAAK,EACL,KAAM,EACN,OAAQ,CAAA,CACT,CAAA,SAGDC,EAAA,CACA,SAAA,CAAAD,EAAAA,IAACE,EAAAA,QAAA,CACA,MAAOd,GAAQ,IACf,cAAeD,EACf,0BAA2B,CAC1B,QAAS,kBAAA,EAEV,eAAgB,CAAC,GAAI,GAAG,EACxB,YAAa,aACb,MAAOO,CAAA,CAAA,EAGRM,EAAAA,IAACG,EAAA,CACA,SAAAH,EAAAA,IAACI,EAAAA,WAAA,CAAW,KAAMC,EAAAA,QAAW,QAAS,IAAMb,EAAc,EAAI,CAAA,CAAG,CAAA,CAClE,EACCD,GACAS,EAAAA,IAAC,MAAA,CACA,IAAAJ,EACA,UAAU,kBAEV,SAAAI,EAAAA,IAACM,EAAAA,SAAA,CAAS,SAAU,KACnB,SAAAN,EAAAA,IAACjB,EAAA,CACA,cAAe,CAAE,YAAa,EAAA,EAC9B,kBAAiB,GACjB,eAAc,GACd,MAAO,OACP,WAAY,SACZ,aAAewB,GAA0B,CACzBb,EAAO,KAAMc,GAAOD,EAAM,QAAUC,CAAE,GAErDrB,IAAW,CACV,GAAGO,EACHa,EAAM,KAAA,CAC6B,CACrC,CAAA,CAAA,CACD,CACD,CAAA,CAAA,CACD,CAAA,CAEF,CAAA,CAAA,CAAA,CAGH,EAEA,SAAwBE,EAAqBC,EAAgC,CAC5E,OAAOV,MAACf,EAAA,CAAa,GAAGyB,CAAA,CAAO,CAChC,CAEA,MAAMP,EAAiBQ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,EAMxBV,EAAaU,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/FrequencyIntegerPositiveSingle.js CHANGED Viewed

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("styled-components"),l=require("../../../../TypographyStyle.js"),c=require("./IntegerPositiveSingle.js"),u=o.div`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),s=require("styled-components"),l=require("../../../../TypographyStyle.js"),u=require("./IntegerPositiveSingle.js"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=c(s),a=d.default.div`
 	flex-direction: row;
 	display: flex;
 	align-items: center;
 	gap: 8px;
-`,d=({val:t,onChange:i,errors:r,disabled:n,connectorType:s})=>e.jsxs(u,{children:[e.jsx(c.default,{disabled:n,val:t,onChange:i,errors:r,connectorType:s}),e.jsx(l.BodySecondary,{children:"time(s)"})]}),a=t=>e.jsx(d,{...t});exports.default=a;
+`,y=({val:e,onChange:n,errors:i,disabled:r,connectorType:o})=>t.jsxs(a,{children:[t.jsx(u.default,{disabled:r,val:e,onChange:n,errors:i,connectorType:o}),t.jsx(l.BodySecondary,{children:"time(s)"})]}),f=e=>t.jsx(y,{...e});exports.default=f;
 //# sourceMappingURL=FrequencyIntegerPositiveSingle.js.map

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/FrequencyIntegerPositiveSingle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FrequencyIntegerPositiveSingle.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/FrequencyIntegerPositiveSingle.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport IntegerPositiveSingle from './IntegerPositiveSingle';\n\nconst Container = styled.div`\n\tflex-direction: row;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nconst FrequencyIntegerPositiveSingle: React.FC<ConnectorComponentProps> = ({\n\tval,\n\tonChange,\n\terrors,\n\tdisabled,\n\tconnectorType,\n}) => {\n\treturn (\n\t\t<Container>\n\t\t\t<IntegerPositiveSingle\n\t\t\t\tdisabled={disabled}\n\t\t\t\tval={val}\n\t\t\t\tonChange={onChange}\n\t\t\t\terrors={errors}\n\t\t\t\tconnectorType={connectorType}\n\t\t\t/>\n\t\t\t<BodySecondary>time(s)</BodySecondary>\n\t\t</Container>\n\t);\n};\n\n// eslint-disable-next-line react/display-name\nexport default (props: ConnectorComponentProps) => (\n\t<FrequencyIntegerPositiveSingle {...props} />\n);\n"],"names":["Container","styled","FrequencyIntegerPositiveSingle","val","onChange","errors","disabled","connectorType","jsx","IntegerPositiveSingle","BodySecondary","props"],"mappings":"~~oQAMMA~~,EAAYC,~~EAAO~~;AAAA;AAAA;AAAA;AAAA;AAAA,EAOnBC,EAAoE,CAAC,CAC1E,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EACA,cAAAC,CACD,WAEGP,EAAA,CACA,SAAA,CAAAQ,EAAAA,IAACC,EAAAA,QAAA,CACA,SAAAH,EACA,IAAAH,EACA,SAAAC,EACA,OAAAC,EACA,cAAAE,CAAA,CAAA,EAEDC,EAAAA,IAACE,EAAAA,eAAc,SAAA,SAAA,CAAO,CAAA,EACvB,EAKFR,EAAgBS,GACfH,EAAAA,IAACN,EAAA,CAAgC,GAAGS,CAAA,CAAO"}
1	+ {"version":3,"file":"FrequencyIntegerPositiveSingle.js","sources":["../../../../../../../src/components/QueryBuilder/components/Connectors/Components/FrequencyIntegerPositiveSingle.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { ConnectorComponentProps } from '@src/components/QueryBuilder/types/QueryBuilderConnector.type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport IntegerPositiveSingle from './IntegerPositiveSingle';\n\nconst Container = styled.div`\n\tflex-direction: row;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nconst FrequencyIntegerPositiveSingle: React.FC<ConnectorComponentProps> = ({\n\tval,\n\tonChange,\n\terrors,\n\tdisabled,\n\tconnectorType,\n}) => {\n\treturn (\n\t\t<Container>\n\t\t\t<IntegerPositiveSingle\n\t\t\t\tdisabled={disabled}\n\t\t\t\tval={val}\n\t\t\t\tonChange={onChange}\n\t\t\t\terrors={errors}\n\t\t\t\tconnectorType={connectorType}\n\t\t\t/>\n\t\t\t<BodySecondary>time(s)</BodySecondary>\n\t\t</Container>\n\t);\n};\n\n// eslint-disable-next-line react/display-name\nexport default (props: ConnectorComponentProps) => (\n\t<FrequencyIntegerPositiveSingle {...props} />\n);\n"],"names":["Container","styled","FrequencyIntegerPositiveSingle","val","onChange","errors","disabled","connectorType","jsx","IntegerPositiveSingle","BodySecondary","props"],"mappings":"mUAMMA,EAAYC,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAOnBC,EAAoE,CAAC,CAC1E,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EACA,cAAAC,CACD,WAEGP,EAAA,CACA,SAAA,CAAAQ,EAAAA,IAACC,EAAAA,QAAA,CACA,SAAAH,EACA,IAAAH,EACA,SAAAC,EACA,OAAAC,EACA,cAAAE,CAAA,CAAA,EAEDC,EAAAA,IAACE,EAAAA,eAAc,SAAA,SAAA,CAAO,CAAA,EACvB,EAKFR,EAAgBS,GACfH,EAAAA,IAACN,EAAA,CAAgC,GAAGS,CAAA,CAAO"}

package/dist/cjs/components/QueryBuilder/components/Connectors/Components/IgPicker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),E=require("../../../../../assets/icons/cross.svg.js"),j=require("../../../../../assets/icons/instagram.svg.js"),R=require("../../../../../assets/icons/plus.svg.js"),o=require("react"),y=require("styled-components"),$=require("../../../../button/Button.styled.js"),x=require("../../../../TypographyStyle.js"),_=require("../../../../../utils/unCamelCase.js"),L=require("../../../../../constants/colors.js"),n=require("../../../../../constants/Theme.js"),a=require("../../../../postPicker/postPicker.js"),u=e=>{const[h,s]=o.useState(!1),[l,c]=o.useState([]),[m,b]=o.useState([]),[p,S]=o.useState(!1);o.useEffect(()=>{e.errors&&e.errors.val&&S(!0)},[e.errors?.val]),o.useEffect(()=>{e.val&&e.val?.length>0&&c(e.val)},[e.val?.length]),o.useEffect(()=>{if(e?.extra?.originalData&&e?.extra?.originalData?.length>0){const r=e?.extra?.originalData?.map(i=>({id:i.id,imageUrl:i.media_type==="VIDEO"?i.thumbnail_url:i.media_url,redirectionUrl:i.permalink,overlayCaption:`posted on: ${O(i.timestamp)}`}));b(r)}},[e?.extra?.originalData]);const O=r=>{const i=new Date(r),d=i.getMonth()+1,g=i.getDate(),k=i.getFullYear();return`${g}/${d}/${k}`},f=r=>{c(r),s(!1),e.onChange?.(r)},v=()=>{s(!0)},T=()=>{s(!1)},P=r=>{const d=[...l].filter(g=>g.id!==r);c(d),d.length>0?e.onChange?.(d):e.onChange?.(void 0)},C=r=>r===a.MEDIA_TYPES.POST||r===a.MEDIA_TYPES.REEL?`Select upto 10 ${e.mediaType}s`:"Select upto 10 stories";return t.jsxs(w,{mediaType:e.mediaType,children:[t.jsx("div",{style:{padding:12},children:t.jsxs("button",{className:`${p?"add-media-btn error":"add-media-btn"}`,onClick:()=>v(),children:[t.jsx($.ButtonCustomDashedBorder,{}),t.jsx(R.default,{color:p?n.COLORS.content.negative:n.COLORS.content.secondary,width:20,height:20,style:{marginBottom:15}}),t.jsxs(x.BodySecondary,{style:{color:p?n.COLORS.content.negative:n.COLORS.content.primary},children:["Add ",_.unCamelCase(e.mediaType)]}),t.jsx("div",{className:"overlay-container"})]})}),t.jsx("div",{className:"product-card-container",children:l?.length>0&&l.map(r=>t.jsx("div",{style:{padding:"7px"},children:t.jsxs(A,{mediaType:e.mediaType,children:[t.jsx("img",{src:r.imageUrl,alt:r.overlayCaption}),t.jsxs("div",{className:"overlay",children:[t.jsx("a",{target:"_blank",rel:"noreferrer",href:r.redirectionUrl,children:t.jsxs("div",{className:"overlay__redirection",children:[t.jsx(j.default,{height:22,width:22}),t.jsx(x.BodyPrimary,{color:L.PRIMARY,style:{fontWeight:500},children:"View"})]})}),t.jsx("div",{className:"overlay__caption",children:t.jsx(x.BodyCaption,{color:n.COLORS.content.placeholder,children:r.overlayCaption})})]}),t.jsx("button",{className:"cross-icon",onClick:()=>P(r.id),children:t.jsx(E.default,{width:12,height:12,color:n.COLORS.content.secondary})})]})},r.id))}),h&&t.jsx(a.PostPicker,{limit:10,selected:l,onSelect:f,title:C(e.mediaType),showModal:h,onClose:()=>T(),media:m,mediaType:e.mediaType})]})},D=e=>t.jsx(u,{...e,mediaType:a.MEDIA_TYPES.POST}),I=e=>t.jsx(u,{...e,mediaType:a.MEDIA_TYPES.REEL}),M=e=>t.jsx(u,{...e,mediaType:a.MEDIA_TYPES.STORY}),w=y.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),E=require("../../../../../assets/icons/cross.svg.js"),j=require("../../../../../assets/icons/instagram.svg.js"),R=require("../../../../../assets/icons/plus.svg.js"),o=require("react"),$=require("styled-components"),_=require("../../../../button/Button.styled.js"),x=require("../../../../TypographyStyle.js"),D=require("../../../../../utils/unCamelCase.js"),L=require("../../../../../constants/colors.js"),n=require("../../../../../constants/Theme.js"),a=require("../../../../postPicker/postPicker.js"),I=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},y=I($),u=e=>{const[h,s]=o.useState(!1),[l,c]=o.useState([]),[m,b]=o.useState([]),[p,S]=o.useState(!1);o.useEffect(()=>{e.errors&&e.errors.val&&S(!0)},[e.errors?.val]),o.useEffect(()=>{e.val&&e.val?.length>0&&c(e.val)},[e.val?.length]),o.useEffect(()=>{if(e?.extra?.originalData&&e?.extra?.originalData?.length>0){const r=e?.extra?.originalData?.map(i=>({id:i.id,imageUrl:i.media_type==="VIDEO"?i.thumbnail_url:i.media_url,redirectionUrl:i.permalink,overlayCaption:`posted on: ${f(i.timestamp)}`}));b(r)}},[e?.extra?.originalData]);const f=r=>{const i=new Date(r),d=i.getMonth()+1,g=i.getDate(),k=i.getFullYear();return`${g}/${d}/${k}`},O=r=>{c(r),s(!1),e.onChange?.(r)},v=()=>{s(!0)},T=()=>{s(!1)},P=r=>{const d=[...l].filter(g=>g.id!==r);c(d),d.length>0?e.onChange?.(d):e.onChange?.(void 0)},C=r=>r===a.MEDIA_TYPES.POST||r===a.MEDIA_TYPES.REEL?`Select upto 10 ${e.mediaType}s`:"Select upto 10 stories";return t.jsxs(Y,{mediaType:e.mediaType,children:[t.jsx("div",{style:{padding:12},children:t.jsxs("button",{className:`${p?"add-media-btn error":"add-media-btn"}`,onClick:()=>v(),children:[t.jsx(_.ButtonCustomDashedBorder,{}),t.jsx(R.default,{color:p?n.COLORS.content.negative:n.COLORS.content.secondary,width:20,height:20,style:{marginBottom:15}}),t.jsxs(x.BodySecondary,{style:{color:p?n.COLORS.content.negative:n.COLORS.content.primary},children:["Add ",D.unCamelCase(e.mediaType)]}),t.jsx("div",{className:"overlay-container"})]})}),t.jsx("div",{className:"product-card-container",children:l?.length>0&&l.map(r=>t.jsx("div",{style:{padding:"7px"},children:t.jsxs(q,{mediaType:e.mediaType,children:[t.jsx("img",{src:r.imageUrl,alt:r.overlayCaption}),t.jsxs("div",{className:"overlay",children:[t.jsx("a",{target:"_blank",rel:"noreferrer",href:r.redirectionUrl,children:t.jsxs("div",{className:"overlay__redirection",children:[t.jsx(j.default,{height:22,width:22}),t.jsx(x.BodyPrimary,{color:L.PRIMARY,style:{fontWeight:500},children:"View"})]})}),t.jsx("div",{className:"overlay__caption",children:t.jsx(x.BodyCaption,{color:n.COLORS.content.placeholder,children:r.overlayCaption})})]}),t.jsx("button",{className:"cross-icon",onClick:()=>P(r.id),children:t.jsx(E.default,{width:12,height:12,color:n.COLORS.content.secondary})})]})},r.id))}),h&&t.jsx(a.PostPicker,{limit:10,selected:l,onSelect:O,title:C(e.mediaType),showModal:h,onClose:()=>T(),media:m,mediaType:e.mediaType})]})},M=e=>t.jsx(u,{...e,mediaType:a.MEDIA_TYPES.POST}),w=e=>t.jsx(u,{...e,mediaType:a.MEDIA_TYPES.REEL}),A=e=>t.jsx(u,{...e,mediaType:a.MEDIA_TYPES.STORY}),Y=y.default.div`
 	display: flex;
 	flex-direction: row;
 	align-items: center;
@@ -163,7 +163,7 @@
 			);
 		}
 	}
-`,A=y.div`
+`,q=y.default.div`
 	border-radius: 4px;
 	border: 1px solid ${n.COLORS.stroke.primary};
 	position: relative;
@@ -231,5 +231,5 @@
 			}
 		}
 	}
-`;exports.PostIgPicker=D;exports.ReelIgPicker=I;exports.StoryIgPicker=M;
+`;exports.PostIgPicker=M;exports.ReelIgPicker=w;exports.StoryIgPicker=A;
 //# sourceMappingURL=IgPicker.js.map