You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Bug - When i checked all the code sandbox i can see Teasheet is poping up from bottom on click and some kind of animation is there on show and hide of tearsheet
Description
When i checked all the code sandbox i can see Teasheet is poping up from bottom on click and some kind of animation is there on show and hide of tearsheet
Expected behavior
Some kind of animation when you show and hide Tearsheet
Actual behavior
its not animating
Steps for reproducing
import React, { useState } from 'react';
import { Tearsheet } from '@carbon/ibm-cloud-cognitive';
import { Button, Tabs, Tab } from 'carbon-components-react';
return (
<>
Reopen Tearsheet
<Tearsheet
actions={[
{ kind: 'secondary', label: 'Cancel', onClick: handleCloseModal },
{ kind: 'primary', label: 'Create', onClick: handleCloseModal },
]}
closeIconDescription='Close the tearsheet'
description={
// cspell:disable
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor{' '} incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
// cspell:enable
}
influencer={
Influencer
}
label='This is the label of the tearsheet'
navigation={
<Tabs onSelectionChange={() => {}}>
}
onClose={handleCloseModal}
open={isOpen}
preventCloseOnClickOutside
title='This is the title of the tearsheet'
>
The main content of the Tearsheet should be placed here.
Bug - When i checked all the code sandbox i can see Teasheet is poping up from bottom on click and some kind of animation is there on show and hide of tearsheet
Description
When i checked all the code sandbox i can see Teasheet is poping up from bottom on click and some kind of animation is there on show and hide of tearsheet
Expected behavior
Some kind of animation when you show and hide Tearsheet
Actual behavior
its not animating
Steps for reproducing
import React, { useState } from 'react';
import { Tearsheet } from '@carbon/ibm-cloud-cognitive';
import { Button, Tabs, Tab } from 'carbon-components-react';
export const ConfirmationDropModal = () => {
const [isOpen, setIsOpen] = useState(true);
const handleOpenModalClick = () => {
setIsOpen(true);
};
const handleCloseModal = () => {
setIsOpen(false);
};
return (
<>
Reopen Tearsheet
<Tearsheet
actions={[
{ kind: 'secondary', label: 'Cancel', onClick: handleCloseModal },
{ kind: 'primary', label: 'Create', onClick: handleCloseModal },
]}
closeIconDescription='Close the tearsheet'
description={
// cspell:disable
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor{' '}
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
// cspell:enable
}
influencer={
label='This is the label of the tearsheet'
navigation={
<Tabs onSelectionChange={() => {}}>
}
onClose={handleCloseModal}
open={isOpen}
preventCloseOnClickOutside
title='This is the title of the tearsheet'
>
The main content of the Tearsheet should be placed here.
</>
);
};
Affected browsers
Chrome
Optional information
Version -
"@carbon/ibm-cloud-cognitive": "^1.10.0",
"@carbon/elements": "^10.54.1",
The text was updated successfully, but these errors were encountered: