{"version":3,"file":"Button.BOg6IOLK.mjs","names":["useCallback","useMemo","_Fragment"],"sources":["https:/framerusercontent.com/modules/F3emUzaCIrDXG1Thpcz1/DC485pUgXPV9mcGXv5V7/analyticsEvents.js","https:/framerusercontent.com/modules/U5i7bneQufZYH6i8Wcln/Av9Ew09DXZD97siUR6PR/pushDataLayerEvent.js","https:/framerusercontent.com/modules/84bcalCzPICgyQ15VkjZ/E9bskGktIFMABY7c8bBb/useFramerTrack.js","https:/framerusercontent.com/modules/0eF358fV2OEEm5uSzJMM/VDIgyKl2UUczoAsvcqrp/animationConstants.js","https:/framerusercontent.com/modules/tpFnvvAIpLui9IVc2GzW/WvzCUvzurMaqQL5zEjIT/Button.js"],"sourcesContent":["/**\n * Amplitude-first website event contract (CIT/website#2370).\n *\n * Stable semantic event names shared by dataLayer → GTM → Amplitude / GA4.\n * Autocapture page views are owned by the Amplitude Unified Script, not this module.\n *//** Approved custom / semantic event names. */export const ANALYTICS_EVENTS={SELECT_CONTENT:\"select_content\",SIGNUP_ALL:\"signup_all\",TOOL_COMPLETED:\"tool_completed\",BLOCKING_ERROR_SHOWN:\"blocking_error_shown\",FORM_SUBMIT_SUCCESS:\"form_submit_success\"};/** Lowercase alphanumeric kebab-case (Framer TrackingId rules). */const TRACKING_ID_PATTERN=/^[a-z0-9]+(?:-[a-z0-9]+)*$/;/**\n * Return true when `value` is a valid Framer / analytics tracking id.\n */export function isValidTrackingId(value){return typeof value===\"string\"&&TRACKING_ID_PATTERN.test(value);}/**\n * Normalize a candidate id to kebab-case tracking id, or return undefined.\n */export function normalizeTrackingId(value){if(typeof value!==\"string\")return undefined;const normalized=value.trim().toLowerCase().replace(/[^a-z0-9]+/g,\"-\").replace(/^-+|-+$/g,\"\").replace(/-{2,}/g,\"-\");return isValidTrackingId(normalized)?normalized:undefined;}// recompile: 1786970562256\n\nexport const __FramerMetadata__ = {\"exports\":{\"normalizeTrackingId\":{\"type\":\"function\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"AnalyticsEventName\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"AnalyticsEventProperties\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"isValidTrackingId\":{\"type\":\"function\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"ANALYTICS_EVENTS\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./analyticsEvents.map","/**\n * Push semantic analytics events to `window.dataLayer` for GTM.\n */import{isBrowser}from\"framer-motion\";/**\n * Push a plain object event to the GTM dataLayer.\n *\n * Prefer this for semantic business events (`select_content`, etc.). Consent Mode\n * commands still use {@link sendToGTM} (arguments-form) from `gtm.ts`.\n */export function pushDataLayerEvent(payload){if(!isBrowser)return;if(!payload||typeof payload.event!==\"string\"||payload.event.trim()===\"\")return;const cleaned={};for(const[key,value]of Object.entries(payload)){if(value===undefined||value===null||value===\"\")continue;cleaned[key]=value;}if(typeof cleaned.event!==\"string\")return;const w=window;w.dataLayer=w.dataLayer||[];w.dataLayer.push(cleaned);}// recompile: 1786970562256\n\nexport const __FramerMetadata__ = {\"exports\":{\"pushDataLayerEvent\":{\"type\":\"function\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./pushDataLayerEvent.map","/**\n * Framer custom-event tracking + GTM dataLayer bridge (CIT/website#2468 / #2370).\n *\n * Calls Framer `useTracking()` when a valid TrackingId is provided, and mirrors\n * a `select_content` (or caller-chosen) event into `dataLayer` for GTM Preview.\n */import{useCallback}from\"react\";import{useTracking}from\"framer\";import{ANALYTICS_EVENTS,isValidTrackingId}from\"https://framerusercontent.com/modules/F3emUzaCIrDXG1Thpcz1/DC485pUgXPV9mcGXv5V7/analyticsEvents.js\";import{pushDataLayerEvent}from\"https://framerusercontent.com/modules/U5i7bneQufZYH6i8Wcln/Av9Ew09DXZD97siUR6PR/pushDataLayerEvent.js\";/**\n * Track an interaction in Framer Analytics and push the same id to dataLayer.\n */export function useFramerTrack(){const track=useTracking();return useCallback((trackingId,options)=>{if(!isValidTrackingId(trackingId))return;const id=trackingId;try{track(id);}catch{// Framer runtime may be unavailable outside published/canvas contexts.\n}const pagePath=typeof window!==\"undefined\"&&window.location?window.location.pathname:undefined;pushDataLayerEvent({event:options?.eventName??ANALYTICS_EVENTS.SELECT_CONTENT,cta_id:id,trackingId:id,page_path_normalized:pagePath,...options?.properties});},[track]);}// recompile: 1786970562256\n\nexport const __FramerMetadata__ = {\"exports\":{\"FramerTrackFn\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"FramerTrackOptions\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"useFramerTrack\":{\"type\":\"function\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./useFramerTrack.map","/**\n * Shared animation timing constants for code-components.\n * Use design tokens (Tokens.getAnimationDuration, Tokens.getFramerTransition) where\n * a token exists (quick, standard, extended). Use these constants for component-\n * specific timings that have no token (e.g. hamburger menu, spinners).\n *//** Duration for instant / no-motion transitions (e.g. when prefers-reduced-motion). */export const NO_MOTION_DURATION=0;/** Navbar hamburger icon: delay before line move. */export const HAMBURGER_DELAY_LINE=.08;/** Navbar hamburger icon: delay before rotate. */export const HAMBURGER_DELAY_ROTATE=.24;/** Navbar hamburger icon: delay before center line fade-in. */export const HAMBURGER_DELAY_CENTER_FADE=.28;/** Navbar hamburger icon: duration for line translate. */export const HAMBURGER_DURATION_LINE=.18;/** Navbar hamburger icon: duration for center line opacity. */export const HAMBURGER_DURATION_OPACITY_OUT=.08;/** Spinner rotation: one full rotation duration (loading states). */export const SPINNER_DURATION=.8;/** Spinner rotation: longer variant (e.g. full-page loading). */export const SPINNER_DURATION_FULL=1;/**\n * `@keyframes` name for the Button loading spinner. Unique id avoids clashes\n * with other injected keyframe rules on the page.\n */export const BUTTON_SPIN_KEYFRAMES_NAME=\"ds-button-spinner-rotate\";/**\n * CSS rule defining {@link BUTTON_SPIN_KEYFRAMES_NAME}. Injected once per\n * loading Button when motion is allowed.\n */export const BUTTON_SPIN_KEYFRAMES_RULE=`@keyframes ${BUTTON_SPIN_KEYFRAMES_NAME} {\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n}`;// recompile: 1786970562256\n\nexport const __FramerMetadata__ = {\"exports\":{\"SPINNER_DURATION_FULL\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"BUTTON_SPIN_KEYFRAMES_NAME\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"HAMBURGER_DURATION_LINE\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"HAMBURGER_DELAY_CENTER_FADE\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"SPINNER_DURATION\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"BUTTON_SPIN_KEYFRAMES_RULE\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"NO_MOTION_DURATION\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"HAMBURGER_DELAY_ROTATE\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"HAMBURGER_DURATION_OPACITY_OUT\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"HAMBURGER_DELAY_LINE\":{\"type\":\"variable\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./animationConstants.map","/**\n * Button - Button component with multiple variants and states.\n *\n * Button component supporting solid, ghost, outline, link, legacy Primary (brand solid blue),\n * and primary-warm / primary-lush / primary-cool rainbow variants. The three rainbow variants\n * render Brand Rainbow Signature gradients (Warm, Lush, Cool) and ignore `theme`; legacy Primary\n * also ignores `theme` for label/icon colors per `buttonStyles.ts`.\n * Includes support for different sizes, states (default, disabled, loading),\n * and icon placement (leading, trailing, icon-only).\n *\n * Typography: size maps to `/Button XL` (large), `/Button LG` (medium), `/Button SM` (small).\n * Font sizes scale by breakpoint (desktop base; tablet interpolated; phone uses the small-screen preset).\n *\n * Size dimensions:\n * Small — 44 × 44px minimum touch target, 16px H padding, 8px V padding; icon-only glyph via {@link iconPixelSizeForSquareSide} (`svg.ts`)\n * Medium — 48 × 48px (icon-only), 48px height (text), 24px H padding, 12px V padding\n * Large — 56 × 56px (icon-only), 56px height (text), 32px H padding, 16px V padding\n *\n * Icon-only padding = (height − iconSize) / 2, so content fits exactly inside border-box.\n */// 1. React and React types\nimport{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import{forwardRef,useMemo,useEffect}from\"react\";// 2. Framer Motion (not applicable)\n// 3. Framer API\nimport{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{FRAMER_BREAKPOINT_DESCRIPTION}from\"https://framerusercontent.com/modules/kgixvU6ZSjEgZfx2dLER/MHZcXqVCaHFvVWYQ7CWQ/propertyControlCopy.js\";import{useFramerTrack}from\"https://framerusercontent.com/modules/84bcalCzPICgyQ15VkjZ/E9bskGktIFMABY7c8bBb/useFramerTrack.js\";import{isValidTrackingId,normalizeTrackingId}from\"https://framerusercontent.com/modules/F3emUzaCIrDXG1Thpcz1/DC485pUgXPV9mcGXv5V7/analyticsEvents.js\";// 4. Design system\nimport{Tokens,getLiquidGlassBackdropBlurFilter,useReducedMotion,LIQUID_GLASS_SHARED}from\"https://framerusercontent.com/modules/JnflwrfTBO2W3YxUCt5T/gagzSBMuqB4yu4qdS3rG/index.js\";import{SPINNER_DURATION_FULL,BUTTON_SPIN_KEYFRAMES_NAME,BUTTON_SPIN_KEYFRAMES_RULE}from\"https://framerusercontent.com/modules/0eF358fV2OEEm5uSzJMM/VDIgyKl2UUczoAsvcqrp/animationConstants.js\";import{getButtonBackgroundColor,getButtonBorderStyle,getButtonTextColor,getButtonIconColor,getFilledButtonBackgroundStyle,getGhostGlassButtonBackground,getPrimaryRainbowGradientWithColoredGlass,isPrimaryBrandGradientVariant}from\"https://framerusercontent.com/modules/QyHfeOyN9TwLDOSclcHY/KMXwp4EEdGUopCC7plyt/buttonStyles.js\";import{getFocusOutlineStyle}from\"https://framerusercontent.com/modules/LQuuOAryIVnwswuGx8Ex/Gunia8zXW7RPGT6PcP9x/layoutStyles.js\";// 5. Local\nimport{useInteractiveStates}from\"https://framerusercontent.com/modules/Oyd67FvSjdl6uCVEyAij/vo5wgJnckZsFKwLOADr8/useInteractiveStates.js\";import{isDevelopment}from\"https://framerusercontent.com/modules/llQ8rGhCICS7CbBpBDaR/s336Ofuwuag5bSUcjtMH/env.js\";import{getLinkUrl,getNewTabAriaLabel,useSmartLinkProps}from\"https://framerusercontent.com/modules/NbJRONH2Z4yDLXjbVsSq/tIlA4bDCxOgn96RfLVjG/linkHelpers.js\";import{getIcon,getIconRaw,ICON_OPTIONS_WITH_CUSTOM,ICON_OPTION_TITLES_WITH_CUSTOM}from\"https://framerusercontent.com/modules/OuAHgtW29YOxApe6lCN1/9ld191CvHrtXqbHVLJg6/icons.js\";import{iconPixelSizeForSquareSide,processSVG,squareIconPaddingOneSidePx}from\"https://framerusercontent.com/modules/Ajjw0fi7RIb9ZhcKml39/kZaSzrhXO8NWznE70PjD/svg.js\";import{PLACEHOLDER}from\"https://framerusercontent.com/modules/48iFuUf79i0lV1xbzOpm/1llYVYoXHKBoUUXzGhpH/placeholders.js\";import{normalizeElementId}from\"https://framerusercontent.com/modules/EhucoCcvUrEmkeXlMWEK/6YhgLgfjy8dGF1MJj1up/resolveElementId.js\";import{resolveBrand,resolveThemeVariant}from\"https://framerusercontent.com/modules/30edN7qiEI1dwQI5mdZ5/RdSxoUKJXTqYerHxOEo0/themeHelpers.js\";import{brandPropertyControl}from\"https://framerusercontent.com/modules/T2sckviMCmJ4Jmbp9jxp/jhbEeUK4WU395GuS0o1Z/brandControl.js\";import{themePropertyControls,resolveThemeProp}from\"https://framerusercontent.com/modules/lFWBe5qCxlzWknbvQ1Np/IBWfdVP45taFoVt1WbKb/themeControl.js\";const DEFAULT_CIRCLE_ICON_SVG=getIconRaw(\"circle\");const ButtonInternal=/*#__PURE__*/forwardRef(function ButtonInternal(props,ref){const theme=resolveThemeProp(props);const{breakpoint=\"desktop\",variant=\"solid\",\"theme\":_themeProp,\"themeTricount\":_themeTricountProp,brand,size=\"medium\",widthMode=\"responsive\",label=PLACEHOLDER.PRIMARY_BUTTON,leadingIconName=\"circle\",leadingIconSvg=DEFAULT_CIRCLE_ICON_SVG,trailingIconName=\"arrow-narrow-right\",trailingIconSvg=DEFAULT_CIRCLE_ICON_SVG,iconPosition=\"none\",disabled=false,loading=false,successState=false,link,openInNewTab=false,onClick,ariaLabel,\"aria-pressed\":ariaPressed,style,type=\"button\",id,trackingId,analyticsLocation,...rest}=props;const elementId=normalizeElementId(id);const resolvedTrackingId=isValidTrackingId(trackingId)?trackingId:normalizeTrackingId(trackingId)??normalizeTrackingId(elementId);const trackInteraction=useFramerTrack();const resolvedTheme=resolveThemeVariant(theme);const iconOnly=iconPosition===\"icon-only\";const usesConstrainedWidth=(()=>{if(iconOnly){return false;}if(style?.width===\"100%\"){return true;}if(style?.maxWidth===\"100%\"){return true;}if(widthMode===\"full\"){return true;}if(widthMode===\"responsive\"&&breakpoint===\"phone\"){return true;}return false;})();// Enforce that icon-only buttons get an explicit accessible name in\n// development. Without this, a missing `ariaLabel` ships silently\n// and AT users hear an unlabelled button. We intentionally don't\n// throw — Framer canvas / Storybook need to keep rendering — but a\n// loud `console.warn` on the dev build catches it during review.\nuseEffect(()=>{if(typeof window===\"undefined\"||!isDevelopment())return;if(!iconOnly)return;const labelText=typeof label===\"string\"?label.trim():\"\";const ariaText=typeof ariaLabel===\"string\"?ariaLabel.trim():\"\";if(!ariaText&&!labelText){console.warn(\"[Button] icon-only buttons must set `ariaLabel` (or pass a string `label` for the visually-hidden name) so screen readers announce something other than an unlabelled button.\");}},[iconOnly,ariaLabel,label]);const isDisabled=disabled;const isLoading=loading;const isInteractive=!isDisabled&&!isLoading;const reducedMotion=useReducedMotion();const isStaticRenderer=useIsStaticRenderer();const typography=size===\"large\"?Tokens.getTypographyStyles(\"/Button XL\",breakpoint):size===\"medium\"?Tokens.getTypographyStyles(\"/Button LG\",breakpoint):Tokens.getTypographyStyles(\"/Button SM\",breakpoint);const{isHovered,isPressed,isFocused,brightnessFilter,cursorStyle,handlers}=useInteractiveStates(isDisabled||isLoading);// Success state must stay fully visible — skip both the disabled dimming\n// and the hover/press brightness filter so the green fill reads clearly.\nconst finalBrightnessFilter=successState?\"none\":isDisabled?Tokens.getBrightnessFilter(true,false,false):brightnessFilter;// Icon-only: shared fill ratio + symmetric padding (`utils/svg.ts`). With label: 20 / 24 px per size.\nconst iconOnlySidePx=size===\"large\"?56:size===\"medium\"?48:44;const buttonHeightPx=iconOnly?iconOnlySidePx:size===\"large\"?56:size===\"medium\"?48:44;const iconSize=iconOnly?iconPixelSizeForSquareSide(iconOnlySidePx):size===\"small\"?20:24;// Constants for padding logic (values must be in SPACING_SCALE)\nconst PADDING_TOP_LARGE=16;const PADDING_TOP_MEDIUM=12;const PADDING_TOP_SMALL=8;const PADDING_HORIZONTAL_LARGE=32;const PADDING_HORIZONTAL_MEDIUM=24;const PADDING_HORIZONTAL_SMALL=16;const GAP_LARGE=12;const GAP_MEDIUM=10;const GAP_SMALL=8;const showIconLeading=iconPosition===\"leading\"||iconOnly;const showIconTrailing=iconPosition===\"trailing\"&&!iconOnly;const showLoadingIcon=isLoading;// Success overrides the variant/theme-derived styling entirely so the\n// confirmation state reads consistently regardless of the button's\n// original variant (solid, outline, ghost, etc.). Pair bg-success with\n// text/fg-success (same as Badge / FeaturedIcon) — inverted-primary is\n// black and fails contrast on the dark green fill.\nconst backgroundColor=successState?Tokens.getColorValue(\"/Backgrounds/bg-success\"):getButtonBackgroundColor(variant,resolvedTheme,isDisabled,brand);const border=successState?`1px solid ${Tokens.getColorValue(\"/Borders/border-success\")}`:getButtonBorderStyle(variant,resolvedTheme,isDisabled);const textColor=successState?Tokens.getColorValue(\"/Text/text-success\"):getButtonTextColor(variant,resolvedTheme,isDisabled,brand);const iconColor=successState?Tokens.getColorValue(\"/Foregrounds/fg-success\"):getButtonIconColor(variant,resolvedTheme,isDisabled,brand);const explicitTriggerColor=typeof style?.color===\"string\"?style.color:undefined;const resolvedTextColor=explicitTriggerColor??textColor;const resolvedIconColor=explicitTriggerColor??iconColor;const linkUrl=getLinkUrl(link);const hasLink=Boolean(linkUrl&&linkUrl.trim()!==\"\");const handleClick=e=>{if(!isInteractive){e.preventDefault();e.stopPropagation();return;}if(resolvedTrackingId){const destinationHost=(()=>{if(!hasLink||!linkUrl)return undefined;try{return new URL(linkUrl,typeof window!==\"undefined\"?window.location.origin:\"https://www.bunq.com\").hostname;}catch{return undefined;}})();trackInteraction(resolvedTrackingId,{properties:{...analyticsLocation?{cta_location:analyticsLocation}:{},component_id:\"button\",...destinationHost?{destination_host:destinationHost}:{},destination_type:hasLink?linkUrl.includes(\"adjust\")||linkUrl.includes(\"/download\")?\"signup\":\"link\":\"action\"}});}onClick?.(e);// When rendered as submit button, do not preventDefault so the form's onSubmit runs.\nif(type===\"submit\"){return;}// When rendered as button (no link), consume the event so Framer does not\n// treat it as unhandled and show an error state in the canvas.\nif(!hasLink){e.preventDefault();e.stopPropagation();}};const smartLink=useSmartLinkProps(link,openInNewTab,{brand,onClick:e=>handleClick(e)});const linkOpensNewTab=hasLink&&smartLink.target===\"_blank\";const trimmedAria=typeof ariaLabel===\"string\"?ariaLabel.trim():\"\";const trimmedLabel=typeof label===\"string\"?label.trim():\"\";const iconAccessibleName=trimmedAria||trimmedLabel||\"Button\";const resolvedAriaLabel=(()=>{if(!hasLink){if(iconOnly)return iconAccessibleName;if(trimmedAria!==\"\"&&trimmedAria!==trimmedLabel)return trimmedAria;return undefined;}if(linkOpensNewTab){const name=iconOnly?iconAccessibleName:trimmedLabel;if(name)return getNewTabAriaLabel(name);}if(iconOnly)return iconAccessibleName;if(trimmedAria!==\"\"&&trimmedAria!==trimmedLabel)return trimmedAria;return undefined;})();const buttonStyles=useMemo(()=>{const{background:styleBackground,color:_styleColor,...restStyle}=style??{};const getNumericSpacing=val=>parseFloat(Tokens.getResponsiveSpacing(val,breakpoint));const getPadding=()=>{if(iconOnly){const basePadding=squareIconPaddingOneSidePx(iconOnlySidePx);const basePaddingStr=Tokens.getResponsiveSpacing(basePadding,breakpoint);return`${basePaddingStr} ${basePaddingStr}`;}let top=PADDING_TOP_SMALL;let horizontal=PADDING_HORIZONTAL_SMALL;let gap=GAP_SMALL;if(size===\"large\"){top=PADDING_TOP_LARGE;horizontal=PADDING_HORIZONTAL_LARGE;gap=GAP_LARGE;}else if(size===\"medium\"){top=PADDING_TOP_MEDIUM;horizontal=PADDING_HORIZONTAL_MEDIUM;gap=GAP_MEDIUM;}const topStr=Tokens.getResponsiveSpacing(top,breakpoint);const horizontalStr=Tokens.getResponsiveSpacing(horizontal,breakpoint);if(!showIconLeading&&!showIconTrailing){return`${topStr} ${horizontalStr}`;}const horizontalVal=getNumericSpacing(horizontal);const gapVal=getNumericSpacing(gap);// Balanced padding\nif(showIconLeading&&showIconTrailing){return`${topStr} ${horizontalStr}`;}else if(showIconLeading){const right=horizontalVal+gapVal;return`${topStr} ${right}px ${topStr} ${horizontalStr}`;}// showIconTrailing\nconst left=horizontalVal+gapVal;return`${topStr} ${horizontalStr} ${topStr} ${left}px`;};const getGap=()=>{if(iconOnly)return\"0\";if(size===\"large\")return Tokens.getResponsiveSpacing(GAP_LARGE,breakpoint);if(size===\"medium\")return Tokens.getResponsiveSpacing(GAP_MEDIUM,breakpoint);return Tokens.getResponsiveSpacing(GAP_SMALL,breakpoint);};const padding=getPadding();const gap=getGap();const height=Tokens.getSpacing(buttonHeightPx);// Height per size: Small = 44px, Medium = 48px, Large = 56px.\n// Icon-only squares match the same dimension for consistent touch targets.\nconst dimension=iconOnly?size===\"large\"?56:size===\"medium\"?48:44:undefined;const widthFromMode=(()=>{if(iconOnly){return Tokens.getSpacing(dimension);}if(widthMode===\"full\"){return\"100%\";}if(widthMode===\"intrinsic\"){return\"auto\";}// responsive — match legacy default: full width on phone, intrinsic elsewhere\nreturn breakpoint===\"phone\"?\"100%\":\"auto\";})();const resolvedWidth=restStyle.width!==undefined?restStyle.width:widthFromMode;const isPrimaryBrandGradient=isPrimaryBrandGradientVariant(variant);let resolvedBackground=backgroundColor;const isTricountButton=resolveBrand(brand)===\"tricount\";if(!isDisabled&&isPrimaryBrandGradient){resolvedBackground=getPrimaryRainbowGradientWithColoredGlass(variant);}else if(!isDisabled&&variant===\"ghost\"&&theme===\"default\"&&!isTricountButton){resolvedBackground=getGhostGlassButtonBackground(backgroundColor);}const frostBackdrop=getLiquidGlassBackdropBlurFilter(LIQUID_GLASS_SHARED.frostBlurPx,LIQUID_GLASS_SHARED.saturation);// Ghost CTAs are translucent, so frost backdrop makes the glass read.\n// Primary rainbow fills are opaque: backdrop-filter cannot show through\n// the pill and Chromium/WebKit anti-alias it into a dark halo on the\n// left/right caps (especially on black section backgrounds).\nconst isGhostDefaultTheme=variant===\"ghost\"&&theme===\"default\";// tricount buttons are solid — never apply the frosted-glass backdrop.\nconst useFrostBackdrop=!isDisabled&&isGhostDefaultTheme&&resolveBrand(brand)!==\"tricount\";return{...restStyle,width:resolvedWidth,height:usesConstrainedWidth?\"auto\":height,minHeight:height,padding,borderRadius:Tokens.getRadius(\"radius-full\"),...getFilledButtonBackgroundStyle(typeof styleBackground===\"string\"?styleBackground:resolvedBackground,border),...useFrostBackdrop?{backdropFilter:frostBackdrop,WebkitBackdropFilter:frostBackdrop}:{},border,color:resolvedTextColor,display:\"inline-flex\",flexShrink:usesConstrainedWidth?1:0,maxWidth:usesConstrainedWidth?\"100%\":undefined,position:\"relative\",zIndex:Tokens.getZIndex(\"raised\"),alignItems:\"center\",justifyContent:\"center\",gap,minWidth:iconOnly?Tokens.getSpacing(dimension):Tokens.getControlSize(\"touchTarget\"),overflow:\"hidden\",boxSizing:\"border-box\",cursor:cursorStyle,filter:finalBrightnessFilter,transition:variant===\"link\"?`${Tokens.getTransition(\"background\",\"quick\")}, ${Tokens.getTransition(\"text-decoration\",\"quick\")}, ${Tokens.getTransition(\"filter\",\"quick\")}`:`${Tokens.getTransition(\"background\",\"quick\")}, ${Tokens.getTransition(\"border\",\"quick\")}, ${Tokens.getTransition(\"filter\",\"quick\")}`,textDecoration:variant===\"link\"&&isHovered&&isInteractive?\"underline\":\"none\",textUnderlineOffset:variant===\"link\"?Tokens.getSpacing(2):\"0\",outline:isFocused?getFocusOutlineStyle(brand):\"none\",outlineOffset:Tokens.getSpacing(2),userSelect:\"none\",whiteSpace:usesConstrainedWidth?\"normal\":\"nowrap\",...typography,fontSize:restStyle.fontSize||typography?.fontSize};},[style,iconOnly,iconOnlySidePx,buttonHeightPx,size,variant,brand,theme,isDisabled,isInteractive,isHovered,isFocused,breakpoint,widthMode,usesConstrainedWidth,showIconLeading,showIconTrailing,cursorStyle,finalBrightnessFilter,typography,backgroundColor,border,resolvedTextColor]);const processCustomIconSvg=rawSvg=>{const trimmed=rawSvg.trim();const sizeMatch=trimmed.match(/width=[\"'](\\d+)[\"']/);const alreadySized=sizeMatch!==null&&parseInt(sizeMatch[1],10)===iconSize;const hasHexColors=/fill=[\"']#[0-9a-fA-F]{3,8}[\"']/i.test(trimmed);return processSVG(trimmed,alreadySized?undefined:iconSize,hasHexColors?undefined:resolvedIconColor);};const getLeadingIconSVG=()=>{if(!showIconLeading)return null;if(showLoadingIcon)return getIcon(\"loading\",iconSize,resolvedIconColor,{opticalInset:0});if(leadingIconName===\"custom\"&&leadingIconSvg?.trim()?.includes(\"{if(!showIconTrailing)return null;if(showLoadingIcon)return getIcon(\"loading\",iconSize,resolvedIconColor,{opticalInset:0});if(trailingIconName===\"custom\"&&trailingIconSvg?.trim()?.includes(\"{if(!svgContent)return null;const style={display:\"inline-flex\",alignItems:\"center\",justifyContent:\"center\",width:`${iconSize}px`,height:`${iconSize}px`,flexShrink:0};if(isLoading&&svgContent.includes(\"loading\")){const spinStyle=reducedMotion||isStaticRenderer?style:{...style,animation:`${BUTTON_SPIN_KEYFRAMES_NAME} ${SPINNER_DURATION_FULL}s linear infinite`};return /*#__PURE__*/_jsx(\"span\",{style:spinStyle,dangerouslySetInnerHTML:{__html:svgContent},\"aria-hidden\":true});}return /*#__PURE__*/_jsx(\"span\",{dangerouslySetInnerHTML:{__html:svgContent},\"aria-hidden\":true,style:style});};const content=/*#__PURE__*/_jsxs(_Fragment,{children:[renderIcon(getLeadingIconSVG()),!iconOnly&&label&&/*#__PURE__*/_jsx(\"span\",{style:{minWidth:0,overflow:usesConstrainedWidth?\"visible\":\"hidden\",textOverflow:usesConstrainedWidth?\"clip\":\"ellipsis\",whiteSpace:usesConstrainedWidth?\"normal\":\"nowrap\",textAlign:\"center\"},children:label}),renderIcon(getTrailingIconSVG())]});const scale=isPressed?.98:1;const transformTransition=reducedMotion?\"none\":Tokens.getTransition(\"transform\",\"quick\");const interactiveStyle={...buttonStyles,transform:`scale(${scale})`,transition:variant===\"link\"?`${Tokens.getTransition(\"background\",\"quick\")}, ${Tokens.getTransition(\"text-decoration\",\"quick\")}, ${Tokens.getTransition(\"filter\",\"quick\")}, ${transformTransition}`:`${Tokens.getTransition(\"background\",\"quick\")}, ${Tokens.getTransition(\"border\",\"quick\")}, ${Tokens.getTransition(\"filter\",\"quick\")}, ${transformTransition}`};const mergedStyle=interactiveStyle;const commonProps={\"style\":mergedStyle,\"onMouseEnter\":handlers.onMouseEnter,\"onMouseLeave\":handlers.onMouseLeave,\"onMouseDown\":handlers.onMouseDown,\"onMouseUp\":handlers.onMouseUp,\"onFocus\":handlers.onFocus,\"onBlur\":handlers.onBlur,\"tabIndex\":isInteractive?0:-1,\"aria-disabled\":isDisabled||isLoading,\"aria-busy\":isLoading,\"aria-label\":resolvedAriaLabel,...elementId?{id:elementId}:{},...resolvedTrackingId?{\"data-analytics-id\":resolvedTrackingId}:{},...analyticsLocation?{\"data-analytics-location\":analyticsLocation}:{},...rest,...!hasLink&&ariaPressed!==undefined?{\"aria-pressed\":ariaPressed}:{}};const interactiveElement=hasLink?/*#__PURE__*/_jsx(\"a\",{ref:ref,href:isInteractive?smartLink.href:undefined,target:smartLink.target,rel:smartLink.rel,...commonProps,// Spread smartLink.style FIRST and let the button's computed\n// styles win. smartLink.style sets `color: \"inherit\"`, which\n// would otherwise clobber the variant/theme-aware textColor\n// (e.g. ghost+default needs white text, but `inherit` falls\n// back to the UA default black on sections that don't set\n// an ambient `color`).\nstyle:{...smartLink.style,...commonProps.style},onClick:smartLink.onClick,children:content}):/*#__PURE__*/_jsx(\"button\",{ref:ref,type:type,disabled:isDisabled||isLoading,...commonProps,onClick:handleClick,children:content});return /*#__PURE__*/_jsxs(_Fragment,{children:[isLoading&&!reducedMotion&&!isStaticRenderer&&/*#__PURE__*/_jsx(\"style\",{children:BUTTON_SPIN_KEYFRAMES_RULE}),interactiveElement]});});ButtonInternal.displayName=\"ButtonInternal - Atom\";/**\n * Button - Wrapper component for Framer compatibility.\n *\n * Exported as a plain named function so Framer's code-link parser recognizes\n * it as a valid code component (a `forwardRef` default export is opaque to\n * Framer's static analysis and prevents the component from being registered\n * on the canvas).\n *\n * Refs from consumers (focus management, measurement, Floating UI anchors,\n * the `Button*` wrappers in atoms/molecules) are still forwarded to the\n * underlying `