@channel.io/bezier-react 2.0.7 → 2.0.9

package/dist/cjs/components/AlphaAvatar/Avatar.js

@@ -3,7 +3,7 @@
 var React = require('react');
 var index = require('../../node_modules/classnames/index.js');
 var type = require('../../utils/type.js');
-var AvatarGroup = require('../AlphaAvatarGroup/AvatarGroup.js');
+var AvatarSizeContext = require('./AvatarSizeContext.js');
 var defaultAvatar = require('./assets/default-avatar.svg.js');
 var useProgressiveImage = require('./useProgressiveImage.js');
 var Avatar_module = require('./Avatar.module.scss.js');
@@ -71,7 +71,7 @@ const Avatar = /*#__PURE__*/React.forwardRef(function Avatar({
   children,
   ...rest
 }, forwardedRef) {
-  const avatarGroupContext = AvatarGroup.useAvatarGroupContext();
+  const avatarGroupContext = AvatarSizeContext.useAvatarContext();
   const size = avatarGroupContext?.size ?? sizeProps;
   const loadedAvatarUrl = useProgressiveImage.default(avatarUrl, fallbackUrl);
   const AVATAR_BORDER_RADIUS = useAvatarRadiusToken();

package/dist/cjs/components/AlphaAvatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sources":["../../../../src/components/AlphaAvatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react'\n\nimport classNames from 'classnames'\n\nimport { isEmpty } from '~/src/utils/type'\n\nimport { useAvatarGroupContext } from '~/src/components/AlphaAvatarGroup/AvatarGroup'\nimport {\n  SmoothCornersBox,\n  type SmoothCornersBoxProps,\n} from '~/src/components/SmoothCornersBox'\nimport { Status, type StatusSize } from '~/src/components/Status'\nimport { useTokens } from '~/src/components/ThemeProvider'\n\nimport type { AvatarProps, AvatarSize } from './Avatar.types'\nimport defaultAvatarUrl from './assets/default-avatar.svg'\nimport useProgressiveImage from './useProgressiveImage'\n\nimport styles from './Avatar.module.scss'\n\nfunction getStatusSize(size: AvatarSize): StatusSize {\n  switch (size) {\n    case '90':\n    case '120':\n      return 'l'\n    default:\n      return 'm'\n  }\n}\n\nfunction getShadow(size: AvatarSize): SmoothCornersBoxProps['shadow'] {\n  const spreadRadius = (() => {\n    switch (size) {\n      case '90':\n        return 3\n      case '120':\n        return 4\n      default:\n        return 2\n    }\n  })()\n\n  return {\n    spreadRadius,\n    color: 'bg-white-high',\n  }\n}\n\nexport function useAvatarRadiusToken() {\n  // TODO: Replace this with useAlphaTokens\n  return useTokens().global.radius['radius-42-p']\n}\n\nexport const AVATAR_WRAPPER_TEST_ID = 'bezier-avatar-wrapper'\nexport const AVATAR_TEST_ID = 'bezier-avatar'\nexport const STATUS_WRAPPER_TEST_ID = 'bezier-status-wrapper'\n\n/**\n * `Avatar` is a component for representing some profile image.\n * @example\n *\n * ```tsx\n * <Avatar\n *   avatarUrl=\"https://...\"\n *   name=\"channel\"\n *   size=\"48\"\n *   showBorder\n *   disabled\n * />\n * ```\n */\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n  {\n    avatarUrl = '',\n    fallbackUrl = defaultAvatarUrl,\n    size: sizeProps = '24',\n    name,\n    disabled = false,\n    showBorder = false,\n    smoothCorners = true,\n    status,\n    className,\n    children,\n    ...rest\n  },\n  forwardedRef\n) {\n  const avatarGroupContext = useAvatarGroupContext()\n  const size = avatarGroupContext?.size ?? sizeProps\n  const loadedAvatarUrl = useProgressiveImage(avatarUrl, fallbackUrl)\n  const AVATAR_BORDER_RADIUS = useAvatarRadiusToken()\n\n  const StatusComponent = useMemo(() => {\n    if (\n      (isEmpty(children) && !status) ||\n      (children && !React.isValidElement(children))\n    ) {\n      return null\n    }\n\n    const Contents = (() => {\n      if (children) {\n        return children\n      }\n      if (status) {\n        return (\n          <Status\n            type={status}\n            size={getStatusSize(size)}\n          />\n        )\n      }\n      return null\n    })()\n\n    return (\n      Contents && (\n        <div\n          className={styles.StatusWrapper}\n          data-testid={STATUS_WRAPPER_TEST_ID}\n        >\n          {Contents}\n        </div>\n      )\n    )\n  }, [status, size, children])\n\n  return (\n    <div\n      className={classNames(\n        styles.Avatar,\n        styles[`size-${size}`],\n        disabled && styles.disabled,\n        className\n      )}\n      data-disabled={disabled}\n      data-testid={AVATAR_WRAPPER_TEST_ID}\n      {...rest}\n    >\n      <SmoothCornersBox\n        ref={forwardedRef}\n        aria-description={name}\n        className={classNames(\n          styles.AvatarImage,\n          Number(size) >= 72 && styles['big-size'],\n          showBorder && styles.bordered\n        )}\n        disabled={!smoothCorners}\n        borderRadius={AVATAR_BORDER_RADIUS}\n        shadow={showBorder ? getShadow(size) : undefined}\n        backgroundColor=\"bg-white-normal\"\n        backgroundImage={loadedAvatarUrl}\n        data-testid={AVATAR_TEST_ID}\n      >\n        {StatusComponent}\n      </SmoothCornersBox>\n    </div>\n  )\n})\n"],"names":["getStatusSize","size","getShadow","spreadRadius","color","useAvatarRadiusToken","useTokens","global","radius","AVATAR_WRAPPER_TEST_ID","AVATAR_TEST_ID","STATUS_WRAPPER_TEST_ID","Avatar","forwardRef","avatarUrl","fallbackUrl","defaultAvatarUrl","sizeProps","name","disabled","showBorder","smoothCorners","status","className","children","rest","forwardedRef","avatarGroupContext","useAvatarGroupContext","loadedAvatarUrl","useProgressiveImage","AVATAR_BORDER_RADIUS","StatusComponent","useMemo","isEmpty","React","isValidElement","Contents","createElement","Status","type","styles","StatusWrapper","Object","assign","classNames","SmoothCornersBox","ref","AvatarImage","Number","bordered","borderRadius","shadow","undefined","backgroundColor","backgroundImage"],"mappings":"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"}
+{"version":3,"file":"Avatar.js","sources":["../../../../src/components/AlphaAvatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react'\n\nimport classNames from 'classnames'\n\nimport { isEmpty } from '~/src/utils/type'\n\nimport { useAvatarContext } from '~/src/components/AlphaAvatar/AvatarSizeContext'\nimport {\n  SmoothCornersBox,\n  type SmoothCornersBoxProps,\n} from '~/src/components/SmoothCornersBox'\nimport { Status, type StatusSize } from '~/src/components/Status'\nimport { useTokens } from '~/src/components/ThemeProvider'\n\nimport type { AvatarProps, AvatarSize } from './Avatar.types'\nimport defaultAvatarUrl from './assets/default-avatar.svg'\nimport useProgressiveImage from './useProgressiveImage'\n\nimport styles from './Avatar.module.scss'\n\nfunction getStatusSize(size: AvatarSize): StatusSize {\n  switch (size) {\n    case '90':\n    case '120':\n      return 'l'\n    default:\n      return 'm'\n  }\n}\n\nfunction getShadow(size: AvatarSize): SmoothCornersBoxProps['shadow'] {\n  const spreadRadius = (() => {\n    switch (size) {\n      case '90':\n        return 3\n      case '120':\n        return 4\n      default:\n        return 2\n    }\n  })()\n\n  return {\n    spreadRadius,\n    color: 'bg-white-high',\n  }\n}\n\nexport function useAvatarRadiusToken() {\n  // TODO: Replace this with useAlphaTokens\n  return useTokens().global.radius['radius-42-p']\n}\n\nexport const AVATAR_WRAPPER_TEST_ID = 'bezier-avatar-wrapper'\nexport const AVATAR_TEST_ID = 'bezier-avatar'\nexport const STATUS_WRAPPER_TEST_ID = 'bezier-status-wrapper'\n\n/**\n * `Avatar` is a component for representing some profile image.\n * @example\n *\n * ```tsx\n * <Avatar\n *   avatarUrl=\"https://...\"\n *   name=\"channel\"\n *   size=\"48\"\n *   showBorder\n *   disabled\n * />\n * ```\n */\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(function Avatar(\n  {\n    avatarUrl = '',\n    fallbackUrl = defaultAvatarUrl,\n    size: sizeProps = '24',\n    name,\n    disabled = false,\n    showBorder = false,\n    smoothCorners = true,\n    status,\n    className,\n    children,\n    ...rest\n  },\n  forwardedRef\n) {\n  const avatarGroupContext = useAvatarContext()\n  const size = avatarGroupContext?.size ?? sizeProps\n  const loadedAvatarUrl = useProgressiveImage(avatarUrl, fallbackUrl)\n  const AVATAR_BORDER_RADIUS = useAvatarRadiusToken()\n\n  const StatusComponent = useMemo(() => {\n    if (\n      (isEmpty(children) && !status) ||\n      (children && !React.isValidElement(children))\n    ) {\n      return null\n    }\n\n    const Contents = (() => {\n      if (children) {\n        return children\n      }\n      if (status) {\n        return (\n          <Status\n            type={status}\n            size={getStatusSize(size)}\n          />\n        )\n      }\n      return null\n    })()\n\n    return (\n      Contents && (\n        <div\n          className={styles.StatusWrapper}\n          data-testid={STATUS_WRAPPER_TEST_ID}\n        >\n          {Contents}\n        </div>\n      )\n    )\n  }, [status, size, children])\n\n  return (\n    <div\n      className={classNames(\n        styles.Avatar,\n        styles[`size-${size}`],\n        disabled && styles.disabled,\n        className\n      )}\n      data-disabled={disabled}\n      data-testid={AVATAR_WRAPPER_TEST_ID}\n      {...rest}\n    >\n      <SmoothCornersBox\n        ref={forwardedRef}\n        aria-description={name}\n        className={classNames(\n          styles.AvatarImage,\n          Number(size) >= 72 && styles['big-size'],\n          showBorder && styles.bordered\n        )}\n        disabled={!smoothCorners}\n        borderRadius={AVATAR_BORDER_RADIUS}\n        shadow={showBorder ? getShadow(size) : undefined}\n        backgroundColor=\"bg-white-normal\"\n        backgroundImage={loadedAvatarUrl}\n        data-testid={AVATAR_TEST_ID}\n      >\n        {StatusComponent}\n      </SmoothCornersBox>\n    </div>\n  )\n})\n"],"names":["getStatusSize","size","getShadow","spreadRadius","color","useAvatarRadiusToken","useTokens","global","radius","AVATAR_WRAPPER_TEST_ID","AVATAR_TEST_ID","STATUS_WRAPPER_TEST_ID","Avatar","forwardRef","avatarUrl","fallbackUrl","defaultAvatarUrl","sizeProps","name","disabled","showBorder","smoothCorners","status","className","children","rest","forwardedRef","avatarGroupContext","useAvatarContext","loadedAvatarUrl","useProgressiveImage","AVATAR_BORDER_RADIUS","StatusComponent","useMemo","isEmpty","React","isValidElement","Contents","createElement","Status","type","styles","StatusWrapper","Object","assign","classNames","SmoothCornersBox","ref","AvatarImage","Number","bordered","borderRadius","shadow","undefined","backgroundColor","backgroundImage"],"mappings":"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"}

package/dist/cjs/components/AlphaAvatar/AvatarSizeContext.js

@@ -0,0 +1,11 @@
+'use strict';
+
+var react = require('../../utils/react.js');
+
+const [AvatarContextProvider, useAvatarContext] = react.createContext({
+  size: undefined
+});
+
+exports.AvatarContextProvider = AvatarContextProvider;
+exports.useAvatarContext = useAvatarContext;
+//# sourceMappingURL=AvatarSizeContext.js.map

package/dist/cjs/components/AlphaAvatar/AvatarSizeContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarSizeContext.js","sources":["../../../../src/components/AlphaAvatar/AvatarSizeContext.ts"],"sourcesContent":["import { createContext } from '~/src/utils/react'\n\nimport { type AvatarProps } from './Avatar.types'\n\nconst [AvatarContextProvider, useAvatarContext] = createContext<\n  Pick<AvatarProps, 'size'>\n>({ size: undefined })\n\nexport { AvatarContextProvider, useAvatarContext }\n"],"names":["AvatarContextProvider","useAvatarContext","createContext","size","undefined"],"mappings":";;;;AAIA,MAAM,CAACA,qBAAqB,EAAEC,gBAAgB,CAAC,GAAGC,mBAAa,CAE7D;AAAEC,EAAAA,IAAI,EAAEC,SAAAA;AAAU,CAAC;;;;;"}

package/dist/cjs/components/AlphaAvatarGroup/AvatarGroup.js

@@ -4,15 +4,14 @@ var React = require('react');
 var bezierIcons = require('@channel.io/bezier-icons');
 var index = require('../../node_modules/classnames/index.js');
 var array = require('../../utils/array.js');
-var react = require('../../utils/react.js');
 var style = require('../../utils/style.js');
+var AvatarSizeContext = require('../AlphaAvatar/AvatarSizeContext.js');
 var AvatarGroup_module = require('./AvatarGroup.module.scss.js');
 var Avatar = require('../AlphaAvatar/Avatar.js');
 var SmoothCornersBox = require('../SmoothCornersBox/SmoothCornersBox.js');
 var Icon = require('../Icon/Icon.js');
 var Text = require('../Text/Text.js');
 
-const [AvatarGroupContextProvider, useAvatarGroupContext] = react.createContext(undefined);
 const MAX_AVATAR_LIST_COUNT = 99;
 const AVATAR_GROUP_DEFAULT_SPACING = 4;
 const AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID = 'bezier-avatar-group-ellipsis-icon';
@@ -132,7 +131,7 @@ const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup({
       return null;
     });
   }, [avatarListCount, max, children, renderAvatarElement, ellipsisType, AVATAR_BORDER_RADIUS, size, spacing]);
