Skip to content

Commit e216625

Browse files
irsyadadlirsyadadl
committed
mib
1 parent dde445d commit e216625

File tree

10 files changed

+85
-57
lines changed

10 files changed

+85
-57
lines changed

‎app/(app)/icons/partials/controller/install.tsx‎

Lines changed: 25 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
import React from "react"
22

3-
import { IconCheck, IconDuplicate } from "justd-icons"
3+
import {
4+
IconBrandBun,
5+
IconBrandNpm,
6+
IconBrandPnpm,
7+
IconBrandYarn,
8+
IconCheck,
9+
IconDuplicate
10+
} from "justd-icons"
411
import { Button, Menu } from "ui"
512
import { copyToClipboard } from "usemods"
613

@@ -34,16 +41,28 @@ export function Install() {
3441
<Button
3542
size="square-petite"
3643
appearance="outline"
37-
className="size-7 rounded-sm"
44+
className="size-7 rounded-md"
3845
aria-label="Copy npm command"
3946
>
4047
{isCopied ? <IconCheck /> : <IconDuplicate />}
4148
</Button>
4249
<Menu.Content showArrow placement="bottom end">
43-
<Menu.Item onAction={() => handleCopy("Bun")}>Bun</Menu.Item>
44-
<Menu.Item onAction={() => handleCopy("Yarn")}>Yarn</Menu.Item>
45-
<Menu.Item onAction={() => handleCopy("PNPM")}>PNPM</Menu.Item>
46-
<Menu.Item onAction={() => handleCopy("NPM")}>NPM</Menu.Item>
50+
<Menu.Item onAction={() => handleCopy("NPM")}>
51+
<IconBrandNpm />
52+
NPM
53+
</Menu.Item>
54+
<Menu.Item onAction={() => handleCopy("Bun")}>
55+
<IconBrandBun />
56+
Bun
57+
</Menu.Item>
58+
<Menu.Item onAction={() => handleCopy("Yarn")}>
59+
<IconBrandYarn />
60+
Yarn
61+
</Menu.Item>
62+
<Menu.Item onAction={() => handleCopy("PNPM")}>
63+
<IconBrandPnpm />
64+
PNPM
65+
</Menu.Item>
4766
</Menu.Content>
4867
</Menu>
4968
</div>

‎bun.lockb‎

0 Bytes
Binary file not shown.

‎components/docs/overlays/modal-triggered-by-menu-demo.tsx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import React from "react"
44

55
import { wait } from "@/resources/lib/utils"
66
import { IconDotsVertical } from "justd-icons"
7-
import { Button, buttonStyles, LoadingDots, Menu, Modal } from "ui"
7+
import { Button, buttonStyles, Loader, Menu, Modal } from "ui"
88

99
export default function ModalTriggeredByMenuDemo() {
1010
const [state, setState] = React.useState<string | null>(null)
@@ -56,7 +56,9 @@ export default function ModalTriggeredByMenuDemo() {
5656
</Menu.Trigger>
5757
<Menu.Content placement="bottom">
5858
<Menu.Item onAction={() => setState("delete")}>Delete</Menu.Item>
59-
<Menu.Item onAction={() => setState("ban")}>Ban</Menu.Item>
59+
<Menu.Item isDanger onAction={() => setState("ban")}>
60+
Ban
61+
</Menu.Item>
6062
<Menu.Item onAction={() => setState("restore")}>Restore</Menu.Item>
6163
</Menu.Content>
6264
</Menu>
@@ -68,8 +70,13 @@ export default function ModalTriggeredByMenuDemo() {
6870
</Modal.Header>
6971
<Modal.Footer>
7072
<Modal.Close>Cancel</Modal.Close>
71-
<Button className="min-w-24" isDisabled={loading} onPress={actionType(state)?.action}>
72-
{loading ? <LoadingDots className={"bg-fg"} /> : actionType(state)?.confirmText}
73+
<Button
74+
intent={state === "ban" ? "danger" : "primary"}
75+
className="min-w-24"
76+
isDisabled={loading}
77+
onPress={actionType(state)?.action}
78+
>
79+
{loading ? <Loader variant="spin" /> : actionType(state)?.confirmText}
7380
</Button>
7481
</Modal.Footer>
7582
</Modal.Content>

‎components/install-command.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -123,7 +123,7 @@ const InstallCommand: React.FC<InstallCommandProps> = ({
123123
{isInit || isDiff || isAdd ? (
124124
<CopyButton
125125
onPress={() => handleAction("NPM")}
126-
className="rounded-sm"
126+
className="rounded-md"
127127
ariaLabel={command}
128128
isCopied={isCopied}
129129
/>

‎components/ui/avatar.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -121,11 +121,11 @@ const avatarBadgeStyles = tv({
121121
large: "size-2.5 translate-x-[5%] translate-y-[5%]"
122122
},
123123
status: {
124-
away: "bg-red-500",
125-
online: "bg-green-500",
126-
offline: "bg-gray-500",
127-
dnd: "bg-yellow-500",
128-
idle: "bg-gray-500"
124+
away: "bg-danger",
125+
online: "bg-success",
126+
offline: "bg-muted-fg",
127+
dnd: "bg-warning",
128+
idle: "bg-muted-fg"
129129
}
130130
},
131131
defaultVariants: {

‎components/ui/table.tsx‎

Lines changed: 31 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -2,21 +2,21 @@
22

33
import { IconChevronDown, IconChevronUp, IconHamburger } from "justd-icons"
44
import type {
5-
CellProps as CellPrimitiveProps,
6-
ColumnProps as ColumnPrimitiveProps,
7-
RowProps as RowPrimitiveProps,
5+
CellProps,
6+
ColumnProps,
7+
RowProps,
88
TableBodyProps,
9-
TableHeaderProps as TableHeaderPrimitiveProps,
9+
TableHeaderProps,
1010
TableProps as TablePrimitiveProps
1111
} from "react-aria-components"
1212
import {
1313
Button,
14-
Cell as CellPrimitive,
14+
Cell,
1515
Collection,
16-
Column as ColumnPrimitive,
17-
Row as RowPrimitive,
16+
Column,
17+
Row,
1818
Table as TablePrimitive,
19-
TableBody as TableBodyPrimitive,
19+
TableBody,
2020
TableHeader,
2121
useTableOptions
2222
} from "react-aria-components"
@@ -51,25 +51,25 @@ const Table = ({ children, className, ...props }: TableProps) => (
5151
)
5252

5353
const Body = <T extends object>(props: TableBodyProps<T>) => (
54-
<TableBodyPrimitive {...props} className={cn("[&_.tr:last-child]:border-0")} />
54+
<TableBody {...props} className={cn("[&_.tr:last-child]:border-0")} />
5555
)
5656

57-
interface CellProps extends CellPrimitiveProps {
57+
interface TableCellProps extends CellProps {
5858
className?: string
5959
}
6060

61-
const Cell = ({ children, className, ...props }: CellProps) => (
62-
<CellPrimitive {...props} className={cell({ className })}>
61+
const TableCell = ({ children, className, ...props }: TableCellProps) => (
62+
<Cell {...props} className={cell({ className })}>
6363
{children}
64-
</CellPrimitive>
64+
</Cell>
6565
)
6666

67-
interface ColumnProps extends ColumnPrimitiveProps {
67+
interface TableColumnProps extends ColumnProps {
6868
className?: string
6969
}
7070

71-
const Column = ({ children, className, ...props }: ColumnProps) => (
72-
<ColumnPrimitive {...props} className={column({ className })}>
71+
const TableColumn = ({ children, className, ...props }: TableColumnProps) => (
72+
<Column {...props} className={column({ className })}>
7373
{({ allowsSorting, sortDirection }) => (
7474
<div className="flex [&>[data-slot=icon]]:shrink-0 items-center gap-2">
7575
<>
@@ -85,10 +85,10 @@ const Column = ({ children, className, ...props }: ColumnProps) => (
8585
</>
8686
</div>
8787
)}
88-
</ColumnPrimitive>
88+
</Column>
8989
)
9090

91-
interface HeaderProps<T extends object> extends TableHeaderPrimitiveProps<T> {
91+
interface HeaderProps<T extends object> extends TableHeaderProps<T> {
9292
className?: string
9393
}
9494

@@ -107,14 +107,20 @@ const Header = <T extends object>({ children, className, columns, ...props }: He
107107
)
108108
}
109109

110-
interface RowProps<T extends object> extends RowPrimitiveProps<T> {
110+
interface TableRow<T extends object> extends RowProps<T> {
111111
className?: string
112112
}
113113

114-
const Row = <T extends object>({ children, className, columns, id, ...props }: RowProps<T>) => {
114+
const TableRow = <T extends object>({
115+
children,
116+
className,
117+
columns,
118+
id,
119+
...props
120+
}: TableRow<T>) => {
115121
const { selectionBehavior, allowsDragging } = useTableOptions()
116122
return (
117-
<RowPrimitive
123+
<Row
118124
id={id}
119125
{...props}
120126
className={row({
@@ -141,14 +147,14 @@ const Row = <T extends object>({ children, className, columns, id, ...props }: R
141147
</Cell>
142148
)}
143149
<Collection items={columns}>{children}</Collection>
144-
</RowPrimitive>
150+
</Row>
145151
)
146152
}
147153

148154
Table.Body = Body
149-
Table.Cell = Cell
150-
Table.Column = Column
155+
Table.Cell = TableCell
156+
Table.Column = TableColumn
151157
Table.Header = Header
152-
Table.Row = Row
158+
Table.Row = TableRow
153159

154160
export { Table }

‎components/ui/tabs.tsx‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,9 @@ import { useId } from "react"
55
import { LayoutGroup, motion } from "framer-motion"
66
import {
77
Tab as TabPrimitive,
8-
TabList as TabListPrimitive,
8+
TabList,
99
type TabListProps,
10-
TabPanel as TabPanelPrimitive,
10+
TabPanel,
1111
type TabPanelProps,
1212
type TabProps,
1313
Tabs as TabsPrimitive,
@@ -52,11 +52,11 @@ const tabListStyles = tv({
5252
}
5353
})
5454

55-
const TabList = <T extends object>(props: TabListProps<T>) => {
55+
const List = <T extends object>(props: TabListProps<T>) => {
5656
const id = useId()
5757
return (
5858
<LayoutGroup id={id}>
59-
<TabListPrimitive
59+
<TabList
6060
{...props}
6161
className={cr(props.className, (className, renderProps) =>
6262
tabListStyles({ ...renderProps, className })
@@ -128,18 +128,19 @@ const tabPanelStyles = tv({
128128
}
129129
})
130130

131-
const TabPanel = (props: TabPanelProps) => {
131+
const Panel = (props: TabPanelProps) => {
132132
return (
133-
<TabPanelPrimitive
133+
<TabPanel
134134
{...props}
135135
className={cr(props.className, (className, renderProps) =>
136136
tabPanelStyles({ ...renderProps, className })
137137
)}
138138
/>
139139
)
140140
}
141-
Tabs.List = TabList
141+
142+
Tabs.List = List
142143
Tabs.Tab = Tab
143-
Tabs.Panel = TabPanel
144+
Tabs.Panel = Panel
144145

145146
export { Tabs }

‎components/ui/tag-group.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
import React from "react"
44

5-
import { IconPlus, IconX } from "justd-icons"
5+
import { IconX } from "justd-icons"
66
import type {
77
TagGroupProps as TagGroupPrimitiveProps,
88
TagListProps,

‎resources/content/docs/components/overlays/modal.mdx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -96,8 +96,8 @@ export function ModalAction(props: ModalActionProps) {
9696
</Modal.Header>
9797
<Modal.Footer>
9898
<Modal.Close>Cancel</Modal.Close>
99-
<Button className="min-w-24" isDisabled={props.loading} onPress={props.action}>
100-
{props.loading ? <LoadingDots className={'bg-fg'} /> : props.confirmText}
99+
<Button intent={state ==='ban' ? 'danger' : 'primary'} className="min-w-24" isDisabled={loading} onPress={actionType(state)?.action}>
100+
{loading ? <Loader variant="spin" /> : actionType(state)?.confirmText}
101101
</Button>
102102
</Modal.Footer>
103103
</Modal.Content>

‎resources/styles/app.css‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -134,11 +134,6 @@
134134
}
135135
}
136136

137-
.react-aria-Button,
138-
.react-aria-Dialog {
139-
outline: none;
140-
}
141-
142137
.react-aria-DropIndicator[data-drop-target] {
143138
outline: 1px solid hsl(var(--primary));
144139
}

0 commit comments

Comments
 (0)