box-ui-elements 23.4.0-beta.7 → 23.4.0-beta.9

package/es/elements/content-sidebar/BoxAISidebar.js

@@ -1,4 +1,4 @@
-const _excluded = ["cache", "contentName", "elementId", "fileExtension", "fileID", "getSuggestedQuestions", "isIntelligentQueryMode", "isFeedbackEnabled", "isFeedbackFormEnabled", "isStopResponseEnabled", "items", "itemSize", "localizedQuestions", "onFeedbackFormSubmit", "onUserInteraction", "recordAction", "setCacheValue", "shouldFeedbackFormIncludeFeedbackText", "shouldPreinitSession", "setHasQuestions"];
+const _excluded = ["cache", "contentName", "elementId", "fileExtension", "fileID", "getSuggestedQuestions", "isIntelligentQueryMode", "isFeedbackEnabled", "isFeedbackFormEnabled", "isStopResponseEnabled", "items", "itemSize", "localizedQuestions", "onFeedbackFormSubmit", "onUserInteraction", "recordAction", "renderRemoteModule", "setCacheValue", "shouldFeedbackFormIncludeFeedbackText", "shouldPreinitSession", "setHasQuestions"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
@@ -31,6 +31,7 @@ const BoxAISidebar = props => {
       onFeedbackFormSubmit,
       onUserInteraction,
       recordAction,
+      renderRemoteModule,
       setCacheValue,
       shouldFeedbackFormIncludeFeedbackText,
       shouldPreinitSession = true,
@@ -65,6 +66,9 @@ const BoxAISidebar = props => {
       setHasQuestions(questions.length > 0);
     }
   }, [questions.length, setHasQuestions]);
