@channel.io/bezier-react 2.6.2 → 3.0.1

package/dist/esm/components/AlphaFloatingButton/FloatingButton.mjs

@@ -1,7 +1,8 @@
-import React__default, { forwardRef } from 'react';
+import { forwardRef } from 'react';
 import { isBezierIcon } from '@channel.io/bezier-icons';
-import classNames from '../../node_modules/classnames/index.mjs';
+import classNames from '../../_virtual/index.mjs';
 import styles from './FloatingButton.module.scss.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { Text } from '../Text/Text.mjs';
 import { Loader } from '../AlphaLoader/Loader.mjs';
 import { BaseButton } from '../BaseButton/BaseButton.mjs';
@@ -11,7 +12,7 @@ function SideContent({
   size,
   content
 }) {
-  return isBezierIcon(content) ? /*#__PURE__*/React__default.createElement(Icon, {
+  return isBezierIcon(content) ? /*#__PURE__*/jsx(Icon, {
     source: content,
     size: size,
     className: styles.ButtonIcon
@@ -51,31 +52,36 @@ const FloatingButton = /*#__PURE__*/forwardRef(function Button({
 }, forwardedRef) {
   const Comp = as;
   const disabled = loading || disabledProp;
-  return /*#__PURE__*/React__default.createElement(Comp, Object.assign({
+  return /*#__PURE__*/jsxs(Comp, {
     ref: forwardedRef,
     className: classNames(styles.FloatingButton, styles[`size-${size}`], styles[`variant-${variant}`], styles[`color-${color}`], active && styles.active, className),
-    disabled: disabled
-  }, rest), /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(styles.ButtonContent, loading && styles.loading)
-  }, /*#__PURE__*/React__default.createElement(SideContent, {
-    size: getIconSize(size),
-    content: prefixContent
-  }), /*#__PURE__*/React__default.createElement(Text, {
-    className: styles.ButtonText,
-    typo: getTypography(size),
-    bold: true
-  }, text), /*#__PURE__*/React__default.createElement(SideContent, {
-    size: getIconSize(size),
-    content: suffixContent
-  })), loading && /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(styles.ButtonLoader,
-    // NOTE: Loader size is the same as icon size
-    styles[`size-${getIconSize(size)}`])
-  }, /*#__PURE__*/React__default.createElement(Loader, {
-    size: "s",
-    className: styles.Loader,
-    variant: variant === 'primary' ? 'on-overlay' : 'secondary'
-  })));
+    disabled: disabled,
+    ...rest,
+    children: [/*#__PURE__*/jsxs("div", {
+      className: classNames(styles.ButtonContent, loading && styles.loading),
+      children: [/*#__PURE__*/jsx(SideContent, {
+        size: getIconSize(size),
+        content: prefixContent
+      }), /*#__PURE__*/jsx(Text, {
+        className: styles.ButtonText,
+        typo: getTypography(size),
+        bold: true,
+        children: text
+      }), /*#__PURE__*/jsx(SideContent, {
+        size: getIconSize(size),
+        content: suffixContent
+      })]
+    }), loading && /*#__PURE__*/jsx("div", {
+      className: classNames(styles.ButtonLoader,
+      // NOTE: Loader size is the same as icon size
+      styles[`size-${getIconSize(size)}`]),
+      children: /*#__PURE__*/jsx(Loader, {
+        size: "s",
+        className: styles.Loader,
+        variant: variant === 'primary' ? 'on-overlay' : 'secondary'
+      })
+    })]
+  });
 });
 
 export { FloatingButton };

package/dist/esm/components/AlphaFloatingButton/FloatingButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingButton.mjs","sources":["../../../../src/components/AlphaFloatingButton/FloatingButton.tsx"],"sourcesContent":["'use client'\n\nimport 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 { AlphaLoader } from '~/src/components/AlphaLoader'\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: 'xs',\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 = false,\n    disabled: disabledProp = false,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n  const disabled = loading || disabledProp\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      disabled={disabled}\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            // NOTE: Loader size is the same as icon size\n            styles[`size-${getIconSize(size)}`]\n          )}\n        >\n          <AlphaLoader\n            size=\"s\"\n            className={styles.Loader}\n            variant={variant === 'primary' ? 'on-overlay' : 'secondary'}\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","disabled","disabledProp","rest","forwardedRef","Comp","Object","assign","ref","classNames","ButtonContent","Text","ButtonText","typo","bold","ButtonLoader","AlphaLoader","Loader"],"mappings":"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"}
+{"version":3,"file":"FloatingButton.mjs","sources":["../../../../src/components/AlphaFloatingButton/FloatingButton.tsx"],"sourcesContent":["'use client'\n\nimport { 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 { AlphaLoader } from '~/src/components/AlphaLoader'\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: 'xs',\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 = false,\n    disabled: disabledProp = false,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n  const disabled = loading || disabledProp\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      disabled={disabled}\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            // NOTE: Loader size is the same as icon size\n            styles[`size-${getIconSize(size)}`]\n          )}\n        >\n          <AlphaLoader\n            size=\"s\"\n            className={styles.Loader}\n            variant={variant === 'primary' ? 'on-overlay' : 'secondary'}\n          />\n        </div>\n      )}\n    </Comp>\n  )\n})\n"],"names":["SideContent","size","content","isBezierIcon","_jsx","Icon","source","className","styles","ButtonIcon","getIconSize","xs","s","m","l","xl","getTypography","FloatingButton","forwardRef","Button","as","BaseButton","text","prefixContent","suffixContent","color","variant","active","loading","disabled","disabledProp","rest","forwardedRef","Comp","_jsxs","ref","classNames","children","ButtonContent","Text","ButtonText","typo","bold","ButtonLoader","AlphaLoader","Loader"],"mappings":"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"}

package/dist/esm/components/AlphaFloatingIconButton/FloatingIconButton.mjs

@@ -1,7 +1,8 @@
-import React__default, { forwardRef } from 'react';
+import { forwardRef } from 'react';
 import { isBezierIcon } from '@channel.io/bezier-icons';
-import classNames from '../../node_modules/classnames/index.mjs';
+import classNames from '../../_virtual/index.mjs';
 import styles from './FloatingIconButton.module.scss.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { Icon } from '../Icon/Icon.mjs';
 import { Loader } from '../AlphaLoader/Loader.mjs';
 import { BaseButton } from '../BaseButton/BaseButton.mjs';
@@ -29,24 +30,28 @@ const FloatingIconButton = /*#__PURE__*/forwardRef(function FloatingIconButton({
 }, forwardedRef) {
   const Comp = as;
   const disabled = loading || disabledProp;
-  return /*#__PURE__*/React__default.createElement(Comp, Object.assign({
+  return /*#__PURE__*/jsxs(Comp, {
     ref: forwardedRef,
     className: classNames(styles.FloatingIconButton, styles[`size-${size}`], styles[`variant-${variant}`], styles[`color-${color}`], active && styles.active, className),
-    disabled: disabled
-  }, rest), /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(styles.ButtonContent, loading && styles.loading)
-  }, isBezierIcon(content) ? /*#__PURE__*/React__default.createElement(Icon, {
-    size: getIconSize(size),
-    source: content
-  }) : content), loading && /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(styles.ButtonLoader,
-    // NOTE: Loader size is the same as icon size
-    styles[`size-${getIconSize(size)}`])
-  }, /*#__PURE__*/React__default.createElement(Loader, {
-    size: "s",
-    className: styles.Loader,
-    variant: variant === 'primary' ? 'on-overlay' : 'secondary'
-  })));
+    disabled: disabled,
+    ...rest,
+    children: [/*#__PURE__*/jsx("div", {
+      className: classNames(styles.ButtonContent, loading && styles.loading),
+      children: isBezierIcon(content) ? /*#__PURE__*/jsx(Icon, {
+        size: getIconSize(size),
+        source: content
+      }) : content
+    }), loading && /*#__PURE__*/jsx("div", {
+      className: classNames(styles.ButtonLoader,
+      // NOTE: Loader size is the same as icon size
+      styles[`size-${getIconSize(size)}`]),
+      children: /*#__PURE__*/jsx(Loader, {
+        size: "s",
+        className: styles.Loader,
+        variant: variant === 'primary' ? 'on-overlay' : 'secondary'
+      })
+    })]
+  });
 });
 
 export { FloatingIconButton };

