@vibe/button 3.0.16 → 3.1.0

package/dist/Button/Button.d.ts

@@ -1,6 +1,5 @@
 import React, { type AriaAttributes } from "react";
 import { type SubIcon } from "@vibe/icon";
-import { ButtonColor as ButtonColorEnum, ButtonInputType as ButtonInputTypeEnum, ButtonType as ButtonTypeEnum } from "./ButtonConstants";
 import { type ButtonColor, type ButtonInputType, type ButtonType, type ButtonSize } from "./Button.types";
 import { type VibeComponentProps } from "@vibe/shared";
 export interface ButtonProps extends VibeComponentProps {
@@ -83,17 +82,5 @@ export interface ButtonProps extends VibeComponentProps {
     /** Specifies the tab order of an element */
     tabIndex?: number;
 }
-declare const _default: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLElement>> & {
-    sizes: {
-        readonly SMALL: "small";
-        readonly MEDIUM: "medium";
-        readonly LARGE: "large";
-        readonly XXS: "xxs";
-        readonly XS: "xs";
-    };
-    colors: typeof ButtonColorEnum;
-    kinds: typeof ButtonTypeEnum;
-    types: typeof ButtonInputTypeEnum;
-    inputTags: typeof ButtonInputTypeEnum;
-};
-export default _default;
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export default Button;

package/dist/Button/Button.js

@@ -1,2 +1,2 @@
-import e,{forwardRef as a,useRef as t,useEffect as n,useCallback as r,useMemo as o}from"react";import{camelCase as i}from"es-toolkit";import s from"classnames";import{useMergeRef as l,getStyle as c,getTestId as d,ComponentDefaultTestId as m,ComponentVibeId as u,NOOP as p,withStaticProps as f,SIZES as b}from"@vibe/shared";import{Icon as y}from"@vibe/icon";import{Loader as g}from"@vibe/loader";import{ButtonColor as h,ButtonType as v,ButtonInputType as N}from"./ButtonConstants.js";import{getParentBackgroundColorNotTransparent as x,TRANSPARENT_COLOR as E}from"./helper/dom-helpers.js";import C from"./Button.module.scss.js";import{useButtonLoading as F}from"./helper/useButtonLoading.js";var k=f(a((({className:a,children:f,kind:b="primary",onClick:h=p,name:v,size:N="medium",color:k="primary",disabled:B=!1,rightIcon:S=null,leftIcon:T=null,success:I=!1,successText:j="",successIcon:O=null,style:z,loading:L=!1,loaderClassName:P,active:D=!1,activeButtonClassName:M,id:U,marginRight:w=!1,marginLeft:A=!1,type:R="button",onMouseDown:H=p,ariaLabel:q,rightFlat:G=!1,leftFlat:J=!1,preventClickAnimation:K=!1,noSidePadding:Q=!1,onFocus:V=p,onBlur:W=p,ariaLabeledBy:X,defaultTextColorOnPrimaryColor:Y=E,ariaExpanded:Z,ariaHasPopup:$,ariaControls:_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te,blurOnMouseUp:ne=!0,"data-testid":re,insetFocus:oe=!1,tabIndex:ie},se)=>{const le=t(null),ce=l(se,le),{loading:de}=F({isLoading:L});n((()=>{if("on-primary-color"!==k&&"fixed-light"!==k)return;if("primary"!==b)return;if(!le.current)return;const e=le.current;e.style.color=x(e,Y)}),[b,le,k,Y]);const me=r((()=>{const e=le.current;!B&&e&&ne&&e.blur()}),[B,le,ne]),ue=r((e=>{B||de||I?e.preventDefault():h&&h(e)}),[h,B,de,I]),pe=r((e=>{B||de||I?e.preventDefault():H&&H(e)}),[H,B,de,I]),fe=o((()=>{const e=I?"positive":k;return s(a,C.button,c(C,i("size-"+N)),c(C,i("kind-"+b)),c(C,i("color-"+e)),{[C.success]:I,[c(C,i("color-"+e+"-active"))]:D,[M]:D,[C.marginRight]:w,[C.marginLeft]:A,[C.rightFlat]:G,[C.leftFlat]:J,[C.preventClickAnimation]:K,[C.noSidePadding]:Q,[C.disabled]:B,[C.insetFocusStyle]:oe})}),[I,k,a,N,b,D,M,w,A,G,J,K,Q,B,oe]),be=o((()=>({ref:ce,type:R,className:fe,name:v,onMouseUp:me,style:z,onClick:ue,id:U,onFocus:V,onBlur:W,tabIndex:null!=ie?ie:B||ae?-1:void 0,"data-testid":re||d(m.BUTTON,U),"data-vibe":u.BUTTON,onMouseDown:pe,"aria-disabled":B,"aria-busy":de,"aria-labelledby":X,"aria-label":q,"aria-haspopup":$,"aria-expanded":Z,"aria-controls":_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te})),[ce,R,fe,v,me,z,ue,U,V,W,ie,re,pe,B,de,X,q,$,Z,_,ee,ae,te]),ye=r((e=>{if("function"==typeof e)switch(N){case"xxs":case"xs":return 16;default:return 20}}),[N]),ge=o((()=>e.Children.toArray(f).some(Boolean)),[f]),he=o((()=>e.createElement(e.Fragment,null,T?e.createElement(y,{iconType:"font",icon:T,iconSize:ye(T),className:s({[C.leftIcon]:ge}),ignoreFocusStyle:!0}):null,f,S?e.createElement(y,{iconType:"font",icon:S,iconSize:ye(S),className:s({[C.rightIcon]:ge}),ignoreFocusStyle:!0}):null)),[f,ge,ye,T,S]);return de?e.createElement("button",Object.assign({},be,{key:U+"-loading"}),e.createElement("span",{className:s(C.loader,P)},e.createElement(g,{className:C.loaderSvg}),e.createElement("span",{"aria-hidden":!0,className:C.textPlaceholder},he))):I?e.createElement("button",Object.assign({},be,{key:U+"-success"}),e.createElement("span",{className:C.successContent},O?e.createElement(y,{iconType:"font",icon:O,iconSize:ye(O),className:s({[C.leftIcon]:!!j}),ignoreFocusStyle:!0}):null,j),e.createElement("span",{"aria-hidden":"true",className:C.textPlaceholder},he)):e.createElement("button",Object.assign({},be,{key:U+"-button"}),he)})),{sizes:b,colors:h,kinds:v,types:N,inputTags:N});export{k as default};
+import e,{forwardRef as a,useRef as t,useEffect as r,useCallback as n,useMemo as o}from"react";import{camelCase as s}from"es-toolkit";import i from"classnames";import{useMergeRef as l,getStyle as c,getTestId as d,ComponentDefaultTestId as m,ComponentVibeId as u,NOOP as p}from"@vibe/shared";import{Icon as f}from"@vibe/icon";import{Loader as b}from"@vibe/loader";import{getParentBackgroundColorNotTransparent as y,TRANSPARENT_COLOR as g}from"./helper/dom-helpers.js";import h from"./Button.module.scss.js";import{useButtonLoading as v}from"./helper/useButtonLoading.js";const N=a((({className:a,children:N,kind:x="primary",onClick:E=p,name:F,size:C="medium",color:k="primary",disabled:B=!1,rightIcon:I=null,leftIcon:O=null,success:S=!1,successText:j="",successIcon:L=null,style:P,loading:T=!1,loaderClassName:z,active:D=!1,activeButtonClassName:M,id:U,marginRight:w=!1,marginLeft:A=!1,type:R="button",onMouseDown:H=p,ariaLabel:q,rightFlat:G=!1,leftFlat:J=!1,preventClickAnimation:K=!1,noSidePadding:Q=!1,onFocus:V=p,onBlur:W=p,ariaLabeledBy:X,defaultTextColorOnPrimaryColor:Y=g,ariaExpanded:Z,ariaHasPopup:$,ariaControls:_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te,blurOnMouseUp:re=!0,"data-testid":ne,insetFocus:oe=!1,tabIndex:se},ie)=>{const le=t(null),ce=l(ie,le),{loading:de}=v({isLoading:T});r((()=>{if("on-primary-color"!==k&&"fixed-light"!==k)return;if("primary"!==x)return;if(!le.current)return;const e=le.current;e.style.color=y(e,Y)}),[x,le,k,Y]);const me=n((()=>{const e=le.current;!B&&e&&re&&e.blur()}),[B,le,re]),ue=n((e=>{B||de||S?e.preventDefault():E&&E(e)}),[E,B,de,S]),pe=n((e=>{B||de||S?e.preventDefault():H&&H(e)}),[H,B,de,S]),fe=o((()=>{const e=S?"positive":k;return i(a,h.button,c(h,s("size-"+C)),c(h,s("kind-"+x)),c(h,s("color-"+e)),{[h.success]:S,[c(h,s("color-"+e+"-active"))]:D,[M]:D,[h.marginRight]:w,[h.marginLeft]:A,[h.rightFlat]:G,[h.leftFlat]:J,[h.preventClickAnimation]:K,[h.noSidePadding]:Q,[h.disabled]:B,[h.insetFocusStyle]:oe})}),[S,k,a,C,x,D,M,w,A,G,J,K,Q,B,oe]),be=o((()=>({ref:ce,type:R,className:fe,name:F,onMouseUp:me,style:P,onClick:ue,id:U,onFocus:V,onBlur:W,tabIndex:null!=se?se:B||ae?-1:void 0,"data-testid":ne||d(m.BUTTON,U),"data-vibe":u.BUTTON,onMouseDown:pe,"aria-disabled":B,"aria-busy":de,"aria-labelledby":X,"aria-label":q,"aria-haspopup":$,"aria-expanded":Z,"aria-controls":_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te})),[ce,R,fe,F,me,P,ue,U,V,W,se,ne,pe,B,de,X,q,$,Z,_,ee,ae,te]),ye=n((e=>{if("function"==typeof e)switch(C){case"xxs":case"xs":return 16;default:return 20}}),[C]),ge=o((()=>e.Children.toArray(N).some(Boolean)),[N]),he=o((()=>e.createElement(e.Fragment,null,O?e.createElement(f,{type:"font",icon:O,size:ye(O),className:i({[h.leftIcon]:ge}),ignoreFocusStyle:!0}):null,N,I?e.createElement(f,{type:"font",icon:I,size:ye(I),className:i({[h.rightIcon]:ge}),ignoreFocusStyle:!0}):null)),[N,ge,ye,O,I]);return de?e.createElement("button",Object.assign({},be,{key:U+"-loading"}),e.createElement("span",{className:i(h.loader,z)},e.createElement(b,{className:h.loaderSvg}),e.createElement("span",{"aria-hidden":!0,className:h.textPlaceholder},he))):S?e.createElement("button",Object.assign({},be,{key:U+"-success"}),e.createElement("span",{className:h.successContent},L?e.createElement(f,{type:"font",icon:L,size:ye(L),className:i({[h.leftIcon]:!!j}),ignoreFocusStyle:!0}):null,j),e.createElement("span",{"aria-hidden":"true",className:h.textPlaceholder},he)):e.createElement("button",Object.assign({},be,{key:U+"-button"}),he)}));export{N as default};
 //# sourceMappingURL=Button.js.map

package/dist/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../src/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type */\nimport React, { type AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { SIZES, useMergeRef, NOOP } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport {\n  ButtonColor as ButtonColorEnum,\n  ButtonInputType as ButtonInputTypeEnum,\n  ButtonType as ButtonTypeEnum\n} from \"./ButtonConstants\";\nimport { type ButtonColor, type ButtonInputType, type ButtonType, type ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport {\n  getTestId,\n  type VibeComponentProps,\n  withStaticProps,\n  ComponentDefaultTestId,\n  ComponentVibeId\n} from \"@vibe/shared\";\nimport { getStyle } from \"@vibe/shared\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n  children: React.ReactNode;\n  /** Custom class names to pass to the component */\n  className?: string;\n  activeButtonClassName?: string;\n  /** The button's kind */\n  kind?: ButtonType;\n  /** Callback function to run when the button is clicked */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Blur on button click */\n  blurOnMouseUp?: boolean;\n  /** Name of the button - for form submit usages  */\n  name?: string;\n  /** The button's size */\n  size?: ButtonSize;\n  /** The button's color */\n  color?: ButtonColor;\n  /** The button's type */\n  type?: ButtonInputType;\n  /** Whether the button should be disabled or not */\n  disabled?: boolean;\n  /** Icon to place on the right */\n  rightIcon?: SubIcon;\n  /** Icon to place on the left */\n  leftIcon?: SubIcon;\n  /** the success props are used when you have async action and wants to display a success message */\n  success?: boolean;\n  /** Success icon name */\n  successIcon?: SubIcon;\n  /** Success text */\n  successText?: string;\n  /** loading boolean which switches the text to a loader */\n  loading?: boolean;\n  /** className which is applied to loader container **/\n  loaderClassName?: string;\n  style?: React.CSSProperties;\n  /** displays the active state */\n  active?: boolean;\n  /** id to pass to the button */\n  id?: string;\n  /** adds 8px margin to the right */\n  marginRight?: boolean;\n  /** adds 8px margin to the left */\n  marginLeft?: boolean;\n  /** element id to describe the button accordingly */\n  ariaLabeledBy?: string;\n  /** aria label to provide important when providing only Icon */\n  ariaLabel?: string;\n  /** aria for a button popup */\n  ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n  /** aria to be set if the popup is open */\n  ariaExpanded?: boolean;\n  /** aria controls - receives id for the controlled region */\n  ariaControls?: string;\n  \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n  /**\n   * aria to be used for screen reader to know if the button is hidden\n   */\n  \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n  /**\n   * Indicates the current \"pressed\" state of toggle buttons\n   */\n  \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n  /** On Button Focus callback */\n  onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  /** On Button Blur callback */\n  onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  rightFlat?: boolean;\n  leftFlat?: boolean;\n  preventClickAnimation?: boolean;\n  noSidePadding?: boolean;\n  /** default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) */\n  defaultTextColorOnPrimaryColor?: string;\n  \"data-testid\"?: string;\n  /** Change the focus indicator from around the button to within it */\n  insetFocus?: boolean;\n  /** Specifies the tab order of an element */\n  tabIndex?: number;\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      children,\n      kind = \"primary\",\n      onClick = NOOP,\n      name,\n      size = \"medium\",\n      color = \"primary\",\n      disabled = false,\n      rightIcon = null,\n      leftIcon = null,\n      success = false,\n      successText = \"\",\n      successIcon = null,\n      style,\n      loading: isLoading = false,\n      loaderClassName,\n      active = false,\n      activeButtonClassName,\n      id,\n      marginRight = false,\n      marginLeft = false,\n      type = \"button\",\n      onMouseDown = NOOP,\n      ariaLabel,\n      rightFlat = false,\n      leftFlat = false,\n      preventClickAnimation = false,\n      noSidePadding = false,\n      onFocus = NOOP,\n      onBlur = NOOP,\n      ariaLabeledBy,\n      defaultTextColorOnPrimaryColor = TRANSPARENT_COLOR,\n      ariaExpanded,\n      ariaHasPopup,\n      ariaControls,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-hidden\": ariaHidden,\n      \"aria-pressed\": ariaPressed,\n      blurOnMouseUp = true,\n      \"data-testid\": dataTestId,\n      insetFocus = false,\n      tabIndex\n    }: ButtonProps,\n    ref\n  ) => {\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    const mergedRef = useMergeRef(ref, buttonRef);\n\n    const { loading } = useButtonLoading({ isLoading });\n\n    useEffect(() => {\n      if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n      if (kind !== \"primary\") return;\n      if (!buttonRef.current) return;\n\n      const buttonElement = buttonRef.current;\n      buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n    }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n    const onMouseUp = useCallback(() => {\n      const button = buttonRef.current;\n      if (disabled || !button) {\n        return;\n      }\n      if (blurOnMouseUp) {\n        button.blur();\n      }\n    }, [disabled, buttonRef, blurOnMouseUp]);\n\n    const onButtonClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onClick) {\n          onClick(event);\n        }\n      },\n      [onClick, disabled, loading, success]\n    );\n\n    const onMouseDownClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onMouseDown) {\n          onMouseDown(event);\n        }\n      },\n      [onMouseDown, disabled, loading, success]\n    );\n\n    const classNames = useMemo(() => {\n      const calculatedColor = success ? \"positive\" : color;\n      return cx(\n        className,\n        styles.button,\n        getStyle(styles, camelCase(\"size-\" + size)),\n        getStyle(styles, camelCase(\"kind-\" + kind)),\n        getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n        {\n          [styles.success]: success,\n          [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n          [activeButtonClassName]: active,\n          [styles.marginRight]: marginRight,\n          [styles.marginLeft]: marginLeft,\n          [styles.rightFlat]: rightFlat,\n          [styles.leftFlat]: leftFlat,\n          [styles.preventClickAnimation]: preventClickAnimation,\n          [styles.noSidePadding]: noSidePadding,\n          [styles.disabled]: disabled,\n          [styles.insetFocusStyle]: insetFocus\n        }\n      );\n    }, [\n      success,\n      color,\n      className,\n      size,\n      kind,\n      active,\n      activeButtonClassName,\n      marginRight,\n      marginLeft,\n      rightFlat,\n      leftFlat,\n      preventClickAnimation,\n      noSidePadding,\n      disabled,\n      insetFocus\n    ]);\n\n    const buttonProps = useMemo(() => {\n      const props: Record<string, unknown> = {\n        ref: mergedRef,\n        type,\n        className: classNames,\n        name,\n        onMouseUp,\n        style,\n        onClick: onButtonClicked,\n        id,\n        onFocus,\n        onBlur,\n        tabIndex: tabIndex ?? (disabled || ariaHidden ? -1 : undefined),\n        \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.BUTTON, id),\n        \"data-vibe\": ComponentVibeId.BUTTON,\n        onMouseDown: onMouseDownClicked,\n        \"aria-disabled\": disabled,\n        \"aria-busy\": loading,\n        \"aria-labelledby\": ariaLabeledBy,\n        \"aria-label\": ariaLabel,\n        \"aria-haspopup\": ariaHasPopup,\n        \"aria-expanded\": ariaExpanded,\n        \"aria-controls\": ariaControls,\n        \"aria-describedby\": ariaDescribedBy,\n        \"aria-hidden\": ariaHidden,\n        \"aria-pressed\": ariaPressed\n      };\n      return props;\n    }, [\n      mergedRef,\n      type,\n      classNames,\n      name,\n      onMouseUp,\n      style,\n      onButtonClicked,\n      id,\n      onFocus,\n      onBlur,\n      tabIndex,\n      dataTestId,\n      onMouseDownClicked,\n      disabled,\n      loading,\n      ariaLabeledBy,\n      ariaLabel,\n      ariaHasPopup,\n      ariaExpanded,\n      ariaControls,\n      ariaDescribedBy,\n      ariaHidden,\n      ariaPressed\n    ]);\n\n    const iconSize = useCallback(\n      (icon: SubIcon) => {\n        if (typeof icon !== \"function\") return;\n        switch (size) {\n          case \"xxs\":\n          case \"xs\":\n            return 16;\n          default:\n            return 20;\n        }\n      },\n      [size]\n    );\n\n    const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n    const buttonContent = useMemo(\n      () => (\n        <>\n          {leftIcon ? (\n            <Icon\n              iconType=\"font\"\n              icon={leftIcon}\n              iconSize={iconSize(leftIcon)}\n              className={cx({\n                [styles.leftIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n          {children}\n          {rightIcon ? (\n            <Icon\n              iconType=\"font\"\n              icon={rightIcon}\n              iconSize={iconSize(rightIcon)}\n              className={cx({\n                [styles.rightIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n        </>\n      ),\n      [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n    );\n\n    if (loading) {\n      return (\n        <button {...buttonProps} key={`${id}-loading`}>\n          <span className={cx(styles.loader, loaderClassName)}>\n            <Loader className={styles.loaderSvg} />\n            <span aria-hidden className={styles.textPlaceholder}>\n              {buttonContent}\n            </span>\n          </span>\n        </button>\n      );\n    }\n\n    if (success) {\n      return (\n        <button {...buttonProps} key={`${id}-success`}>\n          <span className={styles.successContent}>\n            {successIcon ? (\n              <Icon\n                iconType=\"font\"\n                icon={successIcon}\n                iconSize={iconSize(successIcon)}\n                className={cx({\n                  [styles.leftIcon]: !!successText\n                })}\n                ignoreFocusStyle\n              />\n            ) : null}\n            {successText}\n          </span>\n          <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n            {buttonContent}\n          </span>\n        </button>\n      );\n    }\n\n    return (\n      <button {...buttonProps} key={`${id}-button`}>\n        {buttonContent}\n      </button>\n    );\n  }\n);\n\ninterface ButtonStaticProps {\n  sizes: typeof SIZES;\n  colors: typeof ButtonColorEnum;\n  kinds: typeof ButtonTypeEnum;\n  types: typeof ButtonInputTypeEnum;\n  inputTags: typeof ButtonInputTypeEnum;\n}\n\nexport default withStaticProps<ButtonProps, ButtonStaticProps>(Button, {\n  sizes: SIZES,\n  colors: ButtonColorEnum,\n  kinds: ButtonTypeEnum,\n  types: ButtonInputTypeEnum,\n  inputTags: ButtonInputTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","className","children","kind","onClick","NOOP","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","loading","isLoading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","TRANSPARENT_COLOR","ariaExpanded","ariaHasPopup","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","ref","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","calculatedColor","cx","styles","getStyle","camelCase","insetFocusStyle","buttonProps","undefined","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","iconType","ignoreFocusStyle","key","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign","sizes","SIZES","colors","ButtonColorEnum","kinds","ButtonTypeEnum","types","ButtonInputTypeEnum","inputTags"],"mappings":"krBAgZA,IAAeA,EAAAA,EAtSAC,GACb,EAEIC,YACAC,WACAC,OAAO,UACPC,UAAUC,EACVC,OACAC,OAAO,SACPC,QAAQ,UACRC,YAAW,EACXC,YAAY,KACZC,WAAW,KACXC,WAAU,EACVC,cAAc,GACdC,cAAc,KACdC,QACAC,QAASC,GAAY,EACrBC,kBACAC,UAAS,EACTC,wBACAC,KACAC,eAAc,EACdC,cAAa,EACbC,OAAO,SACPC,cAAcpB,EACdqB,YACAC,aAAY,EACZC,YAAW,EACXC,yBAAwB,EACxBC,iBAAgB,EAChBC,UAAU1B,EACV2B,SAAS3B,EACT4B,gBACAC,iCAAiCC,EACjCC,eACAC,eACAC,eACA,mBAAoBC,GACpB,cAAeC,GACf,eAAgBC,GAChBC,kBAAgB,EAChB,cAAeC,GACfC,eAAa,EACbC,aAEFC,MAEA,MAAMC,GAAYC,EAA0B,MACtCC,GAAYC,EAAYJ,GAAKC,KAE7B/B,QAAEA,IAAYmC,EAAiB,CAAElC,cAEvCmC,GAAU,KACR,GAAc,qBAAV5C,GAA0C,gBAAVA,EAAyB,OAC7D,GAAa,YAATL,EAAoB,OACxB,IAAK4C,GAAUM,QAAS,OAExB,MAAMC,EAAgBP,GAAUM,QAChCC,EAAcvC,MAAMP,MAAQ+C,EAAuCD,EAAepB,EAA+B,GAChH,CAAC/B,EAAM4C,GAAWvC,EAAO0B,IAE5B,MAAMsB,GAAYC,GAAY,KAC5B,MAAMC,EAASX,GAAUM,SACrB5C,GAAaiD,GAGbhB,IACFgB,EAAOC,MACR,GACA,CAAClD,EAAUsC,GAAWL,KAEnBkB,GAAkBH,GACrBI,IACKpD,GAAYO,IAAWJ,EACzBiD,EAAMC,iBAIJ1D,GACFA,EAAQyD,EACT,GAEH,CAACzD,EAASK,EAAUO,GAASJ,IAGzBmD,GAAqBN,GACxBI,IACKpD,GAAYO,IAAWJ,EACzBiD,EAAMC,iBAIJrC,GACFA,EAAYoC,EACb,GAEH,CAACpC,EAAahB,EAAUO,GAASJ,IAG7BoD,GAAaC,GAAQ,KACzB,MAAMC,EAAkBtD,EAAU,WAAaJ,EAC/C,OAAO2D,EACLlE,EACAmE,EAAOV,OACPW,EAASD,EAAQE,EAAU,QAAU/D,IACrC8D,EAASD,EAAQE,EAAU,QAAUnE,IACrCkE,EAASD,EAAQE,EAAU,SAAWJ,IACtC,CACE,CAACE,EAAOxD,SAAUA,EAClB,CAACyD,EAASD,EAAQE,EAAU,SAAWJ,EAAkB,aAAc/C,EACvEC,CAACA,GAAwBD,EACzB,CAACiD,EAAO9C,aAAcA,EACtB,CAAC8C,EAAO7C,YAAaA,EACrB,CAAC6C,EAAOzC,WAAYA,EACpB,CAACyC,EAAOxC,UAAWA,EACnB,CAACwC,EAAOvC,uBAAwBA,EAChC,CAACuC,EAAOtC,eAAgBA,EACxB,CAACsC,EAAO3D,UAAWA,EACnB,CAAC2D,EAAOG,iBAAkB3B,IAE7B,GACA,CACDhC,EACAJ,EACAP,EACAM,EACAJ,EACAgB,EACAC,EACAE,EACAC,EACAI,EACAC,EACAC,EACAC,EACArB,EACAmC,KAGI4B,GAAcP,GAAQ,KACa,CACrCnB,IAAKG,GACLzB,OACAvB,UAAW+D,GACX1D,OACAkD,aACAzC,QACAX,QAASwD,GACTvC,KACAU,UACAC,SACAa,SAAUA,SAAAA,GAAapC,GAAY+B,IAAc,OAAIiC,EACrD,cAAe9B,IAAc+B,EAAUC,EAAuBC,OAAQvD,GACtE,YAAawD,EAAgBD,OAC7BnD,YAAasC,GACb,gBAAiBtD,EACjB,YAAaO,GACb,kBAAmBiB,EACnB,aAAcP,EACd,gBAAiBW,EACjB,gBAAiBD,EACjB,gBAAiBE,EACjB,mBAAoBC,GACpB,cAAeC,GACf,eAAgBC,MAGjB,CACDQ,GACAzB,EACAwC,GACA1D,EACAkD,GACAzC,EACA6C,GACAvC,EACAU,EACAC,EACAa,GACAF,GACAoB,GACAtD,EACAO,GACAiB,EACAP,EACAW,EACAD,EACAE,EACAC,GACAC,GACAC,KAGIqC,GAAWrB,GACdsB,IACC,GAAoB,mBAATA,EACX,OAAQxE,GACN,IAAK,MACL,IAAK,KACH,OAAO,GACT,QACE,OAAO,GACV,GAEH,CAACA,IAGGyE,GAAwBf,GAAQ,IAAMgB,EAAMC,SAASC,QAAQjF,GAAUkF,KAAKC,UAAU,CAACnF,IAEvFoF,GAAgBrB,GACpB,IACEgB,EAAAM,cAAAN,EAAAO,SAAA,KACG7E,EACCsE,EAAAM,cAACE,EACC,CAAAC,SAAS,OACTX,KAAMpE,EACNmE,SAAUA,GAASnE,GACnBV,UAAWkE,EAAG,CACZ,CAACC,EAAOzD,UAAWqE,KAErBW,kBAAgB,IAEhB,KACHzF,EACAQ,EACCuE,EAAAM,cAACE,EACC,CAAAC,SAAS,OACTX,KAAMrE,EACNoE,SAAUA,GAASpE,GACnBT,UAAWkE,EAAG,CACZ,CAACC,EAAO1D,WAAYsE,KAEtBW,kBACA,IACA,OAGR,CAACzF,EAAU8E,GAAuBF,GAAUnE,EAAUD,IAGxD,OAAIM,GAEAiE,0CAAYT,GAAW,CAAEoB,IAAQvE,EAAH,aAC5B4D,EAAMM,cAAA,OAAA,CAAAtF,UAAWkE,EAAGC,EAAOyB,OAAQ3E,IACjC+D,EAAAM,cAACO,EAAO,CAAA7F,UAAWmE,EAAO2B,YAC1Bd,EAAkBM,cAAA,OAAA,CAAA,eAAA,EAAAtF,UAAWmE,EAAO4B,iBACjCV,MAOP1E,EAEAqE,0CAAYT,GAAW,CAAEoB,IAAQvE,EAAH,aAC5B4D,EAAAM,cAAA,OAAA,CAAMtF,UAAWmE,EAAO6B,gBACrBnF,EACCmE,EAAAM,cAACE,EACC,CAAAC,SAAS,OACTX,KAAMjE,EACNgE,SAAUA,GAAShE,GACnBb,UAAWkE,EAAG,CACZ,CAACC,EAAOzD,YAAaE,IAEvB8E,kBAAgB,IAEhB,KACH9E,GAEHoE,EAAAM,cAAA,OAAA,CAAA,cAAkB,OAAOtF,UAAWmE,EAAO4B,iBACxCV,KAOPL,EAAAM,cAAA,SAAAW,OAAAC,OAAA,CAAA,EAAY3B,GAAW,CAAEoB,IAAQvE,EAAA,YAC9BiE,GACM,IAawD,CACrEc,MAAOC,EACPC,OAAQC,EACRC,MAAOC,EACPC,MAAOC,EACPC,UAAWD"}
+{"version":3,"file":"Button.js","sources":["../../src/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type */\nimport React, { type AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { useMergeRef, NOOP } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport { type ButtonColor, type ButtonInputType, type ButtonType, type ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport { getTestId, type VibeComponentProps, ComponentDefaultTestId, ComponentVibeId } from \"@vibe/shared\";\nimport { getStyle } from \"@vibe/shared\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n  children: React.ReactNode;\n  /** Custom class names to pass to the component */\n  className?: string;\n  activeButtonClassName?: string;\n  /** The button's kind */\n  kind?: ButtonType;\n  /** Callback function to run when the button is clicked */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Blur on button click */\n  blurOnMouseUp?: boolean;\n  /** Name of the button - for form submit usages  */\n  name?: string;\n  /** The button's size */\n  size?: ButtonSize;\n  /** The button's color */\n  color?: ButtonColor;\n  /** The button's type */\n  type?: ButtonInputType;\n  /** Whether the button should be disabled or not */\n  disabled?: boolean;\n  /** Icon to place on the right */\n  rightIcon?: SubIcon;\n  /** Icon to place on the left */\n  leftIcon?: SubIcon;\n  /** the success props are used when you have async action and wants to display a success message */\n  success?: boolean;\n  /** Success icon name */\n  successIcon?: SubIcon;\n  /** Success text */\n  successText?: string;\n  /** loading boolean which switches the text to a loader */\n  loading?: boolean;\n  /** className which is applied to loader container **/\n  loaderClassName?: string;\n  style?: React.CSSProperties;\n  /** displays the active state */\n  active?: boolean;\n  /** id to pass to the button */\n  id?: string;\n  /** adds 8px margin to the right */\n  marginRight?: boolean;\n  /** adds 8px margin to the left */\n  marginLeft?: boolean;\n  /** element id to describe the button accordingly */\n  ariaLabeledBy?: string;\n  /** aria label to provide important when providing only Icon */\n  ariaLabel?: string;\n  /** aria for a button popup */\n  ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n  /** aria to be set if the popup is open */\n  ariaExpanded?: boolean;\n  /** aria controls - receives id for the controlled region */\n  ariaControls?: string;\n  \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n  /**\n   * aria to be used for screen reader to know if the button is hidden\n   */\n  \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n  /**\n   * Indicates the current \"pressed\" state of toggle buttons\n   */\n  \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n  /** On Button Focus callback */\n  onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  /** On Button Blur callback */\n  onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  rightFlat?: boolean;\n  leftFlat?: boolean;\n  preventClickAnimation?: boolean;\n  noSidePadding?: boolean;\n  /** default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) */\n  defaultTextColorOnPrimaryColor?: string;\n  \"data-testid\"?: string;\n  /** Change the focus indicator from around the button to within it */\n  insetFocus?: boolean;\n  /** Specifies the tab order of an element */\n  tabIndex?: number;\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      children,\n      kind = \"primary\",\n      onClick = NOOP,\n      name,\n      size = \"medium\",\n      color = \"primary\",\n      disabled = false,\n      rightIcon = null,\n      leftIcon = null,\n      success = false,\n      successText = \"\",\n      successIcon = null,\n      style,\n      loading: isLoading = false,\n      loaderClassName,\n      active = false,\n      activeButtonClassName,\n      id,\n      marginRight = false,\n      marginLeft = false,\n      type = \"button\",\n      onMouseDown = NOOP,\n      ariaLabel,\n      rightFlat = false,\n      leftFlat = false,\n      preventClickAnimation = false,\n      noSidePadding = false,\n      onFocus = NOOP,\n      onBlur = NOOP,\n      ariaLabeledBy,\n      defaultTextColorOnPrimaryColor = TRANSPARENT_COLOR,\n      ariaExpanded,\n      ariaHasPopup,\n      ariaControls,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-hidden\": ariaHidden,\n      \"aria-pressed\": ariaPressed,\n      blurOnMouseUp = true,\n      \"data-testid\": dataTestId,\n      insetFocus = false,\n      tabIndex\n    }: ButtonProps,\n    ref\n  ) => {\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    const mergedRef = useMergeRef(ref, buttonRef);\n\n    const { loading } = useButtonLoading({ isLoading });\n\n    useEffect(() => {\n      if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n      if (kind !== \"primary\") return;\n      if (!buttonRef.current) return;\n\n      const buttonElement = buttonRef.current;\n      buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n    }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n    const onMouseUp = useCallback(() => {\n      const button = buttonRef.current;\n      if (disabled || !button) {\n        return;\n      }\n      if (blurOnMouseUp) {\n        button.blur();\n      }\n    }, [disabled, buttonRef, blurOnMouseUp]);\n\n    const onButtonClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onClick) {\n          onClick(event);\n        }\n      },\n      [onClick, disabled, loading, success]\n    );\n\n    const onMouseDownClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onMouseDown) {\n          onMouseDown(event);\n        }\n      },\n      [onMouseDown, disabled, loading, success]\n    );\n\n    const classNames = useMemo(() => {\n      const calculatedColor = success ? \"positive\" : color;\n      return cx(\n        className,\n        styles.button,\n        getStyle(styles, camelCase(\"size-\" + size)),\n        getStyle(styles, camelCase(\"kind-\" + kind)),\n        getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n        {\n          [styles.success]: success,\n          [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n          [activeButtonClassName]: active,\n          [styles.marginRight]: marginRight,\n          [styles.marginLeft]: marginLeft,\n          [styles.rightFlat]: rightFlat,\n          [styles.leftFlat]: leftFlat,\n          [styles.preventClickAnimation]: preventClickAnimation,\n          [styles.noSidePadding]: noSidePadding,\n          [styles.disabled]: disabled,\n          [styles.insetFocusStyle]: insetFocus\n        }\n      );\n    }, [\n      success,\n      color,\n      className,\n      size,\n      kind,\n      active,\n      activeButtonClassName,\n      marginRight,\n      marginLeft,\n      rightFlat,\n      leftFlat,\n      preventClickAnimation,\n      noSidePadding,\n      disabled,\n      insetFocus\n    ]);\n\n    const buttonProps = useMemo(() => {\n      const props: Record<string, unknown> = {\n        ref: mergedRef,\n        type,\n        className: classNames,\n        name,\n        onMouseUp,\n        style,\n        onClick: onButtonClicked,\n        id,\n        onFocus,\n        onBlur,\n        tabIndex: tabIndex ?? (disabled || ariaHidden ? -1 : undefined),\n        \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.BUTTON, id),\n        \"data-vibe\": ComponentVibeId.BUTTON,\n        onMouseDown: onMouseDownClicked,\n        \"aria-disabled\": disabled,\n        \"aria-busy\": loading,\n        \"aria-labelledby\": ariaLabeledBy,\n        \"aria-label\": ariaLabel,\n        \"aria-haspopup\": ariaHasPopup,\n        \"aria-expanded\": ariaExpanded,\n        \"aria-controls\": ariaControls,\n        \"aria-describedby\": ariaDescribedBy,\n        \"aria-hidden\": ariaHidden,\n        \"aria-pressed\": ariaPressed\n      };\n      return props;\n    }, [\n      mergedRef,\n      type,\n      classNames,\n      name,\n      onMouseUp,\n      style,\n      onButtonClicked,\n      id,\n      onFocus,\n      onBlur,\n      tabIndex,\n      dataTestId,\n      onMouseDownClicked,\n      disabled,\n      loading,\n      ariaLabeledBy,\n      ariaLabel,\n      ariaHasPopup,\n      ariaExpanded,\n      ariaControls,\n      ariaDescribedBy,\n      ariaHidden,\n      ariaPressed\n    ]);\n\n    const iconSize = useCallback(\n      (icon: SubIcon) => {\n        if (typeof icon !== \"function\") return;\n        switch (size) {\n          case \"xxs\":\n          case \"xs\":\n            return 16;\n          default:\n            return 20;\n        }\n      },\n      [size]\n    );\n\n    const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n    const buttonContent = useMemo(\n      () => (\n        <>\n          {leftIcon ? (\n            <Icon\n              type=\"font\"\n              icon={leftIcon}\n              size={iconSize(leftIcon)}\n              className={cx({\n                [styles.leftIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n          {children}\n          {rightIcon ? (\n            <Icon\n              type=\"font\"\n              icon={rightIcon}\n              size={iconSize(rightIcon)}\n              className={cx({\n                [styles.rightIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n        </>\n      ),\n      [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n    );\n\n    if (loading) {\n      return (\n        <button {...buttonProps} key={`${id}-loading`}>\n          <span className={cx(styles.loader, loaderClassName)}>\n            <Loader className={styles.loaderSvg} />\n            <span aria-hidden className={styles.textPlaceholder}>\n              {buttonContent}\n            </span>\n          </span>\n        </button>\n      );\n    }\n\n    if (success) {\n      return (\n        <button {...buttonProps} key={`${id}-success`}>\n          <span className={styles.successContent}>\n            {successIcon ? (\n              <Icon\n                type=\"font\"\n                icon={successIcon}\n                size={iconSize(successIcon)}\n                className={cx({\n                  [styles.leftIcon]: !!successText\n                })}\n                ignoreFocusStyle\n              />\n            ) : null}\n            {successText}\n          </span>\n          <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n            {buttonContent}\n          </span>\n        </button>\n      );\n    }\n\n    return (\n      <button {...buttonProps} key={`${id}-button`}>\n        {buttonContent}\n      </button>\n    );\n  }\n);\n\nexport default Button;\n"],"names":["Button","forwardRef","className","children","kind","onClick","NOOP","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","loading","isLoading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","TRANSPARENT_COLOR","ariaExpanded","ariaHasPopup","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","ref","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","calculatedColor","cx","styles","getStyle","camelCase","insetFocusStyle","buttonProps","undefined","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","ignoreFocusStyle","key","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign"],"mappings":"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"}

