@bikdotai/bik-component-library 0.0.840-tools-beta.5 → 0.0.841-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/BikGiftedChat/GiftedChat/GiftedChat.js +1 -1
- package/dist/cjs/components/BikGiftedChat/GiftedChat/GiftedChat.js.map +1 -1
- package/dist/cjs/components/SearchFilter/index.js +1 -1
- package/dist/cjs/components/SearchFilter/index.js.map +1 -1
- package/dist/cjs/components/agent-builder/constants/tools.js.map +1 -1
- package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsChip.js +1 -1
- package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsChip.js.map +1 -1
- package/dist/cjs/components/avatar/Avatar.js +1 -1
- package/dist/cjs/components/avatar/Avatar.js.map +1 -1
- package/dist/cjs/components/avatar/Avatar.styled.js +12 -4
- package/dist/cjs/components/avatar/Avatar.styled.js.map +1 -1
- package/dist/cjs/components/button/themes.js +11 -11
- package/dist/cjs/components/button/themes.js.map +1 -1
- package/dist/cjs/components/card-selector/CardSelector.js +1 -1
- package/dist/cjs/components/card-selector/CardSelector.js.map +1 -1
- package/dist/cjs/components/card-selector/CardSelectorGroup.js +1 -1
- package/dist/cjs/components/card-selector/CardSelectorGroup.js.map +1 -1
- package/dist/cjs/components/carousel/carousel.js +2 -2
- package/dist/cjs/components/carousel/carousel.js.map +1 -1
- package/dist/cjs/components/checkBox/CheckBox.js +1 -1
- package/dist/cjs/components/checkBox/CheckBox.js.map +1 -1
- package/dist/cjs/components/code-block/CodeBlock.js +2 -2
- package/dist/cjs/components/code-block/CodeBlock.js.map +1 -1
- package/dist/cjs/components/colourInput/ColourInput.js +1 -1
- package/dist/cjs/components/colourInput/ColourInput.js.map +1 -1
- package/dist/cjs/components/dashboard-review-popup/DashboardReviewPopUp.js +1 -1
- package/dist/cjs/components/dashboard-review-popup/DashboardReviewPopUp.js.map +1 -1
- package/dist/cjs/components/dot-pulse/DotPulse.js +3 -3
- package/dist/cjs/components/dot-pulse/DotPulse.js.map +1 -1
- package/dist/cjs/components/dropShadow/DropShadow.js +1 -1
- package/dist/cjs/components/dropShadow/DropShadow.js.map +1 -1
- package/dist/cjs/components/dropdown/ChipInput.js +1 -1
- package/dist/cjs/components/dropdown/ChipInput.js.map +1 -1
- package/dist/cjs/components/dropdown/DropdownPopover/index.js +1 -1
- package/dist/cjs/components/dropdown/DropdownPopover/index.js.map +1 -1
- package/dist/cjs/components/dropdown-button/DropdownButton.js +1 -1
- package/dist/cjs/components/dropdown-button/DropdownButton.js.map +1 -1
- package/dist/cjs/components/floater/floater.js +1 -1
- package/dist/cjs/components/floater/floater.js.map +1 -1
- package/dist/cjs/components/input/Input.js +1 -1
- package/dist/cjs/components/input/Input.js.map +1 -1
- package/dist/cjs/components/modals/styledModal.js +2 -2
- package/dist/cjs/components/modals/styledModal.js.map +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuItem.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/MenuItem.js.map +1 -1
- package/dist/cjs/components/pagination/Pagination.js +1 -1
- package/dist/cjs/components/pagination/Pagination.js.map +1 -1
- package/dist/cjs/components/progress-bar/CircularProgressBar.js +1 -1
- package/dist/cjs/components/progress-bar/CircularProgressBar.js.map +1 -1
- package/dist/cjs/components/progress-bar/ProgressBarComponent.js +2 -2
- package/dist/cjs/components/progress-bar/ProgressBarComponent.js.map +1 -1
- package/dist/cjs/components/progress-bar-v2/ProgressBarV2.js +17 -17
- package/dist/cjs/components/progress-bar-v2/ProgressBarV2.js.map +1 -1
- package/dist/cjs/components/radioButton/RadioButton.js +1 -1
- package/dist/cjs/components/radioButton/RadioButton.js.map +1 -1
- package/dist/cjs/components/radioList/RadioList.js +1 -1
- package/dist/cjs/components/radioList/RadioList.js.map +1 -1
- package/dist/cjs/components/searchBar/searchBar.js +1 -1
- package/dist/cjs/components/searchBar/searchBar.js.map +1 -1
- package/dist/cjs/components/shimmer-image/ShimmerImage.js +1 -1
- package/dist/cjs/components/shimmer-image/ShimmerImage.js.map +1 -1
- package/dist/cjs/components/side-modal/SideModal.js +1 -1
- package/dist/cjs/components/side-modal/SideModal.js.map +1 -1
- package/dist/cjs/components/spinner/Spinner.js +3 -3
- package/dist/cjs/components/spinner/Spinner.js.map +1 -1
- package/dist/cjs/components/star-rating/Star.js +1 -1
- package/dist/cjs/components/star-rating/Star.js.map +1 -1
- package/dist/cjs/components/star-rating/StarRating.js +2 -2
- package/dist/cjs/components/star-rating/StarRating.js.map +1 -1
- package/dist/cjs/components/states/StateComponent.js +1 -1
- package/dist/cjs/components/states/StateComponent.js.map +1 -1
- package/dist/cjs/components/stepper/Stepper.js +1 -1
- package/dist/cjs/components/stepper/Stepper.js.map +1 -1
- package/dist/cjs/components/template-preview/TemplatePreview.js +1 -1
- package/dist/cjs/components/template-preview/TemplatePreview.js.map +1 -1
- package/dist/cjs/components/testimonial-card/TestimonialCard.js +1 -1
- package/dist/cjs/components/testimonial-card/TestimonialCard.js.map +1 -1
- package/dist/cjs/components/thumbnail/Thumbnail.js +1 -1
- package/dist/cjs/components/thumbnail/Thumbnail.js.map +1 -1
- package/dist/cjs/components/unsatisfactory-response-list/UnsatisfactoryResponseList.js +1 -1
- package/dist/cjs/components/unsatisfactory-response-list/UnsatisfactoryResponseList.js.map +1 -1
- package/dist/cjs/components/zeroState/ZeroState.js +3 -3
- package/dist/cjs/components/zeroState/ZeroState.js.map +1 -1
- package/dist/cjs/icons/Media/Visual/FormkitNeutral.js +2 -0
- package/dist/cjs/icons/Media/Visual/FormkitNeutral.js.map +1 -0
- package/dist/cjs/icons/Media/Visual/FormkitSad.js +2 -0
- package/dist/cjs/icons/Media/Visual/FormkitSad.js.map +1 -0
- package/dist/cjs/icons/index.js +1 -1
- package/dist/esm/components/BikGiftedChat/GiftedChat/GiftedChat.js +66 -61
- package/dist/esm/components/BikGiftedChat/GiftedChat/GiftedChat.js.map +1 -1
- package/dist/esm/components/SearchFilter/index.js +11 -10
- package/dist/esm/components/SearchFilter/index.js.map +1 -1
- package/dist/esm/components/agent-builder/constants/tools.js.map +1 -1
- package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsChip.js +11 -10
- package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsChip.js.map +1 -1
- package/dist/esm/components/avatar/Avatar.d.ts +2 -1
- package/dist/esm/components/avatar/Avatar.js +34 -24
- package/dist/esm/components/avatar/Avatar.js.map +1 -1
- package/dist/esm/components/avatar/Avatar.styled.d.ts +1 -0
- package/dist/esm/components/avatar/Avatar.styled.js +17 -8
- package/dist/esm/components/avatar/Avatar.styled.js.map +1 -1
- package/dist/esm/components/button/themes.d.ts +1 -0
- package/dist/esm/components/button/themes.js +61 -51
- package/dist/esm/components/button/themes.js.map +1 -1
- package/dist/esm/components/card-selector/CardSelector.js +11 -9
- package/dist/esm/components/card-selector/CardSelector.js.map +1 -1
- package/dist/esm/components/card-selector/CardSelectorGroup.js +1 -0
- package/dist/esm/components/card-selector/CardSelectorGroup.js.map +1 -1
- package/dist/esm/components/carousel/carousel.js +8 -8
- package/dist/esm/components/carousel/carousel.js.map +1 -1
- package/dist/esm/components/checkBox/CheckBox.js +8 -5
- package/dist/esm/components/checkBox/CheckBox.js.map +1 -1
- package/dist/esm/components/code-block/CodeBlock.js +14 -14
- package/dist/esm/components/code-block/CodeBlock.js.map +1 -1
- package/dist/esm/components/colourInput/ColourInput.js +11 -10
- package/dist/esm/components/colourInput/ColourInput.js.map +1 -1
- package/dist/esm/components/dashboard-review-popup/DashboardReviewPopUp.js +28 -21
- package/dist/esm/components/dashboard-review-popup/DashboardReviewPopUp.js.map +1 -1
- package/dist/esm/components/dot-pulse/DotPulse.js +15 -15
- package/dist/esm/components/dot-pulse/DotPulse.js.map +1 -1
- package/dist/esm/components/dropShadow/DropShadow.js +6 -6
- package/dist/esm/components/dropShadow/DropShadow.js.map +1 -1
- package/dist/esm/components/dropdown/ChipInput.js +10 -9
- package/dist/esm/components/dropdown/ChipInput.js.map +1 -1
- package/dist/esm/components/dropdown/DropdownPopover/index.js +26 -25
- package/dist/esm/components/dropdown/DropdownPopover/index.js.map +1 -1
- package/dist/esm/components/dropdown-button/DropdownButton.js +13 -13
- package/dist/esm/components/dropdown-button/DropdownButton.js.map +1 -1
- package/dist/esm/components/floater/floater.js +14 -13
- package/dist/esm/components/floater/floater.js.map +1 -1
- package/dist/esm/components/input/Input.js +35 -34
- package/dist/esm/components/input/Input.js.map +1 -1
- package/dist/esm/components/input/Input.model.d.ts +1 -0
- package/dist/esm/components/modals/styledModal.js +6 -5
- package/dist/esm/components/modals/styledModal.js.map +1 -1
- package/dist/esm/components/multi-level-dropdown/MenuItem.js +28 -27
- package/dist/esm/components/multi-level-dropdown/MenuItem.js.map +1 -1
- package/dist/esm/components/pagination/Pagination.js +7 -7
- package/dist/esm/components/pagination/Pagination.js.map +1 -1
- package/dist/esm/components/progress-bar/CircularProgressBar.js +61 -50
- package/dist/esm/components/progress-bar/CircularProgressBar.js.map +1 -1
- package/dist/esm/components/progress-bar/ProgressBarComponent.js +14 -13
- package/dist/esm/components/progress-bar/ProgressBarComponent.js.map +1 -1
- package/dist/esm/components/progress-bar-v2/ProgressBarV2.js +57 -39
- package/dist/esm/components/progress-bar-v2/ProgressBarV2.js.map +1 -1
- package/dist/esm/components/radioButton/RadioButton.js +10 -9
- package/dist/esm/components/radioButton/RadioButton.js.map +1 -1
- package/dist/esm/components/radioList/RadioList.js +28 -19
- package/dist/esm/components/radioList/RadioList.js.map +1 -1
- package/dist/esm/components/searchBar/searchBar.js +11 -10
- package/dist/esm/components/searchBar/searchBar.js.map +1 -1
- package/dist/esm/components/shimmer-image/ShimmerImage.js +19 -18
- package/dist/esm/components/shimmer-image/ShimmerImage.js.map +1 -1
- package/dist/esm/components/side-modal/SideModal.js +13 -5
- package/dist/esm/components/side-modal/SideModal.js.map +1 -1
- package/dist/esm/components/spinner/Spinner.js +19 -11
- package/dist/esm/components/spinner/Spinner.js.map +1 -1
- package/dist/esm/components/star-rating/Star.d.ts +1 -0
- package/dist/esm/components/star-rating/Star.js +32 -27
- package/dist/esm/components/star-rating/Star.js.map +1 -1
- package/dist/esm/components/star-rating/StarRating.js +17 -16
- package/dist/esm/components/star-rating/StarRating.js.map +1 -1
- package/dist/esm/components/states/StateComponent.js +47 -30
- package/dist/esm/components/states/StateComponent.js.map +1 -1
- package/dist/esm/components/stepper/Stepper.js +24 -16
- package/dist/esm/components/stepper/Stepper.js.map +1 -1
- package/dist/esm/components/template-preview/TemplatePreview.js +41 -40
- package/dist/esm/components/template-preview/TemplatePreview.js.map +1 -1
- package/dist/esm/components/testimonial-card/TestimonialCard.js +5 -4
- package/dist/esm/components/testimonial-card/TestimonialCard.js.map +1 -1
- package/dist/esm/components/thumbnail/Thumbnail.js +3 -3
- package/dist/esm/components/thumbnail/Thumbnail.js.map +1 -1
- package/dist/esm/components/unsatisfactory-response-list/UnsatisfactoryResponseList.js +19 -18
- package/dist/esm/components/unsatisfactory-response-list/UnsatisfactoryResponseList.js.map +1 -1
- package/dist/esm/components/zeroState/ZeroState.js +20 -13
- package/dist/esm/components/zeroState/ZeroState.js.map +1 -1
- package/dist/esm/icons/Media/Visual/FormkitNeutral.js +58 -0
- package/dist/esm/icons/Media/Visual/FormkitNeutral.js.map +1 -0
- package/dist/esm/icons/Media/Visual/FormkitSad.js +61 -0
- package/dist/esm/icons/Media/Visual/FormkitSad.js.map +1 -0
- package/dist/esm/icons/Media/Visual/index.d.ts +2 -0
- package/dist/esm/icons/index.d.ts +25 -25
- package/dist/esm/icons/index.js +420 -416
- package/dist/esm/icons/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),n=require("react"),_=require("../../../constants/Theme.js"),ee=require("../../../hooks/useWindowSize.js"),te=require("../../TypographyStyle.js"),p=require("../Bubble/types.js"),se=require("./Day.js"),W=require("./messageHelpers.js"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),n=require("react"),_=require("../../../constants/Theme.js"),ee=require("../../../hooks/useWindowSize.js"),te=require("../../TypographyStyle.js"),p=require("../Bubble/types.js"),se=require("./Day.js"),W=require("./messageHelpers.js"),C=require("./scrollHooks.js"),V=require("./types.js"),b=require("./utils.js"),re=require("../../button/Button.js"),ne=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},oe=ne(n),I=204,ie=({text:l,isExpanded:g,onToggle:i})=>{const a=n.useRef(null),[A,R]=n.useState(!1);return n.useEffect(()=>{const y=a.current;if(y){y.style.maxHeight="none";const P=y.scrollHeight>I;y.style.maxHeight=g?"none":`${I}px`,R(P)}},[l,g]),s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:a,style:{maxHeight:g?"none":I,overflow:"hidden"},children:s.jsx(te.BodySecondary,{children:l})}),A&&s.jsx(re.Button,{buttonType:"text",size:"xs",buttonText:g?"Show less":"Read more",onClick:i})]})},le=(l,g)=>{const{messages:i=[],user:a,renderBubble:A,renderAvatar:R,renderDay:y,renderLoading:P,renderChatEmpty:q,listViewProps:O={},renderAvatarOnTop:D=!1,showUserAvatar:j=!1,showAvatarForEveryMessage:L=!1,inverted:ce=!1,messageIdGenerator:B,topThreshold:U=b.TOP_THRESHOLD,appType:u=p.GiftedChatAppType.Bik,maxHeight:E,isActivityMessage:M,...N}=l||{},T=ee.useWindowSize(),Y=n.useRef(null),x=b.normalizeRef(O.ref||g,Y),S=n.useRef({isInitialMount:!0,isUserScrolling:!1,isLoadingOldMessages:!1,isAtBottom:!0,hasTriggeredEndReached:!1,lastMessagesLength:i?.length??0,previousScrollHeight:0,previousScrollTop:0,scrollTimeout:null}),[$,X]=n.useState(new Set),f=n.useMemo(()=>!i||i.length===0?[]:[...i].reverse(),[i]),J=n.useMemo(()=>{const e=[];return f.forEach((o,r)=>{const t=f[r-1];r===0||!b.isSameDay(o,t)?e.push({createdAt:o.createdAt,indices:[r]}):e[e.length-1].indices.push(r)}),e},[f]),G=C.useScrollToBottom(x,S);n.useImperativeHandle(g,()=>x.current),C.useInitialMountScroll(x,S,f.length,G),C.useScrollCleanup(S),C.useRestoreScrollPosition(x,S,f.length),C.useAutoScrollOnNewMessages(x,S,i.length,G),C.useResizeObserverForFirstMessage(i?.[0],S,G,B);const K=C.useScrollHandler(S,O.onEndReached,O.onScroll,U),h=n.useCallback(e=>!!(e&&a&&e.user?._id===a._id),[a]),z=n.useCallback((e,o)=>j?L||h(e)?!0:!o||(M?M(e):!1)||(M?M(o):!1)||o.user._id!==e.user._id:!1,[j,L,M,h]),Q=n.useCallback((e,o,r)=>{const t=h(e)?"right":"left",d=o?.user?._id!==e?.user?._id,m=r?.user?._id!==e?.user?._id,w={currentMessage:e,previousMessage:o,nextMessage:r,position:t,user:a,...N};if(A)return A(w);const c=e._id,k=$.has(c);return s.jsx("div",{style:{maxWidth:u===p.GiftedChatAppType.Manifest?"50%":"70%",width:"fit-content",...u===p.GiftedChatAppType.Manifest?{minWidth:"130px"}:{},padding:"8px 12px",borderTopLeftRadius:t==="left"?d?12:2:12,borderTopRightRadius:12,borderBottomLeftRadius:t==="left"?m?12:2:12,borderBottomRightRadius:12,border:t==="left"&&u===p.GiftedChatAppType.Manifest?"1px solid rgb(224, 224, 224)":"none",backgroundColor:t==="right"?u===p.GiftedChatAppType.Manifest?_.COLORS.background.brandTint:_.COLORS.background.brandLight:u===p.GiftedChatAppType.Manifest?_.COLORS.background.pureWhite:_.COLORS.background.inactive,color:_.COLORS.content.primary,wordBreak:"break-word"},children:s.jsx(ie,{text:e.text??"",isExpanded:k,onToggle:()=>X(H=>{const v=new Set(H);return k?v.delete(c):v.add(c),v})})})},[h,a,A,N,$]),F=n.useCallback((e,o,r)=>{if(!z(e,o))return null;const d=h(e)?"right":"left";return R?R({currentMessage:e,previousMessage:o,nextMessage:r,position:d,user:a,renderAvatarOnTop:D,showUserAvatar:j,showAvatarForEveryMessage:L}):null},[z,h,a,D,j,L,R]);return!i||i.length===0?q?s.jsx(s.Fragment,{children:q()}):null:s.jsxs("div",{ref:x,style:{flex:1,overflowY:"auto",overflowX:"hidden",display:"flex",flexDirection:"column",...E?{maxHeight:E,height:E}:{},...O.style},onScroll:K,children:[s.jsx("div",{style:{flex:"1 0 auto"}}),s.jsx("div",{style:{display:"flex",flexDirection:"column",flex:"0 0 auto"},children:J.map((e,o)=>s.jsxs("div",{children:[y?s.jsx("div",{style:{position:"sticky",top:0,zIndex:2},children:y({createdAt:e.createdAt})}):s.jsx(se.Day,{createdAt:e.createdAt,appType:u,scrollRootRef:x}),e.indices.map(r=>{const t=f[r],d=t?.channelId===V.MESSAGE_CHANNELS.SMTP||t?.channelName===V.MESSAGE_CHANNELS.SMTP,m=d?"left":h(t)?"right":"left",w=f[r-1],c=f[r+1],k=W.getMessagePlacement(t,m),H=W.shouldCenterAlign(t),v=t.category===b.Constants.ChatActivity.Category.ACTIVITY&&t.activityType===b.Constants.ChatActivity.Type.PRIVATE_NOTE,Z=t.category===b.Constants.ChatActivity.Category.ACTIVITY&&!v;return s.jsx(oe.default.Fragment,{children:s.jsxs("div",{style:{...T?{margin:"0 4px"}:{},...H?{}:{display:"flex",alignItems:"flex-start"},...u!==p.GiftedChatAppType.Manifest?!T&&m==="right"?{marginLeft:8}:{marginRight:8}:{},...d&&!v&&T?{marginLeft:8,marginRight:8}:{},...d&&v?{marginRight:16}:{},justifyContent:k,marginBottom:d?c?24:0:c?c?.user?._id===t?.user?._id?h(t)?20:4:20:0,...Z?{marginLeft:0,marginBottom:0}:{}},children:[!T&&m==="left"&&s.jsx("div",{style:{marginRight:"4px",width:"24px",flexShrink:0},children:F(t,w,c)}),s.jsx("div",{id:`message-bubble-${t._id??`${r}-${B?.()??"id"}`}`,style:u===p.GiftedChatAppType.Manifest?{width:"100%"}:T||d?{display:"flex",flexGrow:1,width:"100%"}:{},children:Q(t,w,c)}),!T&&m==="right"&&s.jsx("div",{style:{marginLeft:"4px",width:"24px",flexShrink:0,alignSelf:"flex-start"},children:F(t,w,c)})]})},t._id??`${r}-${B?.()??"id"}`)})]},`day-group-${o}`))})]})},ae=n.forwardRef(le);exports.default=ae;
|
|
2
2
|
//# sourceMappingURL=GiftedChat.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GiftedChat.js","sources":["../../../../../src/components/BikGiftedChat/GiftedChat/GiftedChat.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { Button } from '../../button';\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 COLLAPSED_MAX_HEIGHT = 204;\n\nconst CollapsibleBubbleText: React.FC<{\n\ttext: string;\n\tisExpanded: boolean;\n\tonToggle: () => void;\n}> = ({ text, isExpanded, onToggle }) => {\n\tconst textRef = useRef<HTMLDivElement>(null);\n\tconst [isOverflowing, setIsOverflowing] = useState(false);\n\n\tuseEffect(() => {\n\t\tconst el = textRef.current;\n\t\tif (el) {\n\t\t\t// Temporarily remove max-height to measure true scroll height\n\t\t\tel.style.maxHeight = 'none';\n\t\t\tconst overflows = el.scrollHeight > COLLAPSED_MAX_HEIGHT;\n\t\t\tel.style.maxHeight = isExpanded ? 'none' : `${COLLAPSED_MAX_HEIGHT}px`;\n\t\t\tsetIsOverflowing(overflows);\n\t\t}\n\t}, [text, isExpanded]);\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tref={textRef}\n\t\t\t\tstyle={{\n\t\t\t\t\tmaxHeight: isExpanded ? 'none' : COLLAPSED_MAX_HEIGHT,\n\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<BodySecondary>{text}</BodySecondary>\n\t\t\t</div>\n\t\t\t{isOverflowing && (\n\t\t\t\t<Button\n\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\tsize=\"xs\"\n\t\t\t\t\tbuttonText={isExpanded ? 'Show less' : 'Read more'}\n\t\t\t\t\tonClick={onToggle}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\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\tmaxHeight,\n\t\tisActivityMessage,\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\tconst [expandedMessages, setExpandedMessages] = useState<\n\t\tSet<string | number>\n\t>(new Set());\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\t// Group consecutive same-day messages so each day separator can stick\n\t// within its own section and get pushed out by the next day's separator.\n\tconst dayGroups = useMemo(() => {\n\t\tconst groups: { createdAt: IMessage['createdAt']; indices: number[] }[] =\n\t\t\t[];\n\t\treversedMessages.forEach((message, index) => {\n\t\t\tconst previousMessage = reversedMessages[index - 1];\n\t\t\tif (index === 0 || !isSameDay(message, previousMessage)) {\n\t\t\t\tgroups.push({ createdAt: message.createdAt, indices: [index] });\n\t\t\t} else {\n\t\t\t\tgroups[groups.length - 1].indices.push(index);\n\t\t\t}\n\t\t});\n\t\treturn groups;\n\t}, [reversedMessages]);\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, previousMessage?: IMessage) => {\n\t\t\tif (!showUserAvatar) return false;\n\t\t\tif (showAvatarForEveryMessage) return true;\n\n\t\t\t// Show avatar on the first message in a consecutive sender stack,\n\t\t\t// or when an activity interrupts the stack, or when the current message itself is an activity\n\t\t\treturn (\n\t\t\t\t!previousMessage ||\n\t\t\t\t(isActivityMessage ? isActivityMessage(message) : false) ||\n\t\t\t\t(isActivityMessage ? isActivityMessage(previousMessage) : false) ||\n\t\t\t\tpreviousMessage.user._id !== message.user._id\n\t\t\t);\n\t\t},\n\t\t[showUserAvatar, showAvatarForEveryMessage, isActivityMessage],\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\t\t\tconst isTopOfStack = previousMessage?.user?._id !== message?.user?._id;\n\t\t\tconst isBottomOfStack = nextMessage?.user?._id !== message?.user?._id;\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\tconst messageId = message._id;\n\t\t\tconst isExpanded = expandedMessages.has(messageId);\n\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\tborderTopLeftRadius:\n\t\t\t\t\t\t\tposition === 'left' ? (isTopOfStack ? 12 : 2) : 12,\n\t\t\t\t\t\tborderTopRightRadius:\n\t\t\t\t\t\t\tposition === 'right' ? (isTopOfStack ? 12 : 2) : 12,\n\t\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\t\tposition === 'left' ? (isBottomOfStack ? 12 : 2) : 12,\n\t\t\t\t\t\tborderBottomRightRadius:\n\t\t\t\t\t\t\tposition === 'right' ? (isBottomOfStack ? 12 : 2) : 12,\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<CollapsibleBubbleText\n\t\t\t\t\t\ttext={message.text ?? ''}\n\t\t\t\t\t\tisExpanded={isExpanded}\n\t\t\t\t\t\tonToggle={() =>\n\t\t\t\t\t\t\tsetExpandedMessages((prev) => {\n\t\t\t\t\t\t\t\tconst next = new Set(prev);\n\t\t\t\t\t\t\t\tif (isExpanded) next.delete(messageId);\n\t\t\t\t\t\t\t\telse next.add(messageId);\n\t\t\t\t\t\t\t\treturn next;\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t);\n\t\t},\n\t\t[isUserMessage, user, renderBubble, extraProps, expandedMessages],\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, previousMessage);\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...(maxHeight ? { maxHeight, height: maxHeight } : {}),\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{dayGroups.map((group, groupIndex) => (\n\t\t\t\t\t<div key={`day-group-${groupIndex}`}>\n\t\t\t\t\t\t{/* Day separator — sticks to top while this day scrolls past */}\n\t\t\t\t\t\t{renderDay ? (\n\t\t\t\t\t\t\t<div style={{ position: 'sticky', top: 0, zIndex: 2 }}>\n\t\t\t\t\t\t\t\t{renderDay({ createdAt: group.createdAt })}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<Day\n\t\t\t\t\t\t\t\tcreatedAt={group.createdAt}\n\t\t\t\t\t\t\t\tappType={appType}\n\t\t\t\t\t\t\t\tscrollRootRef={scrollRef}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{group.indices.map((index) => {\n\t\t\t\t\t\t\tconst message = reversedMessages[index];\n\t\t\t\t\t\t\tconst isSmtp =\n\t\t\t\t\t\t\t\tmessage?.['channelId'] === MESSAGE_CHANNELS.SMTP ||\n\t\t\t\t\t\t\t\tmessage?.['channelName'] === MESSAGE_CHANNELS.SMTP;\n\t\t\t\t\t\t\tconst position = isSmtp\n\t\t\t\t\t\t\t\t? 'left'\n\t\t\t\t\t\t\t\t: isUserMessage(message)\n\t\t\t\t\t\t\t\t? 'right'\n\t\t\t\t\t\t\t\t: 'left';\n\t\t\t\t\t\t\tconst previousMessage = reversedMessages[index - 1];\n\t\t\t\t\t\t\tconst nextMessage = reversedMessages[index + 1];\n\t\t\t\t\t\t\tconst placement = getMessagePlacement(message, position);\n\t\t\t\t\t\t\tconst isCentered = shouldCenterAlign(message);\n\t\t\t\t\t\t\t// Check if message is a private note\n\t\t\t\t\t\t\tconst isPrivateNote =\n\t\t\t\t\t\t\t\tmessage['category'] ===\n\t\t\t\t\t\t\t\t\tConstants.ChatActivity.Category.ACTIVITY &&\n\t\t\t\t\t\t\t\tmessage['activityType'] ===\n\t\t\t\t\t\t\t\t\tConstants.ChatActivity.Type.PRIVATE_NOTE;\n\t\t\t\t\t\t\tconst isActivity =\n\t\t\t\t\t\t\t\tmessage['category'] ===\n\t\t\t\t\t\t\t\t\tConstants.ChatActivity.Category.ACTIVITY && !isPrivateNote;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<React.Fragment\n\t\t\t\t\t\t\t\t\tkey={\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>\n\t\t\t\t\t\t\t\t\t{/* Message container */}\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\t...(isMobile ? { margin: '0 4px' } : {}),\n\t\t\t\t\t\t\t\t\t\t\t...(isCentered\n\t\t\t\t\t\t\t\t\t\t\t\t? {}\n\t\t\t\t\t\t\t\t\t\t\t\t: { display: 'flex', alignItems: 'flex-start' }),\n\t\t\t\t\t\t\t\t\t\t\t...(appType !== GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t\t\t\t? !isMobile && position === 'right'\n\t\t\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\t\t: { marginRight: 8 }\n\t\t\t\t\t\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\t\t\t\t\t\t...(isSmtp && !isPrivateNote && isMobile\n\t\t\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\t\t: {}),\n\t\t\t\t\t\t\t\t\t\t\t...(isSmtp && isPrivateNote ? { marginRight: 16 } : {}),\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: placement,\n\t\t\t\t\t\t\t\t\t\t\tmarginBottom: isSmtp\n\t\t\t\t\t\t\t\t\t\t\t\t? // SMTP: flat 24px between mails, no same/different-user split.\n\t\t\t\t\t\t\t\t\t\t\t\t nextMessage\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 24\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t\t\t\t: nextMessage\n\t\t\t\t\t\t\t\t\t\t\t\t? nextMessage?.user?._id === message?.user?._id\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 4\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 20\n\t\t\t\t\t\t\t\t\t\t\t\t: 0,\n\t\t\t\t\t\t\t\t\t\t\t// Activity cards: no left/bottom margin.\n\t\t\t\t\t\t\t\t\t\t\t...(isActivity ? { marginLeft: 0, marginBottom: 0 } : {}),\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{/* Left avatar or placeholder (for mobile, avatar is hidden) */}\n\t\t\t\t\t\t\t\t\t\t{!isMobile && position === 'left' && (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\tmarginRight: '4px',\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth: '24px',\n\t\t\t\t\t\t\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(\n\t\t\t\t\t\t\t\t\t\t\t\t\tmessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tpreviousMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tnextMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t{/* Message bubble */}\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tid={`message-bubble-${\n\t\t\t\t\t\t\t\t\t\t\t\tmessage._id ??\n\t\t\t\t\t\t\t\t\t\t\t\t`${index}-${messageIdGenerator?.() ?? 'id'}`\n\t\t\t\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\tappType === GiftedChatAppType.Manifest\n\t\t\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\t\t: isMobile || isSmtp\n\t\t\t\t\t\t\t\t\t\t\t\t\t? { display: 'flex', flexGrow: 1, width: '100%' }\n\t\t\t\t\t\t\t\t\t\t\t\t\t: {}\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\t\t{renderMessageBubble(\n\t\t\t\t\t\t\t\t\t\t\t\tmessage,\n\t\t\t\t\t\t\t\t\t\t\t\tpreviousMessage,\n\t\t\t\t\t\t\t\t\t\t\t\tnextMessage,\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t\t\t{/* Right avatar or placeholder (for mobile, avatar is hidden) */}\n\t\t\t\t\t\t\t\t\t\t{!isMobile && position === 'right' && (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\tmarginLeft: '4px',\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth: '24px',\n\t\t\t\t\t\t\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\talignSelf: 'flex-start',\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(\n\t\t\t\t\t\t\t\t\t\t\t\t\tmessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tpreviousMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tnextMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</React.Fragment>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</div>\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":["COLLAPSED_MAX_HEIGHT","CollapsibleBubbleText","text","isExpanded","onToggle","textRef","useRef","isOverflowing","setIsOverflowing","useState","useEffect","el","overflows","jsxs","Fragment","jsx","BodySecondary","Button","GiftedChatInner","props","forwardedRef","messages","user","renderBubble","renderAvatar","renderDay","renderLoading","renderChatEmpty","listViewProps","renderAvatarOnTop","showUserAvatar","showAvatarForEveryMessage","inverted","messageIdGenerator","topThreshold","TOP_THRESHOLD","appType","GiftedChatAppType","maxHeight","isActivityMessage","extraProps","isMobile","useWindowSize","internalScrollRef","scrollRef","normalizeRef","scrollState","expandedMessages","setExpandedMessages","reversedMessages","useMemo","dayGroups","groups","message","index","previousMessage","isSameDay","scrollToBottom","useScrollToBottom","useImperativeHandle","useInitialMountScroll","useScrollCleanup","useRestoreScrollPosition","useAutoScrollOnNewMessages","useResizeObserverForFirstMessage","handleScroll","useScrollHandler","isUserMessage","useCallback","shouldShowAvatar","renderMessageBubble","nextMessage","position","isTopOfStack","isBottomOfStack","bubbleProps","messageId","COLORS","prev","next","renderMessageAvatar","group","groupIndex","Day","isSmtp","MESSAGE_CHANNELS","placement","getMessagePlacement","isCentered","shouldCenterAlign","isPrivateNote","Constants","isActivity","React","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\tuseEffect,\n\tuseImperativeHandle,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport { COLORS } from '../../../constants/Theme';\nimport { useWindowSize } from '../../../hooks/useWindowSize';\nimport { Button } from '../../button';\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 COLLAPSED_MAX_HEIGHT = 204;\n\nconst CollapsibleBubbleText: React.FC<{\n\ttext: string;\n\tisExpanded: boolean;\n\tonToggle: () => void;\n}> = ({ text, isExpanded, onToggle }) => {\n\tconst textRef = useRef<HTMLDivElement>(null);\n\tconst [isOverflowing, setIsOverflowing] = useState(false);\n\n\tuseEffect(() => {\n\t\tconst el = textRef.current;\n\t\tif (el) {\n\t\t\t// Temporarily remove max-height to measure true scroll height\n\t\t\tel.style.maxHeight = 'none';\n\t\t\tconst overflows = el.scrollHeight > COLLAPSED_MAX_HEIGHT;\n\t\t\tel.style.maxHeight = isExpanded ? 'none' : `${COLLAPSED_MAX_HEIGHT}px`;\n\t\t\tsetIsOverflowing(overflows);\n\t\t}\n\t}, [text, isExpanded]);\n\n\treturn (\n\t\t<>\n\t\t\t<div\n\t\t\t\tref={textRef}\n\t\t\t\tstyle={{\n\t\t\t\t\tmaxHeight: isExpanded ? 'none' : COLLAPSED_MAX_HEIGHT,\n\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<BodySecondary>{text}</BodySecondary>\n\t\t\t</div>\n\t\t\t{isOverflowing && (\n\t\t\t\t<Button\n\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\tsize=\"xs\"\n\t\t\t\t\tbuttonText={isExpanded ? 'Show less' : 'Read more'}\n\t\t\t\t\tonClick={onToggle}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\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\tmaxHeight,\n\t\tisActivityMessage,\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\tconst [expandedMessages, setExpandedMessages] = useState<\n\t\tSet<string | number>\n\t>(new Set());\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\t// Group consecutive same-day messages so each day separator can stick\n\t// within its own section and get pushed out by the next day's separator.\n\tconst dayGroups = useMemo(() => {\n\t\tconst groups: { createdAt: IMessage['createdAt']; indices: number[] }[] =\n\t\t\t[];\n\t\treversedMessages.forEach((message, index) => {\n\t\t\tconst previousMessage = reversedMessages[index - 1];\n\t\t\tif (index === 0 || !isSameDay(message, previousMessage)) {\n\t\t\t\tgroups.push({ createdAt: message.createdAt, indices: [index] });\n\t\t\t} else {\n\t\t\t\tgroups[groups.length - 1].indices.push(index);\n\t\t\t}\n\t\t});\n\t\treturn groups;\n\t}, [reversedMessages]);\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, previousMessage?: IMessage) => {\n\t\t\tif (!showUserAvatar) return false;\n\t\t\tif (showAvatarForEveryMessage) return true;\n\n\t\t\tif (isUserMessage(message)) return true;\n\n\t\t\t// Show avatar on the first message in a consecutive sender stack,\n\t\t\t// or when an activity interrupts the stack, or when the current message itself is an activity\n\t\t\treturn (\n\t\t\t\t!previousMessage ||\n\t\t\t\t(isActivityMessage ? isActivityMessage(message) : false) ||\n\t\t\t\t(isActivityMessage ? isActivityMessage(previousMessage) : false) ||\n\t\t\t\tpreviousMessage.user._id !== message.user._id\n\t\t\t);\n\t\t},\n\t\t[\n\t\t\tshowUserAvatar,\n\t\t\tshowAvatarForEveryMessage,\n\t\t\tisActivityMessage,\n\t\t\tisUserMessage,\n\t\t],\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\t\t\tconst isTopOfStack = previousMessage?.user?._id !== message?.user?._id;\n\t\t\tconst isBottomOfStack = nextMessage?.user?._id !== message?.user?._id;\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\tconst messageId = message._id;\n\t\t\tconst isExpanded = expandedMessages.has(messageId);\n\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\tborderTopLeftRadius:\n\t\t\t\t\t\t\tposition === 'left' ? (isTopOfStack ? 12 : 2) : 12,\n\t\t\t\t\t\tborderTopRightRadius: 12,\n\t\t\t\t\t\tborderBottomLeftRadius:\n\t\t\t\t\t\t\tposition === 'left' ? (isBottomOfStack ? 12 : 2) : 12,\n\t\t\t\t\t\tborderBottomRightRadius: 12,\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<CollapsibleBubbleText\n\t\t\t\t\t\ttext={message.text ?? ''}\n\t\t\t\t\t\tisExpanded={isExpanded}\n\t\t\t\t\t\tonToggle={() =>\n\t\t\t\t\t\t\tsetExpandedMessages((prev) => {\n\t\t\t\t\t\t\t\tconst next = new Set(prev);\n\t\t\t\t\t\t\t\tif (isExpanded) next.delete(messageId);\n\t\t\t\t\t\t\t\telse next.add(messageId);\n\t\t\t\t\t\t\t\treturn next;\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t);\n\t\t},\n\t\t[isUserMessage, user, renderBubble, extraProps, expandedMessages],\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, previousMessage);\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...(maxHeight ? { maxHeight, height: maxHeight } : {}),\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{dayGroups.map((group, groupIndex) => (\n\t\t\t\t\t<div key={`day-group-${groupIndex}`}>\n\t\t\t\t\t\t{/* Day separator — sticks to top while this day scrolls past */}\n\t\t\t\t\t\t{renderDay ? (\n\t\t\t\t\t\t\t<div style={{ position: 'sticky', top: 0, zIndex: 2 }}>\n\t\t\t\t\t\t\t\t{renderDay({ createdAt: group.createdAt })}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<Day\n\t\t\t\t\t\t\t\tcreatedAt={group.createdAt}\n\t\t\t\t\t\t\t\tappType={appType}\n\t\t\t\t\t\t\t\tscrollRootRef={scrollRef}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{group.indices.map((index) => {\n\t\t\t\t\t\t\tconst message = reversedMessages[index];\n\t\t\t\t\t\t\tconst isSmtp =\n\t\t\t\t\t\t\t\tmessage?.['channelId'] === MESSAGE_CHANNELS.SMTP ||\n\t\t\t\t\t\t\t\tmessage?.['channelName'] === MESSAGE_CHANNELS.SMTP;\n\t\t\t\t\t\t\tconst position = isSmtp\n\t\t\t\t\t\t\t\t? 'left'\n\t\t\t\t\t\t\t\t: isUserMessage(message)\n\t\t\t\t\t\t\t\t? 'right'\n\t\t\t\t\t\t\t\t: 'left';\n\t\t\t\t\t\t\tconst previousMessage = reversedMessages[index - 1];\n\t\t\t\t\t\t\tconst nextMessage = reversedMessages[index + 1];\n\t\t\t\t\t\t\tconst placement = getMessagePlacement(message, position);\n\t\t\t\t\t\t\tconst isCentered = shouldCenterAlign(message);\n\t\t\t\t\t\t\t// Check if message is a private note\n\t\t\t\t\t\t\tconst isPrivateNote =\n\t\t\t\t\t\t\t\tmessage['category'] ===\n\t\t\t\t\t\t\t\t\tConstants.ChatActivity.Category.ACTIVITY &&\n\t\t\t\t\t\t\t\tmessage['activityType'] ===\n\t\t\t\t\t\t\t\t\tConstants.ChatActivity.Type.PRIVATE_NOTE;\n\t\t\t\t\t\t\tconst isActivity =\n\t\t\t\t\t\t\t\tmessage['category'] ===\n\t\t\t\t\t\t\t\t\tConstants.ChatActivity.Category.ACTIVITY && !isPrivateNote;\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<React.Fragment\n\t\t\t\t\t\t\t\t\tkey={\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>\n\t\t\t\t\t\t\t\t\t{/* Message container */}\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\t...(isMobile ? { margin: '0 4px' } : {}),\n\t\t\t\t\t\t\t\t\t\t\t...(isCentered\n\t\t\t\t\t\t\t\t\t\t\t\t? {}\n\t\t\t\t\t\t\t\t\t\t\t\t: { display: 'flex', alignItems: 'flex-start' }),\n\t\t\t\t\t\t\t\t\t\t\t...(appType !== GiftedChatAppType.Manifest\n\t\t\t\t\t\t\t\t\t\t\t\t? !isMobile && position === 'right'\n\t\t\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\t\t: { marginRight: 8 }\n\t\t\t\t\t\t\t\t\t\t\t\t: {}),\n\t\t\t\t\t\t\t\t\t\t\t...(isSmtp && !isPrivateNote && isMobile\n\t\t\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\t\t: {}),\n\t\t\t\t\t\t\t\t\t\t\t...(isSmtp && isPrivateNote ? { marginRight: 16 } : {}),\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: placement,\n\t\t\t\t\t\t\t\t\t\t\tmarginBottom: isSmtp\n\t\t\t\t\t\t\t\t\t\t\t\t? // SMTP: flat 24px between mails, no same/different-user split.\n\t\t\t\t\t\t\t\t\t\t\t\t nextMessage\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 24\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 0\n\t\t\t\t\t\t\t\t\t\t\t\t: nextMessage\n\t\t\t\t\t\t\t\t\t\t\t\t? nextMessage?.user?._id === message?.user?._id\n\t\t\t\t\t\t\t\t\t\t\t\t\t? isUserMessage(message)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 20\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 4\n\t\t\t\t\t\t\t\t\t\t\t\t\t: 20\n\t\t\t\t\t\t\t\t\t\t\t\t: 0,\n\t\t\t\t\t\t\t\t\t\t\t// Activity cards: no left/bottom margin.\n\t\t\t\t\t\t\t\t\t\t\t...(isActivity ? { marginLeft: 0, marginBottom: 0 } : {}),\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{/* Left avatar or placeholder (for mobile, avatar is hidden) */}\n\t\t\t\t\t\t\t\t\t\t{!isMobile && position === 'left' && (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\tmarginRight: '4px',\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth: '24px',\n\t\t\t\t\t\t\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(\n\t\t\t\t\t\t\t\t\t\t\t\t\tmessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tpreviousMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tnextMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t{/* Message bubble */}\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tid={`message-bubble-${\n\t\t\t\t\t\t\t\t\t\t\t\tmessage._id ??\n\t\t\t\t\t\t\t\t\t\t\t\t`${index}-${messageIdGenerator?.() ?? 'id'}`\n\t\t\t\t\t\t\t\t\t\t\t}`}\n\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\tappType === GiftedChatAppType.Manifest\n\t\t\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\t\t: isMobile || isSmtp\n\t\t\t\t\t\t\t\t\t\t\t\t\t? { display: 'flex', flexGrow: 1, width: '100%' }\n\t\t\t\t\t\t\t\t\t\t\t\t\t: {}\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\t\t{renderMessageBubble(\n\t\t\t\t\t\t\t\t\t\t\t\tmessage,\n\t\t\t\t\t\t\t\t\t\t\t\tpreviousMessage,\n\t\t\t\t\t\t\t\t\t\t\t\tnextMessage,\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t\t\t{/* Right avatar or placeholder (for mobile, avatar is hidden) */}\n\t\t\t\t\t\t\t\t\t\t{!isMobile && position === 'right' && (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\t\tmarginLeft: '4px',\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth: '24px',\n\t\t\t\t\t\t\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\talignSelf: 'flex-start',\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{renderMessageAvatar(\n\t\t\t\t\t\t\t\t\t\t\t\t\tmessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tpreviousMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t\tnextMessage,\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</React.Fragment>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</div>\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":["COLLAPSED_MAX_HEIGHT","CollapsibleBubbleText","text","isExpanded","onToggle","textRef","useRef","isOverflowing","setIsOverflowing","useState","useEffect","el","overflows","jsxs","Fragment","jsx","BodySecondary","Button","GiftedChatInner","props","forwardedRef","messages","user","renderBubble","renderAvatar","renderDay","renderLoading","renderChatEmpty","listViewProps","renderAvatarOnTop","showUserAvatar","showAvatarForEveryMessage","inverted","messageIdGenerator","topThreshold","TOP_THRESHOLD","appType","GiftedChatAppType","maxHeight","isActivityMessage","extraProps","isMobile","useWindowSize","internalScrollRef","scrollRef","normalizeRef","scrollState","expandedMessages","setExpandedMessages","reversedMessages","useMemo","dayGroups","groups","message","index","previousMessage","isSameDay","scrollToBottom","useScrollToBottom","useImperativeHandle","useInitialMountScroll","useScrollCleanup","useRestoreScrollPosition","useAutoScrollOnNewMessages","useResizeObserverForFirstMessage","handleScroll","useScrollHandler","isUserMessage","useCallback","shouldShowAvatar","renderMessageBubble","nextMessage","position","isTopOfStack","isBottomOfStack","bubbleProps","messageId","COLORS","prev","next","renderMessageAvatar","group","groupIndex","Day","isSmtp","MESSAGE_CHANNELS","placement","getMessagePlacement","isCentered","shouldCenterAlign","isPrivateNote","Constants","isActivity","React","GiftedChat","forwardRef"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),f=require("react"),j=require("./components/FilterChipListRenderer.js"),q=require("./components/SearchFilterItem.js"),p=require("./types/SearchFilter.type.js"),R=require("../searchBar/searchBar.js"),D=({direction:o="row",schema:d,variant:w,onChange:x,showSelectedChips:F})=>{const i=f.useRef(d?.filter(e=>e.defaultValue).map(e=>({id:e.id,value:e.defaultValue,type:e.type,text:e.text}))??[]),[y,h]=f.useState([]),u=d.find(e=>e.type===p.FilterType.Search),S=e=>{u&&typeof e=="string"&&g(u.id,e)},g=(e,l)=>{const n=d.find(t=>t.id===e),s=[...y];if(n){const t=s.findIndex(r=>r.id===e);t!==-1?s[t]={id:n.id,value:l}:s.push({id:n.id,value:l}),i.current.find(r=>r.id===e)?i.current=i.current.map(r=>r.id===e?{id:r.id,value:l,type:r.type,text:r.text}:r):i.current=[...i.current,{id:e,value:l,type:n.type,text:n.text}],x(n.id,i.current,l),h([...s])}},v=(e,l)=>{const n=d.find(t=>t.id===e);let s=[...y];n&&(n.type===p.FilterType.Multiple?(s=s.map(t=>{if(t.id===e){const a=t.value.filter(r=>r.value!==l.value);return a.length?{...t,value:a}:null}return t}).filter(t=>!!t),i.current=i.current.map(t=>{if(t.id===e){const a=t.value?.filter(r=>r.value!==l.value);return a.length?{...t,value:a}:null}return t}).filter(t=>!!t)):(s=s.filter(t=>t.id!==e),i.current=i.current.filter(t=>t.id!==e)),x(n.id,i.current,l),h([...s]))};return c.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:8},children:[c.jsxs("div",{"data-testid":"search-filter-row",style:{display:"flex",flexDirection:o,gap:8,flexWrap:"wrap",alignItems:o==="row"?"center":"self-start"},children:[u&&c.jsx(R.SearchBar,{width:u.width?.toString()??"100%",isEnabled:!0,onChange:S,onEnter:S,placeholder:u.text,variant:"small"}),c.jsx("div",{style:{display:"flex",flexDirection:"row",gap:8,flexWrap:"wrap",alignItems:o==="row"?"center":"self-start"},children:d.filter(e=>e.type!==p.FilterType.Search).map((e,l)=>f.createElement(q.SearchFilterItem,{...e,key:l,variant:w,onChange:n=>{g(e.id,n)}}))})]}),F&&c.jsx("div",{style:{display:"flex",flexDirection:"row",gap:8},children:c.jsx(j.FilterChipListRenderer,{selectedState:i.current,onDeSelect:v})})]})};exports.SearchFilter=D;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/SearchFilter/index.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { SingleOption } from '../dropdown/type';\nimport { SearchBar } from '../searchBar';\nimport { FilterChipListRenderer } from './components/FilterChipListRenderer';\nimport { SearchFilterItem } from './components/SearchFilterItem';\nimport {\n\tFilterType,\n\tFilterValueType,\n\tSearchFilterOutputState,\n\tSearchFilterProps,\n} from './types/SearchFilter.type';\n\nexport const SearchFilter: React.FC<SearchFilterProps> = ({\n\tdirection = 'row',\n\tschema,\n\tvariant,\n\tonChange,\n\tshowSelectedChips,\n}) => {\n\t/** this will always have the latest value and all the selected ids */\n\tconst selectedStateRef = useRef<SearchFilterOutputState[]>(\n\t\tschema\n\t\t\t?.filter((filterItem) => filterItem.defaultValue)\n\t\t\t.map(\n\t\t\t\t(filterItem) =>\n\t\t\t\t\t({\n\t\t\t\t\t\tid: filterItem.id,\n\t\t\t\t\t\tvalue: filterItem.defaultValue,\n\t\t\t\t\t\ttype: filterItem.type,\n\t\t\t\t\t\ttext: filterItem.text,\n\t\t\t\t\t} as SearchFilterOutputState),\n\t\t\t) ?? [],\n\t);\n\n\tconst [selectedIds, setSelectedIds] = useState<\n\t\t{ id: string; value: FilterValueType }[]\n\t>([]);\n\n\tconst searchSchema = schema.find(\n\t\t(filterItem) => filterItem.type === FilterType.Search,\n\t);\n\n\tconst onSearchChange = (searchText: string) => {\n\t\tif (searchSchema && typeof searchText === 'string') {\n\t\t\tselect(searchSchema.id, searchText);\n\t\t}\n\t};\n\n\tconst select = (id: string, value: FilterValueType) => {\n\t\tconst selectedSchema = schema.find((schemaItem) => schemaItem.id === id);\n\t\tconst localSelectedIds = [...selectedIds];\n\n\t\tif (selectedSchema) {\n\t\t\tconst idx = localSelectedIds.findIndex((el) => el.id === id);\n\t\t\tif (idx !== -1) {\n\t\t\t\tlocalSelectedIds[idx] = { id: selectedSchema.id, value };\n\t\t\t} else {\n\t\t\t\tlocalSelectedIds.push({ id: selectedSchema.id, value });\n\t\t\t}\n\n\t\t\t/**\n\t\t\t * loop through selectedStateRef.current and if `id` present (1), update the value\n\t\t\t * and if id not present (2), push\n\t\t\t */\n\n\t\t\tconst idPresent = selectedStateRef.current.find(\n\t\t\t\t(selectedSchemaItem) => selectedSchemaItem.id === id,\n\t\t\t);\n\n\t\t\tif (idPresent) {\n\t\t\t\t/** (1) */\n\t\t\t\tselectedStateRef.current = selectedStateRef.current.map(\n\t\t\t\t\t(selectedSchemaItem) => {\n\t\t\t\t\t\tif (selectedSchemaItem.id === id) {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\tid: selectedSchemaItem.id,\n\t\t\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t\t\t\ttype: selectedSchemaItem.type,\n\t\t\t\t\t\t\t\ttext: selectedSchemaItem.text,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn selectedSchemaItem;\n\t\t\t\t\t},\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\t/** (2) */\n\t\t\t\tselectedStateRef.current = [\n\t\t\t\t\t...selectedStateRef.current,\n\t\t\t\t\t{\n\t\t\t\t\t\tid: id,\n\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t\ttype: selectedSchema.type,\n\t\t\t\t\t\ttext: selectedSchema.text,\n\t\t\t\t\t},\n\t\t\t\t];\n\t\t\t}\n\n\t\t\tonChange(selectedSchema.id, selectedStateRef.current, value);\n\n\t\t\tsetSelectedIds([...localSelectedIds]);\n\t\t}\n\t};\n\n\tconst deSelect = (id: string, value?: FilterValueType) => {\n\t\tconst selectedSchema = schema.find((schemaItem) => schemaItem.id === id);\n\t\tlet localSelectedIds = [...selectedIds];\n\t\tif (selectedSchema) {\n\t\t\t/**\n\t\t\t * only FilterType.Multiple, id can be present in selectedIds and selectedStateRef, so\n\t\t\t * delete id always except for FilterType.Multiple,\n\t\t\t *\n\t\t\t * for FilterType.Multiple,\n\t\t\t * \t\tif value.length === 0, delete id\n\t\t\t * \t\telse\n\t\t\t * \t\t\tjust update the value\n\t\t\t *\n\t\t\t */\n\n\t\t\tif (selectedSchema.type === FilterType.Multiple) {\n\t\t\t\t/** only update value i.e remove value from selectedItem.value */\n\t\t\t\tlocalSelectedIds = localSelectedIds\n\t\t\t\t\t.map((selected) => {\n\t\t\t\t\t\tif (selected.id === id) {\n\t\t\t\t\t\t\tconst newVal = (selected.value as SingleOption[]).filter(\n\t\t\t\t\t\t\t\t(val) => val.value !== (value as SingleOption).value,\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tif (newVal.length) {\n\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t...selected,\n\t\t\t\t\t\t\t\t\tvalue: newVal,\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\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn selected;\n\t\t\t\t\t})\n\t\t\t\t\t.filter((selected) => !!selected) as {\n\t\t\t\t\tid: string;\n\t\t\t\t\tvalue: FilterValueType;\n\t\t\t\t}[];\n\n\t\t\t\tselectedStateRef.current = selectedStateRef.current\n\t\t\t\t\t.map((selectedItem) => {\n\t\t\t\t\t\tif (selectedItem.id === id) {\n\t\t\t\t\t\t\tconst newVal = (selectedItem.value as SingleOption[])?.filter(\n\t\t\t\t\t\t\t\t(val) => val.value !== (value as SingleOption).value,\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tif (newVal.length) {\n\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t...selectedItem,\n\t\t\t\t\t\t\t\t\tvalue: newVal,\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn selectedItem;\n\t\t\t\t\t})\n\t\t\t\t\t.filter((selected) => !!selected) as SearchFilterOutputState[];\n\t\t\t} else {\n\t\t\t\t/** Delete */\n\t\t\t\tlocalSelectedIds = localSelectedIds.filter(\n\t\t\t\t\t(selected) => selected.id !== id,\n\t\t\t\t);\n\n\t\t\t\tselectedStateRef.current = selectedStateRef.current.filter(\n\t\t\t\t\t(selectedItem) => selectedItem.id !== id,\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tonChange(selectedSchema.id, selectedStateRef.current, value);\n\n\t\t\tsetSelectedIds([...localSelectedIds]);\n\t\t}\n\t};\n\n\treturn (\n\t\t<div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: direction,\n\t\t\t\t\tgap: 8,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\talignItems: direction === 'row' ? 'center' : 'self-start',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{searchSchema && (\n\t\t\t\t\t<SearchBar\n\t\t\t\t\t\twidth={searchSchema.width?.toString() ?? '100%'}\n\t\t\t\t\t\tisEnabled={true}\n\t\t\t\t\t\tonChange={onSearchChange}\n\t\t\t\t\t\tonEnter={onSearchChange}\n\t\t\t\t\t\tplaceholder={searchSchema.text}\n\t\t\t\t\t\tvariant={'small'}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\talignItems: direction === 'row' ? 'center' : 'self-start',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{schema\n\t\t\t\t\t\t.filter((filterItem) => filterItem.type !== FilterType.Search)\n\t\t\t\t\t\t.map((filterItem, i) => (\n\t\t\t\t\t\t\t<SearchFilterItem\n\t\t\t\t\t\t\t\t{...filterItem}\n\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\t\tonChange={(val) => {\n\t\t\t\t\t\t\t\t\tselect(filterItem.id, val);\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</div>\n\t\t\t</div>\n\t\t\t{showSelectedChips && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<FilterChipListRenderer\n\t\t\t\t\t\tselectedState={selectedStateRef.current}\n\t\t\t\t\t\tonDeSelect={deSelect}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["SearchFilter","direction","schema","variant","onChange","showSelectedChips","selectedStateRef","useRef","filterItem","selectedIds","setSelectedIds","useState","searchSchema","FilterType","onSearchChange","searchText","select","id","value","selectedSchema","schemaItem","localSelectedIds","idx","el","selectedSchemaItem","deSelect","selected","newVal","val","selectedItem","jsxs","jsx","SearchBar","i","createElement","SearchFilterItem","FilterChipListRenderer"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/SearchFilter/index.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { SingleOption } from '../dropdown/type';\nimport { SearchBar } from '../searchBar';\nimport { FilterChipListRenderer } from './components/FilterChipListRenderer';\nimport { SearchFilterItem } from './components/SearchFilterItem';\nimport {\n\tFilterType,\n\tFilterValueType,\n\tSearchFilterOutputState,\n\tSearchFilterProps,\n} from './types/SearchFilter.type';\n\nexport const SearchFilter: React.FC<SearchFilterProps> = ({\n\tdirection = 'row',\n\tschema,\n\tvariant,\n\tonChange,\n\tshowSelectedChips,\n}) => {\n\t/** this will always have the latest value and all the selected ids */\n\tconst selectedStateRef = useRef<SearchFilterOutputState[]>(\n\t\tschema\n\t\t\t?.filter((filterItem) => filterItem.defaultValue)\n\t\t\t.map(\n\t\t\t\t(filterItem) =>\n\t\t\t\t\t({\n\t\t\t\t\t\tid: filterItem.id,\n\t\t\t\t\t\tvalue: filterItem.defaultValue,\n\t\t\t\t\t\ttype: filterItem.type,\n\t\t\t\t\t\ttext: filterItem.text,\n\t\t\t\t\t} as SearchFilterOutputState),\n\t\t\t) ?? [],\n\t);\n\n\tconst [selectedIds, setSelectedIds] = useState<\n\t\t{ id: string; value: FilterValueType }[]\n\t>([]);\n\n\tconst searchSchema = schema.find(\n\t\t(filterItem) => filterItem.type === FilterType.Search,\n\t);\n\n\tconst onSearchChange = (searchText: string) => {\n\t\tif (searchSchema && typeof searchText === 'string') {\n\t\t\tselect(searchSchema.id, searchText);\n\t\t}\n\t};\n\n\tconst select = (id: string, value: FilterValueType) => {\n\t\tconst selectedSchema = schema.find((schemaItem) => schemaItem.id === id);\n\t\tconst localSelectedIds = [...selectedIds];\n\n\t\tif (selectedSchema) {\n\t\t\tconst idx = localSelectedIds.findIndex((el) => el.id === id);\n\t\t\tif (idx !== -1) {\n\t\t\t\tlocalSelectedIds[idx] = { id: selectedSchema.id, value };\n\t\t\t} else {\n\t\t\t\tlocalSelectedIds.push({ id: selectedSchema.id, value });\n\t\t\t}\n\n\t\t\t/**\n\t\t\t * loop through selectedStateRef.current and if `id` present (1), update the value\n\t\t\t * and if id not present (2), push\n\t\t\t */\n\n\t\t\tconst idPresent = selectedStateRef.current.find(\n\t\t\t\t(selectedSchemaItem) => selectedSchemaItem.id === id,\n\t\t\t);\n\n\t\t\tif (idPresent) {\n\t\t\t\t/** (1) */\n\t\t\t\tselectedStateRef.current = selectedStateRef.current.map(\n\t\t\t\t\t(selectedSchemaItem) => {\n\t\t\t\t\t\tif (selectedSchemaItem.id === id) {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\tid: selectedSchemaItem.id,\n\t\t\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t\t\t\ttype: selectedSchemaItem.type,\n\t\t\t\t\t\t\t\ttext: selectedSchemaItem.text,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn selectedSchemaItem;\n\t\t\t\t\t},\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\t/** (2) */\n\t\t\t\tselectedStateRef.current = [\n\t\t\t\t\t...selectedStateRef.current,\n\t\t\t\t\t{\n\t\t\t\t\t\tid: id,\n\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t\ttype: selectedSchema.type,\n\t\t\t\t\t\ttext: selectedSchema.text,\n\t\t\t\t\t},\n\t\t\t\t];\n\t\t\t}\n\n\t\t\tonChange(selectedSchema.id, selectedStateRef.current, value);\n\n\t\t\tsetSelectedIds([...localSelectedIds]);\n\t\t}\n\t};\n\n\tconst deSelect = (id: string, value?: FilterValueType) => {\n\t\tconst selectedSchema = schema.find((schemaItem) => schemaItem.id === id);\n\t\tlet localSelectedIds = [...selectedIds];\n\t\tif (selectedSchema) {\n\t\t\t/**\n\t\t\t * only FilterType.Multiple, id can be present in selectedIds and selectedStateRef, so\n\t\t\t * delete id always except for FilterType.Multiple,\n\t\t\t *\n\t\t\t * for FilterType.Multiple,\n\t\t\t * \t\tif value.length === 0, delete id\n\t\t\t * \t\telse\n\t\t\t * \t\t\tjust update the value\n\t\t\t *\n\t\t\t */\n\n\t\t\tif (selectedSchema.type === FilterType.Multiple) {\n\t\t\t\t/** only update value i.e remove value from selectedItem.value */\n\t\t\t\tlocalSelectedIds = localSelectedIds\n\t\t\t\t\t.map((selected) => {\n\t\t\t\t\t\tif (selected.id === id) {\n\t\t\t\t\t\t\tconst newVal = (selected.value as SingleOption[]).filter(\n\t\t\t\t\t\t\t\t(val) => val.value !== (value as SingleOption).value,\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tif (newVal.length) {\n\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t...selected,\n\t\t\t\t\t\t\t\t\tvalue: newVal,\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\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn selected;\n\t\t\t\t\t})\n\t\t\t\t\t.filter((selected) => !!selected) as {\n\t\t\t\t\tid: string;\n\t\t\t\t\tvalue: FilterValueType;\n\t\t\t\t}[];\n\n\t\t\t\tselectedStateRef.current = selectedStateRef.current\n\t\t\t\t\t.map((selectedItem) => {\n\t\t\t\t\t\tif (selectedItem.id === id) {\n\t\t\t\t\t\t\tconst newVal = (selectedItem.value as SingleOption[])?.filter(\n\t\t\t\t\t\t\t\t(val) => val.value !== (value as SingleOption).value,\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\tif (newVal.length) {\n\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t...selectedItem,\n\t\t\t\t\t\t\t\t\tvalue: newVal,\n\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\treturn selectedItem;\n\t\t\t\t\t})\n\t\t\t\t\t.filter((selected) => !!selected) as SearchFilterOutputState[];\n\t\t\t} else {\n\t\t\t\t/** Delete */\n\t\t\t\tlocalSelectedIds = localSelectedIds.filter(\n\t\t\t\t\t(selected) => selected.id !== id,\n\t\t\t\t);\n\n\t\t\t\tselectedStateRef.current = selectedStateRef.current.filter(\n\t\t\t\t\t(selectedItem) => selectedItem.id !== id,\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tonChange(selectedSchema.id, selectedStateRef.current, value);\n\n\t\t\tsetSelectedIds([...localSelectedIds]);\n\t\t}\n\t};\n\n\treturn (\n\t\t<div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>\n\t\t\t<div\n\t\t\t\tdata-testid=\"search-filter-row\"\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: direction,\n\t\t\t\t\tgap: 8,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\talignItems: direction === 'row' ? 'center' : 'self-start',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{searchSchema && (\n\t\t\t\t\t<SearchBar\n\t\t\t\t\t\twidth={searchSchema.width?.toString() ?? '100%'}\n\t\t\t\t\t\tisEnabled={true}\n\t\t\t\t\t\tonChange={onSearchChange}\n\t\t\t\t\t\tonEnter={onSearchChange}\n\t\t\t\t\t\tplaceholder={searchSchema.text}\n\t\t\t\t\t\tvariant={'small'}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\talignItems: direction === 'row' ? 'center' : 'self-start',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{schema\n\t\t\t\t\t\t.filter((filterItem) => filterItem.type !== FilterType.Search)\n\t\t\t\t\t\t.map((filterItem, i) => (\n\t\t\t\t\t\t\t<SearchFilterItem\n\t\t\t\t\t\t\t\t{...filterItem}\n\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\tvariant={variant}\n\t\t\t\t\t\t\t\tonChange={(val) => {\n\t\t\t\t\t\t\t\t\tselect(filterItem.id, val);\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</div>\n\t\t\t</div>\n\t\t\t{showSelectedChips && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<FilterChipListRenderer\n\t\t\t\t\t\tselectedState={selectedStateRef.current}\n\t\t\t\t\t\tonDeSelect={deSelect}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["SearchFilter","direction","schema","variant","onChange","showSelectedChips","selectedStateRef","useRef","filterItem","selectedIds","setSelectedIds","useState","searchSchema","FilterType","onSearchChange","searchText","select","id","value","selectedSchema","schemaItem","localSelectedIds","idx","el","selectedSchemaItem","deSelect","selected","newVal","val","selectedItem","jsxs","jsx","SearchBar","i","createElement","SearchFilterItem","FilterChipListRenderer"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tools.js","sources":["../../../../../src/components/agent-builder/constants/tools.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"tools.js","sources":["../../../../../src/components/agent-builder/constants/tools.ts"],"sourcesContent":["import type { ToolSource as ModelToolSource } from '@bikdotai/bik-models/ai-agents/models/agent-tool';\nimport type { FunctionComponent, SVGAttributes } from 'react';\n\n/**\n * Static tool-related constants for the builder's Step 3 (tools & sub-agents):\n * the reference-picker category tabs and the per-source display labels. Kept here\n * (rather than inline in the picker / serialization utils) so the labels a user\n * sees are all in one obvious place.\n */\n\n/** A reference-picker category tab. */\nexport type Category = 'tool' | 'subagent';\n\n/** Category tabs shown at the root of the `@` reference picker. */\nexport const CATEGORIES: { key: Category; label: string }[] = [\n\t{ key: 'tool', label: 'Tools' },\n\t{ key: 'subagent', label: 'Sub-agent' },\n];\n\n/**\n * Every tool \"source\" the builder renders an icon / label / picker entry for.\n * Enum VALUES are the backend's canonical read-only `source` wire strings\n * (`app/agents/config/schema.py` → `ToolSource`, derived from `tool_key`): the\n * configurable tools are `email_handover` / `rest_api` / `slack`, every native\n * tool is `manifest`. `shopify` / `integration` are legacy bik-models sources\n * kept for back-compat (the backend now collapses natives to `manifest`).\n * Dynamic/unknown sources are looked up leniently — see `toolSourceLabel` and\n * `sourceIcon`.\n *\n * This is the RUNTIME mirror of the canonical `@bikdotai/bik-models` `ToolSource`\n * union (the shape the backend persists as `AgentToolDoc.source`). We keep an\n * enum — not a re-export of the type — because the members are needed at runtime\n * for labels, ranks, icons and `===` comparisons; a type-only union can't do\n * that. The two are kept in lock-step by {@link ToolSourceMatchesBikModels}\n * below, which fails to compile if they ever drift.\n */\nexport enum ToolSource {\n\tManifest = 'manifest',\n\tShopify = 'shopify',\n\tBigcommerce = 'bigcommerce',\n\tShipstation = 'shipstation',\n\tIntegration = 'integration',\n\tRestApi = 'rest_api',\n\tEmailHandover = 'email_handover',\n\tSlack = 'slack',\n}\n\n/**\n * Compile-time guard that {@link ToolSource} stays a faithful mirror of the\n * canonical `@bikdotai/bik-models` `ToolSource` union. If a source is added to\n * (or removed from) either side without the other, `AssertTrue` receives `false`\n * and this type stops compiling — so the runtime enum can never silently diverge\n * from what the backend persists as `AgentToolDoc.source`. The tuple wrappers\n * (`[…]`) stop the conditionals from distributing over the unions, so it checks\n * set-equality in both directions.\n *\n * Type-only (erased at build): a drift shows up as a compile error on\n * `ToolSourceMatchesBikModels` telling you to reconcile this enum with\n * `@bikdotai/bik-models` (bump the dep and/or the enum).\n */\ntype AssertTrue<T extends true> = T;\ntype ToolSourceMatchesBikModels = AssertTrue<\n\t[`${ToolSource}`] extends [ModelToolSource]\n\t\t? [ModelToolSource] extends [`${ToolSource}`]\n\t\t\t? true\n\t\t\t: false\n\t\t: false\n>;\n\n/**\n * Display labels for the known tool sources — the CATEGORY/integration name, used\n * for the picker's source headers (drill-in groups), the empty-state source\n * buttons and the mention-chip prefix. A source is a category (\"Slack\") you drill\n * into; the specific addable action inside it (\"Send Slack message\") is\n * `TOOL_ACTION_LABELS`. Unknown sources fall back to the raw key (see\n * `toolSourceLabel`).\n */\nexport const TOOL_SOURCE_LABELS: Record<ToolSource, string> = {\n\t[ToolSource.Manifest]: 'Manifest',\n\t[ToolSource.Shopify]: 'Shopify',\n\t[ToolSource.Bigcommerce]: 'BigCommerce',\n\t[ToolSource.Shipstation]: 'ShipStation',\n\t[ToolSource.Integration]: 'Integration',\n\t[ToolSource.RestApi]: 'Rest API',\n\t[ToolSource.EmailHandover]: 'Email',\n\t[ToolSource.Slack]: 'Slack',\n};\n\n/**\n * The addable action inside a configurable/rest source — shown as the \"add\" row\n * in the `@` picker (below any existing instances) and the empty-state button.\n * Distinct from `TOOL_SOURCE_LABELS`, which names the category the action lives in\n * (e.g. category \"Slack\" → action \"Send Slack message\").\n */\nexport const TOOL_ACTION_LABELS: Partial<Record<ToolSource, string>> = {\n\t[ToolSource.RestApi]: 'REST API',\n\t[ToolSource.EmailHandover]: 'Handover to email',\n\t[ToolSource.Slack]: 'Send Slack message',\n};\n\n/** A tool source's brand-glyph component. */\nexport type IconComp = FunctionComponent<SVGAttributes<SVGElement>>;\n\n/** Brand glyph for a tool source, with its own size so each keeps its aspect ratio. */\nexport interface SourceIcon {\n\tIcon: IconComp;\n\tw: number;\n\th: number;\n}\n\n/**\n * A built-in \"tool\" that opens a config drawer (Rest API / email handover /\n * Slack) rather than inserting a mention. Surfaced as an empty-state source\n * button in the Tools section and as a row in the `@`-picker Tools view; picking\n * it opens the drawer and never writes into the instructions text.\n */\nexport interface ToolAction {\n\tsource: ToolSource;\n\tlabel: string;\n\ticon?: SourceIcon;\n\t/** Open this tool's config drawer. */\n\tonSelect: () => void;\n\t/**\n\t * Integration connection state for this source. `undefined` = no connection\n\t * gating (default). `false` = the store hasn't connected this integration →\n\t * the `@` picker shows a \"Connect\" row that calls {@link onConnect} instead of\n\t * drilling in / offering \"Create new\". `true` = connected (renders normally).\n\t * Set by the consumer via `config.integrationStatus` (today: Slack only).\n\t */\n\tconnected?: boolean;\n\t/** Open the parent's connect flow for this source (used when `connected === false`). */\n\tonConnect?: () => void;\n}\n\n/** Sources of the built-in drawer tools, in display order. */\nexport const TOOL_ACTION_SOURCES: ToolSource[] = [\n\tToolSource.RestApi,\n\tToolSource.EmailHandover,\n\tToolSource.Slack,\n];\n\n/**\n * Fixed display rank for the `@`-picker's tool-source groups (lower = higher). The\n * picker sorts its source rows by this so adding/updating a tool never reshuffles\n * them. Any source not listed here (dynamic/unknown, e.g. Integration) sorts AFTER\n * Slack, keeping its discovery order among the rest (Array.sort is stable).\n */\nexport const TOOL_SOURCE_RANK: Partial<Record<ToolSource, number>> = {\n\t[ToolSource.Shopify]: 0,\n\t[ToolSource.Bigcommerce]: 1,\n\t[ToolSource.Shipstation]: 2,\n\t[ToolSource.RestApi]: 3,\n\t[ToolSource.EmailHandover]: 4,\n\t[ToolSource.Slack]: 5,\n\t// Manifest is intentionally omitted so it sorts AFTER the integration sources\n\t// (unknown/unranked → last). The generic \"Manifest\" group is being phased out.\n};\n\nconst UNRANKED_SOURCE_RANK = Object.keys(TOOL_SOURCE_RANK).length;\n\n/** Sort rank for a source string; unknown sources rank after all known ones. */\nexport const toolSourceRank = (source: string): number =>\n\tTOOL_SOURCE_RANK[source as ToolSource] ?? UNRANKED_SOURCE_RANK;\n\n/**\n * `tool_key` of a configurable shared-drawer tool (email / Slack). Lives here (not\n * in AgentBuilder.model) so this leaf constants file has no back-edge to the model\n * — the dependency stays one-way (model → constants), avoiding a circular import.\n */\nexport type ConfigToolKey = 'send_email' | 'send_slack_message';\n\n/**\n * Drawer sources rendered by the shared dynamic panel (`ConfigToolPanel`), each\n * mapped to its backend `tool_key`. Rest API is absent — it has a bespoke panel.\n */\nexport const CONFIG_TOOL_SOURCES: Partial<Record<ToolSource, ConfigToolKey>> = {\n\t[ToolSource.EmailHandover]: 'send_email',\n\t[ToolSource.Slack]: 'send_slack_message',\n};\n"],"names":["CATEGORIES","ToolSource","TOOL_SOURCE_LABELS","TOOL_ACTION_LABELS","TOOL_ACTION_SOURCES","TOOL_SOURCE_RANK","UNRANKED_SOURCE_RANK","toolSourceRank","source","CONFIG_TOOL_SOURCES"],"mappings":"gFAcO,MAAMA,EAAiD,CAC7D,CAAE,IAAK,OAAQ,MAAO,OAAA,EACtB,CAAE,IAAK,WAAY,MAAO,WAAA,CAC3B,EAmBO,IAAKC,GAAAA,IACXA,EAAA,SAAW,WACXA,EAAA,QAAU,UACVA,EAAA,YAAc,cACdA,EAAA,YAAc,cACdA,EAAA,YAAc,cACdA,EAAA,QAAU,WACVA,EAAA,cAAgB,iBAChBA,EAAA,MAAQ,QARGA,IAAAA,GAAA,CAAA,CAAA,EAyCL,MAAMC,EAAiD,CAC5D,SAAsB,WACtB,QAAqB,UACrB,YAAyB,cACzB,YAAyB,cACzB,YAAyB,cACzB,SAAqB,WACrB,eAA2B,QAC3B,MAAmB,OACrB,EAQaC,EAA0D,CACrE,SAAqB,WACrB,eAA2B,oBAC3B,MAAmB,oBACrB,EAqCaC,EAAoC,CAChD,WACA,iBACA,OACD,EAQaC,EAAwD,CACnE,QAAqB,EACrB,YAAyB,EACzB,YAAyB,EACzB,SAAqB,EACrB,eAA2B,EAC3B,MAAmB,CAGrB,EAEMC,EAAuB,OAAO,KAAKD,CAAgB,EAAE,OAG9CE,EAAkBC,GAC9BH,EAAiBG,CAAoB,GAAKF,EAa9BG,EAAkE,CAC7E,eAA2B,aAC3B,MAAmB,oBACrB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),p=require("../../assets/icons/info.svg.js"),t=require("../../constants/Theme.js"),r=require("../TypographyStyle.js"),u=require("./AnalyticsChipChannelFooter.js"),x=require("./CommonStyles.js"),S=require("../tooltips/Tooltip.js"),g=n=>{const{title:l,primaryValue:s,titleColor:c,captionColor:a=t.BASE_COLORS.grayscale[700],backgroundColor:y=t.BASE_COLORS.grayscale[50],width:h="224.67px",extraJSX:C,tooltipContent:o,channelConfig:i,style:d}=n;return e.jsxs(x.AnalyticsChipContainer,{style:d??{},backgroundColor:y,width:h,children:[e.jsxs("div",{className:"sub--container",children:[e.jsx(r.BodyCaption,{style:{color:a},children:l}),o&&e.jsx(S.Tooltip,{body:o,children:e.jsx("div",{children:e.jsx(p.default,{"data-test":"analytics-chip-tooltip-icon",height:14.67,width:14.67,color:t.BASE_COLORS.grayscale[500]})})})]}),e.jsx(r.TitleLarge,{style:{color:c},children:s}),i&&e.jsx(u.AnalyticsChipChannelFooter,{channelConfig:i}),C]})};exports.AnalyticsChip=g;
|
|
2
2
|
//# sourceMappingURL=AnalyticsChip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnalyticsChip.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsChip.tsx"],"sourcesContent":["import Info from '@src/assets/icons/info.svg';\nimport React from 'react';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BASE_COLORS } from '@src/constants/Theme';\nimport { BodyCaption, TitleLarge } from '../TypographyStyle';\nimport { AnalyticsChipInterface } from './AnalyticsChip.model';\nimport { AnalyticsChipChannelFooter } from './AnalyticsChipChannelFooter';\nimport { AnalyticsChipContainer } from './CommonStyles';\n\nexport const AnalyticsChip: React.FC<AnalyticsChipInterface> = (props) => {\n\tconst {\n\t\ttitle,\n\t\tprimaryValue,\n\t\ttitleColor,\n\t\tcaptionColor = BASE_COLORS.grayscale[700],\n\t\tbackgroundColor = BASE_COLORS.grayscale[50],\n\t\twidth = '224.67px',\n\t\textraJSX,\n\t\ttooltipContent,\n\t\tchannelConfig,\n\t\tstyle,\n\t} = props;\n\treturn (\n\t\t<AnalyticsChipContainer\n\t\t\tstyle={style ?? {}}\n\t\t\tbackgroundColor={backgroundColor}\n\t\t\twidth={width}\n\t\t>\n\t\t\t<div className=\"sub--container\">\n\t\t\t\t<BodyCaption style={{ color: captionColor }}>{title}</BodyCaption>\n\t\t\t\t{tooltipContent && (\n\t\t\t\t\t<Tooltip body={tooltipContent}>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<Info\n\t\t\t\t\t\t\t\theight={14.67}\n\t\t\t\t\t\t\t\twidth={14.67}\n\t\t\t\t\t\t\t\tcolor={BASE_COLORS.grayscale[500]}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<TitleLarge style={{ color: titleColor }}>{primaryValue}</TitleLarge>\n\t\t\t{channelConfig && (\n\t\t\t\t<AnalyticsChipChannelFooter channelConfig={channelConfig} />\n\t\t\t)}\n\t\t\t{extraJSX}\n\t\t</AnalyticsChipContainer>\n\t);\n};\n"],"names":["AnalyticsChip","props","title","primaryValue","titleColor","captionColor","BASE_COLORS","backgroundColor","width","extraJSX","tooltipContent","channelConfig","style","jsxs","AnalyticsChipContainer","jsx","BodyCaption","Tooltip","Info","TitleLarge","AnalyticsChipChannelFooter"],"mappings":"0VASaA,EAAmDC,GAAU,CACzE,KAAM,CACL,MAAAC,EACA,aAAAC,EACA,WAAAC,EACA,aAAAC,EAAeC,EAAAA,YAAY,UAAU,GAAG,EACxC,gBAAAC,EAAkBD,EAAAA,YAAY,UAAU,EAAE,EAC1C,MAAAE,EAAQ,WACR,SAAAC,EACA,eAAAC,EACA,cAAAC,EACA,MAAAC,CAAA,EACGX,EACJ,OACCY,EAAAA,KAACC,EAAAA,uBAAA,CACA,MAAOF,GAAS,CAAA,EAChB,gBAAAL,EACA,MAAAC,EAEA,SAAA,CAAAK,EAAAA,KAAC,MAAA,CAAI,UAAU,iBACd,SAAA,CAAAE,MAACC,EAAAA,aAAY,MAAO,CAAE,MAAOX,CAAA,EAAiB,SAAAH,EAAM,EACnDQ,GACAK,EAAAA,IAACE,UAAA,CAAQ,KAAMP,EACd,eAAC,MAAA,CACA,SAAAK,EAAAA,IAACG,EAAAA,QAAA,CACA,OAAQ,MACR,MAAO,MACP,MAAOZ,EAAAA,YAAY,UAAU,GAAG,CAAA,CAAA,EAElC,CAAA,CACD,CAAA,EAEF,QACCa,EAAAA,WAAA,CAAW,MAAO,CAAE,MAAOf,CAAA,EAAe,SAAAD,EAAa,EACvDQ,GACAI,EAAAA,IAACK,6BAAA,CAA2B,cAAAT,CAAA,CAA8B,EAE1DF,CAAA,CAAA,CAAA,CAGJ"}
|
|
1
|
+
{"version":3,"file":"AnalyticsChip.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsChip.tsx"],"sourcesContent":["import Info from '@src/assets/icons/info.svg';\nimport React from 'react';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BASE_COLORS } from '@src/constants/Theme';\nimport { BodyCaption, TitleLarge } from '../TypographyStyle';\nimport { AnalyticsChipInterface } from './AnalyticsChip.model';\nimport { AnalyticsChipChannelFooter } from './AnalyticsChipChannelFooter';\nimport { AnalyticsChipContainer } from './CommonStyles';\n\nexport const AnalyticsChip: React.FC<AnalyticsChipInterface> = (props) => {\n\tconst {\n\t\ttitle,\n\t\tprimaryValue,\n\t\ttitleColor,\n\t\tcaptionColor = BASE_COLORS.grayscale[700],\n\t\tbackgroundColor = BASE_COLORS.grayscale[50],\n\t\twidth = '224.67px',\n\t\textraJSX,\n\t\ttooltipContent,\n\t\tchannelConfig,\n\t\tstyle,\n\t} = props;\n\treturn (\n\t\t<AnalyticsChipContainer\n\t\t\tstyle={style ?? {}}\n\t\t\tbackgroundColor={backgroundColor}\n\t\t\twidth={width}\n\t\t>\n\t\t\t<div className=\"sub--container\">\n\t\t\t\t<BodyCaption style={{ color: captionColor }}>{title}</BodyCaption>\n\t\t\t\t{tooltipContent && (\n\t\t\t\t\t<Tooltip body={tooltipContent}>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<Info\n\t\t\t\t\t\t\t\tdata-test=\"analytics-chip-tooltip-icon\"\n\t\t\t\t\t\t\t\theight={14.67}\n\t\t\t\t\t\t\t\twidth={14.67}\n\t\t\t\t\t\t\t\tcolor={BASE_COLORS.grayscale[500]}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<TitleLarge style={{ color: titleColor }}>{primaryValue}</TitleLarge>\n\t\t\t{channelConfig && (\n\t\t\t\t<AnalyticsChipChannelFooter channelConfig={channelConfig} />\n\t\t\t)}\n\t\t\t{extraJSX}\n\t\t</AnalyticsChipContainer>\n\t);\n};\n"],"names":["AnalyticsChip","props","title","primaryValue","titleColor","captionColor","BASE_COLORS","backgroundColor","width","extraJSX","tooltipContent","channelConfig","style","jsxs","AnalyticsChipContainer","jsx","BodyCaption","Tooltip","Info","TitleLarge","AnalyticsChipChannelFooter"],"mappings":"0VASaA,EAAmDC,GAAU,CACzE,KAAM,CACL,MAAAC,EACA,aAAAC,EACA,WAAAC,EACA,aAAAC,EAAeC,EAAAA,YAAY,UAAU,GAAG,EACxC,gBAAAC,EAAkBD,EAAAA,YAAY,UAAU,EAAE,EAC1C,MAAAE,EAAQ,WACR,SAAAC,EACA,eAAAC,EACA,cAAAC,EACA,MAAAC,CAAA,EACGX,EACJ,OACCY,EAAAA,KAACC,EAAAA,uBAAA,CACA,MAAOF,GAAS,CAAA,EAChB,gBAAAL,EACA,MAAAC,EAEA,SAAA,CAAAK,EAAAA,KAAC,MAAA,CAAI,UAAU,iBACd,SAAA,CAAAE,MAACC,EAAAA,aAAY,MAAO,CAAE,MAAOX,CAAA,EAAiB,SAAAH,EAAM,EACnDQ,GACAK,EAAAA,IAACE,UAAA,CAAQ,KAAMP,EACd,eAAC,MAAA,CACA,SAAAK,EAAAA,IAACG,EAAAA,QAAA,CACA,YAAU,8BACV,OAAQ,MACR,MAAO,MACP,MAAOZ,EAAAA,YAAY,UAAU,GAAG,CAAA,CAAA,EAElC,CAAA,CACD,CAAA,EAEF,QACCa,EAAAA,WAAA,CAAW,MAAO,CAAE,MAAOf,CAAA,EAAe,SAAAD,EAAa,EACvDQ,GACAI,EAAAA,IAACK,6BAAA,CAA2B,cAAAT,CAAA,CAA8B,EAE1DF,CAAA,CAAA,CAAA,CAGJ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("react"),c=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("react"),c=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),y=require("../../assets/icons/bik_livechat.svg.js"),u=require("../../assets/icons/email-channel.svg.js"),d=require("../../assets/icons/facebook_channel.svg.js"),f=require("../../assets/icons/gmail.svg.js"),j=require("../../assets/icons/instagram-channel.svg.js"),_=require("../../assets/icons/task.svg.js"),S=require("../../assets/icons/whatsapp_color.svg.js"),A=require("./Avatar.styled.js"),i=require("./AvatarHelper.js"),C=require("../../icons/Informational/Communication/Phone.js"),n={[i.SIZE.EXTRA_SMALL]:10,[i.SIZE.SMALL]:16,[i.SIZE.MEDIUM]:20,[i.SIZE.LARGE]:32},o={[i.AVATAR_BACKGROUND.LIGHT]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.WHITE]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.DARK]:a.COLORS.surface.standard,[i.AVATAR_BACKGROUND.BRAND]:a.COLORS.background.inverseLight};var g=(e=>(e.INSTAGRAM="instagram",e.MESSENGER="messenger",e.WHATSAPP="whatsapp",e.GMAIL="gmail",e.LIVECHAT="livechat",e.GOOGLE_BUSINESS_CHAT="gbm",e.SHOPIFY="shopify",e.FACEBOOK="facebook",e.EMAIL="email",e.SMTP="smtp",e.FACEBOOK_CATALOG="facebook-catalog",e.TASKS="tasks",e.BIK_LIVECHAT="livechat",e.VOICE="voice",e))(g||{});const v=e=>{const[l,R]=m.useState(!1),h=()=>{const r=(e.name||"").split(".").join(" ").split(" ").map(x=>x.charAt(0).toUpperCase()).slice(0,2).join(""),s=o[e.background];return e.size===i.SIZE.LARGE?t.jsx(c.TitleMedium,{style:{color:s},children:r}):e.size===i.SIZE.MEDIUM?t.jsx(c.TitleSmall,{style:{color:s},children:r}):e.size===i.SIZE.SMALL?t.jsx(c.SubHeading,{style:{color:s},children:r}):t.jsx(c.BodyTiny,{style:{color:s,fontSize:"6.667px",lineHeight:"8px"},children:r})},I=()=>e.useNameFallback&&(!e.photoUrl||l)&&e.name?t.jsx("div",{children:h()}):e.useNameFallback&&e.photoUrl&&!l?t.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[e.size],height:i.AVATAR_SIZE_MAP[e.size],style:{borderRadius:e?.borderRadius||"50%",objectFit:"contain"},src:e.photoUrl,onError:()=>{R(!0)}}):t.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[e.size],height:i.AVATAR_SIZE_MAP[e.size],style:{borderRadius:e?.borderRadius||"50%",objectFit:"contain"},src:e.photoUrl}),O=()=>{switch(e.channelName){case"email":return t.jsx(u.default,{width:11,height:11});case"smtp":return t.jsx(u.default,{width:11,height:11});case"facebook":return t.jsx(d.default,{width:11,height:11});case"facebook-catalog":return t.jsx(d.default,{width:11,height:11});case"messenger":return t.jsx(d.default,{width:11,height:11});case"instagram":return t.jsx(j.default,{width:11,height:11});case"whatsapp":return t.jsx(S.default,{width:11,height:11});case"gmail":return t.jsx(f.default,{width:11,height:11});case"tasks":return t.jsx(_.default,{width:11,height:11});case"livechat":return t.jsx(y.default,{width:11,height:11});case"voice":return t.jsx(A.PhoneIconWrapper,{children:t.jsx(C.default,{width:8,height:8,color:a.COLORS.content.secondaryInverse})})}},T=()=>e.status?t.jsx("div",{style:{backgroundColor:e.status==="ONLINE"?a.COLORS.special.whatsapp.brand:a.COLORS.content.inactive,width:"8px",height:"8px",borderRadius:"50%"}}):null,b=()=>e.type===i.AVATAR_TYPES.IMAGE&&(l||!e.photoUrl)&&e.useNameFallback&&e.name?i.AVATAR_TYPES.INITIALS:e.type;return t.jsxs("div",{style:{position:"relative"},children:[t.jsxs(A.AvatarStyle,{type:b(),size:e.size,background:e.background,children:[e.type===i.AVATAR_TYPES.IMAGE&&I(),e.type===i.AVATAR_TYPES.INITIALS&&t.jsx("div",{children:h()}),e.type===i.AVATAR_TYPES.ICON&&e.icon&&t.jsx(e.icon,{width:n[e.size],height:n[e.size],color:o[e.background]})]}),e.inboxSettings&&t.jsx("div",{"data-test":"avatar-inbox-badge",style:{position:"absolute",left:n[e.size]+"px",top:n[e.size]+"px",width:14,height:14,borderRadius:e?.borderRadius||"50%",display:"flex",justifyContent:"center",backgroundColor:e.inboxSettings.isSelected?e.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.background.brandLight:e.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.surface.standard,alignItems:"center"},children:O()}),e.status&&t.jsx("div",{"data-test":"avatar-status-indicator",style:{position:"absolute",left:n[e.size]+"px",top:n[e.size]+"px",width:11,height:11,borderRadius:"50%",display:"flex",justifyContent:"center",backgroundColor:a.COLORS.surface.standard,alignItems:"center"},children:T()})]})};exports.AVATAR_SIZE_VS_ICON_SIZE_MAP=n;exports.Avatar=v;exports.BACKGROUND_VS_TEXT_COLOR_MAP=o;exports.MESSAGE_CHANNELS=g;
|
|
2
2
|
//# sourceMappingURL=Avatar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sources":["../../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n\tBodyTiny,\n\tSubHeading,\n\tTitleMedium,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport BikLivechatIcon from '../../assets/icons/bik_livechat.svg';\nimport EmailIcon from '../../assets/icons/email-channel.svg';\nimport FacebookIcon from '../../assets/icons/facebook_channel.svg';\nimport GmailIcon from '../../assets/icons/gmail.svg';\nimport InstagramIcon from '../../assets/icons/instagram-channel.svg';\nimport TaskIcon from '../../assets/icons/task.svg';\nimport WhatsappIcon from '../../assets/icons/whatsapp_color.svg';\nimport { AvatarStyle } from './Avatar.styled';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from './AvatarHelper';\n\nexport const AVATAR_SIZE_VS_ICON_SIZE_MAP = {\n\t[SIZE.EXTRA_SMALL]: 10,\n\t[SIZE.SMALL]: 16,\n\t[SIZE.MEDIUM]: 20,\n\t[SIZE.LARGE]: 32,\n};\n\nexport const BACKGROUND_VS_TEXT_COLOR_MAP = {\n\t[AVATAR_BACKGROUND.LIGHT]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.WHITE]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.DARK]: COLORS.surface.standard,\n\t[AVATAR_BACKGROUND.BRAND]: COLORS.background.inverseLight,\n};\n\nexport type AvatarProps = {\n\ttype: AVATAR_TYPES;\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\tname?: string;\n\tphotoUrl?: string;\n\ticon?: React.FC<{ width: number; height: number; color: string }>;\n\tuseNameFallback?: boolean;\n\tchannelName?: MESSAGE_CHANNELS;\n\tborderRadius?: string;\n\tinboxSettings?: {\n\t\tisSelected: boolean;\n\t\tisComments: boolean;\n\t};\n\tstatus?: 'ONLINE' | 'OFFLINE' | 'AWAY';\n};\n\nexport const enum MESSAGE_CHANNELS {\n\tINSTAGRAM = 'instagram',\n\tMESSENGER = 'messenger',\n\tWHATSAPP = 'whatsapp',\n\tGMAIL = 'gmail',\n\tLIVECHAT = 'livechat',\n\tGOOGLE_BUSINESS_CHAT = 'gbm',\n\tSHOPIFY = 'shopify',\n\tFACEBOOK = 'facebook',\n\tEMAIL = 'email',\n\tSMTP = 'smtp',\n\tFACEBOOK_CATALOG = 'facebook-catalog',\n\tTASKS = 'tasks',\n\tBIK_LIVECHAT = 'livechat',\n}\n\nexport const Avatar: React.FC<AvatarProps> = (props) => {\n\tconst [imgError, setImgError] = useState<boolean>(false);\n\n\tconst getInitials = () => {\n\t\tconst initials = (props.name || '')\n\t\t\t.split('.')\n\t\t\t.join(' ')\n\t\t\t.split(' ')\n\t\t\t.map((e) => e.charAt(0).toUpperCase())\n\t\t\t.slice(0, 2)\n\t\t\t.join('');\n\n\t\tconst color = BACKGROUND_VS_TEXT_COLOR_MAP[props.background];\n\n\t\tif (props.size === SIZE.LARGE) {\n\t\t\treturn <TitleMedium style={{ color }}>{initials}</TitleMedium>;\n\t\t}\n\t\tif (props.size === SIZE.MEDIUM) {\n\t\t\treturn <TitleSmall style={{ color }}>{initials}</TitleSmall>;\n\t\t}\n\t\tif (props.size === SIZE.SMALL) {\n\t\t\treturn <SubHeading style={{ color }}>{initials}</SubHeading>;\n\t\t}\n\t\t// EXTRA_SMALL: 6.667px / 8px per Figma. BodyTiny's 10px/12px is too large\n\t\t// for the 16px circle (leaves 2px padding instead of the intended 4px).\n\t\treturn (\n\t\t\t<BodyTiny style={{ color, fontSize: '6.667px', lineHeight: '8px' }}>\n\t\t\t\t{initials}\n\t\t\t</BodyTiny>\n\t\t);\n\t};\n\n\tconst getImageBlock = () => {\n\t\tif (props.useNameFallback && (!props.photoUrl || imgError) && props.name) {\n\t\t\treturn <div>{getInitials()}</div>;\n\t\t}\n\t\tif (props.useNameFallback && props.photoUrl && !imgError) {\n\t\t\treturn (\n\t\t\t\t<img\n\t\t\t\t\talt=\"\"\n\t\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tborderRadius: props?.borderRadius || '50%',\n\t\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t\t}}\n\t\t\t\t\tsrc={props.photoUrl}\n\t\t\t\t\tonError={() => {\n\t\t\t\t\t\tsetImgError(true);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<img\n\t\t\t\talt=\"\"\n\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\tstyle={{\n\t\t\t\t\tborderRadius: props?.borderRadius || '50%',\n\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t}}\n\t\t\t\tsrc={props.photoUrl}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getChannelIcon = () => {\n\t\tswitch (props.channelName) {\n\t\t\tcase MESSAGE_CHANNELS.EMAIL:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.SMTP:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK_CATALOG:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.MESSENGER:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.INSTAGRAM:\n\t\t\t\treturn <InstagramIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.WHATSAPP:\n\t\t\t\treturn <WhatsappIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.GMAIL:\n\t\t\t\treturn <GmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.TASKS:\n\t\t\t\treturn <TaskIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.BIK_LIVECHAT:\n\t\t\t\treturn <BikLivechatIcon width={11} height={11} />;\n\t\t}\n\t};\n\n\tconst getOnlineStatusIcon = () => {\n\t\treturn props.status ? (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tprops.status === 'ONLINE'\n\t\t\t\t\t\t\t? COLORS.special.whatsapp.brand\n\t\t\t\t\t\t\t: COLORS.content.inactive,\n\t\t\t\t\twidth: '8px',\n\t\t\t\t\theight: '8px',\n\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t}}\n\t\t\t></div>\n\t\t) : null;\n\t};\n\n\tconst getPropsType = () => {\n\t\tif (\n\t\t\tprops.type === AVATAR_TYPES.IMAGE &&\n\t\t\t(imgError || !props.photoUrl) &&\n\t\t\tprops.useNameFallback &&\n\t\t\tprops.name\n\t\t) {\n\t\t\treturn AVATAR_TYPES.INITIALS;\n\t\t}\n\n\t\treturn props.type;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'relative',\n\t\t\t}}\n\t\t>\n\t\t\t<AvatarStyle\n\t\t\t\ttype={getPropsType()}\n\t\t\t\tsize={props.size}\n\t\t\t\tbackground={props.background}\n\t\t\t>\n\t\t\t\t{props.type === AVATAR_TYPES.IMAGE && getImageBlock()}\n\t\t\t\t{props.type === AVATAR_TYPES.INITIALS && <div>{getInitials()}</div>}\n\t\t\t\t{props.type === AVATAR_TYPES.ICON && props.icon && (\n\t\t\t\t\t<props.icon\n\t\t\t\t\t\twidth={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\theight={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\tcolor={BACKGROUND_VS_TEXT_COLOR_MAP[props.background]}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</AvatarStyle>\n\t\t\t{props.inboxSettings && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-inbox-badge\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 14,\n\t\t\t\t\t\theight: 14,\n\t\t\t\t\t\tborderRadius: props?.borderRadius || '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: props.inboxSettings.isSelected\n\t\t\t\t\t\t\t? props.inboxSettings.isComments\n\t\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t: props.inboxSettings.isComments\n\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getChannelIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.status && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-status-indicator\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 11,\n\t\t\t\t\t\theight: 11,\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getOnlineStatusIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["AVATAR_SIZE_VS_ICON_SIZE_MAP","SIZE","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","COLORS","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","e","color","TitleMedium","TitleSmall","SubHeading","jsx","BodyTiny","getImageBlock","AVATAR_SIZE_MAP","getChannelIcon","EmailIcon","FacebookIcon","InstagramIcon","WhatsappIcon","GmailIcon","TaskIcon","BikLivechatIcon","getOnlineStatusIcon","getPropsType","AVATAR_TYPES","jsxs","AvatarStyle"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Avatar.js","sources":["../../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Phone as PhoneIcon } from '@src/icons';\nimport {\n\tBodyTiny,\n\tSubHeading,\n\tTitleMedium,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport BikLivechatIcon from '../../assets/icons/bik_livechat.svg';\nimport EmailIcon from '../../assets/icons/email-channel.svg';\nimport FacebookIcon from '../../assets/icons/facebook_channel.svg';\nimport GmailIcon from '../../assets/icons/gmail.svg';\nimport InstagramIcon from '../../assets/icons/instagram-channel.svg';\nimport TaskIcon from '../../assets/icons/task.svg';\nimport WhatsappIcon from '../../assets/icons/whatsapp_color.svg';\nimport { AvatarStyle, PhoneIconWrapper } from './Avatar.styled';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from './AvatarHelper';\n\nexport const AVATAR_SIZE_VS_ICON_SIZE_MAP = {\n\t[SIZE.EXTRA_SMALL]: 10,\n\t[SIZE.SMALL]: 16,\n\t[SIZE.MEDIUM]: 20,\n\t[SIZE.LARGE]: 32,\n};\n\nexport const BACKGROUND_VS_TEXT_COLOR_MAP = {\n\t[AVATAR_BACKGROUND.LIGHT]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.WHITE]: COLORS.content.secondary,\n\t[AVATAR_BACKGROUND.DARK]: COLORS.surface.standard,\n\t[AVATAR_BACKGROUND.BRAND]: COLORS.background.inverseLight,\n};\n\nexport type AvatarProps = {\n\ttype: AVATAR_TYPES;\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\tname?: string;\n\tphotoUrl?: string;\n\ticon?: React.FC<{ width: number; height: number; color: string }>;\n\tuseNameFallback?: boolean;\n\tchannelName?: MESSAGE_CHANNELS;\n\tborderRadius?: string;\n\tinboxSettings?: {\n\t\tisSelected: boolean;\n\t\tisComments: boolean;\n\t};\n\tstatus?: 'ONLINE' | 'OFFLINE' | 'AWAY';\n};\n\nexport const enum MESSAGE_CHANNELS {\n\tINSTAGRAM = 'instagram',\n\tMESSENGER = 'messenger',\n\tWHATSAPP = 'whatsapp',\n\tGMAIL = 'gmail',\n\tLIVECHAT = 'livechat',\n\tGOOGLE_BUSINESS_CHAT = 'gbm',\n\tSHOPIFY = 'shopify',\n\tFACEBOOK = 'facebook',\n\tEMAIL = 'email',\n\tSMTP = 'smtp',\n\tFACEBOOK_CATALOG = 'facebook-catalog',\n\tTASKS = 'tasks',\n\tBIK_LIVECHAT = 'livechat',\n\tVOICE = 'voice',\n}\n\nexport const Avatar: React.FC<AvatarProps> = (props) => {\n\tconst [imgError, setImgError] = useState<boolean>(false);\n\n\tconst getInitials = () => {\n\t\tconst initials = (props.name || '')\n\t\t\t.split('.')\n\t\t\t.join(' ')\n\t\t\t.split(' ')\n\t\t\t.map((e) => e.charAt(0).toUpperCase())\n\t\t\t.slice(0, 2)\n\t\t\t.join('');\n\n\t\tconst color = BACKGROUND_VS_TEXT_COLOR_MAP[props.background];\n\n\t\tif (props.size === SIZE.LARGE) {\n\t\t\treturn <TitleMedium style={{ color }}>{initials}</TitleMedium>;\n\t\t}\n\t\tif (props.size === SIZE.MEDIUM) {\n\t\t\treturn <TitleSmall style={{ color }}>{initials}</TitleSmall>;\n\t\t}\n\t\tif (props.size === SIZE.SMALL) {\n\t\t\treturn <SubHeading style={{ color }}>{initials}</SubHeading>;\n\t\t}\n\t\t// EXTRA_SMALL: 6.667px / 8px per Figma. BodyTiny's 10px/12px is too large\n\t\t// for the 16px circle (leaves 2px padding instead of the intended 4px).\n\t\treturn (\n\t\t\t<BodyTiny style={{ color, fontSize: '6.667px', lineHeight: '8px' }}>\n\t\t\t\t{initials}\n\t\t\t</BodyTiny>\n\t\t);\n\t};\n\n\tconst getImageBlock = () => {\n\t\tif (props.useNameFallback && (!props.photoUrl || imgError) && props.name) {\n\t\t\treturn <div>{getInitials()}</div>;\n\t\t}\n\t\tif (props.useNameFallback && props.photoUrl && !imgError) {\n\t\t\treturn (\n\t\t\t\t<img\n\t\t\t\t\talt=\"\"\n\t\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tborderRadius: props?.borderRadius || '50%',\n\t\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t\t}}\n\t\t\t\t\tsrc={props.photoUrl}\n\t\t\t\t\tonError={() => {\n\t\t\t\t\t\tsetImgError(true);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<img\n\t\t\t\talt=\"\"\n\t\t\t\twidth={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\theight={AVATAR_SIZE_MAP[props.size]}\n\t\t\t\tstyle={{\n\t\t\t\t\tborderRadius: props?.borderRadius || '50%',\n\t\t\t\t\tobjectFit: 'contain',\n\t\t\t\t}}\n\t\t\t\tsrc={props.photoUrl}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getChannelIcon = () => {\n\t\tswitch (props.channelName) {\n\t\t\tcase MESSAGE_CHANNELS.EMAIL:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.SMTP:\n\t\t\t\treturn <EmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.FACEBOOK_CATALOG:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.MESSENGER:\n\t\t\t\treturn <FacebookIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.INSTAGRAM:\n\t\t\t\treturn <InstagramIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.WHATSAPP:\n\t\t\t\treturn <WhatsappIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.GMAIL:\n\t\t\t\treturn <GmailIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.TASKS:\n\t\t\t\treturn <TaskIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.BIK_LIVECHAT:\n\t\t\t\treturn <BikLivechatIcon width={11} height={11} />;\n\t\t\tcase MESSAGE_CHANNELS.VOICE:\n\t\t\t\treturn (\n\t\t\t\t\t<PhoneIconWrapper>\n\t\t\t\t\t\t<PhoneIcon\n\t\t\t\t\t\t\twidth={8}\n\t\t\t\t\t\t\theight={8}\n\t\t\t\t\t\t\tcolor={COLORS.content.secondaryInverse}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PhoneIconWrapper>\n\t\t\t\t);\n\t\t}\n\t};\n\n\tconst getOnlineStatusIcon = () => {\n\t\treturn props.status ? (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\tprops.status === 'ONLINE'\n\t\t\t\t\t\t\t? COLORS.special.whatsapp.brand\n\t\t\t\t\t\t\t: COLORS.content.inactive,\n\t\t\t\t\twidth: '8px',\n\t\t\t\t\theight: '8px',\n\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t}}\n\t\t\t></div>\n\t\t) : null;\n\t};\n\n\tconst getPropsType = () => {\n\t\tif (\n\t\t\tprops.type === AVATAR_TYPES.IMAGE &&\n\t\t\t(imgError || !props.photoUrl) &&\n\t\t\tprops.useNameFallback &&\n\t\t\tprops.name\n\t\t) {\n\t\t\treturn AVATAR_TYPES.INITIALS;\n\t\t}\n\n\t\treturn props.type;\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tposition: 'relative',\n\t\t\t}}\n\t\t>\n\t\t\t<AvatarStyle\n\t\t\t\ttype={getPropsType()}\n\t\t\t\tsize={props.size}\n\t\t\t\tbackground={props.background}\n\t\t\t>\n\t\t\t\t{props.type === AVATAR_TYPES.IMAGE && getImageBlock()}\n\t\t\t\t{props.type === AVATAR_TYPES.INITIALS && <div>{getInitials()}</div>}\n\t\t\t\t{props.type === AVATAR_TYPES.ICON && props.icon && (\n\t\t\t\t\t<props.icon\n\t\t\t\t\t\twidth={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\theight={AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size]}\n\t\t\t\t\t\tcolor={BACKGROUND_VS_TEXT_COLOR_MAP[props.background]}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</AvatarStyle>\n\t\t\t{props.inboxSettings && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-inbox-badge\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 14,\n\t\t\t\t\t\theight: 14,\n\t\t\t\t\t\tborderRadius: props?.borderRadius || '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: props.inboxSettings.isSelected\n\t\t\t\t\t\t\t? props.inboxSettings.isComments\n\t\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t\t: COLORS.background.brandLight\n\t\t\t\t\t\t\t: props.inboxSettings.isComments\n\t\t\t\t\t\t\t? COLORS.content.primary\n\t\t\t\t\t\t\t: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getChannelIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.status && (\n\t\t\t\t<div\n\t\t\t\t\tdata-test=\"avatar-status-indicator\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\tleft: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\ttop: AVATAR_SIZE_VS_ICON_SIZE_MAP[props.size] + 'px',\n\t\t\t\t\t\twidth: 11,\n\t\t\t\t\t\theight: 11,\n\t\t\t\t\t\tborderRadius: '50%',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.standard,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{getOnlineStatusIcon()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n"],"names":["AVATAR_SIZE_VS_ICON_SIZE_MAP","SIZE","BACKGROUND_VS_TEXT_COLOR_MAP","AVATAR_BACKGROUND","COLORS","MESSAGE_CHANNELS","Avatar","props","imgError","setImgError","useState","getInitials","initials","e","color","TitleMedium","TitleSmall","SubHeading","jsx","BodyTiny","getImageBlock","AVATAR_SIZE_MAP","getChannelIcon","EmailIcon","FacebookIcon","InstagramIcon","WhatsappIcon","GmailIcon","TaskIcon","BikLivechatIcon","PhoneIconWrapper","PhoneIcon","getOnlineStatusIcon","getPropsType","AVATAR_TYPES","jsxs","AvatarStyle"],"mappings":"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"}
|
|
@@ -1,11 +1,19 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),t=require("./AvatarHelper.js"),r=require("../../constants/Theme.js"),o=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},n=o(a),A=n.default.div`
|
|
2
2
|
width: ${e=>t.AVATAR_SIZE_MAP[e.size]+"px"};
|
|
3
3
|
height: ${e=>t.AVATAR_SIZE_MAP[e.size]+"px"};
|
|
4
4
|
display: flex;
|
|
5
5
|
justify-content: center;
|
|
6
6
|
align-items: center;
|
|
7
|
-
background-color: ${e=>e.type===t.AVATAR_TYPES.IMAGE?"null":e.background===t.AVATAR_BACKGROUND.LIGHT?
|
|
8
|
-
border: ${e=>e.background===t.AVATAR_BACKGROUND.LIGHT||e.background===t.AVATAR_BACKGROUND.WHITE?"1px solid "+
|
|
7
|
+
background-color: ${e=>e.type===t.AVATAR_TYPES.IMAGE?"null":e.background===t.AVATAR_BACKGROUND.LIGHT?r.COLORS.background.base:e.background===t.AVATAR_BACKGROUND.WHITE?r.COLORS.surface.standard:e.background===t.AVATAR_BACKGROUND.BRAND?r.COLORS.background.brandLight:r.COLORS.background.inverse};
|
|
8
|
+
border: ${e=>e.background===t.AVATAR_BACKGROUND.LIGHT||e.background===t.AVATAR_BACKGROUND.WHITE?"1px solid "+r.COLORS.stroke.primary:0};
|
|
9
9
|
border-radius: 50%;
|
|
10
|
-
|
|
10
|
+
`,d=n.default.div`
|
|
11
|
+
display: flex;
|
|
12
|
+
align-items: center;
|
|
13
|
+
justify-content: center;
|
|
14
|
+
width: 11px;
|
|
15
|
+
height: 11px;
|
|
16
|
+
border-radius: 4px;
|
|
17
|
+
background-color: ${r.COLORS.content.secondary};
|
|
18
|
+
`;exports.AvatarStyle=A;exports.PhoneIconWrapper=d;
|
|
11
19
|
//# sourceMappingURL=Avatar.styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: props.background === AVATAR_BACKGROUND.BRAND\n\t\t\t? COLORS.background.brandLight\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT ||\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n"],"names":["AvatarStyle","styled","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS"],"mappings":"yPASaA,EAAcC,EAAAA,QAAO;AAAA,UAKvBC,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA,WAC3CA,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAIlCA,GACpBA,EAAM,OAASE,EAAAA,aAAa,MACzB,OACAF,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,KAClBJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,QAAQ,SACfJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,WAClBA,EAAAA,OAAO,WAAW,OAAO;AAAA,WAClBJ,GACVA,EAAM,aAAeG,EAAAA,kBAAkB,OACvCH,EAAM,aAAeG,EAAAA,kBAAkB,MACpC,aAAeC,EAAAA,OAAO,OAAO,QAC7B,CAAC;AAAA;AAAA"}
|
|
1
|
+
{"version":3,"file":"Avatar.styled.js","sources":["../../../../src/components/avatar/Avatar.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport {\n\tAVATAR_BACKGROUND,\n\tAVATAR_SIZE_MAP,\n\tAVATAR_TYPES,\n\tSIZE,\n} from '@src/components/avatar/AvatarHelper';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const AvatarStyle = styled.div<{\n\tsize: SIZE;\n\tbackground: AVATAR_BACKGROUND;\n\ttype: AVATAR_TYPES;\n}>`\n\twidth: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\theight: ${(props) => AVATAR_SIZE_MAP[props.size] + 'px'};\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tbackground-color: ${(props) =>\n\t\tprops.type === AVATAR_TYPES.IMAGE\n\t\t\t? 'null'\n\t\t\t: props.background === AVATAR_BACKGROUND.LIGHT\n\t\t\t? COLORS.background.base\n\t\t\t: props.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? COLORS.surface.standard\n\t\t\t: props.background === AVATAR_BACKGROUND.BRAND\n\t\t\t? COLORS.background.brandLight\n\t\t\t: COLORS.background.inverse};\n\tborder: ${(props) =>\n\t\tprops.background === AVATAR_BACKGROUND.LIGHT ||\n\t\tprops.background === AVATAR_BACKGROUND.WHITE\n\t\t\t? '1px solid ' + COLORS.stroke.primary\n\t\t\t: 0};\n\tborder-radius: 50%;\n`;\n\nexport const PhoneIconWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: 11px;\n\theight: 11px;\n\tborder-radius: 4px;\n\tbackground-color: ${COLORS.content.secondary};\n`;\n"],"names":["AvatarStyle","styled","props","AVATAR_SIZE_MAP","AVATAR_TYPES","AVATAR_BACKGROUND","COLORS","PhoneIconWrapper"],"mappings":"yPASaA,EAAcC,EAAAA,QAAO;AAAA,UAKvBC,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA,WAC3CA,GAAUC,EAAAA,gBAAgBD,EAAM,IAAI,EAAI,IAAI;AAAA;AAAA;AAAA;AAAA,qBAIlCA,GACpBA,EAAM,OAASE,EAAAA,aAAa,MACzB,OACAF,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,KAClBJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,QAAQ,SACfJ,EAAM,aAAeG,EAAAA,kBAAkB,MACvCC,EAAAA,OAAO,WAAW,WAClBA,EAAAA,OAAO,WAAW,OAAO;AAAA,WAClBJ,GACVA,EAAM,aAAeG,EAAAA,kBAAkB,OACvCH,EAAM,aAAeG,EAAAA,kBAAkB,MACpC,aAAeC,EAAAA,OAAO,OAAO,QAC7B,CAAC;AAAA;AAAA,EAIOC,EAAmBN,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAOlBK,EAAAA,OAAO,QAAQ,SAAS;AAAA"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../constants/Theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../constants/Theme.js"),c=require("../TypographyStyle.js"),l=(t,n,e,a,i)=>{if(t==="special")return r.COLORS.background.brandVeryLight;if(t==="secondaryGray")return"transparent";if(n==="chip")return t==="text"?"transparent":a?r.COLORS.surface.hovered:r.COLORS.surface.subdued;switch(t){case"primary":return i||(e?r.COLORS.background.warning.vibrant:r.COLORS.background.inverseLight);case"destructive":return r.COLORS.background.negative.vibrant;case"tertiary":return"transparent";default:return"transparent"}},L=(t,n,e,a)=>{if(t==="special")return r.COLORS.background.inverseLight;if(t==="secondaryGray")return r.COLORS.content.secondary;if(n==="chip")return t==="text"?e?r.COLORS.content.inactive:r.COLORS.content.brand:a?r.COLORS.content.primary:r.COLORS.content.secondary;switch(t){case"primary":return e?r.COLORS.content.primary:r.COLORS.content.primaryInverse;case"tertiaryGray":return r.COLORS.content.secondary;case"destructive":return r.COLORS.content.primaryInverse;case"dashBold":return r.COLORS.content.secondary;case"dashRegular":return r.COLORS.content.secondary;case"ai":return r.COLORS.content.ai;default:return e?r.COLORS.content.primaryInverse:r.COLORS.stroke.brand}},f=t=>t?"rgba(255, 255, 255, 0.5)":r.COLORS.content.inactive,S=(t,n)=>{if(t==="text")return"0px";if(n==="xs")return"4px 6px";if(n==="chip")return"4px 8px";if(n==="small")switch(t){case"tertiary":return"6px 4px";case"tertiaryGray":return"6px 4px";default:return"6px 12px"}else if(n==="medium")switch(t){case"tertiary":return"10px 4px";case"tertiaryGray":return"10px 4px";default:return"10px 12px"}else if(n==="large")switch(t){case"tertiary":return"14px 4px";case"tertiaryGray":return"14px 4px";default:return"14px 12px"}},C=(t,n,e)=>!e&&n==="ai"?t==="small"?c.ButtonRegularAI:c.ButtonLargeAI:n==="dashRegular"?c.BodySecondary:t==="chip"||t==="xs"?c.BodyCaption:t==="small"?c.ButtonRegular:c.ButtonLarge,d=(t,n,e)=>e?r.COLORS.stroke.negative.vibrant:n?r.COLORS.surface.standard:t=="secondary"?r.COLORS.stroke.brand:r.COLORS.content.placeholder,o=(t,n,e=1)=>t==="xs"?`box-shadow: inset 0 0 0 ${e}px ${n}; border: none;`:`border: ${e}px solid ${n};`,b=(t,n,e,a,i)=>n=="text"?"border: none;":n==="special"?o(e,r.COLORS.stroke.brandLightAlt):n==="secondaryGray"?o(e,r.COLORS.stroke.primary):e==="chip"?`border: ${t==="2.0"?.5:1}px solid ${r.COLORS.stroke.primary};`:a?n==="secondary"?o(e,d(n,a,i),t==="2.0"?.5:1):"border: none;":n==="secondary"?o(e,d(n,!1,i),t==="2.0"?.5:1):"border: none;",g=t=>t==="medium"?`5px,
|
|
2
2
|
transparent 5px,
|
|
3
3
|
transparent 10px`:`6px,
|
|
4
4
|
transparent 6px,
|
|
5
|
-
transparent 12px`,
|
|
6
|
-
opacity: 0.03;`:"",
|
|
7
|
-
text-decoration-color: ${r.COLORS.content.brand};`,
|
|
5
|
+
transparent 12px`,p=(t,n)=>{const e=parseInt(t.replace("#",""),16),a=Math.round(2.55*n),i=(e>>16)-a,u=(e>>8&255)-a,s=(e&255)-a;return`#${(16777216+(Math.max(i,0)<<16)+(Math.max(u,0)<<8)+Math.max(s,0)).toString(16).slice(1)}`},O=(t,n)=>{const e=parseInt(t.replace("#",""),16),a=Math.round(2.55*n),i=(e>>16)+a,u=(e>>8&255)+a,s=(e&255)+a;return`#${(16777216+(Math.min(i,255)<<16)+(Math.min(u,255)<<8)+Math.min(s,255)).toString(16).slice(1)}`},R=(t,n)=>t==="ai"?`background: ${r.COLORS.surface.aiLight};`:t==="text"?"background-color:transparent;":t==="special"||t==="secondaryGray"?"":!n&&t!=="primary"?`background-color: #000000;
|
|
6
|
+
opacity: 0.03;`:"",k=(t,n)=>n?"":`text-decoration-line: underline;
|
|
7
|
+
text-decoration-color: ${r.COLORS.content.brand};`,h=(t,n)=>n?"":t==="primary"?`background-color: ${r.COLORS.stroke.warning.lightAlt};`:"background-color: rgba(255, 255, 255, 0.1)",x=(t,n,e)=>t==="special"?`background-color: ${r.COLORS.background.base}; ${o(n,r.COLORS.stroke.primary)}`:t==="secondaryGray"?o(n,r.COLORS.stroke.primary):n==="chip"?"background-color: transparent;":t==="primary"||t==="destructive"?e?"background-color: rgba(255,255,255,0.3);":`background-color: ${r.COLORS.background.inactive};`:t==="secondary"?e?o(n,"rgba(255, 255, 255, 0.5)"):o(n,r.COLORS.stroke.primary):"",m=(t,n,e=d(t,!1))=>`
|
|
8
8
|
.line-top {
|
|
9
9
|
position: absolute;
|
|
10
10
|
left: 0;
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
to right,
|
|
16
16
|
${e},
|
|
17
17
|
${e}
|
|
18
|
-
${
|
|
18
|
+
${g(n)}
|
|
19
19
|
);
|
|
20
20
|
}
|
|
21
21
|
.line-right {
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
to bottom,
|
|
29
29
|
${e},
|
|
30
30
|
${e}
|
|
31
|
-
${
|
|
31
|
+
${g(n)}
|
|
32
32
|
);
|
|
33
33
|
}
|
|
34
34
|
.line-bottom {
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
to right,
|
|
42
42
|
${e},
|
|
43
43
|
${e}
|
|
44
|
-
${
|
|
44
|
+
${g(n)}
|
|
45
45
|
);
|
|
46
46
|
}
|
|
47
47
|
.line-left {
|
|
@@ -54,13 +54,13 @@
|
|
|
54
54
|
to bottom,
|
|
55
55
|
${e},
|
|
56
56
|
${e}
|
|
57
|
-
${
|
|
57
|
+
${g(n)}
|
|
58
58
|
);
|
|
59
59
|
}
|
|
60
|
-
`,
|
|
60
|
+
`,y=(t,n,e)=>{if(t==="text")return`background-color: ${r.COLORS.background.brandLight};
|
|
61
61
|
text-decoration-line: underline;
|
|
62
|
-
text-decoration-color: ${r.COLORS.content.brand};`;if(t==="special")return`background-color: ${r.COLORS.background.brandLight};
|
|
62
|
+
text-decoration-color: ${r.COLORS.content.brand};`;if(t==="special")return`background-color: ${r.COLORS.background.brandLight}; ${o(n,r.COLORS.stroke.brandLightAlt)}`;if(t==="secondaryGray")return`background-color: ${r.COLORS.surface.hovered}; ${o(n,r.COLORS.stroke.primary)}`;if(n==="chip")return`border: 1px solid ${r.COLORS.stroke.brandLightAlt};
|
|
63
63
|
background-color: ${r.COLORS.background.brandLight};`;if(t==="primary"||t==="destructive")return e?`background-color: ${r.COLORS.background.warning.vibrant} !important;
|
|
64
64
|
box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);
|
|
65
|
-
`:"box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);";if(t==="secondary"||t==="tertiary"||t==="tertiaryGray"||t.startsWith("dash"))return e?`background-color: ${r.COLORS.background.inverseLight} !important;`:`background-color: ${r.COLORS.background.brandLight};`}
|
|
65
|
+
`:"box-shadow: inset 0px 4px 12px rgba(0, 0, 0, 0.35);";if(t==="secondary"||t==="tertiary"||t==="tertiaryGray"||t.startsWith("dash"))return e?`background-color: ${r.COLORS.background.inverseLight} !important;`:`background-color: ${r.COLORS.background.brandLight};`},$=(t,n,e,a)=>t==="special"?`background-color: ${r.COLORS.background.brandVeryLight};`:t==="secondaryGray"?`background-color: ${r.COLORS.surface.subdued};`:n==="chip"?`background-color: ${r.COLORS.background.base};`:t==="primary"?a?`background-color: ${O(a,50)};`:`background-color: ${e?r.COLORS.background.warning.vibrant:r.COLORS.background.brandLight};`:t==="destructive"?`background-color: ${r.COLORS.background.negative.light};`:"background-color: transparent;",v=(t,n,e)=>t==="special"?o(n,r.COLORS.stroke.brandLightAlt):t==="secondaryGray"?o(n,r.COLORS.stroke.primary):n==="chip"?"border: none;":t==="secondary"?e?o(n,r.COLORS.content.secondary):o(n,r.COLORS.stroke.brandLightAlt):"",B=(t,n)=>t==="secondaryGray"?r.COLORS.content.secondary:n?t==="primary"?r.COLORS.content.primary:r.COLORS.content.primaryInverse:t==="destructive"?r.COLORS.content.negative:r.COLORS.content.brand,G=(t,n,e,a,i,u)=>{if(t==="chip")return a?r.COLORS.content.inactive:u?r.COLORS.content.primary:r.COLORS.content.secondary;if(i)return"transparent";if(n==="special")return a?r.COLORS.content.inactive:r.COLORS.background.inverseLight;if(n==="secondaryGray")return a?r.COLORS.content.inactive:r.COLORS.content.secondary;if(n==="primary"||n==="destructive")return e?a?"rgba(255, 255, 255, 0.5)":r.COLORS.content.primary:a?r.COLORS.content.inactive:r.COLORS.content.primaryInverse;if(n==="secondary")return e?a?"rgba(255, 255, 255, 0.5)":r.COLORS.content.primaryInverse:a?r.COLORS.content.inactive:r.COLORS.content.brand;if(n==="tertiary")return e?a?"rgba(255, 255, 255, 0.5)":r.COLORS.content.primaryInverse:a?r.COLORS.content.inactive:r.COLORS.content.brand;if(n==="tertiaryGray"||n.startsWith("dash"))return a?r.COLORS.content.inactive:r.COLORS.content.secondary};exports.GetButtonTextComponent=C;exports.SpinnerColorMap=B;exports.generateDisabledStyling=x;exports.generateInverseHoverBackground=h;exports.getBackgroundColor=l;exports.getBorder=b;exports.getBorderColor=d;exports.getButtonIconColor=G;exports.getClickEffect=y;exports.getColor=L;exports.getDashedBorderStyling=m;exports.getDisabledTextColor=f;exports.getHoverButtonBackground=R;exports.getHoverButtonBackgroundCustom=p;exports.getHoverButtonTextDecorationStyle=k;exports.getLinearGradientValue=g;exports.getLoadingBackground=$;exports.getLoadingBorder=v;exports.getLoadingButtonBackgroundCustom=O;exports.getPadding=S;exports.strokeStyle=o;
|
|
66
66
|
//# sourceMappingURL=themes.js.map
|