@bothub-chat/ui
Version:
Bothub UI Components
25 lines (24 loc) • 3.05 kB
JavaScript
import{styled as e,css as o}from"styled-components";import{CheckSmallIcon as r}from"../../icons/check-small/index.js";import{Typography as i}from"../typography/index.js";import{Skeleton as t}from"../skeleton/index.js";import"react";import"unified";import"remark-parse";import"remark-gfm";import"mdast-util-to-markdown";import{isBright as c}from"../../utils/colors/isBright.js";import"../../utils/colors/calculateGrayScale.js";import"../../utils/colors/calculateAccentColors.js";import"tslib";const l=e.label.withConfig({displayName:"styled__CheckboxStyled",componentId:"sc-im2c17-0"})([""," display:",";align-items:center;gap:8px;user-select:none;"," "," ",""],({$preventScrollOnFocus:e})=>e&&o`
position: relative;
`,({$displayFlex:e})=>e?"flex":"inline-flex",({$disabled:e})=>e?o`
cursor: not-allowed;
`:o`
cursor: pointer;
`,({$fullWidth:e})=>e&&o`
width: 100%;
`,({$rowReverse:e})=>e&&o`
flex-direction: row-reverse;
`),s=e.span.withConfig({displayName:"styled__CheckboxBlock",componentId:"sc-im2c17-1"})(["display:inline-flex;align-items:center;justify-content:center;background:",";border:1px solid ",";border-radius:2px;overflow:hidden;cursor:pointer;flex-shrink:0;box-sizing:border-box;&:hover{border-color:",";}svg{visibility:hidden;}"],({theme:e})=>e.colors.grayScale.gray3,({theme:e})=>e.colors.grayScale.gray1,({theme:e,$checkedColor:o})=>o||e.colors.accent.primary),n=e(t).withConfig({displayName:"styled__CheckboxBlockSkeleton",componentId:"sc-im2c17-2"})([""," border-radius:2px;"],({$size:e})=>o`
width: ${`${e}px`};
height: ${`${e}px`};
`),a=e(i).attrs({variant:"input-sm"}).withConfig({displayName:"styled__CheckboxLabel",componentId:"sc-im2c17-3"})(["display:inline-flex;width:100%;align-items:center;gap:8px;cursor:inherit;"]),d=e(r).attrs(({theme:e})=>({fill:c(e.colors.accent.primary)?e.default.colors.base.black:e.default.colors.base.white})).withConfig({displayName:"styled__CheckboxCheckedIcon",componentId:"sc-im2c17-4"})([""]),p=e.input.withConfig({displayName:"styled__CheckboxInput",componentId:"sc-im2c17-5"})(["width:0;height:0;opacity:0;cursor:pointer;position:absolute;"," &:checked + span{"," svg{visibility:visible;}}&:checked:not(:disabled) + ",":hover{","}&:disabled + ","{border-color:",";background:",";cursor:not-allowed;svg{path{fill:",";}}}&:focus-visible + ","{border-color:",";}"],({$preventScrollOnFocus:e})=>e&&o`
top: 0;
left: 0;
pointer-events: none;
`,({theme:e,$checkedColor:r})=>{const i=r||e.colors.accent.primary;return o`
border-color: ${i};
background: ${i};
`},s,({theme:e,$checkedColor:r})=>{const i=r||e.colors.accent.strong;return o`
border-color: ${i};
background: ${i};
`},s,({theme:e})=>e.colors.grayScale.gray1,({theme:e})=>e.colors.grayScale.gray1,({theme:e})=>e.colors.grayScale.gray6,s,({theme:e})=>e.colors.base.white);export{s as CheckboxBlock,n as CheckboxBlockSkeleton,d as CheckboxCheckedIcon,p as CheckboxInput,a as CheckboxLabel,l as CheckboxStyled};