-  return /*#__PURE__*/React.createElement(AvatarGroupContextProvider, {
+  return /*#__PURE__*/React.createElement(AvatarSizeContext.AvatarContextProvider, {
     value: React.useMemo(() => ({
       size
     }), [size])
@@ -149,5 +148,4 @@ const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup({
 
 exports.AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID = AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID;
 exports.AvatarGroup = AvatarGroup;
-exports.useAvatarGroupContext = useAvatarGroupContext;
 //# sourceMappingURL=AvatarGroup.js.map

package/dist/cjs/components/AlphaAvatarGroup/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","sources":["../../../../src/components/AlphaAvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from 'react'\n\nimport { MoreIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { isLastIndex } from '~/src/utils/array'\nimport { createContext } from '~/src/utils/react'\nimport { px } from '~/src/utils/style'\n\nimport {\n  type AlphaAvatarProps,\n  type AlphaAvatarSize,\n  useAlphaAvatarRadiusToken,\n} from '~/src/components/AlphaAvatar'\nimport { Icon } from '~/src/components/Icon'\nimport { SmoothCornersBox } from '~/src/components/SmoothCornersBox'\nimport { Text } from '~/src/components/Text'\n\nimport {\n  type AvatarGroupContextValue,\n  type AvatarGroupProps,\n} from './AvatarGroup.types'\n\nimport styles from './AvatarGroup.module.scss'\n\nconst [AvatarGroupContextProvider, useAvatarGroupContext] = createContext<\n  AvatarGroupContextValue | undefined\n>(undefined)\n\nexport { useAvatarGroupContext }\n\nconst MAX_AVATAR_LIST_COUNT = 99\nconst AVATAR_GROUP_DEFAULT_SPACING = 4\nexport const AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID =\n  'bezier-avatar-group-ellipsis-icon'\n\nfunction getRestAvatarListCountText(count: number, max: number) {\n  const restCount = count - max\n  return `+${restCount > MAX_AVATAR_LIST_COUNT ? MAX_AVATAR_LIST_COUNT : restCount}`\n}\n\n// TODO: Not specified\nfunction getProperIconSize(size: AlphaAvatarSize) {\n  return (\n    {\n      16: 'xxs',\n      20: 'xxs',\n      24: 'xs',\n      30: 's',\n      36: 'm',\n      42: 'm',\n      48: 'l',\n      72: 'l',\n      90: 'l',\n      120: 'l',\n    } as const\n  )[size]\n}\n\n// TODO: Not specified\nfunction getProperTypoSize(size: AlphaAvatarSize) {\n  return (\n    {\n      16: '12',\n      20: '12',\n      24: '13',\n      30: '15',\n      36: '16',\n      42: '18',\n      48: '24',\n      72: '24',\n      90: '24',\n      120: '24',\n    } as const\n  )[size]\n}\n\n/**\n * `AvatarGroup` is a component for grouping `Avatar` components\n * @example\n *\n * ```tsx\n * <AvatarGroup\n *  max={2}\n *  size=\"24\"\n *  spacing={4}\n *  ellipsisType=\"icon\"\n * >\n *    <Avatar />\n *    <Avatar />\n *    <Avatar />\n * </AvatarGroup>\n * ```\n */\nexport const AvatarGroup = forwardRef<HTMLDivElement, AvatarGroupProps>(\n  function AvatarGroup(\n    {\n      max = 5,\n      size = '24',\n      spacing = AVATAR_GROUP_DEFAULT_SPACING,\n      ellipsisType = 'icon',\n      style,\n      className,\n      children,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const AVATAR_BORDER_RADIUS = useAlphaAvatarRadiusToken()\n    const avatarListCount = React.Children.count(children)\n\n    const renderAvatarElement = useCallback(\n      (avatar: React.ReactElement<AlphaAvatarProps>) => {\n        const key =\n          avatar.key ?? `${avatar.props.name}-${avatar.props.avatarUrl}`\n        const shouldShowBorder = max > 1 && avatarListCount > 1 && spacing < 0\n        const showBorder = avatar.props.showBorder || shouldShowBorder\n        return React.cloneElement(avatar, { key, showBorder })\n      },\n      [avatarListCount, max, spacing]\n    )\n\n    const AvatarListComponent = useMemo(() => {\n      return React.Children.toArray(children)\n        .slice(0, max)\n        .map((avatar, index, arr) => {\n          if (!React.isValidElement<AlphaAvatarProps>(avatar)) {\n            return null\n          }\n\n          const AvatarElement = renderAvatarElement(avatar)\n\n          if (!isLastIndex(arr, index) || avatarListCount <= max) {\n            return AvatarElement\n          }\n\n          if (ellipsisType === 'icon') {\n            return (\n              <div\n                key=\"ellipsis\"\n                className={styles.AvatarEllipsisIconWrapper}\n                data-testid={AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID}\n              >\n                <SmoothCornersBox\n                  borderRadius={AVATAR_BORDER_RADIUS}\n                  backgroundColor=\"bgtxt-absolute-black-lightest\"\n                  className={styles.AvatarEllipsisIcon}\n                >\n                  <Icon\n                    source={MoreIcon}\n                    size={getProperIconSize(size)}\n                    color=\"bgtxt-absolute-white-dark\"\n                  />\n                </SmoothCornersBox>\n                {AvatarElement}\n              </div>\n            )\n          }\n\n          if (ellipsisType === 'count') {\n            return (\n              <React.Fragment key=\"ellipsis\">\n                {AvatarElement}\n                <div\n                  style={\n                    {\n                      '--b-avatar-group-ellipsis-ml': px(\n                        Math.max(spacing, AVATAR_GROUP_DEFAULT_SPACING)\n                      ),\n                    } as React.CSSProperties\n                  }\n                  className={classNames(styles.AvatarEllipsisCountWrapper)}\n                >\n                  <Text\n                    typo={getProperTypoSize(size)}\n                    color=\"txt-black-dark\"\n                    className={styles.AvatarEllipsisCount}\n                  >\n                    {getRestAvatarListCountText(avatarListCount, max)}\n                  </Text>\n                </div>\n              </React.Fragment>\n            )\n          }\n\n          return null\n        })\n    }, [\n      avatarListCount,\n      max,\n      children,\n      renderAvatarElement,\n      ellipsisType,\n      AVATAR_BORDER_RADIUS,\n      size,\n      spacing,\n    ])\n\n    return (\n      <AvatarGroupContextProvider\n        value={useMemo(\n          () => ({\n            size,\n          }),\n          [size]\n        )}\n      >\n        <div\n          role=\"group\"\n          ref={forwardedRef}\n          className={classNames(\n            styles.AvatarGroup,\n            styles[`size-${size}`],\n            className\n          )}\n          style={\n            {\n              '--b-avatar-group-spacing': px(spacing),\n              ...style,\n            } as React.CSSProperties\n          }\n          {...rest}\n        >\n          {AvatarListComponent}\n        </div>\n      </AvatarGroupContextProvider>\n    )\n  }\n)\n"],"names":["AvatarGroupContextProvider","useAvatarGroupContext","createContext","undefined","MAX_AVATAR_LIST_COUNT","AVATAR_GROUP_DEFAULT_SPACING","AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID","getRestAvatarListCountText","count","max","restCount","getProperIconSize","size","getProperTypoSize","AvatarGroup","forwardRef","spacing","ellipsisType","style","className","children","rest","forwardedRef","AVATAR_BORDER_RADIUS","useAlphaAvatarRadiusToken","avatarListCount","React","Children","renderAvatarElement","useCallback","avatar","key","props","name","avatarUrl","shouldShowBorder","showBorder","cloneElement","AvatarListComponent","useMemo","toArray","slice","map","index","arr","isValidElement","AvatarElement","isLastIndex","createElement","styles","AvatarEllipsisIconWrapper","SmoothCornersBox","borderRadius","backgroundColor","AvatarEllipsisIcon","Icon","source","MoreIcon","color","Fragment","px","Math","classNames","AvatarEllipsisCountWrapper","Text","typo","AvatarEllipsisCount","value","Object","assign","role","ref"],"mappings":";;;;;;;;;;;;;;AAyBM,MAAA,CAACA,0BAA0B,EAAEC,qBAAqB,CAAC,GAAGC,mBAAa,CAEvEC,SAAS,EAAC;AAIZ,MAAMC,qBAAqB,GAAG,EAAE,CAAA;AAChC,MAAMC,4BAA4B,GAAG,CAAC,CAAA;AAC/B,MAAMC,kCAAkC,GAC7C,oCAAmC;AAErC,SAASC,0BAA0BA,CAACC,KAAa,EAAEC,GAAW,EAAE;AAC9D,EAAA,MAAMC,SAAS,GAAGF,KAAK,GAAGC,GAAG,CAAA;EAC7B,OAAO,CAAA,CAAA,EAAIC,SAAS,GAAGN,qBAAqB,GAAGA,qBAAqB,GAAGM,SAAS,CAAE,CAAA,CAAA;AACpF,CAAA;;AAEA;AACA,SAASC,iBAAiBA,CAACC,IAAqB,EAAE;EAChD,OACE;AACE,IAAA,EAAE,EAAE,KAAK;AACT,IAAA,EAAE,EAAE,KAAK;AACT,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,GAAG,EAAE,GAAA;GACN,CACDA,IAAI,CAAC,CAAA;AACT,CAAA;;AAEA;AACA,SAASC,iBAAiBA,CAACD,IAAqB,EAAE;EAChD,OACE;AACE,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,GAAG,EAAE,IAAA;GACN,CACDA,IAAI,CAAC,CAAA;AACT,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;MACaE,WAAW,gBAAGC,gBAAU,CACnC,SAASD,WAAWA,CAClB;AACEL,EAAAA,GAAG,GAAG,CAAC;AACPG,EAAAA,IAAI,GAAG,IAAI;AACXI,EAAAA,OAAO,GAAGX,4BAA4B;AACtCY,EAAAA,YAAY,GAAG,MAAM;SACrBC,OAAK;EACLC,SAAS;EACTC,QAAQ;EACR,GAAGC,IAAAA;AACL,CAAC,EACDC,YAAY,EACZ;AACA,EAAA,MAAMC,oBAAoB,GAAGC,2BAAyB,EAAE,CAAA;EACxD,MAAMC,eAAe,GAAGC,KAAK,CAACC,QAAQ,CAACnB,KAAK,CAACY,QAAQ,CAAC,CAAA;AAEtD,EAAA,MAAMQ,mBAAmB,GAAGC,iBAAW,CACpCC,MAA4C,IAAK;AAChD,IAAA,MAAMC,GAAG,GACPD,MAAM,CAACC,GAAG,IAAI,GAAGD,MAAM,CAACE,KAAK,CAACC,IAAI,CAAIH,CAAAA,EAAAA,MAAM,CAACE,KAAK,CAACE,SAAS,CAAE,CAAA,CAAA;AAChE,IAAA,MAAMC,gBAAgB,GAAG1B,GAAG,GAAG,CAAC,IAAIgB,eAAe,GAAG,CAAC,IAAIT,OAAO,GAAG,CAAC,CAAA;IACtE,MAAMoB,UAAU,GAAGN,MAAM,CAACE,KAAK,CAACI,UAAU,IAAID,gBAAgB,CAAA;AAC9D,IAAA,oBAAOT,KAAK,CAACW,YAAY,CAACP,MAAM,EAAE;MAAEC,GAAG;AAAEK,MAAAA,UAAAA;AAAW,KAAC,CAAC,CAAA;GACvD,EACD,CAACX,eAAe,EAAEhB,GAAG,EAAEO,OAAO,CAChC,CAAC,CAAA;AAED,EAAA,MAAMsB,mBAAmB,GAAGC,aAAO,CAAC,MAAM;IACxC,OAAOb,KAAK,CAACC,QAAQ,CAACa,OAAO,CAACpB,QAAQ,CAAC,CACpCqB,KAAK,CAAC,CAAC,EAAEhC,GAAG,CAAC,CACbiC,GAAG,CAAC,CAACZ,MAAM,EAAEa,OAAK,EAAEC,GAAG,KAAK;AAC3B,MAAA,IAAI,eAAClB,KAAK,CAACmB,cAAc,CAAmBf,MAAM,CAAC,EAAE;AACnD,QAAA,OAAO,IAAI,CAAA;AACb,OAAA;AAEA,MAAA,MAAMgB,aAAa,GAAGlB,mBAAmB,CAACE,MAAM,CAAC,CAAA;MAEjD,IAAI,CAACiB,iBAAW,CAACH,GAAG,EAAED,OAAK,CAAC,IAAIlB,eAAe,IAAIhB,GAAG,EAAE;AACtD,QAAA,OAAOqC,aAAa,CAAA;AACtB,OAAA;MAEA,IAAI7B,YAAY,KAAK,MAAM,EAAE;QAC3B,oBACES,KAAA,CAAAsB,aAAA,CAAA,KAAA,EAAA;AACEjB,UAAAA,GAAG,EAAC,UAAU;UACdZ,SAAS,EAAE8B,0BAAM,CAACC,yBAA0B;UAC5C,aAAa5C,EAAAA,kCAAAA;AAAmC,SAAA,eAEhDoB,KAAA,CAAAsB,aAAA,CAACG,iCAAgB,EAAA;AACfC,UAAAA,YAAY,EAAE7B,oBAAqB;AACnC8B,UAAAA,eAAe,EAAC,+BAA+B;UAC/ClC,SAAS,EAAE8B,0BAAM,CAACK,kBAAAA;AAAmB,SAAA,eAErC5B,KAAA,CAAAsB,aAAA,CAACO,SAAI,EAAA;AACHC,UAAAA,MAAM,EAAEC,oBAAS;AACjB7C,UAAAA,IAAI,EAAED,iBAAiB,CAACC,IAAI,CAAE;AAC9B8C,UAAAA,KAAK,EAAC,2BAAA;AAA2B,SAClC,CACe,CAAC,EAClBZ,aACE,CAAC,CAAA;AAEV,OAAA;MAEA,IAAI7B,YAAY,KAAK,OAAO,EAAE;AAC5B,QAAA,oBACES,KAAA,CAAAsB,aAAA,CAACtB,KAAK,CAACiC,QAAQ,EAAA;AAAC5B,UAAAA,GAAG,EAAC,UAAA;AAAU,SAAA,EAC3Be,aAAa,eACdpB,KAAA,CAAAsB,aAAA,CAAA,KAAA,EAAA;AACE9B,UAAAA,KAAK,EACH;YACE,8BAA8B,EAAE0C,QAAE,CAChCC,IAAI,CAACpD,GAAG,CAACO,OAAO,EAAEX,4BAA4B,CAChD,CAAA;WAEH;AACDc,UAAAA,SAAS,EAAE2C,aAAU,CAACb,0BAAM,CAACc,0BAA0B,CAAA;AAAE,SAAA,eAEzDrC,KAAA,CAAAsB,aAAA,CAACgB,SAAI,EAAA;AACHC,UAAAA,IAAI,EAAEpD,iBAAiB,CAACD,IAAI,CAAE;AAC9B8C,UAAAA,KAAK,EAAC,gBAAgB;UACtBvC,SAAS,EAAE8B,0BAAM,CAACiB,mBAAAA;SAEjB3D,EAAAA,0BAA0B,CAACkB,eAAe,EAAEhB,GAAG,CAC5C,CACH,CACS,CAAC,CAAA;AAErB,OAAA;AAEA,MAAA,OAAO,IAAI,CAAA;AACb,KAAC,CAAC,CAAA;AACN,GAAC,EAAE,CACDgB,eAAe,EACfhB,GAAG,EACHW,QAAQ,EACRQ,mBAAmB,EACnBX,YAAY,EACZM,oBAAoB,EACpBX,IAAI,EACJI,OAAO,CACR,CAAC,CAAA;AAEF,EAAA,oBACEU,KAAA,CAAAsB,aAAA,CAAChD,0BAA0B,EAAA;IACzBmE,KAAK,EAAE5B,aAAO,CACZ,OAAO;AACL3B,MAAAA,IAAAA;AACF,KAAC,CAAC,EACF,CAACA,IAAI,CACP,CAAA;AAAE,GAAA,eAEFc,KAAA,CAAAsB,aAAA,CAAAoB,KAAAA,EAAAA,MAAA,CAAAC,MAAA,CAAA;AACEC,IAAAA,IAAI,EAAC,OAAO;AACZC,IAAAA,GAAG,EAAEjD,YAAa;AAClBH,IAAAA,SAAS,EAAE2C,aAAU,CACnBb,0BAAM,CAACnC,WAAW,EAClBmC,0BAAM,CAAC,QAAQrC,IAAI,CAAA,CAAE,CAAC,EACtBO,SACF,CAAE;AACFD,IAAAA,KAAK,EACH;AACE,MAAA,0BAA0B,EAAE0C,QAAE,CAAC5C,OAAO,CAAC;MACvC,GAAGE,OAAAA;AACL,KAAA;AACD,GAAA,EACGG,IAAI,CAAA,EAEPiB,mBACE,CACqB,CAAC,CAAA;AAEjC,CACF;;;;;;"}
+{"version":3,"file":"AvatarGroup.js","sources":["../../../../src/components/AlphaAvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useMemo } from 'react'\n\nimport { MoreIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { isLastIndex } from '~/src/utils/array'\nimport { px } from '~/src/utils/style'\n\nimport {\n  type AlphaAvatarProps,\n  type AlphaAvatarSize,\n  useAlphaAvatarRadiusToken,\n} from '~/src/components/AlphaAvatar'\nimport { AvatarContextProvider } from '~/src/components/AlphaAvatar/AvatarSizeContext'\nimport { Icon } from '~/src/components/Icon'\nimport { SmoothCornersBox } from '~/src/components/SmoothCornersBox'\nimport { Text } from '~/src/components/Text'\n\nimport { type AvatarGroupProps } from './AvatarGroup.types'\n\nimport styles from './AvatarGroup.module.scss'\n\nconst MAX_AVATAR_LIST_COUNT = 99\nconst AVATAR_GROUP_DEFAULT_SPACING = 4\nexport const AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID =\n  'bezier-avatar-group-ellipsis-icon'\n\nfunction getRestAvatarListCountText(count: number, max: number) {\n  const restCount = count - max\n  return `+${restCount > MAX_AVATAR_LIST_COUNT ? MAX_AVATAR_LIST_COUNT : restCount}`\n}\n\n// TODO: Not specified\nfunction getProperIconSize(size: AlphaAvatarSize) {\n  return (\n    {\n      16: 'xxs',\n      20: 'xxs',\n      24: 'xs',\n      30: 's',\n      36: 'm',\n      42: 'm',\n      48: 'l',\n      72: 'l',\n      90: 'l',\n      120: 'l',\n    } as const\n  )[size]\n}\n\n// TODO: Not specified\nfunction getProperTypoSize(size: AlphaAvatarSize) {\n  return (\n    {\n      16: '12',\n      20: '12',\n      24: '13',\n      30: '15',\n      36: '16',\n      42: '18',\n      48: '24',\n      72: '24',\n      90: '24',\n      120: '24',\n    } as const\n  )[size]\n}\n\n/**\n * `AvatarGroup` is a component for grouping `Avatar` components\n * @example\n *\n * ```tsx\n * <AvatarGroup\n *  max={2}\n *  size=\"24\"\n *  spacing={4}\n *  ellipsisType=\"icon\"\n * >\n *    <Avatar />\n *    <Avatar />\n *    <Avatar />\n * </AvatarGroup>\n * ```\n */\nexport const AvatarGroup = forwardRef<HTMLDivElement, AvatarGroupProps>(\n  function AvatarGroup(\n    {\n      max = 5,\n      size = '24',\n      spacing = AVATAR_GROUP_DEFAULT_SPACING,\n      ellipsisType = 'icon',\n      style,\n      className,\n      children,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const AVATAR_BORDER_RADIUS = useAlphaAvatarRadiusToken()\n    const avatarListCount = React.Children.count(children)\n\n    const renderAvatarElement = useCallback(\n      (avatar: React.ReactElement<AlphaAvatarProps>) => {\n        const key =\n          avatar.key ?? `${avatar.props.name}-${avatar.props.avatarUrl}`\n        const shouldShowBorder = max > 1 && avatarListCount > 1 && spacing < 0\n        const showBorder = avatar.props.showBorder || shouldShowBorder\n        return React.cloneElement(avatar, { key, showBorder })\n      },\n      [avatarListCount, max, spacing]\n    )\n\n    const AvatarListComponent = useMemo(() => {\n      return React.Children.toArray(children)\n        .slice(0, max)\n        .map((avatar, index, arr) => {\n          if (!React.isValidElement<AlphaAvatarProps>(avatar)) {\n            return null\n          }\n\n          const AvatarElement = renderAvatarElement(avatar)\n\n          if (!isLastIndex(arr, index) || avatarListCount <= max) {\n            return AvatarElement\n          }\n\n          if (ellipsisType === 'icon') {\n            return (\n              <div\n                key=\"ellipsis\"\n                className={styles.AvatarEllipsisIconWrapper}\n                data-testid={AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID}\n              >\n                <SmoothCornersBox\n                  borderRadius={AVATAR_BORDER_RADIUS}\n                  backgroundColor=\"bgtxt-absolute-black-lightest\"\n                  className={styles.AvatarEllipsisIcon}\n                >\n                  <Icon\n                    source={MoreIcon}\n                    size={getProperIconSize(size)}\n                    color=\"bgtxt-absolute-white-dark\"\n                  />\n                </SmoothCornersBox>\n                {AvatarElement}\n              </div>\n            )\n          }\n\n          if (ellipsisType === 'count') {\n            return (\n              <React.Fragment key=\"ellipsis\">\n                {AvatarElement}\n                <div\n                  style={\n                    {\n                      '--b-avatar-group-ellipsis-ml': px(\n                        Math.max(spacing, AVATAR_GROUP_DEFAULT_SPACING)\n                      ),\n                    } as React.CSSProperties\n                  }\n                  className={classNames(styles.AvatarEllipsisCountWrapper)}\n                >\n                  <Text\n                    typo={getProperTypoSize(size)}\n                    color=\"txt-black-dark\"\n                    className={styles.AvatarEllipsisCount}\n                  >\n                    {getRestAvatarListCountText(avatarListCount, max)}\n                  </Text>\n                </div>\n              </React.Fragment>\n            )\n          }\n\n          return null\n        })\n    }, [\n      avatarListCount,\n      max,\n      children,\n      renderAvatarElement,\n      ellipsisType,\n      AVATAR_BORDER_RADIUS,\n      size,\n      spacing,\n    ])\n\n    return (\n      <AvatarContextProvider\n        value={useMemo(\n          () => ({\n            size,\n          }),\n          [size]\n        )}\n      >\n        <div\n          role=\"group\"\n          ref={forwardedRef}\n          className={classNames(\n            styles.AvatarGroup,\n            styles[`size-${size}`],\n            className\n          )}\n          style={\n            {\n              '--b-avatar-group-spacing': px(spacing),\n              ...style,\n            } as React.CSSProperties\n          }\n          {...rest}\n        >\n          {AvatarListComponent}\n        </div>\n      </AvatarContextProvider>\n    )\n  }\n)\n"],"names":["MAX_AVATAR_LIST_COUNT","AVATAR_GROUP_DEFAULT_SPACING","AVATAR_GROUP_ELLIPSIS_ICON_TEST_ID","getRestAvatarListCountText","count","max","restCount","getProperIconSize","size","getProperTypoSize","AvatarGroup","forwardRef","spacing","ellipsisType","style","className","children","rest","forwardedRef","AVATAR_BORDER_RADIUS","useAlphaAvatarRadiusToken","avatarListCount","React","Children","renderAvatarElement","useCallback","avatar","key","props","name","avatarUrl","shouldShowBorder","showBorder","cloneElement","AvatarListComponent","useMemo","toArray","slice","map","index","arr","isValidElement","AvatarElement","isLastIndex","createElement","styles","AvatarEllipsisIconWrapper","SmoothCornersBox","borderRadius","backgroundColor","AvatarEllipsisIcon","Icon","source","MoreIcon","color","Fragment","px","Math","classNames","AvatarEllipsisCountWrapper","Text","typo","AvatarEllipsisCount","AvatarContextProvider","value","Object","assign","role","ref"],"mappings":"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"}

package/dist/cjs/components/AlphaButton/Button.js

@@ -5,7 +5,7 @@ var bezierIcons = require('@channel.io/bezier-icons');
 var index = require('../../node_modules/classnames/index.js');
 var Button_module = require('./Button.module.scss.js');
 var Text = require('../Text/Text.js');
-var Spinner = require('../Spinner/Spinner.js');
+var Spinner = require('../AlphaSpinner/Spinner.js');
 var BaseButton = require('../BaseButton/BaseButton.js');
 var Icon = require('../Icon/Icon.js');
 
@@ -28,15 +28,6 @@ function getIconSize(size) {
     xl: 'm'
   }[size];
 }
-function getSpinnerSize(size) {
-  return {
-    xs: 'xs',
-    s: 'xs',
-    m: 's',
-    l: 's',
-    xl: 's'
-  }[size];
-}
 function getTypography(size) {
   return {
     xs: '13',
@@ -76,9 +67,10 @@ const Button = /*#__PURE__*/React.forwardRef(function Button({
     size: getIconSize(size),
     content: suffixContent
   })), loading && /*#__PURE__*/React.createElement("div", {
-    className: Button_module.default.ButtonLoader
+    className: index.default(Button_module.default.ButtonLoader, Button_module.default[`size-${getIconSize(size)}`])
   }, /*#__PURE__*/React.createElement(Spinner.Spinner, {
-    size: getSpinnerSize(size)
+    className: Button_module.default.Spinner,
+    variant: "on-overlay"
   })));
 });
 

package/dist/cjs/components/AlphaButton/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../src/components/AlphaButton/Button.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport {\n  type ButtonProps,\n  type ButtonSize,\n} from '~/src/components/AlphaButton/Button.types'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Icon, type IconSize } from '~/src/components/Icon'\nimport { Spinner } from '~/src/components/Spinner'\nimport { Text } from '~/src/components/Text'\n\nimport styles from './Button.module.scss'\n\nfunction SideContent({\n  size,\n  content,\n}: {\n  size: IconSize\n  content?: ButtonProps['prefixContent']\n}) {\n  return isBezierIcon(content) ? (\n    <Icon\n      source={content}\n      size={size}\n      className={styles.ButtonIcon}\n    />\n  ) : (\n    content\n  )\n}\n\nfunction getIconSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nfunction getSpinnerSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 's',\n    } as const\n  )[size]\n}\n\nfunction getTypography(size: ButtonSize) {\n  return (\n    {\n      xs: '13',\n      s: '13',\n      m: '14',\n      l: '15',\n      xl: '18',\n    } as const\n  )[size]\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(\n    {\n      as = BaseButton,\n      text,\n      prefixContent,\n      suffixContent,\n      color = 'blue',\n      variant = 'primary',\n      size = 'm',\n      active,\n      className,\n      loading,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const Comp = as as typeof BaseButton\n\n    return (\n      <Comp\n        ref={forwardedRef}\n        className={classNames(\n          styles.Button,\n          styles[`size-${size}`],\n          styles[`variant-${variant}`],\n          styles[`color-${color}`],\n          active && styles.active,\n          className\n        )}\n        {...rest}\n      >\n        <div\n          className={classNames(\n            styles.ButtonContent,\n            loading && styles.loading\n          )}\n        >\n          <SideContent\n            size={getIconSize(size)}\n            content={prefixContent}\n          />\n\n          {/* TODO: use AlphaText later, add typo */}\n          <Text\n            className={styles.ButtonText}\n            typo={getTypography(size)}\n            bold\n          >\n            {text}\n          </Text>\n\n          <SideContent\n            size={getIconSize(size)}\n            content={suffixContent}\n          />\n        </div>\n\n        {/* TODO: use AlphaSpinner */}\n        {loading && (\n          <div className={styles.ButtonLoader}>\n            <Spinner size={getSpinnerSize(size)} />\n          </div>\n        )}\n      </Comp>\n    )\n  }\n)\n"],"names":["SideContent","size","content","isBezierIcon","React","createElement","Icon","source","className","styles","ButtonIcon","getIconSize","xs","s","m","l","xl","getSpinnerSize","getTypography","Button","forwardRef","as","BaseButton","text","prefixContent","suffixContent","color","variant","active","loading","rest","forwardedRef","Comp","Object","assign","ref","classNames","ButtonContent","Text","ButtonText","typo","bold","ButtonLoader","Spinner"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../../src/components/AlphaButton/Button.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport {\n  type ButtonProps,\n  type ButtonSize,\n} from '~/src/components/AlphaButton/Button.types'\nimport { AlphaSpinner } from '~/src/components/AlphaSpinner'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Icon, type IconSize } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport styles from './Button.module.scss'\n\nfunction SideContent({\n  size,\n  content,\n}: {\n  size: IconSize\n  content?: ButtonProps['prefixContent']\n}) {\n  return isBezierIcon(content) ? (\n    <Icon\n      source={content}\n      size={size}\n      className={styles.ButtonIcon}\n    />\n  ) : (\n    content\n  )\n}\n\nfunction getIconSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nfunction getTypography(size: ButtonSize) {\n  return (\n    {\n      xs: '13',\n      s: '13',\n      m: '14',\n      l: '15',\n      xl: '18',\n    } as const\n  )[size]\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  function Button(\n    {\n      as = BaseButton,\n      text,\n      prefixContent,\n      suffixContent,\n      color = 'blue',\n      variant = 'primary',\n      size = 'm',\n      active,\n      className,\n      loading,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const Comp = as as typeof BaseButton\n\n    return (\n      <Comp\n        ref={forwardedRef}\n        className={classNames(\n          styles.Button,\n          styles[`size-${size}`],\n          styles[`variant-${variant}`],\n          styles[`color-${color}`],\n          active && styles.active,\n          className\n        )}\n        {...rest}\n      >\n        <div\n          className={classNames(\n            styles.ButtonContent,\n            loading && styles.loading\n          )}\n        >\n          <SideContent\n            size={getIconSize(size)}\n            content={prefixContent}\n          />\n\n          {/* TODO: use AlphaText later, add typo */}\n          <Text\n            className={styles.ButtonText}\n            typo={getTypography(size)}\n            bold\n          >\n            {text}\n          </Text>\n\n          <SideContent\n            size={getIconSize(size)}\n            content={suffixContent}\n          />\n        </div>\n\n        {loading && (\n          <div\n            className={classNames(\n              styles.ButtonLoader,\n              styles[`size-${getIconSize(size)}`]\n            )}\n          >\n            <AlphaSpinner\n              className={styles.Spinner}\n              variant=\"on-overlay\"\n            />\n          </div>\n        )}\n      </Comp>\n    )\n  }\n)\n"],"names":["SideContent","size","content","isBezierIcon","React","createElement","Icon","source","className","styles","ButtonIcon","getIconSize","xs","s","m","l","xl","getTypography","Button","forwardRef","as","BaseButton","text","prefixContent","suffixContent","color","variant","active","loading","rest","forwardedRef","Comp","Object","assign","ref","classNames","ButtonContent","Text","ButtonText","typo","bold","ButtonLoader","AlphaSpinner","Spinner"],"mappings":";;;;;;;;;;;AAgBA,SAASA,WAAWA,CAAC;EACnBC,IAAI;AACJC,EAAAA,OAAAA;AAIF,CAAC,EAAE;EACD,OAAOC,wBAAY,CAACD,OAAO,CAAC,gBAC1BE,KAAA,CAAAC,aAAA,CAACC,SAAI,EAAA;AACHC,IAAAA,MAAM,EAAEL,OAAQ;AAChBD,IAAAA,IAAI,EAAEA,IAAK;IACXO,SAAS,EAAEC,qBAAM,CAACC,UAAAA;GACnB,CAAC,GAEFR,OACD,CAAA;AACH,CAAA;AAEA,SAASS,WAAWA,CAACV,IAAgB,EAAE;EACrC,OACE;AACEW,IAAAA,EAAE,EAAE,KAAK;AACTC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,EAAE,EAAE,GAAA;GACL,CACDf,IAAI,CAAC,CAAA;AACT,CAAA;AAEA,SAASgB,aAAaA,CAAChB,IAAgB,EAAE;EACvC,OACE;AACEW,IAAAA,EAAE,EAAE,IAAI;AACRC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,EAAE,EAAE,IAAA;GACL,CACDf,IAAI,CAAC,CAAA;AACT,CAAA;MAEaiB,MAAM,gBAAGC,gBAAU,CAC9B,SAASD,MAAMA,CACb;AACEE,EAAAA,EAAE,GAAGC,qBAAU;EACfC,IAAI;EACJC,aAAa;EACbC,aAAa;AACbC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBzB,EAAAA,IAAI,GAAG,GAAG;EACV0B,MAAM;EACNnB,SAAS;EACToB,OAAO;EACP,GAAGC,IAAAA;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGX,EAAuB,CAAA;EAEpC,oBACEhB,KAAA,CAAAC,aAAA,CAAC0B,IAAI,EAAAC,MAAA,CAAAC,MAAA,CAAA;AACHC,IAAAA,GAAG,EAAEJ,YAAa;AAClBtB,IAAAA,SAAS,EAAE2B,aAAU,CACnB1B,qBAAM,CAACS,MAAM,EACbT,qBAAM,CAAC,QAAQR,IAAI,CAAA,CAAE,CAAC,EACtBQ,qBAAM,CAAC,CAAA,QAAA,EAAWiB,OAAO,CAAA,CAAE,CAAC,EAC5BjB,qBAAM,CAAC,SAASgB,KAAK,CAAA,CAAE,CAAC,EACxBE,MAAM,IAAIlB,qBAAM,CAACkB,MAAM,EACvBnB,SACF,CAAA;AAAE,GAAA,EACEqB,IAAI,CAAA,eAERzB,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEG,SAAS,EAAE2B,aAAU,CACnB1B,qBAAM,CAAC2B,aAAa,EACpBR,OAAO,IAAInB,qBAAM,CAACmB,OACpB,CAAA;AAAE,GAAA,eAEFxB,KAAA,CAAAC,aAAA,CAACL,WAAW,EAAA;AACVC,IAAAA,IAAI,EAAEU,WAAW,CAACV,IAAI,CAAE;AACxBC,IAAAA,OAAO,EAAEqB,aAAAA;AAAc,GACxB,CAAC,eAGFnB,KAAA,CAAAC,aAAA,CAACgC,SAAI,EAAA;IACH7B,SAAS,EAAEC,qBAAM,CAAC6B,UAAW;AAC7BC,IAAAA,IAAI,EAAEtB,aAAa,CAAChB,IAAI,CAAE;IAC1BuC,IAAI,EAAA,IAAA;AAAA,GAAA,EAEHlB,IACG,CAAC,eAEPlB,KAAA,CAAAC,aAAA,CAACL,WAAW,EAAA;AACVC,IAAAA,IAAI,EAAEU,WAAW,CAACV,IAAI,CAAE;AACxBC,IAAAA,OAAO,EAAEsB,aAAAA;AAAc,GACxB,CACE,CAAC,EAELI,OAAO,iBACNxB,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEG,IAAAA,SAAS,EAAE2B,aAAU,CACnB1B,qBAAM,CAACgC,YAAY,EACnBhC,qBAAM,CAAC,QAAQE,WAAW,CAACV,IAAI,CAAC,EAAE,CACpC,CAAA;AAAE,GAAA,eAEFG,KAAA,CAAAC,aAAA,CAACqC,eAAY,EAAA;IACXlC,SAAS,EAAEC,qBAAM,CAACkC,OAAQ;AAC1BjB,IAAAA,OAAO,EAAC,YAAA;GACT,CACE,CAEH,CAAC,CAAA;AAEX,CACF;;;;"}

