npm - @channel.io/bezier-react - Versions diffs - 3.3.1 → 3.4.1 - Mend

@channel.io/bezier-react 3.3.1 → 3.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (35) hide show

package/dist/cjs/components/SegmentedControl/SegmentedControl.js CHANGED Viewed

@@ -11,10 +11,10 @@ var type = require('../../utils/type.js');
 var Divider_module = require('../Divider/Divider.module.scss.js');
 var SegmentedControl_module = require('./SegmentedControl.module.scss.js');
 var jsxRuntime = require('react/jsx-runtime');
-var Divider = require('../Divider/Divider.js');
 var BaseButton = require('../BaseButton/BaseButton.js');
 var Stack = require('../Stack/Stack.js');
 var Text = require('../Text/Text.js');
+var Divider = require('../Divider/Divider.js');
 var FormControl = require('../FormControl/FormControl.js');
 function _interopNamespaceDefault(e) {
@@ -39,6 +39,17 @@ var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 const [SegmentedControlContextProvider, useSegmentedControlContext] = react.createContext(null, 'SegmentedControl');
 const [SegmentedControlItemContextProvider, useSegmentedControlItemContext] = react.createContext(null, 'SegmentedControlItem');
 const [SegmentedControlItemListContextProvider, useSegmentedControlItemListContext] = react.createContext(null, 'SegmentedControlItemList');
+function SegmentedControlDivider({
+  index,
+  selectedItemIndex
+}) {
+  const isAdjacentToSelectedItem = !type.isNil(selectedItemIndex) && (selectedItemIndex + 1 === index || selectedItemIndex === index);
+  return /*#__PURE__*/jsxRuntime.jsx(Divider.Divider, {
+    className: index$1.default(SegmentedControl_module.default.SegmentedControlDivider, isAdjacentToSelectedItem && SegmentedControl_module.default.hidden),
+    withoutParallelIndent: true,
+    orientation: "vertical"
+  });
+}
 function SegmentedControlItemListImpl({
   children,
   style: style$1,
@@ -70,9 +81,9 @@ function SegmentedControlItemListImpl({
       children: /*#__PURE__*/jsxRuntime.jsxs(SegmentedControlItemListContextProvider, {
         value: contextValue,
         children: [React__namespace.Children.map(children, (child, index) => /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [index !== 0 && /*#__PURE__*/jsxRuntime.jsx(Divider.Divider, {
-            withoutParallelIndent: true,
-            orientation: "vertical"
+          children: [index !== 0 && /*#__PURE__*/jsxRuntime.jsx(SegmentedControlDivider, {
+            index: index,
+            selectedItemIndex: selectedItemIndex
           }), /*#__PURE__*/jsxRuntime.jsx(SegmentedControlItemContextProvider, {
             value: index,
             children: child

package/dist/cjs/components/SegmentedControl/SegmentedControl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SegmentedControl.js","sources":["../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ForwardedRef,\n type JSX,\n forwardRef,\n useEffect,\n useMemo,\n useState,\n} from 'react'\nimport * as React from 'react'\n\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport classNames from 'classnames'\n\nimport { ariaAttr } from '~/src/utils/aria'\nimport { createContext } from '~/src/utils/react'\nimport { cssDimension } from '~/src/utils/style'\nimport { isNil } from '~/src/utils/type'\n\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Divider } from '~/src/components/Divider'\nimport dividerStyles from '~/src/components/Divider/Divider.module.scss'\nimport { useFormFieldProps } from '~/src/components/FormControl'\nimport { HStack } from '~/src/components/Stack'\nimport { Text } from '~/src/components/Text'\n\nimport {\n type SegmentedControlItemListProps,\n type SegmentedControlItemProps,\n type SegmentedControlProps,\n type SegmentedControlRadioGroupProps,\n type SegmentedControlSize,\n type SegmentedControlTabContentProps,\n type SegmentedControlTabListProps,\n type SegmentedControlTabsProps,\n type SegmentedControlType,\n} from './SegmentedControl.types'\n\nimport styles from './SegmentedControl.module.scss'\n\ntype SegmentedControlContextValue = Required<\n Pick<\n SegmentedControlProps<SegmentedControlType, string>,\n 'type' \| 'size' \| 'width'\n >\n>\n\nconst [SegmentedControlContextProvider, useSegmentedControlContext] =\n createContext<SegmentedControlContextValue \| null>(null, 'SegmentedControl')\n\ntype SegmentedControlItemListContextValue = {\n setSelectedItemIndex: (index: number \| null) => void\n}\n\nconst [SegmentedControlItemContextProvider, useSegmentedControlItemContext] =\n createContext<number \| null>(null, 'SegmentedControlItem')\n\nconst [\n SegmentedControlItemListContextProvider,\n useSegmentedControlItemListContext,\n] = createContext<SegmentedControlItemListContextValue \| null>(\n null,\n 'SegmentedControlItemList'\n)\n\nfunction SegmentedControlItemListImpl<\n Type extends SegmentedControlType,\n Value extends string,\n>(\n {\n children,\n style,\n className,\n ...rest\n }: SegmentedControlItemListProps<Type, Value>,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const [selectedItemIndex, setSelectedItemIndex] = useState<number \| null>(\n null\n )\n\n const { type, size, width } = useSegmentedControlContext(\n 'SegmentedControlItemList'\n )\n\n const contextValue: SegmentedControlItemListContextValue = useMemo(\n () => ({\n setSelectedItemIndex,\n }),\n []\n )\n\n const SegmentedControlItemList =\n type === 'radiogroup' ? RadioGroupPrimitive.Root : TabsPrimitive.List\n\n return (\n <SegmentedControlItemList\n asChild\n ref={forwardedRef}\n {...rest}\n >\n <div\n style={\n {\n '--b-segmented-control-width': cssDimension(width),\n '--b-segmented-control-item-index': selectedItemIndex,\n '--b-segmented-control-item-count': React.Children.count(children),\n ...style,\n } as React.CSSProperties\n }\n className={classNames(\n styles.SegmentedControl,\n styles[`size-${size}`],\n className\n )}\n >\n <SegmentedControlItemListContextProvider value={contextValue}>\n {React.Children.map(children, (child, index) => (\n <>\n {index !== 0 && (\n <Divider\n withoutParallelIndent\n orientation=\"vertical\"\n />\n )}\n <SegmentedControlItemContextProvider value={index}>\n {child}\n </SegmentedControlItemContextProvider>\n </>\n ))}\n {!isNil(selectedItemIndex) && (\n <div\n className={classNames(\n styles.SegmentedControlIndicator,\n dividerStyles.variables\n )}\n />\n )}\n </SegmentedControlItemListContextProvider>\n </div>\n </SegmentedControlItemList>\n )\n}\n\nconst SegmentedControlItemList = forwardRef(SegmentedControlItemListImpl) as <\n Type extends SegmentedControlType,\n Value extends string,\n>(\n props: SegmentedControlItemListProps<Type, Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\nfunction SegmentedControlRadioGroupImpl<Value extends string>(\n { children, size, ...rest }: SegmentedControlRadioGroupProps<Value>,\n forwardedRef: React.Ref<HTMLDivElement>\n) {\n const { hasError, ...ownProps } = useFormFieldProps(rest)\n return (\n <SegmentedControlItemList\n ref={forwardedRef}\n {...ownProps}\n size={size}\n >\n {children}\n </SegmentedControlItemList>\n )\n}\n\nconst SegmentedControlRadioGroup = forwardRef(\n SegmentedControlRadioGroupImpl\n) as <Value extends string>(\n props: SegmentedControlRadioGroupProps<Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\n/*\n `SegmentedControlTabList` is the component that wraps `SegmentedControlItem`.\n * It can be used only when `SegmentedControl` component is used as the `tabs` type.\n \n It must be used as a child of `SegmentedControl`.\n /\nexport const SegmentedControlTabList = SegmentedControlItemList as (\n props: SegmentedControlTabListProps & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\n/\n `SegmentedControlTabContent` is the component that wraps the content that corresponds to a specific value of `SegmentedControlItem`.\n * It can be used only when `SegmentedControl` component is used as the `tabs` type.\n \n It must be used as a child of `SegmentedControl`.\n /\nexport const SegmentedControlTabContent = TabsPrimitive.Content as <\n Value extends string,\n>(\n props: SegmentedControlTabContentProps<Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\nconst SegmentedControlTabs = TabsPrimitive.Root as <Value extends string>(\n props: SegmentedControlTabsProps<Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\nfunction SegmentedControlImpl<\n Type extends SegmentedControlType,\n Value extends string,\n>(\n {\n type = 'radiogroup' as Type,\n size = 'm',\n width = '100%',\n onValueChange,\n children,\n ...rest\n }: SegmentedControlProps<Type, Value>,\n forwardedRef: React.Ref<HTMLDivElement>\n) {\n const SegmentedControlRoot =\n type === 'radiogroup' ? SegmentedControlRadioGroup : SegmentedControlTabs\n\n const contextValue = useMemo(\n () => ({\n type,\n size,\n width,\n }),\n [type, size, width]\n )\n\n return (\n <SegmentedControlContextProvider value={contextValue}>\n <SegmentedControlRoot\n ref={forwardedRef}\n onValueChange={onValueChange}\n {...rest}\n >\n {children}\n </SegmentedControlRoot>\n </SegmentedControlContextProvider>\n )\n}\n\n/\n `SegmentedControl` is component that looks like a combination of a radio and a button.\n * They can be used in place of tabs and as input elements in modals.\n * If you have more than five items, use a different element, such as a dropdown.\n \n `SegmentedControl` can be used as a radio group, tabs element depending on its `type`.\n * @example\n \n ```tsx\n * // Anatomy of the SegmentedControl type=\"radiogroup\"\n * <SegmentedControl type=\"radiogroup\">\n * <SegmentedControlItem />\n * </SegmentedControl>\n \n // Anatomy of the SegmentedControl type=\"tabs\"\n * <SegmentedControl type=\"tabs\">\n * <SegmentedControlTabList>\n * <SegmentedControlItem />\n * </SegmentedControlTabList>\n \n <SegmentedControlTabContent />\n * </SegmentedControl>\n * ```\n /\nexport const SegmentedControl = forwardRef(SegmentedControlImpl) as <\n Type extends SegmentedControlType,\n Value extends string,\n>(\n props: SegmentedControlProps<Type, Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\n/\n NOTE: (@ed) A property injected at runtime by the radix-ui lib.\n /\ntype ItemProps<Type extends SegmentedControlType> = (Type extends 'radiogroup'\n ? { 'data-state'?: 'unchecked' \| 'checked' }\n : { 'data-state'?: 'inactive' \| 'active' }) &\n React.HTMLAttributes<HTMLButtonElement> &\n Partial<SegmentedControlItemProps<Type>>\n\nfunction getTypography(size: SegmentedControlSize) {\n return (\n {\n xs: '13',\n s: '13',\n m: '13',\n l: '14',\n } as const\n )[size]\n}\n\nconst Item = forwardRef<HTMLButtonElement, ItemProps<SegmentedControlType>>(\n function Item(\n { children, leftContent, rightContent, className, ...rest },\n forwardedRef\n ) {\n const { type, size } = useSegmentedControlContext('SegmentedControlItem')\n const { setSelectedItemIndex } = useSegmentedControlItemListContext(\n 'SegmentedControlItem'\n )\n const index = useSegmentedControlItemContext('SegmentedControlItem')\n\n const checked =\n type === 'radiogroup'\n ? (rest as ItemProps<typeof type>)?.['data-state'] === 'checked'\n : (rest as ItemProps<typeof type>)?.['data-state'] === 'active'\n\n useEffect(\n function setSelectedItem() {\n if (checked) {\n setSelectedItemIndex(index)\n }\n },\n [checked, index, setSelectedItemIndex]\n )\n\n return (\n <BaseButton\n {...rest}\n ref={forwardedRef}\n data-checked={ariaAttr(checked)}\n className={classNames(styles.SegmentedControlItem, className)}\n >\n <HStack\n className={styles.SegmentedControlItemContainer}\n align=\"center\"\n spacing={4}\n >\n {leftContent}\n\n <Text\n className={styles.SegmentedControlItemLabel}\n bold\n typo={getTypography(size)}\n >\n {children}\n </Text>\n\n {rightContent}\n </HStack>\n </BaseButton>\n )\n }\n)\n\nfunction SegmentedControlItemImpl<Value extends string>(\n { children, ...rest }: SegmentedControlItemProps<Value>,\n forwardedRef: React.Ref<HTMLButtonElement>\n) {\n const { type } = useSegmentedControlContext('SegmentedControlItem')\n\n const SegmentedControlItem =\n type === 'radiogroup' ? RadioGroupPrimitive.Item : TabsPrimitive.Trigger\n\n return (\n <SegmentedControlItem\n asChild\n ref={forwardedRef}\n {...rest}\n >\n <Item>{children}</Item>\n </SegmentedControlItem>\n )\n}\n\n/\n `SegmentedControlItem` component is each item in `SegmentedControl`.\n \n If the type of `SegmentedControl` is `radiogroup`, this component acts as a radio item.\n * In this case, it must be used as a child of `SegmentedControl`.\n \n If the type of `SegmentedControl` is `tabs`, this component acts as a tab item.\n * In this case, it must be used as a child of `SegmentedControlTabList`.\n */\nexport const SegmentedControlItem = forwardRef(SegmentedControlItemImpl) as <\n Value extends string,\n>(\n props: SegmentedControlItemProps<Value> & {\n ref?: React.ForwardedRef<HTMLButtonElement>\n }\n) => JSX.Element\n"],"names":["SegmentedControlContextProvider","useSegmentedControlContext","createContext","SegmentedControlItemContextProvider","useSegmentedControlItemContext","SegmentedControlItemListContextProvider","useSegmentedControlItemListContext","SegmentedControlItemListImpl","children","style","className","rest","forwardedRef","selectedItemIndex","setSelectedItemIndex","useState","type","size","width","contextValue","useMemo","SegmentedControlItemList","RadioGroupPrimitive","TabsPrimitive","_jsx","asChild","ref","cssDimension","React","Children","count","classNames","styles","SegmentedControl","_jsxs","value","map","child","index","_Fragment","Divider","withoutParallelIndent","orientation","isNil","SegmentedControlIndicator","dividerStyles","variables","forwardRef","SegmentedControlRadioGroupImpl","hasError","ownProps","useFormFieldProps","SegmentedControlRadioGroup","SegmentedControlTabList","SegmentedControlTabContent","SegmentedControlTabs","SegmentedControlImpl","onValueChange","SegmentedControlRoot","getTypography","xs","s","m","l","Item","leftContent","rightContent","checked","useEffect","setSelectedItem","BaseButton","ariaAttr","SegmentedControlItem","HStack","SegmentedControlItemContainer","align","spacing","Text","SegmentedControlItemLabel","bold","typo","SegmentedControlItemImpl"],"mappings":"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"}
1	+ {"version":3,"file":"SegmentedControl.js","sources":["../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ForwardedRef,\n type JSX,\n forwardRef,\n useEffect,\n useMemo,\n useState,\n} from 'react'\nimport * as React from 'react'\n\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport classNames from 'classnames'\n\nimport { ariaAttr } from '~/src/utils/aria'\nimport { createContext } from '~/src/utils/react'\nimport { cssDimension } from '~/src/utils/style'\nimport { isNil } from '~/src/utils/type'\n\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Divider } from '~/src/components/Divider'\nimport dividerStyles from '~/src/components/Divider/Divider.module.scss'\nimport { useFormFieldProps } from '~/src/components/FormControl'\nimport { HStack } from '~/src/components/Stack'\nimport { Text } from '~/src/components/Text'\n\nimport {\n type SegmentedControlItemListProps,\n type SegmentedControlItemProps,\n type SegmentedControlProps,\n type SegmentedControlRadioGroupProps,\n type SegmentedControlSize,\n type SegmentedControlTabContentProps,\n type SegmentedControlTabListProps,\n type SegmentedControlTabsProps,\n type SegmentedControlType,\n} from './SegmentedControl.types'\n\nimport styles from './SegmentedControl.module.scss'\n\ntype SegmentedControlContextValue = Required<\n Pick<\n SegmentedControlProps<SegmentedControlType, string>,\n 'type' \| 'size' \| 'width'\n >\n>\n\nconst [SegmentedControlContextProvider, useSegmentedControlContext] =\n createContext<SegmentedControlContextValue \| null>(null, 'SegmentedControl')\n\ntype SegmentedControlItemListContextValue = {\n setSelectedItemIndex: (index: number \| null) => void\n}\n\nconst [SegmentedControlItemContextProvider, useSegmentedControlItemContext] =\n createContext<number \| null>(null, 'SegmentedControlItem')\n\nconst [\n SegmentedControlItemListContextProvider,\n useSegmentedControlItemListContext,\n] = createContext<SegmentedControlItemListContextValue \| null>(\n null,\n 'SegmentedControlItemList'\n)\n\nfunction SegmentedControlDivider({\n index,\n selectedItemIndex,\n}: {\n index: number\n selectedItemIndex: number \| null\n}) {\n const isAdjacentToSelectedItem =\n !isNil(selectedItemIndex) &&\n (selectedItemIndex + 1 === index \|\| selectedItemIndex === index)\n\n return (\n <Divider\n className={classNames(\n styles.SegmentedControlDivider,\n isAdjacentToSelectedItem && styles.hidden\n )}\n withoutParallelIndent\n orientation=\"vertical\"\n />\n )\n}\n\nfunction SegmentedControlItemListImpl<\n Type extends SegmentedControlType,\n Value extends string,\n>(\n {\n children,\n style,\n className,\n ...rest\n }: SegmentedControlItemListProps<Type, Value>,\n forwardedRef: ForwardedRef<HTMLDivElement>\n) {\n const [selectedItemIndex, setSelectedItemIndex] = useState<number \| null>(\n null\n )\n\n const { type, size, width } = useSegmentedControlContext(\n 'SegmentedControlItemList'\n )\n\n const contextValue: SegmentedControlItemListContextValue = useMemo(\n () => ({\n setSelectedItemIndex,\n }),\n []\n )\n\n const SegmentedControlItemList =\n type === 'radiogroup' ? RadioGroupPrimitive.Root : TabsPrimitive.List\n\n return (\n <SegmentedControlItemList\n asChild\n ref={forwardedRef}\n {...rest}\n >\n <div\n style={\n {\n '--b-segmented-control-width': cssDimension(width),\n '--b-segmented-control-item-index': selectedItemIndex,\n '--b-segmented-control-item-count': React.Children.count(children),\n ...style,\n } as React.CSSProperties\n }\n className={classNames(\n styles.SegmentedControl,\n styles[`size-${size}`],\n className\n )}\n >\n <SegmentedControlItemListContextProvider value={contextValue}>\n {React.Children.map(children, (child, index) => (\n <>\n {index !== 0 && (\n <SegmentedControlDivider\n index={index}\n selectedItemIndex={selectedItemIndex}\n />\n )}\n <SegmentedControlItemContextProvider value={index}>\n {child}\n </SegmentedControlItemContextProvider>\n </>\n ))}\n {!isNil(selectedItemIndex) && (\n <div\n className={classNames(\n styles.SegmentedControlIndicator,\n dividerStyles.variables\n )}\n />\n )}\n </SegmentedControlItemListContextProvider>\n </div>\n </SegmentedControlItemList>\n )\n}\n\nconst SegmentedControlItemList = forwardRef(SegmentedControlItemListImpl) as <\n Type extends SegmentedControlType,\n Value extends string,\n>(\n props: SegmentedControlItemListProps<Type, Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\nfunction SegmentedControlRadioGroupImpl<Value extends string>(\n { children, size, ...rest }: SegmentedControlRadioGroupProps<Value>,\n forwardedRef: React.Ref<HTMLDivElement>\n) {\n const { hasError, ...ownProps } = useFormFieldProps(rest)\n return (\n <SegmentedControlItemList\n ref={forwardedRef}\n {...ownProps}\n size={size}\n >\n {children}\n </SegmentedControlItemList>\n )\n}\n\nconst SegmentedControlRadioGroup = forwardRef(\n SegmentedControlRadioGroupImpl\n) as <Value extends string>(\n props: SegmentedControlRadioGroupProps<Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\n/*\n `SegmentedControlTabList` is the component that wraps `SegmentedControlItem`.\n * It can be used only when `SegmentedControl` component is used as the `tabs` type.\n \n It must be used as a child of `SegmentedControl`.\n /\nexport const SegmentedControlTabList = SegmentedControlItemList as (\n props: SegmentedControlTabListProps & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\n/\n `SegmentedControlTabContent` is the component that wraps the content that corresponds to a specific value of `SegmentedControlItem`.\n * It can be used only when `SegmentedControl` component is used as the `tabs` type.\n \n It must be used as a child of `SegmentedControl`.\n /\nexport const SegmentedControlTabContent = TabsPrimitive.Content as <\n Value extends string,\n>(\n props: SegmentedControlTabContentProps<Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\nconst SegmentedControlTabs = TabsPrimitive.Root as <Value extends string>(\n props: SegmentedControlTabsProps<Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\nfunction SegmentedControlImpl<\n Type extends SegmentedControlType,\n Value extends string,\n>(\n {\n type = 'radiogroup' as Type,\n size = 'm',\n width = '100%',\n onValueChange,\n children,\n ...rest\n }: SegmentedControlProps<Type, Value>,\n forwardedRef: React.Ref<HTMLDivElement>\n) {\n const SegmentedControlRoot =\n type === 'radiogroup' ? SegmentedControlRadioGroup : SegmentedControlTabs\n\n const contextValue = useMemo(\n () => ({\n type,\n size,\n width,\n }),\n [type, size, width]\n )\n\n return (\n <SegmentedControlContextProvider value={contextValue}>\n <SegmentedControlRoot\n ref={forwardedRef}\n onValueChange={onValueChange}\n {...rest}\n >\n {children}\n </SegmentedControlRoot>\n </SegmentedControlContextProvider>\n )\n}\n\n/\n `SegmentedControl` is component that looks like a combination of a radio and a button.\n * They can be used in place of tabs and as input elements in modals.\n * If you have more than five items, use a different element, such as a dropdown.\n \n `SegmentedControl` can be used as a radio group, tabs element depending on its `type`.\n * @example\n \n ```tsx\n * // Anatomy of the SegmentedControl type=\"radiogroup\"\n * <SegmentedControl type=\"radiogroup\">\n * <SegmentedControlItem />\n * </SegmentedControl>\n \n // Anatomy of the SegmentedControl type=\"tabs\"\n * <SegmentedControl type=\"tabs\">\n * <SegmentedControlTabList>\n * <SegmentedControlItem />\n * </SegmentedControlTabList>\n \n <SegmentedControlTabContent />\n * </SegmentedControl>\n * ```\n /\nexport const SegmentedControl = forwardRef(SegmentedControlImpl) as <\n Type extends SegmentedControlType,\n Value extends string,\n>(\n props: SegmentedControlProps<Type, Value> & {\n ref?: React.ForwardedRef<HTMLDivElement>\n }\n) => JSX.Element\n\n/\n NOTE: (@ed) A property injected at runtime by the radix-ui lib.\n /\ntype ItemProps<Type extends SegmentedControlType> = (Type extends 'radiogroup'\n ? { 'data-state'?: 'unchecked' \| 'checked' }\n : { 'data-state'?: 'inactive' \| 'active' }) &\n React.HTMLAttributes<HTMLButtonElement> &\n Partial<SegmentedControlItemProps<Type>>\n\nfunction getTypography(size: SegmentedControlSize) {\n return (\n {\n xs: '13',\n s: '13',\n m: '13',\n l: '14',\n } as const\n )[size]\n}\n\nconst Item = forwardRef<HTMLButtonElement, ItemProps<SegmentedControlType>>(\n function Item(\n { children, leftContent, rightContent, className, ...rest },\n forwardedRef\n ) {\n const { type, size } = useSegmentedControlContext('SegmentedControlItem')\n const { setSelectedItemIndex } = useSegmentedControlItemListContext(\n 'SegmentedControlItem'\n )\n const index = useSegmentedControlItemContext('SegmentedControlItem')\n\n const checked =\n type === 'radiogroup'\n ? (rest as ItemProps<typeof type>)?.['data-state'] === 'checked'\n : (rest as ItemProps<typeof type>)?.['data-state'] === 'active'\n\n useEffect(\n function setSelectedItem() {\n if (checked) {\n setSelectedItemIndex(index)\n }\n },\n [checked, index, setSelectedItemIndex]\n )\n\n return (\n <BaseButton\n {...rest}\n ref={forwardedRef}\n data-checked={ariaAttr(checked)}\n className={classNames(styles.SegmentedControlItem, className)}\n >\n <HStack\n className={styles.SegmentedControlItemContainer}\n align=\"center\"\n spacing={4}\n >\n {leftContent}\n\n <Text\n className={styles.SegmentedControlItemLabel}\n bold\n typo={getTypography(size)}\n >\n {children}\n </Text>\n\n {rightContent}\n </HStack>\n </BaseButton>\n )\n }\n)\n\nfunction SegmentedControlItemImpl<Value extends string>(\n { children, ...rest }: SegmentedControlItemProps<Value>,\n forwardedRef: React.Ref<HTMLButtonElement>\n) {\n const { type } = useSegmentedControlContext('SegmentedControlItem')\n\n const SegmentedControlItem =\n type === 'radiogroup' ? RadioGroupPrimitive.Item : TabsPrimitive.Trigger\n\n return (\n <SegmentedControlItem\n asChild\n ref={forwardedRef}\n {...rest}\n >\n <Item>{children}</Item>\n </SegmentedControlItem>\n )\n}\n\n/\n `SegmentedControlItem` component is each item in `SegmentedControl`.\n \n If the type of `SegmentedControl` is `radiogroup`, this component acts as a radio item.\n * In this case, it must be used as a child of `SegmentedControl`.\n \n If the type of `SegmentedControl` is `tabs`, this component acts as a tab item.\n * In this case, it must be used as a child of `SegmentedControlTabList`.\n */\nexport const SegmentedControlItem = forwardRef(SegmentedControlItemImpl) as <\n Value extends string,\n>(\n props: SegmentedControlItemProps<Value> & {\n ref?: React.ForwardedRef<HTMLButtonElement>\n }\n) => JSX.Element\n"],"names":["SegmentedControlContextProvider","useSegmentedControlContext","createContext","SegmentedControlItemContextProvider","useSegmentedControlItemContext","SegmentedControlItemListContextProvider","useSegmentedControlItemListContext","SegmentedControlDivider","index","selectedItemIndex","isAdjacentToSelectedItem","isNil","_jsx","Divider","className","classNames","styles","hidden","withoutParallelIndent","orientation","SegmentedControlItemListImpl","children","style","rest","forwardedRef","setSelectedItemIndex","useState","type","size","width","contextValue","useMemo","SegmentedControlItemList","RadioGroupPrimitive","TabsPrimitive","asChild","ref","cssDimension","React","Children","count","SegmentedControl","_jsxs","value","map","child","_Fragment","SegmentedControlIndicator","dividerStyles","variables","forwardRef","SegmentedControlRadioGroupImpl","hasError","ownProps","useFormFieldProps","SegmentedControlRadioGroup","SegmentedControlTabList","SegmentedControlTabContent","SegmentedControlTabs","SegmentedControlImpl","onValueChange","SegmentedControlRoot","getTypography","xs","s","m","l","Item","leftContent","rightContent","checked","useEffect","setSelectedItem","BaseButton","ariaAttr","SegmentedControlItem","HStack","SegmentedControlItemContainer","align","spacing","Text","SegmentedControlItemLabel","bold","typo","SegmentedControlItemImpl"],"mappings":"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"}

package/dist/cjs/components/SegmentedControl/SegmentedControl.module.scss.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-var styles = {"SegmentedControl":"b-QJFyw","size-xs":"b-KfsMM","SegmentedControlItem":"b-Fxuhx","SegmentedControlIndicator":"b-G5Rub","size-s":"b-YkgBA","size-m":"b-GGYhm","size-l":"b-4ubIM","SegmentedControlItemContainer":"b-eMgAF","SegmentedControlItemLabel":"b-yS7U6"};
+var styles = {"SegmentedControl":"b-QJFyw","size-xs":"b-KfsMM","SegmentedControlItem":"b-Fxuhx","SegmentedControlIndicator":"b-G5Rub","size-s":"b-YkgBA","size-m":"b-GGYhm","size-l":"b-4ubIM","SegmentedControlItemContainer":"b-eMgAF","SegmentedControlItemLabel":"b-yS7U6","SegmentedControlDivider":"b-RgPrE","hidden":"b-FM5TV"};
 exports.default = styles;
 //# sourceMappingURL=SegmentedControl.module.scss.js.map

package/dist/cjs/components/Tabs/Tabs.js CHANGED Viewed

@@ -5,14 +5,15 @@ var bezierIcons = require('@channel.io/bezier-icons');
 var index = require('../../node_modules/@radix-ui/react-tabs/dist/index.js');
 var index$2 = require('../../node_modules/@radix-ui/react-toolbar/dist/index.js');
 var index$1 = require('../../_virtual/index.js');
+var useElementTruncated = require('../../hooks/useElementTruncated.js');
 var react = require('../../utils/react.js');
 var type = require('../../utils/type.js');
 var Tabs_module = require('./Tabs.module.scss.js');
 var jsxRuntime = require('react/jsx-runtime');
-var Button = require('../Button/Button.js');
 var BaseButton = require('../BaseButton/BaseButton.js');
 var Text = require('../Text/Text.js');
 var Icon = require('../Icon/Icon.js');
+var Tooltip = require('../Tooltip/Tooltip.js');
 const Tabs = /*#__PURE__*/React.forwardRef(function Tabs({
   className,
@@ -79,6 +80,51 @@ function getButtonSizeBy(size) {
     s: 's'
   }[size];
 }
+function getTypography(size) {
+  return {
+    s: '13',
+    m: '14',
+    l: '15'
+  }[size];
+}
+const TabItemButton = /*#__PURE__*/React.forwardRef(function TabItemButton({
+  className,
+  disabled,
+  value,
+  children,
+  maxWidth,
+  style,
+  ...rest
+}, forwardedRef) {
+  const contentRef = React.useRef(null);
+  const isTruncated = useElementTruncated.default(contentRef);
+  const {
+    size
+  } = useTabListContext();
+  return /*#__PURE__*/jsxRuntime.jsx(Tooltip.Tooltip, {
+    content: children,
+    disabled: !isTruncated,
+    offset: 6,
+    children: /*#__PURE__*/jsxRuntime.jsx(BaseButton.BaseButton, {
+      className: index$1.default(Tabs_module.default.TabItemButton, Tabs_module.default[`size-${getButtonSizeBy(size)}`], className),
+      disabled: disabled,
+      ref: forwardedRef,
+      style: {
+        maxWidth,
+        ...style
+      },
+      ...rest,
+      children: /*#__PURE__*/jsxRuntime.jsx(Text.Text, {
+        ref: contentRef,
+        className: Tabs_module.default.TabItemButtonText,
+        typo: getTypography(size),
+        bold: true,
+        truncated: true,
+        children: children
+      })
+    })
+  });
+});
 /**
  * `TabItem` is a button that activates its associated content.
@@ -88,11 +134,10 @@ const TabItem = /*#__PURE__*/React.forwardRef(function TabItem({
   disabled,
   value,
   children,
+  maxWidth,
+  style,
   ...rest
 }, forwardedRef) {
-  const {
-    size
-  } = useTabListContext();
   if (typeof children !== 'string') {
     return null;
   }
@@ -100,15 +145,15 @@ const TabItem = /*#__PURE__*/React.forwardRef(function TabItem({
     disabled: disabled,
     value: value,
     asChild: true,
-    children: /*#__PURE__*/jsxRuntime.jsx(Button.Button, {
-      className: index$1.default(Tabs_module.default.TabItem, className),
-      disabled: disabled,
-      text: children,
-      size: getButtonSizeBy(size),
-      colorVariant: "monochrome-light",
-      styleVariant: "tertiary",
+    children: /*#__PURE__*/jsxRuntime.jsx(TabItemButton, {
       ref: forwardedRef,
-      ...rest
+      className: className,
+      disabled: disabled,
+      value: value,
+      maxWidth: maxWidth,
+      style: style,
+      ...rest,
+      children: children
     })
   });
 });

package/dist/cjs/components/Tabs/Tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.js","sources":["../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["'use client'\n\nimport { type JSX, forwardRef, useMemo } 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 { createContext } from '~/src/utils/react'\nimport { isNil } from '~/src/utils/type'\n\nimport { BaseButton } from '~/src/components/BaseButton'\nimport { Button } from '~/src/components/Button'\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'\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\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, ...rest },\n forwardedRef\n ) {\n const { size } = useTabListContext()\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 <Button\n className={classNames(styles.TabItem, className)}\n disabled={disabled}\n text={children}\n size={getButtonSizeBy(size)}\n colorVariant=\"monochrome-light\"\n styleVariant=\"tertiary\"\n ref={forwardedRef}\n {...rest}\n />\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","TabItem","disabled","asChild","Button","text","colorVariant","styleVariant","TabContent","TabActions","ToolbarPrimitive","getTypoBy","getIconSizeBy","TabAction","classNameProp","href","onClick","isNil","BaseButton","Text","bold","typo","_jsxs","target","rel","Icon","source","OpenInNewIcon","marginLeft"],"mappings":"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"}
1	+ {"version":3,"file":"Tabs.js","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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"}

package/dist/cjs/components/Tabs/Tabs.module.scss.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-var styles = {"Tabs":"b-gYzTx","TabList":"b-hDolH","size-l":"b-IDyyx","size-m":"b-qRYAa","size-s":"b-PA-KE","TabItems":"b-QelIi","TabItem":"b-C7hNR","TabActions":"b-qFq9I","TabAction":"b-0-A80"};
+var styles = {"Tabs":"b-gYzTx","TabList":"b-hDolH","size-l":"b-IDyyx","size-m":"b-qRYAa","size-s":"b-PA-KE","TabItems":"b-QelIi","TabItemButton":"b-buuPU","TabItemButtonText":"b-m0XCv","TabItemButtonContent":"b-zMLCa","active":"b-75jv0","TabActions":"b-qFq9I","TabAction":"b-0-A80"};
 exports.default = styles;
 //# sourceMappingURL=Tabs.module.scss.js.map

package/dist/cjs/hooks/useElementTruncated.js ADDED Viewed

@@ -0,0 +1,28 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+var React = require('react');
+const useElementTruncated = ref => {
+  const [isTruncated, setTruncated] = React.useState(false);
+  React.useEffect(function initResizeObserver() {
+    if (ref.current) {
+      const resizeObserver = new ResizeObserver(entries => {
+        const firstEntry = entries[0];
+        if (firstEntry.target) {
+          setTruncated(firstEntry.target.scrollWidth > firstEntry.target.clientWidth || firstEntry.target.scrollHeight > firstEntry.target.clientHeight);
+        }
+      });
+      resizeObserver.observe(ref.current);
+      return function cleanup() {
+        return resizeObserver.disconnect();
+      };
+    }
+    return undefined;
+  }, [ref]);
+  return isTruncated;
+};
+exports.default = useElementTruncated;
+//# sourceMappingURL=useElementTruncated.js.map

package/dist/cjs/hooks/useElementTruncated.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useElementTruncated.js","sources":["../../../src/hooks/useElementTruncated.ts"],"sourcesContent":["import type { RefObject } from 'react'\nimport { useEffect, useState } from 'react'\n\nconst useElementTruncated = <Element extends HTMLElement>(\n ref: RefObject<Element | null>\n): boolean => {\n const [isTruncated, setTruncated] = useState(false)\n\n useEffect(\n function initResizeObserver() {\n if (ref.current) {\n const resizeObserver = new ResizeObserver((entries) => {\n const firstEntry = entries[0]\n if (firstEntry.target) {\n setTruncated(\n firstEntry.target.scrollWidth > firstEntry.target.clientWidth ||\n firstEntry.target.scrollHeight > firstEntry.target.clientHeight\n )\n }\n })\n resizeObserver.observe(ref.current)\n\n return function cleanup() {\n return resizeObserver.disconnect()\n }\n }\n\n return undefined\n },\n [ref]\n )\n\n return isTruncated\n}\n\nexport default useElementTruncated\n"],"names":["useElementTruncated","ref","isTruncated","setTruncated","useState","useEffect","initResizeObserver","current","resizeObserver","ResizeObserver","entries","firstEntry","target","scrollWidth","clientWidth","scrollHeight","clientHeight","observe","cleanup","disconnect","undefined"],"mappings":";;;;;;AAGMA,MAAAA,mBAAmB,GACvBC,GAA8B,IAClB;EACZ,MAAM,CAACC,WAAW,EAAEC,YAAY,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC;AAEnDC,EAAAA,eAAS,CACP,SAASC,kBAAkBA,GAAG;IAC5B,IAAIL,GAAG,CAACM,OAAO,EAAE;AACf,MAAA,MAAMC,cAAc,GAAG,IAAIC,cAAc,CAAEC,OAAO,IAAK;AACrD,QAAA,MAAMC,UAAU,GAAGD,OAAO,CAAC,CAAC,CAAC;QAC7B,IAAIC,UAAU,CAACC,MAAM,EAAE;UACrBT,YAAY,CACVQ,UAAU,CAACC,MAAM,CAACC,WAAW,GAAGF,UAAU,CAACC,MAAM,CAACE,WAAW,IAC3DH,UAAU,CAACC,MAAM,CAACG,YAAY,GAAGJ,UAAU,CAACC,MAAM,CAACI,YACvD,CAAC;AACH;AACF,OAAC,CAAC;AACFR,MAAAA,cAAc,CAACS,OAAO,CAAChB,GAAG,CAACM,OAAO,CAAC;MAEnC,OAAO,SAASW,OAAOA,GAAG;AACxB,QAAA,OAAOV,cAAc,CAACW,UAAU,EAAE;OACnC;AACH;AAEA,IAAA,OAAOC,SAAS;AAClB,GAAC,EACD,CAACnB,GAAG,CACN,CAAC;AAED,EAAA,OAAOC,WAAW;AACpB;;;;"}