package/dist/Button/Button.module.scss.js

@@ -1,2 +1,2 @@
-var o={button:"button_243decdba9","focus-visible":"focus-visible_294ee8fa09",loader:"loader_791c8ef7b2",loaderSvg:"loaderSvg_4e38937cd3",textPlaceholder:"textPlaceholder_811126b159",success:"success_2f25431cb3",successContent:"successContent_478b34df54",marginRight:"marginRight_b659f5190e",marginLeft:"marginLeft_50296ef21c",rightFlat:"rightFlat_f3d9428025",leftFlat:"leftFlat_8479833dbe",preventClickAnimation:"preventClickAnimation_ecb16c77f7",leftIcon:"leftIcon_b659f5190e",rightIcon:"rightIcon_50296ef21c",sizeXxs:"sizeXxs_2fef8f4322",sizeXs:"sizeXs_68fb4ee9d9",sizeSmall:"sizeSmall_b41f5d12ba",sizeMedium:"sizeMedium_ec3319a8f8",sizeLarge:"sizeLarge_066965d4e1",kindPrimary:"kindPrimary_c51c49d8ec",colorPrimary:"colorPrimary_d1e62f87bb",colorBrand:"colorBrand_fb09c84ebb",colorPrimaryActive:"colorPrimaryActive_2b11c9a297",colorBrandActive:"colorBrandActive_eefac6cfd0",colorPositive:"colorPositive_32aeed8d54",colorPositiveActive:"colorPositiveActive_35a90d6dc2",colorNegative:"colorNegative_46a1071090",colorNegativeActive:"colorNegativeActive_35a90d6dc2",colorInverted:"colorInverted_acd36f8fb2",colorInvertedActive:"colorInvertedActive_35a90d6dc2",disabled:"disabled_a25f4c247a",colorOnPrimaryColor:"colorOnPrimaryColor_594a98583c",colorOnPrimaryColorActive:"colorOnPrimaryColorActive_b6ceb2418f",colorFixedLight:"colorFixedLight_7f15d01ab4",colorFixedLightActive:"colorFixedLightActive_ecb16c77f7",colorFixedDark:"colorFixedDark_9554829a4a",colorFixedDarkActive:"colorFixedDarkActive_0b5cb2afa9",colorOnInvertedBackground:"colorOnInvertedBackground_bdf64795f5",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive_1c7fb88490",kindSecondary:"kindSecondary_a1d2c2969e",kindTertiary:"kindTertiary_3d3250feb6",noSidePadding:"noSidePadding_1ac0651846",insetFocusStyle:"insetFocusStyle_06d20f404d"};!function(o){const r="s_id-95d3f630f6d9_3_0_15";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+r))return;const n=document.createElement("style");n.id=r,e.firstChild?e.insertBefore(n,e.firstChild):e.appendChild(n),n.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n.button_243decdba9 {\n  --loader-padding: 8px;\n  outline: none;\n  border: none;\n  height: auto;\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n  white-space: nowrap;\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* Prevent text selection */\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  min-width: auto;\n}\n.button_243decdba9:focus-visible, .button_243decdba9.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button_243decdba9:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.button_243decdba9 .loader_791c8ef7b2 {\n  height: 100%;\n}\n.button_243decdba9 .loader_791c8ef7b2 .loaderSvg_4e38937cd3 {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button_243decdba9 .textPlaceholder_811126b159 {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button_243decdba9.success_2f25431cb3 {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button_243decdba9.success_2f25431cb3 .successContent_478b34df54 {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight_b659f5190e {\n  margin-right: var(--spacing-small);\n}\n.marginLeft_50296ef21c {\n  margin-left: var(--spacing-small);\n}\n.rightFlat_f3d9428025 {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat_8479833dbe {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button_243decdba9:active:not(.preventClickAnimation_ecb16c77f7) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button_243decdba9 .leftIcon_b659f5190e {\n  margin-right: var(--spacing-small);\n}\n.button_243decdba9 .rightIcon_50296ef21c {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs_2fef8f4322 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: 2px var(--spacing-xs);\n  height: 16px;\n  line-height: 16px;\n}\n.sizeXs_68fb4ee9d9 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 24px;\n  line-height: 21px;\n}\n.sizeSmall_b41f5d12ba {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 32px;\n  line-height: 24px;\n}\n.sizeSmall_b41f5d12ba .loader_791c8ef7b2 {\n  top: 7px;\n}\n.sizeMedium_ec3319a8f8 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: var(--spacing-small) var(--spacing-medium);\n  height: 40px;\n}\n.sizeLarge_066965d4e1 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: 12px var(--spacing-large);\n  height: 48px;\n}\n.kindPrimary_c51c49d8ec {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_c51c49d8ec.colorPrimary_d1e62f87bb {\n  background: var(--primary-color);\n}\n.kindPrimary_c51c49d8ec.colorBrand_fb09c84ebb {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary_c51c49d8ec.colorPrimaryActive_2b11c9a297,\n.kindPrimary_c51c49d8ec.colorPrimary_d1e62f87bb:hover,\n.kindPrimary_c51c49d8ec.colorPrimary_d1e62f87bb:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary_c51c49d8ec.colorBrandActive_eefac6cfd0,\n.kindPrimary_c51c49d8ec.colorBrand_fb09c84ebb:hover,\n.kindPrimary_c51c49d8ec.colorBrand_fb09c84ebb:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary_c51c49d8ec.colorPositive_32aeed8d54 {\n  background: var(--positive-color);\n}\n.kindPrimary_c51c49d8ec.colorPositiveActive_35a90d6dc2,\n.kindPrimary_c51c49d8ec.colorPositive_32aeed8d54:hover,\n.kindPrimary_c51c49d8ec.colorPositive_32aeed8d54:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary_c51c49d8ec.colorNegative_46a1071090 {\n  background: var(--negative-color);\n}\n.kindPrimary_c51c49d8ec.colorNegativeActive_35a90d6dc2,\n.kindPrimary_c51c49d8ec.colorNegative_46a1071090:hover,\n.kindPrimary_c51c49d8ec.colorNegative_46a1071090:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary_c51c49d8ec.colorInverted_acd36f8fb2 {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary_c51c49d8ec.colorInvertedActive_35a90d6dc2,\n.kindPrimary_c51c49d8ec.colorInverted_acd36f8fb2:hover,\n.kindPrimary_c51c49d8ec.colorInverted_acd36f8fb2:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary_c51c49d8ec.button_243decdba9.colorInverted_acd36f8fb2.disabled_a25f4c247a {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary_c51c49d8ec.colorOnPrimaryColorActive_b6ceb2418f,\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:hover,\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary_c51c49d8ec.colorOnPrimaryColorActive_b6ceb2418f:focus-visible, .kindPrimary_c51c49d8ec.colorOnPrimaryColorActive_b6ceb2418f.focus-visible_294ee8fa09,\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:hover:focus-visible,\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:hover.focus-visible_294ee8fa09,\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:focus:focus-visible,\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_c51c49d8ec.colorOnPrimaryColorActive_b6ceb2418f:focus:not(.focus-visible_294ee8fa09),\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:hover:focus:not(.focus-visible_294ee8fa09),\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindPrimary_c51c49d8ec.colorOnPrimaryColor_594a98583c.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4 {\n  background: var(--fixed-light-color);\n}\n.kindPrimary_c51c49d8ec.colorFixedLightActive_ecb16c77f7,\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:hover,\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary_c51c49d8ec.colorFixedLightActive_ecb16c77f7:focus-visible, .kindPrimary_c51c49d8ec.colorFixedLightActive_ecb16c77f7.focus-visible_294ee8fa09,\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:hover:focus-visible,\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:hover.focus-visible_294ee8fa09,\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:focus:focus-visible,\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_c51c49d8ec.colorFixedLightActive_ecb16c77f7:focus:not(.focus-visible_294ee8fa09),\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:hover:focus:not(.focus-visible_294ee8fa09),\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindPrimary_c51c49d8ec.colorFixedLight_7f15d01ab4.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary_c51c49d8ec.colorFixedDarkActive_0b5cb2afa9,\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:hover,\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:focus {\n  filter: brightness(125%);\n}\n.kindPrimary_c51c49d8ec.colorFixedDarkActive_0b5cb2afa9:focus-visible, .kindPrimary_c51c49d8ec.colorFixedDarkActive_0b5cb2afa9.focus-visible_294ee8fa09,\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:hover:focus-visible,\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:hover.focus-visible_294ee8fa09,\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:focus:focus-visible,\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_c51c49d8ec.colorFixedDarkActive_0b5cb2afa9:focus:not(.focus-visible_294ee8fa09),\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:hover:focus:not(.focus-visible_294ee8fa09),\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindPrimary_c51c49d8ec.colorFixedDark_9554829a4a.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary_c51c49d8ec.colorOnInvertedBackground_bdf64795f5 {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary_c51c49d8ec.colorOnInvertedBackgroundActive_1c7fb88490,\n.kindPrimary_c51c49d8ec.colorOnInvertedBackground_bdf64795f5:hover,\n.kindPrimary_c51c49d8ec.colorOnInvertedBackground_bdf64795f5:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary_c51c49d8ec.button_243decdba9.colorOnInvertedBackground_bdf64795f5.disabled_a25f4c247a {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary_c51c49d8ec.button_243decdba9.disabled_a25f4c247a {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_a1d2c2969e {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary_a1d2c2969e.sizeSmall_b41f5d12ba {\n  line-height: 22px;\n}\n.kindSecondary_a1d2c2969e.sizeMedium_ec3319a8f8 {\n  line-height: 22px;\n}\n.kindSecondary_a1d2c2969e.sizeLarge_066965d4e1 {\n  line-height: 22px;\n}\n.kindSecondary_a1d2c2969e.colorPrimaryActive_2b11c9a297 {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_a1d2c2969e.colorPrimaryActive_2b11c9a297:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_a1d2c2969e.colorBrandActive_eefac6cfd0 {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary_a1d2c2969e.colorBrandActive_eefac6cfd0,\n.kindSecondary_a1d2c2969e.colorBrandActive_eefac6cfd0:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary_a1d2c2969e.colorPrimary_d1e62f87bb:hover:not(.colorPrimaryActive_2b11c9a297),\n.kindSecondary_a1d2c2969e.colorPrimary_d1e62f87bb:focus:not(.colorPrimaryActive_2b11c9a297) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_a1d2c2969e.colorBrand_fb09c84ebb:hover:not(.colorBrandActive_eefac6cfd0),\n.kindSecondary_a1d2c2969e.colorBrand_fb09c84ebb:focus:not(.colorBrandActive_eefac6cfd0) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_a1d2c2969e.colorPositive_32aeed8d54 {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary_a1d2c2969e.colorPositiveActive_35a90d6dc2,\n.kindSecondary_a1d2c2969e.colorPositive_32aeed8d54:hover,\n.kindSecondary_a1d2c2969e.colorPositive_32aeed8d54:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary_a1d2c2969e.colorNegative_46a1071090 {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary_a1d2c2969e.colorNegativeActive_35a90d6dc2,\n.kindSecondary_a1d2c2969e.colorNegative_46a1071090:hover,\n.kindSecondary_a1d2c2969e.colorNegative_46a1071090:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary_a1d2c2969e.colorInverted_acd36f8fb2 {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary_a1d2c2969e.colorInvertedActive_35a90d6dc2,\n.kindSecondary_a1d2c2969e.colorInverted_acd36f8fb2:hover,\n.kindSecondary_a1d2c2969e.colorInverted_acd36f8fb2:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_a1d2c2969e.colorInverted_acd36f8fb2.disabled_a25f4c247a {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary_a1d2c2969e.colorOnPrimaryColorActive_b6ceb2418f,\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:hover,\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary_a1d2c2969e.colorOnPrimaryColorActive_b6ceb2418f:focus-visible, .kindSecondary_a1d2c2969e.colorOnPrimaryColorActive_b6ceb2418f.focus-visible_294ee8fa09,\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:hover:focus-visible,\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:hover.focus-visible_294ee8fa09,\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:focus:focus-visible,\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_a1d2c2969e.colorOnPrimaryColorActive_b6ceb2418f:focus:not(.focus-visible_294ee8fa09),\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:hover:focus:not(.focus-visible_294ee8fa09),\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindSecondary_a1d2c2969e.colorOnPrimaryColor_594a98583c.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4 {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary_a1d2c2969e.colorFixedLightActive_ecb16c77f7,\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:hover,\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary_a1d2c2969e.colorFixedLightActive_ecb16c77f7:focus-visible, .kindSecondary_a1d2c2969e.colorFixedLightActive_ecb16c77f7.focus-visible_294ee8fa09,\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:hover:focus-visible,\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:hover.focus-visible_294ee8fa09,\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:focus:focus-visible,\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_a1d2c2969e.colorFixedLightActive_ecb16c77f7:focus:not(.focus-visible_294ee8fa09),\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:hover:focus:not(.focus-visible_294ee8fa09),\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_a1d2c2969e.colorFixedDarkActive_0b5cb2afa9,\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:hover,\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary_a1d2c2969e.colorFixedDarkActive_0b5cb2afa9:focus-visible, .kindSecondary_a1d2c2969e.colorFixedDarkActive_0b5cb2afa9.focus-visible_294ee8fa09,\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:hover:focus-visible,\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:hover.focus-visible_294ee8fa09,\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:focus:focus-visible,\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_a1d2c2969e.colorFixedDarkActive_0b5cb2afa9:focus:not(.focus-visible_294ee8fa09),\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:hover:focus:not(.focus-visible_294ee8fa09),\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindSecondary_a1d2c2969e.colorOnInvertedBackground_bdf64795f5 {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary_a1d2c2969e.colorOnInvertedBackgroundActive_1c7fb88490,\n.kindSecondary_a1d2c2969e.colorOnInvertedBackground_bdf64795f5:hover,\n.kindSecondary_a1d2c2969e.colorOnInvertedBackground_bdf64795f5:focus {\n  background: var(--icon-color);\n}\n.kindSecondary_a1d2c2969e.colorOnInvertedBackground_bdf64795f5.disabled_a25f4c247a {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary_a1d2c2969e.colorFixedLight_7f15d01ab4.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary_a1d2c2969e.colorFixedDark_9554829a4a.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_a1d2c2969e.disabled_a25f4c247a {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_a1d2c2969e.disabled_a25f4c247a:hover {\n  background-color: transparent;\n}\n.kindTertiary_3d3250feb6 {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary_3d3250feb6.colorPrimaryActive_2b11c9a297 {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary_3d3250feb6.colorPrimaryActive_2b11c9a297:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary_3d3250feb6.colorBrandActive_eefac6cfd0 {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary_3d3250feb6.colorBrandActive_eefac6cfd0,\n.kindTertiary_3d3250feb6.colorBrandActive_eefac6cfd0:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary_3d3250feb6.colorPrimary_d1e62f87bb:hover:not(.colorPrimaryActive_2b11c9a297),\n.kindTertiary_3d3250feb6.colorPrimary_d1e62f87bb:focus:not(.colorPrimaryActive_2b11c9a297) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_3d3250feb6.colorBrand_fb09c84ebb:hover:not(.colorBrandActive_eefac6cfd0),\n.kindTertiary_3d3250feb6.colorBrand_fb09c84ebb:focus:not(.colorBrandActive_eefac6cfd0) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_3d3250feb6.colorPositive_32aeed8d54 {\n  color: var(--positive-color);\n}\n.kindTertiary_3d3250feb6.colorPositiveActive_35a90d6dc2,\n.kindTertiary_3d3250feb6.colorPositive_32aeed8d54:hover,\n.kindTertiary_3d3250feb6.colorPositive_32aeed8d54:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary_3d3250feb6.colorNegative_46a1071090 {\n  color: var(--negative-color);\n}\n.kindTertiary_3d3250feb6.colorNegativeActive_35a90d6dc2,\n.kindTertiary_3d3250feb6.colorNegative_46a1071090:hover,\n.kindTertiary_3d3250feb6.colorNegative_46a1071090:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary_3d3250feb6.colorInverted_acd36f8fb2 {\n  color: var(--primary-text-color);\n}\n.kindTertiary_3d3250feb6.colorInvertedActive_35a90d6dc2,\n.kindTertiary_3d3250feb6.colorInverted_acd36f8fb2:hover,\n.kindTertiary_3d3250feb6.colorInverted_acd36f8fb2:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_3d3250feb6.colorInverted_acd36f8fb2.disabled_a25f4c247a {\n  color: var(--disabled-text-color);\n}\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_3d3250feb6.colorOnPrimaryColorActive_b6ceb2418f,\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:hover,\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary_3d3250feb6.colorOnPrimaryColorActive_b6ceb2418f:focus-visible, .kindTertiary_3d3250feb6.colorOnPrimaryColorActive_b6ceb2418f.focus-visible_294ee8fa09,\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:hover:focus-visible,\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:hover.focus-visible_294ee8fa09,\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:focus:focus-visible,\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_3d3250feb6.colorOnPrimaryColorActive_b6ceb2418f:focus:not(.focus-visible_294ee8fa09),\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:hover:focus:not(.focus-visible_294ee8fa09),\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindTertiary_3d3250feb6.colorOnPrimaryColor_594a98583c.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4 {\n  color: var(--fixed-light-color);\n}\n.kindTertiary_3d3250feb6.colorFixedLightActive_ecb16c77f7,\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:hover,\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary_3d3250feb6.colorFixedLightActive_ecb16c77f7:focus-visible, .kindTertiary_3d3250feb6.colorFixedLightActive_ecb16c77f7.focus-visible_294ee8fa09,\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:hover:focus-visible,\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:hover.focus-visible_294ee8fa09,\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:focus:focus-visible,\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_3d3250feb6.colorFixedLightActive_ecb16c77f7:focus:not(.focus-visible_294ee8fa09),\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:hover:focus:not(.focus-visible_294ee8fa09),\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindTertiary_3d3250feb6.colorFixedLight_7f15d01ab4.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_3d3250feb6.colorFixedDarkActive_0b5cb2afa9,\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:hover,\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary_3d3250feb6.colorFixedDarkActive_0b5cb2afa9:focus-visible, .kindTertiary_3d3250feb6.colorFixedDarkActive_0b5cb2afa9.focus-visible_294ee8fa09,\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:hover:focus-visible,\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:hover.focus-visible_294ee8fa09,\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:focus:focus-visible,\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:focus.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_3d3250feb6.colorFixedDarkActive_0b5cb2afa9:focus:not(.focus-visible_294ee8fa09),\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:hover:focus:not(.focus-visible_294ee8fa09),\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a:focus:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}\n.kindTertiary_3d3250feb6.colorFixedDark_9554829a4a.disabled_a25f4c247a {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_3d3250feb6.colorOnInvertedBackground_bdf64795f5 {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_3d3250feb6.colorOnInvertedBackgroundActive_1c7fb88490,\n.kindTertiary_3d3250feb6.colorOnInvertedBackground_bdf64795f5:hover,\n.kindTertiary_3d3250feb6.colorOnInvertedBackground_bdf64795f5:focus {\n  background: var(--icon-color);\n}\n.kindTertiary_3d3250feb6.colorOnInvertedBackground_bdf64795f5.disabled_a25f4c247a {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_3d3250feb6.disabled_a25f4c247a {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary_3d3250feb6.disabled_a25f4c247a:hover {\n  background-color: transparent;\n}\n.noSidePadding_1ac0651846 {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button_243decdba9.insetFocusStyle_06d20f404d:focus-visible, .button_243decdba9.insetFocusStyle_06d20f404d.focus-visible_294ee8fa09 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button_243decdba9.insetFocusStyle_06d20f404d:focus:not(.focus-visible_294ee8fa09) {\n  outline: none;\n}");export{o as default};
+var o={button:"button_29c780a928","focus-visible":"focus-visible_42f581b2c7",loader:"loader_f9d11b5c08",loaderSvg:"loaderSvg_84ef5503c6",textPlaceholder:"textPlaceholder_ea2f09f91b",success:"success_27e2cd1c48",successContent:"successContent_b4b90b3ab3",marginRight:"marginRight_f533dd91be",marginLeft:"marginLeft_0fbb2c3dec",rightFlat:"rightFlat_481c423704",leftFlat:"leftFlat_81c52155fa",preventClickAnimation:"preventClickAnimation_6114fa8de3",leftIcon:"leftIcon_f533dd91be",rightIcon:"rightIcon_0fbb2c3dec",sizeXxs:"sizeXxs_406c0d8ed9",sizeXs:"sizeXs_c30433aff4",sizeSmall:"sizeSmall_eb35da7952",sizeMedium:"sizeMedium_f9791d99f1",sizeLarge:"sizeLarge_572cb83b2e",kindPrimary:"kindPrimary_f778361b4e",colorPrimary:"colorPrimary_323552d1d4",colorBrand:"colorBrand_ee9dcc53b2",colorPrimaryActive:"colorPrimaryActive_28c8bf443f",colorBrandActive:"colorBrandActive_d6591efe58",colorPositive:"colorPositive_369ea374d4",colorPositiveActive:"colorPositiveActive_b695cb5642",colorNegative:"colorNegative_dbe4008994",colorNegativeActive:"colorNegativeActive_b695cb5642",colorInverted:"colorInverted_62849548c6",colorInvertedActive:"colorInvertedActive_b695cb5642",disabled:"disabled_6b529e6705",colorOnPrimaryColor:"colorOnPrimaryColor_8d2ac82d2b",colorOnPrimaryColorActive:"colorOnPrimaryColorActive_df8d5107ea",colorFixedLight:"colorFixedLight_f51b89fd60",colorFixedLightActive:"colorFixedLightActive_6114fa8de3",colorFixedDark:"colorFixedDark_c57f4ff342",colorFixedDarkActive:"colorFixedDarkActive_33abd47c72",colorOnInvertedBackground:"colorOnInvertedBackground_2d87428c34",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive_d40173c13e",kindSecondary:"kindSecondary_1543a8e543",kindTertiary:"kindTertiary_51f9032e3e",noSidePadding:"noSidePadding_be8dd6f20c",insetFocusStyle:"insetFocusStyle_b6803a1494"};!function(o){const r="s_id-95d3f630f6d9_3_0_16";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+r))return;const n=document.createElement("style");n.id=r,e.firstChild?e.insertBefore(n,e.firstChild):e.appendChild(n),n.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n.button_29c780a928 {\n  --loader-padding: 8px;\n  outline: none;\n  border: none;\n  height: auto;\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n  white-space: nowrap;\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* Prevent text selection */\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  min-width: auto;\n}\n.button_29c780a928:focus-visible, .button_29c780a928.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button_29c780a928:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.button_29c780a928 .loader_f9d11b5c08 {\n  height: 100%;\n}\n.button_29c780a928 .loader_f9d11b5c08 .loaderSvg_84ef5503c6 {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button_29c780a928 .textPlaceholder_ea2f09f91b {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button_29c780a928.success_27e2cd1c48 {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button_29c780a928.success_27e2cd1c48 .successContent_b4b90b3ab3 {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight_f533dd91be {\n  margin-right: var(--spacing-small);\n}\n.marginLeft_0fbb2c3dec {\n  margin-left: var(--spacing-small);\n}\n.rightFlat_481c423704 {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat_81c52155fa {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button_29c780a928:active:not(.preventClickAnimation_6114fa8de3) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button_29c780a928 .leftIcon_f533dd91be {\n  margin-right: var(--spacing-small);\n}\n.button_29c780a928 .rightIcon_0fbb2c3dec {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs_406c0d8ed9 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: 2px var(--spacing-xs);\n  height: 16px;\n  line-height: 16px;\n}\n.sizeXs_c30433aff4 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 24px;\n  line-height: 21px;\n}\n.sizeSmall_eb35da7952 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 32px;\n  line-height: 24px;\n}\n.sizeSmall_eb35da7952 .loader_f9d11b5c08 {\n  top: 7px;\n}\n.sizeMedium_f9791d99f1 {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: var(--spacing-small) var(--spacing-medium);\n  height: 40px;\n}\n.sizeLarge_572cb83b2e {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: 12px var(--spacing-large);\n  height: 48px;\n}\n.kindPrimary_f778361b4e {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_f778361b4e.colorPrimary_323552d1d4 {\n  background: var(--primary-color);\n}\n.kindPrimary_f778361b4e.colorBrand_ee9dcc53b2 {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary_f778361b4e.colorPrimaryActive_28c8bf443f,\n.kindPrimary_f778361b4e.colorPrimary_323552d1d4:hover,\n.kindPrimary_f778361b4e.colorPrimary_323552d1d4:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary_f778361b4e.colorBrandActive_d6591efe58,\n.kindPrimary_f778361b4e.colorBrand_ee9dcc53b2:hover,\n.kindPrimary_f778361b4e.colorBrand_ee9dcc53b2:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary_f778361b4e.colorPositive_369ea374d4 {\n  background: var(--positive-color);\n}\n.kindPrimary_f778361b4e.colorPositiveActive_b695cb5642,\n.kindPrimary_f778361b4e.colorPositive_369ea374d4:hover,\n.kindPrimary_f778361b4e.colorPositive_369ea374d4:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary_f778361b4e.colorNegative_dbe4008994 {\n  background: var(--negative-color);\n}\n.kindPrimary_f778361b4e.colorNegativeActive_b695cb5642,\n.kindPrimary_f778361b4e.colorNegative_dbe4008994:hover,\n.kindPrimary_f778361b4e.colorNegative_dbe4008994:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary_f778361b4e.colorInverted_62849548c6 {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary_f778361b4e.colorInvertedActive_b695cb5642,\n.kindPrimary_f778361b4e.colorInverted_62849548c6:hover,\n.kindPrimary_f778361b4e.colorInverted_62849548c6:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary_f778361b4e.button_29c780a928.colorInverted_62849548c6.disabled_6b529e6705 {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary_f778361b4e.colorOnPrimaryColorActive_df8d5107ea,\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:hover,\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary_f778361b4e.colorOnPrimaryColorActive_df8d5107ea:focus-visible, .kindPrimary_f778361b4e.colorOnPrimaryColorActive_df8d5107ea.focus-visible_42f581b2c7,\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:hover:focus-visible,\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:hover.focus-visible_42f581b2c7,\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:focus:focus-visible,\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_f778361b4e.colorOnPrimaryColorActive_df8d5107ea:focus:not(.focus-visible_42f581b2c7),\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:hover:focus:not(.focus-visible_42f581b2c7),\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindPrimary_f778361b4e.colorOnPrimaryColor_8d2ac82d2b.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60 {\n  background: var(--fixed-light-color);\n}\n.kindPrimary_f778361b4e.colorFixedLightActive_6114fa8de3,\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:hover,\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary_f778361b4e.colorFixedLightActive_6114fa8de3:focus-visible, .kindPrimary_f778361b4e.colorFixedLightActive_6114fa8de3.focus-visible_42f581b2c7,\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:hover:focus-visible,\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:hover.focus-visible_42f581b2c7,\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:focus:focus-visible,\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_f778361b4e.colorFixedLightActive_6114fa8de3:focus:not(.focus-visible_42f581b2c7),\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:hover:focus:not(.focus-visible_42f581b2c7),\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindPrimary_f778361b4e.colorFixedLight_f51b89fd60.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342 {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary_f778361b4e.colorFixedDarkActive_33abd47c72,\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:hover,\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:focus {\n  filter: brightness(125%);\n}\n.kindPrimary_f778361b4e.colorFixedDarkActive_33abd47c72:focus-visible, .kindPrimary_f778361b4e.colorFixedDarkActive_33abd47c72.focus-visible_42f581b2c7,\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:hover:focus-visible,\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:hover.focus-visible_42f581b2c7,\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:focus:focus-visible,\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary_f778361b4e.colorFixedDarkActive_33abd47c72:focus:not(.focus-visible_42f581b2c7),\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:hover:focus:not(.focus-visible_42f581b2c7),\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindPrimary_f778361b4e.colorFixedDark_c57f4ff342.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary_f778361b4e.colorOnInvertedBackground_2d87428c34 {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary_f778361b4e.colorOnInvertedBackgroundActive_d40173c13e,\n.kindPrimary_f778361b4e.colorOnInvertedBackground_2d87428c34:hover,\n.kindPrimary_f778361b4e.colorOnInvertedBackground_2d87428c34:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary_f778361b4e.button_29c780a928.colorOnInvertedBackground_2d87428c34.disabled_6b529e6705 {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary_f778361b4e.button_29c780a928.disabled_6b529e6705 {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_1543a8e543 {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary_1543a8e543.sizeSmall_eb35da7952 {\n  line-height: 22px;\n}\n.kindSecondary_1543a8e543.sizeMedium_f9791d99f1 {\n  line-height: 22px;\n}\n.kindSecondary_1543a8e543.sizeLarge_572cb83b2e {\n  line-height: 22px;\n}\n.kindSecondary_1543a8e543.colorPrimaryActive_28c8bf443f {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_1543a8e543.colorPrimaryActive_28c8bf443f:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary_1543a8e543.colorBrandActive_d6591efe58 {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary_1543a8e543.colorBrandActive_d6591efe58,\n.kindSecondary_1543a8e543.colorBrandActive_d6591efe58:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary_1543a8e543.colorPrimary_323552d1d4:hover:not(.colorPrimaryActive_28c8bf443f),\n.kindSecondary_1543a8e543.colorPrimary_323552d1d4:focus:not(.colorPrimaryActive_28c8bf443f) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_1543a8e543.colorBrand_ee9dcc53b2:hover:not(.colorBrandActive_d6591efe58),\n.kindSecondary_1543a8e543.colorBrand_ee9dcc53b2:focus:not(.colorBrandActive_d6591efe58) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_1543a8e543.colorPositive_369ea374d4 {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary_1543a8e543.colorPositiveActive_b695cb5642,\n.kindSecondary_1543a8e543.colorPositive_369ea374d4:hover,\n.kindSecondary_1543a8e543.colorPositive_369ea374d4:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary_1543a8e543.colorNegative_dbe4008994 {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary_1543a8e543.colorNegativeActive_b695cb5642,\n.kindSecondary_1543a8e543.colorNegative_dbe4008994:hover,\n.kindSecondary_1543a8e543.colorNegative_dbe4008994:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary_1543a8e543.colorInverted_62849548c6 {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary_1543a8e543.colorInvertedActive_b695cb5642,\n.kindSecondary_1543a8e543.colorInverted_62849548c6:hover,\n.kindSecondary_1543a8e543.colorInverted_62849548c6:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary_1543a8e543.colorInverted_62849548c6.disabled_6b529e6705 {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary_1543a8e543.colorOnPrimaryColorActive_df8d5107ea,\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:hover,\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary_1543a8e543.colorOnPrimaryColorActive_df8d5107ea:focus-visible, .kindSecondary_1543a8e543.colorOnPrimaryColorActive_df8d5107ea.focus-visible_42f581b2c7,\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:hover:focus-visible,\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:hover.focus-visible_42f581b2c7,\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:focus:focus-visible,\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_1543a8e543.colorOnPrimaryColorActive_df8d5107ea:focus:not(.focus-visible_42f581b2c7),\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:hover:focus:not(.focus-visible_42f581b2c7),\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindSecondary_1543a8e543.colorOnPrimaryColor_8d2ac82d2b.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60 {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary_1543a8e543.colorFixedLightActive_6114fa8de3,\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:hover,\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary_1543a8e543.colorFixedLightActive_6114fa8de3:focus-visible, .kindSecondary_1543a8e543.colorFixedLightActive_6114fa8de3.focus-visible_42f581b2c7,\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:hover:focus-visible,\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:hover.focus-visible_42f581b2c7,\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:focus:focus-visible,\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_1543a8e543.colorFixedLightActive_6114fa8de3:focus:not(.focus-visible_42f581b2c7),\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:hover:focus:not(.focus-visible_42f581b2c7),\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342 {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_1543a8e543.colorFixedDarkActive_33abd47c72,\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:hover,\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary_1543a8e543.colorFixedDarkActive_33abd47c72:focus-visible, .kindSecondary_1543a8e543.colorFixedDarkActive_33abd47c72.focus-visible_42f581b2c7,\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:hover:focus-visible,\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:hover.focus-visible_42f581b2c7,\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:focus:focus-visible,\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary_1543a8e543.colorFixedDarkActive_33abd47c72:focus:not(.focus-visible_42f581b2c7),\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:hover:focus:not(.focus-visible_42f581b2c7),\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindSecondary_1543a8e543.colorOnInvertedBackground_2d87428c34 {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary_1543a8e543.colorOnInvertedBackgroundActive_d40173c13e,\n.kindSecondary_1543a8e543.colorOnInvertedBackground_2d87428c34:hover,\n.kindSecondary_1543a8e543.colorOnInvertedBackground_2d87428c34:focus {\n  background: var(--icon-color);\n}\n.kindSecondary_1543a8e543.colorOnInvertedBackground_2d87428c34.disabled_6b529e6705 {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary_1543a8e543.colorFixedLight_f51b89fd60.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary_1543a8e543.colorFixedDark_c57f4ff342.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary_1543a8e543.disabled_6b529e6705 {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary_1543a8e543.disabled_6b529e6705:hover {\n  background-color: transparent;\n}\n.kindTertiary_51f9032e3e {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary_51f9032e3e.colorPrimaryActive_28c8bf443f {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary_51f9032e3e.colorPrimaryActive_28c8bf443f:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary_51f9032e3e.colorBrandActive_d6591efe58 {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary_51f9032e3e.colorBrandActive_d6591efe58,\n.kindTertiary_51f9032e3e.colorBrandActive_d6591efe58:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary_51f9032e3e.colorPrimary_323552d1d4:hover:not(.colorPrimaryActive_28c8bf443f),\n.kindTertiary_51f9032e3e.colorPrimary_323552d1d4:focus:not(.colorPrimaryActive_28c8bf443f) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_51f9032e3e.colorBrand_ee9dcc53b2:hover:not(.colorBrandActive_d6591efe58),\n.kindTertiary_51f9032e3e.colorBrand_ee9dcc53b2:focus:not(.colorBrandActive_d6591efe58) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_51f9032e3e.colorPositive_369ea374d4 {\n  color: var(--positive-color);\n}\n.kindTertiary_51f9032e3e.colorPositiveActive_b695cb5642,\n.kindTertiary_51f9032e3e.colorPositive_369ea374d4:hover,\n.kindTertiary_51f9032e3e.colorPositive_369ea374d4:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary_51f9032e3e.colorNegative_dbe4008994 {\n  color: var(--negative-color);\n}\n.kindTertiary_51f9032e3e.colorNegativeActive_b695cb5642,\n.kindTertiary_51f9032e3e.colorNegative_dbe4008994:hover,\n.kindTertiary_51f9032e3e.colorNegative_dbe4008994:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary_51f9032e3e.colorInverted_62849548c6 {\n  color: var(--primary-text-color);\n}\n.kindTertiary_51f9032e3e.colorInvertedActive_b695cb5642,\n.kindTertiary_51f9032e3e.colorInverted_62849548c6:hover,\n.kindTertiary_51f9032e3e.colorInverted_62849548c6:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary_51f9032e3e.colorInverted_62849548c6.disabled_6b529e6705 {\n  color: var(--disabled-text-color);\n}\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_51f9032e3e.colorOnPrimaryColorActive_df8d5107ea,\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:hover,\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary_51f9032e3e.colorOnPrimaryColorActive_df8d5107ea:focus-visible, .kindTertiary_51f9032e3e.colorOnPrimaryColorActive_df8d5107ea.focus-visible_42f581b2c7,\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:hover:focus-visible,\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:hover.focus-visible_42f581b2c7,\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:focus:focus-visible,\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_51f9032e3e.colorOnPrimaryColorActive_df8d5107ea:focus:not(.focus-visible_42f581b2c7),\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:hover:focus:not(.focus-visible_42f581b2c7),\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindTertiary_51f9032e3e.colorOnPrimaryColor_8d2ac82d2b.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60 {\n  color: var(--fixed-light-color);\n}\n.kindTertiary_51f9032e3e.colorFixedLightActive_6114fa8de3,\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:hover,\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary_51f9032e3e.colorFixedLightActive_6114fa8de3:focus-visible, .kindTertiary_51f9032e3e.colorFixedLightActive_6114fa8de3.focus-visible_42f581b2c7,\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:hover:focus-visible,\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:hover.focus-visible_42f581b2c7,\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:focus:focus-visible,\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_51f9032e3e.colorFixedLightActive_6114fa8de3:focus:not(.focus-visible_42f581b2c7),\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:hover:focus:not(.focus-visible_42f581b2c7),\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindTertiary_51f9032e3e.colorFixedLight_f51b89fd60.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342 {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_51f9032e3e.colorFixedDarkActive_33abd47c72,\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:hover,\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary_51f9032e3e.colorFixedDarkActive_33abd47c72:focus-visible, .kindTertiary_51f9032e3e.colorFixedDarkActive_33abd47c72.focus-visible_42f581b2c7,\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:hover:focus-visible,\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:hover.focus-visible_42f581b2c7,\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:focus:focus-visible,\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:focus.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary_51f9032e3e.colorFixedDarkActive_33abd47c72:focus:not(.focus-visible_42f581b2c7),\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:hover:focus:not(.focus-visible_42f581b2c7),\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342:focus:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}\n.kindTertiary_51f9032e3e.colorFixedDark_c57f4ff342.disabled_6b529e6705 {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary_51f9032e3e.colorOnInvertedBackground_2d87428c34 {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_51f9032e3e.colorOnInvertedBackgroundActive_d40173c13e,\n.kindTertiary_51f9032e3e.colorOnInvertedBackground_2d87428c34:hover,\n.kindTertiary_51f9032e3e.colorOnInvertedBackground_2d87428c34:focus {\n  background: var(--icon-color);\n}\n.kindTertiary_51f9032e3e.colorOnInvertedBackground_2d87428c34.disabled_6b529e6705 {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary_51f9032e3e.disabled_6b529e6705 {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary_51f9032e3e.disabled_6b529e6705:hover {\n  background-color: transparent;\n}\n.noSidePadding_be8dd6f20c {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button_29c780a928.insetFocusStyle_b6803a1494:focus-visible, .button_29c780a928.insetFocusStyle_b6803a1494.focus-visible_42f581b2c7 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button_29c780a928.insetFocusStyle_b6803a1494:focus:not(.focus-visible_42f581b2c7) {\n  outline: none;\n}");export{o as default};
 //# sourceMappingURL=Button.module.scss.js.map