package/dist/cjs/components/AlphaButton/Button.module.scss.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"Button":"b-Bu63w","size-xs":"b-dMl6r","ButtonText":"b-Xr8t8","size-s":"b-FZTyp","ButtonContent":"b-nSti0","size-m":"b-Tenxe","size-l":"b-IJLB6","size-xl":"b-xKsUH","variant-primary":"b-ohV3j","color-blue":"b-EL8PY","color-cobalt":"b--YAo9","color-red":"b-EAdoN","color-orange":"b-k-FfG","color-green":"b-REP7x","color-pink":"b-dkbxj","color-purple":"b-k3Z8M","color-dark-grey":"b-BudYM","color-light-grey":"b-eO-XU","variant-secondary":"b-l8-bH","variant-tertiary":"b-PB-TW","ButtonIcon":"b-HX6lq","color-white":"b-x9nmp","active":"b-Y2foo","ButtonLoader":"b-TRaYF","loading":"b-rUXJx"};
+var styles = {"Icon":"b--FZGN","size-xxxs":"b-o9swE","size-xxs":"b-xlhxz","size-xs":"b-dMl6r","size-s":"b-FZTyp","size-m":"b-Tenxe","size-l":"b-IJLB6","size-xl":"b-xKsUH","Button":"b-Bu63w","ButtonText":"b-Xr8t8","ButtonContent":"b-nSti0","variant-primary":"b-ohV3j","color-blue":"b-EL8PY","color-cobalt":"b--YAo9","color-red":"b-EAdoN","color-orange":"b-k-FfG","color-green":"b-REP7x","color-pink":"b-dkbxj","color-purple":"b-k3Z8M","color-dark-grey":"b-BudYM","color-light-grey":"b-eO-XU","color-white":"b-x9nmp","variant-secondary":"b-l8-bH","variant-tertiary":"b-PB-TW","ButtonIcon":"b-HX6lq","active":"b-Y2foo","ButtonLoader":"b-TRaYF","loading":"b-rUXJx","Spinner":"b-97gyD"};
 
 exports.default = styles;
 //# sourceMappingURL=Button.module.scss.js.map

