Rename package from ui to gpui-component (#606)

## 🚨Break Change Update dependencies from `ui` to `gpui-component`.
2025-02-06 17:21:46 +08:00 · 2025-02-06 17:21:46 +08:00 · abb3de013e
commit abb3de013e
parent e423497da6
26 changed files with 118 additions and 116 deletions
--- a/Cargo.toml
+++ b/Cargo.toml
@ -5,15 +5,17 @@ default-members = ["crates/story"]
 resolver = "2"

 [workspace.dependencies]
-anyhow = "1"
+gpui-component = { path = "crates/ui" }
+story = { path = "crates/story" }
+
 gpui = { git = "https://github.com/huacnlee/zed.git", branch = "webview" }
+
+anyhow = "1"
 log = "0.4"
+rust-embed = "8.5.0"
 serde = "1.0.203"
 serde_json = "1"
 smallvec = "1"
-rust-embed = "8.5.0"
-story = { path = "crates/story" }
-ui = { package = "gpui-component", path = "crates/ui" }
 windows = { version = "0.58.0", features = [
    "Wdk",
    "Wdk_System",
--- a/README.md
+++ b/README.md
@ -58,7 +58,7 @@ And GPUI Component depends on `gpui` by special version (It keep updated to upst

 ```toml
 gpui = { git = "https://github.com/huacnlee/zed.git", branch = "export-platform-window" }
-ui = { git = "https://github.com/longbridge/gpui-component.git" }
+gpui-component = { git = "https://github.com/longbridge/gpui-component.git" }
 ```

 More usage can be found in [story](https://github.com/longbridge/gpui-component/tree/main/crates/story) directory.
--- a/crates/story/Cargo.toml
+++ b/crates/story/Cargo.toml
@ -1,22 +1,22 @@
 [package]
-name = "story"
-version = "0.1.0"
 edition = "2021"
+name = "story"
 publish = false
+version = "0.1.0"

 [dependencies]
-ui.workspace = true
-gpui.workspace = true
-fake = { version = "2.10.0", features = ["dummy"] }
+anyhow.workspace = true
 charts-rs = "0.3"
-regex = "1"
 chrono = "0.4"
+fake = { version = "2.10.0", features = ["dummy"] }
+gpui.workspace = true
+gpui-component.workspace = true
+rand = "0.8"
+regex = "1"
+rust-embed.workspace = true
 serde = "1"
 serde_json = "1"
 unindent = "0.2.3"
-anyhow.workspace = true
-rust-embed.workspace = true
-rand = "0.8"

 [lints]
 workspace = true
--- a/crates/story/src/accordion_story.rs
+++ b/crates/story/src/accordion_story.rs
@ -2,7 +2,7 @@ use gpui::{
    App, AppContext, Context, Entity, FocusHandle, Focusable, IntoElement, ParentElement as _,
    Render, Styled as _, Window,
 };
-use ui::{
+use gpui_component::{
    accordion::Accordion,
    button::{Button, ButtonGroup},
    checkbox::Checkbox,
--- a/crates/story/src/button_story.rs
+++ b/crates/story/src/button_story.rs
@ -3,11 +3,12 @@ use gpui::{
    Focusable, InteractiveElement, IntoElement, ParentElement as _, Render, Styled as _, Window,
 };

-use ui::{
+use gpui_component::{
+    black,
    button::{Button, ButtonCustomVariant, ButtonGroup, ButtonVariants as _, DropdownButton},
    checkbox::Checkbox,
-    h_flex, v_flex, ActiveTheme, Disableable as _, Icon, IconName, Selectable as _, Sizable as _,
-    Theme,
+    green_500, green_600, green_800, green_900, green_950, h_flex, v_flex, white, ActiveTheme,
+    Disableable as _, Icon, IconName, Selectable as _, Sizable as _, Theme,
 };

 use crate::section;
@ -209,29 +210,29 @@ impl Render for ButtonStory {
                                    .custom(
                                        ButtonCustomVariant::new(cx)
                                            .color(if cx.theme().mode.is_dark() {
-                                                ui::green_900()
+                                                green_900()
                                            } else {
-                                                ui::green_500()
+                                                green_500()
                                            })
                                            .foreground(if cx.theme().mode.is_dark() {
-                                                ui::white()
+                                                white()
                                            } else {
-                                                ui::black()
+                                                black()
                                            })
                                            .border(if cx.theme().mode.is_dark() {
-                                                ui::green_800()
+                                                green_800()
                                            } else {
-                                                ui::green_600()
+                                                green_600()
                                            })
                                            .hover(if cx.theme().mode.is_dark() {
-                                                ui::green_800()
+                                                green_800()
                                            } else {
-                                                ui::green_500()
+                                                green_500()
                                            })
                                            .active(if cx.theme().mode.is_dark() {
-                                                ui::green_950()
+                                                green_950()
                                            } else {
-                                                ui::green_600()
+                                                green_600()
                                            }),
                                    )
                                    .label("Custom Button")
--- a/crates/story/src/calendar_story.rs
+++ b/crates/story/src/calendar_story.rs
@ -3,7 +3,7 @@ use gpui::{
    px, App, AppContext, Context, Entity, Focusable, IntoElement, ParentElement as _, Render,
    Styled as _, Window,
 };
-use ui::{
+use gpui_component::{
    button::Button,
    date_picker::{DatePicker, DatePickerEvent, DateRangePreset},
    v_flex, Sizable as _, Size,
--- a/crates/story/src/dropdown_story.rs
+++ b/crates/story/src/dropdown_story.rs
@ -3,7 +3,7 @@ use gpui::{
    KeyBinding, ParentElement, Render, SharedString, Styled, Window,
 };

-use ui::{
+use gpui_component::{
    checkbox::Checkbox,
    dropdown::{Dropdown, DropdownEvent, DropdownItem, SearchableVec},
    h_flex, v_flex, ActiveTheme, FocusableCycle, IconName, Sizable,
--- a/crates/story/src/form_story.rs
+++ b/crates/story/src/form_story.rs
@ -2,7 +2,7 @@ use gpui::{
    actions, div, prelude::FluentBuilder as _, App, AppContext, Axis, Context, Entity, Focusable,
    InteractiveElement, IntoElement, ParentElement as _, Render, Styled, Window,
 };
-use ui::{
+use gpui_component::{
    button::{Button, ButtonGroup},
    checkbox::Checkbox,
    date_picker::DatePicker,
--- a/crates/story/src/icon_story.rs
+++ b/crates/story/src/icon_story.rs
@ -2,10 +2,10 @@ use gpui::{
    px, rems, App, AppContext, Context, Entity, FocusHandle, Focusable, IntoElement, ParentElement,
    Render, Styled, Window,
 };
-use ui::{
+use gpui_component::{
    button::{Button, ButtonVariant, ButtonVariants},
    dock::PanelControl,
-    h_flex, v_flex, ActiveTheme as _, Icon, IconName,
+    gray_500, green_500, h_flex, red_500, v_flex, ActiveTheme as _, Icon, IconName,
 };

 pub struct IconStory {
@ -53,25 +53,17 @@ impl Render for IconStory {
                .child(
                    Icon::new(IconName::Maximize)
                        .size_6()
-                        .text_color(ui::green_500()),
+                        .text_color(green_500()),
                )
                .child(Icon::new(IconName::Maximize).size(px(55.)))
                .child(
                    Button::new("like1")
-                        .icon(
-                            Icon::new(IconName::Heart)
-                                .text_color(ui::gray_500())
-                                .size_6(),
-                        )
+                        .icon(Icon::new(IconName::Heart).text_color(gray_500()).size_6())
                        .with_variant(ButtonVariant::Ghost),
                )
                .child(
                    Button::new("like2")
-                        .icon(
-                            Icon::new(IconName::HeartOff)
-                                .text_color(ui::red_500())
-                                .size_6(),
-                        )
+                        .icon(Icon::new(IconName::HeartOff).text_color(red_500()).size_6())
                        .with_variant(ButtonVariant::Ghost),
                )
                .child(
--- a/crates/story/src/image_story.rs
+++ b/crates/story/src/image_story.rs
@ -1,7 +1,7 @@
 use gpui::{
    px, App, AppContext, Entity, FocusHandle, Focusable, ParentElement as _, Render, Styled, Window,
 };
-use ui::{dock::PanelControl, h_flex, v_flex, SvgImg};
+use gpui_component::{dock::PanelControl, h_flex, v_flex, SvgImg};

 const GOOGLE_LOGO: &str = include_str!("./fixtures/google.svg");
 const PIE_JSON: &str = include_str!("./fixtures/pie.json");
--- a/crates/story/src/input_story.rs
+++ b/crates/story/src/input_story.rs
@ -6,11 +6,11 @@ use gpui::{
 use regex::Regex;

 use crate::section;
-use ui::{
+use gpui_component::{
    button::{Button, ButtonVariant, ButtonVariants as _},
    checkbox::Checkbox,
    h_flex,
-    input::{InputEvent, NumberInput, NumberInputEvent, OtpInput, TextInput},
+    input::{InputEvent, NumberInput, NumberInputEvent, OtpInput, StepAction, TextInput},
    v_flex, FocusableCycle, IconName, Sizable,
 };

@ -269,13 +269,13 @@ impl InputStory {
                InputEvent::Blur => println!("Blur"),
            },
            NumberInputEvent::Step(step_action) => match step_action {
-                ui::input::StepAction::Decrement => {
+                StepAction::Decrement => {
                    self.number_input1_value = self.number_input1_value - 1;
                    self.number_input1.update(cx, |input, cx| {
                        input.set_value(self.number_input1_value.to_string(), window, cx);
                    });
                }
-                ui::input::StepAction::Increment => {
+                StepAction::Increment => {
                    self.number_input1_value = self.number_input1_value + 1;
                    self.number_input1.update(cx, |input, cx| {
                        input.set_value(self.number_input1_value.to_string(), window, cx);
@ -300,7 +300,7 @@ impl InputStory {
                InputEvent::Blur => println!("Blur"),
            },
            NumberInputEvent::Step(step_action) => match step_action {
-                ui::input::StepAction::Decrement => {
+                StepAction::Decrement => {
                    if self.number_input2_value.le(&0) {
                        return;
                    }
@ -310,7 +310,7 @@ impl InputStory {
                        input.set_value(self.number_input2_value.to_string(), window, cx);
                    });
                }
-                ui::input::StepAction::Increment => {
+                StepAction::Increment => {
                    self.number_input2_value = self.number_input2_value + 1;
                    self.number_input2.update(cx, |input, cx| {
                        input.set_value(self.number_input2_value.to_string(), window, cx);
--- a/crates/story/src/lib.rs
+++ b/crates/story/src/lib.rs
@ -53,7 +53,7 @@ pub use title_bar::AppTitleBar;
 pub use tooltip_story::TooltipStory;
 pub use webview_story::WebViewStory;

-use ui::{
+use gpui_component::{
    button::Button,
    divider::Divider,
    dock::{register_panel, Panel, PanelControl, PanelEvent, PanelInfo, PanelState, TitleStyle},
@ -188,7 +188,7 @@ impl Render for StoryRoot {
 impl Global for AppState {}

 pub fn init(cx: &mut App) {
-    ui::init(cx);
+    gpui_component::init(cx);
    AppState::init(cx);
    input_story::init(cx);
    dropdown_story::init(cx);
@ -229,7 +229,7 @@ pub fn init(cx: &mut App) {
 actions!(story, [ShowPanelInfo]);

 pub fn section(title: impl IntoElement, cx: &App) -> Div {
-    use ui::ActiveTheme;
+    use gpui_component::ActiveTheme;
    let theme = cx.theme();

    h_flex()
--- a/crates/story/src/list_story.rs
+++ b/crates/story/src/list_story.rs
@ -8,7 +8,7 @@ use gpui::{
    Subscription, Task, Timer, Window,
 };

-use ui::{
+use gpui_component::{
    button::Button,
    checkbox::Checkbox,
    h_flex, hsl,
--- a/crates/story/src/main.rs
+++ b/crates/story/src/main.rs
@ -1,5 +1,11 @@
 use anyhow::{Context as _, Result};
 use gpui::*;
+use gpui_component::{
+    button::{Button, ButtonVariants as _},
+    dock::{DockArea, DockAreaState, DockEvent, DockItem, DockPlacement},
+    popup_menu::PopupMenuExt,
+    IconName, Root, Sizable, Theme, TitleBar,
+};
 use serde::Deserialize;
 use std::{sync::Arc, time::Duration};
 use story::{
@ -8,12 +14,6 @@ use story::{
    ProgressStory, Quit, ResizableStory, ScrollableStory, SidebarStory, StoryContainer,
    SwitchStory, TableStory, TextStory, TooltipStory,
 };
-use ui::{
-    button::{Button, ButtonVariants as _},
-    dock::{DockArea, DockAreaState, DockEvent, DockItem, DockPlacement},
-    popup_menu::PopupMenuExt,
-    IconName, Root, Sizable, Theme, TitleBar,
-};

 #[derive(Clone, PartialEq, Eq, Deserialize)]
 pub struct AddPanel(DockPlacement);
@ -33,7 +33,7 @@ pub fn init(cx: &mut App) {

    cx.on_action(|_action: &Open, _cx: &mut App| {});

-    ui::init(cx);
+    gpui_component::init(cx);
    story::init(cx);
 }

@ -506,7 +506,7 @@ impl Render for StoryWorkspace {
 }

 fn main() {
-    use ui::input::{Copy, Cut, Paste, Redo, Undo};
+    use gpui_component::input::{Copy, Cut, Paste, Redo, Undo};

    let app = Application::new().with_assets(Assets);

--- a/crates/story/src/modal_story.rs
+++ b/crates/story/src/modal_story.rs
@ -7,7 +7,7 @@ use gpui::{
    Task, Timer, WeakEntity, Window,
 };

-use ui::{
+use gpui_component::{
    button::{Button, ButtonVariant, ButtonVariants as _},
    checkbox::Checkbox,
    date_picker::DatePicker,
@ -19,7 +19,7 @@ use ui::{
    notification::{Notification, NotificationType},
    v_flex,
    webview::WebView,
-    ActiveTheme as _, ContextModal as _, Icon, IconName, Placement,
+    wry, ActiveTheme as _, ContextModal as _, Icon, IconName, Placement,
 };

 actions!(modal_story, [TestAction]);
@ -76,7 +76,7 @@ impl ListDelegate for ListItemDeletegate {

        if let Some(item) = self.matches.get(ix) {
            let list_item = ListItem::new(("item", ix))
-                .check_icon(ui::IconName::Check)
+                .check_icon(IconName::Check)
                .confirmed(confirmed)
                .selected(selected)
                .py_1()
@ -523,7 +523,7 @@ impl Render for ModalStory {
                            .child(Button::new("webview").label("Open WebView").on_click(
                                cx.listener(|_, _, window, cx| {
                                    let webview = cx.new(|cx| {
-                                        let webview = ui::wry::WebViewBuilder::new()
+                                        let webview = wry::WebViewBuilder::new()
                                            .build_as_child(&window.raw_window_handle())
                                            .unwrap();

--- a/crates/story/src/popup_story.rs
+++ b/crates/story/src/popup_story.rs
@ -3,8 +3,7 @@ use gpui::{
    Element, Entity, EventEmitter, FocusHandle, Focusable, InteractiveElement, IntoElement,
    KeyBinding, MouseButton, ParentElement as _, Render, SharedString, Styled as _, Window,
 };
-use serde::Deserialize;
-use ui::{
+use gpui_component::{
    button::{Button, ButtonVariants as _},
    context_menu::ContextMenuExt,
    divider::Divider,
@ -15,6 +14,7 @@ use ui::{
    switch::Switch,
    v_flex, ActiveTheme as _, ContextModal, IconName, Sizable,
 };
+use serde::Deserialize;

 #[derive(Clone, PartialEq, Deserialize)]
 struct Info(usize);
--- a/crates/story/src/progress_story.rs
+++ b/crates/story/src/progress_story.rs
@ -2,11 +2,12 @@ use gpui::{
    div, hsla, px, App, AppContext, Context, Entity, Focusable, Hsla, IntoElement, ParentElement,
    Render, SharedString, Styled, Subscription, Window,
 };
-use ui::{
+use gpui_component::{
+    blue_500,
    button::Button,
    clipboard::Clipboard,
    divider::Divider,
-    h_flex,
+    gray_300, h_flex,
    indicator::Indicator,
    progress::Progress,
    skeleton::Skeleton,
@ -204,7 +205,7 @@ impl Render for ProgressStory {
                        Indicator::new()
                            .large()
                            .icon(IconName::LoaderCircle)
-                            .color(ui::blue_500()),
+                            .color(blue_500()),
                    )
                    .child(Indicator::new().with_size(px(64.))),
            )
@ -212,7 +213,7 @@ impl Render for ProgressStory {
                Divider::horizontal()
                    .mt_10()
                    .label("Slider")
-                    .color(ui::gray_300()),
+                    .color(gray_300()),
            )
            .child(self.slider1.clone())
            .child(format!("Slider 1: {}", self.slider1_value))
--- a/crates/story/src/resizable_story.rs
+++ b/crates/story/src/resizable_story.rs
@ -2,10 +2,9 @@ use gpui::{
    div, px, AnyElement, App, AppContext, Context, Entity, Focusable, IntoElement,
    ParentElement as _, Render, SharedString, Styled, Window,
 };
-use ui::ActiveTheme;
-use ui::{
+use gpui_component::{
    resizable::{h_resizable, resizable_panel, v_resizable, ResizablePanelGroup},
-    v_flex,
+    v_flex, ActiveTheme,
 };

 pub struct ResizableStory {
--- a/crates/story/src/scrollable_story.rs
+++ b/crates/story/src/scrollable_story.rs
@ -5,12 +5,14 @@ use gpui::{
    div, px, size, App, AppContext, Context, Entity, Focusable, InteractiveElement, IntoElement,
    ParentElement, Pixels, Render, ScrollHandle, SharedString, Size, Styled, Window,
 };
-use ui::button::Button;
-use ui::divider::Divider;
-use ui::label::Label;
-use ui::scroll::{Scrollbar, ScrollbarAxis, ScrollbarState};
-use ui::ActiveTheme;
-use ui::{h_flex, v_flex, v_virtual_list, StyledExt as _};
+use gpui_component::{
+    button::Button,
+    divider::Divider,
+    gray_100, gray_800, h_flex,
+    label::Label,
+    scroll::{Scrollbar, ScrollbarAxis, ScrollbarState},
+    v_flex, v_virtual_list, ActiveTheme as _, StyledExt as _,
+};

 pub struct ScrollableStory {
    focus_handle: gpui::FocusHandle,
@ -212,9 +214,9 @@ impl Render for ScrollableStory {
                                                                    .bg(
                                                                        if cx.theme().mode.is_dark()
                                                                        {
-                                                                            ui::gray_800()
+                                                                            gray_800()
                                                                        } else {
-                                                                            ui::gray_100()
+                                                                            gray_100()
                                                                        },
                                                                    )
                                                                    .child(if i == 0 {
--- a/crates/story/src/sidebar_story.rs
+++ b/crates/story/src/sidebar_story.rs
@ -3,8 +3,8 @@ use gpui::{
    Context, Entity, Focusable, ParentElement, Render, SharedString, Styled, Window,
 };

-use serde::Deserialize;
-use ui::{
+use gpui_component::{
+    blue_500,
    breadcrumb::{Breadcrumb, BreadcrumbItem},
    divider::Divider,
    h_flex,
@ -12,8 +12,9 @@ use ui::{
    sidebar::{
        Sidebar, SidebarFooter, SidebarGroup, SidebarHeader, SidebarMenu, SidebarToggleButton,
    },
-    v_flex, ActiveTheme, Collapsible, Icon, IconName,
+    v_flex, white, ActiveTheme, Collapsible, Icon, IconName,
 };
+use serde::Deserialize;

 #[derive(Clone, PartialEq, Eq, Deserialize)]
 pub struct SelectCompany(SharedString);
@ -216,8 +217,8 @@ impl Render for SidebarStory {
                                    .items_center()
                                    .justify_center()
                                    .rounded(cx.theme().radius)
-                                    .bg(ui::blue_500())
-                                    .text_color(ui::white())
+                                    .bg(blue_500())
+                                    .text_color(white())
                                    .size_8()
                                    .flex_shrink_0()
                                    .child(Icon::new(IconName::GalleryVerticalEnd).size_4())
--- a/crates/story/src/switch_story.rs
+++ b/crates/story/src/switch_story.rs
@ -3,7 +3,7 @@ use gpui::{
    SharedString, Styled, Window,
 };

-use ui::{
+use gpui_component::{
    checkbox::Checkbox,
    h_flex,
    label::Label,
--- a/crates/story/src/table_story.rs
+++ b/crates/story/src/table_story.rs
@ -9,18 +9,19 @@ use gpui::{
    Context, Edges, Entity, Focusable, InteractiveElement, IntoElement, ParentElement, Pixels,
    Render, SharedString, Styled, Timer, Window,
 };
-use serde::Deserialize;
-use ui::{
+use gpui_component::{
    button::Button,
    checkbox::Checkbox,
-    h_flex,
+    green, h_flex,
    indicator::Indicator,
    input::{InputEvent, TextInput},
    label::Label,
    popup_menu::{PopupMenu, PopupMenuExt},
-    table::{ColFixed, ColSort, Table, TableDelegate, TableEvent},
+    red,
+    table::{self, ColFixed, ColSort, Table, TableDelegate, TableEvent},
    v_flex, ActiveTheme as _, Selectable, Sizable as _, Size, StyleSized as _,
 };
+use serde::Deserialize;

 #[derive(Clone, PartialEq, Eq, Deserialize)]
 struct ChangeSize(Size);
@ -274,11 +275,11 @@ impl StockTableDelegate {
        let right_num = ((val - val.floor()) * 1000.).floor() as i32;

        let this = if right_num % 3 == 0 {
-            this.text_color(ui::red(fg_scale))
-                .bg(ui::red(bg_scale).opacity(opacity))
+            this.text_color(red(fg_scale))
+                .bg(red(bg_scale).opacity(opacity))
        } else if right_num % 3 == 1 {
-            this.text_color(ui::green(fg_scale))
-                .bg(ui::green(bg_scale).opacity(opacity))
+            this.text_color(green(fg_scale))
+                .bg(green(bg_scale).opacity(opacity))
        } else {
            this
        };
@ -322,7 +323,7 @@ impl TableDelegate for StockTableDelegate {
        }
    }

-    fn col_fixed(&self, col_ix: usize, _: &App) -> Option<ui::table::ColFixed> {
+    fn col_fixed(&self, col_ix: usize, _: &App) -> Option<table::ColFixed> {
        if !self.fixed_cols {
            return None;
        }
--- a/crates/story/src/text_story.rs
+++ b/crates/story/src/text_story.rs
@ -3,14 +3,15 @@ use gpui::{
    SharedString, Styled, Window,
 };

-use ui::{
+use gpui_component::{
    button::{Button, ButtonVariant, ButtonVariants as _},
    clipboard::Clipboard,
    h_flex,
    label::Label,
    link::Link,
+    red_500,
    tag::Tag,
-    v_flex, IconName, Sizable, StyledExt,
+    v_flex, yellow_500, yellow_800, IconName, Sizable, StyledExt,
 };

 use crate::section;
@ -71,7 +72,7 @@ impl Render for TextStory {
                            .child(Label::new("Text align center").text_center())
                            .child(Label::new("Text align right").text_right()),
                    )
-                    .child(Label::new("Color Label").text_color(ui::red_500()))
+                    .child(Label::new("Color Label").text_color(red_500()))
                    .child(
                        Label::new("Font Size Label")
                            .text_size(px(20.))
@ -104,8 +105,8 @@ impl Render for TextStory {
                                .child(
                                    Link::new("link2")
                                        .href("https://github.com")
-                                        .text_color(ui::red_500())
-                                        .text_decoration_color(ui::red_500())
+                                        .text_color(red_500())
+                                        .text_decoration_color(red_500())
                                        .child("Red Link"),
                                )
                                .child(
@ -199,7 +200,7 @@ impl Render for TextStory {
                            .child(Tag::outline().small().child("Outline"))
                            .child(Tag::danger().small().child("danger"))
                            .child(
-                                Tag::custom(ui::yellow_500(), ui::yellow_800(), ui::yellow_500())
+                                Tag::custom(yellow_500(), yellow_800(), yellow_500())
                                    .small()
                                    .child("Custom"),
                            ),
@ -212,7 +213,7 @@ impl Render for TextStory {
                            .child(Tag::outline().child("Outline"))
                            .child(Tag::danger().child("danger"))
                            .child(
-                                Tag::custom(ui::yellow_500(), ui::yellow_800(), ui::yellow_500())
+                                Tag::custom(yellow_500(), yellow_800(), yellow_500())
                                    .child("Custom"),
                            ),
                    ),
--- a/crates/story/src/title_bar.rs
+++ b/crates/story/src/title_bar.rs
@ -5,13 +5,15 @@ use gpui::{
    Entity, FocusHandle, Hsla, InteractiveElement as _, IntoElement, MouseButton,
    ParentElement as _, Render, SharedString, Styled as _, Subscription, Window,
 };
-use ui::{
+use gpui_component::{
    badge::Badge,
    button::{Button, ButtonVariants as _},
    color_picker::{ColorPicker, ColorPickerEvent},
+    locale,
    popup_menu::PopupMenuExt as _,
    scroll::ScrollbarShow,
-    ActiveTheme as _, ContextModal as _, IconName, Sizable as _, Theme, TitleBar,
+    set_locale, ActiveTheme as _, ContextModal as _, IconName, Sizable as _, Theme, ThemeMode,
+    TitleBar,
 };

 use crate::{SelectFont, SelectLocale, SelectRadius, SelectScrollbarShow};
@ -90,8 +92,8 @@ impl AppTitleBar {

    fn change_color_mode(&mut self, _: &ClickEvent, window: &mut Window, cx: &mut Context<Self>) {
        let mode = match cx.theme().mode.is_dark() {
-            true => ui::ThemeMode::Light,
-            false => ui::ThemeMode::Dark,
+            true => ThemeMode::Light,
+            false => ThemeMode::Dark,
        };

        Theme::change(mode, None, cx);
@ -174,7 +176,7 @@ impl LocaleSelector {
        window: &mut Window,
        _: &mut Context<Self>,
    ) {
-        ui::set_locale(&locale.0);
+        set_locale(&locale.0);
        window.refresh();
    }
 }
@ -182,7 +184,7 @@ impl LocaleSelector {
 impl Render for LocaleSelector {
    fn render(&mut self, _: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
        let focus_handle = self.focus_handle.clone();
-        let locale = ui::locale().to_string();
+        let locale = locale().to_string();

        div()
            .id("locale-selector")
--- a/crates/story/src/tooltip_story.rs
+++ b/crates/story/src/tooltip_story.rs
@ -3,7 +3,7 @@ use gpui::{
    ParentElement, Render, StatefulInteractiveElement, Styled, Window,
 };

-use ui::{
+use gpui_component::{
    button::{Button, ButtonVariant, ButtonVariants},
    checkbox::Checkbox,
    dock::PanelControl,
--- a/crates/story/src/webview_story.rs
+++ b/crates/story/src/webview_story.rs
@ -2,12 +2,12 @@ use gpui::{
    div, App, AppContext, ClickEvent, Context, Entity, FocusHandle, Focusable, IntoElement,
    ParentElement as _, Render, Styled as _, Window,
 };
-use ui::{
+use gpui_component::{
    h_flex,
    input::{InputEvent, TextInput},
    v_flex,
    webview::WebView,
-    ActiveTheme,
+    wry, ActiveTheme,
 };

 pub struct WebViewStory {
@ -31,7 +31,7 @@ impl WebViewStory {
        let focus_handle = cx.focus_handle();

        let webview = cx.new(|cx| {
-            let webview = ui::wry::WebViewBuilder::new()
+            let webview = wry::WebViewBuilder::new()
                .build_as_child(&window.raw_window_handle())
                .unwrap();
            WebView::new(webview, window, cx)