package/dist/esm/components/AlphaFloatingIconButton/FloatingIconButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FloatingIconButton.mjs","sources":["../../../../src/components/AlphaFloatingIconButton/FloatingIconButton.tsx"],"sourcesContent":["'use client'\n\nimport 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 { AlphaLoader } from '~/src/components/AlphaLoader'\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: 'xs',\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 = false,\n    disabled: disabledProp = false,\n    className,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n  const disabled = loading || disabledProp\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      disabled={disabled}\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            // NOTE: Loader size is the same as icon size\n            styles[`size-${getIconSize(size)}`]\n          )}\n        >\n          <AlphaLoader\n            size=\"s\"\n            className={styles.Loader}\n            variant={variant === 'primary' ? 'on-overlay' : 'secondary'}\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","disabled","disabledProp","className","rest","forwardedRef","Comp","React","createElement","Object","assign","ref","classNames","styles","ButtonContent","isBezierIcon","Icon","source","ButtonLoader","AlphaLoader","Loader"],"mappings":";;;;;;;;AAeA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,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;GACL,CACDL,IAAI,CAAC;AACT;MAEaM,kBAAkB,gBAAGC,UAAU,CAG1C,SAASD,kBAAkBA,CAC3B;AACEE,EAAAA,EAAE,GAAGC,UAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBX,EAAAA,IAAI,GAAG,GAAG;EACVY,MAAM;EACNC,OAAO;AACPC,EAAAA,OAAO,GAAG,KAAK;EACfC,QAAQ,EAAEC,YAAY,GAAG,KAAK;EAC9BC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGZ,EAAuB;AACpC,EAAA,MAAMO,QAAQ,GAAGD,OAAO,IAAIE,YAAY;EAExC,oBACEK,cAAA,CAAAC,aAAA,CAACF,IAAI,EAAAG,MAAA,CAAAC,MAAA,CAAA;AACHC,IAAAA,GAAG,EAAEN,YAAa;AAClBF,IAAAA,SAAS,EAAES,UAAU,CACnBC,MAAM,CAACrB,kBAAkB,EACzBqB,MAAM,CAAC,QAAQ3B,IAAI,CAAA,CAAE,CAAC,EACtB2B,MAAM,CAAC,CAAA,QAAA,EAAWhB,OAAO,CAAA,CAAE,CAAC,EAC5BgB,MAAM,CAAC,CAAA,MAAA,EAASjB,KAAK,CAAE,CAAA,CAAC,EACxBE,MAAM,IAAIe,MAAM,CAACf,MAAM,EACvBK,SACF,CAAE;AACFF,IAAAA,QAAQ,EAAEA;AAAS,GAAA,EACfG,IAAI,CAAA,eAERG,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEL,SAAS,EAAES,UAAU,CAACC,MAAM,CAACC,aAAa,EAAEd,OAAO,IAAIa,MAAM,CAACb,OAAO;GAEpEe,EAAAA,YAAY,CAAChB,OAAO,CAAC,gBACpBQ,cAAA,CAAAC,aAAA,CAACQ,IAAI,EAAA;AACH9B,IAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxB+B,IAAAA,MAAM,EAAElB;GACT,CAAC,GAEFA,OAEC,CAAC,EAELC,OAAO,iBACNO,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEL,IAAAA,SAAS,EAAES,UAAU,CACnBC,MAAM,CAACK,YAAY;AACnB;AACAL,IAAAA,MAAM,CAAC,CAAQ5B,KAAAA,EAAAA,WAAW,CAACC,IAAI,CAAC,EAAE,CACpC;AAAE,GAAA,eAEFqB,cAAA,CAAAC,aAAA,CAACW,MAAW,EAAA;AACVjC,IAAAA,IAAI,EAAC,GAAG;IACRiB,SAAS,EAAEU,MAAM,CAACO,MAAO;AACzBvB,IAAAA,OAAO,EAAEA,OAAO,KAAK,SAAS,GAAG,YAAY,GAAG;GACjD,CACE,CAEH,CAAC;AAEX,CAAC;;;;"}
+{"version":3,"file":"FloatingIconButton.mjs","sources":["../../../../src/components/AlphaFloatingIconButton/FloatingIconButton.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type AlphaFloatingIconButtonProps } from '~/src/components/AlphaFloatingIconButton'\nimport { AlphaLoader } from '~/src/components/AlphaLoader'\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: 'xs',\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 = false,\n    disabled: disabledProp = false,\n    className,\n    ...rest\n  },\n  forwardedRef\n) {\n  const Comp = as as typeof BaseButton\n  const disabled = loading || disabledProp\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      disabled={disabled}\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            // NOTE: Loader size is the same as icon size\n            styles[`size-${getIconSize(size)}`]\n          )}\n        >\n          <AlphaLoader\n            size=\"s\"\n            className={styles.Loader}\n            variant={variant === 'primary' ? 'on-overlay' : 'secondary'}\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","disabled","disabledProp","className","rest","forwardedRef","Comp","_jsxs","ref","classNames","styles","children","_jsx","ButtonContent","isBezierIcon","Icon","source","ButtonLoader","AlphaLoader","Loader"],"mappings":";;;;;;;;;AAeA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,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;GACL,CACDL,IAAI,CAAC;AACT;MAEaM,kBAAkB,gBAAGC,UAAU,CAG1C,SAASD,kBAAkBA,CAC3B;AACEE,EAAAA,EAAE,GAAGC,UAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBX,EAAAA,IAAI,GAAG,GAAG;EACVY,MAAM;EACNC,OAAO;AACPC,EAAAA,OAAO,GAAG,KAAK;EACfC,QAAQ,EAAEC,YAAY,GAAG,KAAK;EAC9BC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGZ,EAAuB;AACpC,EAAA,MAAMO,QAAQ,GAAGD,OAAO,IAAIE,YAAY;EAExC,oBACEK,IAAA,CAACD,IAAI,EAAA;AACHE,IAAAA,GAAG,EAAEH,YAAa;AAClBF,IAAAA,SAAS,EAAEM,UAAU,CACnBC,MAAM,CAAClB,kBAAkB,EACzBkB,MAAM,CAAC,QAAQxB,IAAI,CAAA,CAAE,CAAC,EACtBwB,MAAM,CAAC,CAAA,QAAA,EAAWb,OAAO,CAAA,CAAE,CAAC,EAC5Ba,MAAM,CAAC,CAAA,MAAA,EAASd,KAAK,CAAE,CAAA,CAAC,EACxBE,MAAM,IAAIY,MAAM,CAACZ,MAAM,EACvBK,SACF,CAAE;AACFF,IAAAA,QAAQ,EAAEA,QAAS;AAAA,IAAA,GACfG,IAAI;AAAAO,IAAAA,QAAA,gBAERC,GAAA,CAAA,KAAA,EAAA;AACET,MAAAA,SAAS,EAAEM,UAAU,CAACC,MAAM,CAACG,aAAa,EAAEb,OAAO,IAAIU,MAAM,CAACV,OAAO,CAAE;MAAAW,QAAA,EAEtEG,YAAY,CAACf,OAAO,CAAC,gBACpBa,GAAA,CAACG,IAAI,EAAA;AACH7B,QAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxB8B,QAAAA,MAAM,EAAEjB;AAAQ,OACjB,CAAC,GAEFA;AACD,KACE,CAAC,EAELC,OAAO,iBACNY,GAAA,CAAA,KAAA,EAAA;AACET,MAAAA,SAAS,EAAEM,UAAU,CACnBC,MAAM,CAACO,YAAY;AACnB;MACAP,MAAM,CAAC,QAAQzB,WAAW,CAACC,IAAI,CAAC,CAAA,CAAE,CACpC,CAAE;MAAAyB,QAAA,eAEFC,GAAA,CAACM,MAAW,EAAA;AACVhC,QAAAA,IAAI,EAAC,GAAG;QACRiB,SAAS,EAAEO,MAAM,CAACS,MAAO;AACzBtB,QAAAA,OAAO,EAAEA,OAAO,KAAK,SAAS,GAAG,YAAY,GAAG;OACjD;AAAC,KACC,CACN;AAAA,GACG,CAAC;AAEX,CAAC;;;;"}

