@bothub-chat/ui 2.24.0 → 2.24.2-develop-e36285b6-0146-4c9f-9287-a655546a1076
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/input-message/index.js +1 -1
- package/dist/components/tariff/row/index.d.ts +3 -3
- package/dist/components/tariff/row/index.js +1 -1
- package/dist/components/tariff/row/styled.d.ts +283 -3
- package/dist/components/tariff/row/styled.js +1 -1
- package/dist/components/tariff/row/tariff-card-images/index.d.ts +1 -1
- package/dist/components/tariff/row/tariff-card-images/index.js +1 -1
- package/dist/components/tariff/row/types.d.ts +1 -1
- package/dist/components/typography/styled.js +1 -1
- package/dist/components/typography/types.d.ts +1 -1
- package/dist/theme/index.js +1 -1
- package/dist/theme/types.d.ts +9 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as e,__awaiter as t}from"tslib";import{jsx as n,jsxs as r,Fragment as
|
|
1
|
+
import{__rest as e,__awaiter as t}from"tslib";import{jsx as n,jsxs as r,Fragment as i}from"react/jsx-runtime";import{useRef as l,useState as o,useCallback as a,useEffect as c,useLayoutEffect as s}from"react";import{useTransition as d}from"@react-spring/web";import{useOnClickOutside as u}from"../../utils/useOnClickOutside.js";import{InputMessageStyled as p,InputMessageContent as m,InputMessageUploadFile as v,InputMessageUploadFileInput as h,InputMessageUploadFileButton as f,InputMessageMain as g,InputMessageVoiceRecord as y,InputMessageVoiceRecordDot as b,InputMessageVoiceRecordTimeText as x,InputMessageFiles as j,InputMessageFile as D,InputMessageTextArea as $,InputMessageToggleSendStyled as A,InputMessageToggleSendButton as k,InputMessageToggleSendModalStyled as w,InputMessageToggleSendModalOption as C,InputMessageSendButton as F,InputMessageSendIcon as E,InputMessageVoiceIcon as T}from"./styled.js";import{ChipImage as S}from"../chip/styled.js";import"react-dom";import"../portal/styled.js";import"../tooltip/styled.js";import"../tooltip/arrow/styled.js";import"../../theme/index.js";import"../tooltip/context.js";import{PdfIcon as K}from"../../icons/pdf/index.js";import{TxtIcon as L}from"../../icons/txt/index.js";import{WordIcon as P}from"../../icons/word/index.js";import{XlsIcon as O}from"../../icons/xls/index.js";import{IconProvider as U}from"../icon/context.js";import"../icon/styled.js";import{getPreviewUrlForFile as V,formatUploadFiles as B,formatSeconds as H}from"./utils.js";import{AttachFileIcon as I}from"../../icons/attach-file/index.js";import{getSupportedAudioMimeType as N}from"../../utils/getSupportedAudioMimeType.js";import{useTheme as M}from"../../theme/hook.js";const R=R=>{var{className:z,placeholder:G,message:W,files:_,disabled:q=!1,sendDisabled:J=!1,textAreaDisabled:Q=!1,useAlternativeKeyDefaultValue:X=!1,defaultKeySendText:Y,alternativeKeySendText:Z,uploadFileLimit:ee=5,hideUploadFile:te=!1,uploadFileDisabled:ne=!1,uploadFileAccept:re,autoFocus:ie=!0,voice:le=!1,onSetAlternativeKeyValue:oe,onChange:ae,onFilesChange:ce,onTextAreaChange:se,onSend:de,onFocus:ue,onBlur:pe,onVoice:me,emitError:ve,rightActions:he}=R,fe=e(R,["className","placeholder","message","files","disabled","sendDisabled","textAreaDisabled","useAlternativeKeyDefaultValue","defaultKeySendText","alternativeKeySendText","uploadFileLimit","hideUploadFile","uploadFileDisabled","uploadFileAccept","autoFocus","voice","onSetAlternativeKeyValue","onChange","onFilesChange","onTextAreaChange","onSend","onFocus","onBlur","onVoice","emitError","rightActions"]);const ge=M(),ye=l(null),[be,xe]=o("calc(var(--bothub-scale, 1) * 18px)"),[je,De]="string"==typeof W?[W,ae]:o(""),[$e,Ae]=Array.isArray(_)?[_,ce]:o([]),[ke,we]=o(!q&&ie),[Ce,Fe]=o(!1),[Ee,Te]=o(!1),[Se,Ke]=o(null),Le=l(null),Pe=l(null),Oe=l([]),Ue=l(null),Ve=l(!1),Be=l(null),[He,Ie]=o(X),[Ne,Me]=o(!1),Re=a((()=>{Ie(!1),null==oe||oe(!1),Me(!1)}),[]),ze=a((()=>{Ie(!0),null==oe||oe(!0),Me(!1)}),[]),Ge=a((e=>{we(!0),null==ue||ue(e)}),[ue]),We=a((e=>{we(!1),null==pe||pe(e)}),[pe]),_e=a((e=>{null==De||De(e.target.value),null==se||se(e)}),[De,se]),qe=a((e=>{const t=ye.current;null!==t&&(t.style.height="calc(var(--bothub-scale, 1) * 18px)",t.style.height=`${e.currentTarget.scrollHeight}px`,t.focus(),xe(`${e.currentTarget.scrollHeight}px`))}),[]),Je=a((e=>t(void 0,void 0,void 0,(function*(){var t;if(!e.length)return;const n=[],r=[],i=yield Promise.all(null==e?void 0:e.map(V));for(const[l,o]of e.entries()){null===(t=null==re?void 0:re.includes(o.type))||void 0===t||t?n.push({previewUrl:i[l],name:o.name,native:o}):r.push(o)}r.length>0&&(null==ve||ve({name:"WRONG_FILES",payload:r})),(null==n?void 0:n.length)>0&&(null==Ae||Ae([...$e,...n].slice(0,ee)))}))),[re,ve,ee,$e]),Qe=a((e=>t(void 0,void 0,void 0,(function*(){!ne&&e.clipboardData.files.length>0&&(e.preventDefault(),yield Je([...e.clipboardData.files]))}))),[Je,ne]),Xe=a((e=>t(void 0,void 0,void 0,(function*(){if(!Ae||!e.target.files)return;const t=yield B([...$e.map((({native:e})=>e)),...e.target.files]);Ae(t.slice(0,ee))}))),[$e,Ae,ee]),Ye=a((e=>{null==Ae||Ae($e.filter((({name:t})=>t!==e.name)))}),[Ae,$e]),Ze=a((e=>{e.stopPropagation(),null==de||de(je,$e),xe("calc(var(--bothub-scale, 1) * 18px)")}),[je,$e,de,De,Ae]),et=a((e=>{e.stopPropagation();const t=He?"enter":"ctrl/shift+enter";let n="";if("Enter"===e.key&&(e.shiftKey||e.ctrlKey))n="ctrl/shift+enter";else{if("Enter"!==e.key)return;n="enter"}if(ke&&"Enter"===e.key){if(n===t&&e.ctrlKey){e.preventDefault();const t=ye.current;if(!t)return;const n=t.value,l=t.selectionStart,o=n.slice(0,l),a=n.slice(l);null==De||De(`${o}\n${a}`),r=t,i=l+1,setTimeout((()=>{r.selectionStart=i,r.selectionEnd=i}),1)}t!==n&&""!==n&&(e.preventDefault(),null==de||de(je,$e),xe("calc(var(--bothub-scale, 1) * 18px)"))}var r,i}),[ke,je,$e,de,De,Ae]),tt=a((()=>{var e;null===(e=ye.current)||void 0===e||e.focus()}),[]),nt=a((e=>{e.stopPropagation()}),[]),rt=a((e=>{e.preventDefault(),e.stopPropagation(),Ee?ot():it(e)}),[Ee]),it=a((e=>t(void 0,void 0,void 0,(function*(){Ve.current=!0,e.stopPropagation();const t=yield navigator.mediaDevices.getUserMedia({audio:!0}),n=new MediaRecorder(t,{mimeType:N()});Ve.current&&(n.start(),Le.current=n,Pe.current=t,Ue.current=window.setInterval((()=>{Ke((e=>(null!=e?e:0)+.1))}),100),Te(!0),Ke(0))}))),[Ve.current,Oe.current]),lt=a((()=>{const e=Le.current,t=Pe.current,n=Ue.current;if(Ee&&e&&t&&n){e.stop();for(const e of t.getTracks())e.stop();window.clearInterval(n)}}),[Ee,Le.current,Pe.current,Ue.current]),ot=a((()=>t(void 0,void 0,void 0,(function*(){Ve.current=!1,Ee&<()}))),[Ee,lt]);c((()=>{const e=ye.current,t=document.activeElement===e;e&&ie?e.focus():t||we(!1)}),[q]),c((()=>{const e=ye.current;if(null!==e)return e.addEventListener("keydown",et),()=>{e.removeEventListener("keydown",et)}}),[et]),c((()=>{Ae&&_&&Ae(_)}),[_]),"undefined"!=typeof window&&s((()=>{const e=ye.current;null!==e&&(e.style.height=`${e.scrollHeight}px`,e.scrollTop=e.scrollHeight,ie&&e.focus())}),[je,ie]),c((()=>{const e=Le.current,n=e=>{e.data.size>0&&Oe.current.push(e.data)},r=()=>t(void 0,void 0,void 0,(function*(){const e=new Blob(Oe.current,{type:N()});yield null==me?void 0:me(e),Le.current=null,Pe.current=null,Oe.current=[],Ue.current=null,Te(!1),Ke(null)}));return e&&(e.addEventListener("dataavailable",n),e.addEventListener("stop",r)),()=>{e&&(e.removeEventListener("dataavailable",n),e.removeEventListener("stop",r)),lt()}}),[Le.current]),u(Be,(()=>{Me(!1)}));const at=d(Ne,{from:{opacity:0,y:10},enter:{opacity:1,y:0},leave:{opacity:0,y:10},config:{duration:150,ease:"easeOut"}});return n(p,{$active:ke,$dragActive:Ce,$disabled:q,$textAreaDisabled:Q,$voiceRecording:Ee,className:z,onClick:tt,onDragEnter:()=>Fe(!0),onDragLeave:()=>Fe(!1),onDragOver:e=>(e.stopPropagation(),e.preventDefault(),!1),onDrop:e=>t(void 0,void 0,void 0,(function*(){if(e.dataTransfer.files.length>0)return e.stopPropagation(),e.preventDefault(),yield Je([...e.dataTransfer.files]),Fe(!1),!1})),children:r(m,{children:[!te&&!Ee&&r(v,{onClick:nt,children:[n(h,{type:"file",accept:re,multiple:!0,disabled:$e.length>=ee||q||ne,onChange:Xe},$e.length),n(f,{disabled:$e.length>=ee||q||ne})]}),r(g,{children:[Ee&&null!==Se&&r(y,{children:[n(b,{}),n(x,{children:H(Se)})]}),!Ee&&r(i,{children:[$e.length>0&&n(j,{children:$e.map((e=>{let t;return t=e.previewUrl&&(e.name.match(/.png$/i)||e.name.match(/.jpg$/i)||e.name.match(/.jpeg$/i))?n(S,{src:e.previewUrl}):e.name.match(/.txt$/i)?n(L,{}):e.name.match(/.docx$/i)?n(P,{}):e.name.match(/.xlsx$/i)?n(O,{}):e.name.match(/.pdf$/i)?n(K,{}):n(I,{}),t=n(U,{size:18,children:t}),n(D,{start:t,onDelete:Ye.bind(null,e),children:e.name.length>20?`...${e.name.slice(-20)}`:e.name},e.name)}))}),(!Q||Q&&G&&$e.length!==ee||Q&&je)&&n($,Object.assign({$disabled:q},fe,{ref:ye,value:je,placeholder:G,disabled:q||Q,style:Object.assign(Object.assign({},fe.style),{height:be}),onFocus:Ge,onBlur:We,onChange:_e,onInput:qe,onPaste:Qe}))]})]}),!!Y&&!!Z&&r(A,{ref:Be,children:[n(k,{onClick:e=>{e.stopPropagation(),Me(!Ne)},disabled:q}),at(((e,t)=>t&&r(w,{style:e,children:[n(C,{active:!He,onClick:Re,children:Y}),n(C,{active:He,onClick:ze,children:Z})]},"alternative-key-modal")))]}),he,!le||je||$e.length>0?n(F,{disabled:q||J,onClick:Ze,children:n(E,{})}):n(F,Object.assign({},Ee&&{color:ge.colors.critic},{disabled:q||J,onClick:rt,children:n(Ee?E:T,{})}))]})})};export{R as InputMessage};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { TariffType } from './types';
|
|
3
3
|
export interface TariffCardRowProps extends React.ComponentProps<'div'> {
|
|
4
|
-
name:
|
|
4
|
+
name: TariffType;
|
|
5
5
|
description?: string;
|
|
6
6
|
giveCaps?: string;
|
|
7
7
|
giveCapsText?: string;
|
|
@@ -10,7 +10,7 @@ export interface TariffCardRowProps extends React.ComponentProps<'div'> {
|
|
|
10
10
|
oldPrice?: string;
|
|
11
11
|
selected?: boolean;
|
|
12
12
|
variant?: 'main' | 'dashboard';
|
|
13
|
-
color?: TariffCardColor;
|
|
14
13
|
isDefault?: boolean;
|
|
14
|
+
textDiscount?: string;
|
|
15
15
|
}
|
|
16
16
|
export declare const TariffCardRow: React.FC<TariffCardRowProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__rest as e}from"tslib";import{jsxs as
|
|
1
|
+
import{__rest as e}from"tslib";import{jsxs as i,jsx as r}from"react/jsx-runtime";import{useRef as n,Suspense as a,lazy as t}from"react";import{TariffCardStyled as c,TariffCardStyledContent as l,TarrifCardStyledLeft as d,TarrifCardStyledRadio as o,TariffCardContainer as s,TariffCardStyledName as h,TariffCardStyledGiveCaps as v,TariffCardGiveCapsText as $,TariffCardGiveCapsBadge as m,TariffCardGiveCapsBadgeText as u,TariffCardStyledMiddle as f,TariffCardStyledDescriptionIcon as p,TariffCardStyledDescription as g,TarrifCardStyledRight as C,TariffCardStyledPrice as x,TariffCardStyledCurrency as D,TariffCardStyledOldPriceWrapper as j,TariffCardStyledOldPrice as k,TariffCardDiscountBadge as y,TariffCardDiscountBadgeText as T}from"./styled.js";const b=t((()=>import("./tariff-card-images/index.js").then((e=>({default:e.TariffCardImages}))))),P=t=>{var{name:P,giveCaps:q,price:I,variant:O="main",currency:S,onChange:w,giveCapsText:z,selected:A,isDefault:B=!0,oldPrice:E,children:F,description:G,textDiscount:H}=t,J=e(t,["name","giveCaps","price","variant","currency","onChange","giveCapsText","selected","isDefault","oldPrice","children","description","textDiscount"]);const K=n(null);return i(c,Object.assign({$variant:O,onClick:()=>{var e;const i=null===(e=K.current)||void 0===e?void 0:e.querySelector("input");i&&i.click()},ref:K,$selected:A},J,{children:[!B&&r(a,{children:r(b,{variant:O,name:P})}),i(l,{$variant:O,children:[i(d,{$variant:O,children:[r(o,{onClick:w,checked:A,name:"tariff",value:P}),i(s,{$variant:O,children:[r(h,{$color:P,children:P}),i(v,{children:[r($,{children:z}),r(m,{children:r(u,{children:q})})]})]}),i(f,{children:[r(p,{$variant:O}),r(g,{children:G})]})]}),i(C,{$variant:O,children:[r(x,{$isDefault:B,$variant:O,children:I}),r(D,{$isDefault:B,$variant:O,children:S}),!B&&E&&r(j,{$variant:O,children:r(k,{$variant:O,children:`${E} ${S}`})})]})]}),H&&r(y,{$active:!!A,children:r(T,{$active:!!A,children:H})})]}))};export{P as TariffCardRow};
|
|
@@ -1,10 +1,290 @@
|
|
|
1
|
-
import { TariffCardColor } from './types';
|
|
1
|
+
import { TariffCardColor, TariffType } from './types';
|
|
2
2
|
export type Variant = 'main' | 'dashboard';
|
|
3
3
|
export interface TariffCardProps {
|
|
4
4
|
$color?: TariffCardColor;
|
|
5
|
-
selected?: boolean;
|
|
5
|
+
$selected?: boolean;
|
|
6
6
|
$variant: Variant;
|
|
7
7
|
}
|
|
8
|
+
export declare const TariffCardDiscountBadge: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
9
|
+
$active: boolean;
|
|
10
|
+
}>>;
|
|
11
|
+
export declare const TariffCardDiscountBadgeText: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<{
|
|
12
|
+
variant?: import("@/ui/components/typography").TypographyVariant | undefined;
|
|
13
|
+
component?: import("@/ui/components/typography").TypographyComponent | undefined;
|
|
14
|
+
align?: import("@/ui/components/typography").TypographyAlign | undefined;
|
|
15
|
+
fullWidth?: boolean | undefined;
|
|
16
|
+
href?: string | undefined;
|
|
17
|
+
target?: import("react").HTMLAttributeAnchorTarget | undefined;
|
|
18
|
+
children?: import("react").ReactNode;
|
|
19
|
+
hidden?: boolean | undefined | undefined;
|
|
20
|
+
color?: string | undefined | undefined;
|
|
21
|
+
content?: string | undefined | undefined;
|
|
22
|
+
style?: import("react").CSSProperties | undefined;
|
|
23
|
+
key?: import("react").Key | null | undefined;
|
|
24
|
+
defaultChecked?: boolean | undefined | undefined;
|
|
25
|
+
defaultValue?: string | number | readonly string[] | undefined;
|
|
26
|
+
suppressContentEditableWarning?: boolean | undefined | undefined;
|
|
27
|
+
suppressHydrationWarning?: boolean | undefined | undefined;
|
|
28
|
+
accessKey?: string | undefined | undefined;
|
|
29
|
+
autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
|
|
30
|
+
autoFocus?: boolean | undefined | undefined;
|
|
31
|
+
className?: string | undefined | undefined;
|
|
32
|
+
contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
|
|
33
|
+
contextMenu?: string | undefined | undefined;
|
|
34
|
+
dir?: string | undefined | undefined;
|
|
35
|
+
draggable?: (boolean | "false" | "true") | undefined;
|
|
36
|
+
enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
37
|
+
id?: string | undefined | undefined;
|
|
38
|
+
lang?: string | undefined | undefined;
|
|
39
|
+
nonce?: string | undefined | undefined;
|
|
40
|
+
slot?: string | undefined | undefined;
|
|
41
|
+
spellCheck?: (boolean | "false" | "true") | undefined;
|
|
42
|
+
tabIndex?: number | undefined | undefined;
|
|
43
|
+
title?: string | undefined | undefined;
|
|
44
|
+
translate?: "yes" | "no" | undefined | undefined;
|
|
45
|
+
radioGroup?: string | undefined | undefined;
|
|
46
|
+
role?: import("react").AriaRole | undefined;
|
|
47
|
+
about?: string | undefined | undefined;
|
|
48
|
+
datatype?: string | undefined | undefined;
|
|
49
|
+
inlist?: any;
|
|
50
|
+
prefix?: string | undefined | undefined;
|
|
51
|
+
property?: string | undefined | undefined;
|
|
52
|
+
rel?: string | undefined | undefined;
|
|
53
|
+
resource?: string | undefined | undefined;
|
|
54
|
+
rev?: string | undefined | undefined;
|
|
55
|
+
typeof?: string | undefined | undefined;
|
|
56
|
+
vocab?: string | undefined | undefined;
|
|
57
|
+
autoCorrect?: string | undefined | undefined;
|
|
58
|
+
autoSave?: string | undefined | undefined;
|
|
59
|
+
itemProp?: string | undefined | undefined;
|
|
60
|
+
itemScope?: boolean | undefined | undefined;
|
|
61
|
+
itemType?: string | undefined | undefined;
|
|
62
|
+
itemID?: string | undefined | undefined;
|
|
63
|
+
itemRef?: string | undefined | undefined;
|
|
64
|
+
results?: number | undefined | undefined;
|
|
65
|
+
security?: string | undefined | undefined;
|
|
66
|
+
unselectable?: "on" | "off" | undefined | undefined;
|
|
67
|
+
inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
|
|
68
|
+
is?: string | undefined | undefined;
|
|
69
|
+
"aria-activedescendant"?: string | undefined | undefined;
|
|
70
|
+
"aria-atomic"?: (boolean | "false" | "true") | undefined;
|
|
71
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
|
|
72
|
+
"aria-braillelabel"?: string | undefined | undefined;
|
|
73
|
+
"aria-brailleroledescription"?: string | undefined | undefined;
|
|
74
|
+
"aria-busy"?: (boolean | "false" | "true") | undefined;
|
|
75
|
+
"aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
76
|
+
"aria-colcount"?: number | undefined | undefined;
|
|
77
|
+
"aria-colindex"?: number | undefined | undefined;
|
|
78
|
+
"aria-colindextext"?: string | undefined | undefined;
|
|
79
|
+
"aria-colspan"?: number | undefined | undefined;
|
|
80
|
+
"aria-controls"?: string | undefined | undefined;
|
|
81
|
+
"aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
|
|
82
|
+
"aria-describedby"?: string | undefined | undefined;
|
|
83
|
+
"aria-description"?: string | undefined | undefined;
|
|
84
|
+
"aria-details"?: string | undefined | undefined;
|
|
85
|
+
"aria-disabled"?: (boolean | "false" | "true") | undefined;
|
|
86
|
+
"aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
|
|
87
|
+
"aria-errormessage"?: string | undefined | undefined;
|
|
88
|
+
"aria-expanded"?: (boolean | "false" | "true") | undefined;
|
|
89
|
+
"aria-flowto"?: string | undefined | undefined;
|
|
90
|
+
"aria-grabbed"?: (boolean | "false" | "true") | undefined;
|
|
91
|
+
"aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
|
|
92
|
+
"aria-hidden"?: (boolean | "false" | "true") | undefined;
|
|
93
|
+
"aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
|
|
94
|
+
"aria-keyshortcuts"?: string | undefined | undefined;
|
|
95
|
+
"aria-label"?: string | undefined | undefined;
|
|
96
|
+
"aria-labelledby"?: string | undefined | undefined;
|
|
97
|
+
"aria-level"?: number | undefined | undefined;
|
|
98
|
+
"aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
|
|
99
|
+
"aria-modal"?: (boolean | "false" | "true") | undefined;
|
|
100
|
+
"aria-multiline"?: (boolean | "false" | "true") | undefined;
|
|
101
|
+
"aria-multiselectable"?: (boolean | "false" | "true") | undefined;
|
|
102
|
+
"aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
|
|
103
|
+
"aria-owns"?: string | undefined | undefined;
|
|
104
|
+
"aria-placeholder"?: string | undefined | undefined;
|
|
105
|
+
"aria-posinset"?: number | undefined | undefined;
|
|
106
|
+
"aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
|
|
107
|
+
"aria-readonly"?: (boolean | "false" | "true") | undefined;
|
|
108
|
+
"aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
|
|
109
|
+
"aria-required"?: (boolean | "false" | "true") | undefined;
|
|
110
|
+
"aria-roledescription"?: string | undefined | undefined;
|
|
111
|
+
"aria-rowcount"?: number | undefined | undefined;
|
|
112
|
+
"aria-rowindex"?: number | undefined | undefined;
|
|
113
|
+
"aria-rowindextext"?: string | undefined | undefined;
|
|
114
|
+
"aria-rowspan"?: number | undefined | undefined;
|
|
115
|
+
"aria-selected"?: (boolean | "false" | "true") | undefined;
|
|
116
|
+
"aria-setsize"?: number | undefined | undefined;
|
|
117
|
+
"aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
|
|
118
|
+
"aria-valuemax"?: number | undefined | undefined;
|
|
119
|
+
"aria-valuemin"?: number | undefined | undefined;
|
|
120
|
+
"aria-valuenow"?: number | undefined | undefined;
|
|
121
|
+
"aria-valuetext"?: string | undefined | undefined;
|
|
122
|
+
dangerouslySetInnerHTML?: {
|
|
123
|
+
__html: string | TrustedHTML;
|
|
124
|
+
} | undefined | undefined;
|
|
125
|
+
onCopy?: import("react").ClipboardEventHandler<HTMLSpanElement> | undefined;
|
|
126
|
+
onCopyCapture?: import("react").ClipboardEventHandler<HTMLSpanElement> | undefined;
|
|
127
|
+
onCut?: import("react").ClipboardEventHandler<HTMLSpanElement> | undefined;
|
|
128
|
+
onCutCapture?: import("react").ClipboardEventHandler<HTMLSpanElement> | undefined;
|
|
129
|
+
onPaste?: import("react").ClipboardEventHandler<HTMLSpanElement> | undefined;
|
|
130
|
+
onPasteCapture?: import("react").ClipboardEventHandler<HTMLSpanElement> | undefined;
|
|
131
|
+
onCompositionEnd?: import("react").CompositionEventHandler<HTMLSpanElement> | undefined;
|
|
132
|
+
onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLSpanElement> | undefined;
|
|
133
|
+
onCompositionStart?: import("react").CompositionEventHandler<HTMLSpanElement> | undefined;
|
|
134
|
+
onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLSpanElement> | undefined;
|
|
135
|
+
onCompositionUpdate?: import("react").CompositionEventHandler<HTMLSpanElement> | undefined;
|
|
136
|
+
onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLSpanElement> | undefined;
|
|
137
|
+
onFocus?: import("react").FocusEventHandler<HTMLSpanElement> | undefined;
|
|
138
|
+
onFocusCapture?: import("react").FocusEventHandler<HTMLSpanElement> | undefined;
|
|
139
|
+
onBlur?: import("react").FocusEventHandler<HTMLSpanElement> | undefined;
|
|
140
|
+
onBlurCapture?: import("react").FocusEventHandler<HTMLSpanElement> | undefined;
|
|
141
|
+
onChange?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
142
|
+
onChangeCapture?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
143
|
+
onBeforeInput?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
144
|
+
onBeforeInputCapture?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
145
|
+
onInput?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
146
|
+
onInputCapture?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
147
|
+
onReset?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
148
|
+
onResetCapture?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
149
|
+
onSubmit?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
150
|
+
onSubmitCapture?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
151
|
+
onInvalid?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
152
|
+
onInvalidCapture?: import("react").FormEventHandler<HTMLSpanElement> | undefined;
|
|
153
|
+
onLoad?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
154
|
+
onLoadCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
155
|
+
onError?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
156
|
+
onErrorCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
157
|
+
onKeyDown?: import("react").KeyboardEventHandler<HTMLSpanElement> | undefined;
|
|
158
|
+
onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLSpanElement> | undefined;
|
|
159
|
+
onKeyPress?: import("react").KeyboardEventHandler<HTMLSpanElement> | undefined;
|
|
160
|
+
onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLSpanElement> | undefined;
|
|
161
|
+
onKeyUp?: import("react").KeyboardEventHandler<HTMLSpanElement> | undefined;
|
|
162
|
+
onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLSpanElement> | undefined;
|
|
163
|
+
onAbort?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
164
|
+
onAbortCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
165
|
+
onCanPlay?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
166
|
+
onCanPlayCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
167
|
+
onCanPlayThrough?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
168
|
+
onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
169
|
+
onDurationChange?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
170
|
+
onDurationChangeCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
171
|
+
onEmptied?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
172
|
+
onEmptiedCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
173
|
+
onEncrypted?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
174
|
+
onEncryptedCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
175
|
+
onEnded?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
176
|
+
onEndedCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
177
|
+
onLoadedData?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
178
|
+
onLoadedDataCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
179
|
+
onLoadedMetadata?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
180
|
+
onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
181
|
+
onLoadStart?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
182
|
+
onLoadStartCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
183
|
+
onPause?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
184
|
+
onPauseCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
185
|
+
onPlay?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
186
|
+
onPlayCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
187
|
+
onPlaying?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
188
|
+
onPlayingCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
189
|
+
onProgress?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
190
|
+
onProgressCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
191
|
+
onRateChange?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
192
|
+
onRateChangeCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
193
|
+
onResize?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
194
|
+
onResizeCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
195
|
+
onSeeked?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
196
|
+
onSeekedCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
197
|
+
onSeeking?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
198
|
+
onSeekingCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
199
|
+
onStalled?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
200
|
+
onStalledCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
201
|
+
onSuspend?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
202
|
+
onSuspendCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
203
|
+
onTimeUpdate?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
204
|
+
onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
205
|
+
onVolumeChange?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
206
|
+
onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
207
|
+
onWaiting?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
208
|
+
onWaitingCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
209
|
+
onAuxClick?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
210
|
+
onAuxClickCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
211
|
+
onClick?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
212
|
+
onClickCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
213
|
+
onContextMenu?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
214
|
+
onContextMenuCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
215
|
+
onDoubleClick?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
216
|
+
onDoubleClickCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
217
|
+
onDrag?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
218
|
+
onDragCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
219
|
+
onDragEnd?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
220
|
+
onDragEndCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
221
|
+
onDragEnter?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
222
|
+
onDragEnterCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
223
|
+
onDragExit?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
224
|
+
onDragExitCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
225
|
+
onDragLeave?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
226
|
+
onDragLeaveCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
227
|
+
onDragOver?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
228
|
+
onDragOverCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
229
|
+
onDragStart?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
230
|
+
onDragStartCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
231
|
+
onDrop?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
232
|
+
onDropCapture?: import("react").DragEventHandler<HTMLSpanElement> | undefined;
|
|
233
|
+
onMouseDown?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
234
|
+
onMouseDownCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
235
|
+
onMouseEnter?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
236
|
+
onMouseLeave?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
237
|
+
onMouseMove?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
238
|
+
onMouseMoveCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
239
|
+
onMouseOut?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
240
|
+
onMouseOutCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
241
|
+
onMouseOver?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
242
|
+
onMouseOverCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
243
|
+
onMouseUp?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
244
|
+
onMouseUpCapture?: import("react").MouseEventHandler<HTMLSpanElement> | undefined;
|
|
245
|
+
onSelect?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
246
|
+
onSelectCapture?: import("react").ReactEventHandler<HTMLSpanElement> | undefined;
|
|
247
|
+
onTouchCancel?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
248
|
+
onTouchCancelCapture?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
249
|
+
onTouchEnd?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
250
|
+
onTouchEndCapture?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
251
|
+
onTouchMove?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
252
|
+
onTouchMoveCapture?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
253
|
+
onTouchStart?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
254
|
+
onTouchStartCapture?: import("react").TouchEventHandler<HTMLSpanElement> | undefined;
|
|
255
|
+
onPointerDown?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
256
|
+
onPointerDownCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
257
|
+
onPointerMove?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
258
|
+
onPointerMoveCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
259
|
+
onPointerUp?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
260
|
+
onPointerUpCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
261
|
+
onPointerCancel?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
262
|
+
onPointerCancelCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
263
|
+
onPointerEnter?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
264
|
+
onPointerLeave?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
265
|
+
onPointerOver?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
266
|
+
onPointerOverCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
267
|
+
onPointerOut?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
268
|
+
onPointerOutCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
269
|
+
onGotPointerCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
270
|
+
onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
271
|
+
onLostPointerCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
272
|
+
onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLSpanElement> | undefined;
|
|
273
|
+
onScroll?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
|
|
274
|
+
onScrollCapture?: import("react").UIEventHandler<HTMLSpanElement> | undefined;
|
|
275
|
+
onWheel?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
|
|
276
|
+
onWheelCapture?: import("react").WheelEventHandler<HTMLSpanElement> | undefined;
|
|
277
|
+
onAnimationStart?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
|
|
278
|
+
onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
|
|
279
|
+
onAnimationEnd?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
|
|
280
|
+
onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
|
|
281
|
+
onAnimationIteration?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
|
|
282
|
+
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLSpanElement> | undefined;
|
|
283
|
+
onTransitionEnd?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
|
|
284
|
+
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
|
|
285
|
+
}, {
|
|
286
|
+
$active: boolean;
|
|
287
|
+
}>>;
|
|
8
288
|
export declare const TariffCardStyled: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, TariffCardProps>>;
|
|
9
289
|
export declare const TariffCardContainer: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
10
290
|
$variant: Variant;
|
|
@@ -16,7 +296,7 @@ export declare const TarrifCardStyledLeft: import("styled-components").IStyledCo
|
|
|
16
296
|
$variant: Variant;
|
|
17
297
|
}>>;
|
|
18
298
|
export declare const TariffCardStyledName: React.FC<{
|
|
19
|
-
$color:
|
|
299
|
+
$color: TariffType;
|
|
20
300
|
children?: React.ReactNode;
|
|
21
301
|
}>;
|
|
22
302
|
export declare const TariffCardStyledMiddle: import("styled-components").IStyledComponent<"web", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{styled as e,css as t}from"styled-components";import{adaptive as i}from"../../../adaptive/index.js";import{Typography as a}from"../../typography/index.js";import{Badge as o}from"../../badge/index.js";import{Radio as r}from"../../radio/index.js";import{CheckCircleIcon as
|
|
1
|
+
import{styled as e,css as t}from"styled-components";import{adaptive as i}from"../../../adaptive/index.js";import{Typography as a}from"../../typography/index.js";import{Badge as o}from"../../badge/index.js";import{Radio as r}from"../../radio/index.js";import{CheckCircleIcon as n}from"../../../icons/check-circle/index.js";const l=e.div.withConfig({displayName:"styled__TariffCardDiscountBadge",componentId:"sc-1vcswlw-0"})(["position:absolute;overflow:hidden;display:flex;align-items:center;top:0;right:0;border-bottom-left-radius:14px;padding:2px 16px;&:before{transition:all 0.3s ease;content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:",";opacity:",";}"],(({theme:e})=>e.colors.premiumGradient),(({$active:e})=>e?.6:.3)),d=e(a).attrs({variant:"body-s-medium"}).withConfig({displayName:"styled__TariffCardDiscountBadgeText",componentId:"sc-1vcswlw-1"})(["transition:all 0.3s ease;position:relative;z-index:2;text-align:center;white-space:nowrap;",""],(({theme:e,$active:t})=>`\n color: ${t?e.default.colors.base.white:"light"===e.mode?e.default.colors.accent.primary:e.default.colors.accent.primaryLight};\n \n `)),s=e.div.withConfig({displayName:"styled__TariffCardStyled",componentId:"sc-1vcswlw-2"})(["position:relative;display:flex;cursor:pointer;width:100%;overflow:hidden;padding:16px 34px;"," box-sizing:border-box;opacity:0.9;background:",";border-radius:14px;"," "," ",";&:hover{&:before{background:",";opacity:0.2;}",":before{opacity:0.6;}","{color:white;}}&:before{transition:all 0.3s ease;content:'';position:absolute;width:100%;height:100%;opacity:0.3;left:0;top:0;",";}"],(({$variant:e})=>i({variant:e,merge:!0,tablet:t(["padding:16px 16px;"]),mobile:t(["padding:14px;"])})),(({theme:e})=>e.colors.grayScale.gray7),(({$selected:e,theme:i})=>e&&"light"===i.mode&&t(["background-color:",";"],i.colors.grayScale.gray3)),(({$selected:e,theme:i})=>e&&"dark"===i.mode&&t(["background-color:",";"],i.colors.grayScale.gray3)),(({theme:e})=>"dark"===e.mode&&t(["&:after{display:block;content:'';position:absolute;width:1070px;height:216.23px;gap:0px;left:-240px;top:-200px;filter:blur(50px);transform:rotate(-4.41deg);box-shadow:0px 0px 10px rgba(0,0,0,0.5);background:linear-gradient( 90.98deg,#2244f4 7.53%,rgba(252,94,255,0.4) 72.48% );border-radius:50%;z-index:-1;}"])),(({theme:e,$selected:t})=>t?"linear-gradient(90deg, #0047FF 0%, #A700FF 100%)":e.colors.accent.primary),l,d,(({$selected:e})=>e&&"background: linear-gradient(90deg, #0047FF 0%, #A700FF 100%)")),c=e.div.withConfig({displayName:"styled__TariffCardContainer",componentId:"sc-1vcswlw-3"})(["display:flex;flex-direction:column;",""],(({$variant:e})=>{switch(e){case"dashboard":return i({variant:"dashboard",desktop:t(["min-width:210px;"]),tablet:t(["min-width:185px;"]),mobile:t(["min-width:210px;"])});case"main":return i({variant:"main",desktop:t(["min-width:210px;"]),tablet:t(["min-width:235px;"]),mobile:t(["min-width:210px;"])})}})),p=e.div.withConfig({displayName:"styled__TariffCardStyledContent",componentId:"sc-1vcswlw-4"})(["position:relative;display:flex;width:100%;justify-content:space-between;align-items:center;gap:34px;",""],(({$variant:e})=>i({variant:e,merge:!0,tablet:t(["gap:32px;"]),mobile:t(["flex-wrap:wrap;gap:10px;"])}))),m=e.div.withConfig({displayName:"styled__TarrifCardStyledLeft",componentId:"sc-1vcswlw-5"})(["position:relative;display:flex;align-items:center;gap:14px;",""],(({$variant:e})=>i({variant:e,mobile:t(["flex-wrap:wrap;"])}))),w=e(a).attrs({variant:"body-xl-semibold",component:"h3"}).withConfig({displayName:"styled__TariffCardStyledName",componentId:"sc-1vcswlw-6"})(["background-clip:text;-webkit-background-clip:text;width:fit-content;-webkit-text-fill-color:transparent;background-image:",";background-color:",";"],(({theme:e,$color:t})=>{switch(t){case"Basic":return e.colors.accent.primary;case"Premium":return e.colors.gradient.premium;case"Deluxe":return e.colors.gradient.deluxe;case"Elite":return e.colors.gradient.elite;default:return e.colors.base.white}}),(({theme:e,$color:t})=>{switch(t){case"Basic":return e.colors.accent.primary;case"Premium":return e.colors.gradient.premium;case"Deluxe":return e.colors.gradient.deluxe;case"Elite":return e.colors.gradient.elite;default:return e.colors.base.white}})),f=e.div.withConfig({displayName:"styled__TariffCardStyledMiddle",componentId:"sc-1vcswlw-7"})(["width:100%;display:flex;justify-content:flex-start;align-items:center;gap:10px;"]),g=e(a).attrs({variant:"body-s-semibold"}).withConfig({displayName:"styled__TariffCardStyledDescription",componentId:"sc-1vcswlw-8"})(["width:100%;max-width:518px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;"]),h=e.div.withConfig({displayName:"styled__TarrifCardStyledRight",componentId:"sc-1vcswlw-9"})(["position:relative;white-space:nowrap;display:flex;align-items:flex-end;justify-content:flex-end;gap:5px;width:200px;margin-right:clamp(0rem,-6.366rem + 18.519vw,3.125rem);",""],(({$variant:e})=>i({variant:e,mobile:t(["position:absolute;right:0;top:0;padding:6px 0;"])}))),y=e(a).attrs({variant:"body-xxl-semibold"}).withConfig({displayName:"styled__TariffCardStyledPrice",componentId:"sc-1vcswlw-10"})(["color:",";",""],(({theme:e,$isDefault:t})=>t?e.colors.base.white:e.default.colors.base.white),(({$variant:e})=>i({variant:e,mobile:t(["color:",";"],(({theme:e})=>e.colors.base.white))}))),x=e(a).attrs({variant:"body-l-medium"}).withConfig({displayName:"styled__TariffCardStyledCurrency",componentId:"sc-1vcswlw-11"})(["padding-bottom:4px;color:",";",""],(({theme:e,$isDefault:t})=>t?e.colors.base.white:e.default.colors.base.white),(({$variant:e})=>i({variant:e,mobile:t(["color:",";"],(({theme:e})=>e.colors.base.white))}))),b=e.div.withConfig({displayName:"styled__TariffCardStyledOldPriceWrapper",componentId:"sc-1vcswlw-12"})(["position:absolute;display:flex;top:-10px;right:0;",""],(({$variant:e})=>i({variant:e,mobile:t(["top:-4px;right:0;"])}))),v=e(a).withConfig({displayName:"styled__TariffCardStyledOldPrice",componentId:"sc-1vcswlw-13"})(["color:",";"," width:100px;z-index:1;font-size:14px;font-weight:600;line-height:18.2px;text-align:right;text-decoration-line:line-through;text-underline-position:from-font;text-decoration-skip-ink:none;"],(({theme:e})=>e.default.colors.grayScale.gray6),(({$variant:e})=>i({variant:e,mobile:t(["color:",";"],(({theme:e})=>e.colors.base.white))}))),u=e(r).withConfig({displayName:"styled__TarrifCardStyledRadio",componentId:"sc-1vcswlw-14"})([""]),C=e.div.withConfig({displayName:"styled__TariffCardStyledGiveCaps",componentId:"sc-1vcswlw-15"})(["display:flex;align-items:center;gap:8px;"]),_=e(o).attrs({variant:"info"}).withConfig({displayName:"styled__TariffCardGiveCapsBadge",componentId:"sc-1vcswlw-16"})(["",""],(({theme:e})=>`\n background-color: ${"dark"===e.mode?e.colors.grayScale.gray2:e.colors.grayScale.gray5};\n color: ${e.default.colors.base.white};\n `)),k=e(a).attrs({variant:"body-s-medium"}).withConfig({displayName:"styled__TariffCardGiveCapsBadgeText",componentId:"sc-1vcswlw-17"})(["white-space:nowrap;",""],(({theme:e})=>`\n color: ${e.default.colors.base.white};\n `)),$=e(n).attrs({size:18}).withConfig({displayName:"styled__TariffCardStyledDescriptionIcon",componentId:"sc-1vcswlw-18"})(["",""],(({$variant:e})=>i({variant:e,mobile:t(["display:none;"])}))),T=e(a).attrs({variant:"body-xs-medium"}).withConfig({displayName:"styled__TariffCardGiveCapsText",componentId:"sc-1vcswlw-19"})(["white-space:nowrap;"]);export{c as TariffCardContainer,l as TariffCardDiscountBadge,d as TariffCardDiscountBadgeText,_ as TariffCardGiveCapsBadge,k as TariffCardGiveCapsBadgeText,T as TariffCardGiveCapsText,s as TariffCardStyled,p as TariffCardStyledContent,x as TariffCardStyledCurrency,g as TariffCardStyledDescription,$ as TariffCardStyledDescriptionIcon,C as TariffCardStyledGiveCaps,f as TariffCardStyledMiddle,w as TariffCardStyledName,v as TariffCardStyledOldPrice,b as TariffCardStyledOldPriceWrapper,y as TariffCardStyledPrice,m as TarrifCardStyledLeft,u as TarrifCardStyledRadio,h as TarrifCardStyledRight};
|
|
@@ -3,4 +3,4 @@ export interface TariffCardImagesProps {
|
|
|
3
3
|
variant: 'main' | 'dashboard';
|
|
4
4
|
name: TariffType;
|
|
5
5
|
}
|
|
6
|
-
export declare const TariffCardImages: ({ variant, name }: TariffCardImagesProps) => import("react/jsx-runtime").JSX.Element[];
|
|
6
|
+
export declare const TariffCardImages: ({ variant, name }: TariffCardImagesProps) => never[] | import("react/jsx-runtime").JSX.Element[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as r}from"react/jsx-runtime";import{TariffCardBackgroundGradientBasic as a,TariffCardBackgroundBlack as o,TariffCardBackgroundGradientPremium as t,TariffCardBackgroundGradientDeluxe as n,TariffCardBackgroundGradientElite as i}from"./styled.js";import{TariffCardDiscountLabel as
|
|
1
|
+
import{jsx as r}from"react/jsx-runtime";import{TariffCardBackgroundGradientBasic as a,TariffCardBackgroundBlack as o,TariffCardBackgroundGradientPremium as t,TariffCardBackgroundGradientDeluxe as n,TariffCardBackgroundGradientElite as i}from"./styled.js";import{TariffCardDiscountLabel as e}from"./discount-label.js";import{TariffCardBackgroundPercent as c}from"./background-percent.js";import{TariffCardBackgroundPercentMobile as l}from"./background-percent-mobile.js";const v=({variant:v,name:m})=>({Free:[],Basic:[r(a,{}),r(o,{$variant:v}),r(c,{variant:v,color:"#4785FF"}),r(l,{variant:v,color:"#4785FF"}),r(e,{variant:v,color:"#4785FF",percent:"30"})],Premium:[r(t,{}),r(o,{$variant:v}),r(c,{variant:v,color:"#1C64F2"}),r(l,{variant:v,color:"#1C64F2"}),r(e,{variant:v,color:"#1C64F2",percent:"30"})],Deluxe:[r(n,{}),r(o,{$variant:v}),r(c,{variant:v,color:"#734AD3"}),r(l,{variant:v,color:"#734AD3"}),r(e,{variant:v,color:"#734AD3",percent:"30"})],Elite:[r(i,{}),r(o,{$variant:v}),r(c,{variant:v,color:"#EE1CF2"}),r(l,{variant:v,color:"#EE1CF2"}),r(e,{variant:v,color:"#EE1CF2",percent:"20"})]}[m]);export{v as TariffCardImages};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import{styled as n,css as e}from"styled-components";const t=n=>e`
|
|
2
|
-
${({theme:e})=>{switch(n){case"h1":return`\n font-weight: 700;\n font-size: 46px;\n line-height: 60px;\n --skeleton-height: 60px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 40px;\n line-height: 52px;\n --skeleton-height: 52px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 28px;\n line-height: 36px;\n --skeleton-height: 36px;\n }\n `;case"h2":return`\n font-weight: 600;\n font-size: 34px;\n line-height: 44px;\n --skeleton-height: 44px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 30px;\n line-height: 40px;\n --skeleton-height: 40px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 24px;\n line-height: 32px;\n --skeleton-height: 32px;\n }\n `;case"h3":return`\n font-weight: 600;\n font-size: 30px;\n line-height: 40px;\n --skeleton-height: 40px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n `;case"body-xxxl-regular":return`\n font-size: 46px;\n font-weight: 400;\n line-height: 60px;\n --skeleton-height: 60px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 30px;\n line-height: 40px;\n --skeleton-height: 40px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 24px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n `;case"banner-h1-bold":return`\n font-size: 128px;\n font-weight: 700;\n line-height: 110px;\n --skeleton-height: 110px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 76px;\n line-height: 70px;\n --skeleton-height: 70px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 36px;\n line-height: 40px;\n --skeleton-height: 40px;\n }\n `;case"banner-h3-black":return`\n font-weight: 900;\n font-size: 40px;\n line-height: 40px;\n --skeleton-height: 40px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 24px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 20px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n `;case"body-h1-regular":return`\n font-weight: 400;\n font-size: 46px;\n line-height: 60px;\n --skeleton-height: 60px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 40px;\n line-height: 52px;\n --skeleton-height: 52px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 28px;\n line-height: 36px;\n --skeleton-height: 36px;\n }\n `;case"body-xxl-regular":return`\n font-weight: 400;\n font-size: 26px;\n line-height: 34px;\n --skeleton-height: 34px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 20px;\n line-height: 26px;\n --skeleton-height: 26px;\n }\n `;case"body-xxl-semibold":return`\n font-weight: 600;\n font-size: 26px;\n line-height: 34px;\n --skeleton-height: 34px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 20px;\n line-height: 26px;\n --skeleton-height: 26px;\n }\n `;case"body-xl-semibold":return`\n font-weight: 600;\n font-size: 22px;\n line-height: 29px;\n --skeleton-height: 29px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 20px;\n line-height: 26px;\n --skeleton-height: 26px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n `;case"body-m-semibold":return`\n font-weight: 600;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n }\n `;case"body-m-medium":return`\n font-weight: 500;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n }\n `;case"body-s-medium":return`\n font-weight: 500;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-s-semibold":return`\n font-weight: 600;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-s-regular":return`\n font-weight: 400;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-xs-regular":return`\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 10px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-m-regular":return`\n font-weight: 400;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n }\n `;case"body-l-regular":return`\n font-weight: 400;\n font-size: 18px;\n line-height: 23.4px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"body-l-semibold":return`\n font-weight: 600;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"body-l-medium":return`\n font-weight: 500;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"body-l-medium-italic":return`\n font-weight: 500;\n font-style: italic;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"button-sm":return"\n font-weight: 500;\n font-size: 15px;\n line-height: 20px;\n --skeleton-height: 20px;\n ";case"button-md":return"\n font-weight: 500;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n ";case"input-md":return"\n font-weight: 400;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n ";case"input-sm":return"\n font-weight: 400;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n ";case"body-xl-regular":return`\n font-size: 24px;\n font-weight: 400;\n line-height: 31.2px;\n --skeleton-height: 31.2px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n `;default:return""}}}
|
|
2
|
+
${({theme:e})=>{switch(n){case"h1":return`\n font-weight: 700;\n font-size: 46px;\n line-height: 60px;\n --skeleton-height: 60px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 40px;\n line-height: 52px;\n --skeleton-height: 52px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 28px;\n line-height: 36px;\n --skeleton-height: 36px;\n }\n `;case"h2":return`\n font-weight: 600;\n font-size: 34px;\n line-height: 44px;\n --skeleton-height: 44px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 30px;\n line-height: 40px;\n --skeleton-height: 40px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 24px;\n line-height: 32px;\n --skeleton-height: 32px;\n }\n `;case"h3":return`\n font-weight: 600;\n font-size: 30px;\n line-height: 40px;\n --skeleton-height: 40px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n `;case"body-xxxl-regular":return`\n font-size: 46px;\n font-weight: 400;\n line-height: 60px;\n --skeleton-height: 60px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 30px;\n line-height: 40px;\n --skeleton-height: 40px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 24px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n `;case"banner-h1-bold":return`\n font-size: 128px;\n font-weight: 700;\n line-height: 110px;\n --skeleton-height: 110px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 76px;\n line-height: 70px;\n --skeleton-height: 70px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 36px;\n line-height: 40px;\n --skeleton-height: 40px;\n }\n `;case"banner-h3-black":return`\n font-weight: 900;\n font-size: 40px;\n line-height: 40px;\n --skeleton-height: 40px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 24px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 20px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n `;case"body-h1-regular":return`\n font-weight: 400;\n font-size: 46px;\n line-height: 60px;\n --skeleton-height: 60px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 40px;\n line-height: 52px;\n --skeleton-height: 52px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 28px;\n line-height: 36px;\n --skeleton-height: 36px;\n }\n `;case"body-xxl-regular":return`\n font-weight: 400;\n font-size: 26px;\n line-height: 34px;\n --skeleton-height: 34px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 20px;\n line-height: 26px;\n --skeleton-height: 26px;\n }\n `;case"body-xxl-semibold":return`\n font-weight: 600;\n font-size: 26px;\n line-height: 34px;\n --skeleton-height: 34px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 20px;\n line-height: 26px;\n --skeleton-height: 26px;\n }\n `;case"body-xl-semibold":return`\n font-weight: 600;\n font-size: 22px;\n line-height: 29px;\n --skeleton-height: 29px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 20px;\n line-height: 26px;\n --skeleton-height: 26px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n `;case"body-m-semibold":return`\n font-weight: 600;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n }\n `;case"body-m-medium":return`\n font-weight: 500;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n }\n `;case"body-s-medium":return`\n font-weight: 500;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-s-semibold":return`\n font-weight: 600;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-s-regular":return`\n font-weight: 400;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-xs-regular":return`\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 10px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-xs-medium":return`\n font-weight: 500;\n font-size: 12px;\n line-height: 16px;\n --skeleton-height: 16px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 10px;\n line-height: 16px;\n --skeleton-height: 16px;\n }\n `;case"body-m-regular":return`\n font-weight: 400;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n }\n `;case"body-l-regular":return`\n font-weight: 400;\n font-size: 18px;\n line-height: 23.4px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"body-l-semibold":return`\n font-weight: 600;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"body-l-medium":return`\n font-weight: 500;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"body-l-medium-italic":return`\n font-weight: 500;\n font-style: italic;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n }\n `;case"button-sm":return"\n font-weight: 500;\n font-size: 15px;\n line-height: 20px;\n --skeleton-height: 20px;\n ";case"button-md":return"\n font-weight: 500;\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n ";case"input-md":return"\n font-weight: 400;\n font-size: 16px;\n line-height: 22px;\n --skeleton-height: 22px;\n ";case"input-sm":return"\n font-weight: 400;\n font-size: 14px;\n line-height: 18px;\n --skeleton-height: 18px;\n ";case"body-xl-regular":return`\n font-size: 24px;\n font-weight: 400;\n line-height: 31.2px;\n --skeleton-height: 31.2px;\n @media (max-width: ${e.tablet.maxWidth}) {\n font-size: 22px;\n line-height: 30px;\n --skeleton-height: 30px;\n }\n @media (max-width: ${e.mobile.maxWidth}) {\n font-size: 18px;\n line-height: 24px;\n --skeleton-height: 24px;\n }\n `;default:return""}}}
|
|
3
3
|
`,i=n.span.withConfig({displayName:"styled__TypographyStyled",componentId:"sc-6o5m6z-0"})(["margin:0px;color:",";font-weight:normal;text-decoration:none;text-align:",";--skeleton-width:200px;"," ",""],(({theme:n})=>n.colors.base.white),(({$align:n})=>n),(({$fullWidth:n})=>n&&"\n width: 100%;\n "),(({$variant:n})=>t(n)));export{i as TypographyStyled,t as getTypographyStyles};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export type TypographyVariant = 'h1' | 'h2' | 'h3' | 'body-xxxl-regular' | 'banner-h1-bold' | 'banner-h3-black' | 'body-xxl-regular' | 'body-h1-regular' | 'body-xxl-semibold' | 'body-xl-semibold' | 'body-xl-regular' | 'body-m-semibold' | 'body-m-medium' | 'body-m-regular' | 'body-s-medium' | 'body-s-semibold' | 'body-l-regular' | 'body-l-medium' | 'body-l-medium-italic' | 'body-s-regular' | 'body-xs-regular' | 'body-l-semibold' | 'button-sm' | 'button-md' | 'input-md' | 'input-sm';
|
|
1
|
+
export type TypographyVariant = 'h1' | 'h2' | 'h3' | 'body-xxxl-regular' | 'banner-h1-bold' | 'banner-h3-black' | 'body-xxl-regular' | 'body-h1-regular' | 'body-xxl-semibold' | 'body-xl-semibold' | 'body-xl-regular' | 'body-m-semibold' | 'body-m-medium' | 'body-m-regular' | 'body-s-medium' | 'body-s-semibold' | 'body-l-regular' | 'body-l-medium' | 'body-l-medium-italic' | 'body-s-regular' | 'body-xs-regular' | 'body-xs-medium' | 'body-l-semibold' | 'button-sm' | 'button-md' | 'input-md' | 'input-sm';
|
|
2
2
|
export type TypographyComponent = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'p' | 'div' | 'a' | 'code' | 'strong' | 'b' | 'em' | 'i' | 'li' | 'blockquote' | 'figcaption' | React.FC;
|
|
3
3
|
export type TypographyAlign = 'left' | 'center' | 'right';
|
package/dist/theme/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as a}from"react/jsx-runtime";import{createGlobalStyle as r,ThemeProvider as t}from"styled-components";import{useMemo as i}from"react";const
|
|
1
|
+
import{jsxs as e,jsx as a}from"react/jsx-runtime";import{createGlobalStyle as r,ThemeProvider as t}from"styled-components";import{useMemo as i}from"react";const g=r(["body{background:",";}"],(({theme:e})=>e.colors.base.black)),n={mode:"dark",colors:{base:{black:"#0E0C15",white:"#FFFFFF"},accent:{primary:"#1C64F2",primaryLight:"#4785ff",strong:"#073CA4",strongDown:"#0E3176"},grayScale:{gray1:"#616D8D",gray2:"#313E62",gray3:"#222B44",gray4:"#121825",gray5:"#374151",gray6:"#9CA3AF",gray7:"#171E2F"},premiumGradient:"linear-gradient(90deg, #1C64F2 -0.39%, #D41CF2 99.61%)",gradient:{basic:"linear-gradient(90deg, #00247D 0%, #1C64F2 100%)",light:"linear-gradient(90deg, #073DC3 0%, #4785FF 100%)",premium:"linear-gradient(90deg, #4785FF 0%, #7740F2 100%)",deluxe:"linear-gradient(90deg, #5728FF 0%, #A750FF 100%)",elite:"linear-gradient(90deg, #1C64F2 0%, #D41CF2 100%)",elite20:"linear-gradient(90deg, rgba(28,100,242,0.2) 0%, rgba(212,28,242,0.2) 100%)"},critic:"#FE4242",orange:"#F29C1C",purple:"#941CF2",aqua:"#1CB2F2",green:"#1ABB34",gpt3:"#28A08C",gpt4:"#735FFA"},tablet:{maxWidth:"1060px"},mobile:{maxWidth:"550px",minWidth:"400px"},zIndex:{scrollbarShadow:2,headerMenu:3,header:4,backdrop:5,menu:6,modal:7,select:8,notifications:9,tooltip:10},header:{height:"89px",mobile:{height:"70px"}},dashboard:{header:{height:"82px",tablet:{height:"76px"},mobile:{height:"70px"}},chat:{containerWidth:"1009px"},tablet:{maxWidth:"1060px"},miniTablet:{maxWidth:"900px"},mobile:{maxWidth:"600px",minWidth:"400px"}}},d=({mode:r="dark",sbMode:d=!1,children:o})=>{const F=i((()=>{switch(r){case"dark":return Object.assign(Object.assign({},n),{mode:"dark",default:n});case"light":return Object.assign(Object.assign({},n),{mode:"light",default:n,colors:Object.assign(Object.assign({},n.colors),{base:{black:"#FFFFFF",white:"#0E0C15"},accent:{primary:"#1C64F2",primaryLight:"#4785FF",strong:"#073CA4",strongDown:"#0E3176"},grayScale:{gray1:"#ADB8C0",gray2:"#CDD5DA",gray3:"#DBE0E4",gray4:"#F5F6F7",gray5:"#ADB5BD",gray6:"#DDE8F3",gray7:"#E6E9EC"}})})}}),[r]);return e(t,{theme:F,children:[o,d&&a(g,{})]})};export{g as StorybookGlobalStyle,d as ThemeProvider,n as defaultTheme};
|
package/dist/theme/types.d.ts
CHANGED
|
@@ -36,11 +36,20 @@ export interface ThemeGrayScaleColors {
|
|
|
36
36
|
gray6: string;
|
|
37
37
|
gray7: string;
|
|
38
38
|
}
|
|
39
|
+
export interface ThemeGradientColors {
|
|
40
|
+
basic: string;
|
|
41
|
+
light: string;
|
|
42
|
+
premium: string;
|
|
43
|
+
deluxe: string;
|
|
44
|
+
elite: string;
|
|
45
|
+
elite20: string;
|
|
46
|
+
}
|
|
39
47
|
export interface ThemeColors {
|
|
40
48
|
base: ThemeBaseColors;
|
|
41
49
|
accent: ThemeAccentColors;
|
|
42
50
|
grayScale: ThemeGrayScaleColors;
|
|
43
51
|
premiumGradient: string;
|
|
52
|
+
gradient: ThemeGradientColors;
|
|
44
53
|
critic: string;
|
|
45
54
|
orange: string;
|
|
46
55
|
purple: string;
|