@memori.ai/memori-react 8.45.1 → 8.45.4

package/src/components/StartPanel/StartPanel.css

@@ -1,273 +0,0 @@
-.memori--gamification-badge {
-    position: absolute;
-    right: 0.25rem;
-    bottom: -1.25rem;
-    display: flex;
-    width: 2rem;
-    height: 2rem;
-    align-items: center;
-    justify-content: center;
-    border: 1.5px solid var(--memori-primary);
-    border-radius: 50%;
-    background: #fff;
-    box-shadow: 0 0 5px 6px rgba(255, 255, 255, 0.5);
-}
-
-.memori--gamification-badge span {
-    font-size: 1.2rem;
-}
-
-.memori--start-panel {
-    width: 100%;
-    align-self: flex-start;
-    padding: var(--memori-inner-content-pad, 0);
-    border-radius: 10px;
-    margin-top: 2rem;
-    -webkit-backdrop-filter: blur(10px);
-    backdrop-filter: blur(10px);
-    background-color: var(--memori-inner-bg, transparent);
-    color: var(--memori-text-color, rgba(0, 0, 0, 0.85)) !important;
-    overflow-y: auto;
-}
-
-.memori--start-panel .memori--start-panel-title {
-    color: var(--memori-text-color, var(--memori-primary)) !important;
-}
-
-.memori--start-panel .memori--start-panel-description {
-    color: var(--memori-text-color, rgba(0, 0, 0, 0.85)) !important;
-}
-
-@media (max-width: 870px) {
-    .memori--start-panel {
-        margin-top: 1rem;
-    }
-}
-
-.memori--cover {
-    position: relative;
-    width: 100%;
-    padding-top: 31.25%;
-    border-radius: 3px;
-    background-position: center center;
-    background-repeat: no-repeat;
-    background-size: cover;
-}
-
-.memori--avatar {
-    position: relative;
-    z-index: 0;
-    top: -20px;
-    display: inline-flex;
-    overflow: hidden;
-    width: 60px;
-    height: 60px;
-    align-items: center;
-    justify-content: center;
-    border-radius: 50%;
-    margin-right: 10px;
-    background: #fff;
-    box-shadow: 0 0 5px rgba(50, 50, 50, 0.3);
-}
-
-.memori--avatar img {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-}
-
-.memori--title {
-    display: inline-block;
-    margin: 0;
-    color: var(--memori-primary);
-    font-size: 24px;
-    font-weight: 600;
-    line-height: 1.8;
-}
-
-.memori--description,
-.memori--needsLogin,
-.memori--needsPosition {
-    color: var(--memori-text-color, rgba(0, 0, 0, 0.85));
-    font-size: 14px;
-    line-height: 1.6;
-}
-
-.memori--description-text {
-    display: block;
-    line-height: 1.6;
-}
-
-.memori--start-privacy-explanation {
-    color: var(--memori-text-color, rgba(0, 0, 0, 0.85));
-    font-size: 0.85em;
-    font-style: italic;
-    opacity: 0.85;
-}
-
-.memori--start-privacy-explanation-container {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-}
-
-.memori--start-privacy-explanation-icon {
-    width: 1.2rem;
-    height: 1.2rem;
-    align-self: center;
-    margin-left: 0.5rem;
-}
-
-.memori--translation-toggle {
-    height: auto;
-    padding-right: 0;
-    padding-left: 0;
-    color: var(--memori-primary);
-    font-size: 0.85em;
-}
-
-.memori--start-description {
-    margin-top: 0.5rem;
-    font-size: 0.85em;
-    opacity: 0.85;
-}
-
-.memori--start-button {
-    position: relative;
-    overflow: hidden;
-    min-width: 140px;
-    min-height: 42px;
-    border-radius: 8px;
-    margin-right: 1em;
-    font-weight: 600;
-    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.memori--language-chooser {
-    margin-bottom: 1rem;
-}
-
-.memori--language-chooser svg {
-    margin-right: 0.5rem;
-}
-
-.memori--language-chooser select,
-.memori--language-chooser .memori--select {
-    min-width: 7rem;
-    margin-left: 0.5rem;
-}
-
-.memori--language-chooser select option {
-    background: #fff;
-    color: #000;
-}
-
-.memori--language-chooser select optgroup {
-    background: #fff;
-    color: #666;
-    font-size: 0.9em;
-    font-style: normal;
-    font-weight: 700;
-}
-
-.memori--language-chooser select optgroup option {
-    padding-left: 0.5rem;
-    color: #000;
-    font-weight: 400;
-}
-
-.memori--completions-enabled,
-.memori--board-of-experts,
-.memori--nsfw {
-    position: absolute;
-    right: 0.25rem;
-    bottom: -1.25rem;
-    display: flex;
-    width: 2rem;
-    height: 2rem;
-    align-items: center;
-    justify-content: center;
-    border: 1.5px solid var(--memori-primary);
-    border-radius: 50%;
-    background: #fff;
-    box-shadow: 0 0 5px 6px rgba(255, 255, 255, 0.5);
-    color: #000;
-}
-
-.memori--completions-enabled span {
-    font-size: 1.2rem;
-}
-
-.memori--completions-enabled svg {
-    overflow: visible;
-    width: 1rem;
-    height: 1rem;
-}
-
-.memori--board-of-experts + .memori--nsfw,
-.memori--completions-enabled + .memori--nsfw {
-    right: 2.5rem;
-}
-
-.memori--board-of-experts svg {
-    overflow: visible;
-    width: 1rem;
-    height: 1rem;
-    fill: #000;
-}
-
-.memori--deep-thought-disclaimer {
-    position: relative;
-    padding: 1em 1.5em;
-    border: 2px solid var(--memori-warning-color, #faad14);
-    border-radius: var(--memori-border-radius, 10px);
-    margin-top: 1rem;
-    font-size: 0.8em;
-}
-
-.memori--deep-thought-disclaimer::before {
-    position: absolute;
-    z-index: -1;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: var(--memori-warning-color, #faad14);
-    content: '';
-    opacity: 0.2;
-}
-
-.memori--deep-thought-disclaimer h2 {
-    margin-top: 0;
-    margin-bottom: 0.5em;
-    color: var(--memori-text-color, rgba(0, 0, 0, 0.85));
-}
-
-.memori--deep-thought-disclaimer .memori-tooltip {
-    position: relative;
-    margin-bottom: 1rem;
-    margin-left: 1rem;
-    float: right;
-}
-
-.memori--deep-thought-disclaimer .memori-tooltip .memori-tooltip--trigger svg {
-    width: 1.5rem;
-    height: 1.5rem;
-    padding: 5px;
-    border: 1px solid #666;
-    border-radius: 50%;
-}
-
-.memori--deep-thought-disclaimer a {
-    color: inherit;
-    text-decoration: underline;
-}
-
-.memori--privacy-tooltip-content {
-    text-align: left;
-}
-
-.memori--privacy-tooltip-content-list {
-    padding-left: 1rem;
-}
-

package/src/components/StartPanel/StartPanel.stories.tsx

@@ -1,404 +0,0 @@
-import React from 'react';
-import { Meta, Story } from '@storybook/react';
-import I18nWrapper from '../../I18nWrapper';
-import { memori, sessionID, integration, tenant, user } from '../../mocks/data';
-import StartPanel, { Props } from './StartPanel';
-
-import '../../i18n';
-import './StartPanel.css';
-
-const meta: Meta = {
-  title: 'Widget/Start panel',
-  component: StartPanel,
-  argTypes: {
-    showShare: {
-      control: {
-        type: 'boolean',
-      },
-    },
-  },
-  parameters: {
-    controls: { expanded: true },
-  },
-};
-
-export default meta;
-
-const integrationConfig = {
-  ...JSON.parse(integration.customData ?? '{}'),
-  avatarURL:
-    JSON.parse(integration.customData ?? '{}').avatarURL?.split('#')?.[0] +
-    '#' +
-    new Date(Date.now()).getTime(),
-};
-const integrationProperties = {
-  '--memori-chat-bubble-bg': '#fff',
-  ...(integrationConfig?.buttonBgColor
-    ? {
-        '--memori-button-bg': integrationConfig.buttonBgColor,
-        '--memori-primary': integrationConfig.buttonBgColor,
-      }
-    : {}),
-  ...(integrationConfig?.buttonTextColor
-    ? {
-        '--memori-button-text': integrationConfig.buttonTextColor,
-        '--memori-text-color': integrationConfig.buttonTextColor,
-      }
-    : {}),
-  ...(integrationConfig?.blurBackground
-    ? {
-        '--memori-blur-background': '5px',
-      }
-    : {
-        '--memori-blur-background': '0px',
-      }),
-  ...(integrationConfig?.innerBgColor
-    ? {
-        '--memori-inner-bg': `rgba(${
-          integrationConfig.innerBgColor === 'dark'
-            ? '0, 0, 0'
-            : '255, 255, 255'
-        }, ${integrationConfig.innerBgAlpha ?? 0.4})`,
-        '--memori-inner-content-pad': '1.5rem',
-        '--memori-nav-bg-image': 'none',
-        '--memori-nav-bg': `rgba(${
-          integrationConfig.innerBgColor === 'dark'
-            ? '0, 0, 0'
-            : '255, 255, 255'
-        }, ${integrationConfig?.innerBgAlpha ?? 0.4})`,
-      }
-    : {
-        '--memori-inner-content-pad': '0px',
-      }),
-};
-
-const integrationStylesheet = `
-    #root, .memori-widget {
-      ${Object.entries(integrationProperties)
-        .map(([key, value]) => `${key}: ${value};`)
-        .join('\n')}
-    }
-  `;
-
-const Template: Story<Props> = args => (
-  <I18nWrapper>
-    <div style={{ maxWidth: '600px', margin: 'auto' }}>
-      {args.integrationConfig && (
-        <style dangerouslySetInnerHTML={{ __html: integrationStylesheet }} />
-      )}
-      <StartPanel {...args} setShowLoginDrawer={() => {}} />
-    </div>
-  </I18nWrapper>
-);
-
-// By passing using the Args format for exported stories, you can control the props for a component for reuse in a test
-// https://storybook.js.org/docs/react/workflows/unit-testing
-export const Default = Template.bind({});
-Default.args = {
-  memori: {
-    ...memori,
-    enableCompletions: false,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const WithExistingSession = Template.bind({});
-WithExistingSession.args = {
-  memori: {
-    ...memori,
-    enableCompletions: false,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  hasInitialSession: true,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const WithCompletionsEnabled = Template.bind({});
-WithCompletionsEnabled.args = {
-  memori: {
-    ...memori,
-    enableCompletions: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const WithNSFWFlag = Template.bind({});
-WithNSFWFlag.args = {
-  memori: {
-    ...memori,
-    nsfw: true,
-    enableCompletions: false,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const WithCompletionsAndNSFW = Template.bind({});
-WithCompletionsAndNSFW.args = {
-  memori: {
-    ...memori,
-    enableCompletions: true,
-    nsfw: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const WithDeepThoughtEnabled = Template.bind({});
-WithDeepThoughtEnabled.args = {
-  memori: {
-    ...memori,
-    enableDeepThought: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-  isUserLoggedIn: true,
-  user: {
-    ...user,
-    pAndCUAccepted: true,
-  },
-};
-
-export const WithDeepThoughtEnabledUnlogged = Template.bind({});
-WithDeepThoughtEnabledUnlogged.args = {
-  memori: {
-    ...memori,
-    enableDeepThought: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-  isUserLoggedIn: false,
-  showLogin: true,
-  setShowLoginDrawer: () => {},
-};
-
-export const WithDeepThoughtEnabledWithoutPermissionFlag = Template.bind({});
-WithDeepThoughtEnabledWithoutPermissionFlag.args = {
-  memori: {
-    ...memori,
-    enableDeepThought: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-  isUserLoggedIn: true,
-  user: {
-    ...user,
-    pAndCUAccepted: false,
-  },
-};
-
-export const BoardOfExpert = Template.bind({});
-BoardOfExpert.args = {
-  memori: {
-    ...memori,
-    enableBoardOfExperts: true,
-    enableCompletions: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const BoardOfExpertNSFW = Template.bind({});
-BoardOfExpertNSFW.args = {
-  memori: {
-    ...memori,
-    enableBoardOfExperts: true,
-    enableCompletions: true,
-    nsfw: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const Instruct = Template.bind({});
-Instruct.args = {
-  memori,
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: true,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const PositionRequired = Template.bind({});
-PositionRequired.args = {
-  memori: {
-    ...memori,
-    needsPosition: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: true,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const LoginRequired = Template.bind({});
-LoginRequired.args = {
-  memori: {
-    ...memori,
-    requireLoginToken: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: true,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const LoginRequiredWithAuth = Template.bind({});
-LoginRequiredWithAuth.args = {
-  memori: {
-    ...memori,
-    requireLoginToken: true,
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  isUserLoggedIn: true,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const WithIntegration = Template.bind({});
-WithIntegration.args = {
-  memori,
-  tenant,
-  integrationConfig,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-};
-
-export const WithCompletionProviderDown = Template.bind({});
-WithCompletionProviderDown.args = {
-  memori: {
-    ...memori,
-    enableCompletions: false,
-    completionProvider: 'OpenAI',
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-  _TEST_forceProviderStatus: 'major',
-};
-
-/** Public agent whose owner has run out of credits: the start button is
- * disabled and a "not enough credits" badge is shown instead of starting a
- * session or asking for a password. */
-export const NotEnoughCredits = Template.bind({});
-NotEnoughCredits.args = {
-  memori: {
-    ...memori,
-    privacyType: 'PUBLIC',
-  },
-  tenant,
-  language: 'it',
-  userLang: 'en',
-  setUserLang: () => {},
-  openPositionDrawer: () => {},
-  instruct: false,
-  sessionId: sessionID,
-  clickedStart: false,
-  onClickStart: () => {},
-  notEnoughCredits: true,
-};