package/dist/mocked_classnames/Button/Button.d.ts

@@ -1,6 +1,5 @@
 import React, { type AriaAttributes } from "react";
 import { type SubIcon } from "@vibe/icon";
-import { ButtonColor as ButtonColorEnum, ButtonInputType as ButtonInputTypeEnum, ButtonType as ButtonTypeEnum } from "./ButtonConstants";
 import { type ButtonColor, type ButtonInputType, type ButtonType, type ButtonSize } from "./Button.types";
 import { type VibeComponentProps } from "@vibe/shared";
 export interface ButtonProps extends VibeComponentProps {
@@ -83,17 +82,5 @@ export interface ButtonProps extends VibeComponentProps {
     /** Specifies the tab order of an element */
     tabIndex?: number;
 }
-declare const _default: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLElement>> & {
-    sizes: {
-        readonly SMALL: "small";
-        readonly MEDIUM: "medium";
-        readonly LARGE: "large";
-        readonly XXS: "xxs";
-        readonly XS: "xs";
-    };
-    colors: typeof ButtonColorEnum;
-    kinds: typeof ButtonTypeEnum;
-    types: typeof ButtonInputTypeEnum;
-    inputTags: typeof ButtonInputTypeEnum;
-};
-export default _default;
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export default Button;

package/dist/mocked_classnames/Button/Button.js

@@ -1,2 +1,2 @@
-import e,{forwardRef as a,useRef as t,useEffect as n,useCallback as r,useMemo as o}from"react";import{camelCase as i}from"es-toolkit";import s from"classnames";import{useMergeRef as l,getStyle as c,getTestId as d,ComponentDefaultTestId as m,ComponentVibeId as u,NOOP as p,withStaticProps as f,SIZES as b}from"@vibe/shared";import{Icon as y}from"@vibe/icon";import{Loader as g}from"@vibe/loader";import{ButtonColor as h,ButtonType as v,ButtonInputType as N}from"./ButtonConstants.js";import{getParentBackgroundColorNotTransparent as x,TRANSPARENT_COLOR as E}from"./helper/dom-helpers.js";import C from"./Button.module.scss.js";import{useButtonLoading as F}from"./helper/useButtonLoading.js";var k=f(a((({className:a,children:f,kind:b="primary",onClick:h=p,name:v,size:N="medium",color:k="primary",disabled:B=!1,rightIcon:S=null,leftIcon:T=null,success:I=!1,successText:j="",successIcon:O=null,style:z,loading:L=!1,loaderClassName:P,active:D=!1,activeButtonClassName:M,id:U,marginRight:w=!1,marginLeft:A=!1,type:R="button",onMouseDown:H=p,ariaLabel:q,rightFlat:G=!1,leftFlat:J=!1,preventClickAnimation:K=!1,noSidePadding:Q=!1,onFocus:V=p,onBlur:W=p,ariaLabeledBy:X,defaultTextColorOnPrimaryColor:Y=E,ariaExpanded:Z,ariaHasPopup:$,ariaControls:_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te,blurOnMouseUp:ne=!0,"data-testid":re,insetFocus:oe=!1,tabIndex:ie},se)=>{const le=t(null),ce=l(se,le),{loading:de}=F({isLoading:L});n((()=>{if("on-primary-color"!==k&&"fixed-light"!==k)return;if("primary"!==b)return;if(!le.current)return;const e=le.current;e.style.color=x(e,Y)}),[b,le,k,Y]);const me=r((()=>{const e=le.current;!B&&e&&ne&&e.blur()}),[B,le,ne]),ue=r((e=>{B||de||I?e.preventDefault():h&&h(e)}),[h,B,de,I]),pe=r((e=>{B||de||I?e.preventDefault():H&&H(e)}),[H,B,de,I]),fe=o((()=>{const e=I?"positive":k;return s(a,C.button,c(C,i("size-"+N)),c(C,i("kind-"+b)),c(C,i("color-"+e)),{[C.success]:I,[c(C,i("color-"+e+"-active"))]:D,[M]:D,[C.marginRight]:w,[C.marginLeft]:A,[C.rightFlat]:G,[C.leftFlat]:J,[C.preventClickAnimation]:K,[C.noSidePadding]:Q,[C.disabled]:B,[C.insetFocusStyle]:oe})}),[I,k,a,N,b,D,M,w,A,G,J,K,Q,B,oe]),be=o((()=>({ref:ce,type:R,className:fe,name:v,onMouseUp:me,style:z,onClick:ue,id:U,onFocus:V,onBlur:W,tabIndex:null!=ie?ie:B||ae?-1:void 0,"data-testid":re||d(m.BUTTON,U),"data-vibe":u.BUTTON,onMouseDown:pe,"aria-disabled":B,"aria-busy":de,"aria-labelledby":X,"aria-label":q,"aria-haspopup":$,"aria-expanded":Z,"aria-controls":_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te})),[ce,R,fe,v,me,z,ue,U,V,W,ie,re,pe,B,de,X,q,$,Z,_,ee,ae,te]),ye=r((e=>{if("function"==typeof e)switch(N){case"xxs":case"xs":return 16;default:return 20}}),[N]),ge=o((()=>e.Children.toArray(f).some(Boolean)),[f]),he=o((()=>e.createElement(e.Fragment,null,T?e.createElement(y,{iconType:"font",icon:T,iconSize:ye(T),className:s({[C.leftIcon]:ge}),ignoreFocusStyle:!0}):null,f,S?e.createElement(y,{iconType:"font",icon:S,iconSize:ye(S),className:s({[C.rightIcon]:ge}),ignoreFocusStyle:!0}):null)),[f,ge,ye,T,S]);return de?e.createElement("button",Object.assign({},be,{key:U+"-loading"}),e.createElement("span",{className:s(C.loader,P)},e.createElement(g,{className:C.loaderSvg}),e.createElement("span",{"aria-hidden":!0,className:C.textPlaceholder},he))):I?e.createElement("button",Object.assign({},be,{key:U+"-success"}),e.createElement("span",{className:C.successContent},O?e.createElement(y,{iconType:"font",icon:O,iconSize:ye(O),className:s({[C.leftIcon]:!!j}),ignoreFocusStyle:!0}):null,j),e.createElement("span",{"aria-hidden":"true",className:C.textPlaceholder},he)):e.createElement("button",Object.assign({},be,{key:U+"-button"}),he)})),{sizes:b,colors:h,kinds:v,types:N,inputTags:N});export{k as default};
+import e,{forwardRef as a,useRef as t,useEffect as r,useCallback as n,useMemo as o}from"react";import{camelCase as s}from"es-toolkit";import i from"classnames";import{useMergeRef as l,getStyle as c,getTestId as d,ComponentDefaultTestId as m,ComponentVibeId as u,NOOP as p}from"@vibe/shared";import{Icon as f}from"@vibe/icon";import{Loader as b}from"@vibe/loader";import{getParentBackgroundColorNotTransparent as y,TRANSPARENT_COLOR as g}from"./helper/dom-helpers.js";import h from"./Button.module.scss.js";import{useButtonLoading as v}from"./helper/useButtonLoading.js";const N=a((({className:a,children:N,kind:x="primary",onClick:E=p,name:F,size:C="medium",color:k="primary",disabled:B=!1,rightIcon:I=null,leftIcon:O=null,success:S=!1,successText:j="",successIcon:L=null,style:P,loading:T=!1,loaderClassName:z,active:D=!1,activeButtonClassName:M,id:U,marginRight:w=!1,marginLeft:A=!1,type:R="button",onMouseDown:H=p,ariaLabel:q,rightFlat:G=!1,leftFlat:J=!1,preventClickAnimation:K=!1,noSidePadding:Q=!1,onFocus:V=p,onBlur:W=p,ariaLabeledBy:X,defaultTextColorOnPrimaryColor:Y=g,ariaExpanded:Z,ariaHasPopup:$,ariaControls:_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te,blurOnMouseUp:re=!0,"data-testid":ne,insetFocus:oe=!1,tabIndex:se},ie)=>{const le=t(null),ce=l(ie,le),{loading:de}=v({isLoading:T});r((()=>{if("on-primary-color"!==k&&"fixed-light"!==k)return;if("primary"!==x)return;if(!le.current)return;const e=le.current;e.style.color=y(e,Y)}),[x,le,k,Y]);const me=n((()=>{const e=le.current;!B&&e&&re&&e.blur()}),[B,le,re]),ue=n((e=>{B||de||S?e.preventDefault():E&&E(e)}),[E,B,de,S]),pe=n((e=>{B||de||S?e.preventDefault():H&&H(e)}),[H,B,de,S]),fe=o((()=>{const e=S?"positive":k;return i(a,h.button,c(h,s("size-"+C)),c(h,s("kind-"+x)),c(h,s("color-"+e)),{[h.success]:S,[c(h,s("color-"+e+"-active"))]:D,[M]:D,[h.marginRight]:w,[h.marginLeft]:A,[h.rightFlat]:G,[h.leftFlat]:J,[h.preventClickAnimation]:K,[h.noSidePadding]:Q,[h.disabled]:B,[h.insetFocusStyle]:oe})}),[S,k,a,C,x,D,M,w,A,G,J,K,Q,B,oe]),be=o((()=>({ref:ce,type:R,className:fe,name:F,onMouseUp:me,style:P,onClick:ue,id:U,onFocus:V,onBlur:W,tabIndex:null!=se?se:B||ae?-1:void 0,"data-testid":ne||d(m.BUTTON,U),"data-vibe":u.BUTTON,onMouseDown:pe,"aria-disabled":B,"aria-busy":de,"aria-labelledby":X,"aria-label":q,"aria-haspopup":$,"aria-expanded":Z,"aria-controls":_,"aria-describedby":ee,"aria-hidden":ae,"aria-pressed":te})),[ce,R,fe,F,me,P,ue,U,V,W,se,ne,pe,B,de,X,q,$,Z,_,ee,ae,te]),ye=n((e=>{if("function"==typeof e)switch(C){case"xxs":case"xs":return 16;default:return 20}}),[C]),ge=o((()=>e.Children.toArray(N).some(Boolean)),[N]),he=o((()=>e.createElement(e.Fragment,null,O?e.createElement(f,{type:"font",icon:O,size:ye(O),className:i({[h.leftIcon]:ge}),ignoreFocusStyle:!0}):null,N,I?e.createElement(f,{type:"font",icon:I,size:ye(I),className:i({[h.rightIcon]:ge}),ignoreFocusStyle:!0}):null)),[N,ge,ye,O,I]);return de?e.createElement("button",Object.assign({},be,{key:U+"-loading"}),e.createElement("span",{className:i(h.loader,z)},e.createElement(b,{className:h.loaderSvg}),e.createElement("span",{"aria-hidden":!0,className:h.textPlaceholder},he))):S?e.createElement("button",Object.assign({},be,{key:U+"-success"}),e.createElement("span",{className:h.successContent},L?e.createElement(f,{type:"font",icon:L,size:ye(L),className:i({[h.leftIcon]:!!j}),ignoreFocusStyle:!0}):null,j),e.createElement("span",{"aria-hidden":"true",className:h.textPlaceholder},he)):e.createElement("button",Object.assign({},be,{key:U+"-button"}),he)}));export{N as default};
 //# sourceMappingURL=Button.js.map

package/dist/mocked_classnames/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../src/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type */\nimport React, { type AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { SIZES, useMergeRef, NOOP } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport {\n  ButtonColor as ButtonColorEnum,\n  ButtonInputType as ButtonInputTypeEnum,\n  ButtonType as ButtonTypeEnum\n} from \"./ButtonConstants\";\nimport { type ButtonColor, type ButtonInputType, type ButtonType, type ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport {\n  getTestId,\n  type VibeComponentProps,\n  withStaticProps,\n  ComponentDefaultTestId,\n  ComponentVibeId\n} from \"@vibe/shared\";\nimport { getStyle } from \"@vibe/shared\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n  children: React.ReactNode;\n  /** Custom class names to pass to the component */\n  className?: string;\n  activeButtonClassName?: string;\n  /** The button's kind */\n  kind?: ButtonType;\n  /** Callback function to run when the button is clicked */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Blur on button click */\n  blurOnMouseUp?: boolean;\n  /** Name of the button - for form submit usages  */\n  name?: string;\n  /** The button's size */\n  size?: ButtonSize;\n  /** The button's color */\n  color?: ButtonColor;\n  /** The button's type */\n  type?: ButtonInputType;\n  /** Whether the button should be disabled or not */\n  disabled?: boolean;\n  /** Icon to place on the right */\n  rightIcon?: SubIcon;\n  /** Icon to place on the left */\n  leftIcon?: SubIcon;\n  /** the success props are used when you have async action and wants to display a success message */\n  success?: boolean;\n  /** Success icon name */\n  successIcon?: SubIcon;\n  /** Success text */\n  successText?: string;\n  /** loading boolean which switches the text to a loader */\n  loading?: boolean;\n  /** className which is applied to loader container **/\n  loaderClassName?: string;\n  style?: React.CSSProperties;\n  /** displays the active state */\n  active?: boolean;\n  /** id to pass to the button */\n  id?: string;\n  /** adds 8px margin to the right */\n  marginRight?: boolean;\n  /** adds 8px margin to the left */\n  marginLeft?: boolean;\n  /** element id to describe the button accordingly */\n  ariaLabeledBy?: string;\n  /** aria label to provide important when providing only Icon */\n  ariaLabel?: string;\n  /** aria for a button popup */\n  ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n  /** aria to be set if the popup is open */\n  ariaExpanded?: boolean;\n  /** aria controls - receives id for the controlled region */\n  ariaControls?: string;\n  \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n  /**\n   * aria to be used for screen reader to know if the button is hidden\n   */\n  \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n  /**\n   * Indicates the current \"pressed\" state of toggle buttons\n   */\n  \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n  /** On Button Focus callback */\n  onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  /** On Button Blur callback */\n  onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  rightFlat?: boolean;\n  leftFlat?: boolean;\n  preventClickAnimation?: boolean;\n  noSidePadding?: boolean;\n  /** default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) */\n  defaultTextColorOnPrimaryColor?: string;\n  \"data-testid\"?: string;\n  /** Change the focus indicator from around the button to within it */\n  insetFocus?: boolean;\n  /** Specifies the tab order of an element */\n  tabIndex?: number;\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      children,\n      kind = \"primary\",\n      onClick = NOOP,\n      name,\n      size = \"medium\",\n      color = \"primary\",\n      disabled = false,\n      rightIcon = null,\n      leftIcon = null,\n      success = false,\n      successText = \"\",\n      successIcon = null,\n      style,\n      loading: isLoading = false,\n      loaderClassName,\n      active = false,\n      activeButtonClassName,\n      id,\n      marginRight = false,\n      marginLeft = false,\n      type = \"button\",\n      onMouseDown = NOOP,\n      ariaLabel,\n      rightFlat = false,\n      leftFlat = false,\n      preventClickAnimation = false,\n      noSidePadding = false,\n      onFocus = NOOP,\n      onBlur = NOOP,\n      ariaLabeledBy,\n      defaultTextColorOnPrimaryColor = TRANSPARENT_COLOR,\n      ariaExpanded,\n      ariaHasPopup,\n      ariaControls,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-hidden\": ariaHidden,\n      \"aria-pressed\": ariaPressed,\n      blurOnMouseUp = true,\n      \"data-testid\": dataTestId,\n      insetFocus = false,\n      tabIndex\n    }: ButtonProps,\n    ref\n  ) => {\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    const mergedRef = useMergeRef(ref, buttonRef);\n\n    const { loading } = useButtonLoading({ isLoading });\n\n    useEffect(() => {\n      if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n      if (kind !== \"primary\") return;\n      if (!buttonRef.current) return;\n\n      const buttonElement = buttonRef.current;\n      buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n    }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n    const onMouseUp = useCallback(() => {\n      const button = buttonRef.current;\n      if (disabled || !button) {\n        return;\n      }\n      if (blurOnMouseUp) {\n        button.blur();\n      }\n    }, [disabled, buttonRef, blurOnMouseUp]);\n\n    const onButtonClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onClick) {\n          onClick(event);\n        }\n      },\n      [onClick, disabled, loading, success]\n    );\n\n    const onMouseDownClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onMouseDown) {\n          onMouseDown(event);\n        }\n      },\n      [onMouseDown, disabled, loading, success]\n    );\n\n    const classNames = useMemo(() => {\n      const calculatedColor = success ? \"positive\" : color;\n      return cx(\n        className,\n        styles.button,\n        getStyle(styles, camelCase(\"size-\" + size)),\n        getStyle(styles, camelCase(\"kind-\" + kind)),\n        getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n        {\n          [styles.success]: success,\n          [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n          [activeButtonClassName]: active,\n          [styles.marginRight]: marginRight,\n          [styles.marginLeft]: marginLeft,\n          [styles.rightFlat]: rightFlat,\n          [styles.leftFlat]: leftFlat,\n          [styles.preventClickAnimation]: preventClickAnimation,\n          [styles.noSidePadding]: noSidePadding,\n          [styles.disabled]: disabled,\n          [styles.insetFocusStyle]: insetFocus\n        }\n      );\n    }, [\n      success,\n      color,\n      className,\n      size,\n      kind,\n      active,\n      activeButtonClassName,\n      marginRight,\n      marginLeft,\n      rightFlat,\n      leftFlat,\n      preventClickAnimation,\n      noSidePadding,\n      disabled,\n      insetFocus\n    ]);\n\n    const buttonProps = useMemo(() => {\n      const props: Record<string, unknown> = {\n        ref: mergedRef,\n        type,\n        className: classNames,\n        name,\n        onMouseUp,\n        style,\n        onClick: onButtonClicked,\n        id,\n        onFocus,\n        onBlur,\n        tabIndex: tabIndex ?? (disabled || ariaHidden ? -1 : undefined),\n        \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.BUTTON, id),\n        \"data-vibe\": ComponentVibeId.BUTTON,\n        onMouseDown: onMouseDownClicked,\n        \"aria-disabled\": disabled,\n        \"aria-busy\": loading,\n        \"aria-labelledby\": ariaLabeledBy,\n        \"aria-label\": ariaLabel,\n        \"aria-haspopup\": ariaHasPopup,\n        \"aria-expanded\": ariaExpanded,\n        \"aria-controls\": ariaControls,\n        \"aria-describedby\": ariaDescribedBy,\n        \"aria-hidden\": ariaHidden,\n        \"aria-pressed\": ariaPressed\n      };\n      return props;\n    }, [\n      mergedRef,\n      type,\n      classNames,\n      name,\n      onMouseUp,\n      style,\n      onButtonClicked,\n      id,\n      onFocus,\n      onBlur,\n      tabIndex,\n      dataTestId,\n      onMouseDownClicked,\n      disabled,\n      loading,\n      ariaLabeledBy,\n      ariaLabel,\n      ariaHasPopup,\n      ariaExpanded,\n      ariaControls,\n      ariaDescribedBy,\n      ariaHidden,\n      ariaPressed\n    ]);\n\n    const iconSize = useCallback(\n      (icon: SubIcon) => {\n        if (typeof icon !== \"function\") return;\n        switch (size) {\n          case \"xxs\":\n          case \"xs\":\n            return 16;\n          default:\n            return 20;\n        }\n      },\n      [size]\n    );\n\n    const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n    const buttonContent = useMemo(\n      () => (\n        <>\n          {leftIcon ? (\n            <Icon\n              iconType=\"font\"\n              icon={leftIcon}\n              iconSize={iconSize(leftIcon)}\n              className={cx({\n                [styles.leftIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n          {children}\n          {rightIcon ? (\n            <Icon\n              iconType=\"font\"\n              icon={rightIcon}\n              iconSize={iconSize(rightIcon)}\n              className={cx({\n                [styles.rightIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n        </>\n      ),\n      [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n    );\n\n    if (loading) {\n      return (\n        <button {...buttonProps} key={`${id}-loading`}>\n          <span className={cx(styles.loader, loaderClassName)}>\n            <Loader className={styles.loaderSvg} />\n            <span aria-hidden className={styles.textPlaceholder}>\n              {buttonContent}\n            </span>\n          </span>\n        </button>\n      );\n    }\n\n    if (success) {\n      return (\n        <button {...buttonProps} key={`${id}-success`}>\n          <span className={styles.successContent}>\n            {successIcon ? (\n              <Icon\n                iconType=\"font\"\n                icon={successIcon}\n                iconSize={iconSize(successIcon)}\n                className={cx({\n                  [styles.leftIcon]: !!successText\n                })}\n                ignoreFocusStyle\n              />\n            ) : null}\n            {successText}\n          </span>\n          <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n            {buttonContent}\n          </span>\n        </button>\n      );\n    }\n\n    return (\n      <button {...buttonProps} key={`${id}-button`}>\n        {buttonContent}\n      </button>\n    );\n  }\n);\n\ninterface ButtonStaticProps {\n  sizes: typeof SIZES;\n  colors: typeof ButtonColorEnum;\n  kinds: typeof ButtonTypeEnum;\n  types: typeof ButtonInputTypeEnum;\n  inputTags: typeof ButtonInputTypeEnum;\n}\n\nexport default withStaticProps<ButtonProps, ButtonStaticProps>(Button, {\n  sizes: SIZES,\n  colors: ButtonColorEnum,\n  kinds: ButtonTypeEnum,\n  types: ButtonInputTypeEnum,\n  inputTags: ButtonInputTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","className","children","kind","onClick","NOOP","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","loading","isLoading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","TRANSPARENT_COLOR","ariaExpanded","ariaHasPopup","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","ref","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","calculatedColor","cx","styles","getStyle","camelCase","insetFocusStyle","buttonProps","undefined","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","iconType","ignoreFocusStyle","key","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign","sizes","SIZES","colors","ButtonColorEnum","kinds","ButtonTypeEnum","types","ButtonInputTypeEnum","inputTags"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../src/Button/Button.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type */\nimport React, { type AriaAttributes, forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { useMergeRef, NOOP } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { Loader } from \"@vibe/loader\";\nimport { type ButtonColor, type ButtonInputType, type ButtonType, type ButtonSize } from \"./Button.types\";\nimport { getParentBackgroundColorNotTransparent, TRANSPARENT_COLOR } from \"./helper/dom-helpers\";\nimport { getTestId, type VibeComponentProps, ComponentDefaultTestId, ComponentVibeId } from \"@vibe/shared\";\nimport { getStyle } from \"@vibe/shared\";\nimport styles from \"./Button.module.scss\";\nimport { useButtonLoading } from \"./helper/useButtonLoading\";\n\nexport interface ButtonProps extends VibeComponentProps {\n  children: React.ReactNode;\n  /** Custom class names to pass to the component */\n  className?: string;\n  activeButtonClassName?: string;\n  /** The button's kind */\n  kind?: ButtonType;\n  /** Callback function to run when the button is clicked */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onMouseDown?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  /** Blur on button click */\n  blurOnMouseUp?: boolean;\n  /** Name of the button - for form submit usages  */\n  name?: string;\n  /** The button's size */\n  size?: ButtonSize;\n  /** The button's color */\n  color?: ButtonColor;\n  /** The button's type */\n  type?: ButtonInputType;\n  /** Whether the button should be disabled or not */\n  disabled?: boolean;\n  /** Icon to place on the right */\n  rightIcon?: SubIcon;\n  /** Icon to place on the left */\n  leftIcon?: SubIcon;\n  /** the success props are used when you have async action and wants to display a success message */\n  success?: boolean;\n  /** Success icon name */\n  successIcon?: SubIcon;\n  /** Success text */\n  successText?: string;\n  /** loading boolean which switches the text to a loader */\n  loading?: boolean;\n  /** className which is applied to loader container **/\n  loaderClassName?: string;\n  style?: React.CSSProperties;\n  /** displays the active state */\n  active?: boolean;\n  /** id to pass to the button */\n  id?: string;\n  /** adds 8px margin to the right */\n  marginRight?: boolean;\n  /** adds 8px margin to the left */\n  marginLeft?: boolean;\n  /** element id to describe the button accordingly */\n  ariaLabeledBy?: string;\n  /** aria label to provide important when providing only Icon */\n  ariaLabel?: string;\n  /** aria for a button popup */\n  ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n  /** aria to be set if the popup is open */\n  ariaExpanded?: boolean;\n  /** aria controls - receives id for the controlled region */\n  ariaControls?: string;\n  \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n  /**\n   * aria to be used for screen reader to know if the button is hidden\n   */\n  \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n  /**\n   * Indicates the current \"pressed\" state of toggle buttons\n   */\n  \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n  /** On Button Focus callback */\n  onFocus?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  /** On Button Blur callback */\n  onBlur?: (event: React.FocusEvent<HTMLButtonElement>) => void;\n  rightFlat?: boolean;\n  leftFlat?: boolean;\n  preventClickAnimation?: boolean;\n  noSidePadding?: boolean;\n  /** default color for text color in ON_PRIMARY_COLOR kind (should be any type of css color (rbg, var, hex...) */\n  defaultTextColorOnPrimaryColor?: string;\n  \"data-testid\"?: string;\n  /** Change the focus indicator from around the button to within it */\n  insetFocus?: boolean;\n  /** Specifies the tab order of an element */\n  tabIndex?: number;\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      className,\n      children,\n      kind = \"primary\",\n      onClick = NOOP,\n      name,\n      size = \"medium\",\n      color = \"primary\",\n      disabled = false,\n      rightIcon = null,\n      leftIcon = null,\n      success = false,\n      successText = \"\",\n      successIcon = null,\n      style,\n      loading: isLoading = false,\n      loaderClassName,\n      active = false,\n      activeButtonClassName,\n      id,\n      marginRight = false,\n      marginLeft = false,\n      type = \"button\",\n      onMouseDown = NOOP,\n      ariaLabel,\n      rightFlat = false,\n      leftFlat = false,\n      preventClickAnimation = false,\n      noSidePadding = false,\n      onFocus = NOOP,\n      onBlur = NOOP,\n      ariaLabeledBy,\n      defaultTextColorOnPrimaryColor = TRANSPARENT_COLOR,\n      ariaExpanded,\n      ariaHasPopup,\n      ariaControls,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-hidden\": ariaHidden,\n      \"aria-pressed\": ariaPressed,\n      blurOnMouseUp = true,\n      \"data-testid\": dataTestId,\n      insetFocus = false,\n      tabIndex\n    }: ButtonProps,\n    ref\n  ) => {\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    const mergedRef = useMergeRef(ref, buttonRef);\n\n    const { loading } = useButtonLoading({ isLoading });\n\n    useEffect(() => {\n      if (color !== \"on-primary-color\" && color !== \"fixed-light\") return;\n      if (kind !== \"primary\") return;\n      if (!buttonRef.current) return;\n\n      const buttonElement = buttonRef.current;\n      buttonElement.style.color = getParentBackgroundColorNotTransparent(buttonElement, defaultTextColorOnPrimaryColor);\n    }, [kind, buttonRef, color, defaultTextColorOnPrimaryColor]);\n\n    const onMouseUp = useCallback(() => {\n      const button = buttonRef.current;\n      if (disabled || !button) {\n        return;\n      }\n      if (blurOnMouseUp) {\n        button.blur();\n      }\n    }, [disabled, buttonRef, blurOnMouseUp]);\n\n    const onButtonClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onClick) {\n          onClick(event);\n        }\n      },\n      [onClick, disabled, loading, success]\n    );\n\n    const onMouseDownClicked = useCallback(\n      (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n        if (disabled || loading || success) {\n          event.preventDefault();\n          return;\n        }\n\n        if (onMouseDown) {\n          onMouseDown(event);\n        }\n      },\n      [onMouseDown, disabled, loading, success]\n    );\n\n    const classNames = useMemo(() => {\n      const calculatedColor = success ? \"positive\" : color;\n      return cx(\n        className,\n        styles.button,\n        getStyle(styles, camelCase(\"size-\" + size)),\n        getStyle(styles, camelCase(\"kind-\" + kind)),\n        getStyle(styles, camelCase(\"color-\" + calculatedColor)),\n        {\n          [styles.success]: success,\n          [getStyle(styles, camelCase(\"color-\" + calculatedColor + \"-active\"))]: active,\n          [activeButtonClassName]: active,\n          [styles.marginRight]: marginRight,\n          [styles.marginLeft]: marginLeft,\n          [styles.rightFlat]: rightFlat,\n          [styles.leftFlat]: leftFlat,\n          [styles.preventClickAnimation]: preventClickAnimation,\n          [styles.noSidePadding]: noSidePadding,\n          [styles.disabled]: disabled,\n          [styles.insetFocusStyle]: insetFocus\n        }\n      );\n    }, [\n      success,\n      color,\n      className,\n      size,\n      kind,\n      active,\n      activeButtonClassName,\n      marginRight,\n      marginLeft,\n      rightFlat,\n      leftFlat,\n      preventClickAnimation,\n      noSidePadding,\n      disabled,\n      insetFocus\n    ]);\n\n    const buttonProps = useMemo(() => {\n      const props: Record<string, unknown> = {\n        ref: mergedRef,\n        type,\n        className: classNames,\n        name,\n        onMouseUp,\n        style,\n        onClick: onButtonClicked,\n        id,\n        onFocus,\n        onBlur,\n        tabIndex: tabIndex ?? (disabled || ariaHidden ? -1 : undefined),\n        \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.BUTTON, id),\n        \"data-vibe\": ComponentVibeId.BUTTON,\n        onMouseDown: onMouseDownClicked,\n        \"aria-disabled\": disabled,\n        \"aria-busy\": loading,\n        \"aria-labelledby\": ariaLabeledBy,\n        \"aria-label\": ariaLabel,\n        \"aria-haspopup\": ariaHasPopup,\n        \"aria-expanded\": ariaExpanded,\n        \"aria-controls\": ariaControls,\n        \"aria-describedby\": ariaDescribedBy,\n        \"aria-hidden\": ariaHidden,\n        \"aria-pressed\": ariaPressed\n      };\n      return props;\n    }, [\n      mergedRef,\n      type,\n      classNames,\n      name,\n      onMouseUp,\n      style,\n      onButtonClicked,\n      id,\n      onFocus,\n      onBlur,\n      tabIndex,\n      dataTestId,\n      onMouseDownClicked,\n      disabled,\n      loading,\n      ariaLabeledBy,\n      ariaLabel,\n      ariaHasPopup,\n      ariaExpanded,\n      ariaControls,\n      ariaDescribedBy,\n      ariaHidden,\n      ariaPressed\n    ]);\n\n    const iconSize = useCallback(\n      (icon: SubIcon) => {\n        if (typeof icon !== \"function\") return;\n        switch (size) {\n          case \"xxs\":\n          case \"xs\":\n            return 16;\n          default:\n            return 20;\n        }\n      },\n      [size]\n    );\n\n    const hasRenderableChildren = useMemo(() => React.Children.toArray(children).some(Boolean), [children]);\n\n    const buttonContent = useMemo(\n      () => (\n        <>\n          {leftIcon ? (\n            <Icon\n              type=\"font\"\n              icon={leftIcon}\n              size={iconSize(leftIcon)}\n              className={cx({\n                [styles.leftIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n          {children}\n          {rightIcon ? (\n            <Icon\n              type=\"font\"\n              icon={rightIcon}\n              size={iconSize(rightIcon)}\n              className={cx({\n                [styles.rightIcon]: hasRenderableChildren\n              })}\n              ignoreFocusStyle\n            />\n          ) : null}\n        </>\n      ),\n      [children, hasRenderableChildren, iconSize, leftIcon, rightIcon]\n    );\n\n    if (loading) {\n      return (\n        <button {...buttonProps} key={`${id}-loading`}>\n          <span className={cx(styles.loader, loaderClassName)}>\n            <Loader className={styles.loaderSvg} />\n            <span aria-hidden className={styles.textPlaceholder}>\n              {buttonContent}\n            </span>\n          </span>\n        </button>\n      );\n    }\n\n    if (success) {\n      return (\n        <button {...buttonProps} key={`${id}-success`}>\n          <span className={styles.successContent}>\n            {successIcon ? (\n              <Icon\n                type=\"font\"\n                icon={successIcon}\n                size={iconSize(successIcon)}\n                className={cx({\n                  [styles.leftIcon]: !!successText\n                })}\n                ignoreFocusStyle\n              />\n            ) : null}\n            {successText}\n          </span>\n          <span aria-hidden=\"true\" className={styles.textPlaceholder}>\n            {buttonContent}\n          </span>\n        </button>\n      );\n    }\n\n    return (\n      <button {...buttonProps} key={`${id}-button`}>\n        {buttonContent}\n      </button>\n    );\n  }\n);\n\nexport default Button;\n"],"names":["Button","forwardRef","className","children","kind","onClick","NOOP","name","size","color","disabled","rightIcon","leftIcon","success","successText","successIcon","style","loading","isLoading","loaderClassName","active","activeButtonClassName","id","marginRight","marginLeft","type","onMouseDown","ariaLabel","rightFlat","leftFlat","preventClickAnimation","noSidePadding","onFocus","onBlur","ariaLabeledBy","defaultTextColorOnPrimaryColor","TRANSPARENT_COLOR","ariaExpanded","ariaHasPopup","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","blurOnMouseUp","dataTestId","insetFocus","tabIndex","ref","buttonRef","useRef","mergedRef","useMergeRef","useButtonLoading","useEffect","current","buttonElement","getParentBackgroundColorNotTransparent","onMouseUp","useCallback","button","blur","onButtonClicked","event","preventDefault","onMouseDownClicked","classNames","useMemo","calculatedColor","cx","styles","getStyle","camelCase","insetFocusStyle","buttonProps","undefined","getTestId","ComponentDefaultTestId","BUTTON","ComponentVibeId","iconSize","icon","hasRenderableChildren","React","Children","toArray","some","Boolean","buttonContent","createElement","Fragment","Icon","ignoreFocusStyle","key","loader","Loader","loaderSvg","textPlaceholder","successContent","Object","assign"],"mappings":"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"}

package/dist/mocked_classnames/Button/Button.module.scss.js

@@ -1,2 +1,2 @@
-var o={button:"button","focus-visible":"focus-visible",loader:"loader",loaderSvg:"loaderSvg",textPlaceholder:"textPlaceholder",success:"success",successContent:"successContent",marginRight:"marginRight",marginLeft:"marginLeft",rightFlat:"rightFlat",leftFlat:"leftFlat",preventClickAnimation:"preventClickAnimation",leftIcon:"leftIcon",rightIcon:"rightIcon",sizeXxs:"sizeXxs",sizeXs:"sizeXs",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge",kindPrimary:"kindPrimary",colorPrimary:"colorPrimary",colorBrand:"colorBrand",colorPrimaryActive:"colorPrimaryActive",colorBrandActive:"colorBrandActive",colorPositive:"colorPositive",colorPositiveActive:"colorPositiveActive",colorNegative:"colorNegative",colorNegativeActive:"colorNegativeActive",colorInverted:"colorInverted",colorInvertedActive:"colorInvertedActive",disabled:"disabled",colorOnPrimaryColor:"colorOnPrimaryColor",colorOnPrimaryColorActive:"colorOnPrimaryColorActive",colorFixedLight:"colorFixedLight",colorFixedLightActive:"colorFixedLightActive",colorFixedDark:"colorFixedDark",colorFixedDarkActive:"colorFixedDarkActive",colorOnInvertedBackground:"colorOnInvertedBackground",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive",kindSecondary:"kindSecondary",kindTertiary:"kindTertiary",noSidePadding:"noSidePadding",insetFocusStyle:"insetFocusStyle"};!function(o){const r="s_id-95d3f630f6d9_3_0_15";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const i=document.createElement("style");i.id=r,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n.button {\n  --loader-padding: 8px;\n  outline: none;\n  border: none;\n  height: auto;\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n  white-space: nowrap;\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* Prevent text selection */\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  min-width: auto;\n}\n.button:focus-visible, .button.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button:focus:not(.focus-visible) {\n  outline: none;\n}\n.button .loader {\n  height: 100%;\n}\n.button .loader .loaderSvg {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button .textPlaceholder {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button.success {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button.success .successContent {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight {\n  margin-right: var(--spacing-small);\n}\n.marginLeft {\n  margin-left: var(--spacing-small);\n}\n.rightFlat {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button:active:not(.preventClickAnimation) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button .leftIcon {\n  margin-right: var(--spacing-small);\n}\n.button .rightIcon {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: 2px var(--spacing-xs);\n  height: 16px;\n  line-height: 16px;\n}\n.sizeXs {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 24px;\n  line-height: 21px;\n}\n.sizeSmall {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 32px;\n  line-height: 24px;\n}\n.sizeSmall .loader {\n  top: 7px;\n}\n.sizeMedium {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: var(--spacing-small) var(--spacing-medium);\n  height: 40px;\n}\n.sizeLarge {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: 12px var(--spacing-large);\n  height: 48px;\n}\n.kindPrimary {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary.colorPrimary {\n  background: var(--primary-color);\n}\n.kindPrimary.colorBrand {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary.colorPrimaryActive,\n.kindPrimary.colorPrimary:hover,\n.kindPrimary.colorPrimary:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary.colorBrandActive,\n.kindPrimary.colorBrand:hover,\n.kindPrimary.colorBrand:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary.colorPositive {\n  background: var(--positive-color);\n}\n.kindPrimary.colorPositiveActive,\n.kindPrimary.colorPositive:hover,\n.kindPrimary.colorPositive:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary.colorNegative {\n  background: var(--negative-color);\n}\n.kindPrimary.colorNegativeActive,\n.kindPrimary.colorNegative:hover,\n.kindPrimary.colorNegative:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary.colorInverted {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary.colorInvertedActive,\n.kindPrimary.colorInverted:hover,\n.kindPrimary.colorInverted:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary.button.colorInverted.disabled {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary.colorOnPrimaryColor {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary.colorOnPrimaryColorActive,\n.kindPrimary.colorOnPrimaryColor:hover,\n.kindPrimary.colorOnPrimaryColor:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary.colorOnPrimaryColorActive:focus-visible, .kindPrimary.colorOnPrimaryColorActive.focus-visible,\n.kindPrimary.colorOnPrimaryColor:hover:focus-visible,\n.kindPrimary.colorOnPrimaryColor:hover.focus-visible,\n.kindPrimary.colorOnPrimaryColor:focus:focus-visible,\n.kindPrimary.colorOnPrimaryColor:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary.colorOnPrimaryColorActive:focus:not(.focus-visible),\n.kindPrimary.colorOnPrimaryColor:hover:focus:not(.focus-visible),\n.kindPrimary.colorOnPrimaryColor:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindPrimary.colorOnPrimaryColor.disabled {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary.colorFixedLight {\n  background: var(--fixed-light-color);\n}\n.kindPrimary.colorFixedLightActive,\n.kindPrimary.colorFixedLight:hover,\n.kindPrimary.colorFixedLight:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary.colorFixedLightActive:focus-visible, .kindPrimary.colorFixedLightActive.focus-visible,\n.kindPrimary.colorFixedLight:hover:focus-visible,\n.kindPrimary.colorFixedLight:hover.focus-visible,\n.kindPrimary.colorFixedLight:focus:focus-visible,\n.kindPrimary.colorFixedLight:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary.colorFixedLightActive:focus:not(.focus-visible),\n.kindPrimary.colorFixedLight:hover:focus:not(.focus-visible),\n.kindPrimary.colorFixedLight:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindPrimary.colorFixedLight.disabled {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary.colorFixedDark {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary.colorFixedDarkActive,\n.kindPrimary.colorFixedDark:hover,\n.kindPrimary.colorFixedDark:focus {\n  filter: brightness(125%);\n}\n.kindPrimary.colorFixedDarkActive:focus-visible, .kindPrimary.colorFixedDarkActive.focus-visible,\n.kindPrimary.colorFixedDark:hover:focus-visible,\n.kindPrimary.colorFixedDark:hover.focus-visible,\n.kindPrimary.colorFixedDark:focus:focus-visible,\n.kindPrimary.colorFixedDark:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary.colorFixedDarkActive:focus:not(.focus-visible),\n.kindPrimary.colorFixedDark:hover:focus:not(.focus-visible),\n.kindPrimary.colorFixedDark:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindPrimary.colorFixedDark.disabled {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary.colorOnInvertedBackground {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary.colorOnInvertedBackgroundActive,\n.kindPrimary.colorOnInvertedBackground:hover,\n.kindPrimary.colorOnInvertedBackground:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary.button.colorOnInvertedBackground.disabled {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary.button.disabled {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary.sizeSmall {\n  line-height: 22px;\n}\n.kindSecondary.sizeMedium {\n  line-height: 22px;\n}\n.kindSecondary.sizeLarge {\n  line-height: 22px;\n}\n.kindSecondary.colorPrimaryActive {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary.colorPrimaryActive:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary.colorBrandActive {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary.colorBrandActive,\n.kindSecondary.colorBrandActive:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary.colorPrimary:hover:not(.colorPrimaryActive),\n.kindSecondary.colorPrimary:focus:not(.colorPrimaryActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary.colorBrand:hover:not(.colorBrandActive),\n.kindSecondary.colorBrand:focus:not(.colorBrandActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary.colorPositive {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary.colorPositiveActive,\n.kindSecondary.colorPositive:hover,\n.kindSecondary.colorPositive:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary.colorNegative {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary.colorNegativeActive,\n.kindSecondary.colorNegative:hover,\n.kindSecondary.colorNegative:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary.colorInverted {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary.colorInvertedActive,\n.kindSecondary.colorInverted:hover,\n.kindSecondary.colorInverted:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary.colorInverted.disabled {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary.colorOnPrimaryColor {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary.colorOnPrimaryColorActive,\n.kindSecondary.colorOnPrimaryColor:hover,\n.kindSecondary.colorOnPrimaryColor:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary.colorOnPrimaryColorActive:focus-visible, .kindSecondary.colorOnPrimaryColorActive.focus-visible,\n.kindSecondary.colorOnPrimaryColor:hover:focus-visible,\n.kindSecondary.colorOnPrimaryColor:hover.focus-visible,\n.kindSecondary.colorOnPrimaryColor:focus:focus-visible,\n.kindSecondary.colorOnPrimaryColor:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary.colorOnPrimaryColorActive:focus:not(.focus-visible),\n.kindSecondary.colorOnPrimaryColor:hover:focus:not(.focus-visible),\n.kindSecondary.colorOnPrimaryColor:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindSecondary.colorOnPrimaryColor.disabled {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary.colorFixedLight {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary.colorFixedLightActive,\n.kindSecondary.colorFixedLight:hover,\n.kindSecondary.colorFixedLight:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary.colorFixedLightActive:focus-visible, .kindSecondary.colorFixedLightActive.focus-visible,\n.kindSecondary.colorFixedLight:hover:focus-visible,\n.kindSecondary.colorFixedLight:hover.focus-visible,\n.kindSecondary.colorFixedLight:focus:focus-visible,\n.kindSecondary.colorFixedLight:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary.colorFixedLightActive:focus:not(.focus-visible),\n.kindSecondary.colorFixedLight:hover:focus:not(.focus-visible),\n.kindSecondary.colorFixedLight:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindSecondary.colorFixedDark {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary.colorFixedDarkActive,\n.kindSecondary.colorFixedDark:hover,\n.kindSecondary.colorFixedDark:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary.colorFixedDarkActive:focus-visible, .kindSecondary.colorFixedDarkActive.focus-visible,\n.kindSecondary.colorFixedDark:hover:focus-visible,\n.kindSecondary.colorFixedDark:hover.focus-visible,\n.kindSecondary.colorFixedDark:focus:focus-visible,\n.kindSecondary.colorFixedDark:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary.colorFixedDarkActive:focus:not(.focus-visible),\n.kindSecondary.colorFixedDark:hover:focus:not(.focus-visible),\n.kindSecondary.colorFixedDark:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindSecondary.colorOnInvertedBackground {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary.colorOnInvertedBackgroundActive,\n.kindSecondary.colorOnInvertedBackground:hover,\n.kindSecondary.colorOnInvertedBackground:focus {\n  background: var(--icon-color);\n}\n.kindSecondary.colorOnInvertedBackground.disabled {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary.colorFixedLight.disabled {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary.colorFixedDark.disabled {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary.disabled {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary.disabled:hover {\n  background-color: transparent;\n}\n.kindTertiary {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary.colorPrimaryActive {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary.colorPrimaryActive:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary.colorBrandActive {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary.colorBrandActive,\n.kindTertiary.colorBrandActive:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary.colorPrimary:hover:not(.colorPrimaryActive),\n.kindTertiary.colorPrimary:focus:not(.colorPrimaryActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary.colorBrand:hover:not(.colorBrandActive),\n.kindTertiary.colorBrand:focus:not(.colorBrandActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary.colorPositive {\n  color: var(--positive-color);\n}\n.kindTertiary.colorPositiveActive,\n.kindTertiary.colorPositive:hover,\n.kindTertiary.colorPositive:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary.colorNegative {\n  color: var(--negative-color);\n}\n.kindTertiary.colorNegativeActive,\n.kindTertiary.colorNegative:hover,\n.kindTertiary.colorNegative:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary.colorInverted {\n  color: var(--primary-text-color);\n}\n.kindTertiary.colorInvertedActive,\n.kindTertiary.colorInverted:hover,\n.kindTertiary.colorInverted:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary.colorInverted.disabled {\n  color: var(--disabled-text-color);\n}\n.kindTertiary.colorOnPrimaryColor {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary.colorOnPrimaryColorActive,\n.kindTertiary.colorOnPrimaryColor:hover,\n.kindTertiary.colorOnPrimaryColor:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary.colorOnPrimaryColorActive:focus-visible, .kindTertiary.colorOnPrimaryColorActive.focus-visible,\n.kindTertiary.colorOnPrimaryColor:hover:focus-visible,\n.kindTertiary.colorOnPrimaryColor:hover.focus-visible,\n.kindTertiary.colorOnPrimaryColor:focus:focus-visible,\n.kindTertiary.colorOnPrimaryColor:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary.colorOnPrimaryColorActive:focus:not(.focus-visible),\n.kindTertiary.colorOnPrimaryColor:hover:focus:not(.focus-visible),\n.kindTertiary.colorOnPrimaryColor:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindTertiary.colorOnPrimaryColor.disabled {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary.colorFixedLight {\n  color: var(--fixed-light-color);\n}\n.kindTertiary.colorFixedLightActive,\n.kindTertiary.colorFixedLight:hover,\n.kindTertiary.colorFixedLight:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary.colorFixedLightActive:focus-visible, .kindTertiary.colorFixedLightActive.focus-visible,\n.kindTertiary.colorFixedLight:hover:focus-visible,\n.kindTertiary.colorFixedLight:hover.focus-visible,\n.kindTertiary.colorFixedLight:focus:focus-visible,\n.kindTertiary.colorFixedLight:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary.colorFixedLightActive:focus:not(.focus-visible),\n.kindTertiary.colorFixedLight:hover:focus:not(.focus-visible),\n.kindTertiary.colorFixedLight:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindTertiary.colorFixedLight.disabled {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary.colorFixedDark {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary.colorFixedDarkActive,\n.kindTertiary.colorFixedDark:hover,\n.kindTertiary.colorFixedDark:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary.colorFixedDarkActive:focus-visible, .kindTertiary.colorFixedDarkActive.focus-visible,\n.kindTertiary.colorFixedDark:hover:focus-visible,\n.kindTertiary.colorFixedDark:hover.focus-visible,\n.kindTertiary.colorFixedDark:focus:focus-visible,\n.kindTertiary.colorFixedDark:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary.colorFixedDarkActive:focus:not(.focus-visible),\n.kindTertiary.colorFixedDark:hover:focus:not(.focus-visible),\n.kindTertiary.colorFixedDark:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindTertiary.colorFixedDark.disabled {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary.colorOnInvertedBackground {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary.colorOnInvertedBackgroundActive,\n.kindTertiary.colorOnInvertedBackground:hover,\n.kindTertiary.colorOnInvertedBackground:focus {\n  background: var(--icon-color);\n}\n.kindTertiary.colorOnInvertedBackground.disabled {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary.disabled {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary.disabled:hover {\n  background-color: transparent;\n}\n.noSidePadding {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button.insetFocusStyle:focus-visible, .button.insetFocusStyle.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button.insetFocusStyle:focus:not(.focus-visible) {\n  outline: none;\n}");export{o as default};
+var o={button:"button","focus-visible":"focus-visible",loader:"loader",loaderSvg:"loaderSvg",textPlaceholder:"textPlaceholder",success:"success",successContent:"successContent",marginRight:"marginRight",marginLeft:"marginLeft",rightFlat:"rightFlat",leftFlat:"leftFlat",preventClickAnimation:"preventClickAnimation",leftIcon:"leftIcon",rightIcon:"rightIcon",sizeXxs:"sizeXxs",sizeXs:"sizeXs",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge",kindPrimary:"kindPrimary",colorPrimary:"colorPrimary",colorBrand:"colorBrand",colorPrimaryActive:"colorPrimaryActive",colorBrandActive:"colorBrandActive",colorPositive:"colorPositive",colorPositiveActive:"colorPositiveActive",colorNegative:"colorNegative",colorNegativeActive:"colorNegativeActive",colorInverted:"colorInverted",colorInvertedActive:"colorInvertedActive",disabled:"disabled",colorOnPrimaryColor:"colorOnPrimaryColor",colorOnPrimaryColorActive:"colorOnPrimaryColorActive",colorFixedLight:"colorFixedLight",colorFixedLightActive:"colorFixedLightActive",colorFixedDark:"colorFixedDark",colorFixedDarkActive:"colorFixedDarkActive",colorOnInvertedBackground:"colorOnInvertedBackground",colorOnInvertedBackgroundActive:"colorOnInvertedBackgroundActive",kindSecondary:"kindSecondary",kindTertiary:"kindTertiary",noSidePadding:"noSidePadding",insetFocusStyle:"insetFocusStyle"};!function(o){const r="s_id-95d3f630f6d9_3_0_16";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const i=document.createElement("style");i.id=r,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n.button {\n  --loader-padding: 8px;\n  outline: none;\n  border: none;\n  height: auto;\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n  white-space: nowrap;\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  /* Prevent text selection */\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  user-select: none;\n  min-width: auto;\n}\n.button:focus-visible, .button.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button:focus:not(.focus-visible) {\n  outline: none;\n}\n.button .loader {\n  height: 100%;\n}\n.button .loader .loaderSvg {\n  position: static;\n  height: 100%;\n  margin: 0;\n}\n.button .textPlaceholder {\n  display: inline-block;\n  opacity: 0;\n  height: 0;\n  visibility: hidden;\n  white-space: pre;\n}\n.button.success {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n}\n.button.success .successContent {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.marginRight {\n  margin-right: var(--spacing-small);\n}\n.marginLeft {\n  margin-left: var(--spacing-small);\n}\n.rightFlat {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0;\n}\n.leftFlat {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n}\n.button:active:not(.preventClickAnimation) {\n  transform: scale(0.95) translate3d(0, 0, 0);\n}\n.button .leftIcon {\n  margin-right: var(--spacing-small);\n}\n.button .rightIcon {\n  margin-left: var(--spacing-small);\n}\n.sizeXxs {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: 2px var(--spacing-xs);\n  height: 16px;\n  line-height: 16px;\n}\n.sizeXs {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 24px;\n  line-height: 21px;\n}\n.sizeSmall {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text2-normal);\n  padding: var(--spacing-xs) var(--spacing-small);\n  height: 32px;\n  line-height: 24px;\n}\n.sizeSmall .loader {\n  top: 7px;\n}\n.sizeMedium {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: var(--spacing-small) var(--spacing-medium);\n  height: 40px;\n}\n.sizeLarge {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font: var(--font-text1-normal);\n  padding: 12px var(--spacing-large);\n  height: 48px;\n}\n.kindPrimary {\n  color: var(--text-color-on-primary);\n}\n.kindPrimary.colorPrimary {\n  background: var(--primary-color);\n}\n.kindPrimary.colorBrand {\n  background: var(--brand-color);\n  color: var(--text-color-on-brand);\n}\n.kindPrimary.colorPrimaryActive,\n.kindPrimary.colorPrimary:hover,\n.kindPrimary.colorPrimary:focus {\n  background: var(--primary-hover-color);\n}\n.kindPrimary.colorBrandActive,\n.kindPrimary.colorBrand:hover,\n.kindPrimary.colorBrand:focus {\n  background: var(--brand-hover-color);\n}\n.kindPrimary.colorPositive {\n  background: var(--positive-color);\n}\n.kindPrimary.colorPositiveActive,\n.kindPrimary.colorPositive:hover,\n.kindPrimary.colorPositive:focus {\n  background: var(--positive-color-hover);\n}\n.kindPrimary.colorNegative {\n  background: var(--negative-color);\n}\n.kindPrimary.colorNegativeActive,\n.kindPrimary.colorNegative:hover,\n.kindPrimary.colorNegative:focus {\n  background: var(--negative-color-hover);\n}\n.kindPrimary.colorInverted {\n  background: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.kindPrimary.colorInvertedActive,\n.kindPrimary.colorInverted:hover,\n.kindPrimary.colorInverted:focus {\n  background: var(--placeholder-color);\n}\n.kindPrimary.button.colorInverted.disabled {\n  background: var(--disabled-text-color);\n  color: var(--disabled-background-color);\n}\n.kindPrimary.colorOnPrimaryColor {\n  background: var(--text-color-on-primary);\n}\n.kindPrimary.colorOnPrimaryColorActive,\n.kindPrimary.colorOnPrimaryColor:hover,\n.kindPrimary.colorOnPrimaryColor:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary.colorOnPrimaryColorActive:focus-visible, .kindPrimary.colorOnPrimaryColorActive.focus-visible,\n.kindPrimary.colorOnPrimaryColor:hover:focus-visible,\n.kindPrimary.colorOnPrimaryColor:hover.focus-visible,\n.kindPrimary.colorOnPrimaryColor:focus:focus-visible,\n.kindPrimary.colorOnPrimaryColor:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary.colorOnPrimaryColorActive:focus:not(.focus-visible),\n.kindPrimary.colorOnPrimaryColor:hover:focus:not(.focus-visible),\n.kindPrimary.colorOnPrimaryColor:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindPrimary.colorOnPrimaryColor.disabled {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindPrimary.colorFixedLight {\n  background: var(--fixed-light-color);\n}\n.kindPrimary.colorFixedLightActive,\n.kindPrimary.colorFixedLight:hover,\n.kindPrimary.colorFixedLight:focus {\n  background-color: #e6e9ef;\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindPrimary.colorFixedLightActive:focus-visible, .kindPrimary.colorFixedLightActive.focus-visible,\n.kindPrimary.colorFixedLight:hover:focus-visible,\n.kindPrimary.colorFixedLight:hover.focus-visible,\n.kindPrimary.colorFixedLight:focus:focus-visible,\n.kindPrimary.colorFixedLight:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary.colorFixedLightActive:focus:not(.focus-visible),\n.kindPrimary.colorFixedLight:hover:focus:not(.focus-visible),\n.kindPrimary.colorFixedLight:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindPrimary.colorFixedLight.disabled {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindPrimary.colorFixedDark {\n  background: var(--fixed-dark-color);\n  color: var(--fixed-light-color);\n}\n.kindPrimary.colorFixedDarkActive,\n.kindPrimary.colorFixedDark:hover,\n.kindPrimary.colorFixedDark:focus {\n  filter: brightness(125%);\n}\n.kindPrimary.colorFixedDarkActive:focus-visible, .kindPrimary.colorFixedDarkActive.focus-visible,\n.kindPrimary.colorFixedDark:hover:focus-visible,\n.kindPrimary.colorFixedDark:hover.focus-visible,\n.kindPrimary.colorFixedDark:focus:focus-visible,\n.kindPrimary.colorFixedDark:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindPrimary.colorFixedDarkActive:focus:not(.focus-visible),\n.kindPrimary.colorFixedDark:hover:focus:not(.focus-visible),\n.kindPrimary.colorFixedDark:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindPrimary.colorFixedDark.disabled {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindPrimary.colorOnInvertedBackground {\n  background: var(--primary-background-color);\n  color: var(--primary-text-color);\n}\n.kindPrimary.colorOnInvertedBackgroundActive,\n.kindPrimary.colorOnInvertedBackground:hover,\n.kindPrimary.colorOnInvertedBackground:focus {\n  background: var(--ui-background-color);\n}\n.kindPrimary.button.colorOnInvertedBackground.disabled {\n  background: var(--ui-background-color);\n  color: var(--primary-text-color);\n  opacity: 0.5;\n}\n.kindPrimary.button.disabled {\n  background: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary {\n  border: 1px solid;\n  border-color: var(--ui-border-color);\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindSecondary.sizeSmall {\n  line-height: 22px;\n}\n.kindSecondary.sizeMedium {\n  line-height: 22px;\n}\n.kindSecondary.sizeLarge {\n  line-height: 22px;\n}\n.kindSecondary.colorPrimaryActive {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary.colorPrimaryActive:hover {\n  background-color: var(--primary-selected-hover-color);\n  border-color: var(--primary-color);\n}\n.kindSecondary.colorBrandActive {\n  color: var(--text-color-on-brand);\n}\n.kindSecondary.colorBrandActive,\n.kindSecondary.colorBrandActive:hover {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n.kindSecondary.colorPrimary:hover:not(.colorPrimaryActive),\n.kindSecondary.colorPrimary:focus:not(.colorPrimaryActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary.colorBrand:hover:not(.colorBrandActive),\n.kindSecondary.colorBrand:focus:not(.colorBrandActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary.colorPositive {\n  color: var(--positive-color);\n  border-color: var(--positive-color);\n}\n.kindSecondary.colorPositiveActive,\n.kindSecondary.colorPositive:hover,\n.kindSecondary.colorPositive:focus {\n  background: var(--positive-color-selected);\n}\n.kindSecondary.colorNegative {\n  color: var(--negative-color);\n  border-color: var(--negative-color);\n}\n.kindSecondary.colorNegativeActive,\n.kindSecondary.colorNegative:hover,\n.kindSecondary.colorNegative:focus {\n  background: var(--negative-color-selected);\n}\n.kindSecondary.colorInverted {\n  color: var(--primary-text-color);\n  border-color: var(--primary-text-color);\n}\n.kindSecondary.colorInvertedActive,\n.kindSecondary.colorInverted:hover,\n.kindSecondary.colorInverted:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindSecondary.colorInverted.disabled {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n}\n.kindSecondary.colorOnPrimaryColor {\n  color: var(--text-color-on-primary);\n  border-color: var(--text-color-on-primary);\n}\n.kindSecondary.colorOnPrimaryColorActive,\n.kindSecondary.colorOnPrimaryColor:hover,\n.kindSecondary.colorOnPrimaryColor:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary.colorOnPrimaryColorActive:focus-visible, .kindSecondary.colorOnPrimaryColorActive.focus-visible,\n.kindSecondary.colorOnPrimaryColor:hover:focus-visible,\n.kindSecondary.colorOnPrimaryColor:hover.focus-visible,\n.kindSecondary.colorOnPrimaryColor:focus:focus-visible,\n.kindSecondary.colorOnPrimaryColor:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary.colorOnPrimaryColorActive:focus:not(.focus-visible),\n.kindSecondary.colorOnPrimaryColor:hover:focus:not(.focus-visible),\n.kindSecondary.colorOnPrimaryColor:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindSecondary.colorOnPrimaryColor.disabled {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindSecondary.colorFixedLight {\n  border-color: var(--fixed-light-color);\n  color: var(--fixed-light-color);\n}\n.kindSecondary.colorFixedLightActive,\n.kindSecondary.colorFixedLight:hover,\n.kindSecondary.colorFixedLight:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindSecondary.colorFixedLightActive:focus-visible, .kindSecondary.colorFixedLightActive.focus-visible,\n.kindSecondary.colorFixedLight:hover:focus-visible,\n.kindSecondary.colorFixedLight:hover.focus-visible,\n.kindSecondary.colorFixedLight:focus:focus-visible,\n.kindSecondary.colorFixedLight:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary.colorFixedLightActive:focus:not(.focus-visible),\n.kindSecondary.colorFixedLight:hover:focus:not(.focus-visible),\n.kindSecondary.colorFixedLight:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindSecondary.colorFixedDark {\n  border-color: var(--fixed-dark-color);\n  color: var(--fixed-dark-color);\n}\n.kindSecondary.colorFixedDarkActive,\n.kindSecondary.colorFixedDark:hover,\n.kindSecondary.colorFixedDark:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindSecondary.colorFixedDarkActive:focus-visible, .kindSecondary.colorFixedDarkActive.focus-visible,\n.kindSecondary.colorFixedDark:hover:focus-visible,\n.kindSecondary.colorFixedDark:hover.focus-visible,\n.kindSecondary.colorFixedDark:focus:focus-visible,\n.kindSecondary.colorFixedDark:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindSecondary.colorFixedDarkActive:focus:not(.focus-visible),\n.kindSecondary.colorFixedDark:hover:focus:not(.focus-visible),\n.kindSecondary.colorFixedDark:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindSecondary.colorOnInvertedBackground {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n}\n.kindSecondary.colorOnInvertedBackgroundActive,\n.kindSecondary.colorOnInvertedBackground:hover,\n.kindSecondary.colorOnInvertedBackground:focus {\n  background: var(--icon-color);\n}\n.kindSecondary.colorOnInvertedBackground.disabled {\n  border-color: var(--text-color-on-inverted);\n  color: var(--text-color-on-inverted);\n  opacity: 0.5;\n}\n.kindSecondary.colorFixedLight.disabled {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindSecondary.colorFixedDark.disabled {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindSecondary.disabled {\n  border-color: var(--disabled-text-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindSecondary.disabled:hover {\n  background-color: transparent;\n}\n.kindTertiary {\n  color: var(--primary-text-color);\n  background-color: transparent;\n}\n.kindTertiary.colorPrimaryActive {\n  background-color: var(--primary-selected-color);\n}\n.kindTertiary.colorPrimaryActive:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n.kindTertiary.colorBrandActive {\n  color: var(--text-color-on-brand);\n}\n.kindTertiary.colorBrandActive,\n.kindTertiary.colorBrandActive:hover {\n  background-color: var(--brand-selected-color);\n}\n.kindTertiary.colorPrimary:hover:not(.colorPrimaryActive),\n.kindTertiary.colorPrimary:focus:not(.colorPrimaryActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary.colorBrand:hover:not(.colorBrandActive),\n.kindTertiary.colorBrand:focus:not(.colorBrandActive) {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary.colorPositive {\n  color: var(--positive-color);\n}\n.kindTertiary.colorPositiveActive,\n.kindTertiary.colorPositive:hover,\n.kindTertiary.colorPositive:focus {\n  background: var(--positive-color-selected);\n}\n.kindTertiary.colorNegative {\n  color: var(--negative-color);\n}\n.kindTertiary.colorNegativeActive,\n.kindTertiary.colorNegative:hover,\n.kindTertiary.colorNegative:focus {\n  background: var(--negative-color-selected);\n}\n.kindTertiary.colorInverted {\n  color: var(--primary-text-color);\n}\n.kindTertiary.colorInvertedActive,\n.kindTertiary.colorInverted:hover,\n.kindTertiary.colorInverted:focus {\n  background: var(--primary-background-hover-color);\n}\n.kindTertiary.colorInverted.disabled {\n  color: var(--disabled-text-color);\n}\n.kindTertiary.colorOnPrimaryColor {\n  color: var(--text-color-on-primary);\n}\n.kindTertiary.colorOnPrimaryColorActive,\n.kindTertiary.colorOnPrimaryColor:hover,\n.kindTertiary.colorOnPrimaryColor:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary.colorOnPrimaryColorActive:focus-visible, .kindTertiary.colorOnPrimaryColorActive.focus-visible,\n.kindTertiary.colorOnPrimaryColor:hover:focus-visible,\n.kindTertiary.colorOnPrimaryColor:hover.focus-visible,\n.kindTertiary.colorOnPrimaryColor:focus:focus-visible,\n.kindTertiary.colorOnPrimaryColor:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary.colorOnPrimaryColorActive:focus:not(.focus-visible),\n.kindTertiary.colorOnPrimaryColor:hover:focus:not(.focus-visible),\n.kindTertiary.colorOnPrimaryColor:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindTertiary.colorOnPrimaryColor.disabled {\n  opacity: 0.5;\n  color: var(--text-color-on-primary);\n}\n.kindTertiary.colorFixedLight {\n  color: var(--fixed-light-color);\n}\n.kindTertiary.colorFixedLightActive,\n.kindTertiary.colorFixedLight:hover,\n.kindTertiary.colorFixedLight:focus {\n  -webkit-backdrop-filter: brightness(85%);\n          backdrop-filter: brightness(85%);\n}\n.kindTertiary.colorFixedLightActive:focus-visible, .kindTertiary.colorFixedLightActive.focus-visible,\n.kindTertiary.colorFixedLight:hover:focus-visible,\n.kindTertiary.colorFixedLight:hover.focus-visible,\n.kindTertiary.colorFixedLight:focus:focus-visible,\n.kindTertiary.colorFixedLight:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary.colorFixedLightActive:focus:not(.focus-visible),\n.kindTertiary.colorFixedLight:hover:focus:not(.focus-visible),\n.kindTertiary.colorFixedLight:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindTertiary.colorFixedLight.disabled {\n  opacity: 0.5;\n  color: var(--fixed-light-color);\n}\n.kindTertiary.colorFixedDark {\n  color: var(--fixed-dark-color);\n}\n.kindTertiary.colorFixedDarkActive,\n.kindTertiary.colorFixedDark:hover,\n.kindTertiary.colorFixedDark:focus {\n  background-color: var(--primary-background-hover-color);\n}\n.kindTertiary.colorFixedDarkActive:focus-visible, .kindTertiary.colorFixedDarkActive.focus-visible,\n.kindTertiary.colorFixedDark:hover:focus-visible,\n.kindTertiary.colorFixedDark:hover.focus-visible,\n.kindTertiary.colorFixedDark:focus:focus-visible,\n.kindTertiary.colorFixedDark:focus.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.kindTertiary.colorFixedDarkActive:focus:not(.focus-visible),\n.kindTertiary.colorFixedDark:hover:focus:not(.focus-visible),\n.kindTertiary.colorFixedDark:focus:focus:not(.focus-visible) {\n  outline: none;\n}\n.kindTertiary.colorFixedDark.disabled {\n  opacity: 0.5;\n  color: var(--fixed-dark-color);\n}\n.kindTertiary.colorOnInvertedBackground {\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary.colorOnInvertedBackgroundActive,\n.kindTertiary.colorOnInvertedBackground:hover,\n.kindTertiary.colorOnInvertedBackground:focus {\n  background: var(--icon-color);\n}\n.kindTertiary.colorOnInvertedBackground.disabled {\n  background: var(--icon-color);\n  opacity: 0.5;\n  color: var(--text-color-on-inverted);\n}\n.kindTertiary.disabled {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.kindTertiary.disabled:hover {\n  background-color: transparent;\n}\n.noSidePadding {\n  padding-right: 0;\n  padding-left: 0;\n}\n.button.insetFocusStyle:focus-visible, .button.insetFocusStyle.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.button.insetFocusStyle:focus:not(.focus-visible) {\n  outline: none;\n}");export{o as default};
 //# sourceMappingURL=Button.module.scss.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vibe/button",
-  "version": "3.0.16",
+  "version": "3.1.0",
   "description": "Vibe sub-package for button components",
   "repository": {
     "type": "git",
@@ -38,9 +38,9 @@
     "lint": "eslint \"./src/**/*.{js,jsx,ts,tsx}\""
   },
   "dependencies": {
-    "@vibe/icon": "3.0.11",
-    "@vibe/loader": "3.0.11",
-    "@vibe/shared": "3.0.8",
+    "@vibe/icon": "3.1.0",
+    "@vibe/loader": "3.1.0",
+    "@vibe/shared": "3.1.0",
     "classnames": "^2.5.1",
     "es-toolkit": "^1.39.10"
   },
@@ -69,5 +69,5 @@
       "../../../node_modules/@vibe/config/.eslintrc.cjs"
     ]
   },
-  "gitHead": "7edc0ec3c9b59efbb5c5c9d06fbe489e46d2a281"
+  "gitHead": "1e0ebec593676a7a3e8b4a965d688397a5f44c22"
 }

package/dist/Button/ButtonConstants.d.ts

@@ -1,35 +0,0 @@
-import { type SIZES } from "@vibe/shared";
-/**
- * @deprecated
- */
-export declare enum ButtonType {
-    PRIMARY = "primary",
-    SECONDARY = "secondary",
-    TERTIARY = "tertiary"
-}
-/**
- * @deprecated
- */
-export declare enum ButtonColor {
-    PRIMARY = "primary",
-    POSITIVE = "positive",
-    NEGATIVE = "negative",
-    INVERTED = "inverted",
-    ON_PRIMARY_COLOR = "on-primary-color",
-    ON_INVERTED_BACKGROUND = "on-inverted-background",
-    BRAND = "brand",
-    FIXED_LIGHT = "fixed-light",
-    FIXED_DARK = "fixed-dark"
-}
-export type Size = (typeof SIZES)[keyof typeof SIZES];
-export declare const BUTTON_KIND_CLASS_NAMES: {
-    PRIMARY: string;
-};
-/**
- * @deprecated
- */
-export declare enum ButtonInputType {
-    BUTTON = "button",
-    SUBMIT = "submit",
-    RESET = "reset"
-}

package/dist/Button/ButtonConstants.js

@@ -1,2 +0,0 @@
-var r,i,R;!function(r){r.PRIMARY="primary",r.SECONDARY="secondary",r.TERTIARY="tertiary"}(r||(r={})),function(r){r.PRIMARY="primary",r.POSITIVE="positive",r.NEGATIVE="negative",r.INVERTED="inverted",r.ON_PRIMARY_COLOR="on-primary-color",r.ON_INVERTED_BACKGROUND="on-inverted-background",r.BRAND="brand",r.FIXED_LIGHT="fixed-light",r.FIXED_DARK="fixed-dark"}(i||(i={})),function(r){r.BUTTON="button",r.SUBMIT="submit",r.RESET="reset"}(R||(R={}));export{i as ButtonColor,R as ButtonInputType,r as ButtonType};
-//# sourceMappingURL=ButtonConstants.js.map

package/dist/Button/ButtonConstants.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonConstants.js","sources":["../../src/Button/ButtonConstants.ts"],"sourcesContent":["import { type SIZES } from \"@vibe/shared\";\n\n/**\n * @deprecated\n */\nexport enum ButtonType {\n  PRIMARY = \"primary\",\n  SECONDARY = \"secondary\",\n  TERTIARY = \"tertiary\"\n}\n\n/**\n * @deprecated\n */\nexport enum ButtonColor {\n  PRIMARY = \"primary\",\n  POSITIVE = \"positive\",\n  NEGATIVE = \"negative\",\n  INVERTED = \"inverted\",\n  ON_PRIMARY_COLOR = \"on-primary-color\",\n  ON_INVERTED_BACKGROUND = \"on-inverted-background\",\n  BRAND = \"brand\",\n  FIXED_LIGHT = \"fixed-light\",\n  FIXED_DARK = \"fixed-dark\"\n}\n\nexport type Size = (typeof SIZES)[keyof typeof SIZES];\n\nexport const BUTTON_KIND_CLASS_NAMES = {\n  PRIMARY: \"\"\n};\n\n/**\n * @deprecated\n */\nexport enum ButtonInputType {\n  BUTTON = \"button\",\n  SUBMIT = \"submit\",\n  RESET = \"reset\"\n}\n"],"names":["ButtonType","ButtonColor","ButtonInputType"],"mappings":"IAKYA,EASAC,EAqBAC,GA9BZ,SAAYF,GACVA,EAAA,QAAA,UACAA,EAAA,UAAA,YACAA,EAAA,SAAA,UACD,CAJD,CAAYA,IAAAA,EAIX,CAAA,IAKD,SAAYC,GACVA,EAAA,QAAA,UACAA,EAAA,SAAA,WACAA,EAAA,SAAA,WACAA,EAAA,SAAA,WACAA,EAAA,iBAAA,mBACAA,EAAA,uBAAA,yBACAA,EAAA,MAAA,QACAA,EAAA,YAAA,cACAA,EAAA,WAAA,YACD,CAVD,CAAYA,IAAAA,EAUX,CAAA,IAWD,SAAYC,GACVA,EAAA,OAAA,SACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACD,CAJD,CAAYA,IAAAA,EAIX,CAAA"}

package/dist/mocked_classnames/Button/ButtonConstants.d.ts

@@ -1,35 +0,0 @@
-import { type SIZES } from "@vibe/shared";
-/**
- * @deprecated
- */
-export declare enum ButtonType {
-    PRIMARY = "primary",
-    SECONDARY = "secondary",
-    TERTIARY = "tertiary"
-}
-/**
- * @deprecated
- */
-export declare enum ButtonColor {
-    PRIMARY = "primary",
-    POSITIVE = "positive",
-    NEGATIVE = "negative",
-    INVERTED = "inverted",
-    ON_PRIMARY_COLOR = "on-primary-color",
-    ON_INVERTED_BACKGROUND = "on-inverted-background",
-    BRAND = "brand",
-    FIXED_LIGHT = "fixed-light",
-    FIXED_DARK = "fixed-dark"
-}
-export type Size = (typeof SIZES)[keyof typeof SIZES];
-export declare const BUTTON_KIND_CLASS_NAMES: {
-    PRIMARY: string;
-};
-/**
- * @deprecated
- */
-export declare enum ButtonInputType {
-    BUTTON = "button",
-    SUBMIT = "submit",
-    RESET = "reset"
-}

package/dist/mocked_classnames/Button/ButtonConstants.js

@@ -1,2 +0,0 @@
-var r,i,R;!function(r){r.PRIMARY="primary",r.SECONDARY="secondary",r.TERTIARY="tertiary"}(r||(r={})),function(r){r.PRIMARY="primary",r.POSITIVE="positive",r.NEGATIVE="negative",r.INVERTED="inverted",r.ON_PRIMARY_COLOR="on-primary-color",r.ON_INVERTED_BACKGROUND="on-inverted-background",r.BRAND="brand",r.FIXED_LIGHT="fixed-light",r.FIXED_DARK="fixed-dark"}(i||(i={})),function(r){r.BUTTON="button",r.SUBMIT="submit",r.RESET="reset"}(R||(R={}));export{i as ButtonColor,R as ButtonInputType,r as ButtonType};
-//# sourceMappingURL=ButtonConstants.js.map

package/dist/mocked_classnames/Button/ButtonConstants.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonConstants.js","sources":["../../../src/Button/ButtonConstants.ts"],"sourcesContent":["import { type SIZES } from \"@vibe/shared\";\n\n/**\n * @deprecated\n */\nexport enum ButtonType {\n  PRIMARY = \"primary\",\n  SECONDARY = \"secondary\",\n  TERTIARY = \"tertiary\"\n}\n\n/**\n * @deprecated\n */\nexport enum ButtonColor {\n  PRIMARY = \"primary\",\n  POSITIVE = \"positive\",\n  NEGATIVE = \"negative\",\n  INVERTED = \"inverted\",\n  ON_PRIMARY_COLOR = \"on-primary-color\",\n  ON_INVERTED_BACKGROUND = \"on-inverted-background\",\n  BRAND = \"brand\",\n  FIXED_LIGHT = \"fixed-light\",\n  FIXED_DARK = \"fixed-dark\"\n}\n\nexport type Size = (typeof SIZES)[keyof typeof SIZES];\n\nexport const BUTTON_KIND_CLASS_NAMES = {\n  PRIMARY: \"\"\n};\n\n/**\n * @deprecated\n */\nexport enum ButtonInputType {\n  BUTTON = \"button\",\n  SUBMIT = \"submit\",\n  RESET = \"reset\"\n}\n"],"names":["ButtonType","ButtonColor","ButtonInputType"],"mappings":"IAKYA,EASAC,EAqBAC,GA9BZ,SAAYF,GACVA,EAAA,QAAA,UACAA,EAAA,UAAA,YACAA,EAAA,SAAA,UACD,CAJD,CAAYA,IAAAA,EAIX,CAAA,IAKD,SAAYC,GACVA,EAAA,QAAA,UACAA,EAAA,SAAA,WACAA,EAAA,SAAA,WACAA,EAAA,SAAA,WACAA,EAAA,iBAAA,mBACAA,EAAA,uBAAA,yBACAA,EAAA,MAAA,QACAA,EAAA,YAAA,cACAA,EAAA,WAAA,YACD,CAVD,CAAYA,IAAAA,EAUX,CAAA,IAWD,SAAYC,GACVA,EAAA,OAAA,SACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACD,CAJD,CAAYA,IAAAA,EAIX,CAAA"}