From 669e4a405202908f62686c8ff21197a35fce265a Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 26 Mar 2024 17:43:55 +0900 Subject: [PATCH] ci(changesets): version packages (#2122) This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @channel.io/bezier-react@2.0.0 ### Major Changes - **Breaking Changes: Property updates in `Avatar` component** ([#1871](https://github.com/channel-io/bezier-react/pull/1871)) by @yangwooseong No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking changes: Remove TagBadge-related types** ([#2114](https://github.com/channel-io/bezier-react/pull/2114)) by @sungik-choi - Remove `color` prop of `TagProps` and `TagBadgeBgColorPreset`. - Remove `TagBadgeSize`. Please change it to `TagSize` and `BadgeSize`. - Remove `TagBadgeVariant`. Please change it to `TagVariant` and `BadgeVariant`. - **Breaking Changes: Property updates in `SegmentedControl` component** ([#1866](https://github.com/channel-io/bezier-react/pull/1866)) by @sungik-choi No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Property updates in `ListItem` component** ([#1925](https://github.com/channel-io/bezier-react/pull/1925)) by @sungik-choi - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `iconStyle`, `iconClassName`, `iconInterpolation`, `contentStyle`, `contentClassName` and `contentInterpolation`. This decision was made to reduce excessive flexibility in the interface. - No longer support `leftIcon` property. Removed for consistency with other component interfaces. Replace it to `leftContent`. - No longer support `name` property. The second argument (name) of `onClick` is also removed. If you need an identifier, combine functions outside of the component. - No longer support `hide`, `nested`, `optionKey` and `disableIconActive` property. Removed because it is a legacy property. Replace `hide` property with conditional rendering. - The size changes according to the `ListItemSize`. This is a change to unify the design. Please change it like below. - `ListItemSize.S` -> `ListItemSize.XS` - `ListItemSize.M` -> `ListItemSize.S` - `ListItemSize.L` -> `ListItemSize.M` - `ListItemSize.XL` -> `ListItemSize.L` **Minor Changes:** - Fix incorrect text size for `XL`(now `L`) size. - **Breaking Changes: Property updates in `Overlay` component** ([#1949](https://github.com/channel-io/bezier-react/pull/1949)) by @sungik-choi - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `containerInterpolation` property. Replace any usage of `containerInterpolation` property with appropriate `containerStyle` or `containerClassName` implementations. - No longer support `wrapperTestId` property. - **Breaking Changes: Remove `TooltipProvider` and Property updates in `Tooltip` component** ([#1974](https://github.com/channel-io/bezier-react/pull/1974)) by @sungik-choi - No longer support `TooltipProvider` and `TooltipProviderProps`. `Tooltip` component was implemented via radix-ui's Tooltip, which required the use of a `TooltipProvider`, which caused all subcomponents to be re-rendered and caused a performance hit. We decided that the ability to share hover delay time between `Tooltip` components via `TooltipProvider` was not a feature we needed, even with the performance penalty. Also, by providing `TooltipProvider` built-in to `AppProvider`, we were unnecessarily importing modules from our library usage that didn't require `Tooltip`. - `Tooltip` component now contains a `TooltipProvider` inside it. **Minor Changes:** - Change the default value of `delayShow` prop from `300` to `0`. - **Breaking Changes: Property updates in `Tag` and `Badge` component** ([#1872](https://github.com/channel-io/bezier-react/pull/1872)) by @yangwooseong No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Property updates in `CheckableAvatar` component** ([#1921](https://github.com/channel-io/bezier-react/pull/1921)) by @sungik-choi No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: `AlphaSmoothCornersBox` component is now `SmoothCornersBox` component.** ([#2079](https://github.com/channel-io/bezier-react/pull/2079)) by @sungik-choi - **Breaking Changes: Property updates in `LegacyTooltip` component** ([#1945](https://github.com/channel-io/bezier-react/pull/1945)) by @sungik-choi - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `contentInterpolation` property. Replace any usage of `contentInterpolation` property with appropriate `contentStyle` or `contentClassName` implementations. - No longer support `contentWrapperInterpolation` property. Replace any usage of `contentWrapperInterpolation` property with appropriate `contentWrapperStyle` or `contentWrapperClassName` implementations. - **Breaking Changes: `AlphaCenter` component is now `Center` component. Property updates in `Center` component** ([#1854](https://github.com/channel-io/bezier-react/pull/1854)) by @sungik-choi - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - Now supports margin props, layout props and `display` prop. - **Breaking Changes: Property updates in `FormLabel`, `FormHelperText`, and `FormErrorMessage` component** ([#1893](https://github.com/channel-io/bezier-react/pull/1893)) by @yangwooseong No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Property updates in `NavGroup` and `NavItem` component** ([#1931](https://github.com/channel-io/bezier-react/pull/1931)) by @sungik-choi `leftIcon` renamed to `leftContent`. Changed to improve consistency of interface property names across libraries. - **Breaking Changes: The enum type that the component receives as props is changed to a string (or number) literal type** ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong The properties that change are: - `AvatarGroupEllipsisType` - `IconSize` - `LegacyTooltipPosition` - `ModalTitleSize` - `OverlayPosition` - `ProgressBarSize`, `ProgressBarVariant` - `SpinnerSize` - `SwitchSize` - `TagBadgeSize`, `TagBadgeVariant` - `TextAreaHeight` - `TextFieldSize`, `TextFieldVariant` - `ToastPlacement`, `ToastAppearance`, `ToastPreset` - `TooltipPosition` Also, `SpinnerThickness` props of `Spinner` is not supported any more. When changed to string literal type, it is changed to the kebab-cased value of enum. e.g. `TooltipPosition.TopCenter` -> `top-center`. Among the above enums, `TextAreaHeight` is converted to number literal type. e.g. `TextAreaHeight.Row16` -> `16`, and `IconSize.normal` is converted to `m` for consistency - **Breaking Changes: Property updates in `FormControl`, `Select`, and `TextField` component** ([#1948](https://github.com/channel-io/bezier-react/pull/1948)) by @yangwooseong - `FormControl` component no longer supports `leftLabelWrapperHeight` props. - `FormControl` component now supports `size` props, which is passed as context to the child component such as `TextField` and `Select` and specified as the size property. - The size property of `Select` and `TextField` component changes from enum to string literal union type. Also, `SelectSize` and `TextFieldSize` enum are deprecated. - **Breaking changes: Remove `testId` and related properties** ([#1971](https://github.com/channel-io/bezier-react/pull/1971)) by @sungik-choi No longer supports `testId` and related properties(e.g. `wrapperTestId`). `testId` is a property used internally by the library for testing with testing-library (`getByTestId`). We don't see a need to expose this as a public API, so we remove it. If you were using it, please replace it with the `data-testid` property. See . - **Breaking Changes: Property updates in `FormControl` component** ([#1935](https://github.com/channel-io/bezier-react/pull/1935)) by @yangwooseong No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Property updates in `Select` component** ([#1913](https://github.com/channel-io/bezier-react/pull/1913)) by @sungik-choi - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `dropdownInterpolation` property. Replace any usage of `dropdownInterpolation` property with appropriate `dropdownStyle` or `dropdownClassName` implementations. - The type of `zIndex` property is changed to a z-index token. (e.g. `"modal"`) - **Breaking Changes: Reorganizing `SectionLabel` component** ([#1936](https://github.com/channel-io/bezier-react/pull/1936)) by @sungik-choi `SectionLabel` is a complex component that can be used both in the form of an accordion and as a simple heading. To better meet the needs of both, we've changed the internal implementation of the component. We've also made changes to make styling overrides as predictable as they are for other components. The style override property, which was unnecessarily open, is now removed. - Remove the internal div wrapper. `style`, `className` properties are now injected into the component instead of the old `wrapperStyle`, `wrapperClassName`. - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support additional style properties of `wrapper`, `contentWrapper`, `leftWrapper` and `rightWrapper`. - No longer support `divider` property. Replace it by adding `Divider` component to the component's before. - The side content property is changed. It is no longer possible to override `iconColor`. - When injecting `onClick` handler, the root element now behaves as a `button` element. This change is to better support keyboard focus control. - **Breaking Changes: Property updates in `Emoji` component** ([#1881](https://github.com/channel-io/bezier-react/pull/1881)) by @yangwooseong No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Property updates in `Radio` component** ([#1923](https://github.com/channel-io/bezier-react/pull/1923)) by @sungik-choi No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Deprecated modules for internal use** ([#1963](https://github.com/channel-io/bezier-react/pull/1963)) by @sungik-choi - No longer provides `useEventHandler` and `useMergeRefs` hook. - No longer provides `useId` hook. Use `useId` hook of `react` instead. - No longer provides `getRootElement` hook. Use `useWindow` hook instead. - No longer provides `StyleUtils` and `StringUtils` utils. - **Breaking Changes: Property updates in `ProgressBar` component** ([#1947](https://github.com/channel-io/bezier-react/pull/1947)) by @sungik-choi - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `activeStyle`, `activeClassName` and `activeInterpolation` property. - No longer support `activeTestId` property. - **Breaking Changes: Property updates in `Tabs`-related components** ([#1960](https://github.com/channel-io/bezier-react/pull/1960)) by @sungik-choi No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Property updates in `Text` component** ([#1820](https://github.com/channel-io/bezier-react/pull/1820)) by @sungik-choi `typo` prop in the `Text` component has been changed to accept only string literals in order to simplify the API and improve the predictability of text styling, particularly in the context of the removal of `styled-components` from `bezier-react`, which has led to the unavailability of CSS Interpolation. **Migration Instructions:** Use [`v2-text-component-interface`](https://github.com/channel-io/bezier-react/tree/alpha/packages/bezier-codemod#change-interface-of-text) transformer from `bezier-codemod` for automated migration. - **Breaking Changes: Reorganizing `KeyValueListItem` component** ([#1941](https://github.com/channel-io/bezier-react/pull/1941)) by @sungik-choi - **Renamed to `KeyValueItem`.** - - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `valueWrapperStyle`, `valueWrapperClassName`, `valueWrapperInterpolation`, `keyWrapperStyle`, `keyWrapperClassName` and `keyWrapperInterpolation`. This decision was made to reduce excessive flexibility in the interface. - No longer support `AdditionalColorProps` and `show` property of ItemAction. - The icon inside ItemAction is now implemented through `Button` component. - The Value Container will now always have 100% of the parent's width. - Add new margin properties to `Icon` component ([#1863](https://github.com/channel-io/bezier-react/pull/1863)) by @yangwooseong - `margin` - `marginHorizontal` - `marginVertical` - **Breaking Changes: Property updates in `NavItem` and `NavGroup` component** ([#1905](https://github.com/channel-io/bezier-react/pull/1905)) by @yangwooseong No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: The enum type that the component receives as props is changed to a string literal type** ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong The properties that change are: - `AvatarSize` - `BannerVariant` - `ButtonColorVariant`, `ButtonStyleVariant`, `ButtonSize` - `EmojiSize` - `SegmentedControlSize` - `TabSize` - `ListItemVariant`, `ListItemSize` - `StatusType`, `StatusSize` When changed to string literal type, it is changed to the kebab-cased value of enum. e.g. `ButtonStyleVariant.MonoChromeDark` -> `monochrome-dark`, `StatusType.OnlineCrescent` -> `online-crescent` - **Breaking Changes: Property updates in `Modal`-related components** ([#1903](https://github.com/channel-io/bezier-react/pull/1903)) by @sungik-choi - No longer supports `as` and `interpolation` props. - The type of `zIndex` property is changed to a z-index token. (e.g. `"modal"`) - **Breaking Change: Removal of `LegacySegmentedControl` Component** ([#1786](https://github.com/channel-io/bezier-react/pull/1786)) by @sungik-choi We have removed the `LegacySegmentedControl` component from our library. This change follows its deprecation in `next-v1.204`. **Reasons for Removal:** - To enhance web accessibility and improve keyboard navigation. - To align with our goals of design modernization and consistent user experience. **Impact:** `LegacySegmentedControl` component is no longer available and cannot be used in your projects. Replace all instances of `LegacySegmentedControl` with `SegmentedControl` component. - **Breaking Changes: Property updates in `LegacyStack` components** ([#1944](https://github.com/channel-io/bezier-react/pull/1944)) by @sungik-choi - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer export `AxisAlignment` type. - **Breaking Changes: Property updates in `TextField` component** ([#1904](https://github.com/channel-io/bezier-react/pull/1904)) by @sungik-choi - No longer support `interpolation`-related properties. Replace any usage of `interpolation` -related properties with appropriate `***style` or `***className` implementations. - No longer support `inputStyle` and `inputClassName` properties. Replace any usage of `inputStyle` and `inputClassName` with appropriate `style` or `className` implementations. - Change the value of `TextFieldVariant` enum value to string. - **Breaking Changes: Remove the default offset(`GNB_WIDTH`) in `Toast`** ([#2117](https://github.com/channel-io/bezier-react/pull/2117)) by @sungik-choi Remove the style because it was dependent on a specific application. Use `{ left: 68 }` instead. - **Breaking Changes: Property updates in `Banner` component** ([#1891](https://github.com/channel-io/bezier-react/pull/1891)) by @sungik-choi No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. **Other changes in `Banner` component** - now supports HTML attributes. - now supports style props. - **Breaking Change: Removal of `LegacyRadio` Component** ([#1943](https://github.com/channel-io/bezier-react/pull/1943)) by @sungik-choi - `LegacyRadio` component has been removed from the library. Please use `RadioGroup` and `Radio` component instead. - Now if `Radio` has no label, its size is reduced by an indicator. - **Breaking Changes: Property updates in `Checkbox` component** ([#1918](https://github.com/channel-io/bezier-react/pull/1918)) by @sungik-choi No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - **Breaking Changes: Property updates in `Switch` component** ([#1885](https://github.com/channel-io/bezier-react/pull/1885)) by @yangwooseong No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - Export the css style sheet for the new design system. ([#1492](https://github.com/channel-io/bezier-react/pull/1492)) by @sungik-choi - **Breaking Changes: Reorganizing `OutlineItem` component** ([#1930](https://github.com/channel-io/bezier-react/pull/1930)) by @sungik-choi `OutlineItem` component was originally designed as a component to draw a tree-like view, _but it was not used as intended in production_. We simplified the component's responsibilities by removing unused properties while retaining the component's ability to apply indentation to subcomponents. - No longer support `paddingLeft` property. **By default, 6px of left padding has been added.** If you need to make changes, override the style. - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `iconStyle`, `iconClassName`, `iconInterpolation`, `contentStyle`, `contentClassName` and `contentInterpolation`. This decision was made to reduce excessive flexibility in the interface. - No longer support `leftIcon` property. Removed for consistency with other component interfaces. Replace it to `leftContent`. - No longer support `leftIconColor` and `leftIconTestId` property. - No longer support `name` property. The second argument (name) of `onClick` is also removed. If you need an identifier, combine functions outside of the component. - No longer support `hide`, `optionKey` and `disableIconActive` property. Replace `hide` property with conditional rendering. - No longer support `onOpen`, `onClickArrow`, `selectedOutlineItemIndex` and `onChangeOption` property. - **Breaking Changes: Property updates in `Slider` component** ([#1883](https://github.com/channel-io/bezier-react/pull/1883)) by @yangwooseong - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - `dir` type is narrowed from `string | undefined` to `ltr | rtl | undefined` - **Breaking Changes: Property updates in `Button` component** ([#1882](https://github.com/channel-io/bezier-react/pull/1882)) by @sungik-choi - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - `ButtonSize` and `ButtonColorVariant` enums have been updated to use kebab case. - **Breaking Change: No longer supports `smoothCorners` mixin. Use `AlphaSmoothCornersBox` components instead.** ([#1892](https://github.com/channel-io/bezier-react/pull/1892)) by @sungik-choi ```tsx // Before const Box = styled.div` ${smoothCorners({ borderRadius: 10, shadow: '0 5px 15px 0 var(--shdw-large)', shadowBlur: 15, backgroundColor: 'var(--bgtxt-absolute-white-dark)', hasBackgroundImage: true, })} ` ... // After ... ``` - **Breaking Changes: `Toast`-related modules** ([#1950](https://github.com/channel-io/bezier-react/pull/1950)) by @sungik-choi - No longer support `actionContent` and `onClick` properties in `ToastOptions`. - Value type of `zIndex` property in `ToastOptions` is changed from `number` to `ZIndex` token. - No longer export `ToastIconColor` enum. - **Breaking Changes: Property updates in `TextArea` component** ([#1914](https://github.com/channel-io/bezier-react/pull/1914)) by @sungik-choi - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - No longer support `wrapperStyle`, `wrapperClassName` and `wrapperInterpolation` property. It was never properly implemented before, and the Wrapper element inside was also removed. - **Breaking Changes: Deprecate support for `styled-components` related modules** ([#1962](https://github.com/channel-io/bezier-react/pull/1962)) by @sungik-choi - No longer support legacy foundation modules. Use the `useToken` hook and components to replace it - `LightFoundation` and `DarkFoundation` - `Spacing` - `ev1`, `ev2`, `ev3`, `ev4`, `ev5` and `ev6` - `createThemes`, `Theme`, `SemanticNames`, `LightTheme` and `DarkTheme` - `TransitionDuration` and `Transition` - `Border` - `Typography`, `TypoAbsoluteNumber`, `LineHeightAbsoluteNumber` and `TypographyType` - `absoluteCenter`, `disableAutoMinimum`, `hideScrollbars` and `ellipsis` - `ThemeVarsAdditionalType` and `ThemeVars` - `GlobalStyle` - `Foundation` - `GlobalStyleProp` - `createGlobalStyle`, `styled`, `css`, `FoundationProvider`, `useFoundation`, `keyframes`, `StyleSheetManager` and `ServerStyleSheet` - No longer support `BezierProvider`. Use the `AppProvider` instead - No longer support `gap` and `touchableHover` mixins. Please implement and use your own ```tsx function gap(spacing: number): InjectedInterpolation { return css` gap: ${spacing}px; @supports not (gap: ${spacing}px) { margin-top: ${-spacing}px; margin-left: ${-spacing}px; > * { margin-top: ${spacing}px; margin-left: ${spacing}px; } } `; } function touchableHover( interpolation: InjectedInterpolation, ): InjectedInterpolation { return css` @media (hover: hover) { &:hover { ${interpolation} } } @media (hover: none) { &:active { ${interpolation} } } `; } ``` - No longer support `inputTextStyle`, `inputPlaceholderStyle`, `inputWrapperStyle`, `focusedInputWrapperStyle` and `erroredInputWrapperStyle`. Please migrate using `@channel.io/bezier-codemod`'s `v2-interpolation-to-css-variable` transformer. - **Breaking Changes: `AlphaStack` component has been changed to a `Stack` component, and `Stack` component has been changed to `LegacyStack` component.** ([#1837](https://github.com/channel-io/bezier-react/pull/1837)) by @sungik-choi Changes to remove the dependency of `Stack` and `StackItem` to allow stack layouts to be configured without additional DOM elements. And improved the existing `AlphaStack` to support more Flex layout related properties like reverse, wrap, and more align options, etc. See StackProps for more information. We also added new `HStack` and `VStack` components, which are shorthand components that fix the direction prop of `AlphaStack`. As mentioned above, the existing components become `LegacyHStack`, `LegacyVStack`. The layout implemented by `StackItem` can be partially replaced by the Layout component's `grow`, `shrink` common properties and margin common properties. Note that the `align`, `justify` (align-self, justify-self in CSS flex) properties provided by `StackItem` are not provided by the Layout component. ```jsx /* AS-IS */ return ( ); /* TO-BE */ return ( ); ``` The changes also apply to other components that use `Stack` internally, and there are a few breaking changes. - `RadioGroup`, `ButtonGroup`, `FormGroup` no longer support `as` prop. - **Breaking Change: Removal of `ListMenuTitle` Component** ([#1900](https://github.com/channel-io/bezier-react/pull/1900)) by @yangwooseong - It was no longer being managed or utilized by our designers. - If you are currently using `ListMenuTitle` in your application, please replace it with the `SectionLabel` component for similar functionality. ### Minor Changes - Implement multi theme feature based on data attributes ([#1756](https://github.com/channel-io/bezier-react/pull/1756)) by @sungik-choi - Move `@channel.io/bezier-tokens` from dev depdency to dependency ([#1985](https://github.com/channel-io/bezier-react/pull/1985)) by @sungik-choi - Add the `TooltipPrimitive` component, which is the same as the [`Tooltip` component in radix-ui](https://www.radix-ui.com/primitives/docs/components/tooltip). You can use it by importing it from the `/alpha` path. ([#2049](https://github.com/channel-io/bezier-react/pull/2049)) by @sungik-choi ```tsx import { TooltipPrimitive, TooltipPrimitiveArrow, TooltipPrimitiveContent, TooltipPrimitivePortal, TooltipPrimitiveProvider, TooltipPrimitiveTrigger, } from "@channel.io/bezier-react/alpha"; ``` - When you pass a value of number type to the dimension-related properties of margin prop and layout prop, they implicitly add px units as a suffix. See: ([#1823](https://github.com/channel-io/bezier-react/pull/1823)) by @sungik-choi - Add `Box` component. `Box` component is responsible for the primitive layout and provides easy access to the design tokens in the design system ([#1785](https://github.com/channel-io/bezier-react/pull/1785)) by @sungik-choi ```tsx ``` - Fixes style inheritance issues by explicitly giving CSS custom properties an initial value ([#1846](https://github.com/channel-io/bezier-react/pull/1846)) by @sungik-choi - Apply bezier-tokens to bezier-react's style sheet and fix some invalid css selector ([#1495](https://github.com/channel-io/bezier-react/pull/1495)) by @sungik-choi - Add the `DialogPrimitive` component, which is the same as the [`Dialog` component in radix-ui](https://www.radix-ui.com/primitives/docs/components/dialog). You can use it by importing it from the `/alpha` path. ([#2049](https://github.com/channel-io/bezier-react/pull/2049)) by @sungik-choi ```tsx import { DialogPrimitive, DialogPrimitiveClose, DialogPrimitiveContent, DialogPrimitiveDescription, DialogPrimitiveOverlay, DialogPrimitivePortal, DialogPrimitiveTitle, DialogPrimitiveTrigger, } from "@channel.io/bezier-react/alpha"; ``` - `ButtonGroup` now supports HTML attributes ([#1890](https://github.com/channel-io/bezier-react/pull/1890)) by @sungik-choi - `Banner` will now render content even if the `content` prop is not a string. The same applies to link-related props. ([#1972](https://github.com/channel-io/bezier-react/pull/1972)) by @sungik-choi - Rename `AlphaAppProvider` to `AppProvider` ([#1834](https://github.com/channel-io/bezier-react/pull/1834)) by @sungik-choi - Rename the `style.css` file to `styles.css` ([#1791](https://github.com/channel-io/bezier-react/pull/1791)) by @sungik-choi - Add `align` prop to `Text` component. This prop is used to set horizontal alignment of text ([#1820](https://github.com/channel-io/bezier-react/pull/1820)) by @sungik-choi ```tsx ``` - Remove `borderStyle` prop from Layout props ([#1848](https://github.com/channel-io/bezier-react/pull/1848)) by @sungik-choi - Add `useRootElement` hook. It is only available to `WindowProvider` children, and provides easy access to the root element of window context value. ([#1981](https://github.com/channel-io/bezier-react/pull/1981)) by @sungik-choi ```tsx const { window, document, rootElement } = useWindow(); // Same as useWindow().rootElement const rootElement = useRootElement(); ``` ### Patch Changes - Fixes an issue with color inheritance across components. ([#2009](https://github.com/channel-io/bezier-react/pull/2009)) by @sungik-choi - Add missing default margin styles of `LegacyStackItem` ([#2004](https://github.com/channel-io/bezier-react/pull/2004)) by @sungik-choi - Fixes issue with `ModalBody`, `ModalFooter` not applying styling correctly when wrapped in other elements. ([#2017](https://github.com/channel-io/bezier-react/pull/2017)) by @sungik-choi - Add `overflow: hidden` to `ListItem` component ([#2013](https://github.com/channel-io/bezier-react/pull/2013)) by @yangwooseong - Fix invalid `aria-modal` value in Modal Content. ([#2052](https://github.com/channel-io/bezier-react/pull/2052)) by @sungik-choi - Fix `TabAction` typography style for size M. ([#2035](https://github.com/channel-io/bezier-react/pull/2035)) by @sungik-choi - Minify the CSS output ([#1791](https://github.com/channel-io/bezier-react/pull/1791)) by @sungik-choi - Update background color of `TextField`'s secondary variant. ([#2016](https://github.com/channel-io/bezier-react/pull/2016)) by @sungik-choi - Mute the error of `smoothCornerScript` when called twice. ([#2010](https://github.com/channel-io/bezier-react/pull/2010)) by @chaejunlee - Now exports the `tokens` object from `@channel.io/bezier-tokens`. ([#1992](https://github.com/channel-io/bezier-react/pull/1992)) by @sungik-choi - Adds icon and typo size for avatar size `"72"`, which were missing from `AvatarGroup`. ([#2071](https://github.com/channel-io/bezier-react/pull/2071)) by @sungik-choi - Add missing `overflow: hidden` style to item wrapper of `KeyValueItem` component. ([#2036](https://github.com/channel-io/bezier-react/pull/2036)) by @sungik-choi - Fixes `Overlay` not closing in other windows. ([#2037](https://github.com/channel-io/bezier-react/pull/2037)) by @sungik-choi - Fixes a bug where onHide is called when clicking inside the overlay, causing the overlay to close. ([#1977](https://github.com/channel-io/bezier-react/pull/1977)) by @yangwooseong - Fix invalid style migrations of `Tabs` component. ([#2014](https://github.com/channel-io/bezier-react/pull/2014)) by @sungik-choi - Add missing spreading props to `ThemeProvider` and related components. ([#1986](https://github.com/channel-io/bezier-react/pull/1986)) by @sungik-choi - Fix `ListItem`'s left icon color specificity issue. ([#2018](https://github.com/channel-io/bezier-react/pull/2018)) by @sungik-choi - Fix `Badge` component style issue ([#2068](https://github.com/channel-io/bezier-react/pull/2068)) by @yangwooseong - Fixes an issue where multi line truncated in `Text` was not being applied. ([#1994](https://github.com/channel-io/bezier-react/pull/1994)) by @sungik-choi - Updated dependencies - @channel.io/bezier-tokens@0.1.0 ## @channel.io/bezier-codemod@0.5.0 ### Minor Changes - Changes in `v2-text-component-interface` codemod ([#1932](https://github.com/channel-io/bezier-react/pull/1932)) by @yangwooseong Previously, both the component name and the name of the property were checked, but now only the name of the component property is checked. - Add codemod for Stack component ([#1836](https://github.com/channel-io/bezier-react/pull/1836)) by @yangwooseong - Add more various cases to `v2-enum-member-to-string-literal` ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong - Fix typo in `v2-z-index-interpolation-to-css-variable` codemod. It now transforms `${ZIndex.Float}` enum to `var(--z-index-floating)`, not `var(--z-index-float)`. ([#1924](https://github.com/channel-io/bezier-react/pull/1924)) by @yangwooseong - Add codemod to transform interface of `Text` component ([#1849](https://github.com/channel-io/bezier-react/pull/1849)) by @yangwooseong - Enhancement in `v2-foundation-to-css-variable-transition` codemod ([#1917](https://github.com/channel-io/bezier-react/pull/1917)) by @yangwooseong - It will properly remove import statement if it converts code where `TransitionDuration` is used. - Changes in `v2-remove-alpha-from-alpha-stack` transform ([#1894](https://github.com/channel-io/bezier-react/pull/1894)) by @yangwooseong - It is renamed as `v2-remove-alpha-from-alpha-components`. - It covers `AlphaCenter` as well. - Add `v2-foundation-to-css-variable-spacing` codemod to convert the foundation's spacing variable to pixels ([#1907](https://github.com/channel-io/bezier-react/pull/1907)) by @yangwooseong This transforms ```tsx import { styled } from "@channel.io/bezier-react"; export const Wrapper = styled.div` padding: ${({ foundation }) => foundation?.spacing.s5}; `; ``` into ```tsx import { styled } from "@channel.io/bezier-react"; export const Wrapper = styled.div` padding: 12px; `; ``` - Changes in `v2-**-interpolation-to-css-variable` transform. ([#1928](https://github.com/channel-io/bezier-react/pull/1928)) by @yangwooseong - it is renamed to `v2-interpolation-to-css-variable-**`. e.g. `v2-interpolation-to-css-varable-input`, `v2-interpolation-to-css-variable-typography`, and so on - it provides integrated transform named `v2-interpolation-to-css-variable` that handles all interpolation transform - Enhance `import-styled-from-styled-component` codemod to cover other APIs from `styled-components` ([#1852](https://github.com/channel-io/bezier-react/pull/1852)) by @yangwooseong - Add `Typography` transform logic to interpolation codemod ([#1841](https://github.com/channel-io/bezier-react/pull/1841)) by @yangwooseong - Add v2 prefix to codemods related to major version 2 ([#1844](https://github.com/channel-io/bezier-react/pull/1844)) by @yangwooseong - Add codemod for z-index interpolation and enum ([#1845](https://github.com/channel-io/bezier-react/pull/1845)) by @yangwooseong - Add more various cases to `v2-enum-member-to-string-literal`. Now it covers following enums. ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong - `AvatarGroupEllipsisType` - `IconSize` - `LegacyTooltipPosition` - `ModalTitleSize` - `OverlayPosition` - `ProgressBarSize`, `ProgressBarVariant` - `SpinnerSize` - `SwitchSize` - `TagBadgeSize`, `TagBadgeVariant` - `TextAreaHeight` - `TextFieldSize`, `TextFieldVariant` - `ToastPlacement`, `ToastAppearance`, `ToastPreset` - `TooltipPosition` - Add `inputPlaceholderStyle` migration logic to `v2-input-interpolation-to-css-variable` codemod ([#1926](https://github.com/channel-io/bezier-react/pull/1926)) by @yangwooseong - Add transform functions to help to migrate foundation to css variable generated by `@channel.io/bezier-tokens` package. They cover theme, transition, elevation, rounding, and border of foundation ([#1781](https://github.com/channel-io/bezier-react/pull/1781)) by @yangwooseong - Added a codemod to switch the library for importing 'styled' object from @channel.io/bezier-react to styled-components ([#1789](https://github.com/channel-io/bezier-react/pull/1789)) by @yangwooseong - Add codemod for mixin interpolation ([#1787](https://github.com/channel-io/bezier-react/pull/1787)) by @yangwooseong ### Patch Changes - Fix bug in `v2-import-from-bezier-to-styled-components` codemod when there are only named imports as following: ([#1987](https://github.com/channel-io/bezier-react/pull/1987)) by @yangwooseong ```tsx // As-is import { css } from "@channel.io/bezier-react"; // To-be import { css } from "styled-components"; ``` - Fix `hasNamedImportInImportDeclaration` util to check all named imports ([#2060](https://github.com/channel-io/bezier-react/pull/2060)) by @yangwooseong ## @channel.io/bezier-tokens@0.1.0 ### Minor Changes - Apply deep freeze to the `tokens` object. ([#1992](https://github.com/channel-io/bezier-react/pull/1992)) by @sungik-choi - Add the missing `bg-header-float` semantic color token ([#1842](https://github.com/channel-io/bezier-react/pull/1842)) by @sungik-choi - Add composition tokens, such as box-shadow ([#1769](https://github.com/channel-io/bezier-react/pull/1769)) by @sungik-choi - Now serving one combined styles.css file. This is a breaking change for anyone who was importing the individual CSS files. You will need to update your import to `@channel.io/bezier-tokens/css/styles.css`. ([#1769](https://github.com/channel-io/bezier-react/pull/1769)) by @sungik-choi - Add z-index and opacity tokens ([#1766](https://github.com/channel-io/bezier-react/pull/1766)) by @sungik-choi - Remove invalid radius tokens ([#1934](https://github.com/channel-io/bezier-react/pull/1934)) by @sungik-choi - `radius-10` - `radius-14` - `radius-100-p` - Fix invalid letter spacing token values ([#1821](https://github.com/channel-io/bezier-react/pull/1821)) by @sungik-choi - First release ([#1685](https://github.com/channel-io/bezier-react/pull/1685)) by @sungik-choi - Add categories by token to the JavaScript build file ([#1766](https://github.com/channel-io/bezier-react/pull/1766)) by @sungik-choi - Remove unused tokens and add missing unit to radius tokens ([#1752](https://github.com/channel-io/bezier-react/pull/1752)) by @sungik-choi ### Patch Changes - Remove duplicate styles in styles.css ([#1779](https://github.com/channel-io/bezier-react/pull/1779)) by @sungik-choi ## bezier-figma-plugin@0.5.0 ### Minor Changes - Upgrade to use @channel.io/bezier-react@2.0.0 ([#2001](https://github.com/channel-io/bezier-react/pull/2001)) by @sungik-choi ### Patch Changes - Enhance icon extract logic by catching error ([#2073](https://github.com/channel-io/bezier-react/pull/2073)) by @yangwooseong - Updated dependencies - @channel.io/bezier-react@2.0.0 ## @channel.io/bezier-vscode@0.1.0 ### Minor Changes - Create a package to support autocomplete for Bezier Design Tokens ([#2091](https://github.com/channel-io/bezier-react/pull/2091)) by @yangwooseong Co-authored-by: github-actions[bot] --- .changeset/afraid-kings-push.md | 7 - .changeset/bright-zoos-attend.md | 6 - .changeset/calm-llamas-bake.md | 9 - .changeset/calm-wasps-tease.md | 5 - .changeset/chilled-dots-divide.md | 5 - .changeset/chilled-oranges-drum.md | 5 - .changeset/cuddly-chairs-warn.md | 7 - .changeset/cuddly-crews-matter.md | 20 - .changeset/cuddly-socks-worry.md | 5 - .changeset/curly-poets-decide.md | 9 - .changeset/curvy-dragons-rest.md | 12 - .changeset/cyan-pumpkins-run.md | 7 - .changeset/dry-schools-draw.md | 7 - .changeset/early-deers-attend.md | 5 - .changeset/early-garlics-smoke.md | 5 - .changeset/early-tables-taste.md | 5 - .changeset/eight-hounds-smoke.md | 5 - .changeset/eight-turtles-relax.md | 5 - .changeset/eighty-crabs-argue.md | 9 - .changeset/eighty-steaks-play.md | 5 - .changeset/empty-jars-shop.md | 5 - .changeset/famous-melons-juggle.md | 8 - .changeset/famous-trees-wash.md | 7 - .changeset/five-plants-rescue.md | 5 - .changeset/fluffy-comics-grin.md | 5 - .changeset/fluffy-dolphins-relax.md | 8 - .changeset/friendly-avocados-love.md | 5 - .changeset/funny-peaches-report.md | 7 - .changeset/gentle-shirts-grow.md | 7 - .changeset/giant-terms-impress.md | 13 - .changeset/gold-gorillas-shout.md | 25 - .changeset/good-dodos-obey.md | 9 - .changeset/great-socks-jam.md | 16 - .changeset/great-ties-hunt.md | 9 - .changeset/grumpy-flowers-trade.md | 5 - .changeset/healthy-rocks-tap.md | 7 - .changeset/healthy-waves-promise.md | 9 - .changeset/hip-students-care.md | 5 - .changeset/honest-bugs-wait.md | 16 - .changeset/hot-bobcats-develop.md | 7 - .changeset/hot-parrots-shop.md | 5 - .changeset/hungry-coats-punch.md | 25 - .changeset/large-pants-brush.md | 5 - .changeset/large-wasps-compete.md | 7 - .changeset/little-bikes-obey.md | 5 - .changeset/long-birds-attend.md | 10 - .changeset/long-turtles-enjoy.md | 9 - .changeset/loud-feet-melt.md | 8 - .changeset/many-shrimps-float.md | 5 - .changeset/metal-planets-peel.md | 5 - .changeset/mighty-balloons-drum.md | 7 - .changeset/mighty-hornets-promise.md | 5 - .changeset/modern-cups-nail.md | 5 - .changeset/modern-days-cross.md | 5 - .changeset/modern-houses-give.md | 11 - .changeset/moody-snakes-rhyme.md | 5 - .changeset/neat-badgers-arrive.md | 5 - .changeset/old-rules-breathe.md | 5 - .changeset/olive-pillows-prove.md | 9 - .changeset/orange-pants-live.md | 12 - .changeset/perfect-ears-yawn.md | 15 - .changeset/perfect-parents-share.md | 5 - .changeset/plenty-planes-sniff.md | 5 - .changeset/poor-windows-join.md | 9 - .changeset/pre.json | 132 ------ .changeset/proud-feet-drum.md | 7 - .changeset/purple-dodos-move.md | 5 - .changeset/quick-peaches-fail.md | 5 - .changeset/quiet-waves-vanish.md | 5 - .changeset/rare-coats-sing.md | 5 - .changeset/selfish-turkeys-boil.md | 5 - .changeset/sharp-donuts-dance.md | 18 - .changeset/sharp-hounds-lick.md | 8 - .changeset/short-rice-press.md | 16 - .changeset/silent-falcons-behave.md | 5 - .changeset/silver-pets-hammer.md | 5 - .changeset/six-humans-occur.md | 5 - .changeset/six-lemons-admire.md | 8 - .changeset/sixty-cows-fetch.md | 5 - .changeset/sixty-goats-eat.md | 18 - .changeset/slimy-lobsters-sparkle.md | 5 - .changeset/small-readers-compare.md | 9 - .changeset/smart-geese-provide.md | 5 - .changeset/smart-owls-reply.md | 7 - .changeset/smart-ravens-rescue.md | 19 - .changeset/soft-months-film.md | 12 - .changeset/soft-parents-work.md | 5 - .changeset/sour-dogs-sin.md | 5 - .changeset/stale-nails-study.md | 5 - .changeset/strange-colts-beg.md | 5 - .changeset/strange-toes-tap.md | 5 - .changeset/sweet-cups-tell.md | 8 - .changeset/sweet-kangaroos-rush.md | 7 - .changeset/sweet-suits-smoke.md | 7 - .changeset/tall-maps-lick.md | 5 - .changeset/tame-dolls-drive.md | 16 - .changeset/tame-news-yawn.md | 5 - .changeset/ten-plants-remain.md | 8 - .changeset/tender-years-camp.md | 8 - .changeset/thin-games-add.md | 5 - .changeset/thirty-dodos-push.md | 5 - .changeset/three-mirrors-hunt.md | 11 - .changeset/tough-lions-change.md | 5 - .changeset/tough-rats-drive.md | 5 - .changeset/tricky-forks-marry.md | 5 - .changeset/tricky-geese-lick.md | 5 - .changeset/twelve-ladybugs-glow.md | 5 - .changeset/twenty-onions-rule.md | 34 -- .changeset/two-adults-pay.md | 5 - .changeset/violet-queens-explain.md | 5 - .changeset/weak-toys-dress.md | 9 - .changeset/wicked-months-sparkle.md | 5 - .changeset/wild-cows-rescue.md | 8 - .changeset/wild-walls-suffer.md | 58 --- .changeset/witty-kids-tie.md | 11 - .changeset/witty-pans-clean.md | 35 -- .changeset/yellow-eagles-matter.md | 8 - packages/bezier-codemod/CHANGELOG.md | 97 ++++ packages/bezier-codemod/package.json | 2 +- packages/bezier-figma-plugin/CHANGELOG.md | 13 + packages/bezier-figma-plugin/package.json | 4 +- packages/bezier-react/CHANGELOG.md | 538 ++++++++++++++++++++++ packages/bezier-react/package.json | 4 +- packages/bezier-tokens/CHANGELOG.md | 32 ++ packages/bezier-tokens/package.json | 2 +- packages/bezier-vscode/CHANGELOG.md | 6 + packages/bezier-vscode/package.json | 4 +- yarn.lock | 10 +- 128 files changed, 699 insertions(+), 1143 deletions(-) delete mode 100644 .changeset/afraid-kings-push.md delete mode 100644 .changeset/bright-zoos-attend.md delete mode 100644 .changeset/calm-llamas-bake.md delete mode 100644 .changeset/calm-wasps-tease.md delete mode 100644 .changeset/chilled-dots-divide.md delete mode 100644 .changeset/chilled-oranges-drum.md delete mode 100644 .changeset/cuddly-chairs-warn.md delete mode 100644 .changeset/cuddly-crews-matter.md delete mode 100644 .changeset/cuddly-socks-worry.md delete mode 100644 .changeset/curly-poets-decide.md delete mode 100644 .changeset/curvy-dragons-rest.md delete mode 100644 .changeset/cyan-pumpkins-run.md delete mode 100644 .changeset/dry-schools-draw.md delete mode 100644 .changeset/early-deers-attend.md delete mode 100644 .changeset/early-garlics-smoke.md delete mode 100644 .changeset/early-tables-taste.md delete mode 100644 .changeset/eight-hounds-smoke.md delete mode 100644 .changeset/eight-turtles-relax.md delete mode 100644 .changeset/eighty-crabs-argue.md delete mode 100644 .changeset/eighty-steaks-play.md delete mode 100644 .changeset/empty-jars-shop.md delete mode 100644 .changeset/famous-melons-juggle.md delete mode 100644 .changeset/famous-trees-wash.md delete mode 100644 .changeset/five-plants-rescue.md delete mode 100644 .changeset/fluffy-comics-grin.md delete mode 100644 .changeset/fluffy-dolphins-relax.md delete mode 100644 .changeset/friendly-avocados-love.md delete mode 100644 .changeset/funny-peaches-report.md delete mode 100644 .changeset/gentle-shirts-grow.md delete mode 100644 .changeset/giant-terms-impress.md delete mode 100644 .changeset/gold-gorillas-shout.md delete mode 100644 .changeset/good-dodos-obey.md delete mode 100644 .changeset/great-socks-jam.md delete mode 100644 .changeset/great-ties-hunt.md delete mode 100644 .changeset/grumpy-flowers-trade.md delete mode 100644 .changeset/healthy-rocks-tap.md delete mode 100644 .changeset/healthy-waves-promise.md delete mode 100644 .changeset/hip-students-care.md delete mode 100644 .changeset/honest-bugs-wait.md delete mode 100644 .changeset/hot-bobcats-develop.md delete mode 100644 .changeset/hot-parrots-shop.md delete mode 100644 .changeset/hungry-coats-punch.md delete mode 100644 .changeset/large-pants-brush.md delete mode 100644 .changeset/large-wasps-compete.md delete mode 100644 .changeset/little-bikes-obey.md delete mode 100644 .changeset/long-birds-attend.md delete mode 100644 .changeset/long-turtles-enjoy.md delete mode 100644 .changeset/loud-feet-melt.md delete mode 100644 .changeset/many-shrimps-float.md delete mode 100644 .changeset/metal-planets-peel.md delete mode 100644 .changeset/mighty-balloons-drum.md delete mode 100644 .changeset/mighty-hornets-promise.md delete mode 100644 .changeset/modern-cups-nail.md delete mode 100644 .changeset/modern-days-cross.md delete mode 100644 .changeset/modern-houses-give.md delete mode 100644 .changeset/moody-snakes-rhyme.md delete mode 100644 .changeset/neat-badgers-arrive.md delete mode 100644 .changeset/old-rules-breathe.md delete mode 100644 .changeset/olive-pillows-prove.md delete mode 100644 .changeset/orange-pants-live.md delete mode 100644 .changeset/perfect-ears-yawn.md delete mode 100644 .changeset/perfect-parents-share.md delete mode 100644 .changeset/plenty-planes-sniff.md delete mode 100644 .changeset/poor-windows-join.md delete mode 100644 .changeset/pre.json delete mode 100644 .changeset/proud-feet-drum.md delete mode 100644 .changeset/purple-dodos-move.md delete mode 100644 .changeset/quick-peaches-fail.md delete mode 100644 .changeset/quiet-waves-vanish.md delete mode 100644 .changeset/rare-coats-sing.md delete mode 100644 .changeset/selfish-turkeys-boil.md delete mode 100644 .changeset/sharp-donuts-dance.md delete mode 100644 .changeset/sharp-hounds-lick.md delete mode 100644 .changeset/short-rice-press.md delete mode 100644 .changeset/silent-falcons-behave.md delete mode 100644 .changeset/silver-pets-hammer.md delete mode 100644 .changeset/six-humans-occur.md delete mode 100644 .changeset/six-lemons-admire.md delete mode 100644 .changeset/sixty-cows-fetch.md delete mode 100644 .changeset/sixty-goats-eat.md delete mode 100644 .changeset/slimy-lobsters-sparkle.md delete mode 100644 .changeset/small-readers-compare.md delete mode 100644 .changeset/smart-geese-provide.md delete mode 100644 .changeset/smart-owls-reply.md delete mode 100644 .changeset/smart-ravens-rescue.md delete mode 100644 .changeset/soft-months-film.md delete mode 100644 .changeset/soft-parents-work.md delete mode 100644 .changeset/sour-dogs-sin.md delete mode 100644 .changeset/stale-nails-study.md delete mode 100644 .changeset/strange-colts-beg.md delete mode 100644 .changeset/strange-toes-tap.md delete mode 100644 .changeset/sweet-cups-tell.md delete mode 100644 .changeset/sweet-kangaroos-rush.md delete mode 100644 .changeset/sweet-suits-smoke.md delete mode 100644 .changeset/tall-maps-lick.md delete mode 100644 .changeset/tame-dolls-drive.md delete mode 100644 .changeset/tame-news-yawn.md delete mode 100644 .changeset/ten-plants-remain.md delete mode 100644 .changeset/tender-years-camp.md delete mode 100644 .changeset/thin-games-add.md delete mode 100644 .changeset/thirty-dodos-push.md delete mode 100644 .changeset/three-mirrors-hunt.md delete mode 100644 .changeset/tough-lions-change.md delete mode 100644 .changeset/tough-rats-drive.md delete mode 100644 .changeset/tricky-forks-marry.md delete mode 100644 .changeset/tricky-geese-lick.md delete mode 100644 .changeset/twelve-ladybugs-glow.md delete mode 100644 .changeset/twenty-onions-rule.md delete mode 100644 .changeset/two-adults-pay.md delete mode 100644 .changeset/violet-queens-explain.md delete mode 100644 .changeset/weak-toys-dress.md delete mode 100644 .changeset/wicked-months-sparkle.md delete mode 100644 .changeset/wild-cows-rescue.md delete mode 100644 .changeset/wild-walls-suffer.md delete mode 100644 .changeset/witty-kids-tie.md delete mode 100644 .changeset/witty-pans-clean.md delete mode 100644 .changeset/yellow-eagles-matter.md diff --git a/.changeset/afraid-kings-push.md b/.changeset/afraid-kings-push.md deleted file mode 100644 index 9a42b8a2ee..0000000000 --- a/.changeset/afraid-kings-push.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Avatar` component** - -No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/bright-zoos-attend.md b/.changeset/bright-zoos-attend.md deleted file mode 100644 index 88a088f033..0000000000 --- a/.changeset/bright-zoos-attend.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Changes in `v2-text-component-interface` codemod -Previously, both the component name and the name of the property were checked, but now only the name of the component property is checked. diff --git a/.changeset/calm-llamas-bake.md b/.changeset/calm-llamas-bake.md deleted file mode 100644 index c0276203d8..0000000000 --- a/.changeset/calm-llamas-bake.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking changes: Remove TagBadge-related types** - -- Remove `color` prop of `TagProps` and `TagBadgeBgColorPreset`. -- Remove `TagBadgeSize`. Please change it to `TagSize` and `BadgeSize`. -- Remove `TagBadgeVariant`. Please change it to `TagVariant` and `BadgeVariant`. diff --git a/.changeset/calm-wasps-tease.md b/.changeset/calm-wasps-tease.md deleted file mode 100644 index 322a82b602..0000000000 --- a/.changeset/calm-wasps-tease.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add codemod for Stack component diff --git a/.changeset/chilled-dots-divide.md b/.changeset/chilled-dots-divide.md deleted file mode 100644 index 32fe64f286..0000000000 --- a/.changeset/chilled-dots-divide.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Implement multi theme feature based on data attributes diff --git a/.changeset/chilled-oranges-drum.md b/.changeset/chilled-oranges-drum.md deleted file mode 100644 index b697962894..0000000000 --- a/.changeset/chilled-oranges-drum.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fixes an issue with color inheritance across components. diff --git a/.changeset/cuddly-chairs-warn.md b/.changeset/cuddly-chairs-warn.md deleted file mode 100644 index 3dcb468740..0000000000 --- a/.changeset/cuddly-chairs-warn.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `SegmentedControl` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/cuddly-crews-matter.md b/.changeset/cuddly-crews-matter.md deleted file mode 100644 index dd9aa520d7..0000000000 --- a/.changeset/cuddly-crews-matter.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `ListItem` component** - -- No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `iconStyle`, `iconClassName`, `iconInterpolation`, `contentStyle`, `contentClassName` and `contentInterpolation`. This decision was made to reduce excessive flexibility in the interface. -- No longer support `leftIcon` property. Removed for consistency with other component interfaces. Replace it to `leftContent`. -- No longer support `name` property. The second argument (name) of `onClick` is also removed. If you need an identifier, combine functions outside of the component. -- No longer support `hide`, `nested`, `optionKey` and `disableIconActive` property. Removed because it is a legacy property. Replace `hide` property with conditional rendering. -- The size changes according to the `ListItemSize`. This is a change to unify the design. Please change it like below. - - `ListItemSize.S` -> `ListItemSize.XS` - - `ListItemSize.M` -> `ListItemSize.S` - - `ListItemSize.L` -> `ListItemSize.M` - - `ListItemSize.XL` -> `ListItemSize.L` - -**Minor Changes:** - -- Fix incorrect text size for `XL`(now `L`) size. diff --git a/.changeset/cuddly-socks-worry.md b/.changeset/cuddly-socks-worry.md deleted file mode 100644 index 652d85af62..0000000000 --- a/.changeset/cuddly-socks-worry.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add more various cases to `v2-enum-member-to-string-literal` diff --git a/.changeset/curly-poets-decide.md b/.changeset/curly-poets-decide.md deleted file mode 100644 index 7bd31a8795..0000000000 --- a/.changeset/curly-poets-decide.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Overlay` component** - -- No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `containerInterpolation` property. Replace any usage of `containerInterpolation` property with appropriate `containerStyle` or `containerClassName` implementations. -- No longer support `wrapperTestId` property. diff --git a/.changeset/curvy-dragons-rest.md b/.changeset/curvy-dragons-rest.md deleted file mode 100644 index 4ef6a4b9c2..0000000000 --- a/.changeset/curvy-dragons-rest.md +++ /dev/null @@ -1,12 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Remove `TooltipProvider` and Property updates in `Tooltip` component** - -- No longer support `TooltipProvider` and `TooltipProviderProps`. `Tooltip` component was implemented via radix-ui's Tooltip, which required the use of a `TooltipProvider`, which caused all subcomponents to be re-rendered and caused a performance hit. We decided that the ability to share hover delay time between `Tooltip` components via `TooltipProvider` was not a feature we needed, even with the performance penalty. Also, by providing `TooltipProvider` built-in to `AppProvider`, we were unnecessarily importing modules from our library usage that didn't require `Tooltip`. -- `Tooltip` component now contains a `TooltipProvider` inside it. - -**Minor Changes:** - -- Change the default value of `delayShow` prop from `300` to `0`. diff --git a/.changeset/cyan-pumpkins-run.md b/.changeset/cyan-pumpkins-run.md deleted file mode 100644 index 8a638a33a5..0000000000 --- a/.changeset/cyan-pumpkins-run.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Tag` and `Badge` component** - -No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/dry-schools-draw.md b/.changeset/dry-schools-draw.md deleted file mode 100644 index ac8c30849a..0000000000 --- a/.changeset/dry-schools-draw.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `CheckableAvatar` component** - -No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/early-deers-attend.md b/.changeset/early-deers-attend.md deleted file mode 100644 index c8b4e3e4c4..0000000000 --- a/.changeset/early-deers-attend.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"bezier-figma-plugin": minor ---- - -Upgrade to use @channel.io/bezier-react@2.0.0 diff --git a/.changeset/early-garlics-smoke.md b/.changeset/early-garlics-smoke.md deleted file mode 100644 index ecc8eebec9..0000000000 --- a/.changeset/early-garlics-smoke.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Fix typo in `v2-z-index-interpolation-to-css-variable` codemod. It now transforms `${ZIndex.Float}` enum to `var(--z-index-floating)`, not `var(--z-index-float)`. diff --git a/.changeset/early-tables-taste.md b/.changeset/early-tables-taste.md deleted file mode 100644 index 8c267ccc4f..0000000000 --- a/.changeset/early-tables-taste.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add codemod to transform interface of `Text` component diff --git a/.changeset/eight-hounds-smoke.md b/.changeset/eight-hounds-smoke.md deleted file mode 100644 index 12f1f0ea35..0000000000 --- a/.changeset/eight-hounds-smoke.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Add missing default margin styles of `LegacyStackItem` diff --git a/.changeset/eight-turtles-relax.md b/.changeset/eight-turtles-relax.md deleted file mode 100644 index 935f15b2d2..0000000000 --- a/.changeset/eight-turtles-relax.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: `AlphaSmoothCornersBox` component is now `SmoothCornersBox` component.** diff --git a/.changeset/eighty-crabs-argue.md b/.changeset/eighty-crabs-argue.md deleted file mode 100644 index 8e072ebf6c..0000000000 --- a/.changeset/eighty-crabs-argue.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `LegacyTooltip` component** - -- No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `contentInterpolation` property. Replace any usage of `contentInterpolation` property with appropriate `contentStyle` or `contentClassName` implementations. -- No longer support `contentWrapperInterpolation` property. Replace any usage of `contentWrapperInterpolation` property with appropriate `contentWrapperStyle` or `contentWrapperClassName` implementations. diff --git a/.changeset/eighty-steaks-play.md b/.changeset/eighty-steaks-play.md deleted file mode 100644 index 4f95243c20..0000000000 --- a/.changeset/eighty-steaks-play.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Apply deep freeze to the `tokens` object. diff --git a/.changeset/empty-jars-shop.md b/.changeset/empty-jars-shop.md deleted file mode 100644 index 8830413121..0000000000 --- a/.changeset/empty-jars-shop.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fixes issue with `ModalBody`, `ModalFooter` not applying styling correctly when wrapped in other elements. diff --git a/.changeset/famous-melons-juggle.md b/.changeset/famous-melons-juggle.md deleted file mode 100644 index ca86841c5c..0000000000 --- a/.changeset/famous-melons-juggle.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: `AlphaCenter` component is now `Center` component. Property updates in `Center` component** - -- No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- Now supports margin props, layout props and `display` prop. diff --git a/.changeset/famous-trees-wash.md b/.changeset/famous-trees-wash.md deleted file mode 100644 index 2ecc8e3e7a..0000000000 --- a/.changeset/famous-trees-wash.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Enhancement in `v2-foundation-to-css-variable-transition` codemod - -- It will properly remove import statement if it converts code where `TransitionDuration` is used. diff --git a/.changeset/five-plants-rescue.md b/.changeset/five-plants-rescue.md deleted file mode 100644 index 6b998612d7..0000000000 --- a/.changeset/five-plants-rescue.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Add `overflow: hidden` to `ListItem` component diff --git a/.changeset/fluffy-comics-grin.md b/.changeset/fluffy-comics-grin.md deleted file mode 100644 index 4b972fdd63..0000000000 --- a/.changeset/fluffy-comics-grin.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fix invalid `aria-modal` value in Modal Content. diff --git a/.changeset/fluffy-dolphins-relax.md b/.changeset/fluffy-dolphins-relax.md deleted file mode 100644 index 3f65deefd0..0000000000 --- a/.changeset/fluffy-dolphins-relax.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Changes in `v2-remove-alpha-from-alpha-stack` transform - -- It is renamed as `v2-remove-alpha-from-alpha-components`. -- It covers `AlphaCenter` as well. diff --git a/.changeset/friendly-avocados-love.md b/.changeset/friendly-avocados-love.md deleted file mode 100644 index 6ab6a546ed..0000000000 --- a/.changeset/friendly-avocados-love.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Move `@channel.io/bezier-tokens` from dev depdency to dependency diff --git a/.changeset/funny-peaches-report.md b/.changeset/funny-peaches-report.md deleted file mode 100644 index 89afa215aa..0000000000 --- a/.changeset/funny-peaches-report.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `FormLabel`, `FormHelperText`, and `FormErrorMessage` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/gentle-shirts-grow.md b/.changeset/gentle-shirts-grow.md deleted file mode 100644 index 1c8d98d608..0000000000 --- a/.changeset/gentle-shirts-grow.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `NavGroup` and `NavItem` component** - -`leftIcon` renamed to `leftContent`. Changed to improve consistency of interface property names across libraries. diff --git a/.changeset/giant-terms-impress.md b/.changeset/giant-terms-impress.md deleted file mode 100644 index f11a64e9c1..0000000000 --- a/.changeset/giant-terms-impress.md +++ /dev/null @@ -1,13 +0,0 @@ ---- -"@channel.io/bezier-codemod": patch ---- - -Fix bug in `v2-import-from-bezier-to-styled-components` codemod when there are only named imports as following: - -```tsx -// As-is -import { css } from "@channel.io/bezier-react"; - -// To-be -import { css } from "styled-components"; -``` diff --git a/.changeset/gold-gorillas-shout.md b/.changeset/gold-gorillas-shout.md deleted file mode 100644 index a535fd32db..0000000000 --- a/.changeset/gold-gorillas-shout.md +++ /dev/null @@ -1,25 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: The enum type that the component receives as props is changed to a string (or number) literal type** - -The properties that change are: - -- `AvatarGroupEllipsisType` -- `IconSize` -- `LegacyTooltipPosition` -- `ModalTitleSize` -- `OverlayPosition` -- `ProgressBarSize`, `ProgressBarVariant` -- `SpinnerSize` -- `SwitchSize` -- `TagBadgeSize`, `TagBadgeVariant` -- `TextAreaHeight` -- `TextFieldSize`, `TextFieldVariant` -- `ToastPlacement`, `ToastAppearance`, `ToastPreset` -- `TooltipPosition` - -Also, `SpinnerThickness` props of `Spinner` is not supported any more. - -When changed to string literal type, it is changed to the kebab-cased value of enum. e.g. `TooltipPosition.TopCenter` -> `top-center`. Among the above enums, `TextAreaHeight` is converted to number literal type. e.g. `TextAreaHeight.Row16` -> `16`, and `IconSize.normal` is converted to `m` for consistency diff --git a/.changeset/good-dodos-obey.md b/.changeset/good-dodos-obey.md deleted file mode 100644 index be49891681..0000000000 --- a/.changeset/good-dodos-obey.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `FormControl`, `Select`, and `TextField` component** - -- `FormControl` component no longer supports `leftLabelWrapperHeight` props. -- `FormControl` component now supports `size` props, which is passed as context to the child component such as `TextField` and `Select` and specified as the size property. -- The size property of `Select` and `TextField` component changes from enum to string literal union type. Also, `SelectSize` and `TextFieldSize` enum are deprecated. diff --git a/.changeset/great-socks-jam.md b/.changeset/great-socks-jam.md deleted file mode 100644 index 70d00120e1..0000000000 --- a/.changeset/great-socks-jam.md +++ /dev/null @@ -1,16 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Add the `TooltipPrimitive` component, which is the same as the [`Tooltip` component in radix-ui](https://www.radix-ui.com/primitives/docs/components/tooltip). You can use it by importing it from the `/alpha` path. - -```tsx -import { - TooltipPrimitive, - TooltipPrimitiveArrow, - TooltipPrimitiveContent, - TooltipPrimitivePortal, - TooltipPrimitiveProvider, - TooltipPrimitiveTrigger, -} from '@channel.io/bezier-react/alpha' -``` diff --git a/.changeset/great-ties-hunt.md b/.changeset/great-ties-hunt.md deleted file mode 100644 index 5360634218..0000000000 --- a/.changeset/great-ties-hunt.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking changes: Remove `testId` and related properties** - -No longer supports `testId` and related properties(e.g. `wrapperTestId`). `testId` is a property used internally by the library for testing with testing-library (`getByTestId`). We don't see a need to expose this as a public API, so we remove it. - -If you were using it, please replace it with the `data-testid` property. See . diff --git a/.changeset/grumpy-flowers-trade.md b/.changeset/grumpy-flowers-trade.md deleted file mode 100644 index 3a5d5ba2d2..0000000000 --- a/.changeset/grumpy-flowers-trade.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fix `TabAction` typography style for size M. diff --git a/.changeset/healthy-rocks-tap.md b/.changeset/healthy-rocks-tap.md deleted file mode 100644 index d8065146ab..0000000000 --- a/.changeset/healthy-rocks-tap.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `FormControl` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/healthy-waves-promise.md b/.changeset/healthy-waves-promise.md deleted file mode 100644 index 465e6b9290..0000000000 --- a/.changeset/healthy-waves-promise.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Select` component** - -- No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `dropdownInterpolation` property. Replace any usage of `dropdownInterpolation` property with appropriate `dropdownStyle` or `dropdownClassName` implementations. -- The type of `zIndex` property is changed to a z-index token. (e.g. `"modal"`) diff --git a/.changeset/hip-students-care.md b/.changeset/hip-students-care.md deleted file mode 100644 index 357c159ee4..0000000000 --- a/.changeset/hip-students-care.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Minify the CSS output diff --git a/.changeset/honest-bugs-wait.md b/.changeset/honest-bugs-wait.md deleted file mode 100644 index 129b4a0087..0000000000 --- a/.changeset/honest-bugs-wait.md +++ /dev/null @@ -1,16 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Reorganizing `SectionLabel` component** - -`SectionLabel` is a complex component that can be used both in the form of an accordion and as a simple heading. To better meet the needs of both, we've changed the internal implementation of the component. - -We've also made changes to make styling overrides as predictable as they are for other components. The style override property, which was unnecessarily open, is now removed. - -- Remove the internal div wrapper. `style`, `className` properties are now injected into the component instead of the old `wrapperStyle`, `wrapperClassName`. -- No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support additional style properties of `wrapper`, `contentWrapper`, `leftWrapper` and `rightWrapper`. -- No longer support `divider` property. Replace it by adding `Divider` component to the component's before. -- The side content property is changed. It is no longer possible to override `iconColor`. -- When injecting `onClick` handler, the root element now behaves as a `button` element. This change is to better support keyboard focus control. diff --git a/.changeset/hot-bobcats-develop.md b/.changeset/hot-bobcats-develop.md deleted file mode 100644 index 16a77209bb..0000000000 --- a/.changeset/hot-bobcats-develop.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Emoji` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/hot-parrots-shop.md b/.changeset/hot-parrots-shop.md deleted file mode 100644 index d0c188db40..0000000000 --- a/.changeset/hot-parrots-shop.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Add the missing `bg-header-float` semantic color token diff --git a/.changeset/hungry-coats-punch.md b/.changeset/hungry-coats-punch.md deleted file mode 100644 index 75edfe7ef4..0000000000 --- a/.changeset/hungry-coats-punch.md +++ /dev/null @@ -1,25 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add `v2-foundation-to-css-variable-spacing` codemod to convert the foundation's spacing variable to pixels - -This transforms - -```tsx -import { styled } from "@channel.io/bezier-react" - -export const Wrapper = styled.div` - padding: ${({ foundation }) => foundation?.spacing.s5}; -` -``` - -into - -```tsx -import { styled } from "@channel.io/bezier-react" - -export const Wrapper = styled.div` - padding: 12px; -` -``` diff --git a/.changeset/large-pants-brush.md b/.changeset/large-pants-brush.md deleted file mode 100644 index 8cbba88d5b..0000000000 --- a/.changeset/large-pants-brush.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Add composition tokens, such as box-shadow diff --git a/.changeset/large-wasps-compete.md b/.changeset/large-wasps-compete.md deleted file mode 100644 index f8edcb01db..0000000000 --- a/.changeset/large-wasps-compete.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Radio` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/little-bikes-obey.md b/.changeset/little-bikes-obey.md deleted file mode 100644 index ec0f42c23a..0000000000 --- a/.changeset/little-bikes-obey.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Now serving one combined styles.css file. This is a breaking change for anyone who was importing the individual CSS files. You will need to update your import to `@channel.io/bezier-tokens/css/styles.css`. diff --git a/.changeset/long-birds-attend.md b/.changeset/long-birds-attend.md deleted file mode 100644 index c3dfe46029..0000000000 --- a/.changeset/long-birds-attend.md +++ /dev/null @@ -1,10 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Deprecated modules for internal use** - -- No longer provides `useEventHandler` and `useMergeRefs` hook. -- No longer provides `useId` hook. Use `useId` hook of `react` instead. -- No longer provides `getRootElement` hook. Use `useWindow` hook instead. -- No longer provides `StyleUtils` and `StringUtils` utils. diff --git a/.changeset/long-turtles-enjoy.md b/.changeset/long-turtles-enjoy.md deleted file mode 100644 index e5a56d5c26..0000000000 --- a/.changeset/long-turtles-enjoy.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `ProgressBar` component** - -- No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `activeStyle`, `activeClassName` and `activeInterpolation` property. -- No longer support `activeTestId` property. diff --git a/.changeset/loud-feet-melt.md b/.changeset/loud-feet-melt.md deleted file mode 100644 index 226bf241db..0000000000 --- a/.changeset/loud-feet-melt.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Changes in `v2-**-interpolation-to-css-variable` transform. - -- it is renamed to `v2-interpolation-to-css-variable-**`. e.g. `v2-interpolation-to-css-varable-input`, `v2-interpolation-to-css-variable-typography`, and so on -- it provides integrated transform named `v2-interpolation-to-css-variable` that handles all interpolation transform diff --git a/.changeset/many-shrimps-float.md b/.changeset/many-shrimps-float.md deleted file mode 100644 index e3d8af3641..0000000000 --- a/.changeset/many-shrimps-float.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Update background color of `TextField`'s secondary variant. diff --git a/.changeset/metal-planets-peel.md b/.changeset/metal-planets-peel.md deleted file mode 100644 index f6cddc9da0..0000000000 --- a/.changeset/metal-planets-peel.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Add z-index and opacity tokens diff --git a/.changeset/mighty-balloons-drum.md b/.changeset/mighty-balloons-drum.md deleted file mode 100644 index 6277c1091b..0000000000 --- a/.changeset/mighty-balloons-drum.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Tabs`-related components** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/mighty-hornets-promise.md b/.changeset/mighty-hornets-promise.md deleted file mode 100644 index 8012c716d2..0000000000 --- a/.changeset/mighty-hornets-promise.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": patch ---- - -Remove duplicate styles in styles.css diff --git a/.changeset/modern-cups-nail.md b/.changeset/modern-cups-nail.md deleted file mode 100644 index fa3039a4fa..0000000000 --- a/.changeset/modern-cups-nail.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -When you pass a value of number type to the dimension-related properties of margin prop and layout prop, they implicitly add px units as a suffix. See: diff --git a/.changeset/modern-days-cross.md b/.changeset/modern-days-cross.md deleted file mode 100644 index bcb7cf021e..0000000000 --- a/.changeset/modern-days-cross.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Mute the error of `smoothCornerScript` when called twice. diff --git a/.changeset/modern-houses-give.md b/.changeset/modern-houses-give.md deleted file mode 100644 index 14bfe1e77e..0000000000 --- a/.changeset/modern-houses-give.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Text` component** - -`typo` prop in the `Text` component has been changed to accept only string literals in order to simplify the API and improve the predictability of text styling, particularly in the context of the removal of `styled-components` from `bezier-react`, which has led to the unavailability of CSS Interpolation. - -**Migration Instructions:** - -Use [`v2-text-component-interface`](https://github.com/channel-io/bezier-react/tree/alpha/packages/bezier-codemod#change-interface-of-text) transformer from `bezier-codemod` for automated migration. diff --git a/.changeset/moody-snakes-rhyme.md b/.changeset/moody-snakes-rhyme.md deleted file mode 100644 index 5f355cdf45..0000000000 --- a/.changeset/moody-snakes-rhyme.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Enhance `import-styled-from-styled-component` codemod to cover other APIs from `styled-components` diff --git a/.changeset/neat-badgers-arrive.md b/.changeset/neat-badgers-arrive.md deleted file mode 100644 index 54152ea3c2..0000000000 --- a/.changeset/neat-badgers-arrive.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add `Typography` transform logic to interpolation codemod diff --git a/.changeset/old-rules-breathe.md b/.changeset/old-rules-breathe.md deleted file mode 100644 index 1504ada15d..0000000000 --- a/.changeset/old-rules-breathe.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add v2 prefix to codemods related to major version 2 diff --git a/.changeset/olive-pillows-prove.md b/.changeset/olive-pillows-prove.md deleted file mode 100644 index c61e1e1670..0000000000 --- a/.changeset/olive-pillows-prove.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Remove invalid radius tokens - -- `radius-10` -- `radius-14` -- `radius-100-p` diff --git a/.changeset/orange-pants-live.md b/.changeset/orange-pants-live.md deleted file mode 100644 index 7a757d60c2..0000000000 --- a/.changeset/orange-pants-live.md +++ /dev/null @@ -1,12 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Reorganizing `KeyValueListItem` component** - -- **Renamed to `KeyValueItem`.** -- - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `valueWrapperStyle`, `valueWrapperClassName`, `valueWrapperInterpolation`, `keyWrapperStyle`, `keyWrapperClassName` and `keyWrapperInterpolation`. This decision was made to reduce excessive flexibility in the interface. -- No longer support `AdditionalColorProps` and `show` property of ItemAction. -- The icon inside ItemAction is now implemented through `Button` component. -- The Value Container will now always have 100% of the parent's width. diff --git a/.changeset/perfect-ears-yawn.md b/.changeset/perfect-ears-yawn.md deleted file mode 100644 index a3e94609ae..0000000000 --- a/.changeset/perfect-ears-yawn.md +++ /dev/null @@ -1,15 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Add `Box` component. `Box` component is responsible for the primitive layout and provides easy access to the design tokens in the design system - -```tsx - -``` diff --git a/.changeset/perfect-parents-share.md b/.changeset/perfect-parents-share.md deleted file mode 100644 index 6940d3dba9..0000000000 --- a/.changeset/perfect-parents-share.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": patch ---- - -Fix `hasNamedImportInImportDeclaration` util to check all named imports diff --git a/.changeset/plenty-planes-sniff.md b/.changeset/plenty-planes-sniff.md deleted file mode 100644 index 4e0ab284e3..0000000000 --- a/.changeset/plenty-planes-sniff.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Now exports the `tokens` object from `@channel.io/bezier-tokens`. diff --git a/.changeset/poor-windows-join.md b/.changeset/poor-windows-join.md deleted file mode 100644 index e3cf10d137..0000000000 --- a/.changeset/poor-windows-join.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -Add new margin properties to `Icon` component - -- `margin` -- `marginHorizontal` -- `marginVertical` diff --git a/.changeset/pre.json b/.changeset/pre.json deleted file mode 100644 index fb22fd9b2a..0000000000 --- a/.changeset/pre.json +++ /dev/null @@ -1,132 +0,0 @@ -{ - "mode": "exit", - "tag": "alpha", - "initialVersions": { - "@channel.io/bezier-codemod": "0.2.1", - "bezier-figma-plugin": "0.3.10", - "@channel.io/bezier-icons": "0.4.0", - "@channel.io/bezier-react": "1.8.0", - "eslint-config-bezier": "0.0.1", - "tsconfig": "0.0.1", - "@channel.io/bezier-tokens": "0.0.0", - "@channel.io/bezier-vscode": "0.0.0" - }, - "changesets": [ - "afraid-kings-push", - "bright-zoos-attend", - "calm-llamas-bake", - "calm-wasps-tease", - "chilled-dots-divide", - "chilled-oranges-drum", - "cuddly-chairs-warn", - "cuddly-crews-matter", - "cuddly-socks-worry", - "curly-poets-decide", - "curvy-dragons-rest", - "cyan-pumpkins-run", - "dry-schools-draw", - "early-deers-attend", - "early-garlics-smoke", - "early-tables-taste", - "eight-hounds-smoke", - "eight-turtles-relax", - "eighty-crabs-argue", - "eighty-steaks-play", - "empty-jars-shop", - "famous-melons-juggle", - "famous-trees-wash", - "five-plants-rescue", - "fluffy-comics-grin", - "fluffy-dolphins-relax", - "friendly-avocados-love", - "funny-peaches-report", - "gentle-shirts-grow", - "giant-terms-impress", - "gold-gorillas-shout", - "good-dodos-obey", - "great-socks-jam", - "great-ties-hunt", - "grumpy-flowers-trade", - "healthy-rocks-tap", - "healthy-waves-promise", - "hip-students-care", - "honest-bugs-wait", - "hot-bobcats-develop", - "hot-parrots-shop", - "hungry-coats-punch", - "large-pants-brush", - "large-wasps-compete", - "little-bikes-obey", - "long-birds-attend", - "long-turtles-enjoy", - "loud-feet-melt", - "many-shrimps-float", - "metal-planets-peel", - "mighty-balloons-drum", - "mighty-hornets-promise", - "modern-cups-nail", - "modern-days-cross", - "modern-houses-give", - "moody-snakes-rhyme", - "neat-badgers-arrive", - "old-rules-breathe", - "olive-pillows-prove", - "orange-pants-live", - "perfect-ears-yawn", - "perfect-parents-share", - "plenty-planes-sniff", - "poor-windows-join", - "proud-feet-drum", - "purple-dodos-move", - "quick-peaches-fail", - "quiet-waves-vanish", - "rare-coats-sing", - "selfish-turkeys-boil", - "sharp-donuts-dance", - "sharp-hounds-lick", - "short-rice-press", - "silent-falcons-behave", - "silver-pets-hammer", - "six-humans-occur", - "six-lemons-admire", - "sixty-cows-fetch", - "sixty-goats-eat", - "slimy-lobsters-sparkle", - "small-readers-compare", - "smart-geese-provide", - "smart-owls-reply", - "smart-ravens-rescue", - "soft-months-film", - "soft-parents-work", - "sour-dogs-sin", - "stale-nails-study", - "strange-colts-beg", - "strange-toes-tap", - "sweet-cups-tell", - "sweet-kangaroos-rush", - "sweet-suits-smoke", - "tall-maps-lick", - "tame-dolls-drive", - "tame-news-yawn", - "ten-plants-remain", - "tender-years-camp", - "thin-games-add", - "thirty-dodos-push", - "three-mirrors-hunt", - "tough-lions-change", - "tough-rats-drive", - "tricky-forks-marry", - "tricky-geese-lick", - "twelve-ladybugs-glow", - "twenty-onions-rule", - "two-adults-pay", - "violet-queens-explain", - "weak-toys-dress", - "wicked-months-sparkle", - "wild-cows-rescue", - "wild-walls-suffer", - "witty-kids-tie", - "witty-pans-clean", - "yellow-eagles-matter" - ] -} diff --git a/.changeset/proud-feet-drum.md b/.changeset/proud-feet-drum.md deleted file mode 100644 index 7f5c4b058b..0000000000 --- a/.changeset/proud-feet-drum.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `NavItem` and `NavGroup` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/purple-dodos-move.md b/.changeset/purple-dodos-move.md deleted file mode 100644 index bd2f08a381..0000000000 --- a/.changeset/purple-dodos-move.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Fix invalid letter spacing token values diff --git a/.changeset/quick-peaches-fail.md b/.changeset/quick-peaches-fail.md deleted file mode 100644 index 681a01215a..0000000000 --- a/.changeset/quick-peaches-fail.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Fixes style inheritance issues by explicitly giving CSS custom properties an initial value diff --git a/.changeset/quiet-waves-vanish.md b/.changeset/quiet-waves-vanish.md deleted file mode 100644 index bc68d70e6f..0000000000 --- a/.changeset/quiet-waves-vanish.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Adds icon and typo size for avatar size `"72"`, which were missing from `AvatarGroup`. diff --git a/.changeset/rare-coats-sing.md b/.changeset/rare-coats-sing.md deleted file mode 100644 index d469d838e5..0000000000 --- a/.changeset/rare-coats-sing.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -First release diff --git a/.changeset/selfish-turkeys-boil.md b/.changeset/selfish-turkeys-boil.md deleted file mode 100644 index 8c4e4f6a9c..0000000000 --- a/.changeset/selfish-turkeys-boil.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Add missing `overflow: hidden` style to item wrapper of `KeyValueItem` component. diff --git a/.changeset/sharp-donuts-dance.md b/.changeset/sharp-donuts-dance.md deleted file mode 100644 index 2921b42d06..0000000000 --- a/.changeset/sharp-donuts-dance.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: The enum type that the component receives as props is changed to a string literal type** - -The properties that change are: - -- `AvatarSize` -- `BannerVariant` -- `ButtonColorVariant`, `ButtonStyleVariant`, `ButtonSize` -- `EmojiSize` -- `SegmentedControlSize` -- `TabSize` -- `ListItemVariant`, `ListItemSize` -- `StatusType`, `StatusSize` - -When changed to string literal type, it is changed to the kebab-cased value of enum. e.g. `ButtonStyleVariant.MonoChromeDark` -> `monochrome-dark`, `StatusType.OnlineCrescent` -> `online-crescent` diff --git a/.changeset/sharp-hounds-lick.md b/.changeset/sharp-hounds-lick.md deleted file mode 100644 index 29f5ba2e25..0000000000 --- a/.changeset/sharp-hounds-lick.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Modal`-related components** - -- No longer supports `as` and `interpolation` props. -- The type of `zIndex` property is changed to a z-index token. (e.g. `"modal"`) diff --git a/.changeset/short-rice-press.md b/.changeset/short-rice-press.md deleted file mode 100644 index 7c8f15bfbe..0000000000 --- a/.changeset/short-rice-press.md +++ /dev/null @@ -1,16 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Change: Removal of `LegacySegmentedControl` Component** - -We have removed the `LegacySegmentedControl` component from our library. This change follows its deprecation in `next-v1.204`. - -**Reasons for Removal:** - -- To enhance web accessibility and improve keyboard navigation. -- To align with our goals of design modernization and consistent user experience. - -**Impact:** - -`LegacySegmentedControl` component is no longer available and cannot be used in your projects. Replace all instances of `LegacySegmentedControl` with `SegmentedControl` component. diff --git a/.changeset/silent-falcons-behave.md b/.changeset/silent-falcons-behave.md deleted file mode 100644 index 5c50327220..0000000000 --- a/.changeset/silent-falcons-behave.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Add categories by token to the JavaScript build file diff --git a/.changeset/silver-pets-hammer.md b/.changeset/silver-pets-hammer.md deleted file mode 100644 index c80795232c..0000000000 --- a/.changeset/silver-pets-hammer.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Apply bezier-tokens to bezier-react's style sheet and fix some invalid css selector diff --git a/.changeset/six-humans-occur.md b/.changeset/six-humans-occur.md deleted file mode 100644 index 5ab4bed94b..0000000000 --- a/.changeset/six-humans-occur.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fixes `Overlay` not closing in other windows. diff --git a/.changeset/six-lemons-admire.md b/.changeset/six-lemons-admire.md deleted file mode 100644 index 943d866547..0000000000 --- a/.changeset/six-lemons-admire.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `LegacyStack` components** - -- No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer export `AxisAlignment` type. diff --git a/.changeset/sixty-cows-fetch.md b/.changeset/sixty-cows-fetch.md deleted file mode 100644 index df7f26aefe..0000000000 --- a/.changeset/sixty-cows-fetch.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fixes a bug where onHide is called when clicking inside the overlay, causing the overlay to close. diff --git a/.changeset/sixty-goats-eat.md b/.changeset/sixty-goats-eat.md deleted file mode 100644 index 66de3b50e3..0000000000 --- a/.changeset/sixty-goats-eat.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Add the `DialogPrimitive` component, which is the same as the [`Dialog` component in radix-ui](https://www.radix-ui.com/primitives/docs/components/dialog). You can use it by importing it from the `/alpha` path. - -```tsx -import { - DialogPrimitive, - DialogPrimitiveClose, - DialogPrimitiveContent, - DialogPrimitiveDescription, - DialogPrimitiveOverlay, - DialogPrimitivePortal, - DialogPrimitiveTitle, - DialogPrimitiveTrigger, -} from '@channel.io/bezier-react/alpha' -``` diff --git a/.changeset/slimy-lobsters-sparkle.md b/.changeset/slimy-lobsters-sparkle.md deleted file mode 100644 index 08606e260b..0000000000 --- a/.changeset/slimy-lobsters-sparkle.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add codemod for z-index interpolation and enum diff --git a/.changeset/small-readers-compare.md b/.changeset/small-readers-compare.md deleted file mode 100644 index dc8af74671..0000000000 --- a/.changeset/small-readers-compare.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `TextField` component** - -- No longer support `interpolation`-related properties. Replace any usage of `interpolation` -related properties with appropriate `***style` or `***className` implementations. -- No longer support `inputStyle` and `inputClassName` properties. Replace any usage of `inputStyle` and `inputClassName` with appropriate `style` or `className` implementations. -- Change the value of `TextFieldVariant` enum value to string. diff --git a/.changeset/smart-geese-provide.md b/.changeset/smart-geese-provide.md deleted file mode 100644 index d6a71ca202..0000000000 --- a/.changeset/smart-geese-provide.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fix invalid style migrations of `Tabs` component. diff --git a/.changeset/smart-owls-reply.md b/.changeset/smart-owls-reply.md deleted file mode 100644 index 37f3c0fe78..0000000000 --- a/.changeset/smart-owls-reply.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Remove the default offset(`GNB_WIDTH`) in `Toast`** - -Remove the style because it was dependent on a specific application. Use `{ left: 68 }` instead. diff --git a/.changeset/smart-ravens-rescue.md b/.changeset/smart-ravens-rescue.md deleted file mode 100644 index 90d3ef9e75..0000000000 --- a/.changeset/smart-ravens-rescue.md +++ /dev/null @@ -1,19 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add more various cases to `v2-enum-member-to-string-literal`. Now it covers following enums. - -- `AvatarGroupEllipsisType` -- `IconSize` -- `LegacyTooltipPosition` -- `ModalTitleSize` -- `OverlayPosition` -- `ProgressBarSize`, `ProgressBarVariant` -- `SpinnerSize` -- `SwitchSize` -- `TagBadgeSize`, `TagBadgeVariant` -- `TextAreaHeight` -- `TextFieldSize`, `TextFieldVariant` -- `ToastPlacement`, `ToastAppearance`, `ToastPreset` -- `TooltipPosition` diff --git a/.changeset/soft-months-film.md b/.changeset/soft-months-film.md deleted file mode 100644 index a95616226a..0000000000 --- a/.changeset/soft-months-film.md +++ /dev/null @@ -1,12 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Banner` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. - -**Other changes in `Banner` component** - -- now supports HTML attributes. -- now supports style props. diff --git a/.changeset/soft-parents-work.md b/.changeset/soft-parents-work.md deleted file mode 100644 index 8624239f9b..0000000000 --- a/.changeset/soft-parents-work.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"bezier-figma-plugin": patch ---- - -Enhance icon extract logic by catching error diff --git a/.changeset/sour-dogs-sin.md b/.changeset/sour-dogs-sin.md deleted file mode 100644 index c83136ef88..0000000000 --- a/.changeset/sour-dogs-sin.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add `inputPlaceholderStyle` migration logic to `v2-input-interpolation-to-css-variable` codemod diff --git a/.changeset/stale-nails-study.md b/.changeset/stale-nails-study.md deleted file mode 100644 index 9c99a2fbf7..0000000000 --- a/.changeset/stale-nails-study.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -`ButtonGroup` now supports HTML attributes diff --git a/.changeset/strange-colts-beg.md b/.changeset/strange-colts-beg.md deleted file mode 100644 index f5a05f7ba7..0000000000 --- a/.changeset/strange-colts-beg.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -`Banner` will now render content even if the `content` prop is not a string. The same applies to link-related props. diff --git a/.changeset/strange-toes-tap.md b/.changeset/strange-toes-tap.md deleted file mode 100644 index bdab7583da..0000000000 --- a/.changeset/strange-toes-tap.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Rename `AlphaAppProvider` to `AppProvider` diff --git a/.changeset/sweet-cups-tell.md b/.changeset/sweet-cups-tell.md deleted file mode 100644 index d5710135bd..0000000000 --- a/.changeset/sweet-cups-tell.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Change: Removal of `LegacyRadio` Component** - -- `LegacyRadio` component has been removed from the library. Please use `RadioGroup` and `Radio` component instead. -- Now if `Radio` has no label, its size is reduced by an indicator. diff --git a/.changeset/sweet-kangaroos-rush.md b/.changeset/sweet-kangaroos-rush.md deleted file mode 100644 index b3426ac1fd..0000000000 --- a/.changeset/sweet-kangaroos-rush.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Checkbox` component** - -No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/sweet-suits-smoke.md b/.changeset/sweet-suits-smoke.md deleted file mode 100644 index ef4289a9f6..0000000000 --- a/.changeset/sweet-suits-smoke.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Switch` component** - -No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. diff --git a/.changeset/tall-maps-lick.md b/.changeset/tall-maps-lick.md deleted file mode 100644 index 9056b21719..0000000000 --- a/.changeset/tall-maps-lick.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -Export the css style sheet for the new design system. diff --git a/.changeset/tame-dolls-drive.md b/.changeset/tame-dolls-drive.md deleted file mode 100644 index c1d647bb4e..0000000000 --- a/.changeset/tame-dolls-drive.md +++ /dev/null @@ -1,16 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Reorganizing `OutlineItem` component** - -`OutlineItem` component was originally designed as a component to draw a tree-like view, *but it was not used as intended in production*. We simplified the component's responsibilities by removing unused properties while retaining the component's ability to apply indentation to subcomponents. - -- No longer support `paddingLeft` property. **By default, 6px of left padding has been added.** If you need to make changes, override the style. -- No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `iconStyle`, `iconClassName`, `iconInterpolation`, `contentStyle`, `contentClassName` and `contentInterpolation`. This decision was made to reduce excessive flexibility in the interface. -- No longer support `leftIcon` property. Removed for consistency with other component interfaces. Replace it to `leftContent`. -- No longer support `leftIconColor` and `leftIconTestId` property. -- No longer support `name` property. The second argument (name) of `onClick` is also removed. If you need an identifier, combine functions outside of the component. -- No longer support `hide`, `optionKey` and `disableIconActive` property. Replace `hide` property with conditional rendering. -- No longer support `onOpen`, `onClickArrow`, `selectedOutlineItemIndex` and `onChangeOption` property. diff --git a/.changeset/tame-news-yawn.md b/.changeset/tame-news-yawn.md deleted file mode 100644 index b9539b977f..0000000000 --- a/.changeset/tame-news-yawn.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Add missing spreading props to `ThemeProvider` and related components. diff --git a/.changeset/ten-plants-remain.md b/.changeset/ten-plants-remain.md deleted file mode 100644 index 3e257ed5c8..0000000000 --- a/.changeset/ten-plants-remain.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Slider` component** - -- No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- `dir` type is narrowed from `string | undefined` to `ltr | rtl | undefined` diff --git a/.changeset/tender-years-camp.md b/.changeset/tender-years-camp.md deleted file mode 100644 index 704dff0eec..0000000000 --- a/.changeset/tender-years-camp.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `Button` component** - -- No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- `ButtonSize` and `ButtonColorVariant` enums have been updated to use kebab case. diff --git a/.changeset/thin-games-add.md b/.changeset/thin-games-add.md deleted file mode 100644 index 85633eb993..0000000000 --- a/.changeset/thin-games-add.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fix `ListItem`'s left icon color specificity issue. diff --git a/.changeset/thirty-dodos-push.md b/.changeset/thirty-dodos-push.md deleted file mode 100644 index 00348e6a2e..0000000000 --- a/.changeset/thirty-dodos-push.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Rename the `style.css` file to `styles.css` diff --git a/.changeset/three-mirrors-hunt.md b/.changeset/three-mirrors-hunt.md deleted file mode 100644 index 5b9d4d33eb..0000000000 --- a/.changeset/three-mirrors-hunt.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Add `align` prop to `Text` component. This prop is used to set horizontal alignment of text - -```tsx - - - -``` diff --git a/.changeset/tough-lions-change.md b/.changeset/tough-lions-change.md deleted file mode 100644 index ced1d3ba8e..0000000000 --- a/.changeset/tough-lions-change.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add transform functions to help to migrate foundation to css variable generated by `@channel.io/bezier-tokens` package. They cover theme, transition, elevation, rounding, and border of foundation diff --git a/.changeset/tough-rats-drive.md b/.changeset/tough-rats-drive.md deleted file mode 100644 index 759511c399..0000000000 --- a/.changeset/tough-rats-drive.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Remove `borderStyle` prop from Layout props diff --git a/.changeset/tricky-forks-marry.md b/.changeset/tricky-forks-marry.md deleted file mode 100644 index 15033aec96..0000000000 --- a/.changeset/tricky-forks-marry.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fix `Badge` component style issue diff --git a/.changeset/tricky-geese-lick.md b/.changeset/tricky-geese-lick.md deleted file mode 100644 index 339dcadd9e..0000000000 --- a/.changeset/tricky-geese-lick.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Added a codemod to switch the library for importing 'styled' object from @channel.io/bezier-react to styled-components diff --git a/.changeset/twelve-ladybugs-glow.md b/.changeset/twelve-ladybugs-glow.md deleted file mode 100644 index 9ac6825be0..0000000000 --- a/.changeset/twelve-ladybugs-glow.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-vscode": minor ---- - -Create a package to support autocomplete for Bezier Design Tokens diff --git a/.changeset/twenty-onions-rule.md b/.changeset/twenty-onions-rule.md deleted file mode 100644 index b11436ba51..0000000000 --- a/.changeset/twenty-onions-rule.md +++ /dev/null @@ -1,34 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Change: No longer supports `smoothCorners` mixin. Use `AlphaSmoothCornersBox` components instead.** - -```tsx -// Before -const Box = styled.div` - ${smoothCorners({ - borderRadius: 10, - shadow: '0 5px 15px 0 var(--shdw-large)', - shadowBlur: 15, - backgroundColor: 'var(--bgtxt-absolute-white-dark)', - hasBackgroundImage: true, - })} -` - -... - -// After -... -``` diff --git a/.changeset/two-adults-pay.md b/.changeset/two-adults-pay.md deleted file mode 100644 index 2a754a712d..0000000000 --- a/.changeset/two-adults-pay.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-codemod": minor ---- - -Add codemod for mixin interpolation diff --git a/.changeset/violet-queens-explain.md b/.changeset/violet-queens-explain.md deleted file mode 100644 index 97e7edf97f..0000000000 --- a/.changeset/violet-queens-explain.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-react": patch ---- - -Fixes an issue where multi line truncated in `Text` was not being applied. diff --git a/.changeset/weak-toys-dress.md b/.changeset/weak-toys-dress.md deleted file mode 100644 index 63f8574148..0000000000 --- a/.changeset/weak-toys-dress.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: `Toast`-related modules** - -- No longer support `actionContent` and `onClick` properties in `ToastOptions`. -- Value type of `zIndex` property in `ToastOptions` is changed from `number` to `ZIndex` token. -- No longer export `ToastIconColor` enum. diff --git a/.changeset/wicked-months-sparkle.md b/.changeset/wicked-months-sparkle.md deleted file mode 100644 index 3ddc0c7db8..0000000000 --- a/.changeset/wicked-months-sparkle.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@channel.io/bezier-tokens": minor ---- - -Remove unused tokens and add missing unit to radius tokens diff --git a/.changeset/wild-cows-rescue.md b/.changeset/wild-cows-rescue.md deleted file mode 100644 index 24d6790eb9..0000000000 --- a/.changeset/wild-cows-rescue.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Property updates in `TextArea` component** - -- No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. -- No longer support `wrapperStyle`, `wrapperClassName` and `wrapperInterpolation` property. It was never properly implemented before, and the Wrapper element inside was also removed. diff --git a/.changeset/wild-walls-suffer.md b/.changeset/wild-walls-suffer.md deleted file mode 100644 index 40a0cdc836..0000000000 --- a/.changeset/wild-walls-suffer.md +++ /dev/null @@ -1,58 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: Deprecate support for `styled-components` related modules** - -- No longer support legacy foundation modules. Use the `useToken` hook and components to replace it - - `LightFoundation` and `DarkFoundation` - - `Spacing` - - `ev1`, `ev2`, `ev3`, `ev4`, `ev5` and `ev6` - - `createThemes`, `Theme`, `SemanticNames`, `LightTheme` and `DarkTheme` - - `TransitionDuration` and `Transition` - - `Border` - - `Typography`, `TypoAbsoluteNumber`, `LineHeightAbsoluteNumber` and `TypographyType` - - `absoluteCenter`, `disableAutoMinimum`, `hideScrollbars` and `ellipsis` - - `ThemeVarsAdditionalType` and `ThemeVars` - - `GlobalStyle` - - `Foundation` - - `GlobalStyleProp` - - `createGlobalStyle`, `styled`, `css`, `FoundationProvider`, `useFoundation`, `keyframes`, `StyleSheetManager` and `ServerStyleSheet` -- No longer support `BezierProvider`. Use the `AppProvider` instead -- No longer support `gap` and `touchableHover` mixins. Please implement and use your own - -```tsx -function gap(spacing: number): InjectedInterpolation { - return css` - gap: ${spacing}px; - - @supports not(gap: ${spacing}px) { - margin-top: ${-spacing}px; - margin-left: ${-spacing}px; - - > * { - margin-top: ${spacing}px; - margin-left: ${spacing}px; - } - } - ` -} - -function touchableHover(interpolation: InjectedInterpolation): InjectedInterpolation { - return css` - @media (hover: hover) { - &:hover { - ${interpolation} - } - } - - @media (hover: none) { - &:active { - ${interpolation} - } - } - ` -} -``` - -- No longer support `inputTextStyle`, `inputPlaceholderStyle`, `inputWrapperStyle`, `focusedInputWrapperStyle` and `erroredInputWrapperStyle`. Please migrate using `@channel.io/bezier-codemod`'s `v2-interpolation-to-css-variable` transformer. diff --git a/.changeset/witty-kids-tie.md b/.changeset/witty-kids-tie.md deleted file mode 100644 index 664429c861..0000000000 --- a/.changeset/witty-kids-tie.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -"@channel.io/bezier-react": minor ---- - -Add `useRootElement` hook. It is only available to `WindowProvider` children, and provides easy access to the root element of window context value. - -```tsx -const { window, document, rootElement } = useWindow(); -// Same as useWindow().rootElement -const rootElement = useRootElement(); -``` diff --git a/.changeset/witty-pans-clean.md b/.changeset/witty-pans-clean.md deleted file mode 100644 index 576dabf128..0000000000 --- a/.changeset/witty-pans-clean.md +++ /dev/null @@ -1,35 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Changes: `AlphaStack` component has been changed to a `Stack` component, and `Stack` component has been changed to `LegacyStack` component.** - -Changes to remove the dependency of `Stack` and `StackItem` to allow stack layouts to be configured without additional DOM elements. And improved the existing `AlphaStack` to support more Flex layout related properties like reverse, wrap, and more align options, etc. See StackProps for more information. - -We also added new `HStack` and `VStack` components, which are shorthand components that fix the direction prop of `AlphaStack`. As mentioned above, the existing components become `LegacyHStack`, `LegacyVStack`. - -The layout implemented by `StackItem` can be partially replaced by the Layout component's `grow`, `shrink` common properties and margin common properties. Note that the `align`, `justify` (align-self, justify-self in CSS flex) properties provided by `StackItem` are not provided by the Layout component. - -```jsx -/* AS-IS */ -return ( - - - - - - -) - -/* TO-BE */ -return ( - - - - -) -``` - -The changes also apply to other components that use `Stack` internally, and there are a few breaking changes. - -- `RadioGroup`, `ButtonGroup`, `FormGroup` no longer support `as` prop. diff --git a/.changeset/yellow-eagles-matter.md b/.changeset/yellow-eagles-matter.md deleted file mode 100644 index 02687c275e..0000000000 --- a/.changeset/yellow-eagles-matter.md +++ /dev/null @@ -1,8 +0,0 @@ ---- -"@channel.io/bezier-react": major ---- - -**Breaking Change: Removal of `ListMenuTitle` Component** - -- It was no longer being managed or utilized by our designers. -- If you are currently using `ListMenuTitle` in your application, please replace it with the `SectionLabel` component for similar functionality. diff --git a/packages/bezier-codemod/CHANGELOG.md b/packages/bezier-codemod/CHANGELOG.md index c1833964d0..555efda443 100644 --- a/packages/bezier-codemod/CHANGELOG.md +++ b/packages/bezier-codemod/CHANGELOG.md @@ -1,5 +1,102 @@ # @channel.io/bezier-codemod +## 0.5.0 + +### Minor Changes + +- Changes in `v2-text-component-interface` codemod ([#1932](https://github.com/channel-io/bezier-react/pull/1932)) by @yangwooseong + Previously, both the component name and the name of the property were checked, but now only the name of the component property is checked. + +- Add codemod for Stack component ([#1836](https://github.com/channel-io/bezier-react/pull/1836)) by @yangwooseong + +- Add more various cases to `v2-enum-member-to-string-literal` ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong + +- Fix typo in `v2-z-index-interpolation-to-css-variable` codemod. It now transforms `${ZIndex.Float}` enum to `var(--z-index-floating)`, not `var(--z-index-float)`. ([#1924](https://github.com/channel-io/bezier-react/pull/1924)) by @yangwooseong + +- Add codemod to transform interface of `Text` component ([#1849](https://github.com/channel-io/bezier-react/pull/1849)) by @yangwooseong + +- Enhancement in `v2-foundation-to-css-variable-transition` codemod ([#1917](https://github.com/channel-io/bezier-react/pull/1917)) by @yangwooseong + + - It will properly remove import statement if it converts code where `TransitionDuration` is used. + +- Changes in `v2-remove-alpha-from-alpha-stack` transform ([#1894](https://github.com/channel-io/bezier-react/pull/1894)) by @yangwooseong + + - It is renamed as `v2-remove-alpha-from-alpha-components`. + - It covers `AlphaCenter` as well. + +- Add `v2-foundation-to-css-variable-spacing` codemod to convert the foundation's spacing variable to pixels ([#1907](https://github.com/channel-io/bezier-react/pull/1907)) by @yangwooseong + + This transforms + + ```tsx + import { styled } from "@channel.io/bezier-react"; + + export const Wrapper = styled.div` + padding: ${({ foundation }) => foundation?.spacing.s5}; + `; + ``` + + into + + ```tsx + import { styled } from "@channel.io/bezier-react"; + + export const Wrapper = styled.div` + padding: 12px; + `; + ``` + +- Changes in `v2-**-interpolation-to-css-variable` transform. ([#1928](https://github.com/channel-io/bezier-react/pull/1928)) by @yangwooseong + + - it is renamed to `v2-interpolation-to-css-variable-**`. e.g. `v2-interpolation-to-css-varable-input`, `v2-interpolation-to-css-variable-typography`, and so on + - it provides integrated transform named `v2-interpolation-to-css-variable` that handles all interpolation transform + +- Enhance `import-styled-from-styled-component` codemod to cover other APIs from `styled-components` ([#1852](https://github.com/channel-io/bezier-react/pull/1852)) by @yangwooseong + +- Add `Typography` transform logic to interpolation codemod ([#1841](https://github.com/channel-io/bezier-react/pull/1841)) by @yangwooseong + +- Add v2 prefix to codemods related to major version 2 ([#1844](https://github.com/channel-io/bezier-react/pull/1844)) by @yangwooseong + +- Add codemod for z-index interpolation and enum ([#1845](https://github.com/channel-io/bezier-react/pull/1845)) by @yangwooseong + +- Add more various cases to `v2-enum-member-to-string-literal`. Now it covers following enums. ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong + + - `AvatarGroupEllipsisType` + - `IconSize` + - `LegacyTooltipPosition` + - `ModalTitleSize` + - `OverlayPosition` + - `ProgressBarSize`, `ProgressBarVariant` + - `SpinnerSize` + - `SwitchSize` + - `TagBadgeSize`, `TagBadgeVariant` + - `TextAreaHeight` + - `TextFieldSize`, `TextFieldVariant` + - `ToastPlacement`, `ToastAppearance`, `ToastPreset` + - `TooltipPosition` + +- Add `inputPlaceholderStyle` migration logic to `v2-input-interpolation-to-css-variable` codemod ([#1926](https://github.com/channel-io/bezier-react/pull/1926)) by @yangwooseong + +- Add transform functions to help to migrate foundation to css variable generated by `@channel.io/bezier-tokens` package. They cover theme, transition, elevation, rounding, and border of foundation ([#1781](https://github.com/channel-io/bezier-react/pull/1781)) by @yangwooseong + +- Added a codemod to switch the library for importing 'styled' object from @channel.io/bezier-react to styled-components ([#1789](https://github.com/channel-io/bezier-react/pull/1789)) by @yangwooseong + +- Add codemod for mixin interpolation ([#1787](https://github.com/channel-io/bezier-react/pull/1787)) by @yangwooseong + +### Patch Changes + +- Fix bug in `v2-import-from-bezier-to-styled-components` codemod when there are only named imports as following: ([#1987](https://github.com/channel-io/bezier-react/pull/1987)) by @yangwooseong + + ```tsx + // As-is + import { css } from "@channel.io/bezier-react"; + + // To-be + import { css } from "styled-components"; + ``` + +- Fix `hasNamedImportInImportDeclaration` util to check all named imports ([#2060](https://github.com/channel-io/bezier-react/pull/2060)) by @yangwooseong + ## 0.5.0-alpha.8 ### Patch Changes diff --git a/packages/bezier-codemod/package.json b/packages/bezier-codemod/package.json index 2948991bc6..611693522e 100644 --- a/packages/bezier-codemod/package.json +++ b/packages/bezier-codemod/package.json @@ -1,6 +1,6 @@ { "name": "@channel.io/bezier-codemod", - "version": "0.5.0-alpha.8", + "version": "0.5.0", "description": "Codemod transformations to help upgrade app using Bezier design system.", "repository": { "type": "git", diff --git a/packages/bezier-figma-plugin/CHANGELOG.md b/packages/bezier-figma-plugin/CHANGELOG.md index 3a406ef1e4..edff48f9fe 100644 --- a/packages/bezier-figma-plugin/CHANGELOG.md +++ b/packages/bezier-figma-plugin/CHANGELOG.md @@ -1,5 +1,18 @@ # bezier-figma-plugin +## 0.5.0 + +### Minor Changes + +- Upgrade to use @channel.io/bezier-react@2.0.0 ([#2001](https://github.com/channel-io/bezier-react/pull/2001)) by @sungik-choi + +### Patch Changes + +- Enhance icon extract logic by catching error ([#2073](https://github.com/channel-io/bezier-react/pull/2073)) by @yangwooseong + +- Updated dependencies + - @channel.io/bezier-react@2.0.0 + ## 0.5.0-alpha.9 ### Patch Changes diff --git a/packages/bezier-figma-plugin/package.json b/packages/bezier-figma-plugin/package.json index f6ba918496..15352dae20 100644 --- a/packages/bezier-figma-plugin/package.json +++ b/packages/bezier-figma-plugin/package.json @@ -1,6 +1,6 @@ { "name": "bezier-figma-plugin", - "version": "0.5.0-alpha.9", + "version": "0.5.0", "private": true, "description": "Figma plugin that helps build Bezier design system and increase productivity.", "repository": { @@ -39,7 +39,7 @@ }, "dependencies": { "@channel.io/bezier-icons": "0.23.0", - "@channel.io/bezier-react": "2.0.0-alpha.21", + "@channel.io/bezier-react": "2.0.0", "octokit": "^3.1.2", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/packages/bezier-react/CHANGELOG.md b/packages/bezier-react/CHANGELOG.md index a5daad1950..036a0ea084 100644 --- a/packages/bezier-react/CHANGELOG.md +++ b/packages/bezier-react/CHANGELOG.md @@ -1,5 +1,543 @@ # @channel.io/bezier-react +## 2.0.0 + +### Major Changes + +- **Breaking Changes: Property updates in `Avatar` component** ([#1871](https://github.com/channel-io/bezier-react/pull/1871)) by @yangwooseong + + No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking changes: Remove TagBadge-related types** ([#2114](https://github.com/channel-io/bezier-react/pull/2114)) by @sungik-choi + + - Remove `color` prop of `TagProps` and `TagBadgeBgColorPreset`. + - Remove `TagBadgeSize`. Please change it to `TagSize` and `BadgeSize`. + - Remove `TagBadgeVariant`. Please change it to `TagVariant` and `BadgeVariant`. + +- **Breaking Changes: Property updates in `SegmentedControl` component** ([#1866](https://github.com/channel-io/bezier-react/pull/1866)) by @sungik-choi + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Property updates in `ListItem` component** ([#1925](https://github.com/channel-io/bezier-react/pull/1925)) by @sungik-choi + + - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `iconStyle`, `iconClassName`, `iconInterpolation`, `contentStyle`, `contentClassName` and `contentInterpolation`. This decision was made to reduce excessive flexibility in the interface. + - No longer support `leftIcon` property. Removed for consistency with other component interfaces. Replace it to `leftContent`. + - No longer support `name` property. The second argument (name) of `onClick` is also removed. If you need an identifier, combine functions outside of the component. + - No longer support `hide`, `nested`, `optionKey` and `disableIconActive` property. Removed because it is a legacy property. Replace `hide` property with conditional rendering. + - The size changes according to the `ListItemSize`. This is a change to unify the design. Please change it like below. + - `ListItemSize.S` -> `ListItemSize.XS` + - `ListItemSize.M` -> `ListItemSize.S` + - `ListItemSize.L` -> `ListItemSize.M` + - `ListItemSize.XL` -> `ListItemSize.L` + + **Minor Changes:** + + - Fix incorrect text size for `XL`(now `L`) size. + +- **Breaking Changes: Property updates in `Overlay` component** ([#1949](https://github.com/channel-io/bezier-react/pull/1949)) by @sungik-choi + + - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `containerInterpolation` property. Replace any usage of `containerInterpolation` property with appropriate `containerStyle` or `containerClassName` implementations. + - No longer support `wrapperTestId` property. + +- **Breaking Changes: Remove `TooltipProvider` and Property updates in `Tooltip` component** ([#1974](https://github.com/channel-io/bezier-react/pull/1974)) by @sungik-choi + + - No longer support `TooltipProvider` and `TooltipProviderProps`. `Tooltip` component was implemented via radix-ui's Tooltip, which required the use of a `TooltipProvider`, which caused all subcomponents to be re-rendered and caused a performance hit. We decided that the ability to share hover delay time between `Tooltip` components via `TooltipProvider` was not a feature we needed, even with the performance penalty. Also, by providing `TooltipProvider` built-in to `AppProvider`, we were unnecessarily importing modules from our library usage that didn't require `Tooltip`. + - `Tooltip` component now contains a `TooltipProvider` inside it. + + **Minor Changes:** + + - Change the default value of `delayShow` prop from `300` to `0`. + +- **Breaking Changes: Property updates in `Tag` and `Badge` component** ([#1872](https://github.com/channel-io/bezier-react/pull/1872)) by @yangwooseong + + No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Property updates in `CheckableAvatar` component** ([#1921](https://github.com/channel-io/bezier-react/pull/1921)) by @sungik-choi + + No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: `AlphaSmoothCornersBox` component is now `SmoothCornersBox` component.** ([#2079](https://github.com/channel-io/bezier-react/pull/2079)) by @sungik-choi + +- **Breaking Changes: Property updates in `LegacyTooltip` component** ([#1945](https://github.com/channel-io/bezier-react/pull/1945)) by @sungik-choi + + - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `contentInterpolation` property. Replace any usage of `contentInterpolation` property with appropriate `contentStyle` or `contentClassName` implementations. + - No longer support `contentWrapperInterpolation` property. Replace any usage of `contentWrapperInterpolation` property with appropriate `contentWrapperStyle` or `contentWrapperClassName` implementations. + +- **Breaking Changes: `AlphaCenter` component is now `Center` component. Property updates in `Center` component** ([#1854](https://github.com/channel-io/bezier-react/pull/1854)) by @sungik-choi + + - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - Now supports margin props, layout props and `display` prop. + +- **Breaking Changes: Property updates in `FormLabel`, `FormHelperText`, and `FormErrorMessage` component** ([#1893](https://github.com/channel-io/bezier-react/pull/1893)) by @yangwooseong + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Property updates in `NavGroup` and `NavItem` component** ([#1931](https://github.com/channel-io/bezier-react/pull/1931)) by @sungik-choi + + `leftIcon` renamed to `leftContent`. Changed to improve consistency of interface property names across libraries. + +- **Breaking Changes: The enum type that the component receives as props is changed to a string (or number) literal type** ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong + + The properties that change are: + + - `AvatarGroupEllipsisType` + - `IconSize` + - `LegacyTooltipPosition` + - `ModalTitleSize` + - `OverlayPosition` + - `ProgressBarSize`, `ProgressBarVariant` + - `SpinnerSize` + - `SwitchSize` + - `TagBadgeSize`, `TagBadgeVariant` + - `TextAreaHeight` + - `TextFieldSize`, `TextFieldVariant` + - `ToastPlacement`, `ToastAppearance`, `ToastPreset` + - `TooltipPosition` + + Also, `SpinnerThickness` props of `Spinner` is not supported any more. + + When changed to string literal type, it is changed to the kebab-cased value of enum. e.g. `TooltipPosition.TopCenter` -> `top-center`. Among the above enums, `TextAreaHeight` is converted to number literal type. e.g. `TextAreaHeight.Row16` -> `16`, and `IconSize.normal` is converted to `m` for consistency + +- **Breaking Changes: Property updates in `FormControl`, `Select`, and `TextField` component** ([#1948](https://github.com/channel-io/bezier-react/pull/1948)) by @yangwooseong + + - `FormControl` component no longer supports `leftLabelWrapperHeight` props. + - `FormControl` component now supports `size` props, which is passed as context to the child component such as `TextField` and `Select` and specified as the size property. + - The size property of `Select` and `TextField` component changes from enum to string literal union type. Also, `SelectSize` and `TextFieldSize` enum are deprecated. + +- **Breaking changes: Remove `testId` and related properties** ([#1971](https://github.com/channel-io/bezier-react/pull/1971)) by @sungik-choi + + No longer supports `testId` and related properties(e.g. `wrapperTestId`). `testId` is a property used internally by the library for testing with testing-library (`getByTestId`). We don't see a need to expose this as a public API, so we remove it. + + If you were using it, please replace it with the `data-testid` property. See . + +- **Breaking Changes: Property updates in `FormControl` component** ([#1935](https://github.com/channel-io/bezier-react/pull/1935)) by @yangwooseong + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Property updates in `Select` component** ([#1913](https://github.com/channel-io/bezier-react/pull/1913)) by @sungik-choi + + - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `dropdownInterpolation` property. Replace any usage of `dropdownInterpolation` property with appropriate `dropdownStyle` or `dropdownClassName` implementations. + - The type of `zIndex` property is changed to a z-index token. (e.g. `"modal"`) + +- **Breaking Changes: Reorganizing `SectionLabel` component** ([#1936](https://github.com/channel-io/bezier-react/pull/1936)) by @sungik-choi + + `SectionLabel` is a complex component that can be used both in the form of an accordion and as a simple heading. To better meet the needs of both, we've changed the internal implementation of the component. + + We've also made changes to make styling overrides as predictable as they are for other components. The style override property, which was unnecessarily open, is now removed. + + - Remove the internal div wrapper. `style`, `className` properties are now injected into the component instead of the old `wrapperStyle`, `wrapperClassName`. + - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support additional style properties of `wrapper`, `contentWrapper`, `leftWrapper` and `rightWrapper`. + - No longer support `divider` property. Replace it by adding `Divider` component to the component's before. + - The side content property is changed. It is no longer possible to override `iconColor`. + - When injecting `onClick` handler, the root element now behaves as a `button` element. This change is to better support keyboard focus control. + +- **Breaking Changes: Property updates in `Emoji` component** ([#1881](https://github.com/channel-io/bezier-react/pull/1881)) by @yangwooseong + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Property updates in `Radio` component** ([#1923](https://github.com/channel-io/bezier-react/pull/1923)) by @sungik-choi + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Deprecated modules for internal use** ([#1963](https://github.com/channel-io/bezier-react/pull/1963)) by @sungik-choi + + - No longer provides `useEventHandler` and `useMergeRefs` hook. + - No longer provides `useId` hook. Use `useId` hook of `react` instead. + - No longer provides `getRootElement` hook. Use `useWindow` hook instead. + - No longer provides `StyleUtils` and `StringUtils` utils. + +- **Breaking Changes: Property updates in `ProgressBar` component** ([#1947](https://github.com/channel-io/bezier-react/pull/1947)) by @sungik-choi + + - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `activeStyle`, `activeClassName` and `activeInterpolation` property. + - No longer support `activeTestId` property. + +- **Breaking Changes: Property updates in `Tabs`-related components** ([#1960](https://github.com/channel-io/bezier-react/pull/1960)) by @sungik-choi + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Property updates in `Text` component** ([#1820](https://github.com/channel-io/bezier-react/pull/1820)) by @sungik-choi + + `typo` prop in the `Text` component has been changed to accept only string literals in order to simplify the API and improve the predictability of text styling, particularly in the context of the removal of `styled-components` from `bezier-react`, which has led to the unavailability of CSS Interpolation. + + **Migration Instructions:** + + Use [`v2-text-component-interface`](https://github.com/channel-io/bezier-react/tree/alpha/packages/bezier-codemod#change-interface-of-text) transformer from `bezier-codemod` for automated migration. + +- **Breaking Changes: Reorganizing `KeyValueListItem` component** ([#1941](https://github.com/channel-io/bezier-react/pull/1941)) by @sungik-choi + + - **Renamed to `KeyValueItem`.** + - - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `valueWrapperStyle`, `valueWrapperClassName`, `valueWrapperInterpolation`, `keyWrapperStyle`, `keyWrapperClassName` and `keyWrapperInterpolation`. This decision was made to reduce excessive flexibility in the interface. + - No longer support `AdditionalColorProps` and `show` property of ItemAction. + - The icon inside ItemAction is now implemented through `Button` component. + - The Value Container will now always have 100% of the parent's width. + +- Add new margin properties to `Icon` component ([#1863](https://github.com/channel-io/bezier-react/pull/1863)) by @yangwooseong + + - `margin` + - `marginHorizontal` + - `marginVertical` + +- **Breaking Changes: Property updates in `NavItem` and `NavGroup` component** ([#1905](https://github.com/channel-io/bezier-react/pull/1905)) by @yangwooseong + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: The enum type that the component receives as props is changed to a string literal type** ([#2059](https://github.com/channel-io/bezier-react/pull/2059)) by @yangwooseong + + The properties that change are: + + - `AvatarSize` + - `BannerVariant` + - `ButtonColorVariant`, `ButtonStyleVariant`, `ButtonSize` + - `EmojiSize` + - `SegmentedControlSize` + - `TabSize` + - `ListItemVariant`, `ListItemSize` + - `StatusType`, `StatusSize` + + When changed to string literal type, it is changed to the kebab-cased value of enum. e.g. `ButtonStyleVariant.MonoChromeDark` -> `monochrome-dark`, `StatusType.OnlineCrescent` -> `online-crescent` + +- **Breaking Changes: Property updates in `Modal`-related components** ([#1903](https://github.com/channel-io/bezier-react/pull/1903)) by @sungik-choi + + - No longer supports `as` and `interpolation` props. + - The type of `zIndex` property is changed to a z-index token. (e.g. `"modal"`) + +- **Breaking Change: Removal of `LegacySegmentedControl` Component** ([#1786](https://github.com/channel-io/bezier-react/pull/1786)) by @sungik-choi + + We have removed the `LegacySegmentedControl` component from our library. This change follows its deprecation in `next-v1.204`. + + **Reasons for Removal:** + + - To enhance web accessibility and improve keyboard navigation. + - To align with our goals of design modernization and consistent user experience. + + **Impact:** + + `LegacySegmentedControl` component is no longer available and cannot be used in your projects. Replace all instances of `LegacySegmentedControl` with `SegmentedControl` component. + +- **Breaking Changes: Property updates in `LegacyStack` components** ([#1944](https://github.com/channel-io/bezier-react/pull/1944)) by @sungik-choi + + - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer export `AxisAlignment` type. + +- **Breaking Changes: Property updates in `TextField` component** ([#1904](https://github.com/channel-io/bezier-react/pull/1904)) by @sungik-choi + + - No longer support `interpolation`-related properties. Replace any usage of `interpolation` -related properties with appropriate `***style` or `***className` implementations. + - No longer support `inputStyle` and `inputClassName` properties. Replace any usage of `inputStyle` and `inputClassName` with appropriate `style` or `className` implementations. + - Change the value of `TextFieldVariant` enum value to string. + +- **Breaking Changes: Remove the default offset(`GNB_WIDTH`) in `Toast`** ([#2117](https://github.com/channel-io/bezier-react/pull/2117)) by @sungik-choi + + Remove the style because it was dependent on a specific application. Use `{ left: 68 }` instead. + +- **Breaking Changes: Property updates in `Banner` component** ([#1891](https://github.com/channel-io/bezier-react/pull/1891)) by @sungik-choi + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + + **Other changes in `Banner` component** + + - now supports HTML attributes. + - now supports style props. + +- **Breaking Change: Removal of `LegacyRadio` Component** ([#1943](https://github.com/channel-io/bezier-react/pull/1943)) by @sungik-choi + + - `LegacyRadio` component has been removed from the library. Please use `RadioGroup` and `Radio` component instead. + - Now if `Radio` has no label, its size is reduced by an indicator. + +- **Breaking Changes: Property updates in `Checkbox` component** ([#1918](https://github.com/channel-io/bezier-react/pull/1918)) by @sungik-choi + + No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- **Breaking Changes: Property updates in `Switch` component** ([#1885](https://github.com/channel-io/bezier-react/pull/1885)) by @yangwooseong + + No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + +- Export the css style sheet for the new design system. ([#1492](https://github.com/channel-io/bezier-react/pull/1492)) by @sungik-choi + +- **Breaking Changes: Reorganizing `OutlineItem` component** ([#1930](https://github.com/channel-io/bezier-react/pull/1930)) by @sungik-choi + + `OutlineItem` component was originally designed as a component to draw a tree-like view, _but it was not used as intended in production_. We simplified the component's responsibilities by removing unused properties while retaining the component's ability to apply indentation to subcomponents. + + - No longer support `paddingLeft` property. **By default, 6px of left padding has been added.** If you need to make changes, override the style. + - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `iconStyle`, `iconClassName`, `iconInterpolation`, `contentStyle`, `contentClassName` and `contentInterpolation`. This decision was made to reduce excessive flexibility in the interface. + - No longer support `leftIcon` property. Removed for consistency with other component interfaces. Replace it to `leftContent`. + - No longer support `leftIconColor` and `leftIconTestId` property. + - No longer support `name` property. The second argument (name) of `onClick` is also removed. If you need an identifier, combine functions outside of the component. + - No longer support `hide`, `optionKey` and `disableIconActive` property. Replace `hide` property with conditional rendering. + - No longer support `onOpen`, `onClickArrow`, `selectedOutlineItemIndex` and `onChangeOption` property. + +- **Breaking Changes: Property updates in `Slider` component** ([#1883](https://github.com/channel-io/bezier-react/pull/1883)) by @yangwooseong + + - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - `dir` type is narrowed from `string | undefined` to `ltr | rtl | undefined` + +- **Breaking Changes: Property updates in `Button` component** ([#1882](https://github.com/channel-io/bezier-react/pull/1882)) by @sungik-choi + + - No longer support `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - `ButtonSize` and `ButtonColorVariant` enums have been updated to use kebab case. + +- **Breaking Change: No longer supports `smoothCorners` mixin. Use `AlphaSmoothCornersBox` components instead.** ([#1892](https://github.com/channel-io/bezier-react/pull/1892)) by @sungik-choi + + ```tsx + // Before + const Box = styled.div` + ${smoothCorners({ + borderRadius: 10, + shadow: '0 5px 15px 0 var(--shdw-large)', + shadowBlur: 15, + backgroundColor: 'var(--bgtxt-absolute-white-dark)', + hasBackgroundImage: true, + })} + ` + + ... + + // After + ... + ``` + +- **Breaking Changes: `Toast`-related modules** ([#1950](https://github.com/channel-io/bezier-react/pull/1950)) by @sungik-choi + + - No longer support `actionContent` and `onClick` properties in `ToastOptions`. + - Value type of `zIndex` property in `ToastOptions` is changed from `number` to `ZIndex` token. + - No longer export `ToastIconColor` enum. + +- **Breaking Changes: Property updates in `TextArea` component** ([#1914](https://github.com/channel-io/bezier-react/pull/1914)) by @sungik-choi + + - No longer support `as` and `interpolation` property. Replace any usage of `interpolation` property with appropriate `style` or `className` implementations. + - No longer support `wrapperStyle`, `wrapperClassName` and `wrapperInterpolation` property. It was never properly implemented before, and the Wrapper element inside was also removed. + +- **Breaking Changes: Deprecate support for `styled-components` related modules** ([#1962](https://github.com/channel-io/bezier-react/pull/1962)) by @sungik-choi + + - No longer support legacy foundation modules. Use the `useToken` hook and components to replace it + - `LightFoundation` and `DarkFoundation` + - `Spacing` + - `ev1`, `ev2`, `ev3`, `ev4`, `ev5` and `ev6` + - `createThemes`, `Theme`, `SemanticNames`, `LightTheme` and `DarkTheme` + - `TransitionDuration` and `Transition` + - `Border` + - `Typography`, `TypoAbsoluteNumber`, `LineHeightAbsoluteNumber` and `TypographyType` + - `absoluteCenter`, `disableAutoMinimum`, `hideScrollbars` and `ellipsis` + - `ThemeVarsAdditionalType` and `ThemeVars` + - `GlobalStyle` + - `Foundation` + - `GlobalStyleProp` + - `createGlobalStyle`, `styled`, `css`, `FoundationProvider`, `useFoundation`, `keyframes`, `StyleSheetManager` and `ServerStyleSheet` + - No longer support `BezierProvider`. Use the `AppProvider` instead + - No longer support `gap` and `touchableHover` mixins. Please implement and use your own + + ```tsx + function gap(spacing: number): InjectedInterpolation { + return css` + gap: ${spacing}px; + + @supports not (gap: ${spacing}px) { + margin-top: ${-spacing}px; + margin-left: ${-spacing}px; + + > * { + margin-top: ${spacing}px; + margin-left: ${spacing}px; + } + } + `; + } + + function touchableHover( + interpolation: InjectedInterpolation, + ): InjectedInterpolation { + return css` + @media (hover: hover) { + &:hover { + ${interpolation} + } + } + + @media (hover: none) { + &:active { + ${interpolation} + } + } + `; + } + ``` + + - No longer support `inputTextStyle`, `inputPlaceholderStyle`, `inputWrapperStyle`, `focusedInputWrapperStyle` and `erroredInputWrapperStyle`. Please migrate using `@channel.io/bezier-codemod`'s `v2-interpolation-to-css-variable` transformer. + +- **Breaking Changes: `AlphaStack` component has been changed to a `Stack` component, and `Stack` component has been changed to `LegacyStack` component.** ([#1837](https://github.com/channel-io/bezier-react/pull/1837)) by @sungik-choi + + Changes to remove the dependency of `Stack` and `StackItem` to allow stack layouts to be configured without additional DOM elements. And improved the existing `AlphaStack` to support more Flex layout related properties like reverse, wrap, and more align options, etc. See StackProps for more information. + + We also added new `HStack` and `VStack` components, which are shorthand components that fix the direction prop of `AlphaStack`. As mentioned above, the existing components become `LegacyHStack`, `LegacyVStack`. + + The layout implemented by `StackItem` can be partially replaced by the Layout component's `grow`, `shrink` common properties and margin common properties. Note that the `align`, `justify` (align-self, justify-self in CSS flex) properties provided by `StackItem` are not provided by the Layout component. + + ```jsx + /* AS-IS */ + return ( + + + + + + + ); + + /* TO-BE */ + return ( + + + + + ); + ``` + + The changes also apply to other components that use `Stack` internally, and there are a few breaking changes. + + - `RadioGroup`, `ButtonGroup`, `FormGroup` no longer support `as` prop. + +- **Breaking Change: Removal of `ListMenuTitle` Component** ([#1900](https://github.com/channel-io/bezier-react/pull/1900)) by @yangwooseong + + - It was no longer being managed or utilized by our designers. + - If you are currently using `ListMenuTitle` in your application, please replace it with the `SectionLabel` component for similar functionality. + +### Minor Changes + +- Implement multi theme feature based on data attributes ([#1756](https://github.com/channel-io/bezier-react/pull/1756)) by @sungik-choi + +- Move `@channel.io/bezier-tokens` from dev depdency to dependency ([#1985](https://github.com/channel-io/bezier-react/pull/1985)) by @sungik-choi + +- Add the `TooltipPrimitive` component, which is the same as the [`Tooltip` component in radix-ui](https://www.radix-ui.com/primitives/docs/components/tooltip). You can use it by importing it from the `/alpha` path. ([#2049](https://github.com/channel-io/bezier-react/pull/2049)) by @sungik-choi + + ```tsx + import { + TooltipPrimitive, + TooltipPrimitiveArrow, + TooltipPrimitiveContent, + TooltipPrimitivePortal, + TooltipPrimitiveProvider, + TooltipPrimitiveTrigger, + } from "@channel.io/bezier-react/alpha"; + ``` + +- When you pass a value of number type to the dimension-related properties of margin prop and layout prop, they implicitly add px units as a suffix. See: ([#1823](https://github.com/channel-io/bezier-react/pull/1823)) by @sungik-choi + +- Add `Box` component. `Box` component is responsible for the primitive layout and provides easy access to the design tokens in the design system ([#1785](https://github.com/channel-io/bezier-react/pull/1785)) by @sungik-choi + + ```tsx + + ``` + +- Fixes style inheritance issues by explicitly giving CSS custom properties an initial value ([#1846](https://github.com/channel-io/bezier-react/pull/1846)) by @sungik-choi + +- Apply bezier-tokens to bezier-react's style sheet and fix some invalid css selector ([#1495](https://github.com/channel-io/bezier-react/pull/1495)) by @sungik-choi + +- Add the `DialogPrimitive` component, which is the same as the [`Dialog` component in radix-ui](https://www.radix-ui.com/primitives/docs/components/dialog). You can use it by importing it from the `/alpha` path. ([#2049](https://github.com/channel-io/bezier-react/pull/2049)) by @sungik-choi + + ```tsx + import { + DialogPrimitive, + DialogPrimitiveClose, + DialogPrimitiveContent, + DialogPrimitiveDescription, + DialogPrimitiveOverlay, + DialogPrimitivePortal, + DialogPrimitiveTitle, + DialogPrimitiveTrigger, + } from "@channel.io/bezier-react/alpha"; + ``` + +- `ButtonGroup` now supports HTML attributes ([#1890](https://github.com/channel-io/bezier-react/pull/1890)) by @sungik-choi + +- `Banner` will now render content even if the `content` prop is not a string. The same applies to link-related props. ([#1972](https://github.com/channel-io/bezier-react/pull/1972)) by @sungik-choi + +- Rename `AlphaAppProvider` to `AppProvider` ([#1834](https://github.com/channel-io/bezier-react/pull/1834)) by @sungik-choi + +- Rename the `style.css` file to `styles.css` ([#1791](https://github.com/channel-io/bezier-react/pull/1791)) by @sungik-choi + +- Add `align` prop to `Text` component. This prop is used to set horizontal alignment of text ([#1820](https://github.com/channel-io/bezier-react/pull/1820)) by @sungik-choi + + ```tsx + + + + ``` + +- Remove `borderStyle` prop from Layout props ([#1848](https://github.com/channel-io/bezier-react/pull/1848)) by @sungik-choi + +- Add `useRootElement` hook. It is only available to `WindowProvider` children, and provides easy access to the root element of window context value. ([#1981](https://github.com/channel-io/bezier-react/pull/1981)) by @sungik-choi + + ```tsx + const { window, document, rootElement } = useWindow(); + // Same as useWindow().rootElement + const rootElement = useRootElement(); + ``` + +### Patch Changes + +- Fixes an issue with color inheritance across components. ([#2009](https://github.com/channel-io/bezier-react/pull/2009)) by @sungik-choi + +- Add missing default margin styles of `LegacyStackItem` ([#2004](https://github.com/channel-io/bezier-react/pull/2004)) by @sungik-choi + +- Fixes issue with `ModalBody`, `ModalFooter` not applying styling correctly when wrapped in other elements. ([#2017](https://github.com/channel-io/bezier-react/pull/2017)) by @sungik-choi + +- Add `overflow: hidden` to `ListItem` component ([#2013](https://github.com/channel-io/bezier-react/pull/2013)) by @yangwooseong + +- Fix invalid `aria-modal` value in Modal Content. ([#2052](https://github.com/channel-io/bezier-react/pull/2052)) by @sungik-choi + +- Fix `TabAction` typography style for size M. ([#2035](https://github.com/channel-io/bezier-react/pull/2035)) by @sungik-choi + +- Minify the CSS output ([#1791](https://github.com/channel-io/bezier-react/pull/1791)) by @sungik-choi + +- Update background color of `TextField`'s secondary variant. ([#2016](https://github.com/channel-io/bezier-react/pull/2016)) by @sungik-choi + +- Mute the error of `smoothCornerScript` when called twice. ([#2010](https://github.com/channel-io/bezier-react/pull/2010)) by @chaejunlee + +- Now exports the `tokens` object from `@channel.io/bezier-tokens`. ([#1992](https://github.com/channel-io/bezier-react/pull/1992)) by @sungik-choi + +- Adds icon and typo size for avatar size `"72"`, which were missing from `AvatarGroup`. ([#2071](https://github.com/channel-io/bezier-react/pull/2071)) by @sungik-choi + +- Add missing `overflow: hidden` style to item wrapper of `KeyValueItem` component. ([#2036](https://github.com/channel-io/bezier-react/pull/2036)) by @sungik-choi + +- Fixes `Overlay` not closing in other windows. ([#2037](https://github.com/channel-io/bezier-react/pull/2037)) by @sungik-choi + +- Fixes a bug where onHide is called when clicking inside the overlay, causing the overlay to close. ([#1977](https://github.com/channel-io/bezier-react/pull/1977)) by @yangwooseong + +- Fix invalid style migrations of `Tabs` component. ([#2014](https://github.com/channel-io/bezier-react/pull/2014)) by @sungik-choi + +- Add missing spreading props to `ThemeProvider` and related components. ([#1986](https://github.com/channel-io/bezier-react/pull/1986)) by @sungik-choi + +- Fix `ListItem`'s left icon color specificity issue. ([#2018](https://github.com/channel-io/bezier-react/pull/2018)) by @sungik-choi + +- Fix `Badge` component style issue ([#2068](https://github.com/channel-io/bezier-react/pull/2068)) by @yangwooseong + +- Fixes an issue where multi line truncated in `Text` was not being applied. ([#1994](https://github.com/channel-io/bezier-react/pull/1994)) by @sungik-choi + +- Updated dependencies + - @channel.io/bezier-tokens@0.1.0 + ## 2.0.0-alpha.21 ### Major Changes diff --git a/packages/bezier-react/package.json b/packages/bezier-react/package.json index f3c2d88a5a..7cbe56d4da 100644 --- a/packages/bezier-react/package.json +++ b/packages/bezier-react/package.json @@ -1,6 +1,6 @@ { "name": "@channel.io/bezier-react", - "version": "2.0.0-alpha.21", + "version": "2.0.0", "description": "React components library that implements Bezier design system.", "repository": { "type": "git", @@ -139,7 +139,7 @@ } }, "dependencies": { - "@channel.io/bezier-tokens": "0.1.0-alpha.5", + "@channel.io/bezier-tokens": "0.1.0", "@radix-ui/react-checkbox": "^1.0.4", "@radix-ui/react-dialog": "^1.0.5", "@radix-ui/react-radio-group": "^1.1.3", diff --git a/packages/bezier-tokens/CHANGELOG.md b/packages/bezier-tokens/CHANGELOG.md index 5a661bfad7..bd87c12a0c 100644 --- a/packages/bezier-tokens/CHANGELOG.md +++ b/packages/bezier-tokens/CHANGELOG.md @@ -1,5 +1,37 @@ # @channel.io/bezier-tokens +## 0.1.0 + +### Minor Changes + +- Apply deep freeze to the `tokens` object. ([#1992](https://github.com/channel-io/bezier-react/pull/1992)) by @sungik-choi + +- Add the missing `bg-header-float` semantic color token ([#1842](https://github.com/channel-io/bezier-react/pull/1842)) by @sungik-choi + +- Add composition tokens, such as box-shadow ([#1769](https://github.com/channel-io/bezier-react/pull/1769)) by @sungik-choi + +- Now serving one combined styles.css file. This is a breaking change for anyone who was importing the individual CSS files. You will need to update your import to `@channel.io/bezier-tokens/css/styles.css`. ([#1769](https://github.com/channel-io/bezier-react/pull/1769)) by @sungik-choi + +- Add z-index and opacity tokens ([#1766](https://github.com/channel-io/bezier-react/pull/1766)) by @sungik-choi + +- Remove invalid radius tokens ([#1934](https://github.com/channel-io/bezier-react/pull/1934)) by @sungik-choi + + - `radius-10` + - `radius-14` + - `radius-100-p` + +- Fix invalid letter spacing token values ([#1821](https://github.com/channel-io/bezier-react/pull/1821)) by @sungik-choi + +- First release ([#1685](https://github.com/channel-io/bezier-react/pull/1685)) by @sungik-choi + +- Add categories by token to the JavaScript build file ([#1766](https://github.com/channel-io/bezier-react/pull/1766)) by @sungik-choi + +- Remove unused tokens and add missing unit to radius tokens ([#1752](https://github.com/channel-io/bezier-react/pull/1752)) by @sungik-choi + +### Patch Changes + +- Remove duplicate styles in styles.css ([#1779](https://github.com/channel-io/bezier-react/pull/1779)) by @sungik-choi + ## 0.1.0-alpha.5 ### Minor Changes diff --git a/packages/bezier-tokens/package.json b/packages/bezier-tokens/package.json index 1974dd1895..a26842cb4d 100644 --- a/packages/bezier-tokens/package.json +++ b/packages/bezier-tokens/package.json @@ -1,6 +1,6 @@ { "name": "@channel.io/bezier-tokens", - "version": "0.1.0-alpha.5", + "version": "0.1.0", "description": "Design tokens for Bezier design system.", "repository": { "type": "git", diff --git a/packages/bezier-vscode/CHANGELOG.md b/packages/bezier-vscode/CHANGELOG.md index c14031380f..65c3f09696 100644 --- a/packages/bezier-vscode/CHANGELOG.md +++ b/packages/bezier-vscode/CHANGELOG.md @@ -1,5 +1,11 @@ # @channel.io/bezier-vscode +## 0.1.0 + +### Minor Changes + +- Create a package to support autocomplete for Bezier Design Tokens ([#2091](https://github.com/channel-io/bezier-react/pull/2091)) by @yangwooseong + ## 0.1.0-alpha.0 ### Minor Changes diff --git a/packages/bezier-vscode/package.json b/packages/bezier-vscode/package.json index 8198405a29..c889f9fcb9 100644 --- a/packages/bezier-vscode/package.json +++ b/packages/bezier-vscode/package.json @@ -1,6 +1,6 @@ { "name": "@channel.io/bezier-vscode", - "version": "0.1.0-alpha.0", + "version": "0.1.0", "private": true, "description": "VS Code extension for Bezier Design System", "repository": { @@ -62,7 +62,7 @@ "vscode-languageserver-textdocument": "^1.0.11" }, "devDependencies": { - "@channel.io/bezier-tokens": "0.1.0-alpha.5", + "@channel.io/bezier-tokens": "0.1.0", "@types/node": "^20.11.20", "@types/vscode": "^1.64.0" } diff --git a/yarn.lock b/yarn.lock index 9188669e2d..1eadfcc4a7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1948,7 +1948,7 @@ __metadata: languageName: unknown linkType: soft -"@channel.io/bezier-react@npm:2.0.0-alpha.21, @channel.io/bezier-react@workspace:packages/bezier-react": +"@channel.io/bezier-react@npm:2.0.0, @channel.io/bezier-react@workspace:packages/bezier-react": version: 0.0.0-use.local resolution: "@channel.io/bezier-react@workspace:packages/bezier-react" dependencies: @@ -1957,7 +1957,7 @@ __metadata: "@babel/preset-react": "npm:^7.23.3" "@babel/preset-typescript": "npm:^7.23.3" "@channel.io/bezier-icons": "npm:0.23.0" - "@channel.io/bezier-tokens": "npm:0.1.0-alpha.5" + "@channel.io/bezier-tokens": "npm:0.1.0" "@radix-ui/react-checkbox": "npm:^1.0.4" "@radix-ui/react-dialog": "npm:^1.0.5" "@radix-ui/react-radio-group": "npm:^1.1.3" @@ -2034,7 +2034,7 @@ __metadata: languageName: unknown linkType: soft -"@channel.io/bezier-tokens@npm:0.1.0-alpha.5, @channel.io/bezier-tokens@workspace:packages/bezier-tokens": +"@channel.io/bezier-tokens@npm:0.1.0, @channel.io/bezier-tokens@workspace:packages/bezier-tokens": version: 0.0.0-use.local resolution: "@channel.io/bezier-tokens@workspace:packages/bezier-tokens" dependencies: @@ -2049,7 +2049,7 @@ __metadata: version: 0.0.0-use.local resolution: "@channel.io/bezier-vscode@workspace:packages/bezier-vscode" dependencies: - "@channel.io/bezier-tokens": "npm:0.1.0-alpha.5" + "@channel.io/bezier-tokens": "npm:0.1.0" "@types/node": "npm:^20.11.20" "@types/vscode": "npm:^1.64.0" vscode-languageclient: "npm:^9.0.1" @@ -8359,7 +8359,7 @@ __metadata: resolution: "bezier-figma-plugin@workspace:packages/bezier-figma-plugin" dependencies: "@channel.io/bezier-icons": "npm:0.23.0" - "@channel.io/bezier-react": "npm:2.0.0-alpha.21" + "@channel.io/bezier-react": "npm:2.0.0" "@figma/plugin-typings": "npm:^1.87.0" "@types/react": "npm:^18.2.59" "@types/react-dom": "npm:^18.2.19"