@corva/ui 3.82.0-2 → 3.82.0-4

package/cjs-bundle/components/CommentComposer/CommentComposer.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/defineProperty"),s=require("@babel/runtime/helpers/slicedToArray"),o=require("react"),n=require("@material-ui/core"),i=require("@material-ui/icons/AlternateEmail"),c=require("../../componentsV2/ButtonIcon/ButtonIcon.js"),r=require("../../componentsV2/Tooltip/Tooltip.js"),t=require("../../icons/iconParkIcons.js");require("../../icons/customIcons/icons/AddMessage.js"),require("../../icons/customIcons/icons/DragOne.js"),require("../../icons/customIcons/icons/Attention.js"),require("../../icons/customIcons/icons/Collapse.js"),require("../../icons/customIcons/icons/Dashboard.js"),require("../../icons/customIcons/icons/Expand.js"),require("../../icons/customIcons/icons/FolderClosed.js"),require("../../icons/customIcons/icons/FolderClosedFilled.js"),require("../../icons/customIcons/icons/FolderOpened.js"),require("../../icons/customIcons/icons/GreaterOrEqual.js"),require("../../icons/customIcons/icons/LessOrEqual.js"),require("../../icons/customIcons/icons/Search.js"),require("../../icons/customIcons/icons/SearchOne.js"),require("../../icons/customIcons/icons/Wellhub.js"),require("../../icons/customIcons/icons/MultiRuler.js"),require("../../icons/customIcons/icons/Checkbox.js"),require("../../icons/customIcons/icons/CheckboxChecked.js"),require("../../icons/customIcons/icons/CheckboxIndeterminate.js"),require("../../icons/customIcons/icons/Radio.js"),require("../../icons/customIcons/icons/RadioChecked.js"),require("../../icons/customIcons/icons/SimulFrac.js"),require("../../icons/customIcons/icons/ZipperFrac.js"),require("../../icons/customIcons/icons/CautionFilled.js"),require("../../icons/customIcons/icons/InfoRounded.js"),require("../../icons/customIcons/icons/FlameFilled.js"),require("../../icons/customIcons/icons/MoreApp.js"),require("../../icons/customIcons/icons/Pad.js"),require("../../icons/customIcons/icons/DrilloutUnit.js"),require("../../icons/customIcons/icons/FracFleet.js"),require("../../icons/customIcons/icons/Global.js"),require("../../icons/customIcons/icons/Program.js"),require("../../icons/customIcons/icons/Rig.js"),require("../../icons/customIcons/icons/Well.js"),require("../../icons/customIcons/icons/Gap.js"),require("../../icons/customIcons/icons/Pin.js"),require("../../icons/customIcons/icons/PinOne.js"),require("../../icons/customIcons/icons/PinOneCrossed.js"),require("../../icons/customIcons/icons/CloseOneFilled.js"),require("../../icons/customIcons/icons/AttentionFilled.js"),require("../../icons/customIcons/icons/CheckOneFilled.js"),require("../../icons/customIcons/icons/Archive.js"),require("../../icons/customIcons/icons/ArchiveCancel.js"),require("../../icons/customIcons/icons/Unarchive.js"),require("../../icons/customIcons/icons/Archived.js"),require("../../icons/customIcons/icons/InterventionUnit.js"),require("../../icons/customIcons/icons/CloudDelete.js"),require("../../icons/customIcons/icons/Lasso.js"),require("../../icons/customIcons/icons/Radius.js"),require("../../icons/customIcons/icons/ErrorOps.js"),require("../../icons/customIcons/icons/DataTypeOps.js"),require("../../icons/customIcons/icons/FalsePositiveOps.js"),require("../../icons/customIcons/icons/CalibrationOps.js"),require("../../icons/customIcons/icons/CriticalOps.js"),require("../../icons/customIcons/icons/Company.js"),require("../../icons/customIcons/icons/ArchiveOne.js"),require("../../icons/customIcons/icons/ParseBotFusion.js"),require("../../icons/customIcons/icons/Connect.js"),require("../../icons/customIcons/icons/PuzzleOne.js"),require("../../icons/customIcons/icons/Feed.js"),require("../../icons/customIcons/icons/Prompt.js"),require("../../icons/customIcons/icons/Companies.js"),require("../../icons/customIcons/icons/ClipboardAi.js"),require("../../icons/customIcons/icons/Key.js"),require("../../icons/customIcons/icons/AtSignCrossed.js"),require("../../icons/customIcons/icons/MappingManual.js"),require("../../icons/customIcons/icons/Mapping.js"),require("../../icons/customIcons/icons/Metrics.js"),require("../../icons/customIcons/icons/Drops.js"),require("../../icons/customIcons/icons/ClipboardSearch.js"),require("../../icons/customIcons/icons/Template.js"),require("../../icons/customIcons/icons/ClipboardMetrics.js"),require("../../icons/customIcons/icons/ClipboardBuilder.js"),require("../../icons/customIcons/icons/UnitConversion.js"),require("../../icons/customIcons/icons/NPT.js"),require("../../icons/customIcons/icons/GuidedFrac.js");var u=require("../Avatar/index.js"),a=require("../AttachFileButton/AttachFileButton.js"),l=require("../CommentInputNext/CommentInputNext.js"),m=require("../EmojiIconButton.js"),d=require("../FailedFileUploading.js"),j=require("../UserMention/index.js"),p=require("../UserMention/utils/index.js"),q=require("../WellhubFilePicker/WellhubFilePicker.js");require("@babel/runtime/helpers/toConsumableArray"),require("@babel/runtime/helpers/asyncToGenerator"),require("@babel/runtime/regenerator"),require("lodash/set"),require("lodash/get"),require("lodash/unset"),require("moment"),require("../../clients/jsonApi/index.js"),require("../../clients/subscriptions/subscriptions-client.factory.js"),require("../../clients/api/apiCore.js"),require("../../clients/constants.js"),require("../../clients/sso/auth0.js"),require("../../clients/sso/oauth2.js"),require("../../clients/api/rateLimiter.js"),require("uuid");var h=require("./useAttachmentUpload.js"),I=require("./CommentMetaLine.js"),b=require("./ShareToChatRow.js"),g=require("./CommentComposer.scss.js"),f=require("react/jsx-runtime");function C(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=C(e),F=C(s),x=C(i);function y(e,s){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);s&&(n=n.filter((function(s){return Object.getOwnPropertyDescriptor(e,s).enumerable}))),o.push.apply(o,n)}return o}function O(e){for(var s=1;s<arguments.length;s++){var o=null!=arguments[s]?arguments[s]:{};s%2?y(Object(o),!0).forEach((function(s){v.default(e,s,o[s])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):y(Object(o)).forEach((function(s){Object.defineProperty(e,s,Object.getOwnPropertyDescriptor(o,s))}))}return e}var A={fontSize:14,lineHeight:"20px",suggestions:{backgroundColor:"var(--palette-background-b-9)",list:{backgroundColor:"var(--palette-background-b-9)"},item:{color:"var(--palette-primary-text-1)","&focused":{backgroundColor:"rgb(from var(--palette-primary-text-1) r g b / 0.08)"}}}},S=function(e){return f.jsxs("div",{className:g.suggestion,children:[f.jsx(u.AvatarComponent,{size:26,alt:e.display,imgSrc:e.photo,displayName:e.display}),f.jsx("span",{children:e.display})]})};exports.CommentComposer=function(e){var s=e.body,i=e.onBodyChange,u=e.onSubmit,C=e.canSubmit,v=e.currentUser,y=e.attachments,P=e.onAttachmentsChange,k=e.maxAttachments,E=void 0===k?h.DEFAULT_MAX_ATTACHMENTS:k,M=e.attachment,w=e.onAttachmentChange,D=e.attachmentError,R=e.onAttachmentError,T=e.maxAttachmentSizeBytes,U=e.wellhubContext,L=e.disabled,B=e.autoFocus,N=e.placeholder,z=void 0===N?"Add a comment...":N,W=e.metaRows,G=e.isMetaSingleLine,_=e.shareToChat,H=e.trailing,K=e.renderTrailing,V=e.embedded,Q=e.className,X=e.testId,Z=!!P,$=o.useMemo((function(){return Z?null!=y?y:[]:[M].filter(Boolean)}),[Z,y,M]),J=o.useCallback((function(e){var s;P?P(e):null==w||w(null!==(s=e[0])&&void 0!==s?s:null)}),[P,w]),Y=h.useAttachmentUpload({value:$,onChange:J,onError:R,maxSizeBytes:T,maxFiles:Z?E:1}),ee=C&&!Y.isUploading,se=function(){ee&&!L&&u()},oe=o.useState(!1),ne=F.default(oe,2),ie=ne[0],ce=ne[1],re=o.useMemo((function(){return $.map((function(e){return e.name}))}),[$]),te=o.useRef(null);return f.jsxs(f.Fragment,{children:[f.jsx(l.CommentInput,{value:s,canSubmit:ee,disabled:L,onSubmit:u,trailing:K?K({canSend:ee&&!L,submit:se}):H,embedded:V,className:Q,testId:X,field:f.jsx(n.Input,{inputComponent:j,inputProps:{onChange:i,currentUser:v,allowEmptyQuery:!0,suggestionsPortalHost:document.querySelector("body"),withLightTheme:!1,mentionProps:{renderSuggestion:S},highlightLinks:!0,style:A},value:s,placeholder:z,inputRef:te,className:g.mentionField,onKeyDown:function(e){"Enter"!==e.key||e.shiftKey||ee&&!L&&(p.isSuggestionsListOpened()||(e.preventDefault(),se()))},disableUnderline:!0,rows:1,fullWidth:!0,multiline:!0,autoFocus:B}),attachments:Y.items,onAttachmentRemove:Y.removeAttachment,onAttachmentRetry:Y.handleRetry,onAttachmentReorder:Z?Y.reorderAttachments:void 0,onFilesDrop:Y.addFiles,onImageLinkPaste:Y.addLinkedImage,dropLabel:1===Y.maxFiles?"Drop a file here":"Drop files here",attachmentSlot:D?f.jsx(d,{errorMessage:D}):void 0,toolbar:f.jsxs(f.Fragment,{children:[f.jsx(a.AttachFileButton,{inputRef:Y.fileInputRef,onClick:Y.openFileDialog,onFileSelect:Y.handleFileSelect,onWellhubSelect:U?function(){return ce(!0)}:void 0,multiple:Z,disabled:Y.isFull,tooltip:Y.isFull?"Up to ".concat(Y.maxFiles," ").concat(1===Y.maxFiles?"file":"files"," can be attached"):"Attach ".concat(Z?"files":"file")}),f.jsx(r.Tooltip,{title:"Mention someone",children:f.jsx(c.ButtonIcon,{size:"xs",type:"tertiary",onClick:function(){var e,s=te.current;if(s){s.focus();var o=!!s.value&&!/\s$/.test(s.value),n="".concat(s.value).concat(o?" @":"@"),i=null===(e=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(s),"value"))||void 0===e?void 0:e.set;null==i||i.call(s,n),s.setSelectionRange(n.length,n.length),s.dispatchEvent(new Event("input",{bubbles:!0})),s.dispatchEvent(new Event("keyup",{bubbles:!0}))}},children:f.jsx(x.default,{fontSize:"inherit"})})}),f.jsx("span",{className:g.iconSlot,children:f.jsx(m,{icon:f.jsx(t.SmilingFaceIcon,{size:16}),handleSelectEmoji:function(e){return i("".concat(s).concat(e.native))}})})]}),footer:(!(null==W||!W.length)||!!_)&&f.jsxs(f.Fragment,{children:[f.jsx(I.CommentMetaLine,{rows:null!=W?W:[],singleLine:G}),_&&f.jsx(b.ShareToChatRow,O({},_))]})}),U&&f.jsx(q.WellhubFilePicker,O(O({},U),{},{open:ie,maxSelectable:Y.maxFiles-Y.count,attachedFileNames:re,onAdd:function(e){ce(!1),Y.addStoredFiles(e.map((function(e){return{fileName:e.fileName}})))},onClose:function(){return ce(!1)}}))]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/defineProperty"),s=require("@babel/runtime/helpers/slicedToArray"),o=require("react"),n=require("@material-ui/core"),i=require("@material-ui/icons/AlternateEmail"),c=require("../../componentsV2/ButtonIcon/ButtonIcon.js"),r=require("../../componentsV2/Tooltip/Tooltip.js"),t=require("../../icons/iconParkIcons.js");require("../../icons/customIcons/icons/AddMessage.js"),require("../../icons/customIcons/icons/DragOne.js"),require("../../icons/customIcons/icons/Attention.js"),require("../../icons/customIcons/icons/Collapse.js"),require("../../icons/customIcons/icons/Dashboard.js"),require("../../icons/customIcons/icons/Expand.js"),require("../../icons/customIcons/icons/FolderClosed.js"),require("../../icons/customIcons/icons/FolderClosedFilled.js"),require("../../icons/customIcons/icons/FolderOpened.js"),require("../../icons/customIcons/icons/GreaterOrEqual.js"),require("../../icons/customIcons/icons/LessOrEqual.js"),require("../../icons/customIcons/icons/Search.js"),require("../../icons/customIcons/icons/SearchOne.js"),require("../../icons/customIcons/icons/Wellhub.js"),require("../../icons/customIcons/icons/MultiRuler.js"),require("../../icons/customIcons/icons/Checkbox.js"),require("../../icons/customIcons/icons/CheckboxChecked.js"),require("../../icons/customIcons/icons/CheckboxIndeterminate.js"),require("../../icons/customIcons/icons/Radio.js"),require("../../icons/customIcons/icons/RadioChecked.js"),require("../../icons/customIcons/icons/SimulFrac.js"),require("../../icons/customIcons/icons/ZipperFrac.js"),require("../../icons/customIcons/icons/CautionFilled.js"),require("../../icons/customIcons/icons/InfoRounded.js"),require("../../icons/customIcons/icons/FlameFilled.js"),require("../../icons/customIcons/icons/MoreApp.js"),require("../../icons/customIcons/icons/Pad.js"),require("../../icons/customIcons/icons/DrilloutUnit.js"),require("../../icons/customIcons/icons/FracFleet.js"),require("../../icons/customIcons/icons/Global.js"),require("../../icons/customIcons/icons/Program.js"),require("../../icons/customIcons/icons/Rig.js"),require("../../icons/customIcons/icons/Well.js"),require("../../icons/customIcons/icons/Gap.js"),require("../../icons/customIcons/icons/Pin.js"),require("../../icons/customIcons/icons/PinOne.js"),require("../../icons/customIcons/icons/PinOneCrossed.js"),require("../../icons/customIcons/icons/CloseOneFilled.js"),require("../../icons/customIcons/icons/AttentionFilled.js"),require("../../icons/customIcons/icons/CheckOneFilled.js"),require("../../icons/customIcons/icons/Archive.js"),require("../../icons/customIcons/icons/ArchiveCancel.js"),require("../../icons/customIcons/icons/Unarchive.js"),require("../../icons/customIcons/icons/Archived.js"),require("../../icons/customIcons/icons/InterventionUnit.js"),require("../../icons/customIcons/icons/CloudDelete.js"),require("../../icons/customIcons/icons/Lasso.js"),require("../../icons/customIcons/icons/Radius.js"),require("../../icons/customIcons/icons/ErrorOps.js"),require("../../icons/customIcons/icons/DataTypeOps.js"),require("../../icons/customIcons/icons/FalsePositiveOps.js"),require("../../icons/customIcons/icons/CalibrationOps.js"),require("../../icons/customIcons/icons/CriticalOps.js"),require("../../icons/customIcons/icons/Company.js"),require("../../icons/customIcons/icons/ArchiveOne.js"),require("../../icons/customIcons/icons/ParseBotFusion.js"),require("../../icons/customIcons/icons/Connect.js"),require("../../icons/customIcons/icons/PuzzleOne.js"),require("../../icons/customIcons/icons/Feed.js"),require("../../icons/customIcons/icons/Prompt.js"),require("../../icons/customIcons/icons/Companies.js"),require("../../icons/customIcons/icons/ClipboardAi.js"),require("../../icons/customIcons/icons/Key.js"),require("../../icons/customIcons/icons/AtSignCrossed.js"),require("../../icons/customIcons/icons/MappingManual.js"),require("../../icons/customIcons/icons/Mapping.js"),require("../../icons/customIcons/icons/Metrics.js"),require("../../icons/customIcons/icons/Drops.js"),require("../../icons/customIcons/icons/ClipboardSearch.js"),require("../../icons/customIcons/icons/Template.js"),require("../../icons/customIcons/icons/ClipboardMetrics.js"),require("../../icons/customIcons/icons/ClipboardBuilder.js"),require("../../icons/customIcons/icons/UnitConversion.js"),require("../../icons/customIcons/icons/NPT.js"),require("../../icons/customIcons/icons/GuidedFrac.js");var u=require("../Avatar/index.js"),a=require("../AttachFileButton/AttachFileButton.js"),l=require("../CommentInputNext/CommentInputNext.js"),m=require("../EmojiIconButton.js"),d=require("../FailedFileUploading.js"),j=require("../UserMention/index.js"),p=require("../UserMention/utils/index.js"),q=require("../WellhubFilePicker/WellhubFilePicker.js");require("@babel/runtime/helpers/toConsumableArray"),require("@babel/runtime/helpers/asyncToGenerator"),require("@babel/runtime/regenerator"),require("lodash/set"),require("lodash/get"),require("lodash/unset"),require("moment"),require("../../clients/jsonApi/index.js"),require("../../clients/subscriptions/subscriptions-client.factory.js"),require("../../clients/api/apiCore.js"),require("../../clients/constants.js"),require("../../clients/sso/auth0.js"),require("../../clients/sso/oauth2.js"),require("../../clients/api/rateLimiter.js"),require("uuid");var h=require("./useAttachmentUpload.js"),I=require("./CommentMetaLine.js"),b=require("./ShareToChatRow.js"),g=require("./CommentComposer.scss.js"),f=require("react/jsx-runtime");function v(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var C=v(e),F=v(s),x=v(i);function y(e,s){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);s&&(n=n.filter((function(s){return Object.getOwnPropertyDescriptor(e,s).enumerable}))),o.push.apply(o,n)}return o}function O(e){for(var s=1;s<arguments.length;s++){var o=null!=arguments[s]?arguments[s]:{};s%2?y(Object(o),!0).forEach((function(s){C.default(e,s,o[s])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):y(Object(o)).forEach((function(s){Object.defineProperty(e,s,Object.getOwnPropertyDescriptor(o,s))}))}return e}var A={fontSize:14,lineHeight:"20px",suggestions:{backgroundColor:"var(--palette-background-b-9)",list:{backgroundColor:"var(--palette-background-b-9)"},item:{color:"var(--palette-primary-text-1)","&focused":{backgroundColor:"rgb(from var(--palette-primary-text-1) r g b / 0.08)"}}}},S=function(e){return f.jsxs("div",{className:g.suggestion,children:[f.jsx(u.AvatarComponent,{size:26,alt:e.display,imgSrc:e.photo,displayName:e.display}),f.jsx("span",{children:e.display})]})};exports.CommentComposer=function(e){var s=e.body,i=e.onBodyChange,u=e.onSubmit,v=e.canSubmit,C=e.currentUser,y=e.attachments,P=e.onAttachmentsChange,k=e.maxAttachments,E=void 0===k?h.DEFAULT_MAX_ATTACHMENTS:k,M=e.attachment,R=e.onAttachmentChange,w=e.attachmentError,D=e.onAttachmentError,T=e.maxAttachmentSizeBytes,U=e.wellhubContext,L=e.disabled,B=e.autoFocus,N=e.placeholder,z=void 0===N?"Add a comment...":N,W=e.metaRows,G=e.isMetaSingleLine,_=e.shareToChat,H=e.trailing,K=e.renderTrailing,V=e.embedded,Q=e.className,X=e.testId,Z=!!P,$=o.useMemo((function(){return Z?null!=y?y:[]:[M].filter(Boolean)}),[Z,y,M]),J=o.useCallback((function(e){var s;P?P(e):null==R||R(null!==(s=e[0])&&void 0!==s?s:null)}),[P,R]),Y=h.useAttachmentUpload({value:$,onChange:J,onError:D,maxSizeBytes:T,maxFiles:Z?E:1}),ee=v&&!Y.isUploading,se=function(){ee&&!L&&u()},oe=o.useState(!1),ne=F.default(oe,2),ie=ne[0],ce=ne[1],re=o.useMemo((function(){return $.map((function(e){return e.name}))}),[$]),te=o.useRef(null);o.useEffect((function(){var e=te.current;B&&e&&e.setSelectionRange(e.value.length,e.value.length)}),[B]);return f.jsxs(f.Fragment,{children:[f.jsx(l.CommentInput,{value:s,canSubmit:ee,disabled:L,onSubmit:u,trailing:K?K({canSend:ee&&!L,submit:se}):H,embedded:V,className:Q,testId:X,field:f.jsx(n.Input,{inputComponent:j,inputProps:{onChange:i,currentUser:C,allowEmptyQuery:!0,suggestionsPortalHost:document.querySelector("body"),withLightTheme:!1,mentionProps:{renderSuggestion:S},highlightLinks:!0,style:A},value:s,placeholder:z,inputRef:te,className:g.mentionField,onKeyDown:function(e){"Enter"!==e.key||e.shiftKey||ee&&!L&&(p.isSuggestionsListOpened()||(e.preventDefault(),se()))},disableUnderline:!0,rows:1,fullWidth:!0,multiline:!0,autoFocus:B}),attachments:Y.items,onAttachmentRemove:Y.removeAttachment,onAttachmentRetry:Y.handleRetry,onAttachmentReorder:Z?Y.reorderAttachments:void 0,onFilesDrop:Y.addFiles,onImageLinkPaste:Y.addLinkedImage,dropLabel:1===Y.maxFiles?"Drop a file here":"Drop files here",attachmentSlot:w?f.jsx(d,{errorMessage:w}):void 0,toolbar:f.jsxs(f.Fragment,{children:[f.jsx(a.AttachFileButton,{inputRef:Y.fileInputRef,onClick:Y.openFileDialog,onFileSelect:Y.handleFileSelect,onWellhubSelect:U?function(){return ce(!0)}:void 0,multiple:Z,disabled:Y.isFull,tooltip:Y.isFull?"Up to ".concat(Y.maxFiles," ").concat(1===Y.maxFiles?"file":"files"," can be attached"):"Attach ".concat(Z?"files":"file")}),f.jsx(r.Tooltip,{title:"Mention someone",children:f.jsx(c.ButtonIcon,{size:"xs",type:"tertiary",onClick:function(){var e,s=te.current;if(s){s.focus();var o=!!s.value&&!/\s$/.test(s.value),n="".concat(s.value).concat(o?" @":"@"),i=null===(e=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(s),"value"))||void 0===e?void 0:e.set;null==i||i.call(s,n),s.setSelectionRange(n.length,n.length),s.dispatchEvent(new Event("input",{bubbles:!0})),s.dispatchEvent(new Event("keyup",{bubbles:!0}))}},children:f.jsx(x.default,{fontSize:"inherit"})})}),f.jsx("span",{className:g.iconSlot,children:f.jsx(m,{icon:f.jsx(t.SmilingFaceIcon,{size:16}),handleSelectEmoji:function(e){return i("".concat(s).concat(e.native))}})})]}),footer:(!(null==W||!W.length)||!!_)&&f.jsxs(f.Fragment,{children:[f.jsx(I.CommentMetaLine,{rows:null!=W?W:[],singleLine:G}),_&&f.jsx(b.ShareToChatRow,O({},_))]})}),U&&f.jsx(q.WellhubFilePicker,O(O({},U),{},{open:ie,maxSelectable:Y.maxFiles-Y.count,attachedFileNames:re,onAdd:function(e){ce(!1),Y.addStoredFiles(e.map((function(e){return{fileName:e.fileName}})))},onClose:function(){return ce(!1)}}))]})};
 //# sourceMappingURL=CommentComposer.js.map

package/cjs-bundle/components/CommentComposer/CommentComposer.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommentComposer.js","sources":["../../../../src/components/CommentComposer/CommentComposer.tsx"],"sourcesContent":["import {\n  CSSProperties,\n  FormEventHandler,\n  KeyboardEvent,\n  ReactNode,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { Input } from '@material-ui/core';\nimport AlternateEmailIcon from '@material-ui/icons/AlternateEmail';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { SmilingFaceIcon } from '../../icons';\nimport Avatar from '../Avatar';\nimport { AttachFileButton } from '../AttachFileButton';\nimport { CommentInput } from '../CommentInputNext/CommentInputNext';\nimport EmojiIconButton from '../EmojiIconButton';\nimport FailedFileUploading from '../FailedFileUploading';\nimport UserMention from '../UserMention';\nimport { isSuggestionsListOpened } from '../UserMention/utils';\nimport { WellhubFilePicker } from '../WellhubFilePicker';\nimport type { WellhubContext, WellhubFile } from '../WellhubFilePicker';\n\nimport {\n  useAttachmentUpload,\n  UploadedAttachment,\n  DEFAULT_MAX_ATTACHMENTS,\n} from './useAttachmentUpload';\nimport { CommentMetaLine, CommentMetaRow } from './CommentMetaLine';\nimport { ShareToChatRow, ShareToChatRowProps } from './ShareToChatRow';\n\nimport styles from './CommentComposer.scss';\n\n/* eslint-disable camelcase -- mirrors the platform's snake_case user payload. */\nexport type CommentComposerUser = {\n  id?: number;\n  company_id?: number;\n  first_name?: string;\n  last_name?: string;\n  profile_photo?: string;\n  [key: string]: unknown;\n};\n/* eslint-enable camelcase */\n\nexport type CommentComposerTrailingState = {\n  canSend: boolean;\n  submit: () => void;\n};\n\nexport type CommentComposerProps = {\n  body: string;\n  onBodyChange: (value: string) => void;\n  onSubmit: () => void;\n  canSubmit: boolean;\n  currentUser: CommentComposerUser;\n\n  attachments?: UploadedAttachment[];\n  onAttachmentsChange?: (attachments: UploadedAttachment[]) => void;\n  maxAttachments?: number;\n  /** @deprecated Use `attachments` — kept so single-attachment callers keep working. */\n  attachment?: UploadedAttachment | null;\n  /** @deprecated Use `onAttachmentsChange`. */\n  onAttachmentChange?: (attachment: UploadedAttachment | null) => void;\n  attachmentError?: string | null;\n  onAttachmentError?: (message: string | null) => void;\n  maxAttachmentSizeBytes?: number;\n  wellhubContext?: WellhubContext;\n\n  disabled?: boolean;\n  autoFocus?: boolean;\n  placeholder?: string;\n  metaRows?: CommentMetaRow[];\n  isMetaSingleLine?: boolean;\n  shareToChat?: Omit<ShareToChatRowProps, 'testId'>;\n  /** Replaces the default send button, e.g. the edit form's Cancel/Save. */\n  trailing?: ReactNode;\n  /** Like `trailing`, but receives the upload-aware send state for a custom Save. */\n  renderTrailing?: (state: CommentComposerTrailingState) => ReactNode;\n  /** Render flush inside a host card instead of as its own surface. */\n  embedded?: boolean;\n  className?: string;\n  testId?: string;\n};\n\nconst SUGGESTIONS_BACKGROUND = 'var(--palette-background-b-9)';\n\n// Module-level so react-mentions isn't re-rendered on every keystroke.\nconst MENTION_INPUT_STYLE = {\n  fontSize: 14,\n  lineHeight: '20px',\n  suggestions: {\n    backgroundColor: SUGGESTIONS_BACKGROUND,\n    list: { backgroundColor: SUGGESTIONS_BACKGROUND },\n    item: {\n      color: 'var(--palette-primary-text-1)',\n      '&focused': { backgroundColor: 'rgb(from var(--palette-primary-text-1) r g b / 0.08)' },\n    },\n  },\n} as unknown as CSSProperties;\n\nconst renderSuggestion = (entry: { display: string; photo?: string }) => (\n  <div className={styles.suggestion}>\n    <Avatar size={26} alt={entry.display} imgSrc={entry.photo} displayName={entry.display} />\n    <span>{entry.display}</span>\n  </div>\n);\n\nexport const CommentComposer = ({\n  body,\n  onBodyChange,\n  onSubmit,\n  canSubmit,\n  currentUser,\n  attachments,\n  onAttachmentsChange,\n  maxAttachments = DEFAULT_MAX_ATTACHMENTS,\n  attachment,\n  onAttachmentChange,\n  attachmentError,\n  onAttachmentError,\n  maxAttachmentSizeBytes,\n  wellhubContext,\n  disabled,\n  autoFocus,\n  placeholder = 'Add a comment...',\n  metaRows,\n  isMetaSingleLine,\n  shareToChat,\n  trailing,\n  renderTrailing,\n  embedded,\n  className,\n  testId,\n}: CommentComposerProps) => {\n  // Callers still on the singular props get the old one-file behaviour, unchanged.\n  const isMulti = !!onAttachmentsChange;\n  const value = useMemo(\n    () => (isMulti ? attachments ?? [] : ([attachment].filter(Boolean) as UploadedAttachment[])),\n    [isMulti, attachments, attachment]\n  );\n\n  const handleAttachmentsChange = useCallback(\n    (next: UploadedAttachment[]) => {\n      if (onAttachmentsChange) onAttachmentsChange(next);\n      else onAttachmentChange?.(next[0] ?? null);\n    },\n    [onAttachmentsChange, onAttachmentChange]\n  );\n\n  const upload = useAttachmentUpload({\n    value,\n    onChange: handleAttachmentsChange,\n    onError: onAttachmentError,\n    maxSizeBytes: maxAttachmentSizeBytes,\n    maxFiles: isMulti ? maxAttachments : 1,\n  });\n\n  // An attachment only lands once S3 confirms, so posting mid-upload would drop it.\n  const canSend = canSubmit && !upload.isUploading;\n\n  const submit = () => {\n    if (!canSend || disabled) return;\n\n    onSubmit();\n  };\n\n  const [isWellhubOpen, setIsWellhubOpen] = useState(false);\n  const attachedKeys = useMemo(() => value.map(item => item.name), [value]);\n\n  const addWellhubFiles = (files: WellhubFile[]) => {\n    setIsWellhubOpen(false);\n    upload.addStoredFiles(files.map(file => ({ fileName: file.fileName })));\n  };\n\n  const fieldRef = useRef<HTMLTextAreaElement | null>(null);\n\n  // react-mentions opens suggestions from textarea events, so type \"@\" instead of setting state.\n  const mentionSomeone = () => {\n    const field = fieldRef.current;\n    if (!field) return;\n\n    field.focus();\n\n    const needsSpace = !!field.value && !/\\s$/.test(field.value);\n    const nextValue = `${field.value}${needsSpace ? ' @' : '@'}`;\n    const setValue = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(field), 'value')?.set;\n\n    setValue?.call(field, nextValue);\n    field.setSelectionRange(nextValue.length, nextValue.length);\n    field.dispatchEvent(new Event('input', { bubbles: true }));\n    field.dispatchEvent(new Event('keyup', { bubbles: true }));\n  };\n\n  const handleEnterKey = (event: KeyboardEvent) => {\n    if (event.key !== 'Enter' || event.shiftKey) return;\n    if (!canSend || disabled) return;\n    if (isSuggestionsListOpened()) return;\n\n    event.preventDefault();\n    submit();\n  };\n\n  return (\n    <>\n      <CommentInput\n        value={body}\n        canSubmit={canSend}\n        disabled={disabled}\n        onSubmit={onSubmit}\n        trailing={\n          renderTrailing ? renderTrailing({ canSend: canSend && !disabled, submit }) : trailing\n        }\n        embedded={embedded}\n        className={className}\n        testId={testId}\n        field={\n          <Input\n            inputComponent={UserMention}\n            inputProps={{\n              // UserMention calls onChange with the text string, not a DOM event.\n              onChange: onBodyChange as unknown as FormEventHandler<HTMLInputElement>,\n              currentUser,\n              allowEmptyQuery: true,\n              suggestionsPortalHost: document.querySelector('body'),\n              withLightTheme: false,\n              mentionProps: { renderSuggestion },\n              highlightLinks: true,\n              style: MENTION_INPUT_STYLE,\n            }}\n            value={body}\n            placeholder={placeholder}\n            inputRef={fieldRef}\n            className={styles.mentionField}\n            onKeyDown={handleEnterKey}\n            disableUnderline\n            rows={1}\n            fullWidth\n            multiline\n            autoFocus={autoFocus}\n          />\n        }\n        attachments={upload.items}\n        onAttachmentRemove={upload.removeAttachment}\n        onAttachmentRetry={upload.handleRetry}\n        onAttachmentReorder={isMulti ? upload.reorderAttachments : undefined}\n        onFilesDrop={upload.addFiles}\n        onImageLinkPaste={upload.addLinkedImage}\n        dropLabel={upload.maxFiles === 1 ? 'Drop a file here' : 'Drop files here'}\n        attachmentSlot={\n          attachmentError ? <FailedFileUploading errorMessage={attachmentError} /> : undefined\n        }\n        toolbar={\n          <>\n            <AttachFileButton\n              inputRef={upload.fileInputRef}\n              onClick={upload.openFileDialog}\n              onFileSelect={upload.handleFileSelect}\n              onWellhubSelect={wellhubContext ? () => setIsWellhubOpen(true) : undefined}\n              multiple={isMulti}\n              disabled={upload.isFull}\n              tooltip={\n                upload.isFull\n                  ? `Up to ${upload.maxFiles} ${\n                      upload.maxFiles === 1 ? 'file' : 'files'\n                    } can be attached`\n                  : `Attach ${isMulti ? 'files' : 'file'}`\n              }\n            />\n            <Tooltip title=\"Mention someone\">\n              <ButtonIcon size=\"xs\" type=\"tertiary\" onClick={mentionSomeone}>\n                <AlternateEmailIcon fontSize=\"inherit\" />\n              </ButtonIcon>\n            </Tooltip>\n            <span className={styles.iconSlot}>\n              <EmojiIconButton\n                icon={<SmilingFaceIcon size={16} />}\n                handleSelectEmoji={(emoji: { native: string }) =>\n                  onBodyChange(`${body}${emoji.native}`)\n                }\n              />\n            </span>\n          </>\n        }\n        footer={\n          (!!metaRows?.length || !!shareToChat) && (\n            <>\n              <CommentMetaLine rows={metaRows ?? []} singleLine={isMetaSingleLine} />\n              {shareToChat && <ShareToChatRow {...shareToChat} />}\n            </>\n          )\n        }\n      />\n\n      {wellhubContext && (\n        <WellhubFilePicker\n          {...wellhubContext}\n          open={isWellhubOpen}\n          maxSelectable={upload.maxFiles - upload.count}\n          attachedFileNames={attachedKeys}\n          onAdd={addWellhubFiles}\n          onClose={() => setIsWellhubOpen(false)}\n        />\n      )}\n    </>\n  );\n};\n"],"names":["MENTION_INPUT_STYLE","fontSize","lineHeight","suggestions","backgroundColor","list","item","color","renderSuggestion","entry","_jsxs","className","styles","suggestion","children","_jsx","Avatar","size","alt","display","imgSrc","photo","displayName","jsx","_ref","body","onBodyChange","onSubmit","canSubmit","currentUser","attachments","onAttachmentsChange","_ref$maxAttachments","maxAttachments","DEFAULT_MAX_ATTACHMENTS","attachment","onAttachmentChange","attachmentError","onAttachmentError","maxAttachmentSizeBytes","wellhubContext","disabled","autoFocus","_ref$placeholder","placeholder","metaRows","isMetaSingleLine","shareToChat","trailing","renderTrailing","embedded","testId","isMulti","value","useMemo","filter","Boolean","handleAttachmentsChange","useCallback","next","_next$","upload","useAttachmentUpload","onChange","onError","maxSizeBytes","maxFiles","canSend","isUploading","submit","useState","_useState2","_slicedToArray","_useState","isWellhubOpen","setIsWellhubOpen","attachedKeys","map","name","fieldRef","useRef","_Fragment","CommentInput","field","Input","inputComponent","UserMention","inputProps","allowEmptyQuery","suggestionsPortalHost","document","querySelector","withLightTheme","mentionProps","highlightLinks","style","inputRef","mentionField","onKeyDown","event","key","shiftKey","isSuggestionsListOpened","preventDefault","disableUnderline","rows","fullWidth","multiline","items","onAttachmentRemove","removeAttachment","onAttachmentRetry","handleRetry","onAttachmentReorder","reorderAttachments","undefined","onFilesDrop","addFiles","onImageLinkPaste","addLinkedImage","dropLabel","attachmentSlot","FailedFileUploading","errorMessage","toolbar","jsxs","AttachFileButton","fileInputRef","onClick","openFileDialog","onFileSelect","handleFileSelect","onWellhubSelect","multiple","isFull","tooltip","concat","Tooltip","title","ButtonIcon","type","_Object$getOwnPropert","current","focus","needsSpace","test","nextValue","setValue","Object","getOwnPropertyDescriptor","getPrototypeOf","set","call","setSelectionRange","length","dispatchEvent","Event","bubbles","AlternateEmailIcon","iconSlot","EmojiIconButton","icon","SmilingFaceIcon","handleSelectEmoji","emoji","native","footer","CommentMetaLine","singleLine","ShareToChatRow","_objectSpread","WellhubFilePicker","open","maxSelectable","count","attachedFileNames","onAdd","files","addStoredFiles","file","fileName","onClose"],"mappings":"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"}
+{"version":3,"file":"CommentComposer.js","sources":["../../../../src/components/CommentComposer/CommentComposer.tsx"],"sourcesContent":["import {\n  CSSProperties,\n  FormEventHandler,\n  KeyboardEvent,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { Input } from '@material-ui/core';\nimport AlternateEmailIcon from '@material-ui/icons/AlternateEmail';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { SmilingFaceIcon } from '../../icons';\nimport Avatar from '../Avatar';\nimport { AttachFileButton } from '../AttachFileButton';\nimport { CommentInput } from '../CommentInputNext/CommentInputNext';\nimport EmojiIconButton from '../EmojiIconButton';\nimport FailedFileUploading from '../FailedFileUploading';\nimport UserMention from '../UserMention';\nimport { isSuggestionsListOpened } from '../UserMention/utils';\nimport { WellhubFilePicker } from '../WellhubFilePicker';\nimport type { WellhubContext, WellhubFile } from '../WellhubFilePicker';\n\nimport {\n  useAttachmentUpload,\n  UploadedAttachment,\n  DEFAULT_MAX_ATTACHMENTS,\n} from './useAttachmentUpload';\nimport { CommentMetaLine, CommentMetaRow } from './CommentMetaLine';\nimport { ShareToChatRow, ShareToChatRowProps } from './ShareToChatRow';\n\nimport styles from './CommentComposer.scss';\n\n/* eslint-disable camelcase -- mirrors the platform's snake_case user payload. */\nexport type CommentComposerUser = {\n  id?: number;\n  company_id?: number;\n  first_name?: string;\n  last_name?: string;\n  profile_photo?: string;\n  [key: string]: unknown;\n};\n/* eslint-enable camelcase */\n\nexport type CommentComposerTrailingState = {\n  canSend: boolean;\n  submit: () => void;\n};\n\nexport type CommentComposerProps = {\n  body: string;\n  onBodyChange: (value: string) => void;\n  onSubmit: () => void;\n  canSubmit: boolean;\n  currentUser: CommentComposerUser;\n\n  attachments?: UploadedAttachment[];\n  onAttachmentsChange?: (attachments: UploadedAttachment[]) => void;\n  maxAttachments?: number;\n  /** @deprecated Use `attachments` — kept so single-attachment callers keep working. */\n  attachment?: UploadedAttachment | null;\n  /** @deprecated Use `onAttachmentsChange`. */\n  onAttachmentChange?: (attachment: UploadedAttachment | null) => void;\n  attachmentError?: string | null;\n  onAttachmentError?: (message: string | null) => void;\n  maxAttachmentSizeBytes?: number;\n  wellhubContext?: WellhubContext;\n\n  disabled?: boolean;\n  autoFocus?: boolean;\n  placeholder?: string;\n  metaRows?: CommentMetaRow[];\n  isMetaSingleLine?: boolean;\n  shareToChat?: Omit<ShareToChatRowProps, 'testId'>;\n  /** Replaces the default send button, e.g. the edit form's Cancel/Save. */\n  trailing?: ReactNode;\n  /** Like `trailing`, but receives the upload-aware send state for a custom Save. */\n  renderTrailing?: (state: CommentComposerTrailingState) => ReactNode;\n  /** Render flush inside a host card instead of as its own surface. */\n  embedded?: boolean;\n  className?: string;\n  testId?: string;\n};\n\nconst SUGGESTIONS_BACKGROUND = 'var(--palette-background-b-9)';\n\n// Module-level so react-mentions isn't re-rendered on every keystroke.\nconst MENTION_INPUT_STYLE = {\n  fontSize: 14,\n  lineHeight: '20px',\n  suggestions: {\n    backgroundColor: SUGGESTIONS_BACKGROUND,\n    list: { backgroundColor: SUGGESTIONS_BACKGROUND },\n    item: {\n      color: 'var(--palette-primary-text-1)',\n      '&focused': { backgroundColor: 'rgb(from var(--palette-primary-text-1) r g b / 0.08)' },\n    },\n  },\n} as unknown as CSSProperties;\n\nconst renderSuggestion = (entry: { display: string; photo?: string }) => (\n  <div className={styles.suggestion}>\n    <Avatar size={26} alt={entry.display} imgSrc={entry.photo} displayName={entry.display} />\n    <span>{entry.display}</span>\n  </div>\n);\n\nexport const CommentComposer = ({\n  body,\n  onBodyChange,\n  onSubmit,\n  canSubmit,\n  currentUser,\n  attachments,\n  onAttachmentsChange,\n  maxAttachments = DEFAULT_MAX_ATTACHMENTS,\n  attachment,\n  onAttachmentChange,\n  attachmentError,\n  onAttachmentError,\n  maxAttachmentSizeBytes,\n  wellhubContext,\n  disabled,\n  autoFocus,\n  placeholder = 'Add a comment...',\n  metaRows,\n  isMetaSingleLine,\n  shareToChat,\n  trailing,\n  renderTrailing,\n  embedded,\n  className,\n  testId,\n}: CommentComposerProps) => {\n  // Callers still on the singular props get the old one-file behaviour, unchanged.\n  const isMulti = !!onAttachmentsChange;\n  const value = useMemo(\n    () => (isMulti ? attachments ?? [] : ([attachment].filter(Boolean) as UploadedAttachment[])),\n    [isMulti, attachments, attachment]\n  );\n\n  const handleAttachmentsChange = useCallback(\n    (next: UploadedAttachment[]) => {\n      if (onAttachmentsChange) onAttachmentsChange(next);\n      else onAttachmentChange?.(next[0] ?? null);\n    },\n    [onAttachmentsChange, onAttachmentChange]\n  );\n\n  const upload = useAttachmentUpload({\n    value,\n    onChange: handleAttachmentsChange,\n    onError: onAttachmentError,\n    maxSizeBytes: maxAttachmentSizeBytes,\n    maxFiles: isMulti ? maxAttachments : 1,\n  });\n\n  // An attachment only lands once S3 confirms, so posting mid-upload would drop it.\n  const canSend = canSubmit && !upload.isUploading;\n\n  const submit = () => {\n    if (!canSend || disabled) return;\n\n    onSubmit();\n  };\n\n  const [isWellhubOpen, setIsWellhubOpen] = useState(false);\n  const attachedKeys = useMemo(() => value.map(item => item.name), [value]);\n\n  const addWellhubFiles = (files: WellhubFile[]) => {\n    setIsWellhubOpen(false);\n    upload.addStoredFiles(files.map(file => ({ fileName: file.fileName })));\n  };\n\n  const fieldRef = useRef<HTMLTextAreaElement | null>(null);\n\n  // An autofocused edit form lands the caret at the start; editing usually continues from the end.\n  useEffect(() => {\n    const field = fieldRef.current;\n    if (!autoFocus || !field) return;\n\n    field.setSelectionRange(field.value.length, field.value.length);\n  }, [autoFocus]);\n\n  // react-mentions opens suggestions from textarea events, so type \"@\" instead of setting state.\n  const mentionSomeone = () => {\n    const field = fieldRef.current;\n    if (!field) return;\n\n    field.focus();\n\n    const needsSpace = !!field.value && !/\\s$/.test(field.value);\n    const nextValue = `${field.value}${needsSpace ? ' @' : '@'}`;\n    const setValue = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(field), 'value')?.set;\n\n    setValue?.call(field, nextValue);\n    field.setSelectionRange(nextValue.length, nextValue.length);\n    field.dispatchEvent(new Event('input', { bubbles: true }));\n    field.dispatchEvent(new Event('keyup', { bubbles: true }));\n  };\n\n  const handleEnterKey = (event: KeyboardEvent) => {\n    if (event.key !== 'Enter' || event.shiftKey) return;\n    if (!canSend || disabled) return;\n    if (isSuggestionsListOpened()) return;\n\n    event.preventDefault();\n    submit();\n  };\n\n  return (\n    <>\n      <CommentInput\n        value={body}\n        canSubmit={canSend}\n        disabled={disabled}\n        onSubmit={onSubmit}\n        trailing={\n          renderTrailing ? renderTrailing({ canSend: canSend && !disabled, submit }) : trailing\n        }\n        embedded={embedded}\n        className={className}\n        testId={testId}\n        field={\n          <Input\n            inputComponent={UserMention}\n            inputProps={{\n              // UserMention calls onChange with the text string, not a DOM event.\n              onChange: onBodyChange as unknown as FormEventHandler<HTMLInputElement>,\n              currentUser,\n              allowEmptyQuery: true,\n              suggestionsPortalHost: document.querySelector('body'),\n              withLightTheme: false,\n              mentionProps: { renderSuggestion },\n              highlightLinks: true,\n              style: MENTION_INPUT_STYLE,\n            }}\n            value={body}\n            placeholder={placeholder}\n            inputRef={fieldRef}\n            className={styles.mentionField}\n            onKeyDown={handleEnterKey}\n            disableUnderline\n            rows={1}\n            fullWidth\n            multiline\n            autoFocus={autoFocus}\n          />\n        }\n        attachments={upload.items}\n        onAttachmentRemove={upload.removeAttachment}\n        onAttachmentRetry={upload.handleRetry}\n        onAttachmentReorder={isMulti ? upload.reorderAttachments : undefined}\n        onFilesDrop={upload.addFiles}\n        onImageLinkPaste={upload.addLinkedImage}\n        dropLabel={upload.maxFiles === 1 ? 'Drop a file here' : 'Drop files here'}\n        attachmentSlot={\n          attachmentError ? <FailedFileUploading errorMessage={attachmentError} /> : undefined\n        }\n        toolbar={\n          <>\n            <AttachFileButton\n              inputRef={upload.fileInputRef}\n              onClick={upload.openFileDialog}\n              onFileSelect={upload.handleFileSelect}\n              onWellhubSelect={wellhubContext ? () => setIsWellhubOpen(true) : undefined}\n              multiple={isMulti}\n              disabled={upload.isFull}\n              tooltip={\n                upload.isFull\n                  ? `Up to ${upload.maxFiles} ${\n                      upload.maxFiles === 1 ? 'file' : 'files'\n                    } can be attached`\n                  : `Attach ${isMulti ? 'files' : 'file'}`\n              }\n            />\n            <Tooltip title=\"Mention someone\">\n              <ButtonIcon size=\"xs\" type=\"tertiary\" onClick={mentionSomeone}>\n                <AlternateEmailIcon fontSize=\"inherit\" />\n              </ButtonIcon>\n            </Tooltip>\n            <span className={styles.iconSlot}>\n              <EmojiIconButton\n                icon={<SmilingFaceIcon size={16} />}\n                handleSelectEmoji={(emoji: { native: string }) =>\n                  onBodyChange(`${body}${emoji.native}`)\n                }\n              />\n            </span>\n          </>\n        }\n        footer={\n          (!!metaRows?.length || !!shareToChat) && (\n            <>\n              <CommentMetaLine rows={metaRows ?? []} singleLine={isMetaSingleLine} />\n              {shareToChat && <ShareToChatRow {...shareToChat} />}\n            </>\n          )\n        }\n      />\n\n      {wellhubContext && (\n        <WellhubFilePicker\n          {...wellhubContext}\n          open={isWellhubOpen}\n          maxSelectable={upload.maxFiles - upload.count}\n          attachedFileNames={attachedKeys}\n          onAdd={addWellhubFiles}\n          onClose={() => setIsWellhubOpen(false)}\n        />\n      )}\n    </>\n  );\n};\n"],"names":["MENTION_INPUT_STYLE","fontSize","lineHeight","suggestions","backgroundColor","list","item","color","renderSuggestion","entry","_jsxs","className","styles","suggestion","children","_jsx","Avatar","size","alt","display","imgSrc","photo","displayName","jsx","_ref","body","onBodyChange","onSubmit","canSubmit","currentUser","attachments","onAttachmentsChange","_ref$maxAttachments","maxAttachments","DEFAULT_MAX_ATTACHMENTS","attachment","onAttachmentChange","attachmentError","onAttachmentError","maxAttachmentSizeBytes","wellhubContext","disabled","autoFocus","_ref$placeholder","placeholder","metaRows","isMetaSingleLine","shareToChat","trailing","renderTrailing","embedded","testId","isMulti","value","useMemo","filter","Boolean","handleAttachmentsChange","useCallback","next","_next$","upload","useAttachmentUpload","onChange","onError","maxSizeBytes","maxFiles","canSend","isUploading","submit","useState","_useState2","_slicedToArray","_useState","isWellhubOpen","setIsWellhubOpen","attachedKeys","map","name","fieldRef","useRef","useEffect","field","current","setSelectionRange","length","_Fragment","CommentInput","Input","inputComponent","UserMention","inputProps","allowEmptyQuery","suggestionsPortalHost","document","querySelector","withLightTheme","mentionProps","highlightLinks","style","inputRef","mentionField","onKeyDown","event","key","shiftKey","isSuggestionsListOpened","preventDefault","disableUnderline","rows","fullWidth","multiline","items","onAttachmentRemove","removeAttachment","onAttachmentRetry","handleRetry","onAttachmentReorder","reorderAttachments","undefined","onFilesDrop","addFiles","onImageLinkPaste","addLinkedImage","dropLabel","attachmentSlot","FailedFileUploading","errorMessage","toolbar","jsxs","AttachFileButton","fileInputRef","onClick","openFileDialog","onFileSelect","handleFileSelect","onWellhubSelect","multiple","isFull","tooltip","concat","Tooltip","title","ButtonIcon","type","_Object$getOwnPropert","focus","needsSpace","test","nextValue","setValue","Object","getOwnPropertyDescriptor","getPrototypeOf","set","call","dispatchEvent","Event","bubbles","AlternateEmailIcon","iconSlot","EmojiIconButton","icon","SmilingFaceIcon","handleSelectEmoji","emoji","native","footer","CommentMetaLine","singleLine","ShareToChatRow","_objectSpread","WellhubFilePicker","open","maxSelectable","count","attachedFileNames","onAdd","files","addStoredFiles","file","fileName","onClose"],"mappings":"4oMAwFA,IAGMA,EAAsB,CAC1BC,SAAU,GACVC,WAAY,OACZC,YAAa,CACXC,gBAP2B,gCAQ3BC,KAAM,CAAED,gBARmB,iCAS3BE,KAAM,CACJC,MAAO,gCACP,WAAY,CAAEH,gBAAiB,2DAK/BI,EAAmB,SAACC,GAA0C,OAClEC,EAAAA,KAAA,MAAA,CAAKC,UAAWC,EAAOC,WAAWC,SAAA,CAChCC,MAACC,kBAAM,CAACC,KAAM,GAAIC,IAAKT,EAAMU,QAASC,OAAQX,EAAMY,MAAOC,YAAab,EAAMU,UAC9EJ,EAAAQ,IAAA,OAAA,CAAAT,SAAOL,EAAMU,YACT,0BAGuB,SA0BHK,GAAA,IAzB1BC,IAAAA,KACAC,IAAAA,aACAC,IAAAA,SACAC,IAAAA,UACAC,IAAAA,YACAC,IAAAA,YACAC,IAAAA,oBAAmBC,EAAAR,EACnBS,eAAAA,aAAiBC,EAAuBA,wBAAAF,EACxCG,IAAAA,WACAC,IAAAA,mBACAC,IAAAA,gBACAC,IAAAA,kBACAC,IAAAA,uBACAC,IAAAA,eACAC,IAAAA,SACAC,IAAAA,UAASC,EAAAnB,EACToB,YAAAA,aAAc,mBAAkBD,EAChCE,IAAAA,SACAC,IAAAA,iBACAC,IAAAA,YACAC,IAAAA,SACAC,IAAAA,eACAC,IAAAA,SACAvC,IAAAA,UACAwC,IAAAA,OAGMC,IAAYrB,EACZsB,EAAQC,EAAAA,SACZ,WAAA,OAAOF,EAAUtB,QAAAA,EAAe,GAAM,CAACK,GAAYoB,OAAOC,QAAkC,GAC5F,CAACJ,EAAStB,EAAaK,IAGnBsB,EAA0BC,eAC9B,SAACC,GAA+B,IAAAC,EAC1B7B,EAAqBA,EAAoB4B,GACxCvB,SAAAA,EAA4B,UAAPuB,EAAK,UAAE,IAAAC,EAAAA,EAAI,KACvC,GACA,CAAC7B,EAAqBK,IAGlByB,EAASC,EAAAA,oBAAoB,CACjCT,MAAAA,EACAU,SAAUN,EACVO,QAAS1B,EACT2B,aAAc1B,EACd2B,SAAUd,EAAUnB,EAAiB,IAIjCkC,GAAUvC,IAAciC,EAAOO,YAE/BC,GAAS,WACRF,KAAW1B,GAEhBd,KAGwC2C,GAAAA,EAAQA,UAAC,GAAMC,GAAAC,EAAAA,QAAAC,GAAA,GAAlDC,GAAaH,GAAA,GAAEI,GAAgBJ,GAAA,GAChCK,GAAetB,EAAAA,SAAQ,WAAA,OAAMD,EAAMwB,KAAI,SAAAvE,GAAI,OAAIA,EAAKwE,UAAO,CAACzB,IAO5D0B,GAAWC,SAAmC,MAGpDC,EAAAA,WAAU,WACR,IAAMC,EAAQH,GAASI,QAClBzC,GAAcwC,GAEnBA,EAAME,kBAAkBF,EAAM7B,MAAMgC,OAAQH,EAAM7B,MAAMgC,OAC1D,GAAG,CAAC3C,IA4BJ,OACEhC,EAAAA,KAAA4E,EAAAA,SAAA,CAAAxE,SAAA,CACEC,MAACwE,eAAY,CACXlC,MAAO5B,EACPG,UAAWuC,GACX1B,SAAUA,EACVd,SAAUA,EACVqB,SACEC,EAAiBA,EAAe,CAAEkB,QAASA,KAAY1B,EAAU4B,OAAAA,KAAYrB,EAE/EE,SAAUA,EACVvC,UAAWA,EACXwC,OAAQA,EACR+B,MACEnE,MAACyE,QAAK,CACJC,eAAgBC,EAChBC,WAAY,CAEV5B,SAAUrC,EACVG,YAAAA,EACA+D,iBAAiB,EACjBC,sBAAuBC,SAASC,cAAc,QAC9CC,gBAAgB,EAChBC,aAAc,CAAEzF,iBAAAA,GAChB0F,gBAAgB,EAChBC,MAAOnG,GAETqD,MAAO5B,EACPmB,YAAaA,EACbwD,SAAUrB,GACVpE,UAAWC,EAAOyF,aAClBC,UAxCa,SAACC,GACJ,UAAdA,EAAMC,KAAmBD,EAAME,UAC9BtC,KAAW1B,IACZiE,EAAAA,4BAEJH,EAAMI,iBACNtC,QAmCQuC,kBAAgB,EAChBC,KAAM,EACNC,WAAS,EACTC,WAAS,EACTrE,UAAWA,IAGfZ,YAAa+B,EAAOmD,MACpBC,mBAAoBpD,EAAOqD,iBAC3BC,kBAAmBtD,EAAOuD,YAC1BC,oBAAqBjE,EAAUS,EAAOyD,wBAAqBC,EAC3DC,YAAa3D,EAAO4D,SACpBC,iBAAkB7D,EAAO8D,eACzBC,UAA+B,IAApB/D,EAAOK,SAAiB,mBAAqB,kBACxD2D,eACExF,EAAkBtB,EAAAQ,IAACuG,EAAmB,CAACC,aAAc1F,SAAsBkF,EAE7ES,QACEtH,EAAAuH,KAAA3C,WAAA,CAAAxE,SAAA,CACEC,MAACmH,mBAAgB,CACf9B,SAAUvC,EAAOsE,aACjBC,QAASvE,EAAOwE,eAChBC,aAAczE,EAAO0E,iBACrBC,gBAAiBhG,EAAiB,WAAA,OAAMmC,IAAiB,EAAK,OAAG4C,EACjEkB,SAAUrF,EACVX,SAAUoB,EAAO6E,OACjBC,QACE9E,EAAO6E,uBACM7E,EAAOK,SAAQ,KAAA0E,OACF,IAApB/E,EAAOK,SAAiB,OAAS,6CAEzBd,EAAU,QAAU,UAGtCrC,MAAC8H,UAAO,CAACC,MAAM,kBAAiBhI,SAC9BC,MAACgI,aAAU,CAAC9H,KAAK,KAAK+H,KAAK,WAAWZ,QA5F3B,WAAM,IAAAa,EACrB/D,EAAQH,GAASI,QACvB,GAAKD,EAAL,CAEAA,EAAMgE,QAEN,IAAMC,IAAejE,EAAM7B,QAAU,MAAM+F,KAAKlE,EAAM7B,OAChDgG,EAAenE,GAAAA,OAAAA,EAAM7B,OAAQ8F,OAAAA,EAAa,KAAO,KACjDG,EAAiF,QAAtEC,EAAAA,OAAOC,yBAAyBD,OAAOE,eAAevE,GAAQ,gBAAQ,IAAA+D,OAAA,EAAtEA,EAAwES,IAEzFJ,SAAAA,EAAUK,KAAKzE,EAAOmE,GACtBnE,EAAME,kBAAkBiE,EAAUhE,OAAQgE,EAAUhE,QACpDH,EAAM0E,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,KAClD5E,EAAM0E,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,IAXtC,GA0F4DhJ,SAC5DC,MAACgJ,UAAkB,CAAC9J,SAAS,gBAGjCc,EAAAQ,IAAA,OAAA,CAAMZ,UAAWC,EAAOoJ,SAASlJ,SAC/BC,MAACkJ,EAAe,CACdC,KAAMnJ,MAACoJ,kBAAe,CAAClJ,KAAM,KAC7BmJ,kBAAmB,SAACC,GAAyB,OAC3C3I,EAAgBD,GAAAA,OAAAA,UAAO4I,EAAMC,QAAS,SAMhDC,UACK1H,UAAAA,EAAUwC,WAAYtC,IACvBrC,EAAAA,KAAA4E,EAAAA,SAAA,CAAAxE,SAAA,CACEC,MAACyJ,kBAAe,CAAC3D,KAAMhE,QAAAA,EAAY,GAAI4H,WAAY3H,IAClDC,GAAehC,MAAC2J,EAAAA,eAAcC,EAAA,CAAA,EAAK5H,SAM3CP,GACCzB,EAACQ,IAAAqJ,2BACKpI,GAAc,GAAA,CAClBqI,KAAMnG,GACNoG,cAAejH,EAAOK,SAAWL,EAAOkH,MACxCC,kBAAmBpG,GACnBqG,MA1IgB,SAACC,GACvBvG,IAAiB,GACjBd,EAAOsH,eAAeD,EAAMrG,KAAI,SAAAuG,GAAI,MAAK,CAAEC,SAAUD,EAAKC,SAAW,MAyI/DC,QAAS,WAAA,OAAM3G,IAAiB,EAAM,OAKhD"}

package/cjs-bundle/componentsV2/TextMiddleTruncated/TextMiddleTruncated.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/defineProperty"),t=require("@babel/runtime/helpers/slicedToArray"),r=require("classnames"),n=require("react"),i=require("lodash"),c=require("../Tooltip/Tooltip.js"),s=require("./TextMiddleTruncated.constants.js"),u=require("./TextMiddleTruncated.scss.js"),a=require("../../utils/formatting.js"),l=require("react/jsx-runtime");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=o(e),f=o(t),v=o(r);function b(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}var h=function(e){var t=e.children,r=void 0===t?"":t,o=e.testId,b=e.className,h=e.disableTooltip,p=e.maxLines,j=void 0===p?1:p,T=String(r),m=n.useRef(null),x=n.useRef(null),O=n.useRef(null),y=n.useState(T),g=f.default(y,2),q=g[0],M=g[1],P=n.useState(),w=f.default(P,2),I=w[0],D=w[1],N=j>1;n.useLayoutEffect((function(){var e=function(){if(m.current&&x.current){var e=m.current.clientWidth,t=x.current,r=t.scrollWidth,n=t.textContent,i=null!=n?n:"";if(e&&r&&i.length)if(N){var c=r/i.length,s=Math.max(1,Math.floor(e/c));if(i.length<=s*j)return D(void 0),void M(i);for(var u=j-1,l=u-1,o=s*(u-1)+(s-2),d=s,f=i.slice(0,o),v=i.slice(i.length-d),b=[],h=0;h<u;h+=1){var p=h*s,T=h===l,y=T?s-3:s,g=f.slice(p,p+y);g&&b.push(T?"".concat(g," ..."):g)}b.push(v),D(b),M(b.join("\n"))}else{var q;if(e===(null===(q=O.current)||void 0===q?void 0:q.clientWidth))return;D(void 0),M(a.truncateInTheMiddle(i,e,r))}}};e();var t=i.debounce((function(){return requestAnimationFrame(e)}),200,{leading:!0}),r=new ResizeObserver(t),n=new MutationObserver(t);return m.current&&x.current&&(r.observe(m.current),r.observe(x.current),n.observe(x.current,{subtree:!0,characterData:!0})),function(){r.disconnect(),n.disconnect(),t.cancel()}}),[N,j,T]);var S=!!I||q!==T;return l.jsx(c.Tooltip,{title:T,disabled:h||!S,children:l.jsxs("div",{className:v.default(u.root,b,d.default({},u.multiLine,N)),ref:m,"data-testid":o,children:[l.jsx("div",{className:u.inner,ref:O,"data-testid":s.TextMiddleTruncatedTestIds.TruncatedTextTestId,children:I?l.jsx(l.Fragment,{children:I.map((function(e,t){return l.jsx("div",{className:u.line,children:e},t)}))}):q}),l.jsx("div",{className:u.hiddenElement,ref:x,"data-testid":s.TextMiddleTruncatedTestIds.FullTextTestId,children:T})]})})};exports.TextMiddleTruncated=function(e){return l.jsx(h,function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?b(Object(r),!0).forEach((function(t){d.default(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):b(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({},e),"".concat(e.children,"-").concat(e.maxLines))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/defineProperty"),t=require("@babel/runtime/helpers/slicedToArray"),r=require("classnames"),n=require("react"),i=require("lodash"),a=require("../Tooltip/Tooltip.js"),l=require("./TextMiddleTruncated.constants.js"),u=require("./TextMiddleTruncated.scss.js"),s=require("../../utils/formatting.js"),c=require("react/jsx-runtime");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=d(e),f=d(t),p=d(r);function m(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}var h=function(e){var t,r=e.children,d=void 0===r?"":r,m=e.testId,h=e.className,b=e.disableTooltip,v=e.maxLines,j=void 0===v?1:v,x=String(d),g=n.useRef(null),T=n.useRef(null),O=n.useRef(null),y=n.useState(x),F=f.default(y,2),q=F[0],w=F[1],M=n.useState(),P=f.default(M,2),S=P[0],L=P[1],E=j>1;n.useLayoutEffect((function(){var e=null,t=function(){if(g.current&&T.current){var e=g.current.clientWidth,t=T.current,r=t.scrollWidth,n=t.textContent,i=null!=n?n:"";if(i.length)if(E){if(!e||!r)return;var a=r/i.length,l=Math.max(1,Math.floor(e/a));if(i.length<=l*j)return L(void 0),void w(i);for(var u=j-1,c=u-1,d=l*(u-1)+(l-2),o=l,f=i.slice(0,d),p=i.slice(i.length-o),m=[],h=0;h<u;h+=1){var b=h*l,v=h===c,x=v?l-3:l,y=f.slice(b,b+x);y&&m.push(v?"".concat(y," ..."):y)}m.push(p),L(m),w(m.join("\n"))}else{var F=O.current;if(!F)return;var q=getComputedStyle(g.current),M=parseFloat(q.paddingLeft)+parseFloat(q.paddingRight),P=parseFloat(q.borderLeftWidth)+parseFloat(q.borderRightWidth),S=parseFloat(q.width)-("border-box"===q.boxSizing?M+P:0),N=parseFloat(getComputedStyle(T.current).width);if(!Number.isFinite(S)||!N)return;L(void 0),w(s.truncateInTheMiddle(i,S,N,(function(e){return F.textContent=e,parseFloat(getComputedStyle(F).width)})))}}};t();var r=i.debounce((function(){null!==e&&cancelAnimationFrame(e),e=requestAnimationFrame(t)}),200,{leading:!0}),n=new ResizeObserver(r),a=new MutationObserver(r);return g.current&&T.current&&(n.observe(g.current),n.observe(T.current),a.observe(T.current,{subtree:!0,characterData:!0})),function(){n.disconnect(),a.disconnect(),r.cancel(),null!==e&&cancelAnimationFrame(e)}}),[E,j,x]);var N=!!S||q!==x;return c.jsx(a.Tooltip,{title:x,disabled:b||!N,children:c.jsxs("div",{className:p.default(u.root,h,(t={},o.default(t,u.multiLine,E),o.default(t,u.singleLine,!E),t)),ref:g,"data-testid":m,children:[c.jsx("div",{className:u.inner,"data-testid":l.TextMiddleTruncatedTestIds.TruncatedTextTestId,children:S?c.jsx(c.Fragment,{children:S.map((function(e,t){return c.jsx("div",{className:u.line,children:e},t)}))}):q}),c.jsx("div",{className:p.default(u.hiddenElement,E?u.measurementElement:u.fullTextSingleLine),ref:T,"data-testid":l.TextMiddleTruncatedTestIds.FullTextTestId,children:x}),!E&&c.jsx("div",{className:p.default(u.hiddenElement,u.measurementElement),ref:O,"aria-hidden":"true"})]})})};exports.TextMiddleTruncated=function(e){return c.jsx(h,function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?m(Object(r),!0).forEach((function(t){o.default(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):m(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}({},e),"".concat(e.children,"-").concat(e.maxLines))};
 //# sourceMappingURL=TextMiddleTruncated.js.map

package/cjs-bundle/componentsV2/TextMiddleTruncated/TextMiddleTruncated.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextMiddleTruncated.js","sources":["../../../../src/componentsV2/TextMiddleTruncated/TextMiddleTruncated.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useLayoutEffect, useRef, useState } from 'react';\nimport { debounce } from 'lodash';\n\nimport { Tooltip } from '../Tooltip';\n\nimport { TextMiddleTruncatedTestIds } from './TextMiddleTruncated.constants';\n\nimport styles from './TextMiddleTruncated.scss';\n\nimport { truncateInTheMiddle } from '~/utils/formatting';\n\nexport type TextMiddleTruncatedProps = {\n  /**\n   * Content\n   */\n  children?: string | number;\n  disableTooltip?: boolean;\n  /**\n   * Maximum number of lines to display.\n   * When maxLines > 1, the second-to-last line ends with \"...\" and the last line shows the end of text.\n   *\n   * e.g. with maxLines=4:\n   *\n   * line1\n   *\n   * line2\n   *\n   * line3...\n   *\n   * line4\n   */\n  maxLines?: number;\n\n  className?: string;\n  testId?: string;\n};\n\nconst TextMiddleTruncatedBase = ({\n  children = '',\n  testId,\n  className,\n  disableTooltip,\n  maxLines = 1,\n}: TextMiddleTruncatedProps) => {\n  const stringContent = String(children);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const hiddenEltRef = useRef<HTMLDivElement>(null);\n  const innerRef = useRef<HTMLDivElement>(null);\n  const [truncatedContent, setTruncatedContent] = useState(stringContent);\n  const [multiLineContent, setMultiLineContent] = useState<string[]>();\n\n  const isMultiLine = maxLines > 1;\n\n  useLayoutEffect(() => {\n    const runTruncation = () => {\n      if (!containerRef.current || !hiddenEltRef.current) return;\n\n      const { clientWidth } = containerRef.current;\n      const { scrollWidth: textWidth, textContent } = hiddenEltRef.current;\n      const text = textContent ?? '';\n\n      if (!clientWidth || !textWidth || !text.length) return;\n\n      if (isMultiLine) {\n        // Multi-line mode: \"...\" always on second-to-last line\n        // e.g., maxLines=4: line1, line2, line3..., line4\n        const charWidth = textWidth / text.length;\n        // Guard against very small clientWidth to prevent infinite loop or empty lines\n        const charsPerLine = Math.max(1, Math.floor(clientWidth / charWidth));\n\n        // Check if text fits in maxLines without truncation\n        if (text.length <= charsPerLine * maxLines) {\n          setMultiLineContent(undefined);\n          setTruncatedContent(text);\n          return;\n        }\n\n        // Lines 1 to (N-2): full width\n        // Line (N-1): ends with \" ...\" (second-to-last)\n        // Line N: shows end of text (last line)\n        const firstLinesCount = maxLines - 1; // lines before the last\n        const ellipsisLineIndex = firstLinesCount - 1; // second-to-last line (0-indexed)\n\n        // Characters for first part (all lines except last, with ellipsis on second-to-last)\n        const firstPartChars = charsPerLine * (firstLinesCount - 1) + (charsPerLine - 2);\n        // Characters for last line\n        const lastLineChars = charsPerLine;\n\n        const firstPart = text.slice(0, firstPartChars);\n        const lastLine = text.slice(text.length - lastLineChars);\n\n        // Split first part into lines\n        const lines: string[] = [];\n        for (let i = 0; i < firstLinesCount; i += 1) {\n          const start = i * charsPerLine;\n          const isEllipsisLine = i === ellipsisLineIndex;\n          const lineWidth = isEllipsisLine ? charsPerLine - 3 : charsPerLine;\n          const lineText = firstPart.slice(start, start + lineWidth);\n          if (lineText) {\n            lines.push(isEllipsisLine ? `${lineText} ...` : lineText);\n          }\n        }\n        lines.push(lastLine);\n\n        setMultiLineContent(lines);\n        setTruncatedContent(lines.join('\\n'));\n      } else {\n        // Single line mode: use original truncation\n        if (clientWidth === innerRef.current?.clientWidth) return;\n\n        setMultiLineContent(undefined);\n        setTruncatedContent(truncateInTheMiddle(text, clientWidth, textWidth));\n      }\n    };\n\n    runTruncation();\n\n    const debouncedTruncation = debounce(() => requestAnimationFrame(runTruncation), 200, {\n      leading: true,\n    });\n\n    const resizeObserver = new ResizeObserver(debouncedTruncation);\n    const mutationObserver = new MutationObserver(debouncedTruncation);\n\n    if (containerRef.current && hiddenEltRef.current) {\n      resizeObserver.observe(containerRef.current);\n      resizeObserver.observe(hiddenEltRef.current);\n      mutationObserver.observe(hiddenEltRef.current, { subtree: true, characterData: true });\n    }\n\n    return () => {\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n      debouncedTruncation.cancel();\n    };\n  }, [isMultiLine, maxLines, stringContent]);\n\n  const isTruncated = !!multiLineContent || truncatedContent !== stringContent;\n\n  return (\n    <Tooltip title={stringContent} disabled={disableTooltip || !isTruncated}>\n      <div\n        className={classNames(styles.root, className, { [styles.multiLine]: isMultiLine })}\n        ref={containerRef}\n        data-testid={testId}\n      >\n        <div\n          className={styles.inner}\n          ref={innerRef}\n          data-testid={TextMiddleTruncatedTestIds.TruncatedTextTestId}\n        >\n          {multiLineContent ? (\n            <>\n              {multiLineContent.map((line, index) => (\n                <div key={index} className={styles.line}>\n                  {line}\n                </div>\n              ))}\n            </>\n          ) : (\n            truncatedContent\n          )}\n        </div>\n        <div\n          className={styles.hiddenElement}\n          ref={hiddenEltRef}\n          data-testid={TextMiddleTruncatedTestIds.FullTextTestId}\n        >\n          {stringContent}\n        </div>\n      </div>\n    </Tooltip>\n  );\n};\n\nexport const TextMiddleTruncated = (props: TextMiddleTruncatedProps) => (\n  <TextMiddleTruncatedBase key={`${props.children}-${props.maxLines}`} {...props} />\n);\n"],"names":["TextMiddleTruncatedBase","_ref","_ref$children","children","testId","className","disableTooltip","_ref$maxLines","maxLines","stringContent","String","containerRef","useRef","hiddenEltRef","innerRef","useState","_useState2","_slicedToArray","_useState","truncatedContent","setTruncatedContent","_useState3","_useState4","multiLineContent","setMultiLineContent","isMultiLine","useLayoutEffect","runTruncation","current","clientWidth","textWidth","scrollWidth","textContent","text","length","charWidth","charsPerLine","Math","max","floor","undefined","firstLinesCount","ellipsisLineIndex","firstPartChars","lastLineChars","firstPart","slice","lastLine","lines","i","start","isEllipsisLine","lineWidth","lineText","push","join","_innerRef$current","truncateInTheMiddle","debouncedTruncation","debounce","requestAnimationFrame","leading","resizeObserver","ResizeObserver","mutationObserver","MutationObserver","observe","subtree","characterData","disconnect","cancel","isTruncated","_jsx","Tooltip","title","disabled","_jsxs","jsxs","classNames","styles","root","_defineProperty","multiLine","ref","jsx","inner","TextMiddleTruncatedTestIds","TruncatedTextTestId","_Fragment","map","line","index","hiddenElement","FullTextTestId","props"],"mappings":"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"}
+{"version":3,"file":"TextMiddleTruncated.js","sources":["../../../../src/componentsV2/TextMiddleTruncated/TextMiddleTruncated.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useLayoutEffect, useRef, useState } from 'react';\nimport { debounce } from 'lodash';\n\nimport { Tooltip } from '../Tooltip';\n\nimport { TextMiddleTruncatedTestIds } from './TextMiddleTruncated.constants';\n\nimport styles from './TextMiddleTruncated.scss';\n\nimport { truncateInTheMiddle } from '~/utils/formatting';\n\nexport type TextMiddleTruncatedProps = {\n  /**\n   * Content\n   */\n  children?: string | number;\n  disableTooltip?: boolean;\n  /**\n   * Maximum number of lines to display.\n   * When maxLines > 1, the second-to-last line ends with \"...\" and the last line shows the end of text.\n   *\n   * e.g. with maxLines=4:\n   *\n   * line1\n   *\n   * line2\n   *\n   * line3...\n   *\n   * line4\n   */\n  maxLines?: number;\n\n  className?: string;\n  testId?: string;\n};\n\nconst TextMiddleTruncatedBase = ({\n  children = '',\n  testId,\n  className,\n  disableTooltip,\n  maxLines = 1,\n}: TextMiddleTruncatedProps) => {\n  const stringContent = String(children);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const hiddenEltRef = useRef<HTMLDivElement>(null);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const [truncatedContent, setTruncatedContent] = useState(stringContent);\n  const [multiLineContent, setMultiLineContent] = useState<string[]>();\n\n  const isMultiLine = maxLines > 1;\n\n  useLayoutEffect(() => {\n    let animationFrameId: number | null = null;\n\n    const runTruncation = () => {\n      if (!containerRef.current || !hiddenEltRef.current) return;\n\n      const { clientWidth } = containerRef.current;\n      const { scrollWidth: textWidth, textContent } = hiddenEltRef.current;\n      const text = textContent ?? '';\n\n      if (!text.length) return;\n\n      if (isMultiLine) {\n        if (!clientWidth || !textWidth) return;\n\n        // Multi-line mode: \"...\" always on second-to-last line\n        // e.g., maxLines=4: line1, line2, line3..., line4\n        const charWidth = textWidth / text.length;\n        // Guard against very small clientWidth to prevent infinite loop or empty lines\n        const charsPerLine = Math.max(1, Math.floor(clientWidth / charWidth));\n\n        // Check if text fits in maxLines without truncation\n        if (text.length <= charsPerLine * maxLines) {\n          setMultiLineContent(undefined);\n          setTruncatedContent(text);\n          return;\n        }\n\n        // Lines 1 to (N-2): full width\n        // Line (N-1): ends with \" ...\" (second-to-last)\n        // Line N: shows end of text (last line)\n        const firstLinesCount = maxLines - 1; // lines before the last\n        const ellipsisLineIndex = firstLinesCount - 1; // second-to-last line (0-indexed)\n\n        // Characters for first part (all lines except last, with ellipsis on second-to-last)\n        const firstPartChars = charsPerLine * (firstLinesCount - 1) + (charsPerLine - 2);\n        // Characters for last line\n        const lastLineChars = charsPerLine;\n\n        const firstPart = text.slice(0, firstPartChars);\n        const lastLine = text.slice(text.length - lastLineChars);\n\n        // Split first part into lines\n        const lines: string[] = [];\n        for (let i = 0; i < firstLinesCount; i += 1) {\n          const start = i * charsPerLine;\n          const isEllipsisLine = i === ellipsisLineIndex;\n          const lineWidth = isEllipsisLine ? charsPerLine - 3 : charsPerLine;\n          const lineText = firstPart.slice(start, start + lineWidth);\n          if (lineText) {\n            lines.push(isEllipsisLine ? `${lineText} ...` : lineText);\n          }\n        }\n        lines.push(lastLine);\n\n        setMultiLineContent(lines);\n        setTruncatedContent(lines.join('\\n'));\n      } else {\n        const measurementElement = measurementRef.current;\n\n        if (!measurementElement) return;\n\n        // Resolved CSS widths retain fractions and use layout pixels even under transforms.\n        const containerStyle = getComputedStyle(containerRef.current);\n        const horizontalPadding =\n          parseFloat(containerStyle.paddingLeft) + parseFloat(containerStyle.paddingRight);\n        const horizontalBorder =\n          parseFloat(containerStyle.borderLeftWidth) + parseFloat(containerStyle.borderRightWidth);\n        const availableWidth =\n          parseFloat(containerStyle.width) -\n          (containerStyle.boxSizing === 'border-box' ? horizontalPadding + horizontalBorder : 0);\n        const fullTextWidth = parseFloat(getComputedStyle(hiddenEltRef.current).width);\n        if (!Number.isFinite(availableWidth) || !fullTextWidth) return;\n\n        const measureWidth = (candidate: string) => {\n          measurementElement.textContent = candidate;\n          return parseFloat(getComputedStyle(measurementElement).width);\n        };\n\n        setMultiLineContent(undefined);\n        setTruncatedContent(truncateInTheMiddle(text, availableWidth, fullTextWidth, measureWidth));\n      }\n    };\n\n    runTruncation();\n\n    const debouncedTruncation = debounce(\n      () => {\n        if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);\n\n        animationFrameId = requestAnimationFrame(runTruncation);\n      },\n      200,\n      { leading: true }\n    );\n\n    const resizeObserver = new ResizeObserver(debouncedTruncation);\n    const mutationObserver = new MutationObserver(debouncedTruncation);\n\n    if (containerRef.current && hiddenEltRef.current) {\n      resizeObserver.observe(containerRef.current);\n      resizeObserver.observe(hiddenEltRef.current);\n      mutationObserver.observe(hiddenEltRef.current, { subtree: true, characterData: true });\n    }\n\n    return () => {\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n      debouncedTruncation.cancel();\n      if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);\n    };\n  }, [isMultiLine, maxLines, stringContent]);\n\n  const isTruncated = !!multiLineContent || truncatedContent !== stringContent;\n\n  return (\n    <Tooltip title={stringContent} disabled={disableTooltip || !isTruncated}>\n      <div\n        className={classNames(styles.root, className, {\n          [styles.multiLine]: isMultiLine,\n          [styles.singleLine]: !isMultiLine,\n        })}\n        ref={containerRef}\n        data-testid={testId}\n      >\n        <div className={styles.inner} data-testid={TextMiddleTruncatedTestIds.TruncatedTextTestId}>\n          {multiLineContent ? (\n            <>\n              {multiLineContent.map((line, index) => (\n                <div key={index} className={styles.line}>\n                  {line}\n                </div>\n              ))}\n            </>\n          ) : (\n            truncatedContent\n          )}\n        </div>\n        <div\n          className={classNames(\n            styles.hiddenElement,\n            isMultiLine ? styles.measurementElement : styles.fullTextSingleLine\n          )}\n          ref={hiddenEltRef}\n          data-testid={TextMiddleTruncatedTestIds.FullTextTestId}\n        >\n          {stringContent}\n        </div>\n        {!isMultiLine && (\n          <div\n            className={classNames(styles.hiddenElement, styles.measurementElement)}\n            ref={measurementRef}\n            aria-hidden=\"true\"\n          />\n        )}\n      </div>\n    </Tooltip>\n  );\n};\n\nexport const TextMiddleTruncated = (props: TextMiddleTruncatedProps) => (\n  <TextMiddleTruncatedBase key={`${props.children}-${props.maxLines}`} {...props} />\n);\n"],"names":["TextMiddleTruncatedBase","_ref","_classNames","_ref$children","children","testId","className","disableTooltip","_ref$maxLines","maxLines","stringContent","String","containerRef","useRef","hiddenEltRef","measurementRef","useState","_useState2","_slicedToArray","_useState","truncatedContent","setTruncatedContent","_useState3","_useState4","multiLineContent","setMultiLineContent","isMultiLine","useLayoutEffect","animationFrameId","runTruncation","current","clientWidth","textWidth","scrollWidth","textContent","text","length","charWidth","charsPerLine","Math","max","floor","undefined","firstLinesCount","ellipsisLineIndex","firstPartChars","lastLineChars","firstPart","slice","lastLine","lines","i","start","isEllipsisLine","lineWidth","lineText","push","join","measurementElement","containerStyle","getComputedStyle","horizontalPadding","parseFloat","paddingLeft","paddingRight","horizontalBorder","borderLeftWidth","borderRightWidth","availableWidth","width","boxSizing","fullTextWidth","Number","isFinite","truncateInTheMiddle","candidate","debouncedTruncation","debounce","cancelAnimationFrame","requestAnimationFrame","leading","resizeObserver","ResizeObserver","mutationObserver","MutationObserver","observe","subtree","characterData","disconnect","cancel","isTruncated","_jsx","Tooltip","title","disabled","_jsxs","jsxs","classNames","styles","root","multiLine","singleLine","ref","jsx","inner","TextMiddleTruncatedTestIds","TruncatedTextTestId","_Fragment","map","line","index","hiddenElement","fullTextSingleLine","FullTextTestId","props"],"mappings":"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"}

package/cjs-bundle/componentsV2/TextMiddleTruncated/TextMiddleTruncated.scss.js

@@ -1,2 +1,2 @@
-"use strict";require('./../../ext-esm/style-inject/dist/style-inject.es.js')(".TextMiddleTruncated_root__sMHwy{overflow:hidden;white-space:nowrap}.TextMiddleTruncated_multiLine__ECbYi{white-space:normal}.TextMiddleTruncated_multiLine__ECbYi .TextMiddleTruncated_inner__sWwZy{display:block}.TextMiddleTruncated_inner__sWwZy{display:inline-block;vertical-align:top}.TextMiddleTruncated_line__OF0LA{overflow:hidden;text-overflow:clip;white-space:nowrap}.TextMiddleTruncated_hiddenElement__JW0Og{left:-9999px;pointer-events:none;position:absolute;top:-9999px;visibility:hidden;white-space:nowrap}"),module.exports={root:"TextMiddleTruncated_root__sMHwy",multiLine:"TextMiddleTruncated_multiLine__ECbYi",inner:"TextMiddleTruncated_inner__sWwZy",line:"TextMiddleTruncated_line__OF0LA",hiddenElement:"TextMiddleTruncated_hiddenElement__JW0Og"};
+"use strict";require('./../../ext-esm/style-inject/dist/style-inject.es.js')(".TextMiddleTruncated_root__sMHwy{overflow:hidden;white-space:nowrap}.TextMiddleTruncated_singleLine__yZJHl{display:grid;grid-template-columns:minmax(0,1fr)}.TextMiddleTruncated_singleLine__yZJHl .TextMiddleTruncated_inner__sWwZy{grid-area:1/1}.TextMiddleTruncated_multiLine__ECbYi{white-space:normal}.TextMiddleTruncated_multiLine__ECbYi .TextMiddleTruncated_inner__sWwZy{display:block}.TextMiddleTruncated_inner__sWwZy{display:inline-block;vertical-align:top}.TextMiddleTruncated_line__OF0LA{overflow:hidden;text-overflow:clip;white-space:nowrap}.TextMiddleTruncated_hiddenElement__JW0Og{pointer-events:none;visibility:hidden;white-space:nowrap;width:max-content}.TextMiddleTruncated_measurementElement__8KbXa{left:-9999px;position:absolute;top:-9999px}.TextMiddleTruncated_fullTextSingleLine__4B2PI{grid-area:1/1}"),module.exports={root:"TextMiddleTruncated_root__sMHwy",singleLine:"TextMiddleTruncated_singleLine__yZJHl",inner:"TextMiddleTruncated_inner__sWwZy",multiLine:"TextMiddleTruncated_multiLine__ECbYi",line:"TextMiddleTruncated_line__OF0LA",hiddenElement:"TextMiddleTruncated_hiddenElement__JW0Og",measurementElement:"TextMiddleTruncated_measurementElement__8KbXa",fullTextSingleLine:"TextMiddleTruncated_fullTextSingleLine__4B2PI"};
 //# sourceMappingURL=TextMiddleTruncated.scss.js.map

package/cjs-bundle/utils/formatting.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.formatAssetName=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",e=arguments.length>1?arguments[1]:void 0,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:420,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:6,i=t.split(" ");if(e>n||t.length<r||i.length<=1)return t;var o=t[0],c=i[i.length-1];return"".concat(o," ").concat(c)},exports.orDash=function(t){return Number.isFinite(t)||"string"==typeof t?t:"-"},exports.truncateInTheMiddle=function(t,e,n){if(e>=n)return t;var r=e/(n/t.length),i=Math.ceil(r/2),o=Math.max(i-3,2);return"".concat(t.slice(0,o)," ... ").concat(t.slice(t.length-o))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.formatAssetName=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"",t=arguments.length>1?arguments[1]:void 0,n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:420,r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:6,l=e.split(" ");if(t>n||e.length<r||l.length<=1)return e;var o=e[0],c=l[l.length-1];return"".concat(o," ").concat(c)},exports.orDash=function(e){return Number.isFinite(e)||"string"==typeof e?e:"-"},exports.truncateInTheMiddle=function(e,t,n){var r=arguments.length>3&&void 0!==arguments[3]?arguments[3]:null;if(t>=n)return e;var l=n/e.length,o=t/l,c=Math.ceil(o/2),i=Math.max(c-3,2);if(!r)return"".concat(e.slice(0,i)," ... ").concat(e.slice(e.length-i));var a=function(t){var n=e.slice(0,t).replace(/[\uD800-\uDBFF]$/,""),r=e.slice(e.length-t).replace(/^[\uDC00-\uDFFF]/,"");return"".concat(n," ... ").concat(r)},u=a(i);if(r(u)<=t)return u;for(var s=1,h=i-1,v=null;s<=h;){var f=Math.floor((s+h)/2),g=a(f);r(g)<=t?(v=g,s=f+1):h=f-1}return v||(r("...")<=t?"...":"")};
 //# sourceMappingURL=formatting.js.map

package/cjs-bundle/utils/formatting.js.map

@@ -1 +1 @@
-{"version":3,"file":"formatting.js","sources":["../../../src/utils/formatting.js"],"sourcesContent":["export const orDash = value => {\n  return Number.isFinite(value) || typeof value === 'string' ? value : '-';\n};\n\nconst MOBILE_BREAK_POINT_WIDTH = 420;\nconst MAX_ASSET_NAME_LENGTH = 6;\n\nexport const formatAssetName = (\n  assetName = '',\n  containerPixelWidth,\n  mobileBreakPointWidth = MOBILE_BREAK_POINT_WIDTH,\n  maxAssetNameLength = MAX_ASSET_NAME_LENGTH\n) => {\n  const words = assetName.split(' ');\n  if (\n    containerPixelWidth > mobileBreakPointWidth ||\n    assetName.length < maxAssetNameLength ||\n    words.length <= 1\n  ) {\n    return assetName;\n  }\n\n  const initialChar = assetName[0];\n  const lastWord = words[words.length - 1];\n  return `${initialChar} ${lastWord}`;\n};\n\nexport const truncateInTheMiddle = (text, clientWidth, scrollWidth) => {\n  if (clientWidth >= scrollWidth) return text;\n\n  const charWidthInPx = scrollWidth / text.length;\n  const visibleCharsLength = clientWidth / charWidthInPx;\n  const trimmedTextLength = Math.ceil(visibleCharsLength / 2);\n  const charNum = Math.max(trimmedTextLength - 3, 2);\n\n  return `${text.slice(0, charNum)} ... ${text.slice(text.length - charNum)}`;\n};\n"],"names":["assetName","containerPixelWidth","arguments","length","undefined","mobileBreakPointWidth","maxAssetNameLength","words","split","initialChar","lastWord","value","Number","isFinite","text","clientWidth","scrollWidth","visibleCharsLength","trimmedTextLength","Math","ceil","charNum","max","concat","slice"],"mappings":"4FAO+B,WAK1B,IAJHA,yDAAY,GACZC,EAAmBC,UAAAC,OAAA,EAAAD,UAAA,QAAAE,EACnBC,yDAN+B,IAO/BC,yDAN4B,EAQtBC,EAAQP,EAAUQ,MAAM,KAC9B,GACEP,EAAsBI,GACtBL,EAAUG,OAASG,GACnBC,EAAMJ,QAAU,EAEhB,OAAOH,EAGT,IAAMS,EAAcT,EAAU,GACxBU,EAAWH,EAAMA,EAAMJ,OAAS,GACtC,MAAUM,GAAAA,OAAAA,cAAeC,EAC3B,iBAzBsB,SAAAC,GACpB,OAAOC,OAAOC,SAASF,IAA2B,iBAAVA,EAAqBA,EAAQ,GACvE,8BAyBmC,SAACG,EAAMC,EAAaC,GACrD,GAAID,GAAeC,EAAa,OAAOF,EAEvC,IACMG,EAAqBF,GADLC,EAAcF,EAAKX,QAEnCe,EAAoBC,KAAKC,KAAKH,EAAqB,GACnDI,EAAUF,KAAKG,IAAIJ,EAAoB,EAAG,GAEhD,MAAA,GAAAK,OAAUT,EAAKU,MAAM,EAAGH,GAAQ,SAAAE,OAAQT,EAAKU,MAAMV,EAAKX,OAASkB,GACnE"}
+{"version":3,"file":"formatting.js","sources":["../../../src/utils/formatting.js"],"sourcesContent":["export const orDash = value => {\n  return Number.isFinite(value) || typeof value === 'string' ? value : '-';\n};\n\nconst MOBILE_BREAK_POINT_WIDTH = 420;\nconst MAX_ASSET_NAME_LENGTH = 6;\n\nexport const formatAssetName = (\n  assetName = '',\n  containerPixelWidth,\n  mobileBreakPointWidth = MOBILE_BREAK_POINT_WIDTH,\n  maxAssetNameLength = MAX_ASSET_NAME_LENGTH\n) => {\n  const words = assetName.split(' ');\n  if (\n    containerPixelWidth > mobileBreakPointWidth ||\n    assetName.length < maxAssetNameLength ||\n    words.length <= 1\n  ) {\n    return assetName;\n  }\n\n  const initialChar = assetName[0];\n  const lastWord = words[words.length - 1];\n  return `${initialChar} ${lastWord}`;\n};\n\n/**\n * Three-argument calls retain the original average-width estimate.\n * Supply measureWidth to verify candidates using the caller's actual text styles.\n * @param {((candidate: string) => number) | null} [measureWidth]\n */\nexport const truncateInTheMiddle = (text, clientWidth, scrollWidth, measureWidth = null) => {\n  if (clientWidth >= scrollWidth) return text;\n\n  const charWidthInPx = scrollWidth / text.length;\n  const visibleCharsLength = clientWidth / charWidthInPx;\n  const trimmedTextLength = Math.ceil(visibleCharsLength / 2);\n  const charNum = Math.max(trimmedTextLength - 3, 2);\n\n  if (!measureWidth) {\n    return `${text.slice(0, charNum)} ... ${text.slice(text.length - charNum)}`;\n  }\n\n  const buildCandidate = count => {\n    // UTF-16 slice boundaries must not split a surrogate pair in measured output.\n    const start = text.slice(0, count).replace(/[\\uD800-\\uDBFF]$/, '');\n    const end = text.slice(text.length - count).replace(/^[\\uDC00-\\uDFFF]/, '');\n\n    return `${start} ... ${end}`;\n  };\n\n  // Measure real candidates instead of summing a per-char width map: the browser applies\n  // kerning, ligatures, font fallback and letter-spacing, which a map cannot reproduce.\n  // Each measurement forces a reflow, so the estimate is tried first and the fallback\n  // is a binary search, bounded by log2(charNum) measurements for any text length.\n  const estimate = buildCandidate(charNum);\n\n  if (measureWidth(estimate) <= clientWidth) return estimate;\n\n  let low = 1;\n  let high = charNum - 1;\n  let bestFit = null;\n\n  while (low <= high) {\n    const middle = Math.floor((low + high) / 2);\n    const candidate = buildCandidate(middle);\n\n    if (measureWidth(candidate) <= clientWidth) {\n      bestFit = candidate;\n      low = middle + 1;\n    } else {\n      high = middle - 1;\n    }\n  }\n\n  if (bestFit) return bestFit;\n\n  return measureWidth('...') <= clientWidth ? '...' : '';\n};\n"],"names":["assetName","containerPixelWidth","arguments","length","undefined","mobileBreakPointWidth","maxAssetNameLength","words","split","initialChar","lastWord","value","Number","isFinite","text","clientWidth","scrollWidth","measureWidth","charWidthInPx","visibleCharsLength","trimmedTextLength","Math","ceil","charNum","max","concat","slice","buildCandidate","count","start","replace","end","estimate","low","high","bestFit","middle","floor","candidate"],"mappings":"4FAO+B,WAK1B,IAJHA,yDAAY,GACZC,EAAmBC,UAAAC,OAAA,EAAAD,UAAA,QAAAE,EACnBC,yDAN+B,IAO/BC,yDAN4B,EAQtBC,EAAQP,EAAUQ,MAAM,KAC9B,GACEP,EAAsBI,GACtBL,EAAUG,OAASG,GACnBC,EAAMJ,QAAU,EAEhB,OAAOH,EAGT,IAAMS,EAAcT,EAAU,GACxBU,EAAWH,EAAMA,EAAMJ,OAAS,GACtC,MAAUM,GAAAA,OAAAA,cAAeC,EAC3B,iBAzBsB,SAAAC,GACpB,OAAOC,OAAOC,SAASF,IAA2B,iBAAVA,EAAqBA,EAAQ,GACvE,8BA8BmC,SAACG,EAAMC,EAAaC,GAAqC,IAAxBC,yDAAe,KACjF,GAAIF,GAAeC,EAAa,OAAOF,EAEvC,IAAMI,EAAgBF,EAAcF,EAAKX,OACnCgB,EAAqBJ,EAAcG,EACnCE,EAAoBC,KAAKC,KAAKH,EAAqB,GACnDI,EAAUF,KAAKG,IAAIJ,EAAoB,EAAG,GAEhD,IAAKH,EACH,MAAA,GAAAQ,OAAUX,EAAKY,MAAM,EAAGH,GAAQ,SAAAE,OAAQX,EAAKY,MAAMZ,EAAKX,OAASoB,IAGnE,IAAMI,EAAiB,SAAAC,GAErB,IAAMC,EAAQf,EAAKY,MAAM,EAAGE,GAAOE,QAAQ,mBAAoB,IACzDC,EAAMjB,EAAKY,MAAMZ,EAAKX,OAASyB,GAAOE,QAAQ,mBAAoB,IAExE,MAAUD,GAAAA,OAAAA,kBAAaE,IAOnBC,EAAWL,EAAeJ,GAEhC,GAAIN,EAAae,IAAajB,EAAa,OAAOiB,EAMlD,IAJA,IAAIC,EAAM,EACNC,EAAOX,EAAU,EACjBY,EAAU,KAEPF,GAAOC,GAAM,CAClB,IAAME,EAASf,KAAKgB,OAAOJ,EAAMC,GAAQ,GACnCI,EAAYX,EAAeS,GAE7BnB,EAAaqB,IAAcvB,GAC7BoB,EAAUG,EACVL,EAAMG,EAAS,GAEfF,EAAOE,EAAS,CAEpB,CAEA,OAAID,IAEGlB,EAAa,QAAUF,EAAc,MAAQ,GACtD"}

package/components/CommentComposer/CommentComposer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentComposer.d.ts","sourceRoot":"","sources":["../../../src/components/CommentComposer/CommentComposer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,SAAS,EAKV,MAAM,OAAO,CAAC;AAef,OAAO,KAAK,EAAE,cAAc,EAAe,MAAM,sBAAsB,CAAC;AAExE,OAAO,EAEL,kBAAkB,EAEnB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAmB,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAKvE,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,CAAC;AAGF,MAAM,MAAM,4BAA4B,GAAG;IACzC,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,mBAAmB,CAAC;IAEjC,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACnC,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,kBAAkB,EAAE,KAAK,IAAI,CAAC;IAClE,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,sFAAsF;IACtF,UAAU,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACvC,6CAA6C;IAC7C,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,kBAAkB,GAAG,IAAI,KAAK,IAAI,CAAC;IACrE,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACrD,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,cAAc,CAAC,EAAE,cAAc,CAAC;IAEhC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,QAAQ,CAAC,CAAC;IAClD,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mFAAmF;IACnF,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,4BAA4B,KAAK,SAAS,CAAC;IACpE,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAyBF,eAAO,MAAM,eAAe,8VA0BzB,oBAAoB,4CA4KtB,CAAC"}
+{"version":3,"file":"CommentComposer.d.ts","sourceRoot":"","sources":["../../../src/components/CommentComposer/CommentComposer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,SAAS,EAMV,MAAM,OAAO,CAAC;AAef,OAAO,KAAK,EAAE,cAAc,EAAe,MAAM,sBAAsB,CAAC;AAExE,OAAO,EAEL,kBAAkB,EAEnB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAmB,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACpE,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAKvE,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,CAAC;AAGF,MAAM,MAAM,4BAA4B,GAAG;IACzC,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,mBAAmB,CAAC;IAEjC,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACnC,mBAAmB,CAAC,EAAE,CAAC,WAAW,EAAE,kBAAkB,EAAE,KAAK,IAAI,CAAC;IAClE,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,sFAAsF;IACtF,UAAU,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACvC,6CAA6C;IAC7C,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,kBAAkB,GAAG,IAAI,KAAK,IAAI,CAAC;IACrE,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACrD,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,cAAc,CAAC,EAAE,cAAc,CAAC;IAEhC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC;IAC5B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,QAAQ,CAAC,CAAC;IAClD,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mFAAmF;IACnF,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,4BAA4B,KAAK,SAAS,CAAC;IACpE,qEAAqE;IACrE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAyBF,eAAO,MAAM,eAAe,8VA0BzB,oBAAoB,4CAoLtB,CAAC"}

package/components/CommentComposer/CommentComposer.js

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/defineProperty";import s from"@babel/runtime/helpers/slicedToArray";import{useMemo as n,useCallback as t,useState as i,useRef as c}from"react";import{Input as e}from"@material-ui/core";import r from"@material-ui/icons/AlternateEmail";import{ButtonIcon as m}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as a}from"../../componentsV2/Tooltip/Tooltip.js";import{SmilingFaceIcon as l}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{AvatarComponent as p}from"../Avatar/index.js";import{AttachFileButton as u}from"../AttachFileButton/AttachFileButton.js";import{CommentInput as d}from"../CommentInputNext/CommentInputNext.js";import j from"../EmojiIconButton.js";import h from"../FailedFileUploading.js";import I from"../UserMention/index.js";import{isSuggestionsListOpened as b}from"../UserMention/utils/index.js";import{WellhubFilePicker as f}from"../WellhubFilePicker/WellhubFilePicker.js";import"@babel/runtime/helpers/toConsumableArray";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/regenerator";import"lodash/set";import"lodash/get";import"lodash/unset";import"moment";import"../../clients/jsonApi/index.js";import"../../clients/subscriptions/subscriptions-client.factory.js";import"../../clients/api/apiCore.js";import"../../clients/constants.js";import"../../clients/sso/auth0.js";import"../../clients/sso/oauth2.js";import"../../clients/api/rateLimiter.js";import"uuid";import{useAttachmentUpload as g,DEFAULT_MAX_ATTACHMENTS as C}from"./useAttachmentUpload.js";import{CommentMetaLine as v}from"./CommentMetaLine.js";import{ShareToChatRow as y}from"./ShareToChatRow.js";import F from"./CommentComposer.scss.js";import{jsxs as O,Fragment as A,jsx as S}from"react/jsx-runtime";function P(o,s){var n=Object.keys(o);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(o);s&&(t=t.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),n.push.apply(n,t)}return n}function x(s){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?P(Object(t),!0).forEach((function(n){o(s,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(t)):P(Object(t)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(t,o))}))}return s}var k={fontSize:14,lineHeight:"20px",suggestions:{backgroundColor:"var(--palette-background-b-9)",list:{backgroundColor:"var(--palette-background-b-9)"},item:{color:"var(--palette-primary-text-1)","&focused":{backgroundColor:"rgb(from var(--palette-primary-text-1) r g b / 0.08)"}}}},E=function(o){return O("div",{className:F.suggestion,children:[S(p,{size:26,alt:o.display,imgSrc:o.photo,displayName:o.display}),S("span",{children:o.display})]})},w=function(o){var p=o.body,P=o.onBodyChange,w=o.onSubmit,D=o.canSubmit,R=o.currentUser,M=o.attachments,U=o.onAttachmentsChange,N=o.maxAttachments,B=void 0===N?C:N,L=o.attachment,T=o.onAttachmentChange,z=o.attachmentError,W=o.onAttachmentError,G=o.maxAttachmentSizeBytes,q=o.wellhubContext,K=o.disabled,H=o.autoFocus,V=o.placeholder,Q=void 0===V?"Add a comment...":V,Z=o.metaRows,$=o.isMetaSingleLine,J=o.shareToChat,X=o.trailing,Y=o.renderTrailing,_=o.embedded,oo=o.className,so=o.testId,no=!!U,to=n((function(){return no?null!=M?M:[]:[L].filter(Boolean)}),[no,M,L]),io=t((function(o){var s;U?U(o):null==T||T(null!==(s=o[0])&&void 0!==s?s:null)}),[U,T]),co=g({value:to,onChange:io,onError:W,maxSizeBytes:G,maxFiles:no?B:1}),eo=D&&!co.isUploading,ro=function(){eo&&!K&&w()},mo=i(!1),ao=s(mo,2),lo=ao[0],po=ao[1],uo=n((function(){return to.map((function(o){return o.name}))}),[to]),jo=c(null);return O(A,{children:[S(d,{value:p,canSubmit:eo,disabled:K,onSubmit:w,trailing:Y?Y({canSend:eo&&!K,submit:ro}):X,embedded:_,className:oo,testId:so,field:S(e,{inputComponent:I,inputProps:{onChange:P,currentUser:R,allowEmptyQuery:!0,suggestionsPortalHost:document.querySelector("body"),withLightTheme:!1,mentionProps:{renderSuggestion:E},highlightLinks:!0,style:k},value:p,placeholder:Q,inputRef:jo,className:F.mentionField,onKeyDown:function(o){"Enter"!==o.key||o.shiftKey||eo&&!K&&(b()||(o.preventDefault(),ro()))},disableUnderline:!0,rows:1,fullWidth:!0,multiline:!0,autoFocus:H}),attachments:co.items,onAttachmentRemove:co.removeAttachment,onAttachmentRetry:co.handleRetry,onAttachmentReorder:no?co.reorderAttachments:void 0,onFilesDrop:co.addFiles,onImageLinkPaste:co.addLinkedImage,dropLabel:1===co.maxFiles?"Drop a file here":"Drop files here",attachmentSlot:z?S(h,{errorMessage:z}):void 0,toolbar:O(A,{children:[S(u,{inputRef:co.fileInputRef,onClick:co.openFileDialog,onFileSelect:co.handleFileSelect,onWellhubSelect:q?function(){return po(!0)}:void 0,multiple:no,disabled:co.isFull,tooltip:co.isFull?"Up to ".concat(co.maxFiles," ").concat(1===co.maxFiles?"file":"files"," can be attached"):"Attach ".concat(no?"files":"file")}),S(a,{title:"Mention someone",children:S(m,{size:"xs",type:"tertiary",onClick:function(){var o,s=jo.current;if(s){s.focus();var n=!!s.value&&!/\s$/.test(s.value),t="".concat(s.value).concat(n?" @":"@"),i=null===(o=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(s),"value"))||void 0===o?void 0:o.set;null==i||i.call(s,t),s.setSelectionRange(t.length,t.length),s.dispatchEvent(new Event("input",{bubbles:!0})),s.dispatchEvent(new Event("keyup",{bubbles:!0}))}},children:S(r,{fontSize:"inherit"})})}),S("span",{className:F.iconSlot,children:S(j,{icon:S(l,{size:16}),handleSelectEmoji:function(o){return P("".concat(p).concat(o.native))}})})]}),footer:(!(null==Z||!Z.length)||!!J)&&O(A,{children:[S(v,{rows:null!=Z?Z:[],singleLine:$}),J&&S(y,x({},J))]})}),q&&S(f,x(x({},q),{},{open:lo,maxSelectable:co.maxFiles-co.count,attachedFileNames:uo,onAdd:function(o){po(!1),co.addStoredFiles(o.map((function(o){return{fileName:o.fileName}})))},onClose:function(){return po(!1)}}))]})};export{w as CommentComposer};
+import o from"@babel/runtime/helpers/defineProperty";import s from"@babel/runtime/helpers/slicedToArray";import{useMemo as n,useCallback as t,useState as i,useRef as c,useEffect as e}from"react";import{Input as r}from"@material-ui/core";import m from"@material-ui/icons/AlternateEmail";import{ButtonIcon as a}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as l}from"../../componentsV2/Tooltip/Tooltip.js";import{SmilingFaceIcon as p}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{AvatarComponent as u}from"../Avatar/index.js";import{AttachFileButton as d}from"../AttachFileButton/AttachFileButton.js";import{CommentInput as j}from"../CommentInputNext/CommentInputNext.js";import h from"../EmojiIconButton.js";import I from"../FailedFileUploading.js";import b from"../UserMention/index.js";import{isSuggestionsListOpened as f}from"../UserMention/utils/index.js";import{WellhubFilePicker as g}from"../WellhubFilePicker/WellhubFilePicker.js";import"@babel/runtime/helpers/toConsumableArray";import"@babel/runtime/helpers/asyncToGenerator";import"@babel/runtime/regenerator";import"lodash/set";import"lodash/get";import"lodash/unset";import"moment";import"../../clients/jsonApi/index.js";import"../../clients/subscriptions/subscriptions-client.factory.js";import"../../clients/api/apiCore.js";import"../../clients/constants.js";import"../../clients/sso/auth0.js";import"../../clients/sso/oauth2.js";import"../../clients/api/rateLimiter.js";import"uuid";import{useAttachmentUpload as v,DEFAULT_MAX_ATTACHMENTS as C}from"./useAttachmentUpload.js";import{CommentMetaLine as y}from"./CommentMetaLine.js";import{ShareToChatRow as F}from"./ShareToChatRow.js";import O from"./CommentComposer.scss.js";import{jsxs as A,Fragment as S,jsx as P}from"react/jsx-runtime";function x(o,s){var n=Object.keys(o);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(o);s&&(t=t.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),n.push.apply(n,t)}return n}function k(s){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?x(Object(t),!0).forEach((function(n){o(s,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(t)):x(Object(t)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(t,o))}))}return s}var E={fontSize:14,lineHeight:"20px",suggestions:{backgroundColor:"var(--palette-background-b-9)",list:{backgroundColor:"var(--palette-background-b-9)"},item:{color:"var(--palette-primary-text-1)","&focused":{backgroundColor:"rgb(from var(--palette-primary-text-1) r g b / 0.08)"}}}},w=function(o){return A("div",{className:O.suggestion,children:[P(u,{size:26,alt:o.display,imgSrc:o.photo,displayName:o.display}),P("span",{children:o.display})]})},D=function(o){var u=o.body,x=o.onBodyChange,D=o.onSubmit,R=o.canSubmit,M=o.currentUser,U=o.attachments,N=o.onAttachmentsChange,B=o.maxAttachments,L=void 0===B?C:B,T=o.attachment,z=o.onAttachmentChange,W=o.attachmentError,G=o.onAttachmentError,q=o.maxAttachmentSizeBytes,K=o.wellhubContext,H=o.disabled,V=o.autoFocus,Q=o.placeholder,Z=void 0===Q?"Add a comment...":Q,$=o.metaRows,J=o.isMetaSingleLine,X=o.shareToChat,Y=o.trailing,_=o.renderTrailing,oo=o.embedded,so=o.className,no=o.testId,to=!!N,io=n((function(){return to?null!=U?U:[]:[T].filter(Boolean)}),[to,U,T]),co=t((function(o){var s;N?N(o):null==z||z(null!==(s=o[0])&&void 0!==s?s:null)}),[N,z]),eo=v({value:io,onChange:co,onError:G,maxSizeBytes:q,maxFiles:to?L:1}),ro=R&&!eo.isUploading,mo=function(){ro&&!H&&D()},ao=i(!1),lo=s(ao,2),po=lo[0],uo=lo[1],jo=n((function(){return io.map((function(o){return o.name}))}),[io]),ho=c(null);e((function(){var o=ho.current;V&&o&&o.setSelectionRange(o.value.length,o.value.length)}),[V]);return A(S,{children:[P(j,{value:u,canSubmit:ro,disabled:H,onSubmit:D,trailing:_?_({canSend:ro&&!H,submit:mo}):Y,embedded:oo,className:so,testId:no,field:P(r,{inputComponent:b,inputProps:{onChange:x,currentUser:M,allowEmptyQuery:!0,suggestionsPortalHost:document.querySelector("body"),withLightTheme:!1,mentionProps:{renderSuggestion:w},highlightLinks:!0,style:E},value:u,placeholder:Z,inputRef:ho,className:O.mentionField,onKeyDown:function(o){"Enter"!==o.key||o.shiftKey||ro&&!H&&(f()||(o.preventDefault(),mo()))},disableUnderline:!0,rows:1,fullWidth:!0,multiline:!0,autoFocus:V}),attachments:eo.items,onAttachmentRemove:eo.removeAttachment,onAttachmentRetry:eo.handleRetry,onAttachmentReorder:to?eo.reorderAttachments:void 0,onFilesDrop:eo.addFiles,onImageLinkPaste:eo.addLinkedImage,dropLabel:1===eo.maxFiles?"Drop a file here":"Drop files here",attachmentSlot:W?P(I,{errorMessage:W}):void 0,toolbar:A(S,{children:[P(d,{inputRef:eo.fileInputRef,onClick:eo.openFileDialog,onFileSelect:eo.handleFileSelect,onWellhubSelect:K?function(){return uo(!0)}:void 0,multiple:to,disabled:eo.isFull,tooltip:eo.isFull?"Up to ".concat(eo.maxFiles," ").concat(1===eo.maxFiles?"file":"files"," can be attached"):"Attach ".concat(to?"files":"file")}),P(l,{title:"Mention someone",children:P(a,{size:"xs",type:"tertiary",onClick:function(){var o,s=ho.current;if(s){s.focus();var n=!!s.value&&!/\s$/.test(s.value),t="".concat(s.value).concat(n?" @":"@"),i=null===(o=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(s),"value"))||void 0===o?void 0:o.set;null==i||i.call(s,t),s.setSelectionRange(t.length,t.length),s.dispatchEvent(new Event("input",{bubbles:!0})),s.dispatchEvent(new Event("keyup",{bubbles:!0}))}},children:P(m,{fontSize:"inherit"})})}),P("span",{className:O.iconSlot,children:P(h,{icon:P(p,{size:16}),handleSelectEmoji:function(o){return x("".concat(u).concat(o.native))}})})]}),footer:(!(null==$||!$.length)||!!X)&&A(S,{children:[P(y,{rows:null!=$?$:[],singleLine:J}),X&&P(F,k({},X))]})}),K&&P(g,k(k({},K),{},{open:po,maxSelectable:eo.maxFiles-eo.count,attachedFileNames:jo,onAdd:function(o){uo(!1),eo.addStoredFiles(o.map((function(o){return{fileName:o.fileName}})))},onClose:function(){return uo(!1)}}))]})};export{D as CommentComposer};
 //# sourceMappingURL=CommentComposer.js.map

package/components/CommentComposer/CommentComposer.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommentComposer.js","sources":["../../../src/components/CommentComposer/CommentComposer.tsx"],"sourcesContent":["import {\n  CSSProperties,\n  FormEventHandler,\n  KeyboardEvent,\n  ReactNode,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { Input } from '@material-ui/core';\nimport AlternateEmailIcon from '@material-ui/icons/AlternateEmail';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { SmilingFaceIcon } from '../../icons';\nimport Avatar from '../Avatar';\nimport { AttachFileButton } from '../AttachFileButton';\nimport { CommentInput } from '../CommentInputNext/CommentInputNext';\nimport EmojiIconButton from '../EmojiIconButton';\nimport FailedFileUploading from '../FailedFileUploading';\nimport UserMention from '../UserMention';\nimport { isSuggestionsListOpened } from '../UserMention/utils';\nimport { WellhubFilePicker } from '../WellhubFilePicker';\nimport type { WellhubContext, WellhubFile } from '../WellhubFilePicker';\n\nimport {\n  useAttachmentUpload,\n  UploadedAttachment,\n  DEFAULT_MAX_ATTACHMENTS,\n} from './useAttachmentUpload';\nimport { CommentMetaLine, CommentMetaRow } from './CommentMetaLine';\nimport { ShareToChatRow, ShareToChatRowProps } from './ShareToChatRow';\n\nimport styles from './CommentComposer.scss';\n\n/* eslint-disable camelcase -- mirrors the platform's snake_case user payload. */\nexport type CommentComposerUser = {\n  id?: number;\n  company_id?: number;\n  first_name?: string;\n  last_name?: string;\n  profile_photo?: string;\n  [key: string]: unknown;\n};\n/* eslint-enable camelcase */\n\nexport type CommentComposerTrailingState = {\n  canSend: boolean;\n  submit: () => void;\n};\n\nexport type CommentComposerProps = {\n  body: string;\n  onBodyChange: (value: string) => void;\n  onSubmit: () => void;\n  canSubmit: boolean;\n  currentUser: CommentComposerUser;\n\n  attachments?: UploadedAttachment[];\n  onAttachmentsChange?: (attachments: UploadedAttachment[]) => void;\n  maxAttachments?: number;\n  /** @deprecated Use `attachments` — kept so single-attachment callers keep working. */\n  attachment?: UploadedAttachment | null;\n  /** @deprecated Use `onAttachmentsChange`. */\n  onAttachmentChange?: (attachment: UploadedAttachment | null) => void;\n  attachmentError?: string | null;\n  onAttachmentError?: (message: string | null) => void;\n  maxAttachmentSizeBytes?: number;\n  wellhubContext?: WellhubContext;\n\n  disabled?: boolean;\n  autoFocus?: boolean;\n  placeholder?: string;\n  metaRows?: CommentMetaRow[];\n  isMetaSingleLine?: boolean;\n  shareToChat?: Omit<ShareToChatRowProps, 'testId'>;\n  /** Replaces the default send button, e.g. the edit form's Cancel/Save. */\n  trailing?: ReactNode;\n  /** Like `trailing`, but receives the upload-aware send state for a custom Save. */\n  renderTrailing?: (state: CommentComposerTrailingState) => ReactNode;\n  /** Render flush inside a host card instead of as its own surface. */\n  embedded?: boolean;\n  className?: string;\n  testId?: string;\n};\n\nconst SUGGESTIONS_BACKGROUND = 'var(--palette-background-b-9)';\n\n// Module-level so react-mentions isn't re-rendered on every keystroke.\nconst MENTION_INPUT_STYLE = {\n  fontSize: 14,\n  lineHeight: '20px',\n  suggestions: {\n    backgroundColor: SUGGESTIONS_BACKGROUND,\n    list: { backgroundColor: SUGGESTIONS_BACKGROUND },\n    item: {\n      color: 'var(--palette-primary-text-1)',\n      '&focused': { backgroundColor: 'rgb(from var(--palette-primary-text-1) r g b / 0.08)' },\n    },\n  },\n} as unknown as CSSProperties;\n\nconst renderSuggestion = (entry: { display: string; photo?: string }) => (\n  <div className={styles.suggestion}>\n    <Avatar size={26} alt={entry.display} imgSrc={entry.photo} displayName={entry.display} />\n    <span>{entry.display}</span>\n  </div>\n);\n\nexport const CommentComposer = ({\n  body,\n  onBodyChange,\n  onSubmit,\n  canSubmit,\n  currentUser,\n  attachments,\n  onAttachmentsChange,\n  maxAttachments = DEFAULT_MAX_ATTACHMENTS,\n  attachment,\n  onAttachmentChange,\n  attachmentError,\n  onAttachmentError,\n  maxAttachmentSizeBytes,\n  wellhubContext,\n  disabled,\n  autoFocus,\n  placeholder = 'Add a comment...',\n  metaRows,\n  isMetaSingleLine,\n  shareToChat,\n  trailing,\n  renderTrailing,\n  embedded,\n  className,\n  testId,\n}: CommentComposerProps) => {\n  // Callers still on the singular props get the old one-file behaviour, unchanged.\n  const isMulti = !!onAttachmentsChange;\n  const value = useMemo(\n    () => (isMulti ? attachments ?? [] : ([attachment].filter(Boolean) as UploadedAttachment[])),\n    [isMulti, attachments, attachment]\n  );\n\n  const handleAttachmentsChange = useCallback(\n    (next: UploadedAttachment[]) => {\n      if (onAttachmentsChange) onAttachmentsChange(next);\n      else onAttachmentChange?.(next[0] ?? null);\n    },\n    [onAttachmentsChange, onAttachmentChange]\n  );\n\n  const upload = useAttachmentUpload({\n    value,\n    onChange: handleAttachmentsChange,\n    onError: onAttachmentError,\n    maxSizeBytes: maxAttachmentSizeBytes,\n    maxFiles: isMulti ? maxAttachments : 1,\n  });\n\n  // An attachment only lands once S3 confirms, so posting mid-upload would drop it.\n  const canSend = canSubmit && !upload.isUploading;\n\n  const submit = () => {\n    if (!canSend || disabled) return;\n\n    onSubmit();\n  };\n\n  const [isWellhubOpen, setIsWellhubOpen] = useState(false);\n  const attachedKeys = useMemo(() => value.map(item => item.name), [value]);\n\n  const addWellhubFiles = (files: WellhubFile[]) => {\n    setIsWellhubOpen(false);\n    upload.addStoredFiles(files.map(file => ({ fileName: file.fileName })));\n  };\n\n  const fieldRef = useRef<HTMLTextAreaElement | null>(null);\n\n  // react-mentions opens suggestions from textarea events, so type \"@\" instead of setting state.\n  const mentionSomeone = () => {\n    const field = fieldRef.current;\n    if (!field) return;\n\n    field.focus();\n\n    const needsSpace = !!field.value && !/\\s$/.test(field.value);\n    const nextValue = `${field.value}${needsSpace ? ' @' : '@'}`;\n    const setValue = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(field), 'value')?.set;\n\n    setValue?.call(field, nextValue);\n    field.setSelectionRange(nextValue.length, nextValue.length);\n    field.dispatchEvent(new Event('input', { bubbles: true }));\n    field.dispatchEvent(new Event('keyup', { bubbles: true }));\n  };\n\n  const handleEnterKey = (event: KeyboardEvent) => {\n    if (event.key !== 'Enter' || event.shiftKey) return;\n    if (!canSend || disabled) return;\n    if (isSuggestionsListOpened()) return;\n\n    event.preventDefault();\n    submit();\n  };\n\n  return (\n    <>\n      <CommentInput\n        value={body}\n        canSubmit={canSend}\n        disabled={disabled}\n        onSubmit={onSubmit}\n        trailing={\n          renderTrailing ? renderTrailing({ canSend: canSend && !disabled, submit }) : trailing\n        }\n        embedded={embedded}\n        className={className}\n        testId={testId}\n        field={\n          <Input\n            inputComponent={UserMention}\n            inputProps={{\n              // UserMention calls onChange with the text string, not a DOM event.\n              onChange: onBodyChange as unknown as FormEventHandler<HTMLInputElement>,\n              currentUser,\n              allowEmptyQuery: true,\n              suggestionsPortalHost: document.querySelector('body'),\n              withLightTheme: false,\n              mentionProps: { renderSuggestion },\n              highlightLinks: true,\n              style: MENTION_INPUT_STYLE,\n            }}\n            value={body}\n            placeholder={placeholder}\n            inputRef={fieldRef}\n            className={styles.mentionField}\n            onKeyDown={handleEnterKey}\n            disableUnderline\n            rows={1}\n            fullWidth\n            multiline\n            autoFocus={autoFocus}\n          />\n        }\n        attachments={upload.items}\n        onAttachmentRemove={upload.removeAttachment}\n        onAttachmentRetry={upload.handleRetry}\n        onAttachmentReorder={isMulti ? upload.reorderAttachments : undefined}\n        onFilesDrop={upload.addFiles}\n        onImageLinkPaste={upload.addLinkedImage}\n        dropLabel={upload.maxFiles === 1 ? 'Drop a file here' : 'Drop files here'}\n        attachmentSlot={\n          attachmentError ? <FailedFileUploading errorMessage={attachmentError} /> : undefined\n        }\n        toolbar={\n          <>\n            <AttachFileButton\n              inputRef={upload.fileInputRef}\n              onClick={upload.openFileDialog}\n              onFileSelect={upload.handleFileSelect}\n              onWellhubSelect={wellhubContext ? () => setIsWellhubOpen(true) : undefined}\n              multiple={isMulti}\n              disabled={upload.isFull}\n              tooltip={\n                upload.isFull\n                  ? `Up to ${upload.maxFiles} ${\n                      upload.maxFiles === 1 ? 'file' : 'files'\n                    } can be attached`\n                  : `Attach ${isMulti ? 'files' : 'file'}`\n              }\n            />\n            <Tooltip title=\"Mention someone\">\n              <ButtonIcon size=\"xs\" type=\"tertiary\" onClick={mentionSomeone}>\n                <AlternateEmailIcon fontSize=\"inherit\" />\n              </ButtonIcon>\n            </Tooltip>\n            <span className={styles.iconSlot}>\n              <EmojiIconButton\n                icon={<SmilingFaceIcon size={16} />}\n                handleSelectEmoji={(emoji: { native: string }) =>\n                  onBodyChange(`${body}${emoji.native}`)\n                }\n              />\n            </span>\n          </>\n        }\n        footer={\n          (!!metaRows?.length || !!shareToChat) && (\n            <>\n              <CommentMetaLine rows={metaRows ?? []} singleLine={isMetaSingleLine} />\n              {shareToChat && <ShareToChatRow {...shareToChat} />}\n            </>\n          )\n        }\n      />\n\n      {wellhubContext && (\n        <WellhubFilePicker\n          {...wellhubContext}\n          open={isWellhubOpen}\n          maxSelectable={upload.maxFiles - upload.count}\n          attachedFileNames={attachedKeys}\n          onAdd={addWellhubFiles}\n          onClose={() => setIsWellhubOpen(false)}\n        />\n      )}\n    </>\n  );\n};\n"],"names":["MENTION_INPUT_STYLE","fontSize","lineHeight","suggestions","backgroundColor","list","item","color","renderSuggestion","entry","_jsxs","className","styles","suggestion","children","_jsx","Avatar","size","alt","display","imgSrc","photo","displayName","CommentComposer","_ref","body","onBodyChange","onSubmit","canSubmit","currentUser","attachments","onAttachmentsChange","_ref$maxAttachments","maxAttachments","DEFAULT_MAX_ATTACHMENTS","attachment","onAttachmentChange","attachmentError","onAttachmentError","maxAttachmentSizeBytes","wellhubContext","disabled","autoFocus","_ref$placeholder","placeholder","metaRows","isMetaSingleLine","shareToChat","trailing","renderTrailing","embedded","testId","isMulti","value","useMemo","filter","Boolean","handleAttachmentsChange","useCallback","next","_next$","upload","useAttachmentUpload","onChange","onError","maxSizeBytes","maxFiles","canSend","isUploading","submit","useState","_useState2","_slicedToArray","_useState","isWellhubOpen","setIsWellhubOpen","attachedKeys","map","name","fieldRef","useRef","_Fragment","CommentInput","field","Input","inputComponent","UserMention","inputProps","allowEmptyQuery","suggestionsPortalHost","document","querySelector","withLightTheme","mentionProps","highlightLinks","style","inputRef","mentionField","onKeyDown","event","key","shiftKey","isSuggestionsListOpened","preventDefault","disableUnderline","rows","fullWidth","multiline","items","onAttachmentRemove","removeAttachment","onAttachmentRetry","handleRetry","onAttachmentReorder","reorderAttachments","undefined","onFilesDrop","addFiles","onImageLinkPaste","addLinkedImage","dropLabel","attachmentSlot","FailedFileUploading","errorMessage","toolbar","AttachFileButton","fileInputRef","onClick","openFileDialog","onFileSelect","handleFileSelect","onWellhubSelect","multiple","isFull","tooltip","concat","Tooltip","title","ButtonIcon","type","_Object$getOwnPropert","current","focus","needsSpace","test","nextValue","setValue","Object","getOwnPropertyDescriptor","getPrototypeOf","set","call","setSelectionRange","length","dispatchEvent","Event","bubbles","AlternateEmailIcon","iconSlot","EmojiIconButton","icon","SmilingFaceIcon","handleSelectEmoji","emoji","native","footer","CommentMetaLine","singleLine","ShareToChatRow","_objectSpread","WellhubFilePicker","open","maxSelectable","count","attachedFileNames","onAdd","files","addStoredFiles","file","fileName","onClose"],"mappings":"yjMAuFA,IAGMA,EAAsB,CAC1BC,SAAU,GACVC,WAAY,OACZC,YAAa,CACXC,gBAP2B,gCAQ3BC,KAAM,CAAED,gBARmB,iCAS3BE,KAAM,CACJC,MAAO,gCACP,WAAY,CAAEH,gBAAiB,2DAK/BI,EAAmB,SAACC,GAA0C,OAClEC,EAAA,MAAA,CAAKC,UAAWC,EAAOC,WAAWC,SAAA,CAChCC,EAACC,EAAM,CAACC,KAAM,GAAIC,IAAKT,EAAMU,QAASC,OAAQX,EAAMY,MAAOC,YAAab,EAAMU,UAC9EJ,EAAA,OAAA,CAAAD,SAAOL,EAAMU,YACT,EAGKI,EAAkB,SA0BHC,GAAA,IAzB1BC,IAAAA,KACAC,IAAAA,aACAC,IAAAA,SACAC,IAAAA,UACAC,IAAAA,YACAC,IAAAA,YACAC,IAAAA,oBAAmBC,EAAAR,EACnBS,eAAAA,aAAiBC,EAAuBF,EACxCG,IAAAA,WACAC,IAAAA,mBACAC,IAAAA,gBACAC,IAAAA,kBACAC,IAAAA,uBACAC,IAAAA,eACAC,IAAAA,SACAC,IAAAA,UAASC,EAAAnB,EACToB,YAAAA,aAAc,mBAAkBD,EAChCE,IAAAA,SACAC,IAAAA,iBACAC,IAAAA,YACAC,IAAAA,SACAC,IAAAA,eACAC,IAAAA,SACAvC,KAAAA,UACAwC,KAAAA,OAGMC,KAAYrB,EACZsB,GAAQC,GACZ,WAAA,OAAOF,GAAUtB,QAAAA,EAAe,GAAM,CAACK,GAAYoB,OAAOC,QAAkC,GAC5F,CAACJ,GAAStB,EAAaK,IAGnBsB,GAA0BC,GAC9B,SAACC,GAA+B,IAAAC,EAC1B7B,EAAqBA,EAAoB4B,GACxCvB,SAAAA,EAA4B,UAAPuB,EAAK,UAAE,IAAAC,EAAAA,EAAI,KACvC,GACA,CAAC7B,EAAqBK,IAGlByB,GAASC,EAAoB,CACjCT,MAAAA,GACAU,SAAUN,GACVO,QAAS1B,EACT2B,aAAc1B,EACd2B,SAAUd,GAAUnB,EAAiB,IAIjCkC,GAAUvC,IAAciC,GAAOO,YAE/BC,GAAS,WACRF,KAAW1B,GAEhBd,KAGwC2C,GAAAA,GAAS,GAAMC,GAAAC,EAAAC,GAAA,GAAlDC,GAAaH,GAAA,GAAEI,GAAgBJ,GAAA,GAChCK,GAAetB,GAAQ,WAAA,OAAMD,GAAMwB,KAAI,SAAAvE,GAAI,OAAIA,EAAKwE,UAAO,CAACzB,KAO5D0B,GAAWC,EAAmC,MA4BpD,OACEtE,EAAAuE,EAAA,CAAAnE,SAAA,CACEC,EAACmE,EAAY,CACX7B,MAAO5B,EACPG,UAAWuC,GACX1B,SAAUA,EACVd,SAAUA,EACVqB,SACEC,EAAiBA,EAAe,CAAEkB,QAASA,KAAY1B,EAAU4B,OAAAA,KAAYrB,EAE/EE,SAAUA,EACVvC,UAAWA,GACXwC,OAAQA,GACRgC,MACEpE,EAACqE,EAAK,CACJC,eAAgBC,EAChBC,WAAY,CAEVxB,SAAUrC,EACVG,YAAAA,EACA2D,iBAAiB,EACjBC,sBAAuBC,SAASC,cAAc,QAC9CC,gBAAgB,EAChBC,aAAc,CAAErF,iBAAAA,GAChBsF,gBAAgB,EAChBC,MAAO/F,GAETqD,MAAO5B,EACPmB,YAAaA,EACboD,SAAUjB,GACVpE,UAAWC,EAAOqF,aAClBC,UAxCa,SAACC,GACJ,UAAdA,EAAMC,KAAmBD,EAAME,UAC9BlC,KAAW1B,IACZ6D,MAEJH,EAAMI,iBACNlC,QAmCQmC,kBAAgB,EAChBC,KAAM,EACNC,WAAS,EACTC,WAAS,EACTjE,UAAWA,IAGfZ,YAAa+B,GAAO+C,MACpBC,mBAAoBhD,GAAOiD,iBAC3BC,kBAAmBlD,GAAOmD,YAC1BC,oBAAqB7D,GAAUS,GAAOqD,wBAAqBC,EAC3DC,YAAavD,GAAOwD,SACpBC,iBAAkBzD,GAAO0D,eACzBC,UAA+B,IAApB3D,GAAOK,SAAiB,mBAAqB,kBACxDuD,eACEpF,EAAkBtB,EAAC2G,EAAmB,CAACC,aAActF,SAAsB8E,EAE7ES,QACElH,EAAAuE,EAAA,CAAAnE,SAAA,CACEC,EAAC8G,EAAgB,CACf7B,SAAUnC,GAAOiE,aACjBC,QAASlE,GAAOmE,eAChBC,aAAcpE,GAAOqE,iBACrBC,gBAAiB3F,EAAiB,WAAA,OAAMmC,IAAiB,EAAK,OAAGwC,EACjEiB,SAAUhF,GACVX,SAAUoB,GAAOwE,OACjBC,QACEzE,GAAOwE,uBACMxE,GAAOK,SAAQ,KAAAqE,OACF,IAApB1E,GAAOK,SAAiB,OAAS,6CAEzBd,GAAU,QAAU,UAGtCrC,EAACyH,EAAO,CAACC,MAAM,kBAAiB3H,SAC9BC,EAAC2H,EAAU,CAACzH,KAAK,KAAK0H,KAAK,WAAWZ,QA5F3B,WAAM,IAAAa,EACrBzD,EAAQJ,GAAS8D,QACvB,GAAK1D,EAAL,CAEAA,EAAM2D,QAEN,IAAMC,IAAe5D,EAAM9B,QAAU,MAAM2F,KAAK7D,EAAM9B,OAChD4F,EAAe9D,GAAAA,OAAAA,EAAM9B,OAAQ0F,OAAAA,EAAa,KAAO,KACjDG,EAAiF,QAAtEC,EAAAA,OAAOC,yBAAyBD,OAAOE,eAAelE,GAAQ,gBAAQ,IAAAyD,OAAA,EAAtEA,EAAwEU,IAEzFJ,SAAAA,EAAUK,KAAKpE,EAAO8D,GACtB9D,EAAMqE,kBAAkBP,EAAUQ,OAAQR,EAAUQ,QACpDtE,EAAMuE,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,KAClDzE,EAAMuE,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,IAXtC,GA0F4D9I,SAC5DC,EAAC8I,EAAkB,CAAC5J,SAAS,gBAGjCc,EAAA,OAAA,CAAMJ,UAAWC,EAAOkJ,SAAShJ,SAC/BC,EAACgJ,EAAe,CACdC,KAAMjJ,EAACkJ,EAAe,CAAChJ,KAAM,KAC7BiJ,kBAAmB,SAACC,GAAyB,OAC3CzI,EAAgBD,GAAAA,OAAAA,UAAO0I,EAAMC,QAAS,SAMhDC,UACKxH,UAAAA,EAAU4G,WAAY1G,IACvBrC,EAAAuE,EAAA,CAAAnE,SAAA,CACEC,EAACuJ,EAAe,CAAC7D,KAAM5D,QAAAA,EAAY,GAAI0H,WAAYzH,IAClDC,GAAehC,EAACyJ,EAAcC,EAAA,CAAA,EAAK1H,SAM3CP,GACCzB,EAAC2J,SACKlI,GAAc,GAAA,CAClBmI,KAAMjG,GACNkG,cAAe/G,GAAOK,SAAWL,GAAOgH,MACxCC,kBAAmBlG,GACnBmG,MAlIgB,SAACC,GACvBrG,IAAiB,GACjBd,GAAOoH,eAAeD,EAAMnG,KAAI,SAAAqG,GAAI,MAAK,CAAEC,SAAUD,EAAKC,SAAW,MAiI/DC,QAAS,WAAA,OAAMzG,IAAiB,EAAM,OAKhD"}
+{"version":3,"file":"CommentComposer.js","sources":["../../../src/components/CommentComposer/CommentComposer.tsx"],"sourcesContent":["import {\n  CSSProperties,\n  FormEventHandler,\n  KeyboardEvent,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { Input } from '@material-ui/core';\nimport AlternateEmailIcon from '@material-ui/icons/AlternateEmail';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { SmilingFaceIcon } from '../../icons';\nimport Avatar from '../Avatar';\nimport { AttachFileButton } from '../AttachFileButton';\nimport { CommentInput } from '../CommentInputNext/CommentInputNext';\nimport EmojiIconButton from '../EmojiIconButton';\nimport FailedFileUploading from '../FailedFileUploading';\nimport UserMention from '../UserMention';\nimport { isSuggestionsListOpened } from '../UserMention/utils';\nimport { WellhubFilePicker } from '../WellhubFilePicker';\nimport type { WellhubContext, WellhubFile } from '../WellhubFilePicker';\n\nimport {\n  useAttachmentUpload,\n  UploadedAttachment,\n  DEFAULT_MAX_ATTACHMENTS,\n} from './useAttachmentUpload';\nimport { CommentMetaLine, CommentMetaRow } from './CommentMetaLine';\nimport { ShareToChatRow, ShareToChatRowProps } from './ShareToChatRow';\n\nimport styles from './CommentComposer.scss';\n\n/* eslint-disable camelcase -- mirrors the platform's snake_case user payload. */\nexport type CommentComposerUser = {\n  id?: number;\n  company_id?: number;\n  first_name?: string;\n  last_name?: string;\n  profile_photo?: string;\n  [key: string]: unknown;\n};\n/* eslint-enable camelcase */\n\nexport type CommentComposerTrailingState = {\n  canSend: boolean;\n  submit: () => void;\n};\n\nexport type CommentComposerProps = {\n  body: string;\n  onBodyChange: (value: string) => void;\n  onSubmit: () => void;\n  canSubmit: boolean;\n  currentUser: CommentComposerUser;\n\n  attachments?: UploadedAttachment[];\n  onAttachmentsChange?: (attachments: UploadedAttachment[]) => void;\n  maxAttachments?: number;\n  /** @deprecated Use `attachments` — kept so single-attachment callers keep working. */\n  attachment?: UploadedAttachment | null;\n  /** @deprecated Use `onAttachmentsChange`. */\n  onAttachmentChange?: (attachment: UploadedAttachment | null) => void;\n  attachmentError?: string | null;\n  onAttachmentError?: (message: string | null) => void;\n  maxAttachmentSizeBytes?: number;\n  wellhubContext?: WellhubContext;\n\n  disabled?: boolean;\n  autoFocus?: boolean;\n  placeholder?: string;\n  metaRows?: CommentMetaRow[];\n  isMetaSingleLine?: boolean;\n  shareToChat?: Omit<ShareToChatRowProps, 'testId'>;\n  /** Replaces the default send button, e.g. the edit form's Cancel/Save. */\n  trailing?: ReactNode;\n  /** Like `trailing`, but receives the upload-aware send state for a custom Save. */\n  renderTrailing?: (state: CommentComposerTrailingState) => ReactNode;\n  /** Render flush inside a host card instead of as its own surface. */\n  embedded?: boolean;\n  className?: string;\n  testId?: string;\n};\n\nconst SUGGESTIONS_BACKGROUND = 'var(--palette-background-b-9)';\n\n// Module-level so react-mentions isn't re-rendered on every keystroke.\nconst MENTION_INPUT_STYLE = {\n  fontSize: 14,\n  lineHeight: '20px',\n  suggestions: {\n    backgroundColor: SUGGESTIONS_BACKGROUND,\n    list: { backgroundColor: SUGGESTIONS_BACKGROUND },\n    item: {\n      color: 'var(--palette-primary-text-1)',\n      '&focused': { backgroundColor: 'rgb(from var(--palette-primary-text-1) r g b / 0.08)' },\n    },\n  },\n} as unknown as CSSProperties;\n\nconst renderSuggestion = (entry: { display: string; photo?: string }) => (\n  <div className={styles.suggestion}>\n    <Avatar size={26} alt={entry.display} imgSrc={entry.photo} displayName={entry.display} />\n    <span>{entry.display}</span>\n  </div>\n);\n\nexport const CommentComposer = ({\n  body,\n  onBodyChange,\n  onSubmit,\n  canSubmit,\n  currentUser,\n  attachments,\n  onAttachmentsChange,\n  maxAttachments = DEFAULT_MAX_ATTACHMENTS,\n  attachment,\n  onAttachmentChange,\n  attachmentError,\n  onAttachmentError,\n  maxAttachmentSizeBytes,\n  wellhubContext,\n  disabled,\n  autoFocus,\n  placeholder = 'Add a comment...',\n  metaRows,\n  isMetaSingleLine,\n  shareToChat,\n  trailing,\n  renderTrailing,\n  embedded,\n  className,\n  testId,\n}: CommentComposerProps) => {\n  // Callers still on the singular props get the old one-file behaviour, unchanged.\n  const isMulti = !!onAttachmentsChange;\n  const value = useMemo(\n    () => (isMulti ? attachments ?? [] : ([attachment].filter(Boolean) as UploadedAttachment[])),\n    [isMulti, attachments, attachment]\n  );\n\n  const handleAttachmentsChange = useCallback(\n    (next: UploadedAttachment[]) => {\n      if (onAttachmentsChange) onAttachmentsChange(next);\n      else onAttachmentChange?.(next[0] ?? null);\n    },\n    [onAttachmentsChange, onAttachmentChange]\n  );\n\n  const upload = useAttachmentUpload({\n    value,\n    onChange: handleAttachmentsChange,\n    onError: onAttachmentError,\n    maxSizeBytes: maxAttachmentSizeBytes,\n    maxFiles: isMulti ? maxAttachments : 1,\n  });\n\n  // An attachment only lands once S3 confirms, so posting mid-upload would drop it.\n  const canSend = canSubmit && !upload.isUploading;\n\n  const submit = () => {\n    if (!canSend || disabled) return;\n\n    onSubmit();\n  };\n\n  const [isWellhubOpen, setIsWellhubOpen] = useState(false);\n  const attachedKeys = useMemo(() => value.map(item => item.name), [value]);\n\n  const addWellhubFiles = (files: WellhubFile[]) => {\n    setIsWellhubOpen(false);\n    upload.addStoredFiles(files.map(file => ({ fileName: file.fileName })));\n  };\n\n  const fieldRef = useRef<HTMLTextAreaElement | null>(null);\n\n  // An autofocused edit form lands the caret at the start; editing usually continues from the end.\n  useEffect(() => {\n    const field = fieldRef.current;\n    if (!autoFocus || !field) return;\n\n    field.setSelectionRange(field.value.length, field.value.length);\n  }, [autoFocus]);\n\n  // react-mentions opens suggestions from textarea events, so type \"@\" instead of setting state.\n  const mentionSomeone = () => {\n    const field = fieldRef.current;\n    if (!field) return;\n\n    field.focus();\n\n    const needsSpace = !!field.value && !/\\s$/.test(field.value);\n    const nextValue = `${field.value}${needsSpace ? ' @' : '@'}`;\n    const setValue = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(field), 'value')?.set;\n\n    setValue?.call(field, nextValue);\n    field.setSelectionRange(nextValue.length, nextValue.length);\n    field.dispatchEvent(new Event('input', { bubbles: true }));\n    field.dispatchEvent(new Event('keyup', { bubbles: true }));\n  };\n\n  const handleEnterKey = (event: KeyboardEvent) => {\n    if (event.key !== 'Enter' || event.shiftKey) return;\n    if (!canSend || disabled) return;\n    if (isSuggestionsListOpened()) return;\n\n    event.preventDefault();\n    submit();\n  };\n\n  return (\n    <>\n      <CommentInput\n        value={body}\n        canSubmit={canSend}\n        disabled={disabled}\n        onSubmit={onSubmit}\n        trailing={\n          renderTrailing ? renderTrailing({ canSend: canSend && !disabled, submit }) : trailing\n        }\n        embedded={embedded}\n        className={className}\n        testId={testId}\n        field={\n          <Input\n            inputComponent={UserMention}\n            inputProps={{\n              // UserMention calls onChange with the text string, not a DOM event.\n              onChange: onBodyChange as unknown as FormEventHandler<HTMLInputElement>,\n              currentUser,\n              allowEmptyQuery: true,\n              suggestionsPortalHost: document.querySelector('body'),\n              withLightTheme: false,\n              mentionProps: { renderSuggestion },\n              highlightLinks: true,\n              style: MENTION_INPUT_STYLE,\n            }}\n            value={body}\n            placeholder={placeholder}\n            inputRef={fieldRef}\n            className={styles.mentionField}\n            onKeyDown={handleEnterKey}\n            disableUnderline\n            rows={1}\n            fullWidth\n            multiline\n            autoFocus={autoFocus}\n          />\n        }\n        attachments={upload.items}\n        onAttachmentRemove={upload.removeAttachment}\n        onAttachmentRetry={upload.handleRetry}\n        onAttachmentReorder={isMulti ? upload.reorderAttachments : undefined}\n        onFilesDrop={upload.addFiles}\n        onImageLinkPaste={upload.addLinkedImage}\n        dropLabel={upload.maxFiles === 1 ? 'Drop a file here' : 'Drop files here'}\n        attachmentSlot={\n          attachmentError ? <FailedFileUploading errorMessage={attachmentError} /> : undefined\n        }\n        toolbar={\n          <>\n            <AttachFileButton\n              inputRef={upload.fileInputRef}\n              onClick={upload.openFileDialog}\n              onFileSelect={upload.handleFileSelect}\n              onWellhubSelect={wellhubContext ? () => setIsWellhubOpen(true) : undefined}\n              multiple={isMulti}\n              disabled={upload.isFull}\n              tooltip={\n                upload.isFull\n                  ? `Up to ${upload.maxFiles} ${\n                      upload.maxFiles === 1 ? 'file' : 'files'\n                    } can be attached`\n                  : `Attach ${isMulti ? 'files' : 'file'}`\n              }\n            />\n            <Tooltip title=\"Mention someone\">\n              <ButtonIcon size=\"xs\" type=\"tertiary\" onClick={mentionSomeone}>\n                <AlternateEmailIcon fontSize=\"inherit\" />\n              </ButtonIcon>\n            </Tooltip>\n            <span className={styles.iconSlot}>\n              <EmojiIconButton\n                icon={<SmilingFaceIcon size={16} />}\n                handleSelectEmoji={(emoji: { native: string }) =>\n                  onBodyChange(`${body}${emoji.native}`)\n                }\n              />\n            </span>\n          </>\n        }\n        footer={\n          (!!metaRows?.length || !!shareToChat) && (\n            <>\n              <CommentMetaLine rows={metaRows ?? []} singleLine={isMetaSingleLine} />\n              {shareToChat && <ShareToChatRow {...shareToChat} />}\n            </>\n          )\n        }\n      />\n\n      {wellhubContext && (\n        <WellhubFilePicker\n          {...wellhubContext}\n          open={isWellhubOpen}\n          maxSelectable={upload.maxFiles - upload.count}\n          attachedFileNames={attachedKeys}\n          onAdd={addWellhubFiles}\n          onClose={() => setIsWellhubOpen(false)}\n        />\n      )}\n    </>\n  );\n};\n"],"names":["MENTION_INPUT_STYLE","fontSize","lineHeight","suggestions","backgroundColor","list","item","color","renderSuggestion","entry","_jsxs","className","styles","suggestion","children","_jsx","Avatar","size","alt","display","imgSrc","photo","displayName","CommentComposer","_ref","body","onBodyChange","onSubmit","canSubmit","currentUser","attachments","onAttachmentsChange","_ref$maxAttachments","maxAttachments","DEFAULT_MAX_ATTACHMENTS","attachment","onAttachmentChange","attachmentError","onAttachmentError","maxAttachmentSizeBytes","wellhubContext","disabled","autoFocus","_ref$placeholder","placeholder","metaRows","isMetaSingleLine","shareToChat","trailing","renderTrailing","embedded","testId","isMulti","value","useMemo","filter","Boolean","handleAttachmentsChange","useCallback","next","_next$","upload","useAttachmentUpload","onChange","onError","maxSizeBytes","maxFiles","canSend","isUploading","submit","useState","_useState2","_slicedToArray","_useState","isWellhubOpen","setIsWellhubOpen","attachedKeys","map","name","fieldRef","useRef","useEffect","field","current","setSelectionRange","length","_Fragment","CommentInput","Input","inputComponent","UserMention","inputProps","allowEmptyQuery","suggestionsPortalHost","document","querySelector","withLightTheme","mentionProps","highlightLinks","style","inputRef","mentionField","onKeyDown","event","key","shiftKey","isSuggestionsListOpened","preventDefault","disableUnderline","rows","fullWidth","multiline","items","onAttachmentRemove","removeAttachment","onAttachmentRetry","handleRetry","onAttachmentReorder","reorderAttachments","undefined","onFilesDrop","addFiles","onImageLinkPaste","addLinkedImage","dropLabel","attachmentSlot","FailedFileUploading","errorMessage","toolbar","AttachFileButton","fileInputRef","onClick","openFileDialog","onFileSelect","handleFileSelect","onWellhubSelect","multiple","isFull","tooltip","concat","Tooltip","title","ButtonIcon","type","_Object$getOwnPropert","focus","needsSpace","test","nextValue","setValue","Object","getOwnPropertyDescriptor","getPrototypeOf","set","call","dispatchEvent","Event","bubbles","AlternateEmailIcon","iconSlot","EmojiIconButton","icon","SmilingFaceIcon","handleSelectEmoji","emoji","native","footer","CommentMetaLine","singleLine","ShareToChatRow","_objectSpread","WellhubFilePicker","open","maxSelectable","count","attachedFileNames","onAdd","files","addStoredFiles","file","fileName","onClose"],"mappings":"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"}

package/componentsV2/TextMiddleTruncated/TextMiddleTruncated.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextMiddleTruncated.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/TextMiddleTruncated/TextMiddleTruncated.tsx"],"names":[],"mappings":"AAYA,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;;;;;;;;;OAaG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AA6IF,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,4CAElE,CAAC"}
+{"version":3,"file":"TextMiddleTruncated.d.ts","sourceRoot":"","sources":["../../../src/componentsV2/TextMiddleTruncated/TextMiddleTruncated.tsx"],"names":[],"mappings":"AAYA,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;;;;;;;;;;OAaG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAmLF,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,4CAElE,CAAC"}

package/componentsV2/TextMiddleTruncated/TextMiddleTruncated.js

@@ -1,2 +1,2 @@
-import e from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/slicedToArray";import t from"classnames";import{useRef as n,useState as i,useLayoutEffect as o}from"react";import{debounce as c}from"lodash";import{Tooltip as l}from"../Tooltip/Tooltip.js";import{TextMiddleTruncatedTestIds as a}from"./TextMiddleTruncated.constants.js";import s from"./TextMiddleTruncated.scss.js";import{truncateInTheMiddle as u}from"../../utils/formatting.js";import{jsx as d,jsxs as f,Fragment as m}from"react/jsx-runtime";function p(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r&&(n=n.filter((function(r){return Object.getOwnPropertyDescriptor(e,r).enumerable}))),t.push.apply(t,n)}return t}var v=function(p){var v=p.children,h=void 0===v?"":v,b=p.testId,O=p.className,j=p.disableTooltip,g=p.maxLines,y=void 0===g?1:g,T=String(h),x=n(null),P=n(null),w=n(null),D=i(T),M=r(D,2),N=M[0],E=M[1],I=i(),L=r(I,2),S=L[0],W=L[1],A=y>1;return o((function(){var e=function(){if(x.current&&P.current){var e=x.current.clientWidth,r=P.current,t=r.scrollWidth,n=r.textContent,i=null!=n?n:"";if(e&&t&&i.length)if(A){var o=t/i.length,c=Math.max(1,Math.floor(e/o));if(i.length<=c*y)return W(void 0),void E(i);for(var l=y-1,a=l-1,s=c*(l-1)+(c-2),d=c,f=i.slice(0,s),m=i.slice(i.length-d),p=[],v=0;v<l;v+=1){var h=v*c,b=v===a,O=b?c-3:c,j=f.slice(h,h+O);j&&p.push(b?"".concat(j," ..."):j)}p.push(m),W(p),E(p.join("\n"))}else{var g;if(e===(null===(g=w.current)||void 0===g?void 0:g.clientWidth))return;W(void 0),E(u(i,e,t))}}};e();var r=c((function(){return requestAnimationFrame(e)}),200,{leading:!0}),t=new ResizeObserver(r),n=new MutationObserver(r);return x.current&&P.current&&(t.observe(x.current),t.observe(P.current),n.observe(P.current,{subtree:!0,characterData:!0})),function(){t.disconnect(),n.disconnect(),r.cancel()}}),[A,y,T]),d(l,{title:T,disabled:j||!(!!S||N!==T),children:f("div",{className:t(s.root,O,e({},s.multiLine,A)),ref:x,"data-testid":b,children:[d("div",{className:s.inner,ref:w,"data-testid":a.TruncatedTextTestId,children:S?d(m,{children:S.map((function(e,r){return d("div",{className:s.line,children:e},r)}))}):N}),d("div",{className:s.hiddenElement,ref:P,"data-testid":a.FullTextTestId,children:T})]})})},h=function(r){return d(v,function(r){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?p(Object(n),!0).forEach((function(t){e(r,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(n)):p(Object(n)).forEach((function(e){Object.defineProperty(r,e,Object.getOwnPropertyDescriptor(n,e))}))}return r}({},r),"".concat(r.children,"-").concat(r.maxLines))};export{h as TextMiddleTruncated};
+import e from"@babel/runtime/helpers/defineProperty";import t from"@babel/runtime/helpers/slicedToArray";import r from"classnames";import{useRef as n,useState as i,useLayoutEffect as o}from"react";import{debounce as a}from"lodash";import{Tooltip as l}from"../Tooltip/Tooltip.js";import{TextMiddleTruncatedTestIds as c}from"./TextMiddleTruncated.constants.js";import s from"./TextMiddleTruncated.scss.js";import{truncateInTheMiddle as u}from"../../utils/formatting.js";import{jsx as d,jsxs as m,Fragment as f}from"react/jsx-runtime";function p(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}var h=function(p){var h,b=p.children,v=void 0===b?"":b,g=p.testId,O=p.className,j=p.disableTooltip,y=p.maxLines,x=void 0===y?1:y,T=String(v),F=n(null),w=n(null),P=n(null),S=i(T),L=t(S,2),N=L[0],E=L[1],C=i(),D=t(C,2),M=D[0],A=D[1],W=x>1;return o((function(){var e=null,t=function(){if(F.current&&w.current){var e=F.current.clientWidth,t=w.current,r=t.scrollWidth,n=t.textContent,i=null!=n?n:"";if(i.length)if(W){if(!e||!r)return;var o=r/i.length,a=Math.max(1,Math.floor(e/o));if(i.length<=a*x)return A(void 0),void E(i);for(var l=x-1,c=l-1,s=a*(l-1)+(a-2),d=a,m=i.slice(0,s),f=i.slice(i.length-d),p=[],h=0;h<l;h+=1){var b=h*a,v=h===c,g=v?a-3:a,O=m.slice(b,b+g);O&&p.push(v?"".concat(O," ..."):O)}p.push(f),A(p),E(p.join("\n"))}else{var j=P.current;if(!j)return;var y=getComputedStyle(F.current),T=parseFloat(y.paddingLeft)+parseFloat(y.paddingRight),S=parseFloat(y.borderLeftWidth)+parseFloat(y.borderRightWidth),L=parseFloat(y.width)-("border-box"===y.boxSizing?T+S:0),N=parseFloat(getComputedStyle(w.current).width);if(!Number.isFinite(L)||!N)return;A(void 0),E(u(i,L,N,(function(e){return j.textContent=e,parseFloat(getComputedStyle(j).width)})))}}};t();var r=a((function(){null!==e&&cancelAnimationFrame(e),e=requestAnimationFrame(t)}),200,{leading:!0}),n=new ResizeObserver(r),i=new MutationObserver(r);return F.current&&w.current&&(n.observe(F.current),n.observe(w.current),i.observe(w.current,{subtree:!0,characterData:!0})),function(){n.disconnect(),i.disconnect(),r.cancel(),null!==e&&cancelAnimationFrame(e)}}),[W,x,T]),d(l,{title:T,disabled:j||!(!!M||N!==T),children:m("div",{className:r(s.root,O,(h={},e(h,s.multiLine,W),e(h,s.singleLine,!W),h)),ref:F,"data-testid":g,children:[d("div",{className:s.inner,"data-testid":c.TruncatedTextTestId,children:M?d(f,{children:M.map((function(e,t){return d("div",{className:s.line,children:e},t)}))}):N}),d("div",{className:r(s.hiddenElement,W?s.measurementElement:s.fullTextSingleLine),ref:w,"data-testid":c.FullTextTestId,children:T}),!W&&d("div",{className:r(s.hiddenElement,s.measurementElement),ref:P,"aria-hidden":"true"})]})})},b=function(t){return d(h,function(t){for(var r=1;r<arguments.length;r++){var n=null!=arguments[r]?arguments[r]:{};r%2?p(Object(n),!0).forEach((function(r){e(t,r,n[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):p(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}({},t),"".concat(t.children,"-").concat(t.maxLines))};export{b as TextMiddleTruncated};
 //# sourceMappingURL=TextMiddleTruncated.js.map

package/componentsV2/TextMiddleTruncated/TextMiddleTruncated.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextMiddleTruncated.js","sources":["../../../src/componentsV2/TextMiddleTruncated/TextMiddleTruncated.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useLayoutEffect, useRef, useState } from 'react';\nimport { debounce } from 'lodash';\n\nimport { Tooltip } from '../Tooltip';\n\nimport { TextMiddleTruncatedTestIds } from './TextMiddleTruncated.constants';\n\nimport styles from './TextMiddleTruncated.scss';\n\nimport { truncateInTheMiddle } from '~/utils/formatting';\n\nexport type TextMiddleTruncatedProps = {\n  /**\n   * Content\n   */\n  children?: string | number;\n  disableTooltip?: boolean;\n  /**\n   * Maximum number of lines to display.\n   * When maxLines > 1, the second-to-last line ends with \"...\" and the last line shows the end of text.\n   *\n   * e.g. with maxLines=4:\n   *\n   * line1\n   *\n   * line2\n   *\n   * line3...\n   *\n   * line4\n   */\n  maxLines?: number;\n\n  className?: string;\n  testId?: string;\n};\n\nconst TextMiddleTruncatedBase = ({\n  children = '',\n  testId,\n  className,\n  disableTooltip,\n  maxLines = 1,\n}: TextMiddleTruncatedProps) => {\n  const stringContent = String(children);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const hiddenEltRef = useRef<HTMLDivElement>(null);\n  const innerRef = useRef<HTMLDivElement>(null);\n  const [truncatedContent, setTruncatedContent] = useState(stringContent);\n  const [multiLineContent, setMultiLineContent] = useState<string[]>();\n\n  const isMultiLine = maxLines > 1;\n\n  useLayoutEffect(() => {\n    const runTruncation = () => {\n      if (!containerRef.current || !hiddenEltRef.current) return;\n\n      const { clientWidth } = containerRef.current;\n      const { scrollWidth: textWidth, textContent } = hiddenEltRef.current;\n      const text = textContent ?? '';\n\n      if (!clientWidth || !textWidth || !text.length) return;\n\n      if (isMultiLine) {\n        // Multi-line mode: \"...\" always on second-to-last line\n        // e.g., maxLines=4: line1, line2, line3..., line4\n        const charWidth = textWidth / text.length;\n        // Guard against very small clientWidth to prevent infinite loop or empty lines\n        const charsPerLine = Math.max(1, Math.floor(clientWidth / charWidth));\n\n        // Check if text fits in maxLines without truncation\n        if (text.length <= charsPerLine * maxLines) {\n          setMultiLineContent(undefined);\n          setTruncatedContent(text);\n          return;\n        }\n\n        // Lines 1 to (N-2): full width\n        // Line (N-1): ends with \" ...\" (second-to-last)\n        // Line N: shows end of text (last line)\n        const firstLinesCount = maxLines - 1; // lines before the last\n        const ellipsisLineIndex = firstLinesCount - 1; // second-to-last line (0-indexed)\n\n        // Characters for first part (all lines except last, with ellipsis on second-to-last)\n        const firstPartChars = charsPerLine * (firstLinesCount - 1) + (charsPerLine - 2);\n        // Characters for last line\n        const lastLineChars = charsPerLine;\n\n        const firstPart = text.slice(0, firstPartChars);\n        const lastLine = text.slice(text.length - lastLineChars);\n\n        // Split first part into lines\n        const lines: string[] = [];\n        for (let i = 0; i < firstLinesCount; i += 1) {\n          const start = i * charsPerLine;\n          const isEllipsisLine = i === ellipsisLineIndex;\n          const lineWidth = isEllipsisLine ? charsPerLine - 3 : charsPerLine;\n          const lineText = firstPart.slice(start, start + lineWidth);\n          if (lineText) {\n            lines.push(isEllipsisLine ? `${lineText} ...` : lineText);\n          }\n        }\n        lines.push(lastLine);\n\n        setMultiLineContent(lines);\n        setTruncatedContent(lines.join('\\n'));\n      } else {\n        // Single line mode: use original truncation\n        if (clientWidth === innerRef.current?.clientWidth) return;\n\n        setMultiLineContent(undefined);\n        setTruncatedContent(truncateInTheMiddle(text, clientWidth, textWidth));\n      }\n    };\n\n    runTruncation();\n\n    const debouncedTruncation = debounce(() => requestAnimationFrame(runTruncation), 200, {\n      leading: true,\n    });\n\n    const resizeObserver = new ResizeObserver(debouncedTruncation);\n    const mutationObserver = new MutationObserver(debouncedTruncation);\n\n    if (containerRef.current && hiddenEltRef.current) {\n      resizeObserver.observe(containerRef.current);\n      resizeObserver.observe(hiddenEltRef.current);\n      mutationObserver.observe(hiddenEltRef.current, { subtree: true, characterData: true });\n    }\n\n    return () => {\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n      debouncedTruncation.cancel();\n    };\n  }, [isMultiLine, maxLines, stringContent]);\n\n  const isTruncated = !!multiLineContent || truncatedContent !== stringContent;\n\n  return (\n    <Tooltip title={stringContent} disabled={disableTooltip || !isTruncated}>\n      <div\n        className={classNames(styles.root, className, { [styles.multiLine]: isMultiLine })}\n        ref={containerRef}\n        data-testid={testId}\n      >\n        <div\n          className={styles.inner}\n          ref={innerRef}\n          data-testid={TextMiddleTruncatedTestIds.TruncatedTextTestId}\n        >\n          {multiLineContent ? (\n            <>\n              {multiLineContent.map((line, index) => (\n                <div key={index} className={styles.line}>\n                  {line}\n                </div>\n              ))}\n            </>\n          ) : (\n            truncatedContent\n          )}\n        </div>\n        <div\n          className={styles.hiddenElement}\n          ref={hiddenEltRef}\n          data-testid={TextMiddleTruncatedTestIds.FullTextTestId}\n        >\n          {stringContent}\n        </div>\n      </div>\n    </Tooltip>\n  );\n};\n\nexport const TextMiddleTruncated = (props: TextMiddleTruncatedProps) => (\n  <TextMiddleTruncatedBase key={`${props.children}-${props.maxLines}`} {...props} />\n);\n"],"names":["TextMiddleTruncatedBase","_ref","_ref$children","children","testId","className","disableTooltip","_ref$maxLines","maxLines","stringContent","String","containerRef","useRef","hiddenEltRef","innerRef","useState","_useState2","_slicedToArray","_useState","truncatedContent","setTruncatedContent","_useState3","_useState4","multiLineContent","setMultiLineContent","isMultiLine","useLayoutEffect","runTruncation","current","clientWidth","textWidth","scrollWidth","textContent","text","length","charWidth","charsPerLine","Math","max","floor","undefined","firstLinesCount","ellipsisLineIndex","firstPartChars","lastLineChars","firstPart","slice","lastLine","lines","i","start","isEllipsisLine","lineWidth","lineText","push","join","_innerRef$current","truncateInTheMiddle","debouncedTruncation","debounce","requestAnimationFrame","leading","resizeObserver","ResizeObserver","mutationObserver","MutationObserver","observe","subtree","characterData","disconnect","cancel","_jsx","Tooltip","title","disabled","_jsxs","classNames","styles","root","_defineProperty","multiLine","ref","inner","TextMiddleTruncatedTestIds","TruncatedTextTestId","_Fragment","map","line","index","hiddenElement","FullTextTestId","TextMiddleTruncated","props"],"mappings":"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"}
+{"version":3,"file":"TextMiddleTruncated.js","sources":["../../../src/componentsV2/TextMiddleTruncated/TextMiddleTruncated.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useLayoutEffect, useRef, useState } from 'react';\nimport { debounce } from 'lodash';\n\nimport { Tooltip } from '../Tooltip';\n\nimport { TextMiddleTruncatedTestIds } from './TextMiddleTruncated.constants';\n\nimport styles from './TextMiddleTruncated.scss';\n\nimport { truncateInTheMiddle } from '~/utils/formatting';\n\nexport type TextMiddleTruncatedProps = {\n  /**\n   * Content\n   */\n  children?: string | number;\n  disableTooltip?: boolean;\n  /**\n   * Maximum number of lines to display.\n   * When maxLines > 1, the second-to-last line ends with \"...\" and the last line shows the end of text.\n   *\n   * e.g. with maxLines=4:\n   *\n   * line1\n   *\n   * line2\n   *\n   * line3...\n   *\n   * line4\n   */\n  maxLines?: number;\n\n  className?: string;\n  testId?: string;\n};\n\nconst TextMiddleTruncatedBase = ({\n  children = '',\n  testId,\n  className,\n  disableTooltip,\n  maxLines = 1,\n}: TextMiddleTruncatedProps) => {\n  const stringContent = String(children);\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const hiddenEltRef = useRef<HTMLDivElement>(null);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const [truncatedContent, setTruncatedContent] = useState(stringContent);\n  const [multiLineContent, setMultiLineContent] = useState<string[]>();\n\n  const isMultiLine = maxLines > 1;\n\n  useLayoutEffect(() => {\n    let animationFrameId: number | null = null;\n\n    const runTruncation = () => {\n      if (!containerRef.current || !hiddenEltRef.current) return;\n\n      const { clientWidth } = containerRef.current;\n      const { scrollWidth: textWidth, textContent } = hiddenEltRef.current;\n      const text = textContent ?? '';\n\n      if (!text.length) return;\n\n      if (isMultiLine) {\n        if (!clientWidth || !textWidth) return;\n\n        // Multi-line mode: \"...\" always on second-to-last line\n        // e.g., maxLines=4: line1, line2, line3..., line4\n        const charWidth = textWidth / text.length;\n        // Guard against very small clientWidth to prevent infinite loop or empty lines\n        const charsPerLine = Math.max(1, Math.floor(clientWidth / charWidth));\n\n        // Check if text fits in maxLines without truncation\n        if (text.length <= charsPerLine * maxLines) {\n          setMultiLineContent(undefined);\n          setTruncatedContent(text);\n          return;\n        }\n\n        // Lines 1 to (N-2): full width\n        // Line (N-1): ends with \" ...\" (second-to-last)\n        // Line N: shows end of text (last line)\n        const firstLinesCount = maxLines - 1; // lines before the last\n        const ellipsisLineIndex = firstLinesCount - 1; // second-to-last line (0-indexed)\n\n        // Characters for first part (all lines except last, with ellipsis on second-to-last)\n        const firstPartChars = charsPerLine * (firstLinesCount - 1) + (charsPerLine - 2);\n        // Characters for last line\n        const lastLineChars = charsPerLine;\n\n        const firstPart = text.slice(0, firstPartChars);\n        const lastLine = text.slice(text.length - lastLineChars);\n\n        // Split first part into lines\n        const lines: string[] = [];\n        for (let i = 0; i < firstLinesCount; i += 1) {\n          const start = i * charsPerLine;\n          const isEllipsisLine = i === ellipsisLineIndex;\n          const lineWidth = isEllipsisLine ? charsPerLine - 3 : charsPerLine;\n          const lineText = firstPart.slice(start, start + lineWidth);\n          if (lineText) {\n            lines.push(isEllipsisLine ? `${lineText} ...` : lineText);\n          }\n        }\n        lines.push(lastLine);\n\n        setMultiLineContent(lines);\n        setTruncatedContent(lines.join('\\n'));\n      } else {\n        const measurementElement = measurementRef.current;\n\n        if (!measurementElement) return;\n\n        // Resolved CSS widths retain fractions and use layout pixels even under transforms.\n        const containerStyle = getComputedStyle(containerRef.current);\n        const horizontalPadding =\n          parseFloat(containerStyle.paddingLeft) + parseFloat(containerStyle.paddingRight);\n        const horizontalBorder =\n          parseFloat(containerStyle.borderLeftWidth) + parseFloat(containerStyle.borderRightWidth);\n        const availableWidth =\n          parseFloat(containerStyle.width) -\n          (containerStyle.boxSizing === 'border-box' ? horizontalPadding + horizontalBorder : 0);\n        const fullTextWidth = parseFloat(getComputedStyle(hiddenEltRef.current).width);\n        if (!Number.isFinite(availableWidth) || !fullTextWidth) return;\n\n        const measureWidth = (candidate: string) => {\n          measurementElement.textContent = candidate;\n          return parseFloat(getComputedStyle(measurementElement).width);\n        };\n\n        setMultiLineContent(undefined);\n        setTruncatedContent(truncateInTheMiddle(text, availableWidth, fullTextWidth, measureWidth));\n      }\n    };\n\n    runTruncation();\n\n    const debouncedTruncation = debounce(\n      () => {\n        if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);\n\n        animationFrameId = requestAnimationFrame(runTruncation);\n      },\n      200,\n      { leading: true }\n    );\n\n    const resizeObserver = new ResizeObserver(debouncedTruncation);\n    const mutationObserver = new MutationObserver(debouncedTruncation);\n\n    if (containerRef.current && hiddenEltRef.current) {\n      resizeObserver.observe(containerRef.current);\n      resizeObserver.observe(hiddenEltRef.current);\n      mutationObserver.observe(hiddenEltRef.current, { subtree: true, characterData: true });\n    }\n\n    return () => {\n      resizeObserver.disconnect();\n      mutationObserver.disconnect();\n      debouncedTruncation.cancel();\n      if (animationFrameId !== null) cancelAnimationFrame(animationFrameId);\n    };\n  }, [isMultiLine, maxLines, stringContent]);\n\n  const isTruncated = !!multiLineContent || truncatedContent !== stringContent;\n\n  return (\n    <Tooltip title={stringContent} disabled={disableTooltip || !isTruncated}>\n      <div\n        className={classNames(styles.root, className, {\n          [styles.multiLine]: isMultiLine,\n          [styles.singleLine]: !isMultiLine,\n        })}\n        ref={containerRef}\n        data-testid={testId}\n      >\n        <div className={styles.inner} data-testid={TextMiddleTruncatedTestIds.TruncatedTextTestId}>\n          {multiLineContent ? (\n            <>\n              {multiLineContent.map((line, index) => (\n                <div key={index} className={styles.line}>\n                  {line}\n                </div>\n              ))}\n            </>\n          ) : (\n            truncatedContent\n          )}\n        </div>\n        <div\n          className={classNames(\n            styles.hiddenElement,\n            isMultiLine ? styles.measurementElement : styles.fullTextSingleLine\n          )}\n          ref={hiddenEltRef}\n          data-testid={TextMiddleTruncatedTestIds.FullTextTestId}\n        >\n          {stringContent}\n        </div>\n        {!isMultiLine && (\n          <div\n            className={classNames(styles.hiddenElement, styles.measurementElement)}\n            ref={measurementRef}\n            aria-hidden=\"true\"\n          />\n        )}\n      </div>\n    </Tooltip>\n  );\n};\n\nexport const TextMiddleTruncated = (props: TextMiddleTruncatedProps) => (\n  <TextMiddleTruncatedBase key={`${props.children}-${props.maxLines}`} {...props} />\n);\n"],"names":["TextMiddleTruncatedBase","_ref","_classNames","_ref$children","children","testId","className","disableTooltip","_ref$maxLines","maxLines","stringContent","String","containerRef","useRef","hiddenEltRef","measurementRef","useState","_useState2","_slicedToArray","_useState","truncatedContent","setTruncatedContent","_useState3","_useState4","multiLineContent","setMultiLineContent","isMultiLine","useLayoutEffect","animationFrameId","runTruncation","current","clientWidth","textWidth","scrollWidth","textContent","text","length","charWidth","charsPerLine","Math","max","floor","undefined","firstLinesCount","ellipsisLineIndex","firstPartChars","lastLineChars","firstPart","slice","lastLine","lines","i","start","isEllipsisLine","lineWidth","lineText","push","join","measurementElement","containerStyle","getComputedStyle","horizontalPadding","parseFloat","paddingLeft","paddingRight","horizontalBorder","borderLeftWidth","borderRightWidth","availableWidth","width","boxSizing","fullTextWidth","Number","isFinite","truncateInTheMiddle","candidate","debouncedTruncation","debounce","cancelAnimationFrame","requestAnimationFrame","leading","resizeObserver","ResizeObserver","mutationObserver","MutationObserver","observe","subtree","characterData","disconnect","cancel","_jsx","Tooltip","title","disabled","_jsxs","classNames","styles","root","multiLine","singleLine","ref","inner","TextMiddleTruncatedTestIds","TruncatedTextTestId","_Fragment","map","line","index","hiddenElement","fullTextSingleLine","FullTextTestId","TextMiddleTruncated","props"],"mappings":"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"}