@zenkigen-inc/component-ui 1.9.10 → 1.10.0

package/dist/icon/icon.d.ts

@@ -8,6 +8,7 @@ type Props = {
     size?: Size;
     color?: Color;
     isDisabled?: boolean;
+    className?: string;
 };
 export declare const Icon: ({ size, isDisabled, ...props }: Props) => import("react").JSX.Element;
 export {};

package/dist/index.esm.js

@@ -5,29 +5,22 @@ import aa, { useState, useCallback, useEffect, createContext, useContext, useRef
 import { iconElements } from '@zenkigen-inc/component-icons';
 
 function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
     }
-    return target;
-  };
-  return _extends.apply(this, arguments);
+    return n;
+  }, _extends.apply(null, arguments);
 }
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  for (var key in source) {
-    if (Object.prototype.hasOwnProperty.call(source, key)) {
-      if (excluded.indexOf(key) >= 0) continue;
-      target[key] = source[key];
-    }
+function _objectWithoutPropertiesLoose(r, e) {
+  if (null == r) return {};
+  var t = {};
+  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
+    if (e.indexOf(n) >= 0) continue;
+    t[n] = r[n];
   }
-  return target;
+  return t;
 }
 
 var _excluded$8 = ["size"];
@@ -40,11 +33,11 @@ function Avatar(_ref) {
     size = _ref$size === void 0 ? 'medium' : _ref$size,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$8);
   var classes = clsx('flex items-center justify-center rounded-full text-textOnColor', (_clsx = {
-    'w-16 h-16 typography-label1regular': size === 'x-large',
-    'w-12 h-12 typography-label2regular': size === 'large',
-    'w-10 h-10 typography-label2regular': size === 'medium',
-    'w-8 h-8 typography-label4regular': size === 'small',
-    'w-6 h-6 typography-label4regular': size === 'x-small',
+    'w-16 h-16 typography-label16regular': size === 'x-large',
+    'w-12 h-12 typography-label14regular': size === 'large',
+    'w-10 h-10 typography-label14regular': size === 'medium',
+    'w-8 h-8 typography-label11regular': size === 'small',
+    'w-6 h-6 typography-label11regular': size === 'x-small',
     'bg-disabled01': props.isDisabled,
     'bg-icon01': props.userId == null
   }, _clsx[userColors[((_props$userId = props.userId) != null ? _props$userId : 0) % userColors.length]] = props.userId != null && !((_props$isDisabled = props.isDisabled) != null ? _props$isDisabled : false), _clsx));
