@channel.io/bezier-react 3.3.1 → 3.4.1

package/dist/types/components/Button/Button.types.d.ts

@@ -46,7 +46,7 @@ interface ButtonOwnProps {
      */
     colorVariant?: ButtonColorVariant;
 }
-export interface ButtonProps extends BezierComponentProps<'button'>, PolymorphicProps, SizeProps<ButtonSize>, DisableProps, SideContentProps<SideContent, SideContent>, ButtonOwnProps {
+export interface ButtonProps extends Omit<BezierComponentProps<'button'>, 'children'>, PolymorphicProps, SizeProps<ButtonSize>, DisableProps, SideContentProps<SideContent, SideContent>, ButtonOwnProps {
 }
 export {};
 //# sourceMappingURL=Button.types.d.ts.map

package/dist/types/components/Button/Button.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAE1D,OAAO,EACL,KAAK,oBAAoB,EACzB,KAAK,YAAY,EACjB,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACrB,KAAK,SAAS,EACf,0BAAyB;AAE1B,MAAM,MAAM,kBAAkB,GAC1B,SAAS,GACT,WAAW,GACX,UAAU,GACV,UAAU,GACV,cAAc,CAAA;AAElB,MAAM,MAAM,kBAAkB,GAC1B,MAAM,GACN,KAAK,GACL,OAAO,GACP,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,QAAQ;AACV;;GAEG;GACD,YAAY,GACZ,kBAAkB,GAClB,iBAAiB,CAAA;AAErB,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAA;AAEtD,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,GAAG,UAAU,CAAA;AAEtD,UAAU,cAAc;IACtB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;IAEpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;;OAGG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAA;IAEjC;;;OAGG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAA;CAClC;AAED,MAAM,WAAW,WACf,SAAQ,oBAAoB,CAAC,QAAQ,CAAC,EACpC,gBAAgB,EAChB,SAAS,CAAC,UAAU,CAAC,EACrB,YAAY,EACZ,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,EAC1C,cAAc;CAAG"}
+{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAE1D,OAAO,EACL,KAAK,oBAAoB,EACzB,KAAK,YAAY,EACjB,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACrB,KAAK,SAAS,EACf,0BAAyB;AAE1B,MAAM,MAAM,kBAAkB,GAC1B,SAAS,GACT,WAAW,GACX,UAAU,GACV,UAAU,GACV,cAAc,CAAA;AAElB,MAAM,MAAM,kBAAkB,GAC1B,MAAM,GACN,KAAK,GACL,OAAO,GACP,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,QAAQ;AACV;;GAEG;GACD,YAAY,GACZ,kBAAkB,GAClB,iBAAiB,CAAA;AAErB,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAA;AAEtD,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,SAAS,GAAG,UAAU,CAAA;AAEtD,UAAU,cAAc;IACtB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;IAEpC;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;;OAGG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAA;IAEjC;;;OAGG;IACH,YAAY,CAAC,EAAE,kBAAkB,CAAA;CAClC;AAED,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC,EAAE,UAAU,CAAC,EACtD,gBAAgB,EAChB,SAAS,CAAC,UAAU,CAAC,EACrB,YAAY,EACZ,gBAAgB,CAAC,WAAW,EAAE,WAAW,CAAC,EAC1C,cAAc;CAAG"}

package/dist/types/components/SegmentedControl/SegmentedControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,GAAG,EAKT,MAAM,OAAO,CAAA;AACd,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAkB9B,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,qBAAqB,EAG1B,KAAK,+BAA+B,EACpC,KAAK,4BAA4B,EAEjC,KAAK,oBAAoB,EAC1B,MAAM,0BAA0B,CAAA;AA6IjC;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,EAA+B,CACjE,KAAK,EAAE,4BAA4B,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CACzC,KACE,GAAG,CAAC,OAAO,CAAA;AAEhB;;;;;GAKG;AACH,eAAO,MAAM,0BAA0B,EAA4B,CACjE,KAAK,SAAS,MAAM,EAEpB,KAAK,EAAE,+BAA+B,CAAC,KAAK,CAAC,GAAG;IAC9C,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CACzC,KACE,GAAG,CAAC,OAAO,CAAA;AA+ChB;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,gBAAgB,EAAuC,CAClE,IAAI,SAAS,oBAAoB,EACjC,KAAK,SAAS,MAAM,EAEpB,KAAK,EAAE,qBAAqB,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG;IAC1C,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CACzC,KACE,GAAG,CAAC,OAAO,CAAA;AAgGhB;;;;;;;;GAQG;AACH,eAAO,MAAM,oBAAoB,EAA2C,CAC1E,KAAK,SAAS,MAAM,EAEpB,KAAK,EAAE,yBAAyB,CAAC,KAAK,CAAC,GAAG;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAA;CAC5C,KACE,GAAG,CAAC,OAAO,CAAA"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../src/components/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,GAAG,EAKT,MAAM,OAAO,CAAA;AACd,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAkB9B,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,qBAAqB,EAG1B,KAAK,+BAA+B,EACpC,KAAK,4BAA4B,EAEjC,KAAK,oBAAoB,EAC1B,MAAM,0BAA0B,CAAA;AAoKjC;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,EAA+B,CACjE,KAAK,EAAE,4BAA4B,GAAG;IACpC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CACzC,KACE,GAAG,CAAC,OAAO,CAAA;AAEhB;;;;;GAKG;AACH,eAAO,MAAM,0BAA0B,EAA4B,CACjE,KAAK,SAAS,MAAM,EAEpB,KAAK,EAAE,+BAA+B,CAAC,KAAK,CAAC,GAAG;IAC9C,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CACzC,KACE,GAAG,CAAC,OAAO,CAAA;AA+ChB;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,gBAAgB,EAAuC,CAClE,IAAI,SAAS,oBAAoB,EACjC,KAAK,SAAS,MAAM,EAEpB,KAAK,EAAE,qBAAqB,CAAC,IAAI,EAAE,KAAK,CAAC,GAAG;IAC1C,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;CACzC,KACE,GAAG,CAAC,OAAO,CAAA;AAgGhB;;;;;;;;GAQG;AACH,eAAO,MAAM,oBAAoB,EAA2C,CAC1E,KAAK,SAAS,MAAM,EAEpB,KAAK,EAAE,yBAAyB,CAAC,KAAK,CAAC,GAAG;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAA;CAC5C,KACE,GAAG,CAAC,OAAO,CAAA"}

package/dist/types/components/Tabs/Tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,GAAG,EAAuB,MAAM,OAAO,CAAA;AACrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAa9B,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,cAAc,EACnB,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,aAAa,EAElB,KAAK,YAAY,EAEjB,KAAK,SAAS,EACf,qBAAwC;AAKzC;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,eAAO,MAAM,IAAI,kFAef,CAAA;AAOF;;GAEG;AACH,eAAO,MAAM,OAAO,qFAyBnB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,sFAYpB,CAAA;AAYD;;GAEG;AACH,eAAO,MAAM,OAAO,wFA8BnB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,UAAU,wFAYtB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,UAAU,wFActB,CAAA;AAsBD;;;GAGG;AACH,eAAO,MAAM,SAAS,EAsDhB,CAAC,IAAI,SAAS,MAAM,GAAG,SAAS,EACpC,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG;IAC5B,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAA;CACjD,KACE,GAAG,CAAC,OAAO,CAAA"}
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,GAAG,EAA+B,MAAM,OAAO,CAAA;AAC7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAa9B,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,cAAc,EACnB,KAAK,eAAe,EACpB,KAAK,eAAe,EACpB,KAAK,YAAY,EACjB,KAAK,aAAa,EAElB,KAAK,YAAY,EAEjB,KAAK,SAAS,EACf,qBAAwC;AAMzC;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,eAAO,MAAM,IAAI,kFAef,CAAA;AAOF;;GAEG;AACH,eAAO,MAAM,OAAO,qFAyBnB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,QAAQ,sFAYpB,CAAA;AAgED;;GAEG;AACH,eAAO,MAAM,OAAO,wFA6BnB,CAAA;AAED;;GAEG;AACH,eAAO,MAAM,UAAU,wFAYtB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,UAAU,wFActB,CAAA;AAsBD;;;GAGG;AACH,eAAO,MAAM,SAAS,EAsDhB,CAAC,IAAI,SAAS,MAAM,GAAG,SAAS,EACpC,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG;IAC5B,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAA;CACjD,KACE,GAAG,CAAC,OAAO,CAAA"}

package/dist/types/components/Tabs/Tabs.types.d.ts

@@ -1,4 +1,5 @@
 import type React from 'react';
+import { type CSSProperties } from 'react';
 import { type BezierComponentProps, type ChildrenProps, type DisableProps, type SizeProps } from "../../types/props";
 export type TabSize = 'l' | 'm' | 's';
 export interface TabListContextValue {
@@ -39,6 +40,7 @@ interface TabItemOwnProps {
      * A unique value that associates the trigger with a content.
      */
     value: string;
+    maxWidth?: CSSProperties['maxWidth'];
 }
 interface TabContentOwnProps {
     /**

package/dist/types/components/Tabs/Tabs.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EACL,KAAK,oBAAoB,EACzB,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,0BAAyB;AAE1B,MAAM,MAAM,OAAO,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAA;AAErC,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,OAAO,CAAA;CACd;AAED,UAAU,YAAY;IACpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAA;IACvC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACxC;AAED,UAAU,iBAAiB,CAAC,IAAI,SAAS,MAAM,GAAG,SAAS;IACzD;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAA;IACX;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,SAAS,MAAM,GACzB,KAAK,GACL,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CAC/C;AAED,UAAU,eAAe;IACvB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,kBAAkB;IAC1B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAAE,MAAM,YAAY,CAAC,EAC3D,aAAa,EACb,YAAY;CAAG;AAEnB,MAAM,WAAW,YACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa,EACb,SAAS,CAAC,OAAO,CAAC;CAAG;AAEzB,MAAM,WAAW,aACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa;CAAG;AAEpB,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC,EAAE,MAAM,eAAe,CAAC,EACjE,aAAa,EACb,YAAY,EACZ,eAAe;CAAG;AAEtB,MAAM,WAAW,eACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa;CAAG;AAEpB,MAAM,MAAM,gBAAgB,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,GACxD,iBAAiB,GACjB,iBAAiB,CAAA;AAErB,MAAM,WAAW,cAAc,CAAC,IAAI,SAAS,MAAM,GAAG,SAAS,CAC7D,SAAQ,IAAI,CAAC,oBAAoB,EAAE,MAAM,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,EACzE,aAAa,EACb,iBAAiB,CAAC,IAAI,CAAC,EACvB,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,EAAE,SAAS,CAAC;CAAG;AAEpE,MAAM,WAAW,eACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa,EACb,kBAAkB;CAAG"}
+{"version":3,"file":"Tabs.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Tabs/Tabs.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,EACL,KAAK,oBAAoB,EACzB,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,SAAS,EACf,0BAAyB;AAE1B,MAAM,MAAM,OAAO,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAA;AAErC,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,OAAO,CAAA;CACd;AAED,UAAU,YAAY;IACpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAA;IACvC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CACxC;AAED,UAAU,iBAAiB,CAAC,IAAI,SAAS,MAAM,GAAG,SAAS;IACzD;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAA;IACX;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,SAAS,MAAM,GACzB,KAAK,GACL,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CAC/C;AAED,UAAU,eAAe;IACvB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAA;CACrC;AAED,UAAU,kBAAkB;IAC1B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAA;CACd;AAED,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,EAAE,MAAM,YAAY,CAAC,EAC3D,aAAa,EACb,YAAY;CAAG;AAEnB,MAAM,WAAW,YACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa,EACb,SAAS,CAAC,OAAO,CAAC;CAAG;AAEzB,MAAM,WAAW,aACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa;CAAG;AAEpB,MAAM,WAAW,YACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,QAAQ,CAAC,EAAE,MAAM,eAAe,CAAC,EACjE,aAAa,EACb,YAAY,EACZ,eAAe;CAAG;AAEtB,MAAM,WAAW,eACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa;CAAG;AAEpB,MAAM,MAAM,gBAAgB,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,GACxD,iBAAiB,GACjB,iBAAiB,CAAA;AAErB,MAAM,WAAW,cAAc,CAAC,IAAI,SAAS,MAAM,GAAG,SAAS,CAC7D,SAAQ,IAAI,CAAC,oBAAoB,EAAE,MAAM,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,EACzE,aAAa,EACb,iBAAiB,CAAC,IAAI,CAAC,EACvB,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,EAAE,SAAS,CAAC;CAAG;AAEpE,MAAM,WAAW,eACf,SAAQ,oBAAoB,CAAC,KAAK,CAAC,EACjC,aAAa,EACb,kBAAkB;CAAG"}

package/dist/types/hooks/useElementTruncated.d.ts

@@ -0,0 +1,4 @@
+import type { RefObject } from 'react';
+declare const useElementTruncated: <Element extends HTMLElement>(ref: RefObject<Element | null>) => boolean;
+export default useElementTruncated;
+//# sourceMappingURL=useElementTruncated.d.ts.map

package/dist/types/hooks/useElementTruncated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useElementTruncated.d.ts","sourceRoot":"","sources":["../../../src/hooks/useElementTruncated.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,QAAA,MAAM,mBAAmB,GAAI,OAAO,SAAS,WAAW,OACjD,SAAS,CAAC,OAAO,GAAG,IAAI,CAAC,KAC7B,OA4BF,CAAA;AAED,eAAe,mBAAmB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@channel.io/bezier-react",
-  "version": "3.3.1",
+  "version": "3.4.1",
   "description": "React components library that implements Bezier design system.",
   "repository": {
     "type": "git",

package/src/components/Button/Button.types.ts

@@ -79,7 +79,7 @@ interface ButtonOwnProps {
 }
 
 export interface ButtonProps
-  extends BezierComponentProps<'button'>,
+  extends Omit<BezierComponentProps<'button'>, 'children'>,
     PolymorphicProps,
     SizeProps<ButtonSize>,
     DisableProps,

package/src/components/SegmentedControl/SegmentedControl.module.scss

@@ -186,3 +186,12 @@
 .SegmentedControlItemLabel {
   padding: 1px 0;
 }
+
+.SegmentedControlDivider {
+  opacity: 1;
+  transition: opacity var(--transition-s);
+
+  &.hidden {
+    opacity: 0;
+  }
+}

package/src/components/SegmentedControl/SegmentedControl.tsx

@@ -65,6 +65,29 @@ const [
   'SegmentedControlItemList'
 )
 
+function SegmentedControlDivider({
+  index,
+  selectedItemIndex,
+}: {
+  index: number
+  selectedItemIndex: number | null
+}) {
+  const isAdjacentToSelectedItem =
+    !isNil(selectedItemIndex) &&
+    (selectedItemIndex + 1 === index || selectedItemIndex === index)
+
+  return (
+    <Divider
+      className={classNames(
+        styles.SegmentedControlDivider,
+        isAdjacentToSelectedItem && styles.hidden
+      )}
+      withoutParallelIndent
+      orientation="vertical"
+    />
+  )
+}
+
 function SegmentedControlItemListImpl<
   Type extends SegmentedControlType,
   Value extends string,
@@ -120,9 +143,9 @@ function SegmentedControlItemListImpl<
           {React.Children.map(children, (child, index) => (
             <>
               {index !== 0 && (
-                <Divider
-                  withoutParallelIndent
-                  orientation="vertical"
+                <SegmentedControlDivider
+                  index={index}
+                  selectedItemIndex={selectedItemIndex}
                 />
               )}
               <SegmentedControlItemContextProvider value={index}>

package/src/components/Tabs/Tabs.module.scss

@@ -31,10 +31,20 @@ $tab-item-indicator-height: 3px;
   display: flex;
 }
 
-.TabItem {
+.TabItemButton {
+  position: relative;
   top: 4px;
+
   overflow: visible;
 
+  box-sizing: border-box;
+
+  background-color: transparent;
+
+  transition:
+    background-color var(--transition-s),
+    box-shadow var(--transition-s);
+
   &::after {
     content: '';
 
@@ -51,6 +61,56 @@ $tab-item-indicator-height: 3px;
     transition: height var(--transition-s);
   }
 
+  &:where(.size-s) {
+    min-width: 24px;
+    height: 24px;
+    padding: 0 4px;
+    border-radius: var(--radius-8);
+
+    & :where(.TabItemButtonText) {
+      padding: 0 3px;
+    }
+  }
+
+  &:where(.size-m) {
+    min-width: 36px;
+    height: 36px;
+    padding: 0 10px;
+    border-radius: var(--radius-8);
+  }
+
+  &:where(.size-l) {
+    min-width: 44px;
+    height: 44px;
+    padding: 0 12px;
+    border-radius: var(--radius-12);
+  }
+
+  &:where(.size-m, .size-l) {
+    & :where(.TabItemButtonContent) {
+      gap: 2px;
+    }
+
+    & :where(.TabItemButtonText) {
+      padding: 0 4px;
+    }
+  }
+
+  &:where(.active, :hover):where(:not(:disabled)) {
+    background-color: var(--bg-black-lighter);
+  }
+
+  /* NOTE: If there is no text, button is square, so padding is 0 */
+  &:not(:has(.TabItemButtonText)) {
+    padding: 0;
+  }
+
+  &:disabled {
+    cursor: not-allowed;
+    opacity: var(--opacity-disabled);
+  }
+
+  /* stylelint-disable-next-line no-descending-specificity */
   &:where([data-state='active']) {
     color: var(--bgtxt-blue-normal);
 

package/src/components/Tabs/Tabs.stories.tsx

@@ -66,7 +66,12 @@ function TabsComposition({
           <TabItems>
             <TabItem value="One">Tab1</TabItem>
             <TabItem value="Two">Tab2</TabItem>
-            <TabItem value="Three">Tab3</TabItem>
+            <TabItem
+              value="Three"
+              maxWidth={50}
+            >
+              LongLongLabelTab
+            </TabItem>
           </TabItems>
 
           <TabActions>
@@ -95,7 +100,7 @@ function TabsComposition({
         </TabContent>
         <TabContent value="Three">
           <Center height={100}>
-            <Text color="txt-black-darkest">Tab3 content</Text>
+            <Text color="txt-black-darkest">LongLongLabelTab content</Text>
           </Center>
         </TabContent>
       </Tabs>

package/src/components/Tabs/Tabs.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { type JSX, forwardRef, useMemo } from 'react'
+import { type JSX, forwardRef, useMemo, useRef } from 'react'
 import * as React from 'react'
 
 import { OpenInNewIcon } from '@channel.io/bezier-icons'
@@ -8,11 +8,11 @@ import * as TabsPrimitive from '@radix-ui/react-tabs'
 import * as ToolbarPrimitive from '@radix-ui/react-toolbar'
 import classNames from 'classnames'
 
+import useElementTruncated from '~/src/hooks/useElementTruncated'
 import { createContext } from '~/src/utils/react'
 import { isNil } from '~/src/utils/type'
 
 import { BaseButton } from '~/src/components/BaseButton'
-import { Button } from '~/src/components/Button'
 import { Icon } from '~/src/components/Icon'
 import {
   type TabActionElement,
@@ -27,6 +27,7 @@ import {
   type TabsProps,
 } from '~/src/components/Tabs/Tabs.types'
 import { Text } from '~/src/components/Text'
+import { Tooltip } from '~/src/components/Tooltip'
 
 import styles from './Tabs.module.scss'
 
@@ -130,16 +131,66 @@ function getButtonSizeBy(size: TabSize) {
   )[size]
 }
 
+function getTypography(size: TabSize) {
+  return (
+    {
+      s: '13',
+      m: '14',
+      l: '15',
+    } as const
+  )[size]
+}
+
+const TabItemButton = forwardRef<HTMLButtonElement, TabItemProps>(
+  function TabItemButton(
+    { className, disabled, value, children, maxWidth, style, ...rest },
+    forwardedRef
+  ) {
+    const contentRef = useRef<HTMLElement>(null)
+    const isTruncated = useElementTruncated(contentRef)
+
+    const { size } = useTabListContext()
+
+    return (
+      <Tooltip
+        content={children}
+        disabled={!isTruncated}
+        offset={6}
+      >
+        <BaseButton
+          className={classNames(
+            styles.TabItemButton,
+            styles[`size-${getButtonSizeBy(size)}`],
+            className
+          )}
+          disabled={disabled}
+          ref={forwardedRef}
+          style={{ maxWidth, ...style }}
+          {...rest}
+        >
+          <Text
+            ref={contentRef}
+            className={styles.TabItemButtonText}
+            typo={getTypography(size)}
+            bold
+            truncated
+          >
+            {children}
+          </Text>
+        </BaseButton>
+      </Tooltip>
+    )
+  }
+)
+
 /**
  * `TabItem` is a button that activates its associated content.
  */
 export const TabItem = forwardRef<HTMLButtonElement, TabItemProps>(
   function TabItem(
-    { className, disabled, value, children, ...rest },
+    { className, disabled, value, children, maxWidth, style, ...rest },
     forwardedRef
   ) {
-    const { size } = useTabListContext()
-
     if (typeof children !== 'string') {
       return null
     }
@@ -150,16 +201,17 @@ export const TabItem = forwardRef<HTMLButtonElement, TabItemProps>(
         value={value}
         asChild
       >
-        <Button
-          className={classNames(styles.TabItem, className)}
-          disabled={disabled}
-          text={children}
-          size={getButtonSizeBy(size)}
-          colorVariant="monochrome-light"
-          styleVariant="tertiary"
+        <TabItemButton
           ref={forwardedRef}
+          className={className}
+          disabled={disabled}
+          value={value}
+          maxWidth={maxWidth}
+          style={style}
           {...rest}
-        />
+        >
+          {children}
+        </TabItemButton>
       </TabsPrimitive.TabsTrigger>
     )
   }

package/src/components/Tabs/Tabs.types.ts

@@ -1,4 +1,5 @@
 import type React from 'react'
+import { type CSSProperties } from 'react'
 
 import {
   type BezierComponentProps,
@@ -52,6 +53,7 @@ interface TabItemOwnProps {
    * A unique value that associates the trigger with a content.
    */
   value: string
+  maxWidth?: CSSProperties['maxWidth']
 }
 
 interface TabContentOwnProps {

package/src/hooks/useElementTruncated.ts

@@ -0,0 +1,36 @@
+import type { RefObject } from 'react'
+import { useEffect, useState } from 'react'
+
+const useElementTruncated = <Element extends HTMLElement>(
+  ref: RefObject<Element | null>
+): boolean => {
+  const [isTruncated, setTruncated] = useState(false)
+
+  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
+}
+
+export default useElementTruncated