{"version":3,"file":"Tabs.mjs","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["'use client'\n\nimport { type JSX, forwardRef, useMemo, useRef } from 'react'\nimport * as React from 'react'\n\nimport { OpenInNewIcon } from '@channel.io/bezier-icons'\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport * as ToolbarPrimitive from '@radix-ui/react-toolbar'\nimport classNames from 'classnames'\n\nimport useElementTruncated from '~/src/hooks/useElementTruncated'\nimport { createContext } from '~/src/utils/react'\nimport { isNil } from '~/src/utils/type'\n\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Icon } from '~/src/components/Icon'\nimport {\n  type TabActionElement,\n  type TabActionProps,\n  type TabActionsProps,\n  type TabContentProps,\n  type TabItemProps,\n  type TabItemsProps,\n  type TabListContextValue,\n  type TabListProps,\n  type TabSize,\n  type TabsProps,\n} from '~/src/components/Tabs/Tabs.types'\nimport { Text } from '~/src/components/Text'\nimport { Tooltip } from '~/src/components/Tooltip'\n\nimport styles from './Tabs.module.scss'\n\n/**\n * `Tabs` is a set of layered section of content.\n *\n * `Tabs` is a context of the Tab-related components and gives accessibility properties to Tab-related components.\n * @example\n *\n * ```tsx\n * <Tabs>\n *  <TabList>\n *    <TabItems>\n *      <TabItem />\n *    <TabItems />\n *    <TabActions>\n *      <TabAction />\n *    </TabActions>\n *  </TabList>\n *  <TabContent />\n * </Tabs>\n * ```\n */\n\nexport const Tabs = forwardRef<HTMLDivElement, TabsProps>(function Tabs(\n  { className, activationMode = 'automatic', dir, children, ...rest },\n  forwardedRef\n) {\n  return (\n    <TabsPrimitive.Root\n      className={classNames(styles.Tabs, className)}\n      activationMode={activationMode}\n      ref={forwardedRef}\n      dir={dir as 'ltr' | 'rtl'}\n      {...rest}\n    >\n      {children}\n    </TabsPrimitive.Root>\n  )\n})\n\nconst [TabListContextProvider, useTabListContext] =\n  createContext<TabListContextValue>({\n    size: 'm',\n  })\n\n/**\n * `TabList` gives size context to its children and decides the layout of `TabItems` and `TabActions`.\n */\nexport const TabList = forwardRef<HTMLDivElement, TabListProps>(\n  function TabList({ className, children, size = 'm', ...rest }, forwardedRef) {\n    const heightContextValue = useMemo(\n      () => ({\n        size,\n      }),\n      [size]\n    )\n\n    return (\n      <TabListContextProvider value={heightContextValue}>\n        <div\n          className={classNames(\n            styles.TabList,\n            styles[`size-${size}`],\n            className\n          )}\n          ref={forwardedRef}\n          {...rest}\n        >\n          {children}\n        </div>\n      </TabListContextProvider>\n    )\n  }\n)\n\n/**\n * `TabItems` is a flex container which has `TabItem` flex items.\n */\nexport const TabItems = forwardRef<HTMLDivElement, TabItemsProps>(\n  function TabItems({ className, children, ...rest }, forwardedRef) {\n    return (\n      <TabsPrimitive.TabsList\n        className={classNames(styles.TabItems, className)}\n        ref={forwardedRef}\n        {...rest}\n      >\n        {children}\n      </TabsPrimitive.TabsList>\n    )\n  }\n)\n\nfunction getButtonSizeBy(size: TabSize) {\n  return (\n    {\n      l: 'l',\n      m: 'm',\n      s: 's',\n    } as const\n  )[size]\n}\n\nfunction getTypography(size: TabSize) {\n  return (\n    {\n      s: '13',\n      m: '14',\n      l: '15',\n    } as const\n  )[size]\n}\n\nconst TabItemButton = forwardRef<HTMLButtonElement, TabItemProps>(\n  function TabItemButton(\n    { className, disabled, value, children, maxWidth, style, ...rest },\n    forwardedRef\n  ) {\n    const contentRef = useRef<HTMLElement>(null)\n    const isTruncated = useElementTruncated(contentRef)\n\n    const { size } = useTabListContext()\n\n    return (\n      <Tooltip\n        content={children}\n        disabled={!isTruncated}\n        offset={6}\n      >\n        <BaseButton\n          className={classNames(\n            styles.TabItemButton,\n            styles[`size-${getButtonSizeBy(size)}`],\n            className\n          )}\n          disabled={disabled}\n          ref={forwardedRef}\n          style={{ maxWidth, ...style }}\n          {...rest}\n        >\n          <Text\n            ref={contentRef}\n            className={styles.TabItemButtonText}\n            typo={getTypography(size)}\n            bold\n            truncated\n          >\n            {children}\n          </Text>\n        </BaseButton>\n      </Tooltip>\n    )\n  }\n)\n\n/**\n * `TabItem` is a button that activates its associated content.\n */\nexport const TabItem = forwardRef<HTMLButtonElement, TabItemProps>(\n  function TabItem(\n    { className, disabled, value, children, maxWidth, style, ...rest },\n    forwardedRef\n  ) {\n    if (typeof children !== 'string') {\n      return null\n    }\n\n    return (\n      <TabsPrimitive.TabsTrigger\n        disabled={disabled}\n        value={value}\n        asChild\n      >\n        <TabItemButton\n          ref={forwardedRef}\n          className={className}\n          disabled={disabled}\n          value={value}\n          maxWidth={maxWidth}\n          style={style}\n          {...rest}\n        >\n          {children}\n        </TabItemButton>\n      </TabsPrimitive.TabsTrigger>\n    )\n  }\n)\n\n/**\n * `TabContent` has content associated with `TabItem`.\n */\nexport const TabContent = forwardRef<HTMLDivElement, TabContentProps>(\n  function TabContent({ children, value, ...rest }, forwardedRef) {\n    return (\n      <TabsPrimitive.Content\n        value={value}\n        ref={forwardedRef}\n        {...rest}\n      >\n        {children}\n      </TabsPrimitive.Content>\n    )\n  }\n)\n\n/**\n * `TabActions` is a flex container which has `TabAction` flex items.\n *  It also gives accessibility properties to its children.\n */\nexport const TabActions = forwardRef<HTMLDivElement, TabActionsProps>(\n  function TabActions({ className, dir, children, ...rest }, forwardedRef) {\n    return (\n      <ToolbarPrimitive.Root\n        className={classNames(styles.TabActions, className)}\n        aria-label=\"More actions\"\n        ref={forwardedRef}\n        dir={dir as 'ltr' | 'rtl'}\n        {...rest}\n      >\n        {children}\n      </ToolbarPrimitive.Root>\n    )\n  }\n)\n\nfunction getTypoBy(size: TabSize) {\n  return (\n    {\n      l: '14',\n      m: '14',\n      s: '13',\n    } as const\n  )[size]\n}\n\nfunction getIconSizeBy(size: TabSize) {\n  return (\n    {\n      l: 's',\n      m: 'xs',\n      s: 'xs',\n    } as const\n  )[size]\n}\n\n/**\n * `TabAction` is a button for more action to open a new link or navigate to a different url.\n * If it has `href` props, it should act as a link.\n */\nexport const TabAction = forwardRef<\n  TabActionElement<string | undefined>,\n  TabActionProps<string | undefined>\n>(function TabAction(\n  { className: classNameProp, href, children, onClick, ...rest },\n  forwardedRef\n) {\n  const { size } = useTabListContext()\n  const className = classNames(\n    styles.TabAction,\n    styles[`size-${size}`],\n    classNameProp\n  )\n\n  return isNil(href) ? (\n    <ToolbarPrimitive.Button\n      asChild\n      className={className}\n      onClick={onClick}\n      ref={forwardedRef}\n      {...rest}\n    >\n      <BaseButton>\n        <Text\n          bold\n          typo={getTypoBy(size)}\n        >\n          {children}\n        </Text>\n      </BaseButton>\n    </ToolbarPrimitive.Button>\n  ) : (\n    <ToolbarPrimitive.Link\n      className={className}\n      href={href}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      // @ts-expect-error\n      ref={forwardedRef}\n      {...rest}\n    >\n      <Text\n        bold\n        typo={getTypoBy(size)}\n      >\n        {children}\n      </Text>\n      <Icon\n        source={OpenInNewIcon}\n        size={getIconSizeBy(size)}\n        marginLeft={5}\n      />\n    </ToolbarPrimitive.Link>\n  )\n}) as <Link extends string | undefined>(\n  props: TabActionProps<Link> & {\n    ref?: React.ForwardedRef<TabActionElement<Link>>\n  }\n) => JSX.Element\n"],"names":["Tabs","forwardRef","className","activationMode","dir","children","rest","forwardedRef","_jsx","TabsPrimitive","classNames","styles","ref","TabListContextProvider","useTabListContext","createContext","size","TabList","heightContextValue","useMemo","value","TabItems","getButtonSizeBy","l","m","s","getTypography","TabItemButton","disabled","maxWidth","style","contentRef","useRef","isTruncated","useElementTruncated","Tooltip","content","offset","BaseButton","Text","TabItemButtonText","typo","bold","truncated","TabItem","asChild","TabContent","TabActions","ToolbarPrimitive","getTypoBy","getIconSizeBy","TabAction","classNameProp","href","onClick","isNil","_jsxs","target","rel","Icon","source","OpenInNewIcon","marginLeft"],"mappings":"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"}