@@ -70,7 +63,7 @@ function Breadcrumb(_ref) {
   return /*#__PURE__*/jsx("nav", {
     "aria-label": "breadcrumb",
     children: /*#__PURE__*/jsx("ul", {
-      className: "typography-label2regular flex flex-wrap gap-2 whitespace-nowrap text-text01",
+      className: "typography-label14regular flex flex-wrap gap-2 whitespace-nowrap text-text01",
       children: children
     })
   });
@@ -99,7 +92,7 @@ var Button = function Button(_ref) {
     'h-8 px-3': size === 'medium',
     'h-10 px-4 leading-[24px]': size === 'large',
     'inline-flex': elementAs === 'a'
-  }, _clsx[buttonColors[variant].selected] = isSelected, _clsx[buttonColors[variant].base] = !isSelected, _clsx['hover:text-textOnColor active:text-textOnColor [&:hover>*]:fill-iconOnColor [&:active>*]:fill-iconOnColor'] = isSelected && variant !== 'outline' && variant !== 'text', _clsx['pointer-events-none'] = isDisabled, _clsx['rounded-button'] = borderRadius == null, _clsx['typography-label1regular'] = size === 'large', _clsx['typography-label2regular'] = size !== 'large', _clsx));
+  }, _clsx[buttonColors[variant].selected] = isSelected, _clsx[buttonColors[variant].base] = !isSelected, _clsx['hover:text-textOnColor active:text-textOnColor [&:hover>*]:fill-iconOnColor [&:active>*]:fill-iconOnColor'] = isSelected && variant !== 'outline' && variant !== 'text', _clsx['pointer-events-none'] = isDisabled, _clsx['rounded-button'] = borderRadius == null, _clsx['typography-label16regular'] = size === 'large', _clsx['typography-label14regular'] = size !== 'large', _clsx));
   var Component = elementAs != null ? elementAs : 'button';
   return /*#__PURE__*/jsxs(Component, _extends({
     className: baseClasses,
@@ -193,7 +186,7 @@ function Checkbox(_ref) {
   var hoverIndicatorClasses = clsx$1('inline-block size-3 rounded-[1px]', {
     'bg-hoverUi': !isDisabled && !isChecked && isMouseOver
   });
-  var labelClasses = clsx$1('typography-label2regular ml-2 flex-[1_0_0] break-all', {
+  var labelClasses = clsx$1('typography-label14regular ml-2 flex-[1_0_0] break-all', {
     'pointer-events-none cursor-not-allowed text-disabled01': isDisabled,
     'cursor-pointer text-text01': !isDisabled
   });
@@ -31176,7 +31169,7 @@ var Icon = function Icon(_ref) {
     props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
   var classes = clsx('inline-block shrink-0', (_clsx = {
     'fill-disabled01': isDisabled
-  }, _clsx[iconColors.icon01] = !isDisabled && props.color === 'icon01', _clsx[iconColors.icon01Dark] = !isDisabled && props.color === 'icon01Dark', _clsx[iconColors.icon02] = !isDisabled && props.color === 'icon02', _clsx[iconColors.icon02Dark] = !isDisabled && props.color === 'icon02Dark', _clsx[iconColors.icon03] = !isDisabled && props.color === 'icon03', _clsx[iconColors.icon03Dark] = !isDisabled && props.color === 'icon03Dark', _clsx[iconColors.iconOnColor] = !isDisabled && props.color === 'iconOnColor', _clsx['w-3 h-3'] = size === 'x-small', _clsx['w-4 h-4'] = size === 'small', _clsx['w-6 h-6'] = size === 'medium', _clsx['w-8 h-8'] = size === 'large', _clsx['w-10 h-10'] = size === 'x-large', _clsx));
+  }, _clsx[iconColors.icon01] = !isDisabled && props.color === 'icon01', _clsx[iconColors.icon01Dark] = !isDisabled && props.color === 'icon01Dark', _clsx[iconColors.icon02] = !isDisabled && props.color === 'icon02', _clsx[iconColors.icon02Dark] = !isDisabled && props.color === 'icon02Dark', _clsx[iconColors.icon03] = !isDisabled && props.color === 'icon03', _clsx[iconColors.icon03Dark] = !isDisabled && props.color === 'icon03Dark', _clsx[iconColors.iconOnColor] = !isDisabled && props.color === 'iconOnColor', _clsx['w-3 h-3'] = size === 'x-small', _clsx['w-4 h-4'] = size === 'small', _clsx['w-6 h-6'] = size === 'medium', _clsx['w-8 h-8'] = size === 'large', _clsx['w-10 h-10'] = size === 'x-large', _clsx), props.className);
   return /*#__PURE__*/jsx("span", {
     className: classes,
     children: iconElements[props.name]
@@ -31207,7 +31200,7 @@ function DropdownItem(_ref) {
     setIsVisible(false);
     onClick && onClick(event);
   };
-  var itemClasses = clsx$1('typography-label2regular flex h-8 w-full items-center px-3 hover:bg-hover02 active:bg-active02', focusVisible.inset, {
+  var itemClasses = clsx$1('typography-label14regular flex h-8 w-full items-center px-3 hover:bg-hover02 active:bg-active02', focusVisible.inset, {
     'bg-uiBackground01 fill-icon01 text-interactive02': color === 'gray',
     'fill-supportDanger text-supportDanger': color === 'red'
   });
@@ -31316,9 +31309,9 @@ function Dropdown(_ref) {
   var labelClasses = clsx$1('flex items-center', {
     'mr-1': !isArrowHidden && size === 'x-small',
     'mr-2': !isArrowHidden && size !== 'x-small',
-    'typography-label3regular': size === 'x-small',
-    'typography-label2regular': size === 'small' || size === 'medium',
-    'typography-label1regular': size === 'large'
+    'typography-label12regular': size === 'x-small',
+    'typography-label14regular': size === 'small' || size === 'medium',
+    'typography-label16regular': size === 'large'
   });
   return /*#__PURE__*/jsx(DropdownContext.Provider, {
     value: {
@@ -31442,7 +31435,7 @@ function IconButton(_ref) {
     _ref$isDisabled = _ref.isDisabled,
     isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
-  var baseClasses = clsx('typography-label1regular flex items-center justify-center gap-1 rounded', buttonColors[variant].base, buttonColors[variant].hover, buttonColors[variant].active, buttonColors[variant].disabled, focusVisible.normal, {
+  var baseClasses = clsx('typography-label16regular flex items-center justify-center gap-1 rounded', buttonColors[variant].base, buttonColors[variant].hover, buttonColors[variant].active, buttonColors[variant].disabled, focusVisible.normal, {
     'h-4 w-4': size === 'small' && isNoPadding,
     'h-6 w-6': size === 'small' && !isNoPadding || (size === 'medium' || size === 'large') && isNoPadding,
     'h-8 w-8': size === 'medium' && !isNoPadding,
@@ -31638,7 +31631,7 @@ function NotificationInline(_ref) {
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'medium' : _ref$size,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
-  var wrapperClasses = clsx('typography-body2regular flex items-center gap-1 rounded text-text01', {
+  var wrapperClasses = clsx('typography-body13regular flex items-center gap-1 rounded text-text01', {
     'bg-uiBackgroundError': state === 'attention',
     'bg-uiBackgroundWarning': state === 'warning',
     'bg-uiBackgroundBlue': state === 'information',
@@ -31694,8 +31687,14 @@ function PaginationButton(_ref) {
     _onClick = _ref.onClick;
   var _useContext = useContext(PaginationContext),
     currentPage = _useContext.currentPage;
-  return /*#__PURE__*/jsx(Button, {
-    variant: page === currentPage ? 'outline' : 'text',
+  var buttonClasses = clsx('flex h-8 min-w-8 items-center justify-center rounded fill-icon01 px-1', 'typography-label14regular', 'text-interactive02', 'hover:bg-hover02', {
+    'border border-uiBorder02': page === currentPage
+  }, {
+    'border-transparent': page !== currentPage
+  });
+  return /*#__PURE__*/jsx("button", {
+    type: "button",
+    className: buttonClasses,
     onClick: function onClick() {
       return _onClick(page);
     },
@@ -31726,13 +31725,14 @@ function Pagination(_ref) {
       currentPage: currentPage
     },
     children: /*#__PURE__*/jsxs("ul", {
-      className: "flex gap-2",
+      className: "flex gap-1",
       children: [/*#__PURE__*/jsx("li", {
+        className: "flex items-center",
         children: /*#__PURE__*/jsx(IconButton, {
           isDisabled: currentPage === START_PAGE,
           variant: "text",
           icon: "angle-left",
-          size: "medium",
+          size: "small",
           onClick: function onClick() {
             return _onClick(currentPage - 1);
           }
@@ -31773,11 +31773,12 @@ function Pagination(_ref) {
           page: totalPage
         })
       }), /*#__PURE__*/jsx("li", {
+        className: "flex items-center",
         children: /*#__PURE__*/jsx(IconButton, {
           isDisabled: currentPage === totalPage,
           variant: "text",
           icon: "angle-right",
-          size: "medium",
+          size: "small",
           onClick: function onClick() {
             return _onClick(currentPage + 1);
           }
@@ -31805,7 +31806,7 @@ function SelectItem$1(_ref) {
     onChange == null || onChange(option);
     setIsOptionListOpen(false);
   };
-  var itemClasses = clsx$1('typography-label2regular flex h-8 w-full items-center px-3 hover:bg-hover02 active:bg-active02', focusVisible.inset, {
+  var itemClasses = clsx$1('typography-label14regular flex h-8 w-full items-center px-3 hover:bg-hover02 active:bg-active02', focusVisible.inset, {
     'text-interactive01 fill-interactive01 bg-selectedUi': option.id === (selectedOption == null ? void 0 : selectedOption.id),
     'text-interactive02 fill-icon01 bg-uiBackground01': option.id !== (selectedOption == null ? void 0 : selectedOption.id)
   });
@@ -31870,7 +31871,7 @@ function SelectList$1(_ref) {
     'top-11': size === 'large',
     'border-solid border border-uiBorder01': variant === 'outline'
   });
-  var deselectButtonClasses = clsx$1('typography-label2regular flex h-8 w-full items-center px-3 text-interactive02 hover:bg-hover02 active:bg-active02', focusVisible.inset);
+  var deselectButtonClasses = clsx$1('typography-label14regular flex h-8 w-full items-center px-3 text-interactive02 hover:bg-hover02 active:bg-active02', focusVisible.inset);
   return /*#__PURE__*/jsxs("ul", {
     className: listClasses,
     style: {
@@ -31929,9 +31930,9 @@ function Select(_ref) {
   var labelClasses = clsx$1('overflow-hidden', {
     'mr-1': size === 'x-small',
     'mr-2': size !== 'x-small',
-    'typography-label3regular': size === 'x-small',
-    'typography-label2regular': size === 'small' || size === 'medium',
-    'typography-label1regular': size === 'large'
+    'typography-label12regular': size === 'x-small',
+    'typography-label14regular': size === 'small' || size === 'medium',
+    'typography-label16regular': size === 'large'
   });
   return /*#__PURE__*/jsx(SelectContext.Provider, {
     value: {
@@ -32018,7 +32019,7 @@ function PaginationSelect(_ref) {
     children: [/*#__PURE__*/jsxs("div", {
       className: "flex items-center gap-x-2",
       children: [/*#__PURE__*/jsxs("div", {
-        className: "typography-label2regular text-text01",
+        className: "typography-label14regular text-text01",
         children: [minCount > 0 && minCount + " - ", maxCount, countLabel]
       }), /*#__PURE__*/jsx(Select, {
         size: "medium",
@@ -32037,7 +32038,7 @@ function PaginationSelect(_ref) {
           }, option.id);
         })
       }), /*#__PURE__*/jsxs("div", {
-        className: "typography-label2regular text-text03",
+        className: "typography-label14regular text-text03",
         children: ["/ ", pageMax, pageLabel]
       })]
     }), /*#__PURE__*/jsxs("div", {
@@ -32101,7 +32102,7 @@ function Radio(_ref) {
   var hoverIndicatorClasses = clsx$1('inline-block size-3 rounded-full', {
     'bg-hoverUi': !isDisabled && !isChecked && isMouseOver
   });
-  var labelClasses = clsx$1('typography-label2regular ml-2 flex-[1_0_0] select-none break-all', {
+  var labelClasses = clsx$1('typography-label14regular ml-2 flex-[1_0_0] select-none break-all', {
     'pointer-events-none cursor-not-allowed text-disabled01': isDisabled,
     'cursor-pointer text-text01': !isDisabled
   });
@@ -32152,7 +32153,7 @@ var Search = /*#__PURE__*/forwardRef(function (_ref, ref) {
   }, {
     'h-10 px-4': size === 'large'
   });
-  var inputClasses = clsx('mx-2.5 h-full flex-1 text-text01 outline-0 placeholder:text-textPlaceholder', (_clsx = {}, _clsx['typography-label2regular'] = size === 'medium', _clsx['typography-label1regular'] = size === 'large', _clsx));
+  var inputClasses = clsx('mx-2.5 h-full flex-1 text-text01 outline-0 placeholder:text-textPlaceholder', (_clsx = {}, _clsx['typography-label14regular'] = size === 'medium', _clsx['typography-label16regular'] = size === 'large', _clsx));
   return /*#__PURE__*/jsx("div", {
     className: "relative",
     ref: ref,
@@ -32191,7 +32192,7 @@ function SelectItem(_ref) {
   var children = _ref.children,
     isSortKey = _ref.isSortKey,
     onClickItem = _ref.onClickItem;
-  var itemClasses = clsx$1('typography-label2regular flex h-8 w-full items-center px-3 hover:bg-hover02 active:bg-active02', focusVisible.inset, {
+  var itemClasses = clsx$1('typography-label14regular flex h-8 w-full items-center px-3 hover:bg-hover02 active:bg-active02', focusVisible.inset, {
     'bg-selectedUi fill-interactive01 text-interactive01': isSortKey,
     'bg-uiBackground01 fill-icon01 text-interactive02': !isSortKey
   });
@@ -32227,7 +32228,7 @@ function SelectList(_ref) {
     'top-11': size === 'large',
     'border-solid border border-uiBorder01': variant === 'outline'
   });
-  var deselectButtonClasses = clsx$1('typography-label2regular flex h-8 w-full items-center px-3 text-interactive02 hover:bg-hover02 active:bg-active02', focusVisible.inset);
+  var deselectButtonClasses = clsx$1('typography-label14regular flex h-8 w-full items-center px-3 text-interactive02 hover:bg-hover02 active:bg-active02', focusVisible.inset);
   return /*#__PURE__*/jsxs("ul", {
     className: listClasses,
     children: [/*#__PURE__*/jsx(SelectItem, {
@@ -32292,9 +32293,9 @@ function SelectSort(_ref) {
   });
   var buttonClasses = clsx$1('flex size-full items-center rounded', buttonColors[variant].hover, buttonColors[variant].active, buttonColors[variant].disabled, focusVisible.normal, (_clsx = {}, _clsx[buttonColors[variant].selected] = isSortKey, _clsx[buttonColors[variant].base] = !isSortKey, _clsx['px-2'] = size === 'x-small' || size === 'small', _clsx['px-4'] = size === 'medium' || size === 'large', _clsx['pointer-events-none'] = isDisabled, _clsx));
   var labelClasses = clsx$1('truncate', {
-    'typography-label3regular': size === 'x-small',
-    'typography-label2regular': size === 'small' || size === 'medium',
-    'typography-label1regular': size === 'large',
+    'typography-label12regular': size === 'x-small',
+    'typography-label14regular': size === 'small' || size === 'medium',
+    'typography-label16regular': size === 'large',
     'mr-1': size === 'x-small',
     'mr-2': size !== 'x-small'
   });
@@ -32338,9 +32339,9 @@ var TabItem = function TabItem(_ref) {
     isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
   var classes = clsx('relative z-0 flex py-2 leading-[24px] before:absolute before:inset-x-0 before:bottom-0 before:h-px hover:text-text01 disabled:pointer-events-none disabled:text-disabled01', {
-    'typography-label2regular': !isSelected,
+    'typography-label14regular': !isSelected,
     'text-interactive02 hover:before:bg-uiBorder02Dark': !isSelected,
-    'typography-label2bold': isSelected,
+    'typography-label14bold': isSelected,
     'before:bg-interactive01 hover:before:bg-interactive01 pointer-events-none': isSelected
   });
   return /*#__PURE__*/jsx("button", {
@@ -32445,7 +32446,7 @@ function Tag(_ref) {
     size = _ref$size === void 0 ? 'medium' : _ref$size,
     isEditable = _ref.isEditable,
     onDelete = _ref.onDelete;
-  var wrapperClasses = clsx$1('flex', 'items-center', 'justify-center', (_clsx = {}, _clsx[tagColors[color]] = variant === 'normal', _clsx[tagLightColors[color]] = variant === 'light', _clsx['h-[14px] typography-label4regular'] = !isEditable && size === 'x-small', _clsx['h-4 typography-label3regular'] = !isEditable && size === 'small', _clsx['h-[18px] typography-label2regular'] = !isEditable && size === 'medium', _clsx['h-[22px] typography-label2regular'] = isEditable && size === 'medium', _clsx['rounded-full'] = isEditable, _clsx.rounded = !isEditable, _clsx['py-0.5 px-1'] = !isEditable, _clsx['py-1 px-2'] = isEditable, _clsx));
+  var wrapperClasses = clsx$1('flex', 'items-center', 'justify-center', (_clsx = {}, _clsx[tagColors[color]] = variant === 'normal', _clsx[tagLightColors[color]] = variant === 'light', _clsx['h-[14px] typography-label11regular'] = !isEditable && size === 'x-small', _clsx['h-4 typography-label12regular'] = !isEditable && size === 'small', _clsx['h-[18px] typography-label14regular'] = !isEditable && size === 'medium', _clsx['h-[22px] typography-label14regular'] = isEditable && size === 'medium', _clsx['rounded-full'] = isEditable, _clsx.rounded = !isEditable, _clsx['py-0.5 px-1'] = !isEditable, _clsx['py-1 px-2'] = isEditable, _clsx));
   return /*#__PURE__*/jsxs("div", {
     className: wrapperClasses,
     children: [children, isEditable ? /*#__PURE__*/jsx(DeleteIcon, {
@@ -32473,9 +32474,9 @@ var TextArea = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var classes = clsx('w-full rounded border outline-0 placeholder:text-textPlaceholder disabled:text-textPlaceholder', (_clsx = {
     'border-supportError': isError && !disabled,
     'hover:border-hoverInput': !disabled && !isError,
-    'border-uiBorder01 hover:focus-within:border-activeInput focus-within:border-activeInput text-text01': !isError,
+    'border-uiBorder02 hover:focus-within:border-activeInput focus-within:border-activeInput text-text01': !isError,
     'bg-disabled02 border-disabled01': disabled
-  }, _clsx['typography-body1regular px-2 pt-1.5 pb-2'] = size === 'medium', _clsx['text-4 px-3.5 py-2.5'] = size === 'large', _clsx['text-supportError'] = isError, _clsx['resize-none'] = !isResizable, _clsx));
+  }, _clsx['typography-body14regular px-2 pt-1.5 pb-2'] = size === 'medium', _clsx['text-4 leading-normal px-3.5 py-2.5'] = size === 'large', _clsx['text-supportError'] = isError, _clsx['resize-none'] = !isResizable, _clsx));
   return /*#__PURE__*/jsx("div", {
     className: "flex",
     children: /*#__PURE__*/jsx("textarea", _extends({
@@ -32503,14 +32504,14 @@ var TextInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onClickClearButton = _ref.onClickClearButton,
     props = _objectWithoutPropertiesLoose(_ref, _excluded);
   var inputWrapClasses = clsx('relative flex items-center gap-2 overflow-hidden rounded border', {
-    'border-uiBorder01': !isError,
+    'border-uiBorder02': !isError && !disabled,
     'border-supportError': isError && !disabled,
     'hover:border-hoverInput': !disabled && !isError,
     'hover:focus-within:border-activeInput': !isError,
     'focus-within:border-activeInput': !isError,
     'bg-disabled02 border-disabled01': disabled
   });
-  var inputClasses = clsx('flex-1 pl-2 pr-3 outline-0 placeholder:text-textPlaceholder disabled:text-textPlaceholder', (_clsx = {}, _clsx['typography-label2regular pt-1.5 pb-2'] = size === 'medium', _clsx['typography-label1regular py-2.5'] = size === 'large', _clsx['text-text01'] = !isError, _clsx['text-supportError'] = isError, _clsx));
+  var inputClasses = clsx('flex-1 pl-2 pr-3 outline-0 placeholder:text-textPlaceholder disabled:text-textPlaceholder', (_clsx = {}, _clsx['typography-label14regular min-h-8'] = size === 'medium', _clsx['typography-label16regular min-h-10'] = size === 'large', _clsx['text-text01'] = !isError, _clsx['text-supportError'] = isError, _clsx));
   return /*#__PURE__*/jsxs("div", {
     className: inputWrapClasses,
     children: [/*#__PURE__*/jsx("input", _extends({
@@ -32566,7 +32567,7 @@ function Toast(_ref) {
     'fill-supportWarning': state === 'warning',
     'fill-supportInfo': state === 'information'
   });
-  var textClasses = clsx$1('typography-body2regular flex-1 pt-[3px]', {
+  var textClasses = clsx$1('typography-body13regular flex-1 pt-[3px]', {
     'text-supportError': state === 'error',
     'text-text01': state === 'success' || state === 'warning' || state === 'information'
   });
@@ -32697,8 +32698,8 @@ function Toggle(_ref) {
   var labelClasses = clsx$1('break-all', {
     'mr-2': labelPosition === 'left',
     'ml-2': labelPosition === 'right',
-    'typography-label3regular': size === 'small',
-    'typography-label1regular': size === 'medium',
+    'typography-label12regular': size === 'small',
+    'typography-label16regular': size === 'medium',
     'pointer-events-none cursor-not-allowed text-disabled01': isDisabled,
     'cursor-pointer text-text01': !isDisabled
   });
@@ -32839,8 +32840,8 @@ var TooltipContent = function TooltipContent(_ref) {
     'w-[46px]': size !== 'small'
   });
   var tooltipBodyClasses = clsx$1('absolute z-tooltip inline-block w-max rounded bg-uiBackgroundTooltip text-textOnColor', {
-    'typography-body3regular': size === 'small',
-    'typography-body2regular': size === 'medium',
+    'typography-body12regular': size === 'small',
+    'typography-body13regular': size === 'medium',
     'px-2 pb-1 pt-1.5': size === 'small',
     'px-4 py-3': size === 'medium',
     'bottom-2': verticalPosition !== 'bottom' && size === 'small',