@bothub-chat/ui/dist/components/select-field/select-modal/option/select-field-option/styled.js

Bothub UI Components

import{styled as e,css as t}from"styled-components";import{SelectFieldOptionSide as o}from"../list/styled.js";import{Typography as r}from"../../../../typography/index.js";import"react";import"unified";import"remark-parse";import"remark-gfm";import"mdast-util-to-markdown";import{colorToRgba as i}from"../../../../../utils/colors/colorToRgba.js";import"../../../../../utils/colors/calculateGrayScale.js";import"../../../../../utils/colors/calculateAccentColors.js";import"tslib";const s=e(r).attrs(({$size:e})=>({variant:"small"===e?"input-sm":"md"===e?"button-sm":"body-m-semibold"})).withConfig({displayName:"styled__SelectFieldOptionText",componentId:"sc-196wkb7-0"})(["color:",";",""],({theme:e,$selected:t})=>t?e.default.colors.base.white:e.colors.base.white,({$bold:e})=>e&&t`
      font-weight: 500;
    `),a=e(r).attrs({variant:"input-sm"}).withConfig({displayName:"styled__SelectFieldColorOptionText",componentId:"sc-196wkb7-1"})(["color:",";"],({theme:e,$selected:t})=>t?e.default.colors.base.white:e.colors.base.white),l=e.span.withConfig({displayName:"styled__SelectFieldOptionColor",componentId:"sc-196wkb7-2"})(["display:inline-flex;flex-shrink:0;width:18px;height:18px;border-radius:4px;",""],({$color:e})=>t`
    background: ${e};
  `),n=e.div.withConfig({displayName:"styled__SelectFieldOptionStyled",componentId:"sc-196wkb7-3"})(["display:flex;justify-content:space-between;align-items:center;padding:",";border-radius:6px;gap:","px;&:active{background-color:"," !important;",",","{color:",";}svg[d='fill'] path,svg[d='all'] path{fill:"," !important;}svg[d='stroke'] path,svg[d='all'] path{stroke:"," !important;}transition:all 0.2s ease-out;}user-select:none;-moz-user-select:none;-webkit-user-select:none;",""],({$size:e})=>{switch(e){case"small":return"8px";case"md":return"12px";case"large":return"8px 10px"}},({$size:e})=>{switch(e){case"small":case"large":return 8;case"md":return 10}},({theme:e})=>e.colors.accent.primary,s,a,({theme:e})=>e.default.colors.base.white,({theme:e})=>e.default.colors.base.white,({theme:e})=>e.default.colors.base.white,({theme:e,$selected:r,$disabled:s,$selectedColor:a,$backgroundHoverColor:l})=>{if(s)return t`
        cursor: not-allowed;
        &:hover {
          background: ${"light"===e.mode?"rgba(0, 0, 0, 0.05)":"rgba(255, 255, 255, 0.05)"};
        }
        > ${o}:first-child {
          opacity: 0.5;
        }
      `;switch(l){case"gradient":return t`
          cursor: pointer;
          position: relative;
          overflow: hidden;
          justify-content: center;
          padding-top: 12px;
          padding-bottom: 12px;
          &:hover::before {
            background: ${e.colors.premiumGradient};
            content: '';
            opacity: 0.2;
            border: inherit;
            inset: 0;
            z-index: -1;
            position: absolute;
          }
        `;case"primary":return t`
          cursor: pointer;
          position: relative;
          overflow: hidden;
          justify-content: center;
          padding-top: 12px;
          padding-bottom: 12px;
          text-align: center;
          &:hover {
            background: ${i(e.colors.accent.primary,.2)};
          }
        `;default:return r?t`
              background: ${a||e.colors.accent.primary};
              cursor: default;
            `:t`
              cursor: pointer;
              &:hover {
                background: ${"light"===e.mode?"rgba(0, 0, 0, 0.05)":"rgba(255, 255, 255, 0.05)"};
              }
            `}});export{a as SelectFieldColorOptionText,l as SelectFieldOptionColor,n as SelectFieldOptionStyled,s as SelectFieldOptionText};