@lanaco/lnc-react-ui
Version:
React component library
41 lines (36 loc) • 1.44 kB
JavaScript
"use strict";const t=require("react/jsx-runtime"),a=require("react"),d=require("./emotion-styled.browser.esm-Cle7tAM9.cjs"),u=require("./consts-CtNoHdBj.cjs"),x=require("./Button.cjs"),b=d.newStyled.div`
display: flex;
flex-direction: column;
gap: 1.25rem;
color: var(--gray-950, #14161A);
justify-content: center;
& button {
width: fit-content
}
& .block-group {
display: flex;
flex-direction: column;
}
& .txt-block-subtitle {
font-size: 0.75rem;
font-weight: 400;
color: var(--gray-500);
}
& .txt-block-title {
font-size: 1.5rem;
font-weight: 600;
color: var(--gray-950, #14161A);
}
& .txt-block-description {
font-size: 0.875rem;
font-weight: 400;
color: var(--gray-700, #4E555F);
}
@media (max-width: ${u.MOBILE_SIZE_PX+"px"}) {
align-items: start;
justify-content: start;
& .txt-block-title {
font-size: 1.375rem;
}
}
`,f=a.forwardRef((e,m)=>{const{title:o,subtitle:r,description:i,buttonText:n,buttonLink:c,onButtonAction:s=()=>{},...l}=e;return t.jsxs(b,{...l,children:[t.jsxs("div",{className:"block-group",children:[t.jsx("div",{className:"txt-block-subtitle",children:r}),t.jsx("div",{className:"txt-block-title",children:o}),t.jsx("div",{className:"txt-block-description",children:i})]}),t.jsx(x,{type:"button",btnType:"outline",borderRadius:"curved",onClick:()=>s(c),color:"gray",children:n})]})});exports.TextBlockV1=f;