package/dist/esm/components/AlphaIconButton/IconButton.mjs

@@ -1,7 +1,8 @@
-import React__default, { forwardRef } from 'react';
+import { forwardRef } from 'react';
 import { isBezierIcon } from '@channel.io/bezier-icons';
-import classNames from '../../node_modules/classnames/index.mjs';
+import classNames from '../../_virtual/index.mjs';
 import styles from './IconButton.module.scss.mjs';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { Icon } from '../Icon/Icon.mjs';
 import { Loader } from '../AlphaLoader/Loader.mjs';
 import { BaseButton } from '../BaseButton/BaseButton.mjs';
@@ -30,25 +31,29 @@ const IconButton = /*#__PURE__*/forwardRef(function IconButton({
 }, forwardedRef) {
   const Comp = as;
   const disabled = loading || disabledProp;
-  return /*#__PURE__*/React__default.createElement(Comp, Object.assign({
+  return /*#__PURE__*/jsxs(Comp, {
     ref: forwardedRef,
     className: classNames(styles.IconButton, styles[`size-${size}`], styles[`variant-${variant}`], styles[`color-${color}`], styles[`shape-${shape}`], active && styles.active, className),
-    disabled: disabled
-  }, rest), /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(styles.ButtonContent, loading && styles.loading)
-  }, isBezierIcon(content) ? /*#__PURE__*/React__default.createElement(Icon, {
-    size: getIconSize(size),
-    source: content,
-    className: styles.ButtonIcon
-  }) : content), loading && /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(styles.ButtonLoader,
-    // NOTE: Loader size is the same as icon size
-    styles[`size-${getIconSize(size)}`])
-  }, /*#__PURE__*/React__default.createElement(Loader, {
-    size: "s",
-    className: styles.Loader,
-    variant: variant === 'primary' ? 'on-overlay' : 'secondary'
-  })));
+    disabled: disabled,
+    ...rest,
+    children: [/*#__PURE__*/jsx("div", {
+      className: classNames(styles.ButtonContent, loading && styles.loading),
+      children: isBezierIcon(content) ? /*#__PURE__*/jsx(Icon, {
+        size: getIconSize(size),
+        source: content,
+        className: styles.ButtonIcon
+      }) : content
+    }), loading && /*#__PURE__*/jsx("div", {
+      className: classNames(styles.ButtonLoader,
+      // NOTE: Loader size is the same as icon size
+      styles[`size-${getIconSize(size)}`]),
+      children: /*#__PURE__*/jsx(Loader, {
+        size: "s",
+        className: styles.Loader,
+        variant: variant === 'primary' ? 'on-overlay' : 'secondary'
+      })
+    })]
+  });
 });
 
 export { IconButton };

package/dist/esm/components/AlphaIconButton/IconButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.mjs","sources":["../../../../src/components/AlphaIconButton/IconButton.tsx"],"sourcesContent":["'use client'\n\nimport 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 { AlphaLoader } from '~/src/components/AlphaLoader'\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: 'xs',\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 = false,\n      disabled: disabledProp = false,\n      className,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const Comp = as as typeof BaseButton\n\n    const disabled = loading || disabledProp\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        disabled={disabled}\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              // NOTE: Loader size is the same as icon size\n              styles[`size-${getIconSize(size)}`]\n            )}\n          >\n            <AlphaLoader\n              size=\"s\"\n              className={styles.Loader}\n              variant={variant === 'primary' ? 'on-overlay' : 'secondary'}\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","disabled","disabledProp","className","rest","forwardedRef","Comp","React","createElement","Object","assign","ref","classNames","styles","ButtonContent","isBezierIcon","Icon","source","ButtonIcon","ButtonLoader","AlphaLoader","Loader"],"mappings":";;;;;;;;AAeA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,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;GACL,CACDL,IAAI,CAAC;AACT;MAEaM,UAAU,gBAAGC,UAAU,CAClC,SAASD,UAAUA,CACjB;AACEE,EAAAA,EAAE,GAAGC,UAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBX,EAAAA,IAAI,GAAG,GAAG;EACVY,MAAM;AACNC,EAAAA,KAAK,GAAG,WAAW;EACnBC,OAAO;AACPC,EAAAA,OAAO,GAAG,KAAK;EACfC,QAAQ,EAAEC,YAAY,GAAG,KAAK;EAC9BC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGb,EAAuB;AAEpC,EAAA,MAAMQ,QAAQ,GAAGD,OAAO,IAAIE,YAAY;EAExC,oBACEK,cAAA,CAAAC,aAAA,CAACF,IAAI,EAAAG,MAAA,CAAAC,MAAA,CAAA;AACHC,IAAAA,GAAG,EAAEN,YAAa;AAClBF,IAAAA,SAAS,EAAES,UAAU,CACnBC,MAAM,CAACtB,UAAU,EACjBsB,MAAM,CAAC,QAAQ5B,IAAI,CAAA,CAAE,CAAC,EACtB4B,MAAM,CAAC,CAAWjB,QAAAA,EAAAA,OAAO,EAAE,CAAC,EAC5BiB,MAAM,CAAC,SAASlB,KAAK,CAAA,CAAE,CAAC,EACxBkB,MAAM,CAAC,CAASf,MAAAA,EAAAA,KAAK,EAAE,CAAC,EACxBD,MAAM,IAAIgB,MAAM,CAAChB,MAAM,EACvBM,SACF,CAAE;AACFF,IAAAA,QAAQ,EAAEA;AAAS,GAAA,EACfG,IAAI,CAAA,eAERG,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEL,SAAS,EAAES,UAAU,CACnBC,MAAM,CAACC,aAAa,EACpBd,OAAO,IAAIa,MAAM,CAACb,OACpB;GAECe,EAAAA,YAAY,CAAChB,OAAO,CAAC,gBACpBQ,cAAA,CAAAC,aAAA,CAACQ,IAAI,EAAA;AACH/B,IAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxBgC,IAAAA,MAAM,EAAElB,OAAQ;IAChBI,SAAS,EAAEU,MAAM,CAACK;GACnB,CAAC,GAEFnB,OAEC,CAAC,EAELC,OAAO,iBACNO,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEL,IAAAA,SAAS,EAAES,UAAU,CACnBC,MAAM,CAACM,YAAY;AACnB;AACAN,IAAAA,MAAM,CAAC,CAAQ7B,KAAAA,EAAAA,WAAW,CAACC,IAAI,CAAC,EAAE,CACpC;AAAE,GAAA,eAEFsB,cAAA,CAAAC,aAAA,CAACY,MAAW,EAAA;AACVnC,IAAAA,IAAI,EAAC,GAAG;IACRkB,SAAS,EAAEU,MAAM,CAACQ,MAAO;AACzBzB,IAAAA,OAAO,EAAEA,OAAO,KAAK,SAAS,GAAG,YAAY,GAAG;GACjD,CACE,CAEH,CAAC;AAEX,CACF;;;;"}
+{"version":3,"file":"IconButton.mjs","sources":["../../../../src/components/AlphaIconButton/IconButton.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type AlphaIconButtonProps } from '~/src/components/AlphaIconButton'\nimport { AlphaLoader } from '~/src/components/AlphaLoader'\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: 'xs',\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 = false,\n      disabled: disabledProp = false,\n      className,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const Comp = as as typeof BaseButton\n\n    const disabled = loading || disabledProp\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        disabled={disabled}\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              // NOTE: Loader size is the same as icon size\n              styles[`size-${getIconSize(size)}`]\n            )}\n          >\n            <AlphaLoader\n              size=\"s\"\n              className={styles.Loader}\n              variant={variant === 'primary' ? 'on-overlay' : 'secondary'}\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","disabled","disabledProp","className","rest","forwardedRef","Comp","_jsxs","ref","classNames","styles","children","_jsx","ButtonContent","isBezierIcon","Icon","source","ButtonIcon","ButtonLoader","AlphaLoader","Loader"],"mappings":";;;;;;;;;AAeA,SAASA,WAAWA,CAACC,IAAgB,EAAE;EACrC,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;GACL,CACDL,IAAI,CAAC;AACT;MAEaM,UAAU,gBAAGC,UAAU,CAClC,SAASD,UAAUA,CACjB;AACEE,EAAAA,EAAE,GAAGC,UAAU;AACfC,EAAAA,KAAK,GAAG,MAAM;AACdC,EAAAA,OAAO,GAAG,SAAS;AACnBX,EAAAA,IAAI,GAAG,GAAG;EACVY,MAAM;AACNC,EAAAA,KAAK,GAAG,WAAW;EACnBC,OAAO;AACPC,EAAAA,OAAO,GAAG,KAAK;EACfC,QAAQ,EAAEC,YAAY,GAAG,KAAK;EAC9BC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,IAAI,GAAGb,EAAuB;AAEpC,EAAA,MAAMQ,QAAQ,GAAGD,OAAO,IAAIE,YAAY;EAExC,oBACEK,IAAA,CAACD,IAAI,EAAA;AACHE,IAAAA,GAAG,EAAEH,YAAa;AAClBF,IAAAA,SAAS,EAAEM,UAAU,CACnBC,MAAM,CAACnB,UAAU,EACjBmB,MAAM,CAAC,QAAQzB,IAAI,CAAA,CAAE,CAAC,EACtByB,MAAM,CAAC,CAAWd,QAAAA,EAAAA,OAAO,EAAE,CAAC,EAC5Bc,MAAM,CAAC,SAASf,KAAK,CAAA,CAAE,CAAC,EACxBe,MAAM,CAAC,CAASZ,MAAAA,EAAAA,KAAK,EAAE,CAAC,EACxBD,MAAM,IAAIa,MAAM,CAACb,MAAM,EACvBM,SACF,CAAE;AACFF,IAAAA,QAAQ,EAAEA,QAAS;AAAA,IAAA,GACfG,IAAI;AAAAO,IAAAA,QAAA,gBAERC,GAAA,CAAA,KAAA,EAAA;AACET,MAAAA,SAAS,EAAEM,UAAU,CACnBC,MAAM,CAACG,aAAa,EACpBb,OAAO,IAAIU,MAAM,CAACV,OACpB,CAAE;MAAAW,QAAA,EAEDG,YAAY,CAACf,OAAO,CAAC,gBACpBa,GAAA,CAACG,IAAI,EAAA;AACH9B,QAAAA,IAAI,EAAED,WAAW,CAACC,IAAI,CAAE;AACxB+B,QAAAA,MAAM,EAAEjB,OAAQ;QAChBI,SAAS,EAAEO,MAAM,CAACO;AAAW,OAC9B,CAAC,GAEFlB;AACD,KACE,CAAC,EAELC,OAAO,iBACNY,GAAA,CAAA,KAAA,EAAA;AACET,MAAAA,SAAS,EAAEM,UAAU,CACnBC,MAAM,CAACQ,YAAY;AACnB;MACAR,MAAM,CAAC,QAAQ1B,WAAW,CAACC,IAAI,CAAC,CAAA,CAAE,CACpC,CAAE;MAAA0B,QAAA,eAEFC,GAAA,CAACO,MAAW,EAAA;AACVlC,QAAAA,IAAI,EAAC,GAAG;QACRkB,SAAS,EAAEO,MAAM,CAACU,MAAO;AACzBxB,QAAAA,OAAO,EAAEA,OAAO,KAAK,SAAS,GAAG,YAAY,GAAG;OACjD;AAAC,KACC,CACN;AAAA,GACG,CAAC;AAEX,CACF;;;;"}

