@matbea-ui/matbea-ui 0.1.7 → 0.2.0

package/dist/types/index.d.ts

@@ -1,4 +1,330 @@
-export * from "./components";
-export * from "./widgets";
-export * from "./utils";
-export * from "./theme";
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as react from 'react';
+import react__default, { ReactNode, ButtonHTMLAttributes, ChangeEvent, FocusEventHandler } from 'react';
+import * as styled_components_dist_types from 'styled-components/dist/types';
+import * as styled_components from 'styled-components';
+
+type ButtonVariant = "primary" | "secondary" | "tertiary";
+type ButtonSize = "default" | "medium" | "small";
+type ButtonForm = "default" | "brick-right";
+
+type IconPosition = "left" | "right" | "only";
+type ButtonProps = {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    form?: ButtonForm;
+    fullWidth?: boolean;
+    icon?: ReactNode;
+    iconPosition?: IconPosition;
+    children?: ReactNode;
+} & ButtonHTMLAttributes<HTMLButtonElement>;
+declare const Button: ({ variant, size, form, fullWidth, icon, iconPosition, children, disabled, ...rest }: ButtonProps) => react_jsx_runtime.JSX.Element;
+
+type CopyTooltipProps = {
+    label: string;
+    children?: React.ReactNode;
+    copiedText?: string;
+    copyDuration?: number;
+};
+declare const CopyTooltip: React.FC<CopyTooltipProps>;
+
+type TypographyVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "body-xl-semibold" | "body-xl" | "body-l-semibold" | "body-l" | "body-m-bold" | "body-m-semibold" | "body-m" | "body-s-semibold" | "body-s" | "button" | "form-input" | "avatar-basic" | "avatar-m" | "avatar-s";
+
+type ElementTypeProp = React.ElementType;
+type TypographyOwnProps = {
+    variant?: TypographyVariant;
+    color?: string;
+    align?: "left" | "center" | "right" | "justify";
+    uppercase?: boolean;
+    truncate?: boolean;
+    inline?: boolean;
+};
+type PolymorphicProps<C extends ElementTypeProp> = TypographyOwnProps & Omit<React.ComponentPropsWithoutRef<C>, keyof TypographyOwnProps> & {
+    as?: C;
+    forwardedAs?: C;
+};
+type TypographyComponent = <C extends ElementTypeProp = "span">(props: PolymorphicProps<C>) => React.ReactElement | null;
+declare const Typography: TypographyComponent;
+
+type InformerType = "success" | "error" | "info" | "warning";
+type InformerProps = {
+    label: string;
+    description: string;
+    type: InformerType;
+    icon?: boolean;
+};
+declare const Informer: React.FC<InformerProps>;
+
+type TextFieldProps = {
+    value?: string;
+    defaultValue?: string;
+    placeholder?: string;
+    label?: string;
+    error?: string;
+    disabled?: boolean;
+    icon?: React.ReactNode;
+    action?: React.ReactNode;
+    name?: string;
+    type?: React.HTMLInputTypeAttribute;
+    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    onFocus?: React.FocusEventHandler<HTMLInputElement>;
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+    className?: string;
+};
+declare const TextField: react.ForwardRefExoticComponent<TextFieldProps & react.RefAttributes<HTMLInputElement>>;
+
+declare const Container: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+
+declare const Counter: ({ count }: {
+    count?: number;
+}) => react_jsx_runtime.JSX.Element;
+
+type HamburgerButtonProps = {
+    open?: boolean;
+    onToggle?: (next: boolean) => void;
+};
+declare const HamburgerButton: React.FC<HamburgerButtonProps>;
+
+declare const Loader: () => react_jsx_runtime.JSX.Element;
+
+type RadioButtonProps = {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    disabled?: boolean;
+    name?: string;
+    value?: string;
+    label?: string;
+    onChange?: (value: boolean) => void;
+    className?: string;
+};
+declare const RadioButton: React.FC<RadioButtonProps>;
+
+type SelectOption = {
+    label: string;
+    value: string;
+    icon?: React.ReactNode;
+};
+type SelectFieldProps = {
+    options: SelectOption[];
+    value?: string;
+    defaultValue?: string;
+    placeholder?: string;
+    label?: string;
+    error?: string;
+    disabled?: boolean;
+    icon?: React.ReactNode;
+    name?: string;
+    onChange?: (value: string) => void;
+    onFocus?: FocusEventHandler<HTMLDivElement>;
+    onBlur?: FocusEventHandler<HTMLDivElement>;
+    className?: string;
+};
+declare const SelectField: react.ForwardRefExoticComponent<SelectFieldProps & react.RefAttributes<HTMLInputElement>>;
+
+type TooltipPosition = "top" | "bottom" | "left" | "right";
+
+type TooltipProps = {
+    content: react__default.ReactNode;
+    children: react__default.ReactNode;
+    position?: TooltipPosition;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    showDelay?: number;
+    hideDelay?: number;
+    interactive?: boolean;
+    disabled?: boolean;
+    hideOnClick?: boolean;
+    maxWidth?: number | string;
+};
+declare const Tooltip: react__default.FC<TooltipProps>;
+
+declare const UserAccount: ({ email }: {
+    email: string;
+}) => react_jsx_runtime.JSX.Element;
+
+type TabSize = "m" | "l" | "xl";
+type TabProps = {
+    id: string;
+    label: string;
+    active?: boolean;
+    disabled?: boolean;
+    size?: TabSize;
+    onSelect?: (id: string) => void;
+    className?: string;
+};
+
+type TabItem = Omit<TabProps, "onSelect" | "size" | "active">;
+type TabListProps = {
+    size?: TabSize;
+    activeId: string;
+    items: TabItem[];
+    onChange: (id: string) => void;
+    className?: string;
+};
+declare const TabList: React.FC<TabListProps>;
+
+type Column = {
+    name: string;
+    id: string;
+    align?: "left" | "center" | "right";
+    width?: HTMLElement["style"]["width"];
+    render?: (row: Row) => React.ReactNode;
+};
+interface Row {
+    id: string;
+    [key: Column["id"]]: string | number | React.ReactNode;
+}
+interface TableProps {
+    columns: Column[];
+    data: Row[];
+}
+declare const Table: React.FC<TableProps>;
+
+type SwitcherProps = {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    disabled?: boolean;
+    onChange?: (value: boolean) => void;
+    id?: string;
+    className?: string;
+};
+declare const Switcher: React.FC<SwitcherProps>;
+
+type CheckboxProps = {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    disabled?: boolean;
+    label?: string;
+    name?: string;
+    value?: string;
+    onChange?: (next: boolean) => void;
+    className?: string;
+};
+declare const Checkbox: React.FC<CheckboxProps>;
+
+declare const Logo: () => react_jsx_runtime.JSX.Element;
+
+type ApplicationDataVariant = "primary" | "secondary";
+interface ApplicationDataProps {
+    label: string;
+    statusValue: string | React.ReactNode | number;
+    info?: string;
+    withdraw?: boolean;
+    variant?: ApplicationDataVariant;
+}
+declare const ApplicationData: React.FC<ApplicationDataProps>;
+
+type ApplicationInfoVariant = "primary" | "secondary";
+
+interface ApplicationInfoProps {
+    children: React.ReactNode;
+    actions: React.ReactNode;
+    variant?: ApplicationInfoVariant;
+}
+declare const ApplicationInfo: React.FC<ApplicationInfoProps>;
+
+interface ApplicationStatusProps {
+    label: string;
+    statusValue: string;
+    type: "pending" | "success" | "warning";
+}
+declare const ApplicationStatus: React.FC<ApplicationStatusProps>;
+
+interface BalanceProps {
+    valueLabel: string | React.ReactNode;
+    count: string;
+    amount: string;
+    actions?: React.ReactNode;
+}
+declare const BalanceRow: React.FC<BalanceProps>;
+
+interface CurrencyNameProps {
+    icon?: React.ReactNode;
+    longName?: string;
+    shortName?: string;
+    network?: string;
+}
+declare const CurrencyName: React.FC<CurrencyNameProps>;
+
+interface CurrencyRateProps extends CurrencyNameProps {
+    buyLabel?: string;
+    sellLabel?: string;
+    buyValue?: string;
+    sellValue?: string;
+}
+declare const CurrencyRate: React.FC<CurrencyRateProps>;
+
+interface RequisitesProps {
+    cardHolderLabel?: string;
+    cardHolderName?: string;
+    cardNumberLabel?: string;
+    cardNumber?: number;
+    merchantLabel?: string;
+    merchantName?: string;
+    descriptionLabel?: string;
+    description?: string;
+}
+declare const Requisites: React.FC<RequisitesProps>;
+
+interface TransactionStatusProps {
+    label: string;
+    statusValue: string;
+    type: "pending" | "success";
+}
+declare const TransactionStatus: React.FC<TransactionStatusProps>;
+
+declare const maskEmail: (email: string, keep?: number, stars?: number) => string;
+declare const formatCardNumber: (cardNum: number) => string;
+declare const copyToClipboard: (text: string) => Promise<void>;
+
+declare const theme: {
+    readonly colors: {
+        primary: {
+            primaryBlue: string;
+            hoverBlue: string;
+            activeBlue: string;
+            lightBlue2: string;
+            darkBlue: string;
+            darkBlue2: string;
+            darkBlue3: string;
+            white: string;
+        };
+        gray: {
+            lightGray2: string;
+            lightGray3: string;
+            darkGray: string;
+            lightGray: string;
+            darkGray2: string;
+            lightBlueGray: string;
+            lightBlueGray2: string;
+        };
+        accent: {
+            red: string;
+            green: string;
+            greenLight: string;
+            green2: string;
+            green2Light: string;
+            green2Dark: string;
+            orange: string;
+            purple: string;
+        };
+        icon: {
+            iconPrimary: string;
+            iconSecondary: string;
+            iconThirty: string;
+            iconFourth: string;
+            iconFive: string;
+        };
+    };
+    readonly media: {
+        readonly maxWidth: {
+            readonly mobile: "@media (max-width: 375px)";
+            readonly tablet: "@media (max-width: 834px)";
+        };
+    };
+};
+type AppTheme = typeof theme;
+
+export { ApplicationData, ApplicationInfo, ApplicationStatus, BalanceRow, Button, Checkbox, Container, CopyTooltip, Counter, CurrencyName, CurrencyRate, HamburgerButton, Informer, Loader, Logo, RadioButton, Requisites, SelectField, Switcher, TabList, Table, TextField, Tooltip, TransactionStatus, Typography, UserAccount, copyToClipboard, formatCardNumber, maskEmail, theme };
+export type { AppTheme, ApplicationDataProps, ApplicationInfoProps, ApplicationStatusProps, CurrencyNameProps, InformerProps, InformerType, RequisitesProps, SelectFieldProps, SelectOption, TextFieldProps, TransactionStatusProps, TypographyVariant };