package/dist/cjs/components/AlphaFloatingButton/FloatingButton.js

@@ -5,7 +5,7 @@ var bezierIcons = require('@channel.io/bezier-icons');
 var index = require('../../node_modules/classnames/index.js');
 var FloatingButton_module = require('./FloatingButton.module.scss.js');
 var Text = require('../Text/Text.js');
-var Spinner = require('../Spinner/Spinner.js');
+var Spinner = require('../AlphaSpinner/Spinner.js');
 var BaseButton = require('../BaseButton/BaseButton.js');
 var Icon = require('../Icon/Icon.js');
 
@@ -28,15 +28,6 @@ function getIconSize(size) {
     xl: 'm'
   }[size];
 }
-function getSpinnerSize(size) {
-  return {
-    xs: 'xs',
-    s: 'xs',
-    m: 's',
-    l: 's',
-    xl: 's'
-  }[size];
-}
 function getTypography(size) {
   return {
     xs: '13',
@@ -76,9 +67,10 @@ const FloatingButton = /*#__PURE__*/React.forwardRef(function Button({
     size: getIconSize(size),
     content: suffixContent
   })), loading && /*#__PURE__*/React.createElement("div", {
-    className: FloatingButton_module.default.ButtonLoader
+    className: index.default(FloatingButton_module.default.ButtonLoader, FloatingButton_module.default[`size-${getIconSize(size)}`])
   }, /*#__PURE__*/React.createElement(Spinner.Spinner, {
-    size: getSpinnerSize(size)
+    className: FloatingButton_module.default.Spinner,
+    variant: "on-overlay"
   })));
 });
 