package/dist/esm/components/AlphaLoader/Loader.mjs

@@ -1,6 +1,7 @@
-import React__default, { forwardRef } from 'react';
-import classNames from '../../node_modules/classnames/index.mjs';
+import { forwardRef } from 'react';
+import classNames from '../../_virtual/index.mjs';
 import styles from './Loader.module.scss.mjs';
+import { jsx, jsxs } from 'react/jsx-runtime';
 
 const LOADER_TEST_ID = 'bezier-loader';
 const Loader = /*#__PURE__*/forwardRef(function Loader({
@@ -9,24 +10,27 @@ const Loader = /*#__PURE__*/forwardRef(function Loader({
   variant = 'secondary',
   ...rest
 }, forwardedRef) {
-  return /*#__PURE__*/React__default.createElement("span", Object.assign({
+  return /*#__PURE__*/jsx("span", {
     className: classNames(styles.Loader, size && styles[`size-${size}`], styles[`variant-${variant}`], className),
     ref: forwardedRef,
-    "data-testid": LOADER_TEST_ID
-  }, rest), /*#__PURE__*/React__default.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 16 16"
-  }, /*#__PURE__*/React__default.createElement("circle", {
-    cx: "8",
-    cy: "8",
-    r: "6.5",
-    className: styles.track
-  }), /*#__PURE__*/React__default.createElement("circle", {
-    cx: "8",
-    cy: "8",
-    r: "6.5",
-    className: styles.indicator
-  })));
+    "data-testid": LOADER_TEST_ID,
+    ...rest,
+    children: /*#__PURE__*/jsxs("svg", {
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 16 16",
+      children: [/*#__PURE__*/jsx("circle", {
+        cx: "8",
+        cy: "8",
+        r: "6.5",
+        className: styles.track
+      }), /*#__PURE__*/jsx("circle", {
+        cx: "8",
+        cy: "8",
+        r: "6.5",
+        className: styles.indicator
+      })]
+    })
+  });
 });
 
 export { LOADER_TEST_ID, Loader };

package/dist/esm/components/AlphaLoader/Loader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.mjs","sources":["../../../../src/components/AlphaLoader/Loader.tsx"],"sourcesContent":["'use client'\n\nimport React, { forwardRef } from 'react'\n\nimport classNames from 'classnames'\n\nimport { type LoaderProps } from './Loader.types'\n\nimport styles from './Loader.module.scss'\n\nexport const LOADER_TEST_ID = 'bezier-loader'\n\nexport const Loader = forwardRef<HTMLSpanElement, LoaderProps>(function Loader(\n  { className, size, variant = 'secondary', ...rest },\n  forwardedRef\n) {\n  return (\n    <span\n      className={classNames(\n        styles.Loader,\n        size && styles[`size-${size}`],\n        styles[`variant-${variant}`],\n        className\n      )}\n      ref={forwardedRef}\n      data-testid={LOADER_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"],"names":["LOADER_TEST_ID","Loader","forwardRef","className","size","variant","rest","forwardedRef","React","createElement","Object","assign","classNames","styles","ref","xmlns","viewBox","cx","cy","r","track","indicator"],"mappings":";;;;AAUO,MAAMA,cAAc,GAAG;MAEjBC,MAAM,gBAAGC,UAAU,CAA+B,SAASD,MAAMA,CAC5E;EAAEE,SAAS;EAAEC,IAAI;AAAEC,EAAAA,OAAO,GAAG,WAAW;EAAE,GAAGC;AAAK,CAAC,EACnDC,YAAY,EACZ;AACA,EAAA,oBACEC,cAAA,CAAAC,aAAA,CAAAC,MAAAA,EAAAA,MAAA,CAAAC,MAAA,CAAA;IACER,SAAS,EAAES,UAAU,CACnBC,MAAM,CAACZ,MAAM,EACbG,IAAI,IAAIS,MAAM,CAAC,CAAA,KAAA,EAAQT,IAAI,CAAE,CAAA,CAAC,EAC9BS,MAAM,CAAC,CAAA,QAAA,EAAWR,OAAO,CAAE,CAAA,CAAC,EAC5BF,SACF,CAAE;AACFW,IAAAA,GAAG,EAAEP,YAAa;IAClB,aAAaP,EAAAA;AAAe,GAAA,EACxBM,IAAI,CAAA,eAERE,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEM,IAAAA,KAAK,EAAC,4BAA4B;AAClCC,IAAAA,OAAO,EAAC;GAERR,eAAAA,cAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;AACEQ,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,CAAC,EAAC,KAAK;IACPhB,SAAS,EAAEU,MAAM,CAACO;AAAM,GACzB,CAAC,eAEFZ,cAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;AACEQ,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,EAAE,EAAC,GAAG;AACNC,IAAAA,CAAC,EAAC,KAAK;IACPhB,SAAS,EAAEU,MAAM,CAACQ;GACnB,CACE,CACD,CAAC;AAEX,CAAC;;;;"}
+{"version":3,"file":"Loader.mjs","sources":["../../../../src/components/AlphaLoader/Loader.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport classNames from 'classnames'\n\nimport { type LoaderProps } from './Loader.types'\n\nimport styles from './Loader.module.scss'\n\nexport const LOADER_TEST_ID = 'bezier-loader'\n\nexport const Loader = forwardRef<HTMLSpanElement, LoaderProps>(function Loader(\n  { className, size, variant = 'secondary', ...rest },\n  forwardedRef\n) {\n  return (\n    <span\n      className={classNames(\n        styles.Loader,\n        size && styles[`size-${size}`],\n        styles[`variant-${variant}`],\n        className\n      )}\n      ref={forwardedRef}\n      data-testid={LOADER_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"],"names":["LOADER_TEST_ID","Loader","forwardRef","className","size","variant","rest","forwardedRef","_jsx","classNames","styles","ref","children","_jsxs","xmlns","viewBox","cx","cy","r","track","indicator"],"mappings":";;;;;AAUO,MAAMA,cAAc,GAAG;MAEjBC,MAAM,gBAAGC,UAAU,CAA+B,SAASD,MAAMA,CAC5E;EAAEE,SAAS;EAAEC,IAAI;AAAEC,EAAAA,OAAO,GAAG,WAAW;EAAE,GAAGC;AAAK,CAAC,EACnDC,YAAY,EACZ;AACA,EAAA,oBACEC,GAAA,CAAA,MAAA,EAAA;IACEL,SAAS,EAAEM,UAAU,CACnBC,MAAM,CAACT,MAAM,EACbG,IAAI,IAAIM,MAAM,CAAC,CAAA,KAAA,EAAQN,IAAI,CAAE,CAAA,CAAC,EAC9BM,MAAM,CAAC,CAAA,QAAA,EAAWL,OAAO,CAAE,CAAA,CAAC,EAC5BF,SACF,CAAE;AACFQ,IAAAA,GAAG,EAAEJ,YAAa;AAClB,IAAA,aAAA,EAAaP,cAAe;AAAA,IAAA,GACxBM,IAAI;AAAAM,IAAAA,QAAA,eAERC,IAAA,CAAA,KAAA,EAAA;AACEC,MAAAA,KAAK,EAAC,4BAA4B;AAClCC,MAAAA,OAAO,EAAC,WAAW;AAAAH,MAAAA,QAAA,gBAEnBJ,GAAA,CAAA,QAAA,EAAA;AACEQ,QAAAA,EAAE,EAAC,GAAG;AACNC,QAAAA,EAAE,EAAC,GAAG;AACNC,QAAAA,CAAC,EAAC,KAAK;QACPf,SAAS,EAAEO,MAAM,CAACS;OACnB,CAAC,eAEFX,GAAA,CAAA,QAAA,EAAA;AACEQ,QAAAA,EAAE,EAAC,GAAG;AACNC,QAAAA,EAAE,EAAC,GAAG;AACNC,QAAAA,CAAC,EAAC,KAAK;QACPf,SAAS,EAAEO,MAAM,CAACU;AAAU,OAC7B,CAAC;KACC;AAAC,GACF,CAAC;AAEX,CAAC;;;;"}

package/dist/esm/components/AlphaStatusBadge/StatusBadge.mjs

@@ -1,24 +1,11 @@
-import React__default, { forwardRef } from 'react';
+import { forwardRef } from 'react';
 import { MoonFilledIcon } from '@channel.io/bezier-icons';
-import classNames from '../../node_modules/classnames/index.mjs';
+import classNames from '../../_virtual/index.mjs';
 import { cssVar } from '../../utils/style.mjs';
 import styles from './StatusBadge.module.scss.mjs';
+import { jsx } from 'react/jsx-runtime';
 import { Icon } from '../Icon/Icon.mjs';
 
-// TODO: Change to use AlphaIcon and alpha color tokens
-
-/**
- * `StatusBadge` is a component to indicate user status.
- * @example
- *
- * ```tsx
- * <StatusBadge
- *   size="m"
- *   online
- *   doNotDisturb
- * />
- * ```
- */
 const StatusBadge = /*#__PURE__*/forwardRef(function StatusBadge({
   size = 'm',
   online = false,
@@ -29,19 +16,21 @@ const StatusBadge = /*#__PURE__*/forwardRef(function StatusBadge({
 }, forwardedRef) {
   const iconColor = online ? 'bgtxt-green-normal' : doNotDisturb ? 'bgtxt-yellow-normal' : 'bg-black-dark';
   const backgroundColor = doNotDisturb ? 'bg-white-high' : iconColor;
-  return /*#__PURE__*/React__default.createElement("div", Object.assign({
+  return /*#__PURE__*/jsx("div", {
     ref: forwardedRef,
     style: {
       '--b-status-bg-color': cssVar(backgroundColor),
       ...style
     },
-    className: classNames(styles.StatusBadge, styles[`size-${size}`], className)
-  }, rest), doNotDisturb && /*#__PURE__*/React__default.createElement(Icon, {
-    source: MoonFilledIcon,
-    size: size === 'm' ? 'xxxs' : 'xs',
-    color: iconColor,
-    className: styles.Icon
-  }));
+    className: classNames(styles.StatusBadge, styles[`size-${size}`], className),
+    ...rest,
+    children: doNotDisturb && /*#__PURE__*/jsx(Icon, {
+      source: MoonFilledIcon,
+      size: size === 'm' ? 'xxxs' : 'xs',
+      color: iconColor,
+      className: styles.Icon
+    })
+  });
 });
 
 export { StatusBadge };

package/dist/esm/components/AlphaStatusBadge/StatusBadge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBadge.mjs","sources":["../../../../src/components/AlphaStatusBadge/StatusBadge.tsx"],"sourcesContent":["'use client'\n\nimport React, { type CSSProperties, forwardRef } from 'react'\n\nimport { MoonFilledIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type SemanticColor } from '~/src/types/tokens'\nimport { cssVar } from '~/src/utils/style'\n\nimport { Icon } from '~/src/components/Icon'\n\nimport { type StatusBadgeProps } from './StatusBadge.types'\n\nimport styles from './StatusBadge.module.scss'\n\n// TODO: Change to use AlphaIcon and alpha color tokens\n\n/**\n * `StatusBadge` is a component to indicate user status.\n * @example\n *\n * ```tsx\n * <StatusBadge\n *   size=\"m\"\n *   online\n *   doNotDisturb\n * />\n * ```\n */\nexport const StatusBadge = forwardRef<HTMLDivElement, StatusBadgeProps>(\n  function StatusBadge(\n    {\n      size = 'm',\n      online = false,\n      doNotDisturb = false,\n      style,\n      className,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const iconColor: SemanticColor = online\n      ? 'bgtxt-green-normal'\n      : doNotDisturb\n        ? 'bgtxt-yellow-normal'\n        : 'bg-black-dark'\n    const backgroundColor: SemanticColor = doNotDisturb\n      ? 'bg-white-high'\n      : iconColor\n\n    return (\n      <div\n        ref={forwardedRef}\n        style={\n          {\n            '--b-status-bg-color': cssVar(backgroundColor),\n            ...style,\n          } as CSSProperties\n        }\n        className={classNames(\n          styles.StatusBadge,\n          styles[`size-${size}`],\n          className\n        )}\n        {...rest}\n      >\n        {doNotDisturb && (\n          <Icon\n            source={MoonFilledIcon}\n            size={size === 'm' ? 'xxxs' : 'xs'}\n            color={iconColor}\n            className={styles.Icon}\n          />\n        )}\n      </div>\n    )\n  }\n)\n"],"names":["StatusBadge","forwardRef","size","online","doNotDisturb","style","className","rest","forwardedRef","iconColor","backgroundColor","React","createElement","Object","assign","ref","cssVar","classNames","styles","Icon","source","MoonFilledIcon","color"],"mappings":";;;;;;;AAgBA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;MACaA,WAAW,gBAAGC,UAAU,CACnC,SAASD,WAAWA,CAClB;AACEE,EAAAA,IAAI,GAAG,GAAG;AACVC,EAAAA,MAAM,GAAG,KAAK;AACdC,EAAAA,YAAY,GAAG,KAAK;EACpBC,KAAK;EACLC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,SAAwB,GAAGN,MAAM,GACnC,oBAAoB,GACpBC,YAAY,GACV,qBAAqB,GACrB,eAAe;AACrB,EAAA,MAAMM,eAA8B,GAAGN,YAAY,GAC/C,eAAe,GACfK,SAAS;AAEb,EAAA,oBACEE,cAAA,CAAAC,aAAA,CAAAC,KAAAA,EAAAA,MAAA,CAAAC,MAAA,CAAA;AACEC,IAAAA,GAAG,EAAEP,YAAa;AAClBH,IAAAA,KAAK,EACH;AACE,MAAA,qBAAqB,EAAEW,MAAM,CAACN,eAAe,CAAC;MAC9C,GAAGL;KAEN;AACDC,IAAAA,SAAS,EAAEW,UAAU,CACnBC,MAAM,CAAClB,WAAW,EAClBkB,MAAM,CAAC,CAAQhB,KAAAA,EAAAA,IAAI,CAAE,CAAA,CAAC,EACtBI,SACF;GACIC,EAAAA,IAAI,GAEPH,YAAY,iBACXO,cAAA,CAAAC,aAAA,CAACO,IAAI,EAAA;AACHC,IAAAA,MAAM,EAAEC,cAAe;AACvBnB,IAAAA,IAAI,EAAEA,IAAI,KAAK,GAAG,GAAG,MAAM,GAAG,IAAK;AACnCoB,IAAAA,KAAK,EAAEb,SAAU;IACjBH,SAAS,EAAEY,MAAM,CAACC;AAAK,GACxB,CAEA,CAAC;AAEV,CACF;;;;"}
+{"version":3,"file":"StatusBadge.mjs","sources":["../../../../src/components/AlphaStatusBadge/StatusBadge.tsx"],"sourcesContent":["'use client'\n\nimport { type CSSProperties, forwardRef } from 'react'\n\nimport { MoonFilledIcon } from '@channel.io/bezier-icons'\nimport classNames from 'classnames'\n\nimport { type SemanticColor } from '~/src/types/tokens'\nimport { cssVar } from '~/src/utils/style'\n\nimport { Icon } from '~/src/components/Icon'\n\nimport { type StatusBadgeProps } from './StatusBadge.types'\n\nimport styles from './StatusBadge.module.scss'\n\n// TODO: Change to use AlphaIcon and alpha color tokens\n\n/**\n * `StatusBadge` is a component to indicate user status.\n * @example\n *\n * ```tsx\n * <StatusBadge\n *   size=\"m\"\n *   online\n *   doNotDisturb\n * />\n * ```\n */\nexport const StatusBadge = forwardRef<HTMLDivElement, StatusBadgeProps>(\n  function StatusBadge(\n    {\n      size = 'm',\n      online = false,\n      doNotDisturb = false,\n      style,\n      className,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const iconColor: SemanticColor = online\n      ? 'bgtxt-green-normal'\n      : doNotDisturb\n        ? 'bgtxt-yellow-normal'\n        : 'bg-black-dark'\n    const backgroundColor: SemanticColor = doNotDisturb\n      ? 'bg-white-high'\n      : iconColor\n\n    return (\n      <div\n        ref={forwardedRef}\n        style={\n          {\n            '--b-status-bg-color': cssVar(backgroundColor),\n            ...style,\n          } as CSSProperties\n        }\n        className={classNames(\n          styles.StatusBadge,\n          styles[`size-${size}`],\n          className\n        )}\n        {...rest}\n      >\n        {doNotDisturb && (\n          <Icon\n            source={MoonFilledIcon}\n            size={size === 'm' ? 'xxxs' : 'xs'}\n            color={iconColor}\n            className={styles.Icon}\n          />\n        )}\n      </div>\n    )\n  }\n)\n"],"names":["StatusBadge","forwardRef","size","online","doNotDisturb","style","className","rest","forwardedRef","iconColor","backgroundColor","_jsx","ref","cssVar","classNames","styles","children","Icon","source","MoonFilledIcon","color"],"mappings":";;;;;;;;MA8BaA,WAAW,gBAAGC,UAAU,CACnC,SAASD,WAAWA,CAClB;AACEE,EAAAA,IAAI,GAAG,GAAG;AACVC,EAAAA,MAAM,GAAG,KAAK;AACdC,EAAAA,YAAY,GAAG,KAAK;EACpBC,KAAK;EACLC,SAAS;EACT,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;EACA,MAAMC,SAAwB,GAAGN,MAAM,GACnC,oBAAoB,GACpBC,YAAY,GACV,qBAAqB,GACrB,eAAe;AACrB,EAAA,MAAMM,eAA8B,GAAGN,YAAY,GAC/C,eAAe,GACfK,SAAS;AAEb,EAAA,oBACEE,GAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,GAAG,EAAEJ,YAAa;AAClBH,IAAAA,KAAK,EACH;AACE,MAAA,qBAAqB,EAAEQ,MAAM,CAACH,eAAe,CAAC;MAC9C,GAAGL;KAEN;AACDC,IAAAA,SAAS,EAAEQ,UAAU,CACnBC,MAAM,CAACf,WAAW,EAClBe,MAAM,CAAC,QAAQb,IAAI,CAAA,CAAE,CAAC,EACtBI,SACF,CAAE;AAAA,IAAA,GACEC,IAAI;AAAAS,IAAAA,QAAA,EAEPZ,YAAY,iBACXO,GAAA,CAACM,IAAI,EAAA;AACHC,MAAAA,MAAM,EAAEC,cAAe;AACvBjB,MAAAA,IAAI,EAAEA,IAAI,KAAK,GAAG,GAAG,MAAM,GAAG,IAAK;AACnCkB,MAAAA,KAAK,EAAEX,SAAU;MACjBH,SAAS,EAAES,MAAM,CAACE;KACnB;AACF,GACE,CAAC;AAEV,CACF;;;;"}

package/dist/esm/components/AlphaToggleButton/ToggleButton.mjs

@@ -1,9 +1,10 @@
-import React__default, { forwardRef } from 'react';
+import { forwardRef } from 'react';
 import { isBezierIcon } from '@channel.io/bezier-icons';
-import { Root as $b3bbe2732c13b576$export$be92b6f5f03c0fe9 } from '../../node_modules/@radix-ui/react-toggle/dist/index.mjs';
-import classNames from '../../node_modules/classnames/index.mjs';
+import { Root } from '../../node_modules/@radix-ui/react-toggle/dist/index.mjs';
+import classNames from '../../_virtual/index.mjs';
 import { useToggleButtonContext } from './ToggleButtonContext.mjs';
 import styles from './ToggleButton.module.scss.mjs';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { Text } from '../Text/Text.mjs';
 import { BaseButton } from '../BaseButton/BaseButton.mjs';
 import { Icon } from '../Icon/Icon.mjs';
@@ -12,7 +13,7 @@ function SideContent({
   size,
   content
 }) {
-  return isBezierIcon(content) ? /*#__PURE__*/React__default.createElement(Icon, {
+  return isBezierIcon(content) ? /*#__PURE__*/jsx(Icon, {
     source: content,
     size: size,
     className: styles.ButtonIcon
@@ -37,26 +38,31 @@ const ToggleButton = /*#__PURE__*/forwardRef(function ToggleButton({
   const shape = (_ref = shapeProps !== null && shapeProps !== void 0 ? shapeProps : shapeContext) !== null && _ref !== void 0 ? _ref : 'capsule';
   const Comp = as;
   const ICON_SIZE = 's';
-  return /*#__PURE__*/React__default.createElement($b3bbe2732c13b576$export$be92b6f5f03c0fe9, Object.assign({
+  return /*#__PURE__*/jsx(Root, {
     asChild: true,
-    onPressedChange: onSelectedChange
-  }, rest), /*#__PURE__*/React__default.createElement(Comp, {
-    ref: forwardedRef,
-    className: classNames(styles.Button, styles[`size-${size}`], styles[`variant-${variant}`], shape && styles[`shape-${shape}`], className)
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(styles.ButtonContent)
-  }, /*#__PURE__*/React__default.createElement(SideContent, {
-    size: ICON_SIZE,
-    content: prefixContent
-  }), /*#__PURE__*/React__default.createElement(Text, {
-    className: styles.ButtonText,
-    typo: "14",
-    "data-text": text,
-    truncated: true
-  }, text), /*#__PURE__*/React__default.createElement(SideContent, {
-    size: ICON_SIZE,
-    content: suffixContent
-  }))));
+    onPressedChange: onSelectedChange,
+    ...rest,
+    children: /*#__PURE__*/jsx(Comp, {
+      ref: forwardedRef,
+      className: classNames(styles.Button, styles[`size-${size}`], styles[`variant-${variant}`], shape && styles[`shape-${shape}`], className),
+      children: /*#__PURE__*/jsxs("div", {
+        className: classNames(styles.ButtonContent),
+        children: [/*#__PURE__*/jsx(SideContent, {
+          size: ICON_SIZE,
+          content: prefixContent
+        }), /*#__PURE__*/jsx(Text, {
+          className: styles.ButtonText,
+          typo: "14",
+          "data-text": text,
+          truncated: true,
+          children: text
+        }), /*#__PURE__*/jsx(SideContent, {
+          size: ICON_SIZE,
+          content: suffixContent
+        })]
+      })
+    })
+  });
 });
 
 export { ToggleButton };

package/dist/esm/components/AlphaToggleButton/ToggleButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.mjs","sources":["../../../../src/components/AlphaToggleButton/ToggleButton.tsx"],"sourcesContent":["'use client'\n\nimport React, { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport * as TogglePrimitive from '@radix-ui/react-toggle'\nimport classNames from 'classnames'\n\nimport { useToggleButtonContext } from '~/src/components/AlphaToggleButton/ToggleButtonContext'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Icon, type IconSize } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport { type ToggleButtonProps } from './ToggleButton.types'\n\nimport styles from './ToggleButton.module.scss'\n\nfunction SideContent({\n  size,\n  content,\n}: {\n  size: IconSize\n  content?: ToggleButtonProps['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\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n  function ToggleButton(\n    {\n      as = BaseButton,\n      text,\n      prefixContent,\n      suffixContent,\n      variant = 'primary',\n      shape: shapeProps,\n      size = 'm',\n      className,\n      onSelectedChange,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const { shape: shapeContext } = useToggleButtonContext()\n    const shape = shapeProps ?? shapeContext ?? 'capsule'\n    const Comp = as as typeof BaseButton\n    const ICON_SIZE = 's'\n\n    return (\n      <TogglePrimitive.Root\n        asChild\n        onPressedChange={onSelectedChange}\n        {...rest}\n      >\n        <Comp\n          ref={forwardedRef}\n          className={classNames(\n            styles.Button,\n            styles[`size-${size}`],\n            styles[`variant-${variant}`],\n            shape && styles[`shape-${shape}`],\n            className\n          )}\n        >\n          <div className={classNames(styles.ButtonContent)}>\n            <SideContent\n              size={ICON_SIZE}\n              content={prefixContent}\n            />\n\n            {/* TODO: use AlphaText later, add typo */}\n            <Text\n              className={styles.ButtonText}\n              typo=\"14\"\n              data-text={text}\n              truncated\n            >\n              {text}\n            </Text>\n\n            <SideContent\n              size={ICON_SIZE}\n              content={suffixContent}\n            />\n          </div>\n        </Comp>\n      </TogglePrimitive.Root>\n    )\n  }\n)\n"],"names":["SideContent","size","content","isBezierIcon","React","createElement","Icon","source","className","styles","ButtonIcon","ToggleButton","forwardRef","as","BaseButton","text","prefixContent","suffixContent","variant","shape","shapeProps","onSelectedChange","rest","forwardedRef","_ref","shapeContext","useToggleButtonContext","Comp","ICON_SIZE","TogglePrimitive","Object","assign","asChild","onPressedChange","ref","classNames","Button","ButtonContent","Text","ButtonText","typo","truncated"],"mappings":";;;;;;;;;;AAiBA,SAASA,WAAWA,CAAC;EACnBC,IAAI;AACJC,EAAAA;AAIF,CAAC,EAAE;EACD,OAAOC,YAAY,CAACD,OAAO,CAAC,gBAC1BE,cAAA,CAAAC,aAAA,CAACC,IAAI,EAAA;AACHC,IAAAA,MAAM,EAAEL,OAAQ;AAChBD,IAAAA,IAAI,EAAEA,IAAK;IACXO,SAAS,EAAEC,MAAM,CAACC;GACnB,CAAC,GAEFR,OACD;AACH;MAEaS,YAAY,gBAAGC,UAAU,CACpC,SAASD,YAAYA,CACnB;AACEE,EAAAA,EAAE,GAAGC,UAAU;EACfC,IAAI;EACJC,aAAa;EACbC,aAAa;AACbC,EAAAA,OAAO,GAAG,SAAS;AACnBC,EAAAA,KAAK,EAAEC,UAAU;AACjBnB,EAAAA,IAAI,GAAG,GAAG;EACVO,SAAS;EACTa,gBAAgB;EAChB,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;AAAA,EAAA,IAAAC,IAAA;EACA,MAAM;AAAEL,IAAAA,KAAK,EAAEM;GAAc,GAAGC,sBAAsB,EAAE;AACxD,EAAA,MAAMP,KAAK,GAAAK,CAAAA,IAAA,GAAGJ,UAAU,aAAVA,UAAU,KAAA,KAAA,CAAA,GAAVA,UAAU,GAAIK,YAAY,MAAAD,IAAAA,IAAAA,IAAA,KAAAA,KAAAA,CAAAA,GAAAA,IAAA,GAAI,SAAS;EACrD,MAAMG,IAAI,GAAGd,EAAuB;EACpC,MAAMe,SAAS,GAAG,GAAG;EAErB,oBACExB,cAAA,CAAAC,aAAA,CAACwB,yCAAoB,EAAAC,MAAA,CAAAC,MAAA,CAAA;IACnBC,OAAO,EAAA,IAAA;AACPC,IAAAA,eAAe,EAAEZ;AAAiB,GAAA,EAC9BC,IAAI,CAERlB,eAAAA,cAAA,CAAAC,aAAA,CAACsB,IAAI,EAAA;AACHO,IAAAA,GAAG,EAAEX,YAAa;AAClBf,IAAAA,SAAS,EAAE2B,UAAU,CACnB1B,MAAM,CAAC2B,MAAM,EACb3B,MAAM,CAAC,CAAA,KAAA,EAAQR,IAAI,CAAA,CAAE,CAAC,EACtBQ,MAAM,CAAC,CAAA,QAAA,EAAWS,OAAO,CAAA,CAAE,CAAC,EAC5BC,KAAK,IAAIV,MAAM,CAAC,CAASU,MAAAA,EAAAA,KAAK,CAAE,CAAA,CAAC,EACjCX,SACF;GAEAJ,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKG,IAAAA,SAAS,EAAE2B,UAAU,CAAC1B,MAAM,CAAC4B,aAAa;AAAE,GAAA,eAC/CjC,cAAA,CAAAC,aAAA,CAACL,WAAW,EAAA;AACVC,IAAAA,IAAI,EAAE2B,SAAU;AAChB1B,IAAAA,OAAO,EAAEc;AAAc,GACxB,CAAC,eAGFZ,cAAA,CAAAC,aAAA,CAACiC,IAAI,EAAA;IACH9B,SAAS,EAAEC,MAAM,CAAC8B,UAAW;AAC7BC,IAAAA,IAAI,EAAC,IAAI;AACT,IAAA,WAAA,EAAWzB,IAAK;IAChB0B,SAAS,EAAA;AAAA,GAAA,EAER1B,IACG,CAAC,eAEPX,cAAA,CAAAC,aAAA,CAACL,WAAW,EAAA;AACVC,IAAAA,IAAI,EAAE2B,SAAU;AAChB1B,IAAAA,OAAO,EAAEe;GACV,CACE,CACD,CACc,CAAC;AAE3B,CACF;;;;"}
+{"version":3,"file":"ToggleButton.mjs","sources":["../../../../src/components/AlphaToggleButton/ToggleButton.tsx"],"sourcesContent":["'use client'\n\nimport { forwardRef } from 'react'\n\nimport { isBezierIcon } from '@channel.io/bezier-icons'\nimport * as TogglePrimitive from '@radix-ui/react-toggle'\nimport classNames from 'classnames'\n\nimport { useToggleButtonContext } from '~/src/components/AlphaToggleButton/ToggleButtonContext'\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Icon, type IconSize } from '~/src/components/Icon'\nimport { Text } from '~/src/components/Text'\n\nimport { type ToggleButtonProps } from './ToggleButton.types'\n\nimport styles from './ToggleButton.module.scss'\n\nfunction SideContent({\n  size,\n  content,\n}: {\n  size: IconSize\n  content?: ToggleButtonProps['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\nexport const ToggleButton = forwardRef<HTMLButtonElement, ToggleButtonProps>(\n  function ToggleButton(\n    {\n      as = BaseButton,\n      text,\n      prefixContent,\n      suffixContent,\n      variant = 'primary',\n      shape: shapeProps,\n      size = 'm',\n      className,\n      onSelectedChange,\n      ...rest\n    },\n    forwardedRef\n  ) {\n    const { shape: shapeContext } = useToggleButtonContext()\n    const shape = shapeProps ?? shapeContext ?? 'capsule'\n    const Comp = as as typeof BaseButton\n    const ICON_SIZE = 's'\n\n    return (\n      <TogglePrimitive.Root\n        asChild\n        onPressedChange={onSelectedChange}\n        {...rest}\n      >\n        <Comp\n          ref={forwardedRef}\n          className={classNames(\n            styles.Button,\n            styles[`size-${size}`],\n            styles[`variant-${variant}`],\n            shape && styles[`shape-${shape}`],\n            className\n          )}\n        >\n          <div className={classNames(styles.ButtonContent)}>\n            <SideContent\n              size={ICON_SIZE}\n              content={prefixContent}\n            />\n\n            {/* TODO: use AlphaText later, add typo */}\n            <Text\n              className={styles.ButtonText}\n              typo=\"14\"\n              data-text={text}\n              truncated\n            >\n              {text}\n            </Text>\n\n            <SideContent\n              size={ICON_SIZE}\n              content={suffixContent}\n            />\n          </div>\n        </Comp>\n      </TogglePrimitive.Root>\n    )\n  }\n)\n"],"names":["SideContent","size","content","isBezierIcon","_jsx","Icon","source","className","styles","ButtonIcon","ToggleButton","forwardRef","as","BaseButton","text","prefixContent","suffixContent","variant","shape","shapeProps","onSelectedChange","rest","forwardedRef","_ref","shapeContext","useToggleButtonContext","Comp","ICON_SIZE","TogglePrimitive","asChild","onPressedChange","children","ref","classNames","Button","_jsxs","ButtonContent","Text","ButtonText","typo","truncated"],"mappings":";;;;;;;;;;;AAiBA,SAASA,WAAWA,CAAC;EACnBC,IAAI;AACJC,EAAAA;AAIF,CAAC,EAAE;AACD,EAAA,OAAOC,YAAY,CAACD,OAAO,CAAC,gBAC1BE,GAAA,CAACC,IAAI,EAAA;AACHC,IAAAA,MAAM,EAAEJ,OAAQ;AAChBD,IAAAA,IAAI,EAAEA,IAAK;IACXM,SAAS,EAAEC,MAAM,CAACC;GACnB,CAAC,GAEFP,OACD;AACH;MAEaQ,YAAY,gBAAGC,UAAU,CACpC,SAASD,YAAYA,CACnB;AACEE,EAAAA,EAAE,GAAGC,UAAU;EACfC,IAAI;EACJC,aAAa;EACbC,aAAa;AACbC,EAAAA,OAAO,GAAG,SAAS;AACnBC,EAAAA,KAAK,EAAEC,UAAU;AACjBlB,EAAAA,IAAI,GAAG,GAAG;EACVM,SAAS;EACTa,gBAAgB;EAChB,GAAGC;AACL,CAAC,EACDC,YAAY,EACZ;AAAA,EAAA,IAAAC,IAAA;EACA,MAAM;AAAEL,IAAAA,KAAK,EAAEM;GAAc,GAAGC,sBAAsB,EAAE;AACxD,EAAA,MAAMP,KAAK,GAAAK,CAAAA,IAAA,GAAGJ,UAAU,aAAVA,UAAU,KAAA,KAAA,CAAA,GAAVA,UAAU,GAAIK,YAAY,MAAAD,IAAAA,IAAAA,IAAA,KAAAA,KAAAA,CAAAA,GAAAA,IAAA,GAAI,SAAS;EACrD,MAAMG,IAAI,GAAGd,EAAuB;EACpC,MAAMe,SAAS,GAAG,GAAG;AAErB,EAAA,oBACEvB,GAAA,CAACwB,IAAoB,EAAA;IACnBC,OAAO,EAAA,IAAA;AACPC,IAAAA,eAAe,EAAEV,gBAAiB;AAAA,IAAA,GAC9BC,IAAI;IAAAU,QAAA,eAER3B,GAAA,CAACsB,IAAI,EAAA;AACHM,MAAAA,GAAG,EAAEV,YAAa;AAClBf,MAAAA,SAAS,EAAE0B,UAAU,CACnBzB,MAAM,CAAC0B,MAAM,EACb1B,MAAM,CAAC,CAAA,KAAA,EAAQP,IAAI,CAAA,CAAE,CAAC,EACtBO,MAAM,CAAC,CAAA,QAAA,EAAWS,OAAO,CAAA,CAAE,CAAC,EAC5BC,KAAK,IAAIV,MAAM,CAAC,CAAA,MAAA,EAASU,KAAK,CAAA,CAAE,CAAC,EACjCX,SACF,CAAE;AAAAwB,MAAAA,QAAA,eAEFI,IAAA,CAAA,KAAA,EAAA;AAAK5B,QAAAA,SAAS,EAAE0B,UAAU,CAACzB,MAAM,CAAC4B,aAAa,CAAE;QAAAL,QAAA,EAAA,cAC/C3B,GAAA,CAACJ,WAAW,EAAA;AACVC,UAAAA,IAAI,EAAE0B,SAAU;AAChBzB,UAAAA,OAAO,EAAEa;AAAc,SACxB,CAAC,eAGFX,GAAA,CAACiC,IAAI,EAAA;UACH9B,SAAS,EAAEC,MAAM,CAAC8B,UAAW;AAC7BC,UAAAA,IAAI,EAAC,IAAI;AACT,UAAA,WAAA,EAAWzB,IAAK;UAChB0B,SAAS,EAAA,IAAA;AAAAT,UAAAA,QAAA,EAERjB;AAAI,SACD,CAAC,eAEPV,GAAA,CAACJ,WAAW,EAAA;AACVC,UAAAA,IAAI,EAAE0B,SAAU;AAChBzB,UAAAA,OAAO,EAAEc;AAAc,SACxB,CAAC;OACC;KACD;AAAC,GACa,CAAC;AAE3B,CACF;;;;"}