package/package.json

@@ -1,10 +1,12 @@
 {
   "name": "@matbea-ui/matbea-ui",
-  "version": "0.1.7",
+  "version": "0.2.0",
   "license": "MIT",
+  "type": "module",
   "main": "dist/matbea-ui.cjs.js",
   "module": "dist/matbea-ui.es.js",
   "types": "dist/types/index.d.ts",
+  "sideEffects": false,
   "exports": {
     ".": {
       "types": "./dist/types/index.d.ts",
@@ -17,15 +19,18 @@
     "dist"
   ],
   "scripts": {
-    "dev": "vite",
-    "build": "tsc -p tsconfig.buildtypes.json && vite build",
-    "build:types": "tsc -p tsconfig.buildtypes.json && vite build",
-    "lint": "eslint .",
-    "generate:icons": "node scripts/generate-icons.cjs",
-    "preview": "vite preview",
-    "sb": "storybook dev -p 6006",
+    "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "build:ui": "tsup src/index.ts --format esm,cjs --dts --external react,react-dom,styled-components"
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "test:coverage": "vitest --coverage",
+    "build": "rollup -c",
+    "build:watch": "rollup -c --watch",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "prepublishOnly": "npm run lint && npm run build",
+    "clean": "rm -rf dist",
+    "generate:icons": "node scripts/generate-icons.cjs"
   },
   "peerDependencies": {
     "react": "^19",
@@ -34,14 +39,14 @@
   },
   "dependencies": {
     "lodash": "^4.17.21",
-    "react": "^19.2.0",
-    "react-dom": "^19.2.0",
-    "react-tooltip": "^5.30.0",
-    "styled-components": "^6.1.19"
+    "react-tooltip": "^5.30.0"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.1.3",
     "@eslint/js": "^9.39.1",
+    "@rollup/plugin-commonjs": "^29.0.0",
+    "@rollup/plugin-node-resolve": "^16.0.3",
+    "@rollup/plugin-typescript": "^12.3.0",
     "@storybook/addon-a11y": "^10.1.4",
     "@storybook/addon-docs": "^10.1.4",
     "@storybook/addon-vitest": "^10.1.4",
@@ -58,8 +63,13 @@
     "eslint-plugin-storybook": "^10.1.4",
     "globals": "^16.5.0",
     "playwright": "^1.57.0",
+    "rollup": "^4.53.3",
+    "rollup-plugin-dts": "^6.3.0",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-postcss": "^4.0.2",
     "storybook": "^10.1.4",
     "ts-node": "^10.9.2",
+    "tsup": "^8.5.1",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.46.4",
     "vite": "^7.2.4",

package/dist/matbea-ui.cjs10.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs30.js"),t=require("./matbea-ui.cjs41.js"),o=()=>e.jsxRuntimeExports.jsxs(t.LoaderDots,{children:[e.jsxRuntimeExports.jsx(t.LoaderDot,{}),e.jsxRuntimeExports.jsx(t.LoaderDot,{}),e.jsxRuntimeExports.jsx(t.LoaderDot,{})]});exports.Loader=o;

package/dist/matbea-ui.cjs11.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./matbea-ui.cjs30.js"),r=require("react"),n=require("./matbea-ui.cjs42.js"),p=({checked:o,defaultChecked:x=!1,disabled:e=!1,name:l,value:h,label:i,onChange:c,className:j})=>{const u=r.useId(),[R,k]=r.useState(x),s=o!==void 0,d=s?o:R,m=r.useCallback(a=>{e||(s||k(a.target.checked),c?.(a.target.checked))},[e,s,c]);return t.jsxRuntimeExports.jsxs(n.RadioLabel,{className:j,htmlFor:u,disabled:e,children:[t.jsxRuntimeExports.jsx(n.HiddenInput,{id:u,type:"radio",checked:d,onChange:m,disabled:e,name:l,value:h}),t.jsxRuntimeExports.jsx(n.VisualRadio,{$checked:d,$disabled:e}),i&&t.jsxRuntimeExports.jsx(n.LabelText,{variant:"button",children:i})]})};exports.RadioButton=p;

package/dist/matbea-ui.cjs12.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./matbea-ui.cjs30.js"),t=require("react"),l=require("./matbea-ui.cjs43.js"),J=require("./matbea-ui.cjs4.js"),Q=8,O=t.forwardRef(({options:o,value:S,defaultValue:F,placeholder:C="Text",label:D,error:p,disabled:a=!1,icon:y,name:M,onChange:T,onFocus:$,onBlur:q,className:B},P)=>{const h=t.useRef(null),w=t.useRef(null),v=t.useRef(null),[s,I]=t.useState(!1),[V,g]=t.useState(!1),[A,H]=t.useState(F??""),[f,c]=t.useState(null),[m,z]=t.useState({top:0,left:0,width:0}),i=S??A,k=t.useMemo(()=>o.find(e=>e.value===i),[o,i]),E=!!p,K=!k,N=k?.label??C,j=t.useCallback(()=>{if(!w.current)return;const e=w.current.getBoundingClientRect();z({top:e.bottom+Q,left:e.left,width:e.width})},[]);t.useLayoutEffect(()=>{if(!s)return;j();const e=()=>j();return window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[s,j]);const d=t.useCallback(()=>{I(!1),c(null)},[]),x=t.useCallback(()=>{a||(I(!0),c(e=>{if(e!==null)return e;const n=o.findIndex(u=>u.value===i);return n>=0?n:0}))},[a,o,i]),W=t.useCallback(()=>{s?d():x()},[s,d,x]),L=e=>{a||(H(e.value),T?.(e.value),d())},U=e=>{if(!a)switch(e.key){case"ArrowDown":e.preventDefault(),x(),c(n=>n===null?0:Math.min(n+1,o.length-1));break;case"ArrowUp":e.preventDefault(),x(),c(n=>n===null?o.length-1:Math.max(n-1,0));break;case"Enter":case" ":e.preventDefault(),s?f!==null&&o[f]&&L(o[f]):x();break;case"Escape":case"Tab":d();break}};t.useEffect(()=>{if(!s)return;const e=n=>{const u=n.target,R=h.current&&h.current.contains(u),b=v.current&&v.current.contains(u);!R&&!b&&d()};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[s,d]);const _=e=>{g(!0),$?.(e)},G=e=>{g(!1),q?.(e)};return r.jsxRuntimeExports.jsxs(l.Wrapper,{className:B,ref:h,onKeyDown:U,onFocus:_,onBlur:G,children:[D&&r.jsxRuntimeExports.jsx(l.Label,{children:D}),r.jsxRuntimeExports.jsxs(l.FieldContainer,{ref:w,role:"button",tabIndex:a?-1:0,"aria-haspopup":"listbox","aria-expanded":s,"aria-invalid":E,"aria-disabled":a,$hasError:E,$disabled:a,"data-state":E?"error":s||V?"active":void 0,onClick:W,children:[y&&r.jsxRuntimeExports.jsx(l.LeadingIcon,{children:y}),r.jsxRuntimeExports.jsx(l.Value,{$placeholder:K,children:N}),r.jsxRuntimeExports.jsx(l.HiddenInput,{ref:P,readOnly:!0,name:M,value:i,tabIndex:-1,"aria-hidden":!0})]}),p&&r.jsxRuntimeExports.jsx(l.ErrorText,{children:p}),s&&r.jsxRuntimeExports.jsx(l.List,{ref:v,role:"listbox",$top:m.top,$left:m.left,$width:m.width,children:o.map((e,n)=>{const u=e.value===i,R=n===f;return r.jsxRuntimeExports.jsxs(l.Option,{role:"option","aria-selected":u,"data-active":u||void 0,"data-hovered":R||void 0,onMouseEnter:()=>c(n),onMouseLeave:()=>c(null),onMouseDown:b=>b.preventDefault(),onClick:()=>L(e),children:[e.icon&&r.jsxRuntimeExports.jsx(l.OptionIcon,{children:e.icon}),r.jsxRuntimeExports.jsx(J.Typography,{variant:"form-input",children:e.label})]},e.value)})})]})});O.displayName="SelectField";exports.SelectField=O;

package/dist/matbea-ui.cjs13.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("./matbea-ui.cjs30.js"),n=require("react"),x=require("./matbea-ui.cjs44.js"),i=8,u=12,U=12,he={top:["top","bottom","right","left"],bottom:["bottom","top","right","left"],left:["left","right","top","bottom"],right:["right","left","top","bottom"]},M=(p,I,a)=>Math.min(Math.max(p,I),a),me=({content:p,children:I,position:a="top",open:Y,defaultOpen:K=!1,onOpenChange:q,showDelay:B=150,hideDelay:X=150,interactive:S=!1,disabled:c=!1,hideOnClick:V=!1,maxWidth:R})=>{const[Z,J]=n.useState(K),A=typeof Y=="boolean",s=A?!!Y:Z,_=n.useRef(null),T=n.useRef(null),w=n.useRef(null),L=n.useRef(null),y=n.useRef(null),f=n.useRef(null),H=n.useId(),C=n.useMemo(()=>({top:-9999,left:-9999,arrowX:0,arrowY:0,placement:a}),[a]),[d,N]=n.useState(C),k=()=>{L.current&&(clearTimeout(L.current),L.current=null),y.current&&(clearTimeout(y.current),y.current=null)},l=n.useCallback(t=>{A||J(t),t||N(C),q?.(t)},[C,A,q]),W=n.useCallback(()=>{c||(k(),L.current=setTimeout(()=>l(!0),B))},[c,l,B]),$=n.useCallback(()=>{c||(k(),y.current=setTimeout(()=>l(!1),X))},[c,l,X]),Q=()=>{c||W()},ee=()=>{c||$()},te=()=>{c||W()},ne=()=>{c||$()},re=()=>{V&&l(!1)},oe=()=>{S&&k()},ie=()=>{S&&$()},D=n.useCallback(()=>{if(typeof window>"u"||!T.current||!w.current)return;const t=T.current.getBoundingClientRect(),e=w.current.getBoundingClientRect(),o=window.innerWidth,h=window.innerHeight,m=t.left+t.width/2,P=t.top+t.height/2,ce=r=>{switch(r){case"top":return t.top>=e.height+u+i;case"bottom":return h-t.bottom>=e.height+u+i;case"left":return t.left>=e.width+u+i;case"right":return o-t.right>=e.width+u+i;default:return!0}},b=he[a].find(r=>ce(r))??a;let g=0,v=0;switch(b){case"top":g=t.top-e.height-u,v=m-e.width/2;break;case"bottom":g=t.bottom+u,v=m-e.width/2;break;case"left":g=P-e.height/2,v=t.left-e.width-u;break;case"right":default:g=P-e.height/2,v=t.right+u;break}const se=Math.max(o-i*2,0),le=Math.max(h-i*2,0),ue=i,ae=o-e.width-i,fe=i,de=h-e.height-i,z=e.width>=se?i:M(v,ue,ae),F=e.height>=le?i:M(g,fe,de);let O=0,j=0;if(b==="top"||b==="bottom"){const r=Math.max(e.width/2-U,0);O=M(m-(z+e.width/2),-r,r),j=0}else{const r=Math.max(e.height/2-U,0);j=M(P-(F+e.height/2),-r,r),O=0}N(r=>r.top===F&&r.left===z&&r.arrowX===O&&r.arrowY===j&&r.placement===b?r:{top:F,left:z,arrowX:O,arrowY:j,placement:b})},[a]);n.useLayoutEffect(()=>{if(!s)return;const t=w.current,e=T.current;if(!t||!e)return;const o=()=>{f.current!==null&&cancelAnimationFrame(f.current),f.current=window.requestAnimationFrame(()=>{f.current=null,D()})};o();const m=typeof window<"u"&&"ResizeObserver"in window?new ResizeObserver(o):null;return m?.observe(t),m?.observe(e),window.addEventListener("resize",o),window.addEventListener("scroll",o,!0),()=>{window.removeEventListener("resize",o),window.removeEventListener("scroll",o,!0),m?.disconnect(),f.current!==null&&(cancelAnimationFrame(f.current),f.current=null)}},[s,D]),n.useEffect(()=>k,[]),n.useEffect(()=>{if(!s)return;const t=o=>{o.key==="Escape"&&l(!1)},e=o=>{const h=o.target;_.current?.contains(h)||w.current?.contains(h)||l(!1)};return document.addEventListener("keydown",t),document.addEventListener("pointerdown",e),()=>{document.removeEventListener("keydown",t),document.removeEventListener("pointerdown",e)}},[s,l]);const G={top:d.top,left:d.left,"--tooltip-arrow-x":`${d.arrowX}px`,"--tooltip-arrow-y":`${d.arrowY}px`};return R!==void 0&&(G.maxWidth=typeof R=="number"?`${R}px`:R),E.jsxRuntimeExports.jsxs(x.TooltipWrapper,{ref:_,"data-disabled":c,children:[E.jsxRuntimeExports.jsx(x.TooltipTrigger,{ref:T,tabIndex:c?-1:0,"aria-describedby":s?H:void 0,onMouseEnter:Q,onMouseLeave:ee,onFocus:te,onBlur:ne,onClick:re,"data-open":s,children:I}),E.jsxRuntimeExports.jsxs(x.TooltipBubble,{ref:w,id:H,role:"tooltip","aria-hidden":!s,$visible:s,$interactive:S,$placement:d.placement,style:G,"data-placement":d.placement,onMouseEnter:oe,onMouseLeave:ie,children:[["string","number"].includes(typeof p)?E.jsxRuntimeExports.jsx(x.TooltipContentText,{variant:"body-m",children:p}):p,E.jsxRuntimeExports.jsx(x.TooltipArrow,{$placement:d.placement})]})]})};exports.Tooltip=me;

package/dist/matbea-ui.cjs14.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs30.js"),t=require("./matbea-ui.cjs27.js"),s=require("./matbea-ui.cjs45.js");require("react");const n=require("./matbea-ui.cjs46.js"),o=({email:r})=>e.jsxRuntimeExports.jsxs(s.UserAccountStyled,{children:[e.jsxRuntimeExports.jsx(n.UserIcon,{}),e.jsxRuntimeExports.jsx(s.UserAccountText,{variant:"body-m-semibold",children:t.maskEmail(r)})]});exports.UserAccount=o;

package/dist/matbea-ui.cjs15.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./matbea-ui.cjs30.js"),u=require("react"),l=require("./matbea-ui.cjs47.js"),a=require("./matbea-ui.cjs48.js"),d=({size:s="m",activeId:i,items:o,onChange:t,className:c})=>{const n=u.useCallback(e=>{t(e)},[t]);return r.jsxRuntimeExports.jsx(a.TabRow,{role:"tablist",className:c,children:o.map(e=>r.jsxRuntimeExports.jsx(l.Tab,{...e,size:s,active:e.id===i,onSelect:n},e.id))})};exports.TabList=d;

package/dist/matbea-ui.cjs16.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./matbea-ui.cjs30.js"),i=require("./matbea-ui.cjs49.js"),x=({columns:r,data:d})=>t.jsxRuntimeExports.jsxs(i.TableStyled,{children:[t.jsxRuntimeExports.jsx(i.TableHead,{children:t.jsxRuntimeExports.jsx(i.TableRow,{children:r.map(e=>t.jsxRuntimeExports.jsx(i.TableHeader,{width:e.width,align:e.align||"left",children:e.name},e.id))})}),t.jsxRuntimeExports.jsx(i.TableBody,{children:d.map(e=>t.jsxRuntimeExports.jsx(i.TableRow,{children:r.map(s=>t.jsxRuntimeExports.jsx(i.TableCell,{width:s.width,align:s.align||"left",children:s.render?s.render(e):e[s.id]},s.id))},e.id))})]});exports.Table=x;

package/dist/matbea-ui.cjs17.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./matbea-ui.cjs30.js"),n=require("react"),i=require("./matbea-ui.cjs50.js"),m=({checked:u,defaultChecked:a=!1,disabled:e=!1,onChange:l,id:x,className:d})=>{const h=n.useId(),j=x??h,o=u!==void 0,[k,f]=n.useState(a),r=o?u:k,s=n.useCallback(()=>{if(e)return;const t=!r;o||f(t),l?.(t)},[r,o,e,l]),y=n.useCallback(t=>{(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),s())},[s]);return c.jsxRuntimeExports.jsx(i.SwitcherRoot,{className:d,children:c.jsxRuntimeExports.jsx(i.Track,{id:j,role:"switch","aria-checked":r,"aria-disabled":e,tabIndex:e?-1:0,onClick:s,onKeyDown:y,disabled:e,$checked:r,children:c.jsxRuntimeExports.jsx(i.Thumb,{$checked:r,$disabled:e})})})};exports.Switcher=m;

package/dist/matbea-ui.cjs18.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./matbea-ui.cjs30.js"),c=require("react"),s=require("./matbea-ui.cjs51.js"),f=({checked:o,defaultChecked:h=!1,disabled:e=!1,name:d,value:l,onChange:i,className:j})=>{const x=c.useId(),n=o!==void 0,[a,k]=c.useState(h),r=n?o:a,L=c.useCallback(u=>{e||(n||k(u.target.checked),i?.(u.target.checked))},[e,n,i]);return t.jsxRuntimeExports.jsxs(s.Label,{htmlFor:x,disabled:e,className:j,children:[t.jsxRuntimeExports.jsx(s.HiddenInput,{id:x,type:"checkbox",checked:r,disabled:e,onChange:L,name:d,value:l}),t.jsxRuntimeExports.jsx(s.Box,{$checked:r,$disabled:e,children:r&&t.jsxRuntimeExports.jsx(s.CheckIcon,{viewBox:"0 0 15 11",children:t.jsxRuntimeExports.jsx("path",{d:"M5.00034 11L0 6.18738L1.42838 4.81262L5.00185 8.24806L5.00034 8.24951L13.5716 0L15 1.37476L6.42872 9.62524L5.00135 10.999L5.00034 11Z",fill:"#fff"})})})]})};exports.Checkbox=f;

package/dist/matbea-ui.cjs19.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./matbea-ui.cjs30.js");require("react");const o=require("./matbea-ui.cjs34.js"),c=require("./matbea-ui.cjs52.js"),e=require("./matbea-ui.cjs53.js"),p=require("./matbea-ui.cjs13.js"),x=({label:r,statusValue:i,withdraw:s,info:n})=>t.jsxRuntimeExports.jsxs(e.ApplicationDataStyled,{children:[t.jsxRuntimeExports.jsxs(e.ApplicationDataContent,{children:[t.jsxRuntimeExports.jsx(e.ApplicationDataLabel,{children:r}),n&&t.jsxRuntimeExports.jsx(p.Tooltip,{content:n,children:t.jsxRuntimeExports.jsx(o.InfoIcon,{size:18})})]}),t.jsxRuntimeExports.jsxs(e.ApplicationDataContent,{children:[["number","string"].includes(typeof i)&&t.jsxRuntimeExports.jsx(e.ApplicationDataValue,{children:i}),!["number","string"].includes(typeof i)&&i,s&&t.jsxRuntimeExports.jsx(c.WithdrawIcon,{size:18})]})]});exports.ApplicationData=x;

package/dist/matbea-ui.cjs2.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./matbea-ui.cjs30.js"),n=require("./matbea-ui.cjs31.js"),i=({variant:u="primary",size:x="default",form:a="default",fullWidth:c=!1,icon:t,iconPosition:l="left",children:o,disabled:y,...f})=>{const r=!!o,e=!!t&&(!r||l==="only"),d=!!t&&!e&&l==="left",h=!!t&&!e&&l==="right";return s.jsxRuntimeExports.jsxs(n.StyledButton,{type:"button",$variant:u,$size:x,$form:a,$fullWidth:c,$hasIcon:!!t&&r,$iconOnly:e,disabled:y,...f,children:[d&&s.jsxRuntimeExports.jsx(n.IconSlot,{$iconOnly:!1,children:t}),(!e||!t)&&o,e&&t&&s.jsxRuntimeExports.jsx(n.IconSlot,{$iconOnly:!0,children:t}),h&&s.jsxRuntimeExports.jsx(n.IconSlot,{$iconOnly:!1,children:t})]})};exports.Button=i;

package/dist/matbea-ui.cjs20.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./matbea-ui.cjs30.js"),i=require("./matbea-ui.cjs54.js"),r=({children:e,actions:n,variant:o="primary"})=>t.jsxRuntimeExports.jsxs(i.ApplicationInfoStyled,{$variant:o,children:[t.jsxRuntimeExports.jsx(i.ApplicationInfoDataContainer,{children:e}),n&&t.jsxRuntimeExports.jsx(i.ApplicationDataActions,{children:n})]});exports.ApplicationInfo=r;

package/dist/matbea-ui.cjs21.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./matbea-ui.cjs30.js"),c=require("react"),u=require("./matbea-ui.cjs55.js"),o=require("./matbea-ui.cjs56.js"),l=require("./matbea-ui.cjs57.js"),s=require("./matbea-ui.cjs58.js"),a=({label:n,statusValue:i,type:e})=>{const r=c.useMemo(()=>{switch(e){case"success":return t.jsxRuntimeExports.jsx(o.SuccessfullSmallIcon,{size:18});case"warning":return t.jsxRuntimeExports.jsx(l.WarningIcon,{size:18});case"pending":default:return t.jsxRuntimeExports.jsx(u.ClockIcon,{size:18})}},[e]);return t.jsxRuntimeExports.jsxs(s.ApplicationStatusStyled,{children:[t.jsxRuntimeExports.jsx(s.ApplicationStatusContent,{children:t.jsxRuntimeExports.jsx(s.ApplicationStatusLabel,{children:n})}),t.jsxRuntimeExports.jsxs(s.ApplicationStatusContent,{children:[r,t.jsxRuntimeExports.jsx(s.ApplicationStatusValue,{$type:e,children:i})]})]})};exports.ApplicationStatus=a;

package/dist/matbea-ui.cjs22.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs30.js"),l=require("./matbea-ui.cjs59.js"),c=({valueLabel:n,count:s,amount:t,actions:r})=>e.jsxRuntimeExports.jsxs(l.BalanceRowStyled,{children:[e.jsxRuntimeExports.jsx(l.BalanceCell,{children:n}),e.jsxRuntimeExports.jsx(l.BalanceCell,{children:s}),e.jsxRuntimeExports.jsx(l.BalanceCell,{children:t}),e.jsxRuntimeExports.jsx(l.BalanceCellActions,{children:r})]});exports.BalanceRow=c;

package/dist/matbea-ui.cjs23.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs30.js"),r=require("./matbea-ui.cjs60.js"),c=({icon:s,network:n,longName:u,shortName:t})=>e.jsxRuntimeExports.jsxs(r.CurrencyNameStyled,{$icon:!!s,$longname:!!u,$shortname:!!t,$network:!!n,children:[s,e.jsxRuntimeExports.jsx(r.CurrencyNameLongname,{children:u}),t&&e.jsxRuntimeExports.jsx(r.CurrencyNameShortname,{children:t}),n&&e.jsxRuntimeExports.jsx(r.CurrencyNameNetwork,{children:n})]});exports.CurrencyName=c;

package/dist/matbea-ui.cjs24.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs30.js"),r=require("./matbea-ui.cjs61.js"),j=require("./matbea-ui.cjs23.js"),R=({longName:s,shortName:x,network:c,icon:i,buyLabel:u,sellLabel:o,buyValue:t,sellValue:n})=>e.jsxRuntimeExports.jsxs(r.CurrencyRateCard,{children:[e.jsxRuntimeExports.jsx(j.CurrencyName,{longName:s,shortName:x,network:c,icon:i}),(t||n)&&e.jsxRuntimeExports.jsxs(r.CurrencyRateBody,{children:[t&&e.jsxRuntimeExports.jsxs(r.CurrencyRateBox,{children:[e.jsxRuntimeExports.jsx(r.CurrencyRatePriceLabel,{children:u}),e.jsxRuntimeExports.jsx(r.CurrencyRateAmount,{children:t})]}),n&&e.jsxRuntimeExports.jsxs(r.CurrencyRateBox,{children:[e.jsxRuntimeExports.jsx(r.CurrencyRatePriceLabel,{children:o}),e.jsxRuntimeExports.jsx(r.CurrencyRateAmount,{children:n})]})]})]});exports.CurrencyRate=R;

package/dist/matbea-ui.cjs25.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs30.js"),l=require("./matbea-ui.cjs27.js"),s=require("./matbea-ui.cjs62.js"),R=require("./matbea-ui.cjs63.js"),m=({cardHolderLabel:i,cardHolderName:x,cardNumberLabel:u,cardNumber:t,merchantLabel:n,merchantName:r,descriptionLabel:o,description:j})=>e.jsxRuntimeExports.jsxs(s.RequisitesStyled,{children:[e.jsxRuntimeExports.jsx(s.RequisitesItemLabel,{children:i}),e.jsxRuntimeExports.jsx(s.RequisitesItemValue,{children:x}),e.jsxRuntimeExports.jsx(s.RequisitesItemLabel,{children:u}),e.jsxRuntimeExports.jsxs(s.RequisitesItemValue,{children:[t&&l.formatCardNumber(t),t&&e.jsxRuntimeExports.jsx(R.CopyButton,{text:t.toString()})]}),e.jsxRuntimeExports.jsx(s.RequisitesItemLabel,{children:n}),e.jsxRuntimeExports.jsx(s.RequisitesItemValue,{children:r}),e.jsxRuntimeExports.jsx(s.RequisitesItemLabel,{children:o}),e.jsxRuntimeExports.jsx(s.RequisitesItemValue,{children:j})]});exports.Requisites=m;

package/dist/matbea-ui.cjs26.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./matbea-ui.cjs30.js"),u=require("react"),i=require("./matbea-ui.cjs55.js"),o=require("./matbea-ui.cjs56.js"),t=require("./matbea-ui.cjs64.js"),a=({label:n,statusValue:r,type:e})=>{const c=u.useMemo(()=>{switch(e){case"success":return s.jsxRuntimeExports.jsx(o.SuccessfullSmallIcon,{size:18});case"pending":default:return s.jsxRuntimeExports.jsx(i.ClockIcon,{size:18})}},[e]);return s.jsxRuntimeExports.jsxs(t.TransactionStatusStyled,{children:[s.jsxRuntimeExports.jsx(t.TransactionStatusLabel,{children:n}),s.jsxRuntimeExports.jsxs(t.TransactionStatusContent,{children:[c,s.jsxRuntimeExports.jsx(t.TransactionStatusValue,{children:r})]})]})};exports.TransactionStatus=a;

package/dist/matbea-ui.cjs27.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=(r,e=4,a=7)=>{const t=r.trim();if(!t)return t;const o=t.lastIndexOf(".");if(o<=0||o===t.length-1)return t;const c=t.slice(o+1),s=t.slice(0,o).replace(/[@.]/g,"").slice(0,e),i="*".repeat(a);return`${s}${i}${c}`},l=r=>r.toString().padStart(16,"0").replace(/(\d{4})(?=\d)/g,"$1 "),d=async r=>{try{await navigator.clipboard.writeText(r),console.log("Скопировано в буфер обмена")}catch(e){console.error("Ошибка копирования:",e)}};exports.copyToClipboard=d;exports.formatCardNumber=l;exports.maskEmail=n;

package/dist/matbea-ui.cjs28.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs29.js"),t={colors:e.colors,media:{maxWidth:{mobile:"@media (max-width: 375px)",tablet:"@media (max-width: 834px)"}}};exports.theme=t;

package/dist/matbea-ui.cjs29.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={primary:{primaryBlue:"#2D58B6",hoverBlue:"#3163F0",activeBlue:"#244AB7",lightBlue2:"#6D93FF",darkBlue:"#202D52",darkBlue2:"#1F2635",darkBlue3:"#131A2A",white:"#FFFFFF"},gray:{lightGray2:"#D9D9D9",lightGray3:"#D0D1D8",darkGray:"#9296A5",lightGray:"#F3F3F5",darkGray2:"#5E6F8D",lightBlueGray:"#EFF2FB",lightBlueGray2:"#F1F4F9"},accent:{red:"#F84545",green:"#1CD850",greenLight:"#A7FFC0",green2:"#00BC9E",green2Light:"#00D6B3",green2Dark:"#009E85",orange:"#FFA63E",purple:"#843CF0"},icon:{iconPrimary:"#202D52",iconSecondary:"#202D52",iconThirty:"#5E6F8D",iconFourth:"#FFA63E",iconFive:"#2D5B86"}};exports.colors=r;

package/dist/matbea-ui.cjs3.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./matbea-ui.cjs30.js"),a=require("react"),r=require("./matbea-ui.cjs32.js"),l=({label:e,children:s,copiedText:i="Скопировано!",copyDuration:n=1500})=>{const[c,o]=a.useState(!1),u=async()=>{try{await navigator.clipboard.writeText(e),o(!0),setTimeout(()=>o(!1),n)}catch(p){console.error("Copy failed",p)}};return t.jsxRuntimeExports.jsxs(r.Wrapper,{onClick:u,children:[s??t.jsxRuntimeExports.jsx(r.Trigger,{type:"button",children:e}),t.jsxRuntimeExports.jsx(r.Bubble,{children:c?i:e})]})};exports.CopyTooltip=l;

package/dist/matbea-ui.cjs30.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./matbea-ui.cjs65.js");var t=e.__require();exports.jsxRuntimeExports=t;

package/dist/matbea-ui.cjs31.js

@@ -1,63 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),i={default:{padding:"15px 22px",minHeight:"48px",fontSize:"15px",lineHeight:"18px",gap:"10px",iconGap:"6px"},medium:{padding:"12px 16px",minHeight:"42px",fontSize:"15px",lineHeight:"18px",gap:"10px",iconGap:"6px"},small:{padding:"10px",minHeight:"36px",fontSize:"14px",lineHeight:"17px",gap:"4px",iconGap:"4px"}},l=e=>({theme:t})=>{const r=t.colors,o={primary:{default:{bg:r.primary.primaryBlue,color:r.primary.white,border:r.primary.primaryBlue},hover:{bg:r.primary.hoverBlue,color:r.primary.white,border:r.primary.hoverBlue},active:{bg:r.primary.activeBlue,color:r.primary.white,border:r.primary.activeBlue},disabled:{bg:r.gray.lightGray2,color:r.gray.darkGray,border:r.gray.lightGray2}},secondary:{default:{bg:"transparent",color:r.primary.primaryBlue,border:r.primary.primaryBlue},hover:{bg:r.primary.primaryBlue,color:r.primary.white,border:r.primary.primaryBlue},active:{bg:r.primary.activeBlue,color:r.primary.white,border:r.primary.activeBlue},disabled:{bg:"transparent",color:r.gray.darkGray,border:r.gray.lightGray2}},tertiary:{default:{bg:"transparent",color:r.primary.primaryBlue,border:"transparent"},hover:{bg:r.gray.lightBlueGray,color:r.primary.primaryBlue,border:"transparent"},active:{bg:r.gray.lightBlueGray2,color:r.primary.primaryBlue,border:"transparent"},disabled:{bg:"transparent",color:r.gray.darkGray,border:"transparent"}}}[e];return a.css`
-      background-color: ${o.default.bg};
-      color: ${o.default.color};
-      border-color: ${o.default.border};
-
-      &:hover:not(:disabled) {
-        background-color: ${o.hover.bg};
-        color: ${o.hover.color};
-        border-color: ${o.hover.border};
-      }
-
-      &:active:not(:disabled) {
-        background-color: ${o.active.bg};
-        color: ${o.active.color};
-        border-color: ${o.active.border};
-      }
-
-      &:disabled {
-        background-color: ${o.disabled.bg};
-        color: ${o.disabled.color};
-        border-color: ${o.disabled.border};
-      }
-    `},n=a.button`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border: 1px solid transparent;
-  border-radius: ${({$form:e})=>e==="brick-right"?"0 5px 5px 0":"5px"};
-  cursor: pointer;
-  transition: background-color 0.15s ease, border-color 0.15s ease,
-    color 0.15s ease, opacity 0.15s ease;
-  font-weight: 600;
-
-  ${({$size:e})=>a.css`
-    padding: ${i[e].padding};
-    min-height: ${i[e].minHeight};
-    font-size: ${i[e].fontSize};
-    line-height: ${i[e].lineHeight};
-  `}
-
-  ${({$hasIcon:e,$iconOnly:t,$size:r})=>a.css`
-    gap: ${t?"0":e?i[r].iconGap:i[r].gap};
-  `}
-
-  ${({$fullWidth:e})=>e&&a.css`
-      width: 100%;
-    `}
-
-  ${({$variant:e})=>l(e)}
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-`,p=a.span`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  line-height: 0;
-  ${({$iconOnly:e})=>e&&a.css`
-      width: 18px;
-      height: 18px;
-    `}
-`;exports.IconSlot=p;exports.StyledButton=n;

package/dist/matbea-ui.cjs32.js

@@ -1,34 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("styled-components"),e=t.styled.div`
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  cursor: pointer;
-`,r=t.styled.button`
-  border: none;
-  background: transparent;
-  padding: 4px 8px;
-  font: inherit;
-  color: inherit;
-  cursor: pointer;
-`,o=t.styled.span`
-  position: absolute;
-  bottom: 100%;
-  left: 50%;
-  transform: translate(-50%, -6px);
-  white-space: nowrap;
-  background: rgba(0, 0, 0, 0.85);
-  color: #fff;
-  font-size: 12px;
-  padding: 4px 8px;
-  border-radius: 4px;
-  opacity: 0;
-  pointer-events: none;
-  transition: opacity 0.15s ease, transform 0.15s ease;
-
-  ${e}:hover &,
-  ${e}:focus-within &,
-  ${e}:active & {
-    opacity: 1;
-    transform: translate(-50%, -10px);
-  }
-`;exports.Bubble=o;exports.Trigger=r;exports.Wrapper=e;