refactor: actions icon migration (#8219)
* chore: gitignore updated * chore: check icon added to propel package * feat: search icon migration * chore: check icon migration * chore: plus icon added to propel package * chore: code refactor * chore: plus icon migration and code refactor * chore: trash icon added to propel package * chore: code refactor * chore: trash icon migration * chore: edit icon added to propel package * chore: new tab icon added to propel package * chore: edit icon migration * chore: newtab icon migration * chore: lock icon added to propel package * chore: lock icon migration * chore: globe icon added to propel package * chore: globe icon migration * chore: copy icon added to propel package * chore: copy icon migration * chore: link icon added to propel package * chore: link icon migration * chore: link icon migration * chore: info icon added to propel package * chore: code refactor * chore: code refactor * chore: code refactor * chore: code refactor
This commit is contained in:
parent
92ac28fcb8
commit
2980c2d76b
215 changed files with 932 additions and 729 deletions
|
|
@ -32,7 +32,6 @@ import {
|
|||
Camera,
|
||||
CameraOff,
|
||||
Cast,
|
||||
Check,
|
||||
CheckCircle,
|
||||
CheckSquare,
|
||||
Clipboard,
|
||||
|
|
@ -50,7 +49,6 @@ import {
|
|||
Columns,
|
||||
Command,
|
||||
Compass,
|
||||
Copy,
|
||||
CornerDownLeft,
|
||||
CornerDownRight,
|
||||
CornerLeftDown,
|
||||
|
|
@ -77,7 +75,6 @@ import {
|
|||
Edit,
|
||||
Edit2,
|
||||
Edit3,
|
||||
ExternalLink,
|
||||
Eye,
|
||||
EyeOff,
|
||||
Facebook,
|
||||
|
|
@ -103,7 +100,6 @@ import {
|
|||
GitPullRequest,
|
||||
Github,
|
||||
Gitlab,
|
||||
Globe,
|
||||
Grid,
|
||||
HardDrive,
|
||||
Hash,
|
||||
|
|
@ -121,12 +117,9 @@ import {
|
|||
Layers,
|
||||
Layout,
|
||||
LifeBuoy,
|
||||
Link,
|
||||
Link2,
|
||||
Linkedin,
|
||||
List,
|
||||
Loader,
|
||||
Lock,
|
||||
LogIn,
|
||||
LogOut,
|
||||
Mail,
|
||||
|
|
@ -148,10 +141,21 @@ import {
|
|||
CircleChevronDown,
|
||||
UsersRound,
|
||||
ToggleLeft,
|
||||
Search,
|
||||
User,
|
||||
} from "lucide-react";
|
||||
import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon } from "@plane/propel/icons";
|
||||
import {
|
||||
LinkIcon,
|
||||
CopyIcon,
|
||||
GlobeIcon,
|
||||
LockIcon,
|
||||
NewTabIcon,
|
||||
CheckIcon,
|
||||
SearchIcon,
|
||||
ChevronDownIcon,
|
||||
ChevronLeftIcon,
|
||||
ChevronRightIcon,
|
||||
ChevronUpIcon,
|
||||
} from "@plane/propel/icons";
|
||||
|
||||
export const MATERIAL_ICONS_LIST = [
|
||||
{
|
||||
|
|
@ -794,7 +798,7 @@ export const LUCIDE_ICONS_LIST = [
|
|||
{ name: "CameraOff", element: CameraOff },
|
||||
{ name: "Cast", element: Cast },
|
||||
{ name: "CircleChevronDown", element: CircleChevronDown },
|
||||
{ name: "Check", element: Check },
|
||||
{ name: "Check", element: CheckIcon },
|
||||
{ name: "CheckCircle", element: CheckCircle },
|
||||
{ name: "CheckSquare", element: CheckSquare },
|
||||
{ name: "ChevronDown", element: ChevronDownIcon },
|
||||
|
|
@ -816,7 +820,7 @@ export const LUCIDE_ICONS_LIST = [
|
|||
{ name: "Columns", element: Columns },
|
||||
{ name: "Command", element: Command },
|
||||
{ name: "Compass", element: Compass },
|
||||
{ name: "Copy", element: Copy },
|
||||
{ name: "Copy", element: CopyIcon },
|
||||
{ name: "CornerDownLeft", element: CornerDownLeft },
|
||||
{ name: "CornerDownRight", element: CornerDownRight },
|
||||
{ name: "CornerLeftDown", element: CornerLeftDown },
|
||||
|
|
@ -843,7 +847,7 @@ export const LUCIDE_ICONS_LIST = [
|
|||
{ name: "Edit", element: Edit },
|
||||
{ name: "Edit2", element: Edit2 },
|
||||
{ name: "Edit3", element: Edit3 },
|
||||
{ name: "ExternalLink", element: ExternalLink },
|
||||
{ name: "ExternalLink", element: NewTabIcon },
|
||||
{ name: "Eye", element: Eye },
|
||||
{ name: "EyeOff", element: EyeOff },
|
||||
{ name: "Facebook", element: Facebook },
|
||||
|
|
@ -869,7 +873,7 @@ export const LUCIDE_ICONS_LIST = [
|
|||
{ name: "GitPullRequest", element: GitPullRequest },
|
||||
{ name: "Github", element: Github },
|
||||
{ name: "Gitlab", element: Gitlab },
|
||||
{ name: "Globe", element: Globe },
|
||||
{ name: "Globe", element: GlobeIcon },
|
||||
{ name: "Grid", element: Grid },
|
||||
{ name: "HardDrive", element: HardDrive },
|
||||
{ name: "Hash", element: Hash },
|
||||
|
|
@ -887,12 +891,12 @@ export const LUCIDE_ICONS_LIST = [
|
|||
{ name: "Layers", element: Layers },
|
||||
{ name: "Layout", element: Layout },
|
||||
{ name: "LifeBuoy", element: LifeBuoy },
|
||||
{ name: "Link", element: Link },
|
||||
{ name: "Link2", element: Link2 },
|
||||
{ name: "Link", element: LinkIcon },
|
||||
{ name: "Link2", element: LinkIcon },
|
||||
{ name: "Linkedin", element: Linkedin },
|
||||
{ name: "List", element: List },
|
||||
{ name: "Loader", element: Loader },
|
||||
{ name: "Lock", element: Lock },
|
||||
{ name: "Lock", element: LockIcon },
|
||||
{ name: "LogIn", element: LogIn },
|
||||
{ name: "LogOut", element: LogOut },
|
||||
{ name: "Mail", element: Mail },
|
||||
|
|
@ -911,7 +915,7 @@ export const LUCIDE_ICONS_LIST = [
|
|||
{ name: "Minus", element: Minus },
|
||||
{ name: "MinusCircle", element: MinusCircle },
|
||||
{ name: "MinusSquare", element: MinusSquare },
|
||||
{ name: "Search", element: Search },
|
||||
{ name: "Search", element: SearchIcon },
|
||||
{ name: "ToggleLeft", element: ToggleLeft },
|
||||
{ name: "User", element: User },
|
||||
{ name: "UsersRound", element: UsersRound },
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
import { Combobox } from "@headlessui/react";
|
||||
import { Search } from "lucide-react";
|
||||
import type { FC } from "react";
|
||||
import React, { useEffect, useRef } from "react";
|
||||
import { SearchIcon } from "@plane/propel/icons";
|
||||
// helpers
|
||||
import { cn } from "../../utils";
|
||||
|
||||
|
|
@ -43,7 +42,7 @@ export function InputSearch(props: IInputSearch) {
|
|||
inputContainerClassName
|
||||
)}
|
||||
>
|
||||
{inputIcon ? <>{inputIcon}</> : <Search className="h-4 w-4 text-tertiary" aria-hidden="true" />}
|
||||
{inputIcon ? <>{inputIcon}</> : <SearchIcon className="h-4 w-4 text-tertiary" aria-hidden="true" />}
|
||||
<Combobox.Input
|
||||
as="input"
|
||||
ref={inputRef}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { Combobox } from "@headlessui/react";
|
||||
import { Check } from "lucide-react";
|
||||
|
||||
import React from "react";
|
||||
import { CheckIcon } from "@plane/propel/icons";
|
||||
// helpers
|
||||
import { cn } from "../../utils";
|
||||
// types
|
||||
|
|
@ -69,7 +70,7 @@ export function DropdownOptions(props: IMultiSelectDropdownOptions | ISingleSele
|
|||
) : (
|
||||
<>
|
||||
<span className="flex-grow truncate">{option.value}</span>
|
||||
{selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
|
||||
{selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import { Combobox } from "@headlessui/react";
|
||||
import { Check, Info, Search } from "lucide-react";
|
||||
import { Info } from "lucide-react";
|
||||
import React, { useRef, useState } from "react";
|
||||
import { createPortal } from "react-dom";
|
||||
import { usePopper } from "react-popper";
|
||||
import { useOutsideClickDetector } from "@plane/hooks";
|
||||
import { ChevronDownIcon } from "@plane/propel/icons";
|
||||
import { CheckIcon, SearchIcon, ChevronDownIcon } from "@plane/propel/icons";
|
||||
// plane imports
|
||||
// local imports
|
||||
import { Tooltip } from "@plane/propel/tooltip";
|
||||
|
|
@ -148,7 +148,7 @@ export function CustomSearchSelect(props: ICustomSearchSelectProps) {
|
|||
{...attributes.popper}
|
||||
>
|
||||
<div className="flex items-center gap-1.5 rounded-sm border border-subtle px-2 mx-2">
|
||||
<Search className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
|
||||
<SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
|
||||
<Combobox.Input
|
||||
className="w-full bg-transparent py-1 text-11 text-secondary placeholder:text-placeholder focus:outline-none"
|
||||
value={query}
|
||||
|
|
@ -190,7 +190,7 @@ export function CustomSearchSelect(props: ICustomSearchSelectProps) {
|
|||
{({ selected }) => (
|
||||
<>
|
||||
<span className="flex-grow truncate">{option.content}</span>
|
||||
{selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
|
||||
{selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
|
||||
{option.tooltip && (
|
||||
<>
|
||||
{typeof option.tooltip === "string" ? (
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
import { Combobox } from "@headlessui/react";
|
||||
import { Check } from "lucide-react";
|
||||
|
||||
import React, { createContext, useCallback, useContext, useRef, useState } from "react";
|
||||
import { createPortal } from "react-dom";
|
||||
import { usePopper } from "react-popper";
|
||||
import { useOutsideClickDetector } from "@plane/hooks";
|
||||
import { ChevronDownIcon } from "@plane/propel/icons";
|
||||
import { CheckIcon, ChevronDownIcon } from "@plane/propel/icons";
|
||||
// plane helpers
|
||||
// hooks
|
||||
import { useDropdownKeyDown } from "../hooks/use-dropdown-key-down";
|
||||
|
|
@ -172,7 +172,7 @@ function Option(props: ICustomSelectItemProps) {
|
|||
{({ selected }) => (
|
||||
<div className="flex items-center justify-between gap-2 w-full">
|
||||
{children}
|
||||
{selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
|
||||
{selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
|
||||
</div>
|
||||
)}
|
||||
</Combobox.Option>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue