@bothub-chat/ui
Version:
Bothub UI Components
27 lines (26 loc) • 6.29 kB
JavaScript
import{styled as e,css as t}from"styled-components";import i from"rc-slider";import{Button as o}from"../../button/index.js";import{Typography as a}from"../../typography/index.js";import{Skeleton as s}from"../../skeleton/index.js";import{adaptive as r}from"../../../adaptive/index.js";import"react";import"unified";import"remark-parse";import"remark-gfm";import"mdast-util-to-markdown";import{isBright as n}from"../../../utils/colors/isBright.js";import"../../../utils/colors/calculateGrayScale.js";import"../../../utils/colors/calculateAccentColors.js";import"tslib";const d=e.div.withConfig({displayName:"styled__MessageMusicStyled",componentId:"sc-l7afgb-0"})(["display:flex;align-items:",";gap:12px;width:100%;box-sizing:border-box;border:1px solid ",";padding:12px;border-radius:12px;max-width:",";",""],({$hasCover:e})=>e?"stretch":"center",({theme:e})=>e.colors.grayScale.gray3,({$hasCover:e})=>e?"480px":"720px",({$hasCover:e})=>r({tablet:t`
max-width: ${e?"420px":"100%"};
`,mobile:t`
max-width: 100%;
padding: 10px;
gap: 10px;
`})),l=e.audio.withConfig({displayName:"styled__MessageMusicAudio",componentId:"sc-l7afgb-1"})(["display:none;"]),p=e.div.withConfig({displayName:"styled__MessageMusicCover",componentId:"sc-l7afgb-2"})(["position:relative;flex-shrink:0;width:96px;height:96px;border-radius:10px;overflow:hidden;background:",";display:flex;align-items:center;justify-content:center;",""],({theme:e})=>e.colors.grayScale.gray3,r({mobile:t`
width: 72px;
height: 72px;
border-radius: 8px;
`})),c=e.img.withConfig({displayName:"styled__MessageMusicCoverImage",componentId:"sc-l7afgb-3"})(["width:100%;height:100%;object-fit:cover;display:block;"]),m=e.div.withConfig({displayName:"styled__MessageMusicIconBadge",componentId:"sc-l7afgb-4"})(["position:relative;flex-shrink:0;width:96px;height:96px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:",";",""],({theme:e})=>e.colors.grayScale.gray3,r({mobile:t`
width: 72px;
height: 72px;
border-radius: 8px;
`})),h=e.div.withConfig({displayName:"styled__MessageMusicContent",componentId:"sc-l7afgb-5"})(["display:flex;flex-direction:column;justify-content:center;gap:8px;min-width:0;flex:1;"]),g=t`
color: ${({theme:e,$variant:t})=>"assistant"===t?e.colors.base.white:e.bright||"standard"===e.scheme&&"light"===e.mode||"custom"===e.scheme&&n(e.colors.custom.message.user.background)?e.default.colors.base.black:e.default.colors.base.white};
`,x=e(a).attrs({variant:"body-m-medium"}).withConfig({displayName:"styled__MessageMusicTitle",componentId:"sc-l7afgb-6"})([""," overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;line-height:1.3;"],g);e(a).attrs({variant:"body-s-regular"}).withConfig({displayName:"styled__MessageMusicArtist",componentId:"sc-l7afgb-7"})([""," opacity:0.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;"],g);const b=e.div.withConfig({displayName:"styled__MessageMusicMeta",componentId:"sc-l7afgb-8"})(["display:flex;align-items:center;gap:10px;min-width:0;width:100%;"]),f=e.div.withConfig({displayName:"styled__MessageMusicPlayerRow",componentId:"sc-l7afgb-9"})(["display:flex;align-items:center;gap:10px;width:100%;"]),u=e.div.withConfig({displayName:"styled__MessageMusicSliderWrap",componentId:"sc-l7afgb-10"})(["position:relative;flex:1 1 auto;min-width:48px;width:100%;display:flex;align-items:center;"]),y=e(o).attrs({disableHoverColor:!0}).withConfig({displayName:"styled__MessageMusicControlButton",componentId:"sc-l7afgb-11"})(["max-width:38px;max-height:38px;border-radius:50%;flex-shrink:0;transition:transform 160ms ease-out,opacity 160ms ease-out;@media (hover:hover) and (pointer:fine){&:hover:not(:disabled){transform:scale(1.06);}}&:active:not(:disabled){transform:scale(0.94);}@media (prefers-reduced-motion:reduce){transition:none;&:hover:not(:disabled),&:active:not(:disabled){transform:none;}}"]),w=e(a).attrs({variant:"body-s-medium"}).withConfig({displayName:"styled__MessageMusicTime",componentId:"sc-l7afgb-12"})([""," opacity:0.7;user-select:none;flex-shrink:0;font-variant-numeric:tabular-nums;white-space:nowrap;"],g),v=e(i).withConfig({displayName:"styled__MessageMusicSlider",componentId:"sc-l7afgb-13"})(["position:relative;width:100%;height:24px;padding:4px 0;box-sizing:border-box;touch-action:none;&,& *{box-sizing:border-box;}.rc-slider-rail{position:absolute !important;left:0;right:0;top:50%;transform:translateY(-50%);width:100%;height:12px !important;border-radius:6px;background:"," !important;}.rc-slider-track{position:absolute !important;top:50%;transform:translateY(-50%);height:12px !important;border-radius:6px;opacity:0.7;background:"," !important;"," ","}.rc-slider-handle{position:absolute !important;top:50%;z-index:1;opacity:1 !important;border:none !important;border-radius:50%;width:14px !important;height:14px !important;margin-top:-7px !important;background:"," !important;box-shadow:none;outline:none;cursor:",";&:hover,&:focus,&:active{opacity:1 !important;box-shadow:none;border:none !important;}}.rc-slider-handle-dragging{box-shadow:none !important;border:none !important;}"],({theme:e})=>e.colors.grayScale.gray3,({theme:e,$disabled:t})=>t?e.colors.grayScale.gray1:e.colors.gradient.elite,({$disabled:e})=>e&&t`
cursor: not-allowed;
`,({$disabled:e})=>!e&&t`
cursor: pointer;
`,({theme:e,$disabled:t})=>t?e.colors.grayScale.gray1:e.default.colors.base.white,({$disabled:e})=>e?"not-allowed":"pointer"),M=e(s).attrs({variant:"rounded"}).withConfig({displayName:"styled__MessageMusicSkeleton",componentId:"sc-l7afgb-14"})(["width:100%;max-width:",";height:",";",""],({$hasCover:e})=>e?"480px":"720px",({$hasCover:e})=>e?"120px":"64px",({$hasCover:e})=>r({tablet:t`
max-width: ${e?"420px":"100%"};
`,mobile:t`
max-width: 100%;
height: ${e?"96px":"72px"};
`}));export{l as MessageMusicAudio,h as MessageMusicContent,y as MessageMusicControlButton,p as MessageMusicCover,c as MessageMusicCoverImage,m as MessageMusicIconBadge,b as MessageMusicMeta,f as MessageMusicPlayerRow,M as MessageMusicSkeleton,v as MessageMusicSlider,u as MessageMusicSliderWrap,d as MessageMusicStyled,w as MessageMusicTime,x as MessageMusicTitle};