+  if (renderRemoteModule) {
+    return renderRemoteModule(elementId);
+  }
   let questionsWithoutInProgress = questions;
   if (questions.length > 0 && !questions[questions.length - 1].isCompleted) {
     // pass only fully completed questions to not show loading indicator of question where we canceled API request

package/es/elements/content-sidebar/BoxAISidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"BoxAISidebar.js","names":["React","useIntl","AgentsProvider","BoxAISidebarContent","BoxAISidebarContext","SPREADSHEET_FILE_EXTENSIONS","messages","BoxAISidebar","props","cache","contentName","elementId","fileExtension","fileID","getSuggestedQuestions","isIntelligentQueryMode","isFeedbackEnabled","isFeedbackFormEnabled","isStopResponseEnabled","items","itemSize","localizedQuestions","onFeedbackFormSubmit","onUserInteraction","recordAction","setCacheValue","shouldFeedbackFormIncludeFeedbackText","shouldPreinitSession","setHasQuestions","rest","_objectWithoutProperties","_excluded","questions","formatMessage","contextValue","useMemo","useEffect","length","questionsWithoutInProgress","isCompleted","slice","isSpreadsheet","includes","spreadsheetNotice","welcomeMessageSpreadsheetNotice","welcomeMessageIntelligentQueryNotice","handleSuggestedQuestionsFetched","fetchedSuggestedQuestions","suggestedQuestions","createElement","value","agents","Provider","_extends","cachedSuggestedQuestions","isOpen","itemID","itemIDs","onSuggestedQuestionsFetched","restoredQuestions","restoredSession","encodedSession","restoredShouldShowLandingPage","shouldShowLandingPage","warningNotice","warningNoticeAriaLabel","welcomeMessageSpreadsheetNoticeAriaLabel"],"sources":["../../../src/elements/content-sidebar/BoxAISidebar.tsx"],"sourcesContent":["/**\n * @file Box AI Sidebar Container\n * @author Box\n */\nimport * as React from 'react';\nimport { useIntl } from 'react-intl';\nimport { type FeedbackFormData, type ItemType, SuggestedQuestionType } from '@box/box-ai-content-answers';\nimport { AgentsProvider, RecordActionType } from '@box/box-ai-agent-selector';\nimport BoxAISidebarContent from './BoxAISidebarContent';\nimport { BoxAISidebarContext } from './context/BoxAISidebarContext';\nimport { SPREADSHEET_FILE_EXTENSIONS } from '../common/content-answers/constants';\nimport type { BoxAISidebarCache, BoxAISidebarCacheSetter } from './types/BoxAISidebarTypes';\n\nimport messages from '../common/content-answers/messages';\n\nexport interface BoxAISidebarProps {\n    contentName: string;\n    cache: BoxAISidebarCache;\n    createSessionRequest: (payload: Record<string, unknown>, itemID: string) => Promise<unknown>;\n    elementId: string;\n    fetchTimeout: Record<string, unknown>;\n    fileExtension: string;\n    fileID: string;\n    getAgentConfig: (payload: Record<string, unknown>) => Promise<unknown>;\n    getAIStudioAgents: () => Promise<unknown>;\n    getAnswer: (\n        payload: Record<string, unknown>,\n        itemID?: string,\n        itemIDs?: Array<string>,\n        state?: Record<string, unknown>,\n    ) => Promise<unknown>;\n    getAnswerStreaming: (\n        payload: Record<string, unknown>,\n        itemID?: string,\n        itemIDs?: Array<string>,\n        abortController?: AbortController,\n        state?: Record<string, unknown>,\n    ) => Promise<unknown>;\n    getSuggestedQuestions: (itemID: string) => Promise<unknown> | null;\n    hostAppName: string;\n    isAgentSelectorEnabled: boolean;\n    isAIStudioAgentSelectorEnabled: boolean;\n    isCitationsEnabled: boolean;\n    isDebugModeEnabled: boolean;\n    isFeedbackEnabled: boolean;\n    isFeedbackFormEnabled: boolean;\n    isIntelligentQueryMode: boolean;\n    isMarkdownEnabled: boolean;\n    isResetChatEnabled: boolean;\n    isStopResponseEnabled?: boolean;\n    isStreamingEnabled: boolean;\n    items: Array<ItemType>;\n    itemSize?: string;\n    localizedQuestions: Array<{ id: string; label: string; prompt: string }>;\n    onFeedbackFormSubmit?: (data: FeedbackFormData, onSuccess: () => void) => void;\n    onUserInteraction?: () => void;\n    recordAction: (params: RecordActionType) => void;\n    setCacheValue: BoxAISidebarCacheSetter;\n    shouldFeedbackFormIncludeFeedbackText?: boolean;\n    shouldPreinitSession?: boolean;\n    setHasQuestions: (hasQuestions: boolean) => void;\n}\n\nconst BoxAISidebar = (props: BoxAISidebarProps) => {\n    const {\n        cache,\n        contentName,\n        elementId,\n        fileExtension,\n        fileID,\n        getSuggestedQuestions,\n        isIntelligentQueryMode,\n        isFeedbackEnabled,\n        isFeedbackFormEnabled,\n        isStopResponseEnabled,\n        items,\n        itemSize,\n        localizedQuestions,\n        onFeedbackFormSubmit,\n        onUserInteraction,\n        recordAction,\n        setCacheValue,\n        shouldFeedbackFormIncludeFeedbackText,\n        shouldPreinitSession = true,\n        setHasQuestions,\n        ...rest\n    } = props;\n    const { questions } = cache;\n    const { formatMessage } = useIntl();\n    const contextValue = React.useMemo(\n        () => ({\n            cache,\n            contentName,\n            elementId,\n            fileExtension,\n            isFeedbackEnabled,\n            isFeedbackFormEnabled,\n            isStopResponseEnabled,\n            items,\n            itemSize,\n            onFeedbackFormSubmit,\n            onUserInteraction,\n            recordAction,\n            setCacheValue,\n            shouldFeedbackFormIncludeFeedbackText,\n            shouldPreinitSession,\n        }),\n        [\n            cache,\n            contentName,\n            elementId,\n            fileExtension,\n            isFeedbackEnabled,\n            isFeedbackFormEnabled,\n            isStopResponseEnabled,\n            items,\n            itemSize,\n            onFeedbackFormSubmit,\n            onUserInteraction,\n            recordAction,\n            setCacheValue,\n            shouldFeedbackFormIncludeFeedbackText,\n            shouldPreinitSession,\n        ],\n    );\n\n    React.useEffect(() => {\n        if (setHasQuestions) {\n            setHasQuestions(questions.length > 0);\n        }\n    }, [questions.length, setHasQuestions]);\n\n    let questionsWithoutInProgress = questions;\n    if (questions.length > 0 && !questions[questions.length - 1].isCompleted) {\n        // pass only fully completed questions to not show loading indicator of question where we canceled API request\n        questionsWithoutInProgress = questionsWithoutInProgress.slice(0, -1);\n    }\n\n    const isSpreadsheet = SPREADSHEET_FILE_EXTENSIONS.includes(fileExtension);\n\n    let spreadsheetNotice = isSpreadsheet ? formatMessage(messages.welcomeMessageSpreadsheetNotice) : '';\n    if (isIntelligentQueryMode) {\n        spreadsheetNotice = formatMessage(messages.welcomeMessageIntelligentQueryNotice);\n    } else if (isSpreadsheet) {\n        spreadsheetNotice = formatMessage(messages.welcomeMessageSpreadsheetNotice);\n    }\n\n    const handleSuggestedQuestionsFetched = (fetchedSuggestedQuestions: SuggestedQuestionType[]) => {\n        setCacheValue('suggestedQuestions', fetchedSuggestedQuestions);\n    };\n\n    const suggestedQuestions = getSuggestedQuestions === null ? localizedQuestions : [];\n\n    return (\n        // BoxAISidebarContent is using withApiWrapper that is not passing all provided props,\n        // that's why we need to use provider to pass other props\n        <AgentsProvider value={cache.agents}>\n            <BoxAISidebarContext.Provider value={contextValue}>\n                <BoxAISidebarContent\n                    cachedSuggestedQuestions={cache.suggestedQuestions}\n                    getSuggestedQuestions={getSuggestedQuestions}\n                    isOpen\n                    isStopResponseEnabled={isStopResponseEnabled}\n                    itemID={fileID}\n                    itemIDs={[fileID]}\n                    onSuggestedQuestionsFetched={handleSuggestedQuestionsFetched}\n                    restoredQuestions={questionsWithoutInProgress}\n                    restoredSession={cache.encodedSession}\n                    restoredShouldShowLandingPage={cache.shouldShowLandingPage}\n                    shouldPreinitSession={shouldPreinitSession}\n                    suggestedQuestions={\n                        cache.suggestedQuestions.length > 0 ? cache.suggestedQuestions : suggestedQuestions\n                    }\n                    warningNotice={spreadsheetNotice}\n                    warningNoticeAriaLabel={formatMessage(messages.welcomeMessageSpreadsheetNoticeAriaLabel)}\n                    {...rest}\n                />\n            </BoxAISidebarContext.Provider>\n        </AgentsProvider>\n    );\n};\n\nexport default BoxAISidebar;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"BoxAISidebar.js","names":["React","useIntl","AgentsProvider","BoxAISidebarContent","BoxAISidebarContext","SPREADSHEET_FILE_EXTENSIONS","messages","BoxAISidebar","props","cache","contentName","elementId","fileExtension","fileID","getSuggestedQuestions","isIntelligentQueryMode","isFeedbackEnabled","isFeedbackFormEnabled","isStopResponseEnabled","items","itemSize","localizedQuestions","onFeedbackFormSubmit","onUserInteraction","recordAction","renderRemoteModule","setCacheValue","shouldFeedbackFormIncludeFeedbackText","shouldPreinitSession","setHasQuestions","rest","_objectWithoutProperties","_excluded","questions","formatMessage","contextValue","useMemo","useEffect","length","questionsWithoutInProgress","isCompleted","slice","isSpreadsheet","includes","spreadsheetNotice","welcomeMessageSpreadsheetNotice","welcomeMessageIntelligentQueryNotice","handleSuggestedQuestionsFetched","fetchedSuggestedQuestions","suggestedQuestions","createElement","value","agents","Provider","_extends","cachedSuggestedQuestions","isOpen","itemID","itemIDs","onSuggestedQuestionsFetched","restoredQuestions","restoredSession","encodedSession","restoredShouldShowLandingPage","shouldShowLandingPage","warningNotice","warningNoticeAriaLabel","welcomeMessageSpreadsheetNoticeAriaLabel"],"sources":["../../../src/elements/content-sidebar/BoxAISidebar.tsx"],"sourcesContent":["/**\n * @file Box AI Sidebar Container\n * @author Box\n */\nimport * as React from 'react';\nimport { useIntl } from 'react-intl';\nimport { type FeedbackFormData, type ItemType, SuggestedQuestionType } from '@box/box-ai-content-answers';\nimport { AgentsProvider, RecordActionType } from '@box/box-ai-agent-selector';\nimport BoxAISidebarContent from './BoxAISidebarContent';\nimport { BoxAISidebarContext } from './context/BoxAISidebarContext';\nimport { SPREADSHEET_FILE_EXTENSIONS } from '../common/content-answers/constants';\nimport type { BoxAISidebarCache, BoxAISidebarCacheSetter } from './types/BoxAISidebarTypes';\nimport messages from '../common/content-answers/messages';\n\nexport interface BoxAISidebarProps {\n    contentName: string;\n    cache: BoxAISidebarCache;\n    createSessionRequest: (payload: Record<string, unknown>, itemID: string) => Promise<unknown>;\n    elementId: string;\n    fetchTimeout: Record<string, unknown>;\n    fileExtension: string;\n    fileID: string;\n    getAgentConfig: (payload: Record<string, unknown>) => Promise<unknown>;\n    getAIStudioAgents: () => Promise<unknown>;\n    getAnswer: (\n        payload: Record<string, unknown>,\n        itemID?: string,\n        itemIDs?: Array<string>,\n        state?: Record<string, unknown>,\n    ) => Promise<unknown>;\n    getAnswerStreaming: (\n        payload: Record<string, unknown>,\n        itemID?: string,\n        itemIDs?: Array<string>,\n        abortController?: AbortController,\n        state?: Record<string, unknown>,\n    ) => Promise<unknown>;\n    getSuggestedQuestions: (itemID: string) => Promise<unknown> | null;\n    hostAppName: string;\n    isAgentSelectorEnabled: boolean;\n    isAIStudioAgentSelectorEnabled: boolean;\n    isCitationsEnabled: boolean;\n    isDebugModeEnabled: boolean;\n    isFeedbackEnabled: boolean;\n    isFeedbackFormEnabled: boolean;\n    isIntelligentQueryMode: boolean;\n    isMarkdownEnabled: boolean;\n    isResetChatEnabled: boolean;\n    isStopResponseEnabled?: boolean;\n    isStreamingEnabled: boolean;\n    items: Array<ItemType>;\n    itemSize?: string;\n    localizedQuestions: Array<{ id: string; label: string; prompt: string }>;\n    onFeedbackFormSubmit?: (data: FeedbackFormData, onSuccess: () => void) => void;\n    onUserInteraction?: () => void;\n    recordAction: (params: RecordActionType) => void;\n    setCacheValue: BoxAISidebarCacheSetter;\n    shouldFeedbackFormIncludeFeedbackText?: boolean;\n    renderRemoteModule?: (elementId: string) => React.ReactNode;\n    shouldPreinitSession?: boolean;\n    setHasQuestions: (hasQuestions: boolean) => void;\n}\n\nconst BoxAISidebar = (props: BoxAISidebarProps) => {\n    const {\n        cache,\n        contentName,\n        elementId,\n        fileExtension,\n        fileID,\n        getSuggestedQuestions,\n        isIntelligentQueryMode,\n        isFeedbackEnabled,\n        isFeedbackFormEnabled,\n        isStopResponseEnabled,\n        items,\n        itemSize,\n        localizedQuestions,\n        onFeedbackFormSubmit,\n        onUserInteraction,\n        recordAction,\n        renderRemoteModule,\n        setCacheValue,\n        shouldFeedbackFormIncludeFeedbackText,\n        shouldPreinitSession = true,\n        setHasQuestions,\n        ...rest\n    } = props;\n    const { questions } = cache;\n    const { formatMessage } = useIntl();\n    const contextValue = React.useMemo(\n        () => ({\n            cache,\n            contentName,\n            elementId,\n            fileExtension,\n            isFeedbackEnabled,\n            isFeedbackFormEnabled,\n            isStopResponseEnabled,\n            items,\n            itemSize,\n            onFeedbackFormSubmit,\n            onUserInteraction,\n            recordAction,\n            setCacheValue,\n            shouldFeedbackFormIncludeFeedbackText,\n            shouldPreinitSession,\n        }),\n        [\n            cache,\n            contentName,\n            elementId,\n            fileExtension,\n            isFeedbackEnabled,\n            isFeedbackFormEnabled,\n            isStopResponseEnabled,\n            items,\n            itemSize,\n            onFeedbackFormSubmit,\n            onUserInteraction,\n            recordAction,\n            setCacheValue,\n            shouldFeedbackFormIncludeFeedbackText,\n            shouldPreinitSession,\n        ],\n    );\n\n    React.useEffect(() => {\n        if (setHasQuestions) {\n            setHasQuestions(questions.length > 0);\n        }\n    }, [questions.length, setHasQuestions]);\n\n    if (renderRemoteModule) {\n        return renderRemoteModule(elementId);\n    }\n\n    let questionsWithoutInProgress = questions;\n    if (questions.length > 0 && !questions[questions.length - 1].isCompleted) {\n        // pass only fully completed questions to not show loading indicator of question where we canceled API request\n        questionsWithoutInProgress = questionsWithoutInProgress.slice(0, -1);\n    }\n\n    const isSpreadsheet = SPREADSHEET_FILE_EXTENSIONS.includes(fileExtension);\n\n    let spreadsheetNotice = isSpreadsheet ? formatMessage(messages.welcomeMessageSpreadsheetNotice) : '';\n    if (isIntelligentQueryMode) {\n        spreadsheetNotice = formatMessage(messages.welcomeMessageIntelligentQueryNotice);\n    } else if (isSpreadsheet) {\n        spreadsheetNotice = formatMessage(messages.welcomeMessageSpreadsheetNotice);\n    }\n\n    const handleSuggestedQuestionsFetched = (fetchedSuggestedQuestions: SuggestedQuestionType[]) => {\n        setCacheValue('suggestedQuestions', fetchedSuggestedQuestions);\n    };\n\n    const suggestedQuestions = getSuggestedQuestions === null ? localizedQuestions : [];\n\n    return (\n        // BoxAISidebarContent is using withApiWrapper that is not passing all provided props,\n        // that's why we need to use provider to pass other props\n        <AgentsProvider value={cache.agents}>\n            <BoxAISidebarContext.Provider value={contextValue}>\n                <BoxAISidebarContent\n                    cachedSuggestedQuestions={cache.suggestedQuestions}\n                    getSuggestedQuestions={getSuggestedQuestions}\n                    isOpen\n                    isStopResponseEnabled={isStopResponseEnabled}\n                    itemID={fileID}\n                    itemIDs={[fileID]}\n                    onSuggestedQuestionsFetched={handleSuggestedQuestionsFetched}\n                    restoredQuestions={questionsWithoutInProgress}\n                    restoredSession={cache.encodedSession}\n                    restoredShouldShowLandingPage={cache.shouldShowLandingPage}\n                    shouldPreinitSession={shouldPreinitSession}\n                    suggestedQuestions={\n                        cache.suggestedQuestions.length > 0 ? cache.suggestedQuestions : suggestedQuestions\n                    }\n                    warningNotice={spreadsheetNotice}\n                    warningNoticeAriaLabel={formatMessage(messages.welcomeMessageSpreadsheetNoticeAriaLabel)}\n                    {...rest}\n                />\n            </BoxAISidebarContext.Provider>\n        </AgentsProvider>\n    );\n};\n\nexport default BoxAISidebar;\n"],"mappings":"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","ignoreList":[]}

package/es/src/elements/content-sidebar/BoxAISidebar.d.ts

@@ -43,8 +43,9 @@ export interface BoxAISidebarProps {
     recordAction: (params: RecordActionType) => void;
     setCacheValue: BoxAISidebarCacheSetter;
     shouldFeedbackFormIncludeFeedbackText?: boolean;
+    renderRemoteModule?: (elementId: string) => React.ReactNode;
     shouldPreinitSession?: boolean;
     setHasQuestions: (hasQuestions: boolean) => void;
 }
-declare const BoxAISidebar: (props: BoxAISidebarProps) => React.JSX.Element;
+declare const BoxAISidebar: (props: BoxAISidebarProps) => string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element;
 export default BoxAISidebar;

package/i18n/ja-JP.js

@@ -605,7 +605,7 @@ export default {
   "boxui.itemDetails.url": "URL",
   "boxui.itemDetails.urlPlaceholder": "有効なURLを入力",
   "boxui.media.menuButtonArialLabel": "オプション",
-  "boxui.metadataInstanceEditor.aiAutofillDescription": "Use Box AI to automatically extract metadata values.",
+  "boxui.metadataInstanceEditor.aiAutofillDescription": "Box AIを使用して自動的にメタデータ値を抽出します。",
   "boxui.metadataInstanceEditor.aiAutofillLearnMore": "詳細を表示",
   "boxui.metadataInstanceEditor.allAttributesAreHidden": "このテンプレートのすべての属性が非表示になっています。",
   "boxui.metadataInstanceEditor.applyCascadePolicyText": "このフォルダとそのサブフォルダのすべての新規および既存の項目に、テンプレートとその値を適用します。",
@@ -627,7 +627,7 @@ export default {
   "boxui.metadataInstanceEditor.customValue": "値",
   "boxui.metadataInstanceEditor.customValuePlaceholder": "例: 42",
   "boxui.metadataInstanceEditor.editTooltip": "メタデータを編集",
-  "boxui.metadataInstanceEditor.enableAIAutofill": "Box AI Autofill",
+  "boxui.metadataInstanceEditor.enableAIAutofill": "Box AIの自動入力",
   "boxui.metadataInstanceEditor.enableCascadePolicy": "カスケードポリシーを有効にする",
   "boxui.metadataInstanceEditor.fileMetadataRemoveCustomTemplateConfirm": "このカスタムメタデータおよびそのすべての値をこのファイルから削除してもよろしいですか?",
   "boxui.metadataInstanceEditor.fileMetadataRemoveTemplateConfirm": "\"{metadataName}\"およびそのすべての値をこのファイルから削除してもよろしいですか?",
@@ -979,8 +979,8 @@ export default {
   "boxui.unifiedShare.previewerUploaderLevelDescription": "アップロードとプレビューが可能です",
   "boxui.unifiedShare.previewerUploaderLevelText": "プレビューアー/アップローダー",
   "boxui.unifiedShare.recommendedSharingTooltipCalloutText": "お客様の使用状況から、{fullName}さんにはこのファイルもお勧めです。",
-  "boxui.unifiedShare.removeCollaboratorConfirmationDescription": "Are you sure you want to remove {name} as a collaborator?",
-  "boxui.unifiedShare.removeCollaboratorConfirmationTitle": "Remove Collaborator",
+  "boxui.unifiedShare.removeCollaboratorConfirmationDescription": "コラボレータから{name}を削除してもよろしいですか?",
+  "boxui.unifiedShare.removeCollaboratorConfirmationTitle": "コラボレータの削除",
   "boxui.unifiedShare.removeLinkConfirmationDescription": "これにより、共有リンクが完全に削除されます。この項目が他のサイトに埋め込まれている場合は、そのサイトでもアクセスできなくなります。カスタムプロパティ、設定、有効期限も削除されます。続行しますか?",
   "boxui.unifiedShare.removeLinkConfirmationTitle": "共有リンクを削除",
   "boxui.unifiedShare.removeLinkTooltip": "リンクを削除する権限がありません。",

package/i18n/ja-JP.properties

@@ -1211,7 +1211,7 @@ boxui.itemDetails.urlPlaceholder = 有効なURLを入力
 # Label for comment options menu
 boxui.media.menuButtonArialLabel = オプション
 # Description for AI autofill toggle switch
-boxui.metadataInstanceEditor.aiAutofillDescription = Use Box AI to automatically extract metadata values.
+boxui.metadataInstanceEditor.aiAutofillDescription = Box AIを使用して自動的にメタデータ値を抽出します。
 # Learn more link for AI autofill
 boxui.metadataInstanceEditor.aiAutofillLearnMore = 詳細を表示
 # Informational text below collapsible header indicating that all fields for this template are hidden
@@ -1255,7 +1255,7 @@ boxui.metadataInstanceEditor.customValuePlaceholder = 例: 42
 # Text that shows in a tooltip above the edit pencil button.
 boxui.metadataInstanceEditor.editTooltip = メタデータを編集
 # Label for enable AI autofill toggle switch
-boxui.metadataInstanceEditor.enableAIAutofill = Box AI Autofill
+boxui.metadataInstanceEditor.enableAIAutofill = Box AIの自動入力
 # Label for enable cascade policy toggle switch
 boxui.metadataInstanceEditor.enableCascadePolicy = カスケードポリシーを有効にする
 # Message for users who may attempt to remove a custom metadata instance for a file. Also non-recoverable
@@ -1959,9 +1959,9 @@ boxui.unifiedShare.previewerUploaderLevelText = プレビューアー/アップ
 # Tooltip description to explain recommendation for sharing tooltip
 boxui.unifiedShare.recommendedSharingTooltipCalloutText = お客様の使用状況から、{fullName}さんにはこのファイルもお勧めです。
 # Description for confirmation modal to remove a collaborator
-boxui.unifiedShare.removeCollaboratorConfirmationDescription = Are you sure you want to remove {name} as a collaborator?
+boxui.unifiedShare.removeCollaboratorConfirmationDescription = コラボレータから{name}を削除してもよろしいですか?
 # Label for confirmation modal to remove a collaborator (title-case)
-boxui.unifiedShare.removeCollaboratorConfirmationTitle = Remove Collaborator
+boxui.unifiedShare.removeCollaboratorConfirmationTitle = コラボレータの削除
 # Description for confirmation modal to remove a shared link
 boxui.unifiedShare.removeLinkConfirmationDescription = これにより、共有リンクが完全に削除されます。この項目が他のサイトに埋め込まれている場合は、そのサイトでもアクセスできなくなります。カスタムプロパティ、設定、有効期限も削除されます。続行しますか?
 # Label for confirmation modal to remove a shared link (title-case)

package/i18n/pl-PL.js

@@ -963,10 +963,10 @@ export default {
   "boxui.unifiedShare.peopleInEnterpriseName": "Osoby w przedsiębiorstwie {enterpriseName}",
   "boxui.unifiedShare.peopleInItemCanAccessFile": "Tylko zaproszeni użytkownicy mogą uzyskać dostęp do tego pliku",
   "boxui.unifiedShare.peopleInItemCanAccessFolder": "Tylko zaproszeni użytkownicy mogą uzyskać dostęp do tego folderu",
-  "boxui.unifiedShare.peopleInItemCanAccessHub": "Only invited people can access this hub",
+  "boxui.unifiedShare.peopleInItemCanAccessHub": "Tylko zaproszone osoby mogą uzyskać dostęp do tego hub",
   "boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessFile": "Wszyscy użytkownicy w firmie {company} dysponujący łączem lub użytkownicy zaproszeni do tego pliku mogą uzyskać dostęp",
   "boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessFolder": "Wszyscy użytkownicy w firmie {company} dysponujący łączem lub użytkownicy zaproszeni do tego folderu mogą uzyskać dostęp",
-  "boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessHub": "Anyone at {company} with the link or people invited to this hub can access",
+  "boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessHub": "Każda osoba w {company} posiadająca łącze lub osoby zaproszone do tego hub mogą uzyskać dostęp",
   "boxui.unifiedShare.peopleInThisFile": "Tylko zaproszeni użytkownicy",
   "boxui.unifiedShare.peopleInThisFolder": "Tylko zaproszeni użytkownicy",
   "boxui.unifiedShare.peopleInYourCompany": "Osoby w Twojej firmie",

package/i18n/pl-PL.properties

@@ -1927,13 +1927,13 @@ boxui.unifiedShare.peopleInItemCanAccessFile = Tylko zaproszeni użytkownicy mog
 # Description of a collaborator-only shared link for a folder
 boxui.unifiedShare.peopleInItemCanAccessFolder = Tylko zaproszeni użytkownicy mogą uzyskać dostęp do tego folderu
 # Description of a collaborator-only shared link for a hub
-boxui.unifiedShare.peopleInItemCanAccessHub = Only invited people can access this hub
+boxui.unifiedShare.peopleInItemCanAccessHub = Tylko zaproszone osoby mogą uzyskać dostęp do tego hub
 # Description of a specific company shared link for a file. {company} is the company name
 boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessFile = Wszyscy użytkownicy w firmie {company} dysponujący łączem lub użytkownicy zaproszeni do tego pliku mogą uzyskać dostęp
 # Description of a specific company shared link for a folder. {company} is the company name
 boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessFolder = Wszyscy użytkownicy w firmie {company} dysponujący łączem lub użytkownicy zaproszeni do tego folderu mogą uzyskać dostęp
 # Description of a specific company shared link for a hub. {company} is the company name
-boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessHub = Anyone at {company} with the link or people invited to this hub can access
+boxui.unifiedShare.peopleInSpecifiedCompanyCanAccessHub = Każda osoba w {company} posiadająca łącze lub osoby zaproszone do tego hub mogą uzyskać dostęp
 # Label for "People in this file" option
 boxui.unifiedShare.peopleInThisFile = Tylko zaproszeni użytkownicy
 # Label for "People in this folder" option

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "box-ui-elements",
-    "version": "23.4.0-beta.7",
+    "version": "23.4.0-beta.9",
     "description": "Box UI Elements",
     "author": "Box (https://www.box.com/)",
     "license": "SEE LICENSE IN LICENSE",
@@ -150,13 +150,12 @@
         "@storybook/addon-interactions": "^8.2.4",
         "@storybook/addon-knobs": "^8.0.1",
         "@storybook/addon-links": "^8.2.4",
-        "@storybook/addon-styling": "^1.3.7",
-        "@storybook/addon-styling-webpack": "^1.0.0",
+        "@storybook/addon-styling-webpack": "^1.0.1",
         "@storybook/addon-webpack5-compiler-babel": "^3.0.3",
         "@storybook/blocks": "^8.2.4",
         "@storybook/manager-api": "^8.2.4",
         "@storybook/preview-api": "^8.2.4",
-        "@storybook/react-webpack5": "^8.2.4",
+        "@storybook/react-webpack5": "^8.6.14",
         "@storybook/test": "^8.2.4",
         "@storybook/theming": "^8.2.4",
         "@testing-library/jest-dom": "^6.4.6",
@@ -276,7 +275,7 @@
         "semantic-release": "^24.2.3",
         "sinon": "^2.3.7",
         "source-map-loader": "^0.2.4",
-        "storybook": "^8.2.4",
+        "storybook": "^8.6.14",
         "storybook-react-intl": "^3.1.1",
         "string-replace-loader": "^3.1.0",
         "styled-components": "5.0.0",

package/src/elements/content-sidebar/BoxAISidebar.tsx

@@ -10,7 +10,6 @@ import BoxAISidebarContent from './BoxAISidebarContent';
 import { BoxAISidebarContext } from './context/BoxAISidebarContext';
 import { SPREADSHEET_FILE_EXTENSIONS } from '../common/content-answers/constants';
 import type { BoxAISidebarCache, BoxAISidebarCacheSetter } from './types/BoxAISidebarTypes';
-
 import messages from '../common/content-answers/messages';
 
 export interface BoxAISidebarProps {
@@ -57,6 +56,7 @@ export interface BoxAISidebarProps {
     recordAction: (params: RecordActionType) => void;
     setCacheValue: BoxAISidebarCacheSetter;
     shouldFeedbackFormIncludeFeedbackText?: boolean;
+    renderRemoteModule?: (elementId: string) => React.ReactNode;
     shouldPreinitSession?: boolean;
     setHasQuestions: (hasQuestions: boolean) => void;
 }
@@ -79,6 +79,7 @@ const BoxAISidebar = (props: BoxAISidebarProps) => {
         onFeedbackFormSubmit,
         onUserInteraction,
         recordAction,
+        renderRemoteModule,
         setCacheValue,
         shouldFeedbackFormIncludeFeedbackText,
         shouldPreinitSession = true,
@@ -130,6 +131,10 @@ const BoxAISidebar = (props: BoxAISidebarProps) => {
         }
     }, [questions.length, setHasQuestions]);
 
+    if (renderRemoteModule) {
+        return renderRemoteModule(elementId);
+    }
+
     let questionsWithoutInProgress = questions;
     if (questions.length > 0 && !questions[questions.length - 1].isCompleted) {
         // pass only fully completed questions to not show loading indicator of question where we canceled API request

package/src/elements/content-sidebar/__tests__/BoxAISidebar.test.tsx

@@ -347,6 +347,26 @@ describe('elements/content-sidebar/BoxAISidebar', () => {
         expect(screen.queryByTestId('content-answers-modal')).not.toBeInTheDocument();
     });
 
+    describe('remote sidebar component', () => {
+        const MockRemoteSidebar = jest.fn(() => <div data-testid="remote-sidebar" />);
+        const renderRemoteModule = jest.fn(() => <MockRemoteSidebar elementId={mockProps.elementId} />);
+
+        test('should render remote sidebar component when provided', async () => {
+            await renderComponent({ renderRemoteModule });
+
+            expect(renderRemoteModule).toHaveBeenCalledWith(mockProps.elementId);
+            expect(screen.getByTestId('remote-sidebar')).toBeInTheDocument();
+        });
+
+        test('should not render default sidebar when remote component is provided', async () => {
+            await renderComponent({ renderRemoteModule });
+
+            expect(screen.queryByTestId('boxai-sidebar-title')).not.toBeInTheDocument();
+            expect(screen.queryByTestId('sidebar-agent-selector')).not.toBeInTheDocument();
+            expect(screen.queryByRole('button', { name: 'Clear conversation' })).not.toBeInTheDocument();
+        });
+    });
+
     describe('given shouldPreinitSession = false, should create session on user intent', () => {
         test('agents list open', async () => {
             MockBoxAiAgentSelectorWithApi.mockImplementation(({ onAgentsListOpen }) => {