@1d1s/design-system 0.2.0 → 0.2.1

package/dist/components/AppHeader/AppHeader.d.ts

@@ -9,11 +9,11 @@ export interface AppHeaderProps {
     logo?: React.ReactNode;
     navItems?: AppHeaderNavItem[];
     activeKey?: string;
+    showProfile?: boolean;
     profileImage?: string;
     className?: string;
     onLogoClick?(): void;
     onNavChange?(key: string): void;
-    onSearchClick?(): void;
     onNotificationClick?(): void;
     onProfileClick?(): void;
 }
@@ -21,4 +21,4 @@ export interface AppHeaderProps {
  * AppHeader
  * 로고, 주요 네비게이션, 우측 액션 아이콘을 포함한 상단 헤더 컴포넌트.
  */
-export declare function AppHeader({ brandName, logo, navItems, activeKey, profileImage, className, onLogoClick, onNavChange, onSearchClick, onNotificationClick, onProfileClick, }: AppHeaderProps): React.ReactElement;
+export declare function AppHeader({ brandName, logo, navItems, activeKey, showProfile, profileImage, className, onLogoClick, onNavChange, onNotificationClick, onProfileClick, }: AppHeaderProps): React.ReactElement;

package/dist/components/AppHeader/AppHeader.stories.d.ts

@@ -3,4 +3,5 @@ import { AppHeader } from './AppHeader';
 declare const meta: Meta<typeof AppHeader>;
 export default meta;
 type Story = StoryObj<typeof AppHeader>;
-export declare const Default: Story;
+export declare const WithProfile: Story;
+export declare const WithoutProfile: Story;

package/dist/components/Calendar/Calendar.stories.d.ts

@@ -4,3 +4,4 @@ declare const meta: Meta<typeof Calendar>;
 export default meta;
 type Story = StoryObj<typeof Calendar>;
 export declare const Default: Story;
+export declare const Range: Story;

package/dist/components/Icons/Check.d.ts

@@ -1,2 +1,2 @@
 import { default as React } from 'react';
-export declare const Check: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const Check: ({ strokeWidth, ...props }: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/Dumbbell.d.ts

@@ -0,0 +1,2 @@
+import { default as React } from 'react';
+export declare const Dumbbell: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/Flag.d.ts

@@ -0,0 +1,2 @@
+import { default as React } from 'react';
+export declare const Flag: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/Flame.d.ts

@@ -0,0 +1,2 @@
+import { default as React } from 'react';
+export declare const Flame: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/Icon.d.ts

@@ -0,0 +1,43 @@
+import { default as React } from 'react';
+declare const iconComponents: {
+    readonly AddCircle: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Calendar: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Check: ({ strokeWidth, ...props }: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Chevron: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly ChevronDown: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly ChevronLeft: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly ChevronRight: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly ChevronUp: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Close: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Dumbbell: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Endless: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Eye: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly EyeOff: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Flag: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Flame: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly HamburgerMenu: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Heart: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly HeartFilled: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Laptop: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Logo: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Minus: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly People: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Person: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Pin: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Plus: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Search: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Target: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+    readonly Trophy: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+};
+export type IconName = keyof typeof iconComponents;
+export declare const ICON_NAMES: IconName[];
+export interface IconProps extends Omit<React.SVGProps<SVGSVGElement>, "name"> {
+    name: IconName;
+    size?: number | string;
+}
+/**
+ * Icon
+ * name 기반으로 프로젝트 아이콘을 렌더링하는 공통 아이콘 컴포넌트.
+ */
+export declare function Icon({ name, size, width, height, ...props }: IconProps): React.ReactElement;
+export {};

package/dist/components/Icons/Laptop.d.ts

@@ -0,0 +1,2 @@
+import { default as React } from 'react';
+export declare const Laptop: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/Target.d.ts

@@ -0,0 +1,2 @@
+import { default as React } from 'react';
+export declare const Target: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/Trophy.d.ts

@@ -0,0 +1,2 @@
+import { default as React } from 'react';
+export declare const Trophy: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/index.d.ts

@@ -1,11 +1,12 @@
 export * from './AddCircle';
 export * from './Calendar';
-export * from './ChallengeDumbbell';
-export * from './ChallengeFlag';
-export * from './ChallengeFlame';
-export * from './ChallengeLaptop';
-export * from './ChallengeTarget';
-export * from './ChallengeTrophy';
+export * from './Dumbbell';
+export * from './Flag';
+export * from './Flame';
+export * from './Icon';
+export * from './Laptop';
+export * from './Target';
+export * from './Trophy';
 export * from './Check';
 export * from './Chevron';
 export * from './ChevronDown';

package/dist/components/ProgressBar/ProgressBar.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+export interface ProgressBarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
+    value: number;
+    label?: React.ReactNode;
+    showLabel?: boolean;
+    showValueText?: boolean;
+    valueText?: React.ReactNode;
+    infinite?: boolean;
+    thickness?: number;
+    fillColor?: string;
+    trackColor?: string;
+    labelClassName?: string;
+    valueClassName?: string;
+    trackClassName?: string;
+    fillClassName?: string;
+}
+/**
+ * ProgressBar
+ * 라벨/퍼센트 텍스트/두께/색상을 유연하게 제어할 수 있는 진행률 바 컴포넌트.
+ */
+export declare function ProgressBar({ value, label, showLabel, showValueText, valueText, infinite, thickness, fillColor, trackColor, className, labelClassName, valueClassName, trackClassName, fillClassName, ...props }: ProgressBarProps): React.ReactElement;

package/dist/components/ProgressBar/ProgressBar.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { ProgressBar } from './ProgressBar';
+declare const meta: Meta<typeof ProgressBar>;
+export default meta;
+type Story = StoryObj<typeof ProgressBar>;
+export declare const Default: Story;
+export declare const WithoutLabel: Story;
+export declare const WithoutValueText: Story;
+export declare const CustomThickness: Story;
+export declare const CustomColor: Story;
+export declare const Infinite: Story;

package/dist/components/ProgressBar/index.d.ts

@@ -0,0 +1 @@
+export * from './ProgressBar';

package/dist/components/RightSidebar/RightSidebar.d.ts

@@ -1,11 +1,11 @@
 import { default as React } from 'react';
-type ChallengeTone = "blue" | "green" | "orange";
+type RightSidebarProgressTone = "blue" | "green" | "orange";
 export interface RightSidebarChallenge {
     id: string;
     title: string;
     progress: number;
     hasDeadline?: boolean;
-    tone?: ChallengeTone;
+    tone?: RightSidebarProgressTone;
 }
 export interface RightSidebarProps {
     userName: string;

package/dist/components/StatContainer/StatContainer.d.ts

@@ -1,6 +1,8 @@
 import { default as React } from 'react';
+import { IconName } from '../Icons/Icon';
 export interface StatContainerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
-    icon: React.ReactNode;
+    icon?: React.ReactNode;
+    iconName?: IconName;
     title: React.ReactNode;
     value: React.ReactNode;
     unit: React.ReactNode;
@@ -10,4 +12,4 @@ export interface StatContainerProps extends Omit<React.HTMLAttributes<HTMLDivEle
  * StatContainer
  * 아이콘, 제목, 데이터, 단위를 표시하는 정보 카드 컴포넌트
  */
-export declare function StatContainer({ icon, title, value, unit, className, iconClassName, ...props }: StatContainerProps): React.ReactElement;
+export declare function StatContainer({ icon, iconName, title, value, unit, className, iconClassName, ...props }: StatContainerProps): React.ReactElement;

package/dist/components/UserListItem/UserListItem.d.ts

@@ -1,10 +1,10 @@
-interface UserListItemProps {
+export interface UserListItemProps {
     className?: string;
     userName: string;
     userImageSrc?: string;
+    timeLabel?: string;
     isAuthor: boolean;
     onAccept?(): void;
     onReject?(): void;
 }
-export declare function UserListItem({ className, userName, userImageSrc, isAuthor, onAccept, onReject, }: UserListItemProps): React.ReactElement;
-export {};
+export declare function UserListItem({ className, userName, userImageSrc, timeLabel, isAuthor, onAccept, onReject, }: UserListItemProps): React.ReactElement;

package/dist/components/index.d.ts

@@ -12,26 +12,24 @@ export * from './DatePicker';
 export * from './Dialog';
 export * from './DiaryCard';
 export * from './Dropdown';
-export * from './Footer';
+export { Icon } from './Icons/Icon';
+export type { IconName, IconProps } from './Icons/Icon';
 export * from './ImagePlaceholder';
 export * from './ImagePicker';
 export * from './InfoButton';
 export * from './Text';
-export * from './PageBackground';
-export * from './PageTitle';
 export * from './PageWatermark';
 export * from './Pagination';
+export * from './ProgressBar';
 export * from './ProfileCard';
 export * from './RightSidebar';
 export * from './ScheduleCalendar';
-export * from './Spacing';
 export * from './StatContainer';
 export * from './StepIndicator';
 export * from './Streak';
 export * from './Tag';
 export * from './TextField';
 export * from './Toggle';
-export * from './ToggleCheck';
 export * from './ToggleGroup';
 export * from './Tooltip';
 export * from './UserListItem';