@sky-mavis/tanto-widget
Version:
Tanto Widget
27 lines • 601 B
JavaScript
import {jsx}from'@emotion/react/jsx-runtime';import useResizeObserver from'use-resize-observer';const SmoothWidth = ({
children,
...rest
}) => {
const {
width,
ref
} = useResizeObserver();
return jsx("div", {
style: {
display: 'flex',
justifyContent: 'center',
boxSizing: 'border-box',
transition: 'width 150ms',
width: width ? width : 'auto'
},
...rest,
children: jsx("div", {
style: {
width: 'fit-content',
whiteSpace: 'nowrap'
},
ref: ref,
children: children
})
});
};export{SmoothWidth};