@namba_one/ui-kit-2 1.0.0

package/dist/index.umd.js

@@ -0,0 +1 @@
+(function(m,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(m=typeof globalThis<"u"?globalThis:m||self,e(m.NambaOneUIKit={},m.Vue))})(this,function(m,e){"use strict";var We=Object.defineProperty;var He=(m,e,L)=>e in m?We(m,e,{enumerable:!0,configurable:!0,writable:!0,value:L}):m[e]=L;var G=(m,e,L)=>He(m,typeof e!="symbol"?e+"":e,L);function L(t,o,n){const s=t;let l;const r=(s.ownerDocument||document).defaultView;if(r&&r.getComputedStyle)return o=o.replace(/([A-Z])/g,"-$1").toLowerCase(),r.getComputedStyle(s,null).getPropertyValue(o);if(s.currentStyle)return o=o.replace(/\-(\w)/g,function(_,i){return i.toUpperCase()}),l=s.currentStyle[o],/^\d+(em|pt|%|ex)?$/i.test(l)?function(_){const i=s.style.left,u=s.runtimeStyle.left;return s.runtimeStyle.left=s.currentStyle.left,s.style.left=_||"0",_=s.style.pixelLeft+"px",s.style.left=i,s.runtimeStyle.left=u,_}(l):l}function le(t,o){switch(t){case"button":return{role:"button",type:"button"};case"router-link":return{to:o??{}};case"a":return{href:o,...!((o==null?void 0:o.indexOf("tel:"))!==-1||(o==null?void 0:o.indexOf("mailto:"))!==-1)&&{rel:"noopener noreferrer",target:"_blank"}};default:return{}}}const P=e.defineComponent({__name:"ButtonBase",props:{tag:{default:"button"},href:{},type:{default:"button"},isLoading:{type:Boolean},isDisabled:{type:Boolean}},emits:["click"],setup(t,{emit:o}){const n=o,s=e.computed(()=>({...t.tag==="button"&&{type:t.type},...le(t.tag,t.href),disabled:t.isLoading||t.isDisabled}));function l(r){if(!(t.isDisabled||t.isLoading))return n("click",r)}return(r,_)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.tag),e.mergeProps(s.value,{onClick:l}),{default:e.withCtx(()=>[e.renderSlot(r.$slots,"default")]),_:3},16))}}),ae={xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",style:{width:"1em",height:"1em",fill:"currentColor"}},re=["xlink:href"];function ie(t,o){return e.openBlock(),e.createElementBlock("svg",ae,[e.createElementVNode("use",{"xlink:href":"#"+t.name},null,8,re)])}const ce={name:"SvgIcon",props:{name:{type:String,required:!0}},render:ie},W=t=>`${Number(t/12).toFixed(3)}rem`,_e=e.defineComponent({__name:"Icon",props:{name:{},color:{},size:{}},setup(t){const o=e.useCssModule(),n=e.computed(()=>[o.root,o.color,o[`color_${t.color}`],o[t.name]]),s=e.computed(()=>t.size?{width:W(Number(t.size)),height:W(Number(t.size))}:{});return(l,r)=>(e.openBlock(),e.createBlock(e.unref(ce),{class:e.normalizeClass(n.value),name:l.name,style:e.normalizeStyle(s.value)},null,8,["class","name","style"]))}}),de={root:"Icon__root_9c34a",color:"Icon__color_9a568","color_brand-accent":"Icon__color_brand-accent_0f65a",color_secondary:"Icon__color_secondary_016e8",color_base:"Icon__color_base_49ca4",color_error:"Icon__color_error_21923",color_success:"Icon__color_success_e8b4a",color_inverse:"Icon__color_inverse_4d7fc",color_green:"Icon__color_green_35ae9",color_blue:"Icon__color_blue_c217d",color_red:"Icon__color_red_ecc39",color_disable:"Icon__color_disable_bf4c2"},S=(t,o)=>{const n=t.__vccOpts||t;for(const[s,l]of o)n[s]=l;return n},V=S(_e,[["__cssModules",{$style:de}]]),F=S(e.defineComponent({__name:"TheText",props:{testId:{},tag:{default:"p"},name:{},align:{},color:{},isEllipsis:{type:Boolean},numberOfLines:{},fontFamily:{}},setup(t){const o=e.useCssModule(),n=e.computed(()=>[o.root,o[`font_${t.name}`],o.color,o[`color_${t.color}`],o[`align_${t.align}`],t.fontFamily==="SFMono"?o["is-mono"]:""]),s=e.computed(()=>t.numberOfLines?{style:{"-webkit-line-clamp":t.numberOfLines,display:"-webkit-box","-webkit-box-orient":"vertical","line-clamp":t.numberOfLines,overflow:"hidden"}}:null);return(l,r)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(l.tag),e.mergeProps({"data-testid":l.testId,class:n.value},s.value),{default:e.withCtx(()=>[e.renderSlot(l.$slots,"default")]),_:3},16,["data-testid","class"]))}}),[["__cssModules",{$style:{root:"text__root_5b5d3","is-mono":"text__is-mono_8b95d",font_titleHuge:"text__font_titleHuge_c2a02",font_titleExtraLarge:"text__font_titleExtraLarge_9e2ab",font_titleLarge:"text__font_titleLarge_adbbd",font_titleLargeBold:"text__font_titleLargeBold_401fa",font_titleLargeHeavy:"text__font_titleLargeHeavy_d1dcb",font_titleLargeRegular:"text__font_titleLargeRegular_f5eaa",font_titleMedium:"text__font_titleMedium_11da4",font_titleSmall:"text__font_titleSmall_aa4de",font_titleSmallRegular:"text__font_titleSmallRegular_c400f",font_titleExtraSmall:"text__font_titleExtraSmall_fc2fb",font_titleExtraSmallBold:"text__font_titleExtraSmallBold_c2bd8",font_headlineMedium:"text__font_headlineMedium_a22b3",font_headlineSmall:"text__font_headlineSmall_dfe04",font_subheadLarge:"text__font_subheadLarge_ad928",font_subheadMedium:"text__font_subheadMedium_b6060",font_subheadSmall:"text__font_subheadSmall_648fc",font_body:"text__font_body_542cd",font_bodyMedium:"text__font_bodyMedium_9856a",font_textLarge:"text__font_textLarge_e8c08",font_textMedium:"text__font_textMedium_aac40",font_textSmall:"text__font_textSmall_3a961",font_captionLarge:"text__font_captionLarge_0e2be",font_captionMedium:"text__font_captionMedium_1f3aa",font_captionSmall:"text__font_captionSmall_0c0b8",color:"text__color_70245",color_base:"text__color_base_75fad",color_secondary:"text__color_secondary_757e2","color_brand-accent":"text__color_brand-accent_2e45f","color_brand-market":"text__color_brand-market_06771",color_error:"text__color_error_3237c",color_success:"text__color_success_df18c",color_inverse:"text__color_inverse_7c356","color_inverse-secondary":"text__color_inverse-secondary_1ecb3",color_disable:"text__color_disable_930e6",align_left:"text__align_left_078d3",align_center:"text__align_center_6444c",align_right:"text__align_right_daaa4","is-ellipsis":"text__is-ellipsis_4b9a7"}}]]),H=S(e.defineComponent({__name:"TheTextSkeleton",props:{color:{},size:{},widthRange:{}},setup(t){const o=e.useCssModule(),n=e.ref(),s=e.ref(),l=e.computed(()=>[o.root,o[`size_${t.size}`],o[`color_${t.color}`]]);function r(){if(t.widthRange&&t.widthRange[0]&&t.widthRange[1]&&n.value){const _=L(n.value,"max-width");if(_){const i=~_.toString().indexOf("%")?parseInt(_.toString().replace("%",""),10):100,u=parseFloat((Math.abs(t.widthRange[1]-t.widthRange[0])*Math.random()*100).toFixed(2)),p=(t.widthRange[0]>=t.widthRange[1]?t.widthRange[0]:t.widthRange[1])*100;s.value=`${(p-u)*i/100}%`}}}return e.onMounted(()=>r()),(_,i)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"skeleton",ref:n,class:e.normalizeClass(l.value),style:e.normalizeStyle({width:s.value}),key:s.value},i[0]||(i[0]=[e.createElementVNode("span",null,null,-1)]),6))}}),[["__cssModules",{$style:{root:"TheTextSkeleton__root_e7018",color:"TheTextSkeleton__color_620e0",color_base:"TheTextSkeleton__color_base_10465",color_secondary:"TheTextSkeleton__color_secondary_e1ef1","color_brand-accent":"TheTextSkeleton__color_brand-accent_afa16","color_brand-market":"TheTextSkeleton__color_brand-market_fca73",color_error:"TheTextSkeleton__color_error_64442",color_success:"TheTextSkeleton__color_success_5a3da",color_inverse:"TheTextSkeleton__color_inverse_54207","color_inverse-secondary":"TheTextSkeleton__color_inverse-secondary_5e112",color_disable:"TheTextSkeleton__color_disable_88db9",size_title_huge:"TheTextSkeleton__size_title_huge_23e69",size_title_large:"TheTextSkeleton__size_title_large_3374c",size_title_medium:"TheTextSkeleton__size_title_medium_0f6e0",size_title_small:"TheTextSkeleton__size_title_small_138c6",size_title_extraSmall:"TheTextSkeleton__size_title_extraSmall_2f6ca",size_headline_small:"TheTextSkeleton__size_headline_small_96a95",size_subhead_large:"TheTextSkeleton__size_subhead_large_effd2",size_text_small:"TheTextSkeleton__size_text_small_e5cd8",size_caption_small:"TheTextSkeleton__size_caption_small_f5390"}}]]),me=["id"],fe={"stroke-width":"15"},ue=["stroke"],he=["stroke"],O=S(e.defineComponent({__name:"Loader",props:{view:{},size:{}},setup(t){const o=e.useCssModule(),n={orange:"rgba(255, 97, 0, 1)",white:"rgba(255, 255, 255, 1)",black:"rgba(35, 36, 37, 1)",gray:"rgba(197, 205, 220, 1)",red:"rgba(255, 45, 85, 1)"},s={a:`spinner-${t.view}-a`,b:`spinner-${t.view}-b`},l=e.computed(()=>[o.root,o[`size_${t.size}`]]),r=e.computed(()=>n[t.view]),_=e.computed(()=>({color:r.value,xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 200 200",width:"200",height:"200"}));return(i,u)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(l.value)},[(e.openBlock(),e.createElementBlock("svg",e.normalizeProps(e.guardReactiveProps(_.value)),[u[1]||(u[1]=e.createElementVNode("defs",null,[e.createElementVNode("stop",{offset:"0%","stop-opacity":"0","stop-color":"currentColor"}),e.createElementVNode("stop",{offset:"100%","stop-opacity":".5","stop-color":"currentColor"})],-1)),e.createElementVNode("linearGradient",{id:s.b},u[0]||(u[0]=[e.createElementVNode("stop",{offset:"0%","stop-opacity":"0","stop-color":"currentColor"},null,-1),e.createElementVNode("stop",{offset:"100%","stop-opacity":".5","stop-color":"currentColor"},null,-1)]),8,me),e.createElementVNode("g",fe,[e.createElementVNode("path",{stroke:`url(#${s.a})`,d:"M15 100a85 85 0 0 1 170 0"},null,8,ue),e.createElementVNode("path",{stroke:`url(#${s.b})`,d:"M185 100a85 85 0 0 1-170 0"},null,8,he)])],16))],2))}}),[["__cssModules",{$style:{root:"Loader__root_6a680",rotate360:"Loader__rotate360_01915",size_xs:"Loader__size_xs_72d28",size_s:"Loader__size_s_d91c3",size_m:"Loader__size_m_c2262",size_l:"Loader__size_l_ab27e",size_xl:"Loader__size_xl_f9fa1"}}]]),ye={xl:20,l:20,m:20,s:18},ge={xl:"headlineSmall",l:"headlineSmall",m:"subheadMedium",s:"textMedium"},be={primary:"inverse",tertiary:"brand-accent",outlineBase:"base",system:"secondary",brandOpacity:"brand-accent",secondary:"base",criticalOnSurface:"error",onDarkPrimary:"base",base:"inverse",criticalOpacity:"error"},K={xl:"m",l:"m",m:"m",s:"s"},$e={primary:"white",tertiary:"orange",outlineBase:"black",system:"gray",brandOpacity:"orange",secondary:"black",criticalOnSurface:"red",onDarkPrimary:"black",base:"white",criticalOpacity:"red"},pe={xl:"s",l:"s",m:"xs",s:"xs"},we=e.defineComponent({__name:"Button",props:{tag:{},href:{},type:{},isLoading:{type:Boolean},isDisabled:{type:Boolean},view:{},size:{},interactionType:{default:"web"},radius:{},iconLeft:{},iconRight:{},isWide:{type:Boolean}},emits:["click"],setup(t,{emit:o}){const n=o,s=e.useCssModule(),l=e.computed(()=>ye[t.size]),r=e.computed(()=>ge[t.size]),_=e.computed(()=>t.isDisabled?"disable":be[t.view]),i=e.computed(()=>t.radius?t.radius:K[t.size]),u=e.computed(()=>({class:s.loader,view:$e[t.view],size:pe[t.size]})),p=e.computed(()=>[s.root,s[`size_${t.size}`],s[`view_${t.view}`],s[`radius_${i.value}`],s[`interaction-type_${t.interactionType}`],t.isDisabled&&s["is-disabled"],t.isWide&&s["is-wide"]]),h=e.computed(()=>[s.wrapper,t.isLoading&&s["is-loading"]]);function d(c){n("click",c)}return(c,g)=>(e.openBlock(),e.createBlock(e.unref(P),{class:e.normalizeClass(p.value),tag:c.tag,href:c.href,type:c.type,"is-loading":c.isLoading,"is-disabled":c.isDisabled,onClick:d},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(h.value)},[c.iconLeft?(e.openBlock(),e.createBlock(e.unref(V),{key:0,name:c.iconLeft,color:_.value,size:l.value},null,8,["name","color","size"])):e.createCommentVNode("",!0),e.createVNode(e.unref(F),{name:r.value,color:_.value},{default:e.withCtx(()=>[e.renderSlot(c.$slots,"default")]),_:3},8,["name","color"]),c.iconRight?(e.openBlock(),e.createBlock(e.unref(V),{key:1,name:c.iconRight,color:_.value,size:l.value},null,8,["name","color","size"])):e.createCommentVNode("",!0)],2),e.createVNode(e.Transition,{name:"fade",mode:"out-in"},{default:e.withCtx(()=>[c.isLoading?(e.openBlock(),e.createBlock(e.unref(O),e.normalizeProps(e.mergeProps({key:0},u.value)),null,16)):e.createCommentVNode("",!0)]),_:1})]),_:3},8,["class","tag","href","type","is-loading","is-disabled"]))}}),U={root:"Button__root_d73c7","interaction-type_webview":"Button__interaction-type_webview_cbcd8",size_xl:"Button__size_xl_d4508",size_l:"Button__size_l_36a47",size_m:"Button__size_m_a0dfa",size_s:"Button__size_s_c29cc",view:"Button__view_2d25c",view_primary:"Button__view_primary_2e1d8",view_tertiary:"Button__view_tertiary_87211",view_outlineBase:"Button__view_outlineBase_c6ec7",view_system:"Button__view_system_b353e",view_brandOpacity:"Button__view_brandOpacity_464b2",view_secondary:"Button__view_secondary_04e61",view_criticalOnSurface:"Button__view_criticalOnSurface_466b2",view_criticalOpacity:"Button__view_criticalOpacity_0847b",view_onDarkPrimary:"Button__view_onDarkPrimary_1e4eb",view_base:"Button__view_base_a30a0",view_skeleton:"Button__view_skeleton_fd281",radius_m:"Button__radius_m_ee05f",radius_s:"Button__radius_s_f15d9",wrapper:"Button__wrapper_e7d56",loader:"Button__loader_37a37","is-disabled":"Button__is-disabled_b357e","is-loading":"Button__is-loading_53182","is-wide":"Button__is-wide_3f0c1"},X=S(we,[["__cssModules",{$style:U}]]),Y=S(e.defineComponent({__name:"ButtonSkeleton",props:{size:{}},setup(t){const o=e.useCssModule(),n=e.computed(()=>K[t.size]),s=e.computed(()=>[o.root,o[`size_${t.size}`],o.view_skeleton,o[`radius_${n.value}`],o["is-wide"]]);return(l,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(s.value)},null,2))}}),[["__cssModules",{$style:U}]]),Z=S(e.defineComponent({__name:"SkeletonWrapper",setup(t){const o=e.useCssModule(),n=e.computed(()=>[o.root]);return(s,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(n.value)},[e.renderSlot(s.$slots,"default")],2))}}),[["__cssModules",{$style:{root:"SkeletonWrapper__root_e7206",pulse:"SkeletonWrapper__pulse_fef1d"}}]]);function E(t){return typeof t=="function"?t():e.unref(t)}typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const q=()=>{};function R(t,o=!1,n="Timeout"){return new Promise((s,l)=>{setTimeout(o?()=>l(n):s,t)})}function j(t,o=!1){function n(d,{flush:c="sync",deep:g=!1,timeout:z,throwOnTimeout:v}={}){let w=null;const k=[new Promise(C=>{w=e.watch(t,$=>{d($)!==o&&(w==null||w(),C($))},{flush:c,deep:g,immediate:!0})})];return z!=null&&k.push(R(z,v).then(()=>E(t)).finally(()=>w==null?void 0:w())),Promise.race(k)}function s(d,c){if(!e.isRef(d))return n($=>$===d,c);const{flush:g="sync",deep:z=!1,timeout:v,throwOnTimeout:w}=c??{};let b=null;const C=[new Promise($=>{b=e.watch([t,d],([a,f])=>{o!==(a===f)&&(b==null||b(),$(a))},{flush:g,deep:z,immediate:!0})})];return v!=null&&C.push(R(v,w).then(()=>E(t)).finally(()=>(b==null||b(),E(t)))),Promise.race(C)}function l(d){return n(c=>!!c,d)}function r(d){return s(null,d)}function _(d){return s(void 0,d)}function i(d){return n(Number.isNaN,d)}function u(d,c){return n(g=>{const z=Array.from(g);return z.includes(d)||z.includes(E(d))},c)}function p(d){return h(1,d)}function h(d=1,c){let g=-1;return n(()=>(g+=1,g>=d),c)}return Array.isArray(E(t))?{toMatch:n,toContains:u,changed:p,changedTimes:h,get not(){return j(t,!o)}}:{toMatch:n,toBe:s,toBeTruthy:l,toBeNull:r,toBeNaN:i,toBeUndefined:_,changed:p,changedTimes:h,get not(){return j(t,!o)}}}function Te(t){return j(t)}function Se(t,o,n){const{immediate:s=!0,delay:l=0,onError:r=q,onSuccess:_=q,resetOnExecute:i=!0,shallow:u=!0,throwError:p}=n??{},h=u?e.shallowRef(o):e.ref(o),d=e.ref(!1),c=e.ref(!1),g=e.shallowRef(void 0);async function z(b=0,...k){i&&(h.value=o),g.value=void 0,d.value=!1,c.value=!0,b>0&&await R(b);const C=typeof t=="function"?t(...k):t;try{const $=await C;h.value=$,d.value=!0,_($)}catch($){if(g.value=$,r($),p)throw $}finally{c.value=!1}return h.value}s&&z(l);const v={state:h,isReady:d,isLoading:c,error:g,execute:z};function w(){return new Promise((b,k)=>{Te(c).toBe(!1).then(()=>b(v)).catch(k)})}return{...v,then(b,k){return w().then(b,k)}}}async function ze(t){return new Promise((o,n)=>{const s=new Image,{src:l,srcset:r,sizes:_,class:i,loading:u,crossorigin:p,referrerPolicy:h}=t;s.src=l,r&&(s.srcset=r),_&&(s.sizes=_),i&&(s.className=i),u&&(s.loading=u),p&&(s.crossOrigin=p),h&&(s.referrerPolicy=h),s.onload=()=>o(s),s.onerror=n})}function ke(t,o={}){const n=Se(()=>ze(E(t)),void 0,{resetOnExecute:!0,...o});return e.watch(()=>E(t),()=>n.execute(o.delay),{deep:!0}),n}const Be="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='_Слой_1'%20data-name='Слой_1'%20xmlns='http://www.w3.org/2000/svg'%20version='1.1'%20viewBox='0%200%2024%2024'%3e%3c!--%20Generator:%20Adobe%20Illustrator%2029.2.1,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%202.1.0%20Build%20116)%20--%3e%3cdefs%3e%3cstyle%3e%20.st0,%20.st1%20{%20fill:%20currentColor;%20}%20.st1%20{%20fill-rule:%20evenodd;%20}%20%3c/style%3e%3c/defs%3e%3cpath%20class='st1'%20d='M21.2,7c-.1-.9-.3-1.7-.8-2.4-.3-.4-.6-.8-1-1-.7-.5-1.5-.7-2.4-.8-.9,0-2,0-3.4,0h-3.1c-1.4,0-2.5,0-3.4,0-.9,0-1.7.3-2.4.8-.4.3-.8.6-1,1-.5.7-.7,1.5-.8,2.4,0,.9,0,2,0,3.4h0v3h0c0,1.4,0,2.6,0,3.5,0,.9.3,1.7.8,2.4.3.4.6.8,1,1,.7.5,1.5.7,2.4.8.9,0,2,0,3.4,0h3.1c1.4,0,2.5,0,3.4,0,.9-.1,1.7-.3,2.4-.8.4-.3.8-.6,1-1,.5-.7.7-1.5.8-2.4,0-.9,0-2,0-3.4h0v-3h0c0-1.4,0-2.6,0-3.5ZM19.4,16.8c0,.8-.2,1.2-.5,1.5-.2.2-.4.5-.7.7-.3.2-.8.4-1.5.5-.8,0-1.8,0-3.3,0h-3c-1.5,0-2.5,0-3.3,0-.5,0-.9-.1-1.1-.3l7.4-7.4c.5-.5.9-.9,1.2-1.1.3-.2.4-.3.5-.3.1,0,.2,0,.3,0,0,0,.2,0,.5.3.3.2.6.6,1.2,1.1l2.3,2.3c0,1.2,0,2,0,2.7ZM19.5,11.5l-1.1-1.1h0c-.5-.5-.9-.9-1.3-1.2-.4-.3-.8-.6-1.3-.7-.3,0-.6,0-.9,0-.5,0-1,.3-1.3.7-.4.3-.8.7-1.3,1.2h0s-7.4,7.5-7.4,7.5c-.1-.3-.2-.6-.3-1.1,0-.8,0-1.8,0-3.3v-3c0-1.5,0-2.5,0-3.3,0-.8.2-1.2.5-1.5.2-.2.4-.5.7-.7.3-.2.8-.4,1.5-.5.8,0,1.8,0,3.3,0h3c1.5,0,2.5,0,3.3,0,.8,0,1.2.2,1.5.5.2.2.5.4.7.7.2.3.4.8.5,1.5,0,.8,0,1.8,0,3.3v1Z'/%3e%3ccircle%20class='st0'%20cx='8.8'%20cy='8.5'%20r='1.8'/%3e%3c/svg%3e",N={"fade-enter-active":"TransitionFade__fade-enter-active_aa1d8","fade-leave-active":"TransitionFade__fade-leave-active_39194","fade-enter-from":"TransitionFade__fade-enter-from_74398","fade-leave-to":"TransitionFade__fade-leave-to_fab21"},A=e.defineComponent({name:"TransitionFade",props:{appear:{type:Boolean,default:!1},mode:{type:String,default:"out-in"},duration:{type:Number,default:300}},setup(t,{slots:o}){return()=>e.h(e.Transition,{name:"fade",appear:t.appear,mode:t.mode,duration:t.duration,enterFromClass:N["fade-enter-from"],enterActiveClass:N["fade-enter-active"],leaveActiveClass:N["fade-leave-active"],leaveToClass:N["fade-leave-to"]},()=>o.default?o.default():[])}}),xe=["src"],Ce=["fetchpriority","width","height","src","alt"],Me={key:"loading"},J=S(e.defineComponent({__name:"TheImage",props:{src:{},alt:{},width:{},height:{},objectFit:{},hasPlaceholder:{type:Boolean,default:!1},hasPriority:{type:Boolean,default:!1},isLayoutFill:{type:Boolean},hasMixBlendMode:{type:Boolean,default:!1}},setup(t){const o=e.computed(()=>({src:t.src,alt:t.alt})),{isLoading:n,error:s}=ke(o,{immediate:!1}),l=e.computed(()=>!+t.width&&!+t.height?"auto":`${t.width}/${t.height}`),r=e.computed(()=>t.hasMixBlendMode&&_.value==="idle"),_=e.computed(()=>n.value?"loading":s.value?"error":"idle");return(i,u)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([i.$style.root,_.value==="loading"&&i.$style.hasPulse]),style:e.normalizeStyle({aspectRatio:l.value})},[e.createVNode(e.unref(A),null,{default:e.withCtx(()=>[_.value==="error"&&i.hasPlaceholder?(e.openBlock(),e.createElementBlock("img",{key:"error",class:e.normalizeClass(i.$style.placeholder),src:e.unref(Be),alt:"image placeholder"},null,10,xe)):_.value==="idle"?(e.openBlock(),e.createElementBlock("img",{fetchpriority:i.hasPriority,key:"image",class:e.normalizeClass([i.$style.image,r.value&&i.$style.mixBlendMode,i.$style[`objectFit_${i.objectFit}`]]),width:i.width,height:i.height,src:i.src,alt:i.alt},null,10,Ce)):(e.openBlock(),e.createElementBlock("div",Me))]),_:1})],6))}}),[["__cssModules",{$style:{root:"TheImage__root_484a1",image:"TheImage__image_2c261",mixBlendMode:"TheImage__mixBlendMode_ca9ee",objectFit_cover:"TheImage__objectFit_cover_8f5ee",objectFit_contain:"TheImage__objectFit_contain_c6076",placeholder:"TheImage__placeholder_1e624",hasPulse:"TheImage__hasPulse_af1f2",pulse:"TheImage__pulse_56855"}}]]),ve=["srcset"],Ee=["width","height","src","alt"],Q=S(e.defineComponent({__name:"ThePicture",props:{src:{},alt:{},width:{},height:{},objectFit:{},hasPriority:{type:Boolean}},setup(t){const o=e.computed(()=>{const s=/\.(png|jpg|jpeg)$/;return s.test(t.src)||console.warn("src prop must be png, jpg or jpeg"),t.src.replace(s,"")}),n=e.computed(()=>({...t.hasPriority&&{fetchpriority:"high"}}));return(s,l)=>(e.openBlock(),e.createElementBlock("picture",{class:e.normalizeClass(s.$style.root)},[e.createElementVNode("source",{srcset:o.value+".webp",type:"image/webp"},null,8,ve),e.createElementVNode("img",e.mergeProps(n.value,{class:[s.$style.image,s.$style[`objectFit_${s.objectFit}`]],width:s.width,height:s.height,src:s.src,alt:s.alt,loading:"lazy",onError:l[0]||(l[0]=(...r)=>s.handleFailure&&s.handleFailure(...r))}),null,16,Ee)],2))}}),[["__cssModules",{$style:{root:"ThePicture__root_e38eb",image:"ThePicture__image_29186",objectFit_cover:"ThePicture__objectFit_cover_0c234",objectFit_contain:"ThePicture__objectFit_contain_9e95d"}}]]),Le={"enter-active":"TransitionVisibilityToggle__enter-active_bc3d6","leave-active":"TransitionVisibilityToggle__leave-active_23b21","enter-from":"TransitionVisibilityToggle__enter-from_0ca29","enter-to":"TransitionVisibilityToggle__enter-to_6293c","leave-from":"TransitionVisibilityToggle__leave-from_4b6bf","leave-to":"TransitionVisibilityToggle__leave-to_d0bb6"},Ie={};function Ve(t,o){return e.openBlock(),e.createBlock(e.Transition,{mode:"out-in",name:"toggle-visibility",enterActiveClass:t.$style["enter-active"],leaveActiveClass:t.$style["leave-active"],enterToClass:t.$style["enter-to"],enterFromClass:t.$style["enter-from"],leaveToClass:t.$style["leave-to"],leaveFromClass:t.$style["leave-from"]},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},8,["enterActiveClass","leaveActiveClass","enterToClass","enterFromClass","leaveToClass","leaveFromClass"])}const ee=S(Ie,[["render",Ve],["__cssModules",{$style:Le}]]),Fe=S(e.defineComponent({__name:"ToastItem",props:{icon:{},title:{},timer:{},buttonText:{},onButtonClick:{type:Function}},setup(t){return(o,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass([o.$style.root,o.icon&&o.$style["is-icon"]]),onClick:n[0]||(n[0]=s=>o.$emit("click"))},[e.createVNode(e.unref(F),{class:e.normalizeClass(o.$style.title),name:"subheadSmall",color:"inverse",align:"left"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.title),1)]),_:1},8,["class"]),o.icon?(e.openBlock(),e.createBlock(e.unref(V),{key:0,class:e.normalizeClass(o.$style.icon),size:20,name:o.icon,color:"inverse"},null,8,["class","name"])):e.createCommentVNode("",!0),o.buttonText?(e.openBlock(),e.createBlock(e.unref(F),{key:1,class:e.normalizeClass(o.$style.button),name:"subheadSmall",color:"brand-accent",onClick:o.onButtonClick},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.buttonText),1)]),_:1},8,["class","onClick"])):e.createCommentVNode("",!0)],2))}}),[["__cssModules",{$style:{root:"ToastItem__root_ef96a","is-icon":"ToastItem__is-icon_fab71",icon:"ToastItem__icon_27903",timer:"ToastItem__timer_1a2c8",button:"ToastItem__button_eb561",title:"ToastItem__title_949d1"}}]]);class Ne{constructor(){G(this,"list",e.ref([]));G(this,"timeouts",e.ref({}))}restartTimeouts(){Object.keys(this.timeouts.value).forEach((o,n)=>{this.timeouts.value[o]=setTimeout(()=>{this.remove(+o),clearTimeout(this.timeouts.value[o])},4e3+n*300)})}pauseTimeouts(){Object.keys(this.timeouts.value).forEach(o=>{clearTimeout(this.timeouts.value[o])})}remove(o){this.list.value=this.list.value.filter(n=>n.id!==o)}show(o){let n;const s=this.list.value[0]?this.list.value[0].id+1:1;let l=5e3;typeof o=="string"?n={id:s,title:o+` ${s}`}:(n={...o,title:o.title+` ${s}`,id:s},l=o.timer?o.timer*1e3:5e3),this.list.value.length===3&&this.list.value.pop(),this.list.value.unshift(n),this.timeouts.value[s]=setTimeout(()=>{this.remove(n.id),clearTimeout(this.timeouts.value[s])},l)}showError(o="Упс, что-то пошло не так :(",n="alert_fill"){this.show({title:o,icon:n})}install(o){o.provide(D,this)}}const D=Symbol("ToastService"),Pe=new Ne,Oe=["id"],te=S(e.defineComponent({__name:"Toaster",setup(t){let o;const n=e.inject(D),s=e.ref(),l=e.ref([]),r=e.ref(!1),_=e.ref(w()),i=e.ref(w()),u=e.ref(w()),p=e.ref(w());function h(a){const f=b(a);return{toaster:{transform:_.value[f]},body:{transform:i.value[f]},left:{transform:u.value[f]},right:{transform:p.value[f]}}}function d(a,f){(f!=="main"||_.value.main.length)&&(_.value[f]=a.mainTranslate),i.value[f]=a.scale,u.value[f]=a.leftTranslate,p.value[f]=a.rightTranslate}function c(){let f=0,B=0;l.value.sort(k).forEach((x,y)=>{const T=b(y),I=$(`-${f}px`);d(I,T),f+=x.clientHeight+12,B=Math.max(B,x.clientWidth)}),s.value.style.height=`-${f}px`,s.value.style.width=`${B}px`}function g(){e.nextTick(()=>{const[a,f,B]=l.value.sort(k),x=$("0");if(d(x,"main"),f){const y=C({mainElement:a,element:f,translateY:"-15%",index:1});d(y,"second")}if(B){const y=C({mainElement:a,element:B,translateY:"-30%",index:2});d(y,"third"),e.nextTick(()=>{var I;const T=(I=s.value)==null?void 0:I.querySelector(".toaster-leave-active");if(T){const M=C({mainElement:a,element:T,translateY:"45%",index:3});T.setAttribute("style",`transform: ${M.mainTranslate};`),T.children[1].setAttribute("style",`transform: ${M.scale};`),T.children[0].setAttribute("style",`transform: ${M.leftTranslate};`),T.children[2].setAttribute("style",`transform: ${M.rightTranslate};`),T.children[4].setAttribute("style",`transform: ${M.scale};`),T.children[3].setAttribute("style",`transform: ${M.leftTranslate};`),T.children[5].setAttribute("style",`transform: ${M.rightTranslate};`)}})}})}function z(a){r.value&&(n==null||n.remove(a),c())}function v(){r.value||(r.value=!0,n==null||n.pauseTimeouts(),c(),o=setTimeout(()=>{r.value=!1,g(),s.value.style.height="auto",s.value.style.width="auto",n==null||n.restartTimeouts(),clearTimeout(o)},5e3))}e.watch(()=>n==null?void 0:n.list,()=>{r.value?c():g()},{deep:!0});function w(){return{main:"",second:"",third:""}}function b(a){switch(a){case 0:return"main";case 1:return"second";default:return"third"}}function k(a,f){return Number(f.id)-Number(a.id)}function C({mainElement:a,element:f,translateY:B,index:x}){const y=f.getBoundingClientRect(),T=a.getBoundingClientRect(),I=T.height/y.height,M=(T.width-10*x)/y.width,ne=(y.width-M*y.width)/2;return{mainTranslate:`translateY(${B}) translateX(-50%)`,scale:`scale(${M}, ${I})`,leftTranslate:`translateX(${ne-12}px)`,rightTranslate:`translateX(${-ne+12}px)`}}function $(a){return{mainTranslate:`translateY(${a}) translateX(-50%)`,scale:"scale(1, 1)",leftTranslate:"translateX(-12px)",rightTranslate:"translateX(12px)"}}return(a,f)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"rootRef",ref:s,class:e.normalizeClass([a.$style.root,r.value&&a.$style["is-expand"]]),onClick:v},[e.createVNode(e.TransitionGroup,{tag:"div","enter-from-class":a.$style["toaster-enter-from"],"enter-to-class":a.$style["toaster-enter-to"],"enter-active-class":a.$style["toaster-enter-active"],"leave-from-class":a.$style["toaster-leave-from"],"leave-to-class":a.$style["toaster-leave-to"],"leave-active-class":a.$style["toaster-leave-active"]},{default:e.withCtx(()=>{var B;return[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList((B=e.unref(n))==null?void 0:B.list.value,(x,y)=>(e.openBlock(),e.createElementBlock("div",{key:x.id,id:`${x.id}`,ref_for:!0,ref_key:"toastersRef",ref:l,class:e.normalizeClass([a.$style.toaster,r.value?"is-expand":""]),style:e.normalizeStyle(h(y).toaster)},[e.createElementVNode("div",{class:e.normalizeClass(a.$style.left),style:e.normalizeStyle(h(y).left)},null,6),e.createElementVNode("div",{class:e.normalizeClass(a.$style.body),style:e.normalizeStyle(h(y).body)},[e.createVNode(Fe,e.mergeProps({ref_for:!0},x,{onClick:()=>z(x.id)}),null,16,["onClick"])],6),e.createElementVNode("div",{class:e.normalizeClass(a.$style.right),style:e.normalizeStyle(h(y).right)},null,6),e.createElementVNode("div",{class:e.normalizeClass([a.$style.left,a.$style.shadow]),style:e.normalizeStyle(h(y).left)},null,6),e.createElementVNode("div",{class:e.normalizeClass([a.$style.body,a.$style.shadow]),style:e.normalizeStyle(h(y).body)},null,6),e.createElementVNode("div",{class:e.normalizeClass([a.$style.right,a.$style.shadow]),style:e.normalizeStyle(h(y).right)},null,6)],14,Oe))),128))]}),_:1},8,["enter-from-class","enter-to-class","enter-active-class","leave-from-class","leave-to-class","leave-active-class"])],2))}}),[["__cssModules",{$style:{"toaster-enter-from":"Toaster__toaster-enter-from_efcfd","toaster-enter":"Toaster__toaster-enter_7d5d8","toaster-enter-to":"Toaster__toaster-enter-to_6201a","toaster-enter-active":"Toaster__toaster-enter-active_528d1","toaster-leave-active":"Toaster__toaster-leave-active_952ab","toaster-leave-from":"Toaster__toaster-leave-from_f98c0","toaster-leave":"Toaster__toaster-leave_948f8","toaster-leave-to":"Toaster__toaster-leave-to_05c33",root:"Toaster__root_73fc8","is-expand":"Toaster__is-expand_984b8",toaster:"Toaster__toaster_72d65",body:"Toaster__body_22a84",left:"Toaster__left_4f54d",right:"Toaster__right_9c31e",shadow:"Toaster__shadow_acb59"}}]]),oe={interactionType:"web"},se=Symbol("GlobalConfig"),Re=t=>{e.provide(se,{...oe,...t})},je=()=>e.inject(se,oe),Ae={KGS:"KGS"},De=[X,Y,P,O,Response,Z,J,Q,F,H,A,ee,te,V],Ge={install:t=>{De.forEach(o=>{t.component(`${o.name}`,o)})}};m.Button=X,m.ButtonBase=P,m.ButtonSkeleton=Y,m.Currency=Ae,m.Icon=V,m.Loader=O,m.SkeletonWrapper=Z,m.TheImage=J,m.ThePicture=Q,m.TheText=F,m.TheTextSkeleton=H,m.ToastServiceKey=D,m.Toaster=te,m.TransitionFade=A,m.TransitionVisibilityToggle=ee,m.default=Ge,m.toastService=Pe,m.useGlobalConfig=je,m.useGlobalConfigProvide=Re,Object.defineProperties(m,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/dist/namba-one-uikit.css

@@ -0,0 +1 @@
+a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:root{--orange_namba: hsla(23, 100%, 50%, 1);--black_namba: hsla(210, 3%, 14%, 1);--white: hsla(0, 0%, 100%, 1);--bgBase: hsl(0, 0%, 100%);--bgSecondaryTransparent: hsla(204, 16%, 94%, .5);--bgButtonAccentTransparent: hsla(23, 100%, 50%, .1);--bgSuccessTransparent: hsla(135, 63%, 75%, .25);--bgSuccessTransparentLightest: hsla(135, 63%, 75%, .15);--bgErrorTransparentLightest: hsla(349, 100%, 59%, .1);--bgOverlaySecondary: hsla(200, 6%, 80%, .5);--bgPopoverInverse: hsl(206, 15%, 35%);--bgSecondary: hsl(204, 16%, 94%);--bgNeutral: hsl(0, 0%, 98%);--bgSystem: hsl(206, 16%, 80%);--bgSystemTransparent: hsla(206, 16%, 80%, .25);--bgGreen: hsl(101, 68%, 57%);--bgNeonGreen: hsl(76, 100%, 63%);--bgBlue: hsl(205, 76%, 87%);--bgRed: hsl(0, 95%, 70%);--bgRedLight: hsl(0, 95%, 92%);--bgPurple: hsl(269, 76%, 58%);--bgBaseInverse: hsl(210, 3%, 14%);--bgBaseInverseTransparent: hsla(210, 3%, 14%, .22);--bgBrand: hsl(23, 100%, 50%);--bgBaseTransparent: hsla(0, 0%, 100%, .2);--bgProgressInverse: hsla(0, 0%, 100%, .5);--bgOverlayBlocked: hsla(204, 15%, 13%, .85);--bgDisable: hsl(218, 38%, 92%);--bgOnDark: hsla(204, 10%, 30%, .5);--bgAdditionalGreen: hsl(135, 59%, 49%);--textBase: hsl(210, 3%, 14%);--textSecondary: hsla(205, 25%, 40%, .75);--textBrandAccent: hsl(23, 100%, 50%);--textBrandMarket: hsl(270, 100%, 40%);--textError: hsl(349, 100%, 59%);--textSuccess: hsl(135, 68%, 38%);--textInverse: hsl(0, 0%, 100%);--textInverseSecondary: hsla(0, 0%, 100%, .8);--textDisable: hsl(221, 23%, 82%);--borderBrandAccent: hsl(23, 100%, 50%);--borderBrandTransparent: hsla(23, 100%, 50%, .2);--borderBaseBackground: hsl(0, 0%, 100%);--borderSecondary: hsl(207, 18%, 90%);--borderSecondaryTransparent: hsla(207, 18%, 90%, .2);--borderField: hsl(204, 16%, 94%);--borderError: hsl(349, 100%, 59%);--borderSuccess: hsl(135, 68%, 38%);--iconBrandAccent: hsl(23, 100%, 50%);--iconSecondary: hsla(205, 25%, 40%, .75);--iconBase: hsl(210, 3%, 14%);--iconError: hsl(349, 100%, 59%);--iconSuccess: hsl(135, 68%, 38%);--iconInverse: hsl(0, 0%, 100%);--iconGreen: hsl(76, 84%, 43%);--iconBlue: hsl(205, 53%, 70%);--iconRed: hsl(0, 95%, 70%);--iconDisable: hsl(221, 23%, 82%);--breakpoint-mobile-big: 414px;--breakpoint-tablet: 650px;--breakpoint-max-mobile: 649px;--breakpoint-tablet-late: 768px;--breakpoint-max-mobile-late: 767px;--breakpoint-desktop: 1200px;--breakpoint-freeze-rem: 1440px;--breakpoint-max-tablet: 1199px;--breakpoint-contrainer-collapse: 1840px;--breakpoint-max-rems: 1440px;--border-radius-xs: .6666666667rem;--border-radius-s: 1rem;--border-radius-m: 1.3333333333rem;--border-radius-l: 1.6666666667rem;--border-radius-xl: 2rem;--border-radius-xxl: 2.6666666667rem;--border-radius-xxxxl: 12rem;--tab-bar-height: 4rem;--z-index-toaster: 10000;--z-index-dropdown: 9999;--z-index-modal: 9998;--z-index-header: 9997;--dropdown-content-max-height: calc(45vh - 6.6666666667rem);--env-safe-area-inset-top: env(safe-area-inset-top, 0px);--env-safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);--safe-area-inset-top: var(--env-safe-area-inset-top, 0px);--safe-area-inset-bottom: var(--env-safe-area-inset-bottom, 0px)}@font-face{font-family:sf-pro-custom;src:url(./fonts/SFPro.woff2) format("woff2"),url(./fonts/SFPro.woff) format("woff");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:sf-pro-custom;src:url(./fonts/SFPro.woff2) format("woff2"),url(./fonts/SFPro.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:sf-pro-custom;src:url(./fonts/SFPro.woff2) format("woff2"),url(./fonts/SFPro.woff) format("woff");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:sf-pro-custom;src:url(./fonts/SFPro.woff2) format("woff2"),url(./fonts/SFPro.woff) format("woff");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:sf-pro-custom;src:url(./fonts/SFPro.woff2) format("woff2"),url(./fonts/SFPro.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:sf-pro-custom;src:url(./fonts/SFPro.woff2) format("woff2"),url(./fonts/SFPro.woff) format("woff");font-weight:800;font-style:normal;font-display:swap}@font-face{font-family:SFMono;src:url(./fonts/SFMono-Light.woff2) format("woff2"),url(./fonts/SFMono-Light.woff) format("woff");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:SFMono;src:url(./fonts/SFMono-Regular.woff2) format("woff2"),url(./fonts/SFMono-Regular.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:SFMono;src:url(./fonts/SFMono-Medium.woff2) format("woff2"),url(./fonts/SFMono-Medium.woff) format("woff");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:SFMono;src:url(./fonts/SFMono-Semibold.woff2) format("woff2"),url(./fonts/SFMono-Semibold.woff) format("woff");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:SFMono;src:url(./fonts/SFMono-Bold.woff2) format("woff2"),url(./fonts/SFMono-Bold.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:SFMono;src:url(./fonts/SFMono-Heavy.woff2) format("woff2"),url(./fonts/SFMono-Heavy.woff) format("woff");font-weight:800;font-style:normal;font-display:swap}body,button,input,textarea,.button{font-family:sf-pro-custom,-apple-system,blinkmacsystemfont,Inter,Arial,sans-serif}body{font-size:14px;backface-visibility:hidden;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:rgba(0,0,0,0);min-height:100%;display:flex;flex-direction:column;flex-grow:1}*{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#app{display:flex;flex-direction:column;flex-grow:1}#app.is-min-width{min-width:768px}#storybook-root #app{display:block}html{height:100%;font-size:12px}@media (min-width: 1200px){html{font-size:1vw}}@media (min-width: 1440px){html{font-size:14.4px}}main{display:block}.button,button{border:none;cursor:pointer;background:none;padding:0;margin:0;overflow:visible;backface-visibility:hidden;text-align:center}*:focus{outline:none}a{text-decoration:none}label{display:block}input,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;width:100%;box-sizing:border-box;border:none;padding:0;margin:0}input::placeholder,textarea::placeholder{font-size:inherit;font-family:inherit;color:inherit}input:-webkit-autofill,textarea:-webkit-autofill{-webkit-background-clip:text;background-clip:text}textarea{resize:none}[data-src]{transition:opacity .3s ease}.lazyload{opacity:0;will-change:transform,opacity}.lazyloaded{opacity:1}[data-vsbs-header]{border-top:none!important}[data-vsbs-header]:has([data-bottom-sheet-handle]){position:sticky;top:0}[data-vsbs-sheet]{border:none!important;background-color:var(--bgBase)!important;border-top-left-radius:var(--border-radius-xl)!important;border-top-right-radius:var(--border-radius-xl)!important;overflow:hidden!important}[data-vsbs-sheet]:has([data-bottom-sheet-handle]) [data-vsbs-content]{padding-top:2.3333333333rem!important}[data-vsbs-backdrop]{-webkit-backdrop-filter:blur(12px)!important;backdrop-filter:blur(12px)!important;background-color:var(--bgSecondaryTransparent)!important}.Icon__root_9c34a{display:inline-block;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.Icon__color_9a568{transition:.3s ease color}.Icon__color_brand-accent_0f65a{color:var(--iconBrandAccent)}.Icon__color_secondary_016e8{color:var(--iconSecondary)}.Icon__color_base_49ca4{color:var(--iconBase)}.Icon__color_error_21923{color:var(--iconError)}.Icon__color_success_e8b4a{color:var(--iconSuccess)}.Icon__color_inverse_4d7fc{color:var(--iconInverse)}.Icon__color_green_35ae9{color:var(--iconGreen)}.Icon__color_blue_c217d{color:var(--iconBlue)}.Icon__color_red_ecc39{color:var(--iconRed)}.Icon__color_disable_bf4c2{color:var(--iconDisable)}.text__root_5b5d3{font-family:inherit}.text__root_5b5d3.text__is-mono_8b95d{font-family:SFMono}.text__font_titleHuge_c2a02{font-size:4rem;line-height:4.6666666667rem;font-weight:600;letter-spacing:.0291666667rem}.text__font_titleExtraLarge_9e2ab{font-size:3.1666666667rem;line-height:3.8333333333rem;font-weight:700;letter-spacing:.0333333333rem}.text__font_titleLarge_adbbd{font-size:2.3333333333rem;line-height:3rem;font-weight:600;letter-spacing:.0308333333rem}.text__font_titleLargeBold_401fa{font-size:2.3333333333rem;line-height:3rem;font-weight:700;letter-spacing:.0308333333rem}.text__font_titleLargeHeavy_d1dcb{font-size:2.3333333333rem;line-height:3rem;font-weight:800;letter-spacing:.0308333333rem}.text__font_titleLargeRegular_f5eaa{font-size:2.3333333333rem;line-height:3rem;font-weight:400;letter-spacing:.0308333333rem}.text__font_titleMedium_11da4{font-size:2rem;line-height:2.6666666667rem;font-weight:600;letter-spacing:.005rem}.text__font_titleSmall_aa4de{font-size:1.8333333333rem;line-height:2.3333333333rem;font-weight:600;letter-spacing:-.0225rem}.text__font_titleSmallRegular_c400f{font-size:1.8333333333rem;line-height:2.3333333333rem;font-weight:400;letter-spacing:-.0225rem}.text__font_titleExtraSmall_fc2fb{font-size:1.5833333333rem;line-height:2rem;font-weight:600;letter-spacing:-.0375rem}.text__font_titleExtraSmallBold_c2bd8{font-size:1.5833333333rem;line-height:2rem;font-weight:700;letter-spacing:-.0375rem}.text__font_headlineMedium_a22b3{font-size:1.4166666667rem;line-height:2rem;font-weight:600;letter-spacing:-.0366666667rem}.text__font_headlineSmall_dfe04{font-size:1.4166666667rem;line-height:2rem;font-weight:500;letter-spacing:-.0366666667rem}.text__font_subheadLarge_ad928{font-size:1.25rem;line-height:1.8333333333rem;font-weight:600;letter-spacing:-.0208333333rem}.text__font_subheadMedium_b6060{font-size:1.25rem;line-height:1.8333333333rem;font-weight:500;letter-spacing:-.0208333333rem}.text__font_subheadSmall_648fc{font-size:1.25rem;line-height:1.8333333333rem;font-weight:400;letter-spacing:-.0208333333rem}.text__font_body_542cd{font-size:1.4166666667rem;line-height:1.8333333333rem;font-weight:400;letter-spacing:-.0208333333rem}.text__font_bodyMedium_9856a{font-size:1.4166666667rem;line-height:1.8333333333rem;font-weight:500;letter-spacing:.0033333333rem}.text__font_textLarge_e8c08{font-size:1.0833333333rem;line-height:1.5rem;font-weight:600;letter-spacing:-.0083333333rem}.text__font_textMedium_aac40{font-size:1.0833333333rem;line-height:1.5rem;font-weight:500;letter-spacing:-.0083333333rem}.text__font_textSmall_3a961{font-size:1.0833333333rem;line-height:1.5rem;font-weight:400;letter-spacing:-.0083333333rem}.text__font_captionLarge_0e2be{font-size:.9166666667rem;line-height:1.1666666667rem;font-weight:600;letter-spacing:.0041666667rem}.text__font_captionMedium_1f3aa{font-size:.9166666667rem;line-height:1.1666666667rem;font-weight:500;letter-spacing:.0041666667rem}.text__font_captionSmall_0c0b8{font-size:.9166666667rem;line-height:1.1666666667rem;font-weight:400;letter-spacing:.0041666667rem}.text__color_70245{transition:color .3s ease}.text__color_base_75fad{color:var(--textBase)}.text__color_secondary_757e2{color:var(--textSecondary)}.text__color_brand-accent_2e45f{color:var(--textBrandAccent)}.text__color_brand-market_06771{color:var(--textBrandMarket)}.text__color_error_3237c{color:var(--textError)}.text__color_success_df18c{color:var(--textSuccess)}.text__color_inverse_7c356{color:var(--textInverse)}.text__color_inverse-secondary_1ecb3{color:var(--textInverseSecondary)}.text__color_disable_930e6{color:var(--textDisable)}.text__align_left_078d3{text-align:left}.text__align_center_6444c{text-align:center}.text__align_right_daaa4{text-align:right}.text__is-ellipsis_4b9a7{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.TheTextSkeleton__root_e7018{box-sizing:border-box;width:100%;font-size:0!important;line-height:normal!important;display:block}.TheTextSkeleton__root_e7018 span{border-radius:.1666666667rem;display:inline-block;width:100%;opacity:.25}.TheTextSkeleton__color_620e0{transition:background-color .3s ease}.TheTextSkeleton__color_base_10465 span{background-color:var(--textBase)}.TheTextSkeleton__color_secondary_e1ef1 span{background-color:var(--textSecondary)}.TheTextSkeleton__color_brand-accent_afa16 span{background-color:var(--textBrandAccent)}.TheTextSkeleton__color_brand-market_fca73 span{background-color:var(--textBrandMarket)}.TheTextSkeleton__color_error_64442 span{background-color:var(--textError)}.TheTextSkeleton__color_success_5a3da span{background-color:var(--textSuccess)}.TheTextSkeleton__color_inverse_54207 span{background-color:var(--textInverse)}.TheTextSkeleton__color_inverse-secondary_5e112 span{background-color:var(--textInverseSecondary)}.TheTextSkeleton__color_disable_88db9 span{background-color:var(--textDisable)}.TheTextSkeleton__size_title_huge_23e69{height:4.6666666667rem;padding-top:1.6666666667rem}.TheTextSkeleton__size_title_huge_23e69 span{height:2.0833333333rem;border-radius:.6666666667rem}.TheTextSkeleton__size_title_large_3374c{height:3rem;padding-top:1.0833333333rem}.TheTextSkeleton__size_title_large_3374c span{height:1.25rem;border-radius:.3333333333rem}.TheTextSkeleton__size_title_medium_0f6e0{height:2.6666666667rem;padding-top:1rem}.TheTextSkeleton__size_title_medium_0f6e0 span{height:1.0833333333rem;border-radius:.3333333333rem}.TheTextSkeleton__size_title_small_138c6{height:2.3333333333rem;padding-top:.8333333333rem}.TheTextSkeleton__size_title_small_138c6 span{height:1rem;border-radius:.3333333333rem}.TheTextSkeleton__size_title_extraSmall_2f6ca{height:2rem;padding-top:.75rem}.TheTextSkeleton__size_title_extraSmall_2f6ca span{height:.8333333333rem;border-radius:.25rem}.TheTextSkeleton__size_headline_small_96a95{height:2rem;padding-top:.75rem}.TheTextSkeleton__size_headline_small_96a95 span{height:.75rem;border-radius:.25rem}.TheTextSkeleton__size_subhead_large_effd2{height:1.8333333333rem;padding-top:.6666666667rem}.TheTextSkeleton__size_subhead_large_effd2 span{height:.6666666667rem;border-radius:.25rem}.TheTextSkeleton__size_text_small_e5cd8{height:1.5rem;padding-top:.5833333333rem}.TheTextSkeleton__size_text_small_e5cd8 span{height:.5833333333rem;border-radius:.1666666667rem}.TheTextSkeleton__size_caption_small_f5390{height:1.1666666667rem;padding-top:.4166666667rem}.TheTextSkeleton__size_caption_small_f5390 span{height:.5rem;border-radius:.1666666667rem}.Loader__root_6a680{position:relative;border-radius:100%;overflow:hidden}.Loader__root_6a680 img,.Loader__root_6a680 svg{display:block;width:100%;height:100%}.Loader__root_6a680 svg{animation:Loader__rotate360_01915 1s infinite linear}.Loader__size_xs_72d28{width:1.3333333333rem;height:1.3333333333rem}.Loader__size_s_d91c3{width:2rem;height:2rem}.Loader__size_m_c2262{width:2.6666666667rem;height:2.6666666667rem}.Loader__size_l_ab27e{width:3.3333333333rem;height:3.3333333333rem}.Loader__size_xl_f9fa1{width:4rem;height:4rem}@keyframes Loader__rotate360_01915{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.Button__root_d73c7{cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center;width:fit-content;box-sizing:border-box;transition:.3s ease;transition-property:background-color,color,transform}.Button__interaction-type_webview_cbcd8:active{transform:scale(.95)}.Button__size_xl_d4508{padding:.6666666667rem 2rem;height:4.6666666667rem}.Button__size_l_36a47{padding:.6666666667rem 2rem;height:4rem}.Button__size_m_a0dfa{padding:.6666666667rem 1.3333333333rem;height:3.3333333333rem}.Button__size_s_c29cc{padding:.6666666667rem 1.3333333333rem;height:2.8333333333rem}.Button__view_2d25c{transition:.3s ease;transition-property:background-color,border-color}.Button__view_primary_2e1d8{background-color:var(--bgBrand)}.Button__view_tertiary_87211{background-color:transparent}.Button__view_outlineBase_c6ec7{background-color:transparent;border:1px solid var(--borderSecondary)}.Button__view_system_b353e{background-color:var(--bgSecondary)}.Button__view_brandOpacity_464b2{background-color:var(--bgButtonAccentTransparent)}.Button__view_secondary_04e61{background-color:var(--bgSecondaryTransparent)}.Button__view_criticalOnSurface_466b2{background-color:transparent;border:2px solid var(--bgErrorTransparentLightest)}.Button__view_criticalOpacity_0847b{background-color:var(--bgErrorTransparentLightest)}.Button__view_onDarkPrimary_1e4eb{background-color:var(--bgBase)}.Button__view_base_a30a0{background-color:var(--bgBaseInverse)}.Button__view_skeleton_fd281{background-color:var(--bgSecondaryTransparent)}.Button__radius_m_ee05f{border-radius:var(--border-radius-m)}.Button__radius_s_f15d9{border-radius:var(--border-radius-s)}.Button__wrapper_e7d56{display:flex;align-items:center;justify-content:center;gap:8px;opacity:1;transition:.3s ease;transition-property:opacity}.Button__loader_37a37{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.Button__is-disabled_b357e{background-color:var(--bgDisable);border-color:var(--bgDisable);pointer-events:none}.Button__is-loading_53182{opacity:0}.Button__is-wide_3f0c1{width:100%}@keyframes SkeletonWrapper__pulse_fef1d{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.SkeletonWrapper__root_e7206{width:100%;animation:SkeletonWrapper__pulse_fef1d 2s ease infinite;cursor:default;-webkit-user-select:none;user-select:none;pointer-events:none}.TransitionFade__fade-enter-active_aa1d8,.TransitionFade__fade-leave-active_39194{transition:opacity .3s ease}.TransitionFade__fade-enter-from_74398{opacity:0}.TransitionFade__fade-enter-to_9effe{opacity:1}.TransitionFade__fade-leave-from_f3b1a{opacity:1;filter:blur(0);transition:opacity .3s ease,filter .3s ease .15s}.TransitionFade__fade-leave-to_fab21{opacity:0;filter:blur(5px);transition:opacity .3s ease .15s,filter .3s ease}.TheImage__root_484a1{position:relative;display:flex;justify-content:center;align-items:center}.TheImage__image_2c261{width:100%;height:100%;transition:opacity .2s ease}.TheImage__mixBlendMode_ca9ee{mix-blend-mode:darken}.TheImage__objectFit_cover_8f5ee{object-fit:cover}.TheImage__objectFit_contain_c6076{object-fit:contain}.TheImage__placeholder_1e624{height:30%}.TheImage__placeholder_1e624 img{height:30%;opacity:.6;transition:opacity .2s ease}.TheImage__hasPulse_af1f2{animation:TheImage__pulse_56855 2s ease infinite}@keyframes TheImage__pulse_56855{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.ThePicture__root_e38eb{display:block}.ThePicture__image_29186{width:100%;height:100%}.ThePicture__objectFit_cover_0c234{object-fit:cover}.ThePicture__objectFit_contain_9e95d{object-fit:contain}.TransitionVisibilityToggle__enter-active_bc3d6,.TransitionVisibilityToggle__leave-active_23b21{transition:opacity .3s ease,filter .3s ease}.TransitionVisibilityToggle__enter-from_0ca29{opacity:0}.TransitionVisibilityToggle__enter-to_6293c{opacity:1}.TransitionVisibilityToggle__leave-from_4b6bf{opacity:1;filter:blur(0);transition:opacity .3s ease,filter .3s ease .15s}.TransitionVisibilityToggle__leave-to_d0bb6{opacity:0;filter:blur(5px);transition:opacity .3s ease .15s,filter .3s ease}.ToastItem__root_ef96a{position:relative;padding-top:1rem;padding-bottom:1rem;display:flex;align-items:center;height:100%;box-sizing:border-box;width:calc(100vw - 6rem);background-color:var(--black_namba)}.ToastItem__is-icon_fab71{padding-right:2.1666666667rem}.ToastItem__is-icon_fab71 .ToastItem__icon_27903{right:0rem}.ToastItem__timer_1a2c8{margin-right:.6666666667rem}.ToastItem__icon_27903{position:absolute;top:1rem;right:0}.ToastItem__button_eb561{position:absolute;top:1.1666666667rem;right:0}.ToastItem__title_949d1{white-space:nowrap}.Toaster__toaster-enter-from_efcfd{position:absolute;left:50%;transform:translateY(100px) translate(-50%)!important;opacity:0}.Toaster__toaster-enter_7d5d8,.Toaster__toaster-enter-to_6201a{position:absolute;left:50%;transform:translateY(0) translate(-50%)!important;opacity:1}.Toaster__toaster-enter-active_528d1{transition:.3s ease-in;transition-property:transform,opacity,left}.Toaster__toaster-leave-active_952ab{transition:.3s ease;transition-property:transform,opacity,left}.Toaster__toaster-leave-from_f98c0{position:absolute;left:50%;transform:translateY(0) translate(-50%)!important;opacity:1}.Toaster__toaster-leave_948f8,.Toaster__toaster-leave-to_05c33{position:absolute;left:50%;transform:translateY(100px) translate(-50%)!important;opacity:0}.Toaster__root_73fc8{position:absolute;left:50%;transform:translate(-50%);position:fixed;bottom:calc(var(--tab-bar-height) + var(--safe-area-inset-bottom) + 5rem);z-index:var(--z-index-toaster);text-align:center}.Toaster__root_73fc8.Toaster__is-expand_984b8 .Toaster__toaster_72d65:nth-child(2) .Toaster__body_22a84 div,.Toaster__root_73fc8.Toaster__is-expand_984b8 .Toaster__toaster_72d65:nth-child(3) .Toaster__body_22a84 div,.Toaster__root_73fc8.Toaster__is-expand_984b8 .Toaster__toaster_72d65:nth-child(4) .Toaster__body_22a84 div{transition:.3s ease;transition-delay:.2s;opacity:1}.Toaster__toaster_72d65{position:absolute;left:50%;transform:translate(-50%);transition:.3s ease;transition-property:transform,opacity,top,left}.Toaster__toaster_72d65:nth-child(1){z-index:calc(var(--z-index-toaster) + 3)}.Toaster__toaster_72d65:nth-child(2){z-index:var(--z-index-toaster)2;transform:translateY(10%) translate(-50%)}.Toaster__toaster_72d65:nth-child(2) .Toaster__body_22a84 div{transition:.1s ease;transition-property:opacity;opacity:0}.Toaster__toaster_72d65:nth-child(3){z-index:var(--z-index-toaster)1;transform:translateY(20%) translate(-50%)}.Toaster__toaster_72d65:nth-child(3) .Toaster__body_22a84 div{transition:.1s ease;transition-property:opacity;opacity:0}.Toaster__toaster_72d65:nth-child(4){z-index:var(--z-index-toaster)0;transform:translateY(30%) translate(-50%)}.Toaster__toaster_72d65:nth-child(4) .Toaster__body_22a84 div{transition:.1s ease;transition-property:opacity;opacity:0}.Toaster__body_22a84{position:relative;z-index:2}.Toaster__left_4f54d,.Toaster__right_9c31e,.Toaster__body_22a84{transition:.3s ease;transition-property:transform,opacity,top,left;background:var(--black_namba);box-sizing:border-box}.Toaster__left_4f54d,.Toaster__right_9c31e{position:absolute;top:0;z-index:1;height:100%;width:1.5rem}.Toaster__left_4f54d{left:0;border-radius:1.3333333333rem 0 0 1.3333333333rem}.Toaster__right_9c31e{right:0;border-radius:0 1.3333333333rem 1.3333333333rem 0}.Toaster__shadow_acb59{box-shadow:0 .1666666667rem .6666666667rem #21242c1a;position:absolute;z-index:-1;background-color:transparent}.Toaster__shadow_acb59.Toaster__body_22a84{width:100%;height:100%;top:0}

package/dist/scss/functions.scss

@@ -0,0 +1,86 @@
+@use 'sass:math';
+@use 'sass:map';
+@use 'sass:list';
+
+@function strip-unit($number) {
+    @if type-of($number) == 'number' and not unitless($number) {
+        @return math.div($number, ($number * 0 + 1));
+    }
+
+    @return $number;
+}
+
+@function hsla-str($color) {
+    @return unquote(
+        'hsla(#{math.div(hue($color),1deg)}, #{saturation($color)}, #{lightness($color)}, #{alpha($color)})'
+    );
+}
+
+@function hsla-new($color, $options: ()) {
+    $newL: lightness($color);
+    $newA: alpha($color);
+    $newS: saturation($color);
+
+    @if (map.get($options, 'l')) {
+        $newL: strip-unit(map.get($options, 'l')) * 1%;
+    }
+
+    @if (map.get($options, 'a')) {
+        $newA: map.get($options, 'a');
+    }
+
+    @if (map.get($options, 's')) {
+        $newS: strip-unit(map.get($options, 's')) * 1%;
+    }
+
+    @return hsla(math.div(hue($color), 1deg), $newS, $newL, $newA);
+}
+
+@function rem($size) {
+    $remSize: math.div($size, 12) * 1rem;
+
+    @return $remSize;
+}
+
+@function freezeRem($size) {
+    $newSize: $size * 1.2 * 1px;
+
+    @return $newSize;
+}
+
+@function to-unit($value) {
+    @if type-of($value) != 'string' {
+        @error 'Value for `to-unit` should be a string.';
+    }
+
+    $units: (
+        'px': 1px,
+        'cm': 1cm,
+        'mm': 1mm,
+        '%': 1%,
+        'ch': 1ch,
+        'pc': 1pc,
+        'in': 1in,
+        'em': 1em,
+        'rem': 1rem,
+        'pt': 1pt,
+        'ex': 1ex,
+        'vw': 1vw,
+        'vh': 1vh,
+        'vmin': 1vmin,
+        'vmax': 1vmax,
+    );
+    $parsed-unit: false;
+
+    @each $unit in $units {
+        @if (str-index($value, list.nth($unit, 1))) {
+            $parsed-unit: list.nth($unit, 2);
+        }
+    }
+
+    @if (not $parsed-unit) {
+        @error 'Invalid unit `#{$value}`.';
+    }
+
+    @return $parsed-unit;
+}

package/dist/scss/mixins.scss

@@ -0,0 +1,178 @@
+@use "sass:map";
+@use "sass:list";
+
+@use './typography' as *;
+@use './spaces' as *;
+
+@mixin newFont($family, $pathName, $weight, $style: normal) {
+    @font-face {
+        font-family: '#{$family}';
+        src:
+            url('/fonts/#{$pathName}.woff2') format('woff2'),
+            url('/fonts/#{$pathName}.woff') format('woff');
+        font-weight: #{$weight};
+        font-style: $style;
+        font-display: swap;
+    }
+}
+
+@mixin getIcon($name) {
+    content: map.get($icons, $name);
+}
+
+@mixin iconsModify() {
+    @each $name, $glyph in $icons {
+        &--#{$name} {
+            &::before {
+                content: $glyph;
+            }
+        }
+    }
+}
+
+@mixin getPositionStyle($style, $direction, $value) {
+    @if $direction == $style {
+        #{ $direction }: $value;
+    } @else if $direction == vertical {
+        $styleNameTop: #{$style} + '-top';
+        $styleNameBottom: #{$style} + '-bottom';
+
+        #{$styleNameTop}: $value;
+        #{$styleNameBottom}: $value;
+    } @else if $direction == horizontal {
+        $styleNameLeft: #{$style} + '-left';
+        $styleNameRight: #{$style} + '-right';
+
+        #{$styleNameLeft}: $value;
+        #{$styleNameRight}: $value;
+        //#{ $style }: 0 $value;
+    } @else if $direction == both {
+        #{ $style }: $value;
+    } @else {
+        $styleName: #{$style} + '-' + #{$direction};
+
+        #{ $styleName }: #{$value};
+    }
+}
+
+@mixin marginLevel($direction, $color, $sign: plus) {
+    $styleName: margin;
+    $value: map.get($spaces, $color);
+    @if ($sign == minus) {
+        $value: -#{$value};
+    }
+    @include getPositionStyle($styleName, $direction, $value);
+}
+
+@mixin paddingLevel($direction, $color) {
+    $styleName: padding;
+    $value: map.get($spaces, $color);
+    @include getPositionStyle($styleName, $direction, $value);
+}
+
+@mixin positionLevel($direction, $color, $sign: plus) {
+    $styleName: $direction;
+    $value: map.get($spaces, $color);
+
+    @if ($sign == minus) {
+        $value: -#{$value};
+    }
+
+    @include getPositionStyle($styleName, $direction, $value);
+}
+
+@mixin gapLevel($color) {
+    $value: map.get($spaces, $color);
+    gap: $value;
+}
+
+@mixin fontSize($name, $options: ()) {
+    @each $tagName, $tagValue in $tags {
+        @if $tagName == $name {
+            font-size: list.nth($tagValue, 1);
+            line-height: list.nth($tagValue, 2);
+            font-weight: list.nth($tagValue, 3);
+            letter-spacing: list.nth($tagValue, 4);
+        }
+    }
+
+    @if map.get($options, weight) {
+        font-weight: #{map.get($options, weight)};
+    }
+
+    @if map.get($options, style) {
+        font-style: map.get($options, style);
+    }
+
+    @if map.get($options, family) {
+        font-family: map.get($options, family);
+    }
+
+    @if map.get($options, line-height) {
+        line-height: map.get($options, line-height);
+    }
+}
+
+$weights: (
+    thin: 100,
+    light: 300,
+    regular: 400,
+    medium: 500,
+    semibold: 600,
+    bold: 700,
+);
+
+@mixin fontWeight($weight) {
+    font-weight: map.get($weights, $weight);
+}
+
+@mixin mono-space {
+    font-feature-settings:
+        'tnum' on,
+        'lnum' on;
+}
+
+@mixin center($position: 'both') {
+    position: absolute;
+
+    @if $position == 'vertical' {
+        top: 50%;
+        transform: translateY(-50%);
+    } @else if $position == 'horizontal' {
+        left: 50%;
+        transform: translateX(-50%);
+    } @else if $position == 'both' {
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+    } @else if $position == 'stretch' {
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+    }
+}
+
+@mixin ellipsis {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 100%;
+}
+
+@mixin flex-page {
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+}
+
+@mixin interactiveType {
+    .interaction-type {
+        &_webview {
+            &:active {
+                transform: scale(0.95);
+            }
+        }
+    }
+}
+

package/dist/scss/spaces.scss

@@ -0,0 +1,47 @@
+@use 'sass:math';
+@use './functions' as *;
+
+$spaces: (
+    coral: (
+        rem(2),
+    ),
+    blue: (
+        rem(4),
+    ),
+    pink: (
+        rem(6),
+    ),
+    green: (
+        rem(8),
+    ),
+    gold: (
+        rem(12),
+    ),
+    red: (
+        rem(16),
+    ),
+    olive: (
+        rem(20),
+    ),
+    orange: (
+        rem(24),
+    ),
+    black: (
+        rem(32),
+    ),
+    gray: (
+        rem(40),
+    ),
+    yellow: (
+        rem(48),
+    ),
+    purple: (
+        rem(56),
+    ),
+    cobalt: (
+        rem(64),
+    ),
+    white: (
+        rem(80),
+    ),
+);

package/dist/scss/typography.scss

@@ -0,0 +1,162 @@
+@use './functions' as *;
+
+// Нестандартное название шрифта что бы не было замены
+//   на системный шрифт в ios
+$mainFontFamily: 'sf-pro-custom';
+$monoFontFamily: 'SFMono';
+$icon: 'icon', sans-serif;
+$fontFamily:
+    $mainFontFamily,
+    -apple-system,
+    blinkmacsystemfont,
+    'Inter',
+    'Arial',
+    sans-serif;
+
+// (font-size, line-height, weight, letter-spacing)
+$tags: (
+    titleHuge: (
+        rem(48),
+        rem(56),
+        600,
+        rem(0.35),
+    ),
+    titleExtraLarge: (
+        rem(38),
+        rem(46),
+        700,
+        rem(0.4)
+    ),
+    titleLarge: (
+        rem(28),
+        rem(36),
+        600,
+        rem(0.37)
+    ),
+    titleLargeBold: (
+        rem(28),
+        rem(36),
+        700,
+        rem(0.37)
+    ),
+    titleLargeHeavy: (
+        rem(28),
+        rem(36),
+        800,
+        rem(0.37)
+    ),
+    titleLargeRegular: (
+        rem(28),
+        rem(36),
+        400,
+        rem(0.37)
+    ),
+    titleMedium: (
+        rem(24),
+        rem(32),
+        600,
+        rem(0.06)
+    ),
+    titleSmall: (
+        rem(22),
+        rem(28),
+        600,
+        rem(-0.27)
+    ),
+    titleSmallRegular: (
+        rem(22),
+        rem(28),
+        400,
+        rem(-0.27)
+    ),
+    titleExtraSmallBold: (
+        rem(19),
+        rem(24),
+        700,
+        rem(-0.45)
+    ),
+    titleExtraSmall: (
+        rem(19),
+        rem(24),
+        600,
+        rem(-0.45)
+    ),
+    headlineMedium: (
+        rem(17),
+        rem(24),
+        600,
+        rem(-0.44)
+    ),
+    headlineSmall: (
+        rem(17),
+        rem(24),
+        500,
+        rem(-0.44)
+    ),
+    body: (
+        rem(17),
+        rem(22),
+        400,
+        rem(-0.25)
+    ),
+    bodyMedium: (
+        rem(17),
+        rem(22),
+        500,
+        rem(0.04)
+    ),
+    subheadLarge: (
+        rem(15),
+        rem(22),
+        600,
+        rem(-0.25)
+    ),
+    subheadMedium: (
+        rem(15),
+        rem(22),
+        500,
+        rem(-0.25)
+    ),
+    subheadSmall: (
+        rem(15),
+        rem(22),
+        400,
+        rem(-0.25)
+    ),
+    textLarge: (
+        rem(13),
+        rem(18),
+        600,
+        rem(-0.1)
+    ),
+    textMedium: (
+        rem(13),
+        rem(18),
+        500,
+        rem(-0.1)
+    ),
+    textSmall: (
+        rem(13),
+        rem(18),
+        400,
+        rem(-0.1)
+    ),
+    captionLarge: (
+        rem(11),
+        rem(14),
+        600,
+        rem(0.05)
+    ),
+    captionMedium: (
+        rem(11),
+        rem(14),
+        500,
+        rem(0.05)
+    ),
+    captionSmall: (
+        rem(11),
+        rem(14),
+        400,
+        rem(0.05)
+    ),
+);