refactor: move Checkmark, Avatar, Chip and Tooltip to twenty-ui (#4946)

Split from https://github.com/twentyhq/twenty/pull/4518

Part of #4766
This commit is contained in:
Thaïs
2024-04-15 12:05:06 +02:00
committed by GitHub
parent acc2092b95
commit b6d0b8a895
93 changed files with 225 additions and 189 deletions

View File

@ -107,7 +107,7 @@ Handles overflowing text and displays a tooltip when the text overflows.
<SandpackEditor
availableComponentPaths={['@/ui/display/tooltip/OverflowingTextWithTooltip']}
availableComponentPaths={['twenty-ui']}
componentCode={overflowingTextWithTooltipCode}
/>

View File

@ -17,7 +17,7 @@ Represents a successful or completed action.
<TabItem value="usage" label="Usage" default>
<SandpackEditor
availableComponentPaths={['@/ui/display/checkmark/components/Checkmark']}
availableComponentPaths={['twenty-ui']}
componentCode={checkmarkCode}
/>
@ -40,7 +40,7 @@ Represents a checkmark icon with the added feature of animation.
<TabItem value="usage" label="Usage" default>
<SandpackEditor
availableComponentPaths={['@/ui/display/checkmark/components/AnimatedCheckmark']}
availableComponentPaths={['twenty-ui']}
componentCode={animatedCheckmarkCode}
/>

View File

@ -18,7 +18,7 @@ A visual element that you can use as a clickable or non-clickable container with
<TabItem value="usage" label="Usage" default>
<SandpackEditor
availableComponentPaths={['@/ui/display/chip/components/Chip']}
availableComponentPaths={['twenty-ui']}
componentCode={chipCode}
/>
</TabItem>
@ -117,8 +117,8 @@ A visual element that you can use as a clickable or non-clickable container with
### Transparent Disabled Chip
<SandpackEditor
availableComponentPaths={['@/ui/display/chip/components/Chip']}
componentCode={`import { Chip } from "@/ui/display/chip/components/Chip";
availableComponentPaths={['twenty-ui']}
componentCode={`import { Chip } from "twenty-ui";
export const MyComponent = () => {
return (
@ -144,8 +144,8 @@ export const MyComponent = () => {
### Disabled Chip with Tooltip
<SandpackEditor
availableComponentPaths={['@/ui/display/chip/components/Chip']}
componentCode={`import { Chip } from "@/ui/display/chip/components/Chip";
availableComponentPaths={['twenty-ui']}
componentCode={`import { Chip } from "twenty-ui";
export const MyComponent = () => {
return (
@ -176,7 +176,7 @@ A Chip-like element to display information about an entity.
<TabItem value="usage" label="Usage" default>
<SandpackEditor
availableComponentPaths={['@/ui/display/chip/components/EntityChip', 'twenty-ui']}
availableComponentPaths={['twenty-ui']}
componentCode={entityChipCode}
/>
</TabItem >

View File

@ -1,4 +1,4 @@
import { AnimatedCheckmark } from "@/ui/display/checkmark/components/AnimatedCheckmark";
import { AnimatedCheckmark } from 'twenty-ui';
export const MyComponent = () => {
return (
@ -9,6 +9,4 @@ export const MyComponent = () => {
size={30}
/>
);
};

View File

@ -1,4 +1,4 @@
import { Checkmark } from "@/ui/display/checkmark/components/Checkmark";
import { Checkmark } from 'twenty-ui';
export const MyComponent = () => {
return <Checkmark />;

View File

@ -1,4 +1,4 @@
import { Chip } from "@/ui/display/chip/components/Chip";
import { Chip } from 'twenty-ui';
export const MyComponent = () => {
return (

View File

@ -1,7 +1,5 @@
import { BrowserRouter as Router } from 'react-router-dom';
import { IconTwentyStar } from 'twenty-ui';
import { EntityChip } from '@/ui/display/chip/components/EntityChip';
import { EntityChip, IconTwentyStar } from 'twenty-ui';
export const MyComponent = () => {
return (

View File

@ -1,8 +1,8 @@
import { OverflowingTextWithTooltip } from "@/ui/display/tooltip/OverflowingTextWithTooltip";
import { OverflowingTextWithTooltip } from 'twenty-ui';
export const MyComponent = () => {
const crmTaskDescription =
"Follow up with client regarding their recent product inquiry. Discuss pricing options, address any concerns, and provide additional product information. Record the details of the conversation in the CRM for future reference.";
'Follow up with client regarding their recent product inquiry. Discuss pricing options, address any concerns, and provide additional product information. Record the details of the conversation in the CRM for future reference.';
return <OverflowingTextWithTooltip text={crmTaskDescription} />;
};