package/dist/cjs/components/AlphaFloatingButton/FloatingButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingButton.js","sources":["../../../../src/components/AlphaFloatingButton/FloatingButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport {\n  type FloatingButtonProps,\n  type FloatingButtonSize,\n} from '~/src/components/AlphaFloatingButton/FloatingButton.types'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Icon, type IconSize } from '~/src/components/Icon'\nimport { Spinner } from '~/src/components/Spinner'\nimport { Text } from '~/src/components/Text'\n\nimport styles from './FloatingButton.module.scss'\n\nfunction SideContent({\n  size,\n  content,\n}: {\n  size: IconSize\n  content?: FloatingButtonProps['prefixContent']\n}) {\n  return isBezierIcon(content) ? (\n    <Icon\n      source={content}\n      size={size}\n      className={styles.ButtonIcon}\n    />\n  ) : (\n    content\n  )\n}\n\nfunction getIconSize(size: FloatingButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nfunction getSpinnerSize(size: FloatingButtonSize) {\n  return (\n    {\n      xs: 'xs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 's',\n    } as const\n  )[size]\n}\n\nfunction getTypography(size: FloatingButtonSize) {\n  return (\n    {\n      xs: '13',\n      s: '13',\n      m: '14',\n      l: '15',\n      xl: '18',\n    } as const\n  )[size]\n}\n\nexport const FloatingButton = forwardRef<\n  HTMLButtonElement,\n  FloatingButtonProps\n>(function Button(\n  {\n    as = BaseButton,\n    text,\n    prefixContent,\n    suffixContent,\n    color = 'blue',\n    variant = 'primary',\n    size = 'm',\n    active,\n    className,\n    loading,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n\n  return (\n    <Comp\n      ref={forwardedRef}\n      className={classNames(\n        styles.FloatingButton,\n        styles[`size-${size}`],\n        styles[`variant-${variant}`],\n        styles[`color-${color}`],\n        active && styles.active,\n        className\n      )}\n      {...rest}\n    >\n      <div\n        className={classNames(styles.ButtonContent, loading && styles.loading)}\n      >\n        <SideContent\n          size={getIconSize(size)}\n          content={prefixContent}\n        />\n\n        {/* TODO: use AlphaText later, add typo */}\n        <Text\n          className={styles.ButtonText}\n          typo={getTypography(size)}\n          bold\n        >\n          {text}\n        </Text>\n\n        <SideContent\n          size={getIconSize(size)}\n          content={suffixContent}\n        />\n      </div>\n\n      {/* TODO: use AlphaSpinner */}\n      {loading && (\n        <div className={styles.ButtonLoader}>\n          <Spinner size={getSpinnerSize(size)} />\n        </div>\n      )}\n    </Comp>\n  )\n})\n"],"names":["SideContent","size","content","isBezierIcon","React","createElement","Icon","source","className","styles","ButtonIcon","getIconSize","xs","s","m","l","xl","getSpinnerSize","getTypography","FloatingButton","forwardRef","Button","as","BaseButton","text","prefixContent","suffixContent","color","variant","active","loading","rest","forwardedRef","Comp","Object","assign","ref","classNames","ButtonContent","Text","ButtonText","typo","bold","ButtonLoader","Spinner"],"mappings":"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"}
+{"version":3,"file":"FloatingButton.js","sources":["../../../../src/components/AlphaFloatingButton/FloatingButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport {\n  type FloatingButtonProps,\n  type FloatingButtonSize,\n} from '~/src/components/AlphaFloatingButton/FloatingButton.types'\nimport { AlphaSpinner } from '~/src/components/AlphaSpinner'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Icon, type IconSize } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport styles from './FloatingButton.module.scss'\n\nfunction SideContent({\n  size,\n  content,\n}: {\n  size: IconSize\n  content?: FloatingButtonProps['prefixContent']\n}) {\n  return isBezierIcon(content) ? (\n    <Icon\n      source={content}\n      size={size}\n      className={styles.ButtonIcon}\n    />\n  ) : (\n    content\n  )\n}\n\nfunction getIconSize(size: FloatingButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nfunction getTypography(size: FloatingButtonSize) {\n  return (\n    {\n      xs: '13',\n      s: '13',\n      m: '14',\n      l: '15',\n      xl: '18',\n    } as const\n  )[size]\n}\n\nexport const FloatingButton = forwardRef<\n  HTMLButtonElement,\n  FloatingButtonProps\n>(function Button(\n  {\n    as = BaseButton,\n    text,\n    prefixContent,\n    suffixContent,\n    color = 'blue',\n    variant = 'primary',\n    size = 'm',\n    active,\n    className,\n    loading,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n\n  return (\n    <Comp\n      ref={forwardedRef}\n      className={classNames(\n        styles.FloatingButton,\n        styles[`size-${size}`],\n        styles[`variant-${variant}`],\n        styles[`color-${color}`],\n        active && styles.active,\n        className\n      )}\n      {...rest}\n    >\n      <div\n        className={classNames(styles.ButtonContent, loading && styles.loading)}\n      >\n        <SideContent\n          size={getIconSize(size)}\n          content={prefixContent}\n        />\n\n        {/* TODO: use AlphaText later, add typo */}\n        <Text\n          className={styles.ButtonText}\n          typo={getTypography(size)}\n          bold\n        >\n          {text}\n        </Text>\n\n        <SideContent\n          size={getIconSize(size)}\n          content={suffixContent}\n        />\n      </div>\n\n      {loading && (\n        <div\n          className={classNames(\n            styles.ButtonLoader,\n            styles[`size-${getIconSize(size)}`]\n          )}\n        >\n          <AlphaSpinner\n            className={styles.Spinner}\n            variant=\"on-overlay\"\n          />\n        </div>\n      )}\n    </Comp>\n  )\n})\n"],"names":["SideContent","size","content","isBezierIcon","React","createElement","Icon","source","className","styles","ButtonIcon","getIconSize","xs","s","m","l","xl","getTypography","FloatingButton","forwardRef","Button","as","BaseButton","text","prefixContent","suffixContent","color","variant","active","loading","rest","forwardedRef","Comp","Object","assign","ref","classNames","ButtonContent","Text","ButtonText","typo","bold","ButtonLoader","AlphaSpinner","Spinner"],"mappings":"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"}

package/dist/cjs/components/AlphaFloatingButton/FloatingButton.module.scss.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"FloatingButton":"b-bYve2","size-xs":"b-QsWAB","ButtonText":"b-alAiF","size-s":"b-XpD2O","ButtonContent":"b-RUr-1","size-m":"b-o-cLI","size-l":"b-Hk5nU","size-xl":"b-k3y4r","variant-primary":"b-QmpYs","color-blue":"b-Us2nD","color-cobalt":"b-HbgqQ","color-red":"b-KNnPg","color-orange":"b-BuR0o","color-green":"b-e5qII","color-pink":"b-R5OJT","color-purple":"b-Qst2f","color-dark-grey":"b-s325E","color-light-grey":"b-88I-7","variant-secondary":"b-yEZ4V","ButtonIcon":"b--zoBE","active":"b-tMcpZ","ButtonLoader":"b-cOdoe","loading":"b-sFtLb"};
+var styles = {"Icon":"b-N1oNZ","size-xxxs":"b-SmyZ3","size-xxs":"b-f9TeV","size-xs":"b-QsWAB","size-s":"b-XpD2O","size-m":"b-o-cLI","size-l":"b-Hk5nU","size-xl":"b-k3y4r","FloatingButton":"b-bYve2","ButtonText":"b-alAiF","ButtonContent":"b-RUr-1","variant-primary":"b-QmpYs","color-blue":"b-Us2nD","color-cobalt":"b-HbgqQ","color-red":"b-KNnPg","color-orange":"b-BuR0o","color-green":"b-e5qII","color-pink":"b-R5OJT","color-purple":"b-Qst2f","color-dark-grey":"b-s325E","color-light-grey":"b-88I-7","variant-secondary":"b-yEZ4V","ButtonIcon":"b--zoBE","active":"b-tMcpZ","ButtonLoader":"b-cOdoe","loading":"b-sFtLb","Spinner":"b-vHNv3"};
 
 exports.default = styles;
 //# sourceMappingURL=FloatingButton.module.scss.js.map

package/dist/cjs/components/AlphaFloatingIconButton/FloatingIconButton.js

@@ -5,7 +5,7 @@ var bezierIcons = require('@channel.io/bezier-icons');
 var index = require('../../node_modules/classnames/index.js');
 var FloatingIconButton_module = require('./FloatingIconButton.module.scss.js');
 var Icon = require('../Icon/Icon.js');
-var Spinner = require('../Spinner/Spinner.js');
+var Spinner = require('../AlphaSpinner/Spinner.js');
 var BaseButton = require('../BaseButton/BaseButton.js');
 
 function getIconSize(size) {
@@ -17,15 +17,6 @@ function getIconSize(size) {
     xl: 'm'
   }[size];
 }
-function getSpinnerSize(size) {
-  return {
-    xs: 'xs',
-    s: 'xs',
-    m: 's',
-    l: 's',
-    xl: 's'
-  }[size];
-}
 const FloatingIconButton = /*#__PURE__*/React.forwardRef(function FloatingIconButton({
   as = BaseButton.BaseButton,
   color = 'blue',
@@ -47,9 +38,10 @@ const FloatingIconButton = /*#__PURE__*/React.forwardRef(function FloatingIconBu
     size: getIconSize(size),
     source: content
   }) : content), loading && /*#__PURE__*/React.createElement("div", {
-    className: FloatingIconButton_module.default.ButtonLoader
+    className: index.default(FloatingIconButton_module.default.ButtonLoader, FloatingIconButton_module.default[`size-${getIconSize(size)}`])
   }, /*#__PURE__*/React.createElement(Spinner.Spinner, {
-    size: getSpinnerSize(size)
+    className: FloatingIconButton_module.default.Spinner,
+    variant: "on-overlay"
   })));
 });
 

package/dist/cjs/components/AlphaFloatingIconButton/FloatingIconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingIconButton.js","sources":["../../../../src/components/AlphaFloatingIconButton/FloatingIconButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type AlphaFloatingIconButtonProps } from '~/src/components/AlphaFloatingIconButton'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { type ButtonSize } from '~/src/components/Button'\nimport { Icon } from '~/src/components/Icon'\nimport { Spinner } from '~/src/components/Spinner'\n\nimport styles from './FloatingIconButton.module.scss'\n\nfunction getIconSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nfunction getSpinnerSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 's',\n    } as const\n  )[size]\n}\n\nexport const FloatingIconButton = forwardRef<\n  HTMLButtonElement,\n  AlphaFloatingIconButtonProps\n>(function FloatingIconButton(\n  {\n    as = BaseButton,\n    color = 'blue',\n    variant = 'primary',\n    size = 'm',\n    active,\n    content,\n    loading,\n    className,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n\n  return (\n    <Comp\n      ref={forwardedRef}\n      className={classNames(\n        styles.FloatingIconButton,\n        styles[`size-${size}`],\n        styles[`variant-${variant}`],\n        styles[`color-${color}`],\n        active && styles.active,\n        className\n      )}\n      {...rest}\n    >\n      <div\n        className={classNames(styles.ButtonContent, loading && styles.loading)}\n      >\n        {isBezierIcon(content) ? (\n          <Icon\n            size={getIconSize(size)}\n            source={content}\n          />\n        ) : (\n          content\n        )}\n      </div>\n\n      {/* TODO: use AlphaSpinner */}\n      {loading && (\n        <div className={styles.ButtonLoader}>\n          <Spinner size={getSpinnerSize(size)} />\n        </div>\n      )}\n    </Comp>\n  )\n})\n"],"names":["getIconSize","size","xs","s","m","l","xl","getSpinnerSize","FloatingIconButton","forwardRef","as","BaseButton","color","variant","active","content","loading","className","rest","forwardedRef","Comp","React","createElement","Object","assign","ref","classNames","styles","ButtonContent","isBezierIcon","Icon","source","ButtonLoader","Spinner"],"mappings":";;;;;;;;;;AAaA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,OACE;AACEC,IAAAA,EAAE,EAAE,KAAK;AACTC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,EAAE,EAAE,GAAA;GACL,CACDL,IAAI,CAAC,CAAA;AACT,CAAA;AAEA,SAASM,cAAcA,CAACN,IAAgB,EAAE;EACxC,OACE;AACEC,IAAAA,EAAE,EAAE,IAAI;AACRC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,EAAE,EAAE,GAAA;GACL,CACDL,IAAI,CAAC,CAAA;AACT,CAAA;MAEaO,kBAAkB,gBAAGC,gBAAU,CAG1C,SAASD,kBAAkBA,CAC3B;AACEE,EAAAA,EAAE,GAAGC,qBAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBZ,EAAAA,IAAI,GAAG,GAAG;EACVa,MAAM;EACNC,OAAO;EACPC,OAAO;EACPC,SAAS;EACT,GAAGC,IAAAA;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGV,EAAuB,CAAA;EAEpC,oBACEW,KAAA,CAAAC,aAAA,CAACF,IAAI,EAAAG,MAAA,CAAAC,MAAA,CAAA;AACHC,IAAAA,GAAG,EAAEN,YAAa;AAClBF,IAAAA,SAAS,EAAES,aAAU,CACnBC,iCAAM,CAACnB,kBAAkB,EACzBmB,iCAAM,CAAC,QAAQ1B,IAAI,CAAA,CAAE,CAAC,EACtB0B,iCAAM,CAAC,CAAA,QAAA,EAAWd,OAAO,CAAA,CAAE,CAAC,EAC5Bc,iCAAM,CAAC,SAASf,KAAK,CAAA,CAAE,CAAC,EACxBE,MAAM,IAAIa,iCAAM,CAACb,MAAM,EACvBG,SACF,CAAA;AAAE,GAAA,EACEC,IAAI,CAAA,eAERG,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEL,SAAS,EAAES,aAAU,CAACC,iCAAM,CAACC,aAAa,EAAEZ,OAAO,IAAIW,iCAAM,CAACX,OAAO,CAAA;GAEpEa,EAAAA,wBAAY,CAACd,OAAO,CAAC,gBACpBM,KAAA,CAAAC,aAAA,CAACQ,SAAI,EAAA;AACH7B,IAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxB8B,IAAAA,MAAM,EAAEhB,OAAAA;GACT,CAAC,GAEFA,OAEC,CAAC,EAGLC,OAAO,iBACNK,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKL,SAAS,EAAEU,iCAAM,CAACK,YAAAA;AAAa,GAAA,eAClCX,KAAA,CAAAC,aAAA,CAACW,eAAO,EAAA;IAAChC,IAAI,EAAEM,cAAc,CAACN,IAAI,CAAA;GAAI,CACnC,CAEH,CAAC,CAAA;AAEX,CAAC;;;;"}
+{"version":3,"file":"FloatingIconButton.js","sources":["../../../../src/components/AlphaFloatingIconButton/FloatingIconButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type AlphaFloatingIconButtonProps } from '~/src/components/AlphaFloatingIconButton'\nimport { AlphaSpinner } from '~/src/components/AlphaSpinner'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { type ButtonSize } from '~/src/components/Button'\nimport { Icon } from '~/src/components/Icon'\n\nimport styles from './FloatingIconButton.module.scss'\n\nfunction getIconSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nexport const FloatingIconButton = forwardRef<\n  HTMLButtonElement,\n  AlphaFloatingIconButtonProps\n>(function FloatingIconButton(\n  {\n    as = BaseButton,\n    color = 'blue',\n    variant = 'primary',\n    size = 'm',\n    active,\n    content,\n    loading,\n    className,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n\n  return (\n    <Comp\n      ref={forwardedRef}\n      className={classNames(\n        styles.FloatingIconButton,\n        styles[`size-${size}`],\n        styles[`variant-${variant}`],\n        styles[`color-${color}`],\n        active && styles.active,\n        className\n      )}\n      {...rest}\n    >\n      <div\n        className={classNames(styles.ButtonContent, loading && styles.loading)}\n      >\n        {isBezierIcon(content) ? (\n          <Icon\n            size={getIconSize(size)}\n            source={content}\n          />\n        ) : (\n          content\n        )}\n      </div>\n\n      {loading && (\n        <div\n          className={classNames(\n            styles.ButtonLoader,\n            styles[`size-${getIconSize(size)}`]\n          )}\n        >\n          <AlphaSpinner\n            className={styles.Spinner}\n            variant=\"on-overlay\"\n          />\n        </div>\n      )}\n    </Comp>\n  )\n})\n"],"names":["getIconSize","size","xs","s","m","l","xl","FloatingIconButton","forwardRef","as","BaseButton","color","variant","active","content","loading","className","rest","forwardedRef","Comp","React","createElement","Object","assign","ref","classNames","styles","ButtonContent","isBezierIcon","Icon","source","ButtonLoader","AlphaSpinner","Spinner"],"mappings":";;;;;;;;;;AAaA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,OACE;AACEC,IAAAA,EAAE,EAAE,KAAK;AACTC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,EAAE,EAAE,GAAA;GACL,CACDL,IAAI,CAAC,CAAA;AACT,CAAA;MAEaM,kBAAkB,gBAAGC,gBAAU,CAG1C,SAASD,kBAAkBA,CAC3B;AACEE,EAAAA,EAAE,GAAGC,qBAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBX,EAAAA,IAAI,GAAG,GAAG;EACVY,MAAM;EACNC,OAAO;EACPC,OAAO;EACPC,SAAS;EACT,GAAGC,IAAAA;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGV,EAAuB,CAAA;EAEpC,oBACEW,KAAA,CAAAC,aAAA,CAACF,IAAI,EAAAG,MAAA,CAAAC,MAAA,CAAA;AACHC,IAAAA,GAAG,EAAEN,YAAa;AAClBF,IAAAA,SAAS,EAAES,aAAU,CACnBC,iCAAM,CAACnB,kBAAkB,EACzBmB,iCAAM,CAAC,QAAQzB,IAAI,CAAA,CAAE,CAAC,EACtByB,iCAAM,CAAC,CAAA,QAAA,EAAWd,OAAO,CAAA,CAAE,CAAC,EAC5Bc,iCAAM,CAAC,SAASf,KAAK,CAAA,CAAE,CAAC,EACxBE,MAAM,IAAIa,iCAAM,CAACb,MAAM,EACvBG,SACF,CAAA;AAAE,GAAA,EACEC,IAAI,CAAA,eAERG,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEL,SAAS,EAAES,aAAU,CAACC,iCAAM,CAACC,aAAa,EAAEZ,OAAO,IAAIW,iCAAM,CAACX,OAAO,CAAA;GAEpEa,EAAAA,wBAAY,CAACd,OAAO,CAAC,gBACpBM,KAAA,CAAAC,aAAA,CAACQ,SAAI,EAAA;AACH5B,IAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxB6B,IAAAA,MAAM,EAAEhB,OAAAA;GACT,CAAC,GAEFA,OAEC,CAAC,EAELC,OAAO,iBACNK,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEL,IAAAA,SAAS,EAAES,aAAU,CACnBC,iCAAM,CAACK,YAAY,EACnBL,iCAAM,CAAC,QAAQ1B,WAAW,CAACC,IAAI,CAAC,EAAE,CACpC,CAAA;AAAE,GAAA,eAEFmB,KAAA,CAAAC,aAAA,CAACW,eAAY,EAAA;IACXhB,SAAS,EAAEU,iCAAM,CAACO,OAAQ;AAC1BrB,IAAAA,OAAO,EAAC,YAAA;GACT,CACE,CAEH,CAAC,CAAA;AAEX,CAAC;;;;"}

package/dist/cjs/components/AlphaFloatingIconButton/FloatingIconButton.module.scss.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"FloatingIconButton":"b-pDR7b","size-xs":"b-u5Zl3","size-s":"b-3wbJg","size-m":"b-C7fAv","size-l":"b-FwA2i","size-xl":"b-VPiwI","variant-primary":"b-eSXS9","color-blue":"b-6Qpq3","color-cobalt":"b-dIPru","color-red":"b-wZj6M","color-orange":"b-Vb6Hw","color-green":"b-nSxKM","color-pink":"b-4raYA","color-purple":"b-ppJl-","color-dark-grey":"b-3T-00","color-light-grey":"b-lJzxe","variant-secondary":"b-Q-xex","active":"b-9pRbB","ButtonLoader":"b-hkZIN","ButtonContent":"b-8juuH","loading":"b-w7dD7"};
+var styles = {"Icon":"b-76vGa","size-xxxs":"b-m7Pmk","size-xxs":"b-g4122","size-xs":"b-u5Zl3","size-s":"b-3wbJg","size-m":"b-C7fAv","size-l":"b-FwA2i","size-xl":"b-VPiwI","FloatingIconButton":"b-pDR7b","variant-primary":"b-eSXS9","color-blue":"b-6Qpq3","color-cobalt":"b-dIPru","color-red":"b-wZj6M","color-orange":"b-Vb6Hw","color-green":"b-nSxKM","color-pink":"b-4raYA","color-purple":"b-ppJl-","color-dark-grey":"b-3T-00","color-light-grey":"b-lJzxe","variant-secondary":"b-Q-xex","active":"b-9pRbB","ButtonLoader":"b-hkZIN","ButtonContent":"b-8juuH","loading":"b-w7dD7","Spinner":"b-U9qSJ"};
 
 exports.default = styles;
 //# sourceMappingURL=FloatingIconButton.module.scss.js.map

