diff --git a/packages/ui/src/breadcrumbs/index.tsx b/packages/ui/src/breadcrumbs/index.ts
similarity index 100%
rename from packages/ui/src/breadcrumbs/index.tsx
rename to packages/ui/src/breadcrumbs/index.ts
diff --git a/packages/ui/src/dropdowns/index.tsx b/packages/ui/src/dropdowns/index.ts
similarity index 100%
rename from packages/ui/src/dropdowns/index.tsx
rename to packages/ui/src/dropdowns/index.ts
diff --git a/packages/ui/src/form-fields/index.tsx b/packages/ui/src/form-fields/index.ts
similarity index 100%
rename from packages/ui/src/form-fields/index.tsx
rename to packages/ui/src/form-fields/index.ts
diff --git a/packages/ui/src/icons/index.tsx b/packages/ui/src/icons/index.ts
similarity index 100%
rename from packages/ui/src/icons/index.tsx
rename to packages/ui/src/icons/index.ts
diff --git a/packages/ui/src/icons/state/index.tsx b/packages/ui/src/icons/state/index.ts
similarity index 100%
rename from packages/ui/src/icons/state/index.tsx
rename to packages/ui/src/icons/state/index.ts
diff --git a/packages/ui/src/progress/index.tsx b/packages/ui/src/progress/index.ts
similarity index 100%
rename from packages/ui/src/progress/index.tsx
rename to packages/ui/src/progress/index.ts
diff --git a/packages/ui/src/tooltip/index.tsx b/packages/ui/src/tooltip/index.ts
similarity index 100%
rename from packages/ui/src/tooltip/index.tsx
rename to packages/ui/src/tooltip/index.ts
diff --git a/web/components/cycles/cycles-view.tsx b/web/components/cycles/cycles-view.tsx
index cacd23905..4eea43e6d 100644
--- a/web/components/cycles/cycles-view.tsx
+++ b/web/components/cycles/cycles-view.tsx
@@ -6,7 +6,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
// components
import { CyclesBoard, CyclesList, CyclesListGanttChartView } from "components/cycles";
// ui components
-import { Loader } from "components/ui";
+import { Loader } from "@plane/ui";
// types
import { TCycleLayout } from "types";
diff --git a/web/components/cycles/delete-modal.tsx b/web/components/cycles/delete-modal.tsx
index 02d6126fe..b7f25028d 100644
--- a/web/components/cycles/delete-modal.tsx
+++ b/web/components/cycles/delete-modal.tsx
@@ -3,7 +3,7 @@ import { Dialog, Transition } from "@headlessui/react";
import { observer } from "mobx-react-lite";
import { AlertTriangle } from "lucide-react";
// components
-import { DangerButton, SecondaryButton } from "components/ui";
+import { Button } from "@plane/ui";
// hooks
import useToast from "hooks/use-toast";
// types
@@ -101,10 +101,13 @@ export const CycleDeleteModal: React.FC = observer((props) => {
- Cancel
-
+
+
+
+
diff --git a/web/components/estimates/estimate-select.tsx b/web/components/estimates/estimate-select.tsx
index 5ac283b83..e02cfaf89 100644
--- a/web/components/estimates/estimate-select.tsx
+++ b/web/components/estimates/estimate-select.tsx
@@ -3,7 +3,7 @@ import { usePopper } from "react-popper";
import { Combobox } from "@headlessui/react";
import { Check, ChevronDown, Search, Triangle } from "lucide-react";
// types
-import { Tooltip } from "components/ui";
+import { Tooltip } from "@plane/ui";
import { Placement } from "@popperjs/core";
// constants
import { IEstimatePoint } from "types";
diff --git a/web/components/headers/project-views.tsx b/web/components/headers/project-views.tsx
index 52aa23c2f..a50e0774b 100644
--- a/web/components/headers/project-views.tsx
+++ b/web/components/headers/project-views.tsx
@@ -8,9 +8,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
// components
import { CreateUpdateProjectViewModal } from "components/views";
// components
-import { Breadcrumbs, BreadcrumbItem } from "@plane/ui";
-// ui
-import { PrimaryButton } from "components/ui";
+import { Breadcrumbs, BreadcrumbItem, Button } from "@plane/ui";
// helpers
import { truncateText } from "helpers/string.helper";
@@ -59,10 +57,14 @@ export const ProjectViewsHeader: React.FC = observer(() => {
-
setCreateViewModal(true)}>
-
+ }
+ onClick={() => setCreateViewModal(true)}
+ >
Create View
-
+
diff --git a/web/components/issues/issue-layouts/filters/applied-filters/roots/project-view-root.tsx b/web/components/issues/issue-layouts/filters/applied-filters/roots/project-view-root.tsx
index 368b6b6fa..c8ee36fe7 100644
--- a/web/components/issues/issue-layouts/filters/applied-filters/roots/project-view-root.tsx
+++ b/web/components/issues/issue-layouts/filters/applied-filters/roots/project-view-root.tsx
@@ -7,7 +7,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
// components
import { AppliedFiltersList } from "components/issues";
// ui
-import { PrimaryButton } from "components/ui";
+import { Button } from "@plane/ui";
// helpers
import { areFiltersDifferent } from "helpers/filter.helper";
// types
@@ -102,9 +102,9 @@ export const ProjectViewAppliedFiltersRoot: React.FC = observer(() => {
states={projectStore.states?.[projectId?.toString() ?? ""]}
/>
{storedFilters && viewDetails && areFiltersDifferent(storedFilters, viewDetails.query_data ?? {}) && (
-
+
+
)}
);
diff --git a/web/components/labels/label-select.tsx b/web/components/labels/label-select.tsx
index c70aa8d29..162c78b96 100644
--- a/web/components/labels/label-select.tsx
+++ b/web/components/labels/label-select.tsx
@@ -4,7 +4,7 @@ import { Placement } from "@popperjs/core";
import { Combobox } from "@headlessui/react";
import { Check, ChevronDown, Search } from "lucide-react";
// ui
-import { Tooltip } from "components/ui";
+import { Tooltip } from "@plane/ui";
// types
import { IIssueLabels } from "types";
diff --git a/web/components/labels/project-setting-label-group.tsx b/web/components/labels/project-setting-label-group.tsx
index 675bcee72..a9949bb00 100644
--- a/web/components/labels/project-setting-label-group.tsx
+++ b/web/components/labels/project-setting-label-group.tsx
@@ -6,7 +6,7 @@ import { Disclosure, Transition } from "@headlessui/react";
import { observer } from "mobx-react-lite";
import { useMobxStore } from "lib/mobx/store-provider";
// ui
-import { CustomMenu } from "components/ui";
+import { CustomMenu } from "@plane/ui";
// icons
import { ChevronDown, Component, Pencil, Plus, Trash2, X } from "lucide-react";
// types
diff --git a/web/components/labels/project-setting-label-list-item.tsx b/web/components/labels/project-setting-label-list-item.tsx
index 41b4a8cb7..1729a6d8b 100644
--- a/web/components/labels/project-setting-label-list-item.tsx
+++ b/web/components/labels/project-setting-label-list-item.tsx
@@ -3,7 +3,7 @@ import React, { useRef, useState } from "react";
//hook
import useOutsideClickDetector from "hooks/use-outside-click-detector";
// ui
-import { CustomMenu } from "components/ui";
+import { CustomMenu } from "@plane/ui";
// types
import { IIssueLabels } from "types";
//icons
diff --git a/web/components/project/members-select.tsx b/web/components/project/members-select.tsx
index b08e2ce00..457dd7d80 100644
--- a/web/components/project/members-select.tsx
+++ b/web/components/project/members-select.tsx
@@ -3,10 +3,8 @@ import { usePopper } from "react-popper";
import { Placement } from "@popperjs/core";
import { Combobox } from "@headlessui/react";
import { Check, ChevronDown, Search, User2 } from "lucide-react";
-// components
-import { Tooltip } from "components/ui";
// ui
-import { Avatar, AvatarGroup } from "@plane/ui";
+import { Avatar, AvatarGroup, Tooltip } from "@plane/ui";
// types
import { IUserLite } from "types";
diff --git a/web/components/project/priority-select.tsx b/web/components/project/priority-select.tsx
index 38a51ff6e..322938579 100644
--- a/web/components/project/priority-select.tsx
+++ b/web/components/project/priority-select.tsx
@@ -3,9 +3,7 @@ import { usePopper } from "react-popper";
import { Placement } from "@popperjs/core";
import { Combobox } from "@headlessui/react";
import { Check, ChevronDown, Search } from "lucide-react";
-import { PriorityIcon } from "@plane/ui";
-// components
-import { Tooltip } from "components/ui";
+import { PriorityIcon, Tooltip } from "@plane/ui";
// helpers
import { capitalizeFirstLetter } from "helpers/string.helper";
// types
diff --git a/web/components/states/create-state-modal.tsx b/web/components/states/create-state-modal.tsx
index c89937c07..46e36898d 100644
--- a/web/components/states/create-state-modal.tsx
+++ b/web/components/states/create-state-modal.tsx
@@ -10,8 +10,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
// hooks
import useToast from "hooks/use-toast";
// ui
-import { CustomSelect } from "components/ui";
-import { Button, Input, TextArea } from "@plane/ui";
+import { Button, CustomSelect, Input, TextArea } from "@plane/ui";
// icons
import { ChevronDown } from "lucide-react";
// types
diff --git a/web/components/states/create-update-state-inline.tsx b/web/components/states/create-update-state-inline.tsx
index 8c910daa4..15a268272 100644
--- a/web/components/states/create-update-state-inline.tsx
+++ b/web/components/states/create-update-state-inline.tsx
@@ -11,8 +11,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
// hooks
import useToast from "hooks/use-toast";
// ui
-import { CustomSelect } from "components/ui";
-import { Button, Input, Tooltip } from "@plane/ui";
+import { Button, CustomSelect, Input, Tooltip } from "@plane/ui";
// types
import type { IState } from "types";
// fetch-keys
diff --git a/web/components/states/state-select.tsx b/web/components/states/state-select.tsx
index b3765e767..8f1872f19 100644
--- a/web/components/states/state-select.tsx
+++ b/web/components/states/state-select.tsx
@@ -4,8 +4,7 @@ import { Placement } from "@popperjs/core";
import { Combobox } from "@headlessui/react";
import { Check, ChevronDown, Search } from "lucide-react";
// ui
-import { StateGroupIcon } from "@plane/ui";
-import { Tooltip } from "components/ui";
+import { StateGroupIcon, Tooltip } from "@plane/ui";
// types
import { IState } from "types";
diff --git a/web/components/ui/buttons/danger-button.tsx b/web/components/ui/buttons/danger-button.tsx
deleted file mode 100644
index 3adb7012b..000000000
--- a/web/components/ui/buttons/danger-button.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-// types
-import { ButtonProps } from "./type";
-
-export const DangerButton: React.FC = ({
- children,
- className = "",
- onClick,
- type = "button",
- disabled = false,
- loading = false,
- size = "sm",
- outline = false,
-}) => (
-
-);
diff --git a/web/components/ui/buttons/index.ts b/web/components/ui/buttons/index.ts
deleted file mode 100644
index 0ce5c556a..000000000
--- a/web/components/ui/buttons/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export * from "./danger-button";
-export * from "./primary-button";
-export * from "./secondary-button";
diff --git a/web/components/ui/buttons/primary-button.tsx b/web/components/ui/buttons/primary-button.tsx
deleted file mode 100644
index 8817679b4..000000000
--- a/web/components/ui/buttons/primary-button.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-// types
-import { ButtonProps } from "./type";
-
-export const PrimaryButton: React.FC = ({
- children,
- className = "",
- onClick,
- type = "button",
- disabled = false,
- loading = false,
- size = "sm",
- outline = false,
-}) => (
-
-);
diff --git a/web/components/ui/buttons/secondary-button.tsx b/web/components/ui/buttons/secondary-button.tsx
deleted file mode 100644
index a642dd65f..000000000
--- a/web/components/ui/buttons/secondary-button.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-// types
-import { ButtonProps } from "./type";
-
-export const SecondaryButton: React.FC = ({
- children,
- className = "",
- onClick,
- type = "button",
- disabled = false,
- loading = false,
- size = "sm",
- outline = false,
-}) => (
-
-);
diff --git a/web/components/ui/buttons/type.d.ts b/web/components/ui/buttons/type.d.ts
deleted file mode 100644
index b227887ef..000000000
--- a/web/components/ui/buttons/type.d.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-export type ButtonProps = {
- children: React.ReactNode;
- className?: string;
- onClick?: (e: any) => void;
- type?: "button" | "submit" | "reset";
- disabled?: boolean;
- loading?: boolean;
- size?: "sm" | "md" | "lg";
- outline?: boolean;
-};
diff --git a/web/components/ui/index.ts b/web/components/ui/index.ts
index 9aa134642..e92fbf6f8 100644
--- a/web/components/ui/index.ts
+++ b/web/components/ui/index.ts
@@ -1,4 +1,3 @@
-export * from "./buttons";
export * from "./dropdowns";
export * from "./graphs";
export * from "./input";
diff --git a/web/components/ui/multi-level-dropdown.tsx b/web/components/ui/multi-level-dropdown.tsx
index dfc743811..13ed5c29c 100644
--- a/web/components/ui/multi-level-dropdown.tsx
+++ b/web/components/ui/multi-level-dropdown.tsx
@@ -3,7 +3,7 @@ import { Fragment, useState } from "react";
// headless ui
import { Menu, Transition } from "@headlessui/react";
// ui
-import { Loader } from "components/ui";
+import { Loader } from "@plane/ui";
// icons
import { Check, ChevronDown, ChevronLeft, ChevronRight } from "lucide-react";
diff --git a/web/components/ui/product-updates-modal.tsx b/web/components/ui/product-updates-modal.tsx
index f5298be6e..4cd2bfc56 100644
--- a/web/components/ui/product-updates-modal.tsx
+++ b/web/components/ui/product-updates-modal.tsx
@@ -7,7 +7,8 @@ import { Dialog, Transition } from "@headlessui/react";
// services
import { WorkspaceService } from "services/workspace.service";
// components
-import { Loader, MarkdownRenderer } from "components/ui";
+import { MarkdownRenderer } from "components/ui";
+import { Loader } from "@plane/ui";
// icons
import { X } from "lucide-react";
// helpers
diff --git a/web/components/views/delete-view-modal.tsx b/web/components/views/delete-view-modal.tsx
index b4167e369..5d0f6bd96 100644
--- a/web/components/views/delete-view-modal.tsx
+++ b/web/components/views/delete-view-modal.tsx
@@ -8,7 +8,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
// hooks
import useToast from "hooks/use-toast";
// ui
-import { DangerButton, SecondaryButton } from "components/ui";
+import { Button } from "@plane/ui";
// icons
import { AlertTriangle } from "lucide-react";
// types
@@ -112,10 +112,12 @@ export const DeleteProjectViewModal: React.FC = observer((props) => {
- Cancel
-
+
+
+
diff --git a/web/components/views/form.tsx b/web/components/views/form.tsx
index 9ec5b16f7..55ccb2fee 100644
--- a/web/components/views/form.tsx
+++ b/web/components/views/form.tsx
@@ -7,7 +7,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
// components
import { AppliedFiltersList, FilterSelection, FiltersDropdown } from "components/issues";
// ui
-import { Input, PrimaryButton, SecondaryButton, TextArea } from "components/ui";
+import { Button, Input, TextArea } from "@plane/ui";
// types
import { IProjectView } from "types";
// constants
@@ -32,7 +32,6 @@ export const ProjectViewForm: React.FC = observer(({ handleFormSubmit, ha
control,
formState: { errors, isSubmitting },
handleSubmit,
- register,
reset,
setValue,
watch,
@@ -70,32 +69,45 @@ export const ProjectViewForm: React.FC = observer(({ handleFormSubmit, ha
{data ? "Update" : "Create"} View
-
Cancel
-
+
+
+
);
diff --git a/web/components/views/views-list.tsx b/web/components/views/views-list.tsx
index ef342eb4f..6a5a6705b 100644
--- a/web/components/views/views-list.tsx
+++ b/web/components/views/views-list.tsx
@@ -8,7 +8,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
import { ProjectViewListItem } from "components/views";
import { EmptyState } from "components/common";
// ui
-import { Input, Loader } from "components/ui";
+import { Input, Loader } from "@plane/ui";
// assets
import emptyView from "public/empty-state/view.svg";
// icons
@@ -48,7 +48,7 @@ export const ProjectViewsList = observer(() => {
value={query}
onChange={(e) => setQuery(e.target.value)}
placeholder="Search"
- mode="trueTransparent"
+ mode="true-transparent"
/>
diff --git a/web/components/views/workspace-dashboard.tsx b/web/components/views/workspace-dashboard.tsx
index ac887c0fe..5ed28b00b 100644
--- a/web/components/views/workspace-dashboard.tsx
+++ b/web/components/views/workspace-dashboard.tsx
@@ -9,7 +9,7 @@ import { useMobxStore } from "lib/mobx/store-provider";
import { TourRoot } from "components/onboarding";
import { UserGreetingsView } from "components/user";
import { CompletedIssuesGraph, IssuesList, IssuesPieChart, IssuesStats } from "components/workspace";
-import { PrimaryButton } from "components/ui";
+import { Button } from "@plane/ui";
// images
import emptyDashboard from "public/empty-state/dashboard.svg";
@@ -67,7 +67,9 @@ export const WorkspaceDashboardView = observer(() => {
Create a project
Manage your projects by creating issues, cycles, modules, views and pages.
-
{
const e = new KeyboardEvent("keydown", {
key: "p",
@@ -76,7 +78,7 @@ export const WorkspaceDashboardView = observer(() => {
}}
>
Create Project
-
+
diff --git a/web/layouts/auth-layout/workspace-wrapper.tsx b/web/layouts/auth-layout/workspace-wrapper.tsx
index 4950e4191..376fe2e28 100644
--- a/web/layouts/auth-layout/workspace-wrapper.tsx
+++ b/web/layouts/auth-layout/workspace-wrapper.tsx
@@ -4,7 +4,7 @@ import Link from "next/link";
import useSWR from "swr";
import { observer } from "mobx-react-lite";
// icons
-import { Spinner, PrimaryButton, SecondaryButton } from "components/ui";
+import { Button, Spinner } from "@plane/ui";
// hooks
import { useMobxStore } from "lib/mobx/store-provider";
@@ -67,12 +67,16 @@ export const WorkspaceAuthWrapper: FC
= observer((props)