mirror of
https://github.com/chillpadclub/bedolaga-cabinet.git
synced 2026-07-28 09:33:46 +00:00
style(cabinet-icons): use regular Phosphor weight and switch wheel to dice
- Drop the Duotone variants (their translucent secondary fill looked murky on the dark theme) in favour of the clean regular weight across all icons - WheelIcon: PiSteeringWheel → PiDiceFive (a steering wheel made no sense for the fortune-wheel feature)
This commit is contained in:
@@ -18,7 +18,7 @@ import {
|
||||
verticalListSortingStrategy,
|
||||
} from '@dnd-kit/sortable';
|
||||
import { CSS } from '@dnd-kit/utilities';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
import {
|
||||
GripIcon,
|
||||
TrashIcon,
|
||||
@@ -41,9 +41,7 @@ import { useNotify } from '../../platform/hooks/useNotify';
|
||||
import { useNativeDialog } from '../../platform/hooks/useNativeDialog';
|
||||
|
||||
const ChevronIcon = ({ expanded }: { expanded: boolean }) => (
|
||||
<PiCaretDownDuotone
|
||||
className={`h-3.5 w-3.5 transition-transform ${expanded ? 'rotate-180' : ''}`}
|
||||
/>
|
||||
<PiCaretDown className={`h-3.5 w-3.5 transition-transform ${expanded ? 'rotate-180' : ''}`} />
|
||||
);
|
||||
|
||||
function generateId(): string {
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useSortable } from '@dnd-kit/sortable';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
import { CSS } from '@dnd-kit/utilities';
|
||||
import { cn } from '../../lib/utils';
|
||||
import { GripIcon, TrashIcon } from '../icons/LandingIcons';
|
||||
@@ -11,7 +11,7 @@ import type { PaymentMethodSubOptionInfo } from '../../types';
|
||||
export type MethodWithId = AdminLandingPaymentMethod & { _id: string };
|
||||
|
||||
const ChevronDownIcon = ({ open }: { open: boolean }) => (
|
||||
<PiCaretDownDuotone className={cn('h-5 w-5 transition-transform', open && 'rotate-180')} />
|
||||
<PiCaretDown className={cn('h-5 w-5 transition-transform', open && 'rotate-180')} />
|
||||
);
|
||||
|
||||
interface SortableSelectedMethodProps {
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
// thin local wrapper over the panel's Phosphor caret icons.
|
||||
// ──────────────────────────────────────────────────────────────────
|
||||
|
||||
import { PiCaretDownDuotone, PiCaretUpDownDuotone, PiCaretUpDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown, PiCaretUpDown, PiCaretUp } from 'react-icons/pi';
|
||||
|
||||
export {
|
||||
CalendarIcon,
|
||||
@@ -27,9 +27,9 @@ export {
|
||||
|
||||
export const SortIcon = ({ direction }: { direction: false | 'asc' | 'desc' }) =>
|
||||
direction === 'asc' ? (
|
||||
<PiCaretUpDuotone className="ml-1 inline h-3 w-3" />
|
||||
<PiCaretUp className="ml-1 inline h-3 w-3" />
|
||||
) : direction === 'desc' ? (
|
||||
<PiCaretDownDuotone className="ml-1 inline h-3 w-3" />
|
||||
<PiCaretDown className="ml-1 inline h-3 w-3" />
|
||||
) : (
|
||||
<PiCaretUpDownDuotone className="ml-1 inline h-3 w-3" />
|
||||
<PiCaretUpDown className="ml-1 inline h-3 w-3" />
|
||||
);
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { PiCaretRightDuotone } from 'react-icons/pi';
|
||||
import { PiCaretRight } from 'react-icons/pi';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Link } from 'react-router';
|
||||
import { useCurrency } from '../../hooks/useCurrency';
|
||||
@@ -13,7 +13,7 @@ interface StatsGridProps {
|
||||
}
|
||||
|
||||
const ChevronIcon = ({ color }: { color: string }) => (
|
||||
<PiCaretRightDuotone width={16} height={16} style={{ flexShrink: 0, color }} aria-hidden="true" />
|
||||
<PiCaretRight width={16} height={16} style={{ flexShrink: 0, color }} aria-hidden="true" />
|
||||
);
|
||||
|
||||
export default function StatsGrid({
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
import {
|
||||
PiTextBDuotone,
|
||||
PiTextItalicDuotone,
|
||||
PiTextUnderlineDuotone,
|
||||
PiTextStrikethroughDuotone,
|
||||
PiTextHOneDuotone,
|
||||
PiTextHTwoDuotone,
|
||||
PiTextHThreeDuotone,
|
||||
PiListBulletsDuotone,
|
||||
PiListNumbersDuotone,
|
||||
PiQuotesDuotone,
|
||||
PiCodeBlockDuotone,
|
||||
PiTextAlignLeftDuotone,
|
||||
PiTextAlignCenterDuotone,
|
||||
PiHighlighterDuotone,
|
||||
PiTextB,
|
||||
PiTextItalic,
|
||||
PiTextUnderline,
|
||||
PiTextStrikethrough,
|
||||
PiTextHOne,
|
||||
PiTextHTwo,
|
||||
PiTextHThree,
|
||||
PiListBullets,
|
||||
PiListNumbers,
|
||||
PiQuotes,
|
||||
PiCodeBlock,
|
||||
PiTextAlignLeft,
|
||||
PiTextAlignCenter,
|
||||
PiHighlighter,
|
||||
} from 'react-icons/pi';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
@@ -22,64 +22,64 @@ interface IconProps {
|
||||
}
|
||||
|
||||
/**
|
||||
* Rich-text editor toolbar icons — Phosphor (react-icons/pi) Duotone, the
|
||||
* panel's icon family. Shared by the TipTap toolbars in AdminNewsCreate and
|
||||
* Rich-text editor toolbar icons — Phosphor (react-icons/pi), the panel's
|
||||
* icon family (regular weight). Shared by the TipTap toolbars in AdminNewsCreate and
|
||||
* AdminInfoPageEditor. Names match the historical local definitions so the
|
||||
* toolbars import instead of hand-rolling SVGs.
|
||||
*/
|
||||
|
||||
export const BoldIcon = ({ className }: IconProps) => (
|
||||
<PiTextBDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextB className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ItalicIcon = ({ className }: IconProps) => (
|
||||
<PiTextItalicDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextItalic className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const UnderlineIcon = ({ className }: IconProps) => (
|
||||
<PiTextUnderlineDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextUnderline className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StrikeIcon = ({ className }: IconProps) => (
|
||||
<PiTextStrikethroughDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextStrikethrough className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const H1Icon = ({ className }: IconProps) => (
|
||||
<PiTextHOneDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextHOne className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const H2Icon = ({ className }: IconProps) => (
|
||||
<PiTextHTwoDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextHTwo className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const H3Icon = ({ className }: IconProps) => (
|
||||
<PiTextHThreeDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextHThree className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ListBulletIcon = ({ className }: IconProps) => (
|
||||
<PiListBulletsDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiListBullets className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ListOrderedIcon = ({ className }: IconProps) => (
|
||||
<PiListNumbersDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiListNumbers className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const QuoteIcon = ({ className }: IconProps) => (
|
||||
<PiQuotesDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiQuotes className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CodeBlockIcon = ({ className }: IconProps) => (
|
||||
<PiCodeBlockDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCodeBlock className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const AlignLeftIcon = ({ className }: IconProps) => (
|
||||
<PiTextAlignLeftDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextAlignLeft className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const AlignCenterIcon = ({ className }: IconProps) => (
|
||||
<PiTextAlignCenterDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTextAlignCenter className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const HighlightIcon = ({ className }: IconProps) => (
|
||||
<PiHighlighterDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiHighlighter className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
@@ -1,76 +1,76 @@
|
||||
import {
|
||||
PiSlidersHorizontalDuotone,
|
||||
PiHeadsetDuotone,
|
||||
PiArrowDownDuotone,
|
||||
PiArrowRightDuotone,
|
||||
PiArrowUpDuotone,
|
||||
PiProhibitDuotone,
|
||||
PiMoneyDuotone,
|
||||
PiBellDuotone,
|
||||
PiLightningDuotone,
|
||||
PiRobotDuotone,
|
||||
PiBroadcastDuotone,
|
||||
PiAppWindowDuotone,
|
||||
PiCalendarDotsDuotone,
|
||||
PiCreditCardDuotone,
|
||||
PiChartBarDuotone,
|
||||
PiCheckCircleDuotone,
|
||||
PiCaretUpDownDuotone,
|
||||
PiCaretDownDuotone,
|
||||
PiCaretLeftDuotone,
|
||||
PiCaretUpDuotone,
|
||||
PiCurrencyBtcDuotone,
|
||||
PiDevicesDuotone,
|
||||
PiFileTextDuotone,
|
||||
PiSlidersHorizontal,
|
||||
PiHeadset,
|
||||
PiArrowDown,
|
||||
PiArrowRight,
|
||||
PiArrowUp,
|
||||
PiProhibit,
|
||||
PiMoney,
|
||||
PiBell,
|
||||
PiLightning,
|
||||
PiRobot,
|
||||
PiBroadcast,
|
||||
PiAppWindow,
|
||||
PiCalendarDots,
|
||||
PiCreditCard,
|
||||
PiChartBar,
|
||||
PiCheckCircle,
|
||||
PiCaretUpDown,
|
||||
PiCaretDown,
|
||||
PiCaretLeft,
|
||||
PiCaretUp,
|
||||
PiCurrencyBtc,
|
||||
PiDevices,
|
||||
PiFileText,
|
||||
PiCircleFill,
|
||||
PiEnvelopeDuotone,
|
||||
PiWarningDuotone,
|
||||
PiArrowSquareOutDuotone,
|
||||
PiEyeDuotone,
|
||||
PiFunnelDuotone,
|
||||
PiDotsSixDuotone,
|
||||
PiDotsSixVerticalDuotone,
|
||||
PiHeartbeatDuotone,
|
||||
PiClockCounterClockwiseDuotone,
|
||||
PiImageDuotone,
|
||||
PiInfinityDuotone,
|
||||
PiLinkDuotone,
|
||||
PiMegaphoneDuotone,
|
||||
PiMinusDuotone,
|
||||
PiNewspaperDuotone,
|
||||
PiHandshakeDuotone,
|
||||
PiPushPinDuotone,
|
||||
PiPlusDuotone,
|
||||
PiPowerDuotone,
|
||||
PiQuestionDuotone,
|
||||
PiRepeatDuotone,
|
||||
PiFlagDuotone,
|
||||
PiArrowCounterClockwiseDuotone,
|
||||
PiArrowClockwiseDuotone,
|
||||
PiRocketDuotone,
|
||||
PiFloppyDiskDuotone,
|
||||
PiPaperPlaneTiltDuotone,
|
||||
PiPercentDuotone,
|
||||
PiHardDrivesDuotone,
|
||||
PiGearSixDuotone,
|
||||
PiShareNetworkDuotone,
|
||||
PiSparkleDuotone,
|
||||
PiChartLineDuotone,
|
||||
PiGiftDuotone,
|
||||
PiTimerDuotone,
|
||||
PiCircleDuotone,
|
||||
PiTagDuotone,
|
||||
PiTelegramLogoDuotone,
|
||||
PiTicketDuotone,
|
||||
PiGaugeDuotone,
|
||||
PiTrashDuotone,
|
||||
PiTrophyDuotone,
|
||||
PiPushPinSlashDuotone,
|
||||
PiUserPlusDuotone,
|
||||
PiUsersThreeDuotone,
|
||||
PiVideoCameraDuotone,
|
||||
PiXCircleDuotone,
|
||||
PiXDuotone,
|
||||
PiEnvelope,
|
||||
PiWarning,
|
||||
PiArrowSquareOut,
|
||||
PiEye,
|
||||
PiFunnel,
|
||||
PiDotsSix,
|
||||
PiDotsSixVertical,
|
||||
PiHeartbeat,
|
||||
PiClockCounterClockwise,
|
||||
PiImage,
|
||||
PiInfinity,
|
||||
PiLink,
|
||||
PiMegaphone,
|
||||
PiMinus,
|
||||
PiNewspaper,
|
||||
PiHandshake,
|
||||
PiPushPin,
|
||||
PiPlus,
|
||||
PiPower,
|
||||
PiQuestion,
|
||||
PiRepeat,
|
||||
PiFlag,
|
||||
PiArrowCounterClockwise,
|
||||
PiArrowClockwise,
|
||||
PiRocket,
|
||||
PiFloppyDisk,
|
||||
PiPaperPlaneTilt,
|
||||
PiPercent,
|
||||
PiHardDrives,
|
||||
PiGearSix,
|
||||
PiShareNetwork,
|
||||
PiSparkle,
|
||||
PiChartLine,
|
||||
PiGift,
|
||||
PiTimer,
|
||||
PiCircle,
|
||||
PiTag,
|
||||
PiTelegramLogo,
|
||||
PiTicket,
|
||||
PiGauge,
|
||||
PiTrash,
|
||||
PiTrophy,
|
||||
PiPushPinSlash,
|
||||
PiUserPlus,
|
||||
PiUsersThree,
|
||||
PiVideoCamera,
|
||||
PiXCircle,
|
||||
PiX,
|
||||
} from 'react-icons/pi';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
@@ -80,106 +80,106 @@ interface IconProps {
|
||||
}
|
||||
|
||||
/**
|
||||
* Extended cabinet icon set — Phosphor (react-icons/pi) Duotone, the panel's
|
||||
* Extended cabinet icon set — Phosphor (react-icons/pi), the panel's
|
||||
* icon family. These cover the icons that used to be hand-written inline across
|
||||
* feature pages and components. Names match the historical local definitions so
|
||||
* every page can import from the central barrel instead of redefining SVGs.
|
||||
*/
|
||||
|
||||
export const AdjustmentsIcon = ({ className }: IconProps) => (
|
||||
<PiSlidersHorizontalDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiSlidersHorizontal className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const AgentIcon = ({ className }: IconProps) => (
|
||||
<PiHeadsetDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiHeadset className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ArrowDownIcon = ({ className }: IconProps) => (
|
||||
<PiArrowDownDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowDown className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ArrowIcon = ({ className }: IconProps) => (
|
||||
<PiArrowRightDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowRight className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ArrowUpIcon = ({ className }: IconProps) => (
|
||||
<PiArrowUpDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowUp className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const BanIcon = ({ className }: IconProps) => (
|
||||
<PiProhibitDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiProhibit className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const BanknotesIcon = ({ className }: IconProps) => (
|
||||
<PiMoneyDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiMoney className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const BellIcon = ({ className }: IconProps) => (
|
||||
<PiBellDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiBell className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const BoltIcon = ({ className }: IconProps) => (
|
||||
<PiLightningDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiLightning className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const BotIcon = ({ className }: IconProps) => (
|
||||
<PiRobotDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiRobot className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const BroadcastIcon = ({ className }: IconProps) => (
|
||||
<PiBroadcastDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiBroadcast className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CabinetIcon = ({ className }: IconProps) => (
|
||||
<PiAppWindowDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiAppWindow className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CalendarIcon = ({ className }: IconProps) => (
|
||||
<PiCalendarDotsDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCalendarDots className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CardIcon = ({ className }: IconProps) => (
|
||||
<PiCreditCardDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCreditCard className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChannelIcon = ({ className }: IconProps) => (
|
||||
<PiBroadcastDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiBroadcast className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChartBarIcon = ({ className }: IconProps) => (
|
||||
<PiChartBarDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiChartBar className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CheckCircleIcon = ({ className }: IconProps) => (
|
||||
<PiCheckCircleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCheckCircle className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChevronExpandIcon = ({ className }: IconProps) => (
|
||||
<PiCaretUpDownDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCaretUpDown className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChevronIcon = ({ className }: IconProps) => (
|
||||
<PiCaretDownDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCaretDown className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChevronLeftIcon = ({ className }: IconProps) => (
|
||||
<PiCaretLeftDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCaretLeft className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChevronUpIcon = ({ className }: IconProps) => (
|
||||
<PiCaretUpDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCaretUp className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CryptoIcon = ({ className }: IconProps) => (
|
||||
<PiCurrencyBtcDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCurrencyBtc className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const DevicesIcon = ({ className }: IconProps) => (
|
||||
<PiDevicesDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiDevices className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const DocumentIcon = ({ className }: IconProps) => (
|
||||
<PiFileTextDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiFileText className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const DotIcon = ({ className }: IconProps) => (
|
||||
@@ -187,229 +187,223 @@ export const DotIcon = ({ className }: IconProps) => (
|
||||
);
|
||||
|
||||
export const EmailIcon = ({ className }: IconProps) => (
|
||||
<PiEnvelopeDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiEnvelope className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ExclamationIcon = ({ className }: IconProps) => (
|
||||
<PiWarningDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiWarning className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ExternalLinkIcon = ({ className }: IconProps) => (
|
||||
<PiArrowSquareOutDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowSquareOut className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const EyeIcon = ({ className }: IconProps) => (
|
||||
<PiEyeDuotone className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
export const EyeIcon = ({ className }: IconProps) => <PiEye className={cn('h-5 w-5', className)} />;
|
||||
|
||||
export const FileTextIcon = ({ className }: IconProps) => (
|
||||
<PiFileTextDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiFileText className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const FilterIcon = ({ className }: IconProps) => (
|
||||
<PiFunnelDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiFunnel className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const GripIcon = ({ className }: IconProps) => (
|
||||
<PiDotsSixDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiDotsSix className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const GripVerticalIcon = ({ className }: IconProps) => (
|
||||
<PiDotsSixVerticalDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiDotsSixVertical className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const HealthIcon = ({ className }: IconProps) => (
|
||||
<PiHeartbeatDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiHeartbeat className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const HistoryIcon = ({ className }: IconProps) => (
|
||||
<PiClockCounterClockwiseDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiClockCounterClockwise className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ImageIcon = ({ className }: IconProps) => (
|
||||
<PiImageDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiImage className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const InfinityIcon = ({ className }: IconProps) => (
|
||||
<PiInfinityDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiInfinity className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const LinkIcon = ({ className }: IconProps) => (
|
||||
<PiLinkDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiLink className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const MailIcon = ({ className }: IconProps) => (
|
||||
<PiEnvelopeDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiEnvelope className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const MegaphoneIcon = ({ className }: IconProps) => (
|
||||
<PiMegaphoneDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiMegaphone className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const MinusIcon = ({ className }: IconProps) => (
|
||||
<PiMinusDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiMinus className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const NewsIcon = ({ className }: IconProps) => (
|
||||
<PiNewspaperDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiNewspaper className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PartnerIcon = ({ className }: IconProps) => (
|
||||
<PiHandshakeDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiHandshake className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PhotoIcon = ({ className }: IconProps) => (
|
||||
<PiImageDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiImage className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PercentIcon = ({ className }: IconProps) => (
|
||||
<PiPercentDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiPercent className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PinIcon = ({ className }: IconProps) => (
|
||||
<PiPushPinDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiPushPin className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PlusSmallIcon = ({ className }: IconProps) => (
|
||||
<PiPlusDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiPlus className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const PowerIcon = ({ className }: IconProps) => (
|
||||
<PiPowerDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiPower className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const QuestionIcon = ({ className }: IconProps) => (
|
||||
<PiQuestionDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiQuestion className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const RepeatIcon = ({ className }: IconProps) => (
|
||||
<PiRepeatDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiRepeat className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ReportIcon = ({ className }: IconProps) => (
|
||||
<PiFlagDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiFlag className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ResetIcon = ({ className }: IconProps) => (
|
||||
<PiArrowCounterClockwiseDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowCounterClockwise className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const RestartIcon = ({ className }: IconProps) => (
|
||||
<PiArrowClockwiseDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowClockwise className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const RocketIcon = ({ className }: IconProps) => (
|
||||
<PiRocketDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiRocket className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const SaveIcon = ({ className }: IconProps) => (
|
||||
<PiFloppyDiskDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiFloppyDisk className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const SendIcon = ({ className }: IconProps) => (
|
||||
<PiPaperPlaneTiltDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiPaperPlaneTilt className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ServerSmallIcon = ({ className }: IconProps) => (
|
||||
<PiHardDrivesDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiHardDrives className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const SettingsIcon = ({ className }: IconProps) => (
|
||||
<PiGearSixDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiGearSix className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ShareIcon = ({ className }: IconProps) => (
|
||||
<PiShareNetworkDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiShareNetwork className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const SparklesIcon = ({ className }: IconProps) => (
|
||||
<PiSparkleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiSparkle className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StatBotIcon = ({ className }: IconProps) => (
|
||||
<PiRobotDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiRobot className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StatCabinetIcon = ({ className }: IconProps) => (
|
||||
<PiAppWindowDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiAppWindow className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StatPaidIcon = ({ className }: IconProps) => (
|
||||
<PiMoneyDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiMoney className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StatsChartIcon = ({ className }: IconProps) => (
|
||||
<PiChartLineDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiChartLine className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StatTrialIcon = ({ className }: IconProps) => (
|
||||
<PiGiftDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiGift className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StatUptimeIcon = ({ className }: IconProps) => (
|
||||
<PiTimerDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTimer className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StatusIcon = ({ className }: IconProps) => (
|
||||
<PiCircleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCircle className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const TagIcon = ({ className }: IconProps) => (
|
||||
<PiTagDuotone className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
export const TagIcon = ({ className }: IconProps) => <PiTag className={cn('h-5 w-5', className)} />;
|
||||
|
||||
export const TelegramIcon = ({ className }: IconProps) => (
|
||||
<PiTelegramLogoDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTelegramLogo className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const TelegramSmallIcon = ({ className }: IconProps) => (
|
||||
<PiTelegramLogoDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiTelegramLogo className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const TicketIcon = ({ className }: IconProps) => (
|
||||
<PiTicketDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTicket className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const TrafficIcon = ({ className }: IconProps) => (
|
||||
<PiGaugeDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiGauge className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const TrashSmallIcon = ({ className }: IconProps) => (
|
||||
<PiTrashDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiTrash className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const TrophyIcon = ({ className }: IconProps) => (
|
||||
<PiTrophyDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTrophy className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const UnpinIcon = ({ className }: IconProps) => (
|
||||
<PiPushPinSlashDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiPushPinSlash className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const UserPlusIcon = ({ className }: IconProps) => (
|
||||
<PiUserPlusDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiUserPlus className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const UsersOnlineIcon = ({ className }: IconProps) => (
|
||||
<PiUsersThreeDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiUsersThree className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const VideoIcon = ({ className }: IconProps) => (
|
||||
<PiVideoCameraDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiVideoCamera className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const WarningIcon = ({ className }: IconProps) => (
|
||||
<PiWarningDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiWarning className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const XCircleIcon = ({ className }: IconProps) => (
|
||||
<PiXCircleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiXCircle className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const XCloseIcon = ({ className }: IconProps) => (
|
||||
<PiXDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiX className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const XMarkIcon = ({ className }: IconProps) => (
|
||||
<PiXDuotone className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
export const XMarkIcon = ({ className }: IconProps) => <PiX className={cn('h-5 w-5', className)} />;
|
||||
|
||||
@@ -1,50 +1,50 @@
|
||||
import type { CSSProperties } from 'react';
|
||||
import {
|
||||
PiArrowLeftDuotone,
|
||||
PiArrowRightDuotone,
|
||||
PiArrowsClockwiseDuotone,
|
||||
PiCaretDownDuotone,
|
||||
PiCaretRightDuotone,
|
||||
PiChartBarDuotone,
|
||||
PiChatCircleDuotone,
|
||||
PiCheckDuotone,
|
||||
PiClipboardTextDuotone,
|
||||
PiClockDuotone,
|
||||
PiCopyDuotone,
|
||||
PiCreditCardDuotone,
|
||||
PiDownloadSimpleDuotone,
|
||||
PiGameControllerDuotone,
|
||||
PiGearSixDuotone,
|
||||
PiGiftDuotone,
|
||||
PiGlobeDuotone,
|
||||
PiHardDrivesDuotone,
|
||||
PiHouseDuotone,
|
||||
PiInfoDuotone,
|
||||
PiListDuotone,
|
||||
PiLockDuotone,
|
||||
PiMagnifyingGlassDuotone,
|
||||
PiMegaphoneDuotone,
|
||||
PiMoonDuotone,
|
||||
PiPaletteDuotone,
|
||||
PiPauseCircleDuotone,
|
||||
PiPencilDuotone,
|
||||
PiPencilSimpleDuotone,
|
||||
PiPlayDuotone,
|
||||
PiPlusDuotone,
|
||||
PiShieldDuotone,
|
||||
PiSignOutDuotone,
|
||||
PiSparkleDuotone,
|
||||
PiStarDuotone,
|
||||
PiArrowLeft,
|
||||
PiArrowRight,
|
||||
PiArrowsClockwise,
|
||||
PiCaretDown,
|
||||
PiCaretRight,
|
||||
PiChartBar,
|
||||
PiChatCircle,
|
||||
PiCheck,
|
||||
PiClipboardText,
|
||||
PiClock,
|
||||
PiCopy,
|
||||
PiCreditCard,
|
||||
PiDownloadSimple,
|
||||
PiGameController,
|
||||
PiGearSix,
|
||||
PiGift,
|
||||
PiGlobe,
|
||||
PiHardDrives,
|
||||
PiHouse,
|
||||
PiInfo,
|
||||
PiList,
|
||||
PiLock,
|
||||
PiMagnifyingGlass,
|
||||
PiMegaphone,
|
||||
PiMoon,
|
||||
PiPalette,
|
||||
PiPauseCircle,
|
||||
PiPencil,
|
||||
PiPencilSimple,
|
||||
PiPlay,
|
||||
PiPlus,
|
||||
PiShield,
|
||||
PiSignOut,
|
||||
PiSparkle,
|
||||
PiStar,
|
||||
PiStarFill,
|
||||
PiSteeringWheelDuotone,
|
||||
PiStopDuotone,
|
||||
PiSunDuotone,
|
||||
PiTrashDuotone,
|
||||
PiUploadSimpleDuotone,
|
||||
PiUserDuotone,
|
||||
PiUsersDuotone,
|
||||
PiWalletDuotone,
|
||||
PiXDuotone,
|
||||
PiDiceFive,
|
||||
PiStop,
|
||||
PiSun,
|
||||
PiTrash,
|
||||
PiUploadSimple,
|
||||
PiUser,
|
||||
PiUsers,
|
||||
PiWallet,
|
||||
PiX,
|
||||
} from 'react-icons/pi';
|
||||
|
||||
import { cn } from '@/lib/utils';
|
||||
@@ -60,7 +60,7 @@ interface IconProps {
|
||||
|
||||
/**
|
||||
* Cabinet icons are thin wrappers over the Remnawave panel's own icon library
|
||||
* (Phosphor, via `react-icons/pi`, Duotone variants). Each export keeps the
|
||||
* (Phosphor, via `react-icons/pi`, regular weight). Each export keeps the
|
||||
* historical name + default Tailwind sizing so every consumer keeps working,
|
||||
* while the cabinet now renders the exact icon set the panel uses instead of
|
||||
* hand-written SVGs.
|
||||
@@ -71,174 +71,168 @@ interface IconProps {
|
||||
|
||||
// Navigation & Layout
|
||||
export const HomeIcon = ({ className }: IconProps) => (
|
||||
<PiHouseDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiHouse className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const BackIcon = ({ className }: IconProps) => (
|
||||
<PiArrowLeftDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowLeft className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChevronRightIcon = ({ className }: IconProps) => (
|
||||
<PiCaretRightDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCaretRight className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const MenuIcon = ({ className }: IconProps) => (
|
||||
<PiListDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiList className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CloseIcon = ({ className }: IconProps) => (
|
||||
<PiXDuotone className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
export const CloseIcon = ({ className }: IconProps) => <PiX className={cn('h-5 w-5', className)} />;
|
||||
|
||||
export const ChevronDownIcon = ({ className }: IconProps) => (
|
||||
<PiCaretDownDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCaretDown className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ArrowRightIcon = ({ className }: IconProps) => (
|
||||
<PiArrowRightDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowRight className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
// Actions
|
||||
export const SearchIcon = ({ className }: IconProps) => (
|
||||
<PiMagnifyingGlassDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiMagnifyingGlass className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PlusIcon = ({ className }: IconProps) => (
|
||||
<PiPlusDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiPlus className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const EditIcon = ({ className }: IconProps) => (
|
||||
<PiPencilSimpleDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiPencilSimple className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const PencilIcon = ({ className }: IconProps) => (
|
||||
<PiPencilDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiPencil className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const TrashIcon = ({ className }: IconProps) => (
|
||||
<PiTrashDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiTrash className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const UploadIcon = ({ className }: IconProps) => (
|
||||
<PiUploadSimpleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiUploadSimple className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const DownloadIcon = ({ className }: IconProps) => (
|
||||
<PiDownloadSimpleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiDownloadSimple className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const RefreshIcon = ({
|
||||
className,
|
||||
spinning = false,
|
||||
}: IconProps & { spinning?: boolean }) => (
|
||||
<PiArrowsClockwiseDuotone className={cn('h-4 w-4', spinning && 'animate-spin', className)} />
|
||||
<PiArrowsClockwise className={cn('h-4 w-4', spinning && 'animate-spin', className)} />
|
||||
);
|
||||
|
||||
export const SyncIcon = ({ className }: IconProps) => (
|
||||
<PiArrowsClockwiseDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiArrowsClockwise className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
// Status
|
||||
export const CheckIcon = ({ className }: IconProps) => (
|
||||
<PiCheckDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiCheck className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const CopyIcon = ({ className }: IconProps) => (
|
||||
<PiCopyDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiCopy className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const XIcon = ({ className }: IconProps) => (
|
||||
<PiXDuotone className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
export const XIcon = ({ className }: IconProps) => <PiX className={cn('h-4 w-4', className)} />;
|
||||
|
||||
export const LockIcon = ({ className }: IconProps) => (
|
||||
<PiLockDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiLock className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const InfoIcon = ({ className }: IconProps) => (
|
||||
<PiInfoDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiInfo className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
// User & People
|
||||
export const UserIcon = ({ className }: IconProps) => (
|
||||
<PiUserDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiUser className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const UsersIcon = ({ className }: IconProps) => (
|
||||
<PiUsersDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiUsers className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const LogoutIcon = ({ className }: IconProps) => (
|
||||
<PiSignOutDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiSignOut className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
// Theme
|
||||
export const SunIcon = ({ className }: IconProps) => (
|
||||
<PiSunDuotone className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
export const SunIcon = ({ className }: IconProps) => <PiSun className={cn('h-5 w-5', className)} />;
|
||||
|
||||
export const MoonIcon = ({ className }: IconProps) => (
|
||||
<PiMoonDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiMoon className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PaletteIcon = ({ className }: IconProps) => (
|
||||
<PiPaletteDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiPalette className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
// Features & Content
|
||||
export const SubscriptionIcon = ({ className }: IconProps) => (
|
||||
<PiSparkleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiSparkle className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const WalletIcon = ({ className }: IconProps) => (
|
||||
<PiWalletDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiWallet className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ChatIcon = ({ className }: IconProps) => (
|
||||
<PiChatCircleDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiChatCircle className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const GiftIcon = ({ className }: IconProps) => (
|
||||
<PiGiftDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiGift className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const ClockIcon = ({ className }: IconProps) => (
|
||||
<PiClockDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiClock className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const StarIcon = ({ className, filled }: IconProps & { filled?: boolean }) =>
|
||||
filled ? (
|
||||
<PiStarFill className={cn('h-5 w-5', className)} />
|
||||
) : (
|
||||
<PiStarDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiStar className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const GamepadIcon = ({ className }: IconProps) => (
|
||||
<PiGameControllerDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiGameController className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ClipboardIcon = ({ className }: IconProps) => (
|
||||
<PiClipboardTextDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiClipboardText className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CogIcon = ({ className }: IconProps) => (
|
||||
<PiGearSixDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiGearSix className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const WheelIcon = ({ className }: IconProps) => (
|
||||
<PiSteeringWheelDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiDiceFive className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ShieldIcon = ({ className }: IconProps) => (
|
||||
<PiShieldDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiShield className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const ServerIcon = ({ className }: IconProps) => (
|
||||
<PiHardDrivesDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiHardDrives className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const CampaignIcon = ({ className }: IconProps) => (
|
||||
<PiMegaphoneDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiMegaphone className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
// Brand mark — the genuine Remnawave panel logo (kept as-is, this is the
|
||||
@@ -260,29 +254,29 @@ export const RemnawaveIcon = ({ className }: IconProps) => (
|
||||
);
|
||||
|
||||
export const ChartIcon = ({ className }: IconProps) => (
|
||||
<PiChartBarDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiChartBar className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const GlobeIcon = ({ className }: IconProps) => (
|
||||
<PiGlobeDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiGlobe className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
export const PlayIcon = ({ className }: IconProps) => (
|
||||
<PiPlayDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiPlay className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const StopIcon = ({ className }: IconProps) => (
|
||||
<PiStopDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiStop className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const ArrowPathIcon = ({ className }: IconProps) => (
|
||||
<PiArrowsClockwiseDuotone className={cn('h-4 w-4', className)} />
|
||||
<PiArrowsClockwise className={cn('h-4 w-4', className)} />
|
||||
);
|
||||
|
||||
export const PauseIcon = ({ className, style }: IconProps & { style?: CSSProperties }) => (
|
||||
<PiPauseCircleDuotone className={cn('h-5 w-5', className)} style={style} />
|
||||
<PiPauseCircle className={cn('h-5 w-5', className)} style={style} />
|
||||
);
|
||||
|
||||
export const CreditCardIcon = ({ className }: IconProps) => (
|
||||
<PiCreditCardDuotone className={cn('h-5 w-5', className)} />
|
||||
<PiCreditCard className={cn('h-5 w-5', className)} />
|
||||
);
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { useCallback, useEffect, useRef, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
|
||||
import { CheckIcon, CopyIcon } from '@/components/icons';
|
||||
import type { PartnerCampaignInfo } from '../../api/partners';
|
||||
@@ -12,7 +12,7 @@ import { CampaignDetailStats } from './CampaignDetailStats';
|
||||
import { StatCard } from '../stats/StatCard';
|
||||
|
||||
const ChevronIcon = ({ expanded }: { expanded: boolean }) => (
|
||||
<PiCaretDownDuotone className={`h-5 w-5 transition-transform ${expanded ? 'rotate-180' : ''}`} />
|
||||
<PiCaretDown className={`h-5 w-5 transition-transform ${expanded ? 'rotate-180' : ''}`} />
|
||||
);
|
||||
|
||||
interface CampaignCardProps {
|
||||
|
||||
@@ -20,7 +20,7 @@ import {
|
||||
type BulkActionType,
|
||||
type BulkActionParams,
|
||||
} from '../api/adminBulkActions';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
import { usePlatform } from '../platform/hooks/usePlatform';
|
||||
import { useCurrency } from '../hooks/useCurrency';
|
||||
import { cn } from '@/lib/utils';
|
||||
@@ -56,7 +56,7 @@ type SubscriptionStatusFilter = '' | 'active' | 'expired' | 'trial' | 'limited'
|
||||
// className-only API), so it stays local as a thin wrapper over the panel's
|
||||
// Phosphor caret, preserving the rotate-on-expand behavior.
|
||||
const ChevronExpandIcon = ({ expanded }: { expanded: boolean }) => (
|
||||
<PiCaretDownDuotone
|
||||
<PiCaretDown
|
||||
className={cn('h-4 w-4 text-white transition-transform duration-200', expanded && 'rotate-180')}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { useState, useCallback, useEffect, useRef, useMemo } from 'react';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
import { useNavigate, useParams } from 'react-router';
|
||||
import { useQuery, useQueries, useMutation, useQueryClient } from '@tanstack/react-query';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
@@ -53,7 +53,7 @@ function isoToDatetimeLocal(iso: string): string {
|
||||
}
|
||||
|
||||
const ChevronDownIcon = ({ open }: { open: boolean }) => (
|
||||
<PiCaretDownDuotone className={cn('h-5 w-5 transition-transform', open && 'rotate-180')} />
|
||||
<PiCaretDown className={cn('h-5 w-5 transition-transform', open && 'rotate-180')} />
|
||||
);
|
||||
|
||||
// ============ Collapsible Section ============
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { useState, useMemo, useCallback, useRef, useEffect } from 'react';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
import DOMPurify from 'dompurify';
|
||||
import { infoApi, FaqPage } from '../api/info';
|
||||
import { infoPagesApi } from '../api/infoPages';
|
||||
@@ -10,7 +10,7 @@ import type { FaqItem, ReplacesTab } from '../api/infoPages';
|
||||
import { DocumentIcon, InfoIcon, QuestionIcon, ShieldIcon, StarIcon } from '@/components/icons';
|
||||
|
||||
const ChevronIcon = ({ expanded }: { expanded: boolean }) => (
|
||||
<PiCaretDownDuotone className={`h-5 w-5 transition-transform ${expanded ? 'rotate-180' : ''}`} />
|
||||
<PiCaretDown className={`h-5 w-5 transition-transform ${expanded ? 'rotate-180' : ''}`} />
|
||||
);
|
||||
|
||||
const BUILTIN_TABS = new Set<string>(['faq', 'rules', 'privacy', 'offer', 'loyalty']);
|
||||
|
||||
@@ -3,7 +3,7 @@ import { useParams, useNavigate } from 'react-router';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
import DOMPurify from 'dompurify';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
import { BackIcon, SearchIcon } from '@/components/icons';
|
||||
import { infoPagesApi } from '../api/infoPages';
|
||||
import { usePlatform } from '../platform/hooks/usePlatform';
|
||||
@@ -160,7 +160,7 @@ function sanitizeHtml(html: string): string {
|
||||
|
||||
// --- FAQ Accordion ---
|
||||
const ChevronIcon = ({ open }: { open: boolean }) => (
|
||||
<PiCaretDownDuotone
|
||||
<PiCaretDown
|
||||
className={`h-5 w-5 text-dark-400 transition-transform duration-300 ${open ? 'rotate-180' : ''}`}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -10,13 +10,13 @@ import { Card } from '@/components/data-display/Card/Card';
|
||||
import { Button } from '@/components/primitives/Button/Button';
|
||||
import { motion, AnimatePresence } from 'framer-motion';
|
||||
import { staggerContainer, staggerItem } from '@/components/motion/transitions';
|
||||
import { PiCaretDownDuotone } from 'react-icons/pi';
|
||||
import { PiCaretDown } from 'react-icons/pi';
|
||||
import { StarIcon, CalendarIcon, HistoryIcon, CloseIcon } from '@/components/icons';
|
||||
import { cn } from '@/lib/utils';
|
||||
|
||||
// Icons
|
||||
const ChevronIcon = ({ expanded }: { expanded: boolean }) => (
|
||||
<PiCaretDownDuotone
|
||||
<PiCaretDown
|
||||
className={cn('h-5 w-5 transition-transform duration-200', expanded && 'rotate-180')}
|
||||
/>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user