package/dist/cjs/components/AlphaIconButton/IconButton.js

@@ -5,7 +5,7 @@ var bezierIcons = require('@channel.io/bezier-icons');
 var index = require('../../node_modules/classnames/index.js');
 var IconButton_module = require('./IconButton.module.scss.js');
 var Icon = require('../Icon/Icon.js');
-var Spinner = require('../Spinner/Spinner.js');
+var Spinner = require('../AlphaSpinner/Spinner.js');
 var BaseButton = require('../BaseButton/BaseButton.js');
 
 function getIconSize(size) {
@@ -17,15 +17,6 @@ function getIconSize(size) {
     xl: 'm'
   }[size];
 }
-function getSpinnerSize(size) {
-  return {
-    xs: 'xs',
-    s: 'xs',
-    m: 's',
-    l: 's',
-    xl: 's'
-  }[size];
-}
 const IconButton = /*#__PURE__*/React.forwardRef(function IconButton({
   as = BaseButton.BaseButton,
   color = 'blue',
@@ -49,9 +40,10 @@ const IconButton = /*#__PURE__*/React.forwardRef(function IconButton({
     source: content,
     className: IconButton_module.default.ButtonIcon
   }) : content), loading && /*#__PURE__*/React.createElement("div", {
-    className: IconButton_module.default.ButtonLoader
+    className: index.default(IconButton_module.default.ButtonLoader, IconButton_module.default[`size-${getIconSize(size)}`])
   }, /*#__PURE__*/React.createElement(Spinner.Spinner, {
-    size: getSpinnerSize(size)
+    className: IconButton_module.default.Spinner,
+    variant: "on-overlay"
   })));
 });
 

package/dist/cjs/components/AlphaIconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","sources":["../../../../src/components/AlphaIconButton/IconButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type AlphaIconButtonProps } from '~/src/components/AlphaIconButton'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { type ButtonSize } from '~/src/components/Button'\nimport { Icon } from '~/src/components/Icon'\nimport { Spinner } from '~/src/components/Spinner'\n\nimport styles from './IconButton.module.scss'\n\nfunction getIconSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nfunction getSpinnerSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 's',\n    } as const\n  )[size]\n}\n\nexport const IconButton = forwardRef<HTMLButtonElement, AlphaIconButtonProps>(\n  function IconButton(\n    {\n      as = BaseButton,\n      color = 'blue',\n      variant = 'primary',\n      size = 'm',\n      active,\n      shape = 'rectangle',\n      content,\n      loading,\n      className,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const Comp = as as typeof BaseButton\n\n    return (\n      <Comp\n        ref={forwardedRef}\n        className={classNames(\n          styles.IconButton,\n          styles[`size-${size}`],\n          styles[`variant-${variant}`],\n          styles[`color-${color}`],\n          styles[`shape-${shape}`],\n          active && styles.active,\n          className\n        )}\n        {...rest}\n      >\n        <div\n          className={classNames(\n            styles.ButtonContent,\n            loading && styles.loading\n          )}\n        >\n          {isBezierIcon(content) ? (\n            <Icon\n              size={getIconSize(size)}\n              source={content}\n              className={styles.ButtonIcon}\n            />\n          ) : (\n            content\n          )}\n        </div>\n\n        {/* TODO: use AlphaSpinner */}\n        {loading && (\n          <div className={styles.ButtonLoader}>\n            <Spinner size={getSpinnerSize(size)} />\n          </div>\n        )}\n      </Comp>\n    )\n  }\n)\n"],"names":["getIconSize","size","xs","s","m","l","xl","getSpinnerSize","IconButton","forwardRef","as","BaseButton","color","variant","active","shape","content","loading","className","rest","forwardedRef","Comp","React","createElement","Object","assign","ref","classNames","styles","ButtonContent","isBezierIcon","Icon","source","ButtonIcon","ButtonLoader","Spinner"],"mappings":";;;;;;;;;;AAaA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,OACE;AACEC,IAAAA,EAAE,EAAE,KAAK;AACTC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,EAAE,EAAE,GAAA;GACL,CACDL,IAAI,CAAC,CAAA;AACT,CAAA;AAEA,SAASM,cAAcA,CAACN,IAAgB,EAAE;EACxC,OACE;AACEC,IAAAA,EAAE,EAAE,IAAI;AACRC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,EAAE,EAAE,GAAA;GACL,CACDL,IAAI,CAAC,CAAA;AACT,CAAA;MAEaO,UAAU,gBAAGC,gBAAU,CAClC,SAASD,UAAUA,CACjB;AACEE,EAAAA,EAAE,GAAGC,qBAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBZ,EAAAA,IAAI,GAAG,GAAG;EACVa,MAAM;AACNC,EAAAA,KAAK,GAAG,WAAW;EACnBC,OAAO;EACPC,OAAO;EACPC,SAAS;EACT,GAAGC,IAAAA;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGX,EAAuB,CAAA;EAEpC,oBACEY,KAAA,CAAAC,aAAA,CAACF,IAAI,EAAAG,MAAA,CAAAC,MAAA,CAAA;AACHC,IAAAA,GAAG,EAAEN,YAAa;AAClBF,IAAAA,SAAS,EAAES,aAAU,CACnBC,yBAAM,CAACpB,UAAU,EACjBoB,yBAAM,CAAC,CAAQ3B,KAAAA,EAAAA,IAAI,EAAE,CAAC,EACtB2B,yBAAM,CAAC,CAAA,QAAA,EAAWf,OAAO,CAAE,CAAA,CAAC,EAC5Be,yBAAM,CAAC,CAAShB,MAAAA,EAAAA,KAAK,EAAE,CAAC,EACxBgB,yBAAM,CAAC,CAAA,MAAA,EAASb,KAAK,CAAE,CAAA,CAAC,EACxBD,MAAM,IAAIc,yBAAM,CAACd,MAAM,EACvBI,SACF,CAAA;AAAE,GAAA,EACEC,IAAI,CAAA,eAERG,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEL,SAAS,EAAES,aAAU,CACnBC,yBAAM,CAACC,aAAa,EACpBZ,OAAO,IAAIW,yBAAM,CAACX,OACpB,CAAA;GAECa,EAAAA,wBAAY,CAACd,OAAO,CAAC,gBACpBM,KAAA,CAAAC,aAAA,CAACQ,SAAI,EAAA;AACH9B,IAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxB+B,IAAAA,MAAM,EAAEhB,OAAQ;IAChBE,SAAS,EAAEU,yBAAM,CAACK,UAAAA;GACnB,CAAC,GAEFjB,OAEC,CAAC,EAGLC,OAAO,iBACNK,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKL,SAAS,EAAEU,yBAAM,CAACM,YAAAA;AAAa,GAAA,eAClCZ,KAAA,CAAAC,aAAA,CAACY,eAAO,EAAA;IAAClC,IAAI,EAAEM,cAAc,CAACN,IAAI,CAAA;GAAI,CACnC,CAEH,CAAC,CAAA;AAEX,CACF;;;;"}
+{"version":3,"file":"IconButton.js","sources":["../../../../src/components/AlphaIconButton/IconButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type AlphaIconButtonProps } from '~/src/components/AlphaIconButton'\nimport { AlphaSpinner } from '~/src/components/AlphaSpinner'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { type ButtonSize } from '~/src/components/Button'\nimport { Icon } from '~/src/components/Icon'\n\nimport styles from './IconButton.module.scss'\n\nfunction getIconSize(size: ButtonSize) {\n  return (\n    {\n      xs: 'xxs',\n      s: 'xs',\n      m: 's',\n      l: 's',\n      xl: 'm',\n    } as const\n  )[size]\n}\n\nexport const IconButton = forwardRef<HTMLButtonElement, AlphaIconButtonProps>(\n  function IconButton(\n    {\n      as = BaseButton,\n      color = 'blue',\n      variant = 'primary',\n      size = 'm',\n      active,\n      shape = 'rectangle',\n      content,\n      loading,\n      className,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const Comp = as as typeof BaseButton\n\n    return (\n      <Comp\n        ref={forwardedRef}\n        className={classNames(\n          styles.IconButton,\n          styles[`size-${size}`],\n          styles[`variant-${variant}`],\n          styles[`color-${color}`],\n          styles[`shape-${shape}`],\n          active && styles.active,\n          className\n        )}\n        {...rest}\n      >\n        <div\n          className={classNames(\n            styles.ButtonContent,\n            loading && styles.loading\n          )}\n        >\n          {isBezierIcon(content) ? (\n            <Icon\n              size={getIconSize(size)}\n              source={content}\n              className={styles.ButtonIcon}\n            />\n          ) : (\n            content\n          )}\n        </div>\n\n        {loading && (\n          <div\n            className={classNames(\n              styles.ButtonLoader,\n              styles[`size-${getIconSize(size)}`]\n            )}\n          >\n            <AlphaSpinner\n              className={styles.Spinner}\n              variant=\"on-overlay\"\n            />\n          </div>\n        )}\n      </Comp>\n    )\n  }\n)\n"],"names":["getIconSize","size","xs","s","m","l","xl","IconButton","forwardRef","as","BaseButton","color","variant","active","shape","content","loading","className","rest","forwardedRef","Comp","React","createElement","Object","assign","ref","classNames","styles","ButtonContent","isBezierIcon","Icon","source","ButtonIcon","ButtonLoader","AlphaSpinner","Spinner"],"mappings":";;;;;;;;;;AAaA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,OACE;AACEC,IAAAA,EAAE,EAAE,KAAK;AACTC,IAAAA,CAAC,EAAE,IAAI;AACPC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,CAAC,EAAE,GAAG;AACNC,IAAAA,EAAE,EAAE,GAAA;GACL,CACDL,IAAI,CAAC,CAAA;AACT,CAAA;MAEaM,UAAU,gBAAGC,gBAAU,CAClC,SAASD,UAAUA,CACjB;AACEE,EAAAA,EAAE,GAAGC,qBAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBX,EAAAA,IAAI,GAAG,GAAG;EACVY,MAAM;AACNC,EAAAA,KAAK,GAAG,WAAW;EACnBC,OAAO;EACPC,OAAO;EACPC,SAAS;EACT,GAAGC,IAAAA;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGX,EAAuB,CAAA;EAEpC,oBACEY,KAAA,CAAAC,aAAA,CAACF,IAAI,EAAAG,MAAA,CAAAC,MAAA,CAAA;AACHC,IAAAA,GAAG,EAAEN,YAAa;AAClBF,IAAAA,SAAS,EAAES,aAAU,CACnBC,yBAAM,CAACpB,UAAU,EACjBoB,yBAAM,CAAC,CAAQ1B,KAAAA,EAAAA,IAAI,EAAE,CAAC,EACtB0B,yBAAM,CAAC,CAAA,QAAA,EAAWf,OAAO,CAAE,CAAA,CAAC,EAC5Be,yBAAM,CAAC,CAAShB,MAAAA,EAAAA,KAAK,EAAE,CAAC,EACxBgB,yBAAM,CAAC,CAAA,MAAA,EAASb,KAAK,CAAE,CAAA,CAAC,EACxBD,MAAM,IAAIc,yBAAM,CAACd,MAAM,EACvBI,SACF,CAAA;AAAE,GAAA,EACEC,IAAI,CAAA,eAERG,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEL,SAAS,EAAES,aAAU,CACnBC,yBAAM,CAACC,aAAa,EACpBZ,OAAO,IAAIW,yBAAM,CAACX,OACpB,CAAA;GAECa,EAAAA,wBAAY,CAACd,OAAO,CAAC,gBACpBM,KAAA,CAAAC,aAAA,CAACQ,SAAI,EAAA;AACH7B,IAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxB8B,IAAAA,MAAM,EAAEhB,OAAQ;IAChBE,SAAS,EAAEU,yBAAM,CAACK,UAAAA;GACnB,CAAC,GAEFjB,OAEC,CAAC,EAELC,OAAO,iBACNK,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEL,IAAAA,SAAS,EAAES,aAAU,CACnBC,yBAAM,CAACM,YAAY,EACnBN,yBAAM,CAAC,QAAQ3B,WAAW,CAACC,IAAI,CAAC,EAAE,CACpC,CAAA;AAAE,GAAA,eAEFoB,KAAA,CAAAC,aAAA,CAACY,eAAY,EAAA;IACXjB,SAAS,EAAEU,yBAAM,CAACQ,OAAQ;AAC1BvB,IAAAA,OAAO,EAAC,YAAA;GACT,CACE,CAEH,CAAC,CAAA;AAEX,CACF;;;;"}

package/dist/cjs/components/AlphaIconButton/IconButton.module.scss.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"IconButton":"b-xyUBm","size-xs":"b-mWKOx","size-s":"b-8N-9n","size-m":"b-pDYUy","size-l":"b-YJw65","size-xl":"b-tjHwL","variant-primary":"b-Ff2Fz","color-blue":"b-ne4OD","color-cobalt":"b-5zudh","color-red":"b-plyr-","color-orange":"b-h5y75","color-green":"b-Tnm-7","color-pink":"b-uZ0LR","color-purple":"b-5-tPX","color-dark-grey":"b-BN6Xk","color-light-grey":"b-paZDh","variant-secondary":"b-ucRsW","variant-tertiary":"b-WHAB-","ButtonIcon":"b-Ty8vu","color-white":"b--tIjF","shape-rectangle":"b-hyTqW","shape-circle":"b-03MST","active":"b-P0tkF","ButtonLoader":"b-lfx3h","ButtonContent":"b-r9mfO","loading":"b--Ij3P"};
+var styles = {"Icon":"b-cK83D","size-xxxs":"b-ATSdQ","size-xxs":"b-506kS","size-xs":"b-mWKOx","size-s":"b-8N-9n","size-m":"b-pDYUy","size-l":"b-YJw65","size-xl":"b-tjHwL","IconButton":"b-xyUBm","variant-primary":"b-Ff2Fz","color-blue":"b-ne4OD","color-cobalt":"b-5zudh","color-red":"b-plyr-","color-orange":"b-h5y75","color-green":"b-Tnm-7","color-pink":"b-uZ0LR","color-purple":"b-5-tPX","color-dark-grey":"b-BN6Xk","color-light-grey":"b-paZDh","color-white":"b--tIjF","variant-secondary":"b-ucRsW","variant-tertiary":"b-WHAB-","ButtonIcon":"b-Ty8vu","shape-rectangle":"b-hyTqW","shape-circle":"b-03MST","active":"b-P0tkF","ButtonLoader":"b-lfx3h","ButtonContent":"b-r9mfO","loading":"b--Ij3P","Spinner":"b-zWwY6"};
 
 exports.default = styles;
 //# sourceMappingURL=IconButton.module.scss.js.map

package/dist/cjs/components/AlphaSpinner/Spinner.js

@@ -12,7 +12,7 @@ const Spinner = /*#__PURE__*/React.forwardRef(function Spinner({
   ...rest
 }, forwardedRef) {
   return /*#__PURE__*/React.createElement("span", Object.assign({
-    className: index.default(Spinner_module.default.Spinner, size && Spinner_module.default[`size-${size}`], Spinner_module.default[`variant-${variant}`]),
+    className: index.default(Spinner_module.default.Spinner, size && Spinner_module.default[`size-${size}`], Spinner_module.default[`variant-${variant}`], className),
     ref: forwardedRef,
     "data-testid": SPINNER_TEST_ID
   }, rest), /*#__PURE__*/React.createElement("svg", {
@@ -21,15 +21,13 @@ const Spinner = /*#__PURE__*/React.forwardRef(function Spinner({
   }, /*#__PURE__*/React.createElement("circle", {
     cx: "8",
     cy: "8",
-    r: "7",
-    className: Spinner_module.default.track,
-    vectorEffect: "non-scaling-stroke"
+    r: "6.5",
+    className: Spinner_module.default.track
   }), /*#__PURE__*/React.createElement("circle", {
     cx: "8",
     cy: "8",
-    r: "7",
-    className: Spinner_module.default.indicator,
-    vectorEffect: "non-scaling-stroke"
+    r: "6.5",
+    className: Spinner_module.default.indicator
   })));
 });
 

package/dist/cjs/components/AlphaSpinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sources":["../../../../src/components/AlphaSpinner/Spinner.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport classNames from 'classnames'\n\nimport { type SpinnerProps } from './Spinner.types'\n\nimport styles from './Spinner.module.scss'\n\nexport const SPINNER_TEST_ID = 'bezier-spinner'\n\nexport const Spinner = forwardRef<HTMLSpanElement, SpinnerProps>(\n  function Spinner(\n    { className, size, variant = 'secondary', ...rest },\n    forwardedRef\n  ) {\n    return (\n      <span\n        className={classNames(\n          styles.Spinner,\n          size && styles[`size-${size}`],\n          styles[`variant-${variant}`]\n        )}\n        ref={forwardedRef}\n        data-testid={SPINNER_TEST_ID}\n        {...rest}\n      >\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox=\"0 0 16 16\"\n        >\n          <circle\n            cx=\"8\"\n            cy=\"8\"\n            r=\"7\"\n            className={styles.track}\n            vectorEffect=\"non-scaling-stroke\"\n          />\n\n          <circle\n            cx=\"8\"\n            cy=\"8\"\n            r=\"7\"\n            className={styles.indicator}\n            vectorEffect=\"non-scaling-stroke\"\n          />\n        </svg>\n      </span>\n    )\n  }\n)\n"],"names":["SPINNER_TEST_ID","Spinner","forwardRef","className","size","variant","rest","forwardedRef","React","createElement","Object","assign","classNames","styles","ref","xmlns","viewBox","cx","cy","r","track","vectorEffect","indicator"],"mappings":";;;;;;AAQO,MAAMA,eAAe,GAAG,iBAAgB;MAElCC,OAAO,gBAAGC,gBAAU,CAC/B,SAASD,OAAOA,CACd;EAAEE,SAAS;EAAEC,IAAI;AAAEC,EAAAA,OAAO,GAAG,WAAW;EAAE,GAAGC,IAAAA;AAAK,CAAC,EACnDC,YAAY,EACZ;AACA,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAAAC,MAAAA,EAAAA,MAAA,CAAAC,MAAA,CAAA;IACER,SAAS,EAAES,aAAU,CACnBC,sBAAM,CAACZ,OAAO,EACdG,IAAI,IAAIS,sBAAM,CAAC,QAAQT,IAAI,CAAA,CAAE,CAAC,EAC9BS,sBAAM,CAAC,CAAWR,QAAAA,EAAAA,OAAO,CAAE,CAAA,CAC7B,CAAE;AACFS,IAAAA,GAAG,EAAEP,YAAa;IAClB,aAAaP,EAAAA,eAAAA;AAAgB,GAAA,EACzBM,IAAI,CAAA,eAERE,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEM,IAAAA,KAAK,EAAC,4BAA4B;AAClCC,IAAAA,OAAO,EAAC,WAAA;GAERR,eAAAA,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;AACEQ,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,CAAC,EAAC,GAAG;IACLhB,SAAS,EAAEU,sBAAM,CAACO,KAAM;AACxBC,IAAAA,YAAY,EAAC,oBAAA;AAAoB,GAClC,CAAC,eAEFb,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;AACEQ,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,CAAC,EAAC,GAAG;IACLhB,SAAS,EAAEU,sBAAM,CAACS,SAAU;AAC5BD,IAAAA,YAAY,EAAC,oBAAA;GACd,CACE,CACD,CAAC,CAAA;AAEX,CACF;;;;;"}
+{"version":3,"file":"Spinner.js","sources":["../../../../src/components/AlphaSpinner/Spinner.tsx"],"sourcesContent":["import React, { forwardRef } from 'react'\n\nimport classNames from 'classnames'\n\nimport { type SpinnerProps } from './Spinner.types'\n\nimport styles from './Spinner.module.scss'\n\nexport const SPINNER_TEST_ID = 'bezier-spinner'\n\nexport const Spinner = forwardRef<HTMLSpanElement, SpinnerProps>(\n  function Spinner(\n    { className, size, variant = 'secondary', ...rest },\n    forwardedRef\n  ) {\n    return (\n      <span\n        className={classNames(\n          styles.Spinner,\n          size && styles[`size-${size}`],\n          styles[`variant-${variant}`],\n          className\n        )}\n        ref={forwardedRef}\n        data-testid={SPINNER_TEST_ID}\n        {...rest}\n      >\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox=\"0 0 16 16\"\n        >\n          <circle\n            cx=\"8\"\n            cy=\"8\"\n            r=\"6.5\"\n            className={styles.track}\n          />\n\n          <circle\n            cx=\"8\"\n            cy=\"8\"\n            r=\"6.5\"\n            className={styles.indicator}\n          />\n        </svg>\n      </span>\n    )\n  }\n)\n"],"names":["SPINNER_TEST_ID","Spinner","forwardRef","className","size","variant","rest","forwardedRef","React","createElement","Object","assign","classNames","styles","ref","xmlns","viewBox","cx","cy","r","track","indicator"],"mappings":";;;;;;AAQO,MAAMA,eAAe,GAAG,iBAAgB;MAElCC,OAAO,gBAAGC,gBAAU,CAC/B,SAASD,OAAOA,CACd;EAAEE,SAAS;EAAEC,IAAI;AAAEC,EAAAA,OAAO,GAAG,WAAW;EAAE,GAAGC,IAAAA;AAAK,CAAC,EACnDC,YAAY,EACZ;AACA,EAAA,oBACEC,KAAA,CAAAC,aAAA,CAAAC,MAAAA,EAAAA,MAAA,CAAAC,MAAA,CAAA;IACER,SAAS,EAAES,aAAU,CACnBC,sBAAM,CAACZ,OAAO,EACdG,IAAI,IAAIS,sBAAM,CAAC,CAAA,KAAA,EAAQT,IAAI,CAAE,CAAA,CAAC,EAC9BS,sBAAM,CAAC,CAAA,QAAA,EAAWR,OAAO,CAAE,CAAA,CAAC,EAC5BF,SACF,CAAE;AACFW,IAAAA,GAAG,EAAEP,YAAa;IAClB,aAAaP,EAAAA,eAAAA;AAAgB,GAAA,EACzBM,IAAI,CAAA,eAERE,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEM,IAAAA,KAAK,EAAC,4BAA4B;AAClCC,IAAAA,OAAO,EAAC,WAAA;GAERR,eAAAA,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;AACEQ,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,CAAC,EAAC,KAAK;IACPhB,SAAS,EAAEU,sBAAM,CAACO,KAAAA;AAAM,GACzB,CAAC,eAEFZ,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;AACEQ,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,CAAC,EAAC,KAAK;IACPhB,SAAS,EAAEU,sBAAM,CAACQ,SAAAA;GACnB,CACE,CACD,CAAC,CAAA;AAEX,CACF;;;;;"}