@liner-fe/icon 0.0.48 → 0.0.50

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @liner-fe/icon
 
+## 0.0.50
+
+### Patch Changes
+
+- 4a3d20f: icon error boundary에서 없으면 로깅하게 변경
+
+## 0.0.49
+
+### Patch Changes
+
+- 369b5e4: refactor: icon에 에러 바운더리 적용
+
 ## 0.0.48
 
 ### Patch Changes

package/index.tsx

@@ -1,5 +1,6 @@
 import React, { forwardRef } from 'react';
   import { BasicColorType } from '@liner-fe/design-token-primitive';
+  import { captureException } from '@sentry/nextjs';
 import { ArrowUpward } from './assets/arrow-upward';
 import { ArrowDownward } from './assets/arrow-downward';
 import { ArrowBack } from './assets/arrow-back';
@@ -401,5 +402,11 @@ export interface IconProps {
 
 export const Icon = forwardRef<SVGSVGElement, IconProps>(({name, size = "m", ...props}, ref) => {
   const IconComponent = IconMap[name];
+
+  if (!IconComponent) {
+    captureException(new Error(`Icon ${name} not found`));
+    return null;
+  }
+
   return <IconComponent {...props} ref={ref} size={iconSizeMap[size]} />;
 });

package/lib/index.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { BasicColorType } from '@liner-fe/design-token-primitive';
+
+type IconName = "arrow-upward" | "arrow-downward" | "arrow-back" | "arrow-forward" | "drop-up" | "drop-down" | "arrow-backward" | "arrow-drop-right" | "arrow-up" | "arrow-down" | "arrow-left" | "arrow-right" | "move" | "arrow-turn" | "start" | "end" | "extend" | "shorten" | "more" | "check-mark" | "check-mark-fill" | "exclamationmark" | "exclamationmark-fill" | "plus" | "minus" | "close" | "close-fill" | "double-arrow-forward" | "double-arrow-backward" | "arrow-up-right" | "arrow-down-left" | "arrow-up-left" | "arrow-up-down" | "redo" | "undo" | "expand" | "show-all" | "hide-all" | "help" | "zoom-in" | "zoom-out" | "retry" | "question-message" | "books" | "balance" | "chart-bar" | "chart-line-uptrend" | "folder" | "folder-open" | "folder-add" | "document" | "history" | "person" | "person-add" | "send" | "paperclip" | "share" | "sign-out" | "lock" | "ai" | "trash" | "stack" | "new-thread" | "summarize" | "search" | "memo" | "globe" | "graduationcap" | "palette" | "download" | "copy" | "regenerate" | "credit" | "feedback" | "creditcard" | "speaker" | "tune" | "shield" | "menu" | "light" | "document-add" | "thumb-up" | "thumb-down" | "document-warning" | "person-fill" | "step" | "book" | "description" | "bookmark" | "power" | "photo" | "camera" | "list" | "desktop" | "desktop-on-cursor" | "view-list" | "bolt" | "home" | "visibility" | "visibility-off" | "magic-wand" | "highlighter" | "pencil" | "essay" | "magic-pencil" | "highlight-edit" | "paraphrase" | "bulb-exclamtionmark" | "bulb" | "make-easy" | "translate" | "info" | "apple" | "android" | "twitter" | "facebook" | "google" | "car" | "airplane" | "rocket" | "source" | "liner" | "setting" | "light-mode" | "dark-mode" | "fire" | "question-box" | "target" | "new-tab" | "quote" | "document-check" | "block" | "bookmark-cancel" | "email" | "filter" | "timer" | "play-button" | "text-select" | "bell" | "secret-mode" | "add-clock" | "clock" | "spinner" | "volume-up" | "volume" | "google-export" | "link" | "sheet-export" | "shield-person" | "shield-usage" | "formal-bag" | "casual-shoe" | "folder-open-share" | "folder-share" | "verification-badge" | "report" | "brain" | "mindmap" | "flowchart" | "focus" | "paragraph" | "add-to-folder" | "remove-from-folder" | "move-to-folder" | "new-thread-folder" | "chrome" | "new-chrome-extension" | "mobile" | "members" | "teams" | "stop" | "microscope" | "literature-review" | "expand-close" | "restaurant" | "color-liner" | "color-liner-variation" | "color-facebook" | "color-google" | "color-fire" | "color-txt" | "color-pdf" | "color-docx" | "more-horizontal" | "more-vertical" | "check-mark-in-circle" | "star";
+type IconSizeKey = keyof typeof iconSizeMap;
+declare const IconMap: Record<"arrow-upward" | "arrow-downward" | "arrow-back" | "arrow-forward" | "drop-up" | "drop-down" | "arrow-backward" | "arrow-drop-right" | "arrow-up" | "arrow-down" | "arrow-left" | "arrow-right" | "move" | "arrow-turn" | "start" | "end" | "extend" | "shorten" | "more" | "check-mark" | "check-mark-fill" | "exclamationmark" | "exclamationmark-fill" | "plus" | "minus" | "close" | "close-fill" | "double-arrow-forward" | "double-arrow-backward" | "arrow-up-right" | "arrow-down-left" | "arrow-up-left" | "arrow-up-down" | "redo" | "undo" | "expand" | "show-all" | "hide-all" | "help" | "zoom-in" | "zoom-out" | "retry" | "question-message" | "books" | "balance" | "chart-bar" | "chart-line-uptrend" | "folder" | "folder-open" | "folder-add" | "document" | "history" | "person" | "person-add" | "send" | "paperclip" | "share" | "sign-out" | "lock" | "ai" | "trash" | "stack" | "new-thread" | "summarize" | "search" | "memo" | "globe" | "graduationcap" | "palette" | "download" | "copy" | "regenerate" | "credit" | "feedback" | "creditcard" | "speaker" | "tune" | "shield" | "menu" | "light" | "document-add" | "thumb-up" | "thumb-down" | "document-warning" | "person-fill" | "step" | "book" | "description" | "bookmark" | "power" | "photo" | "camera" | "list" | "desktop" | "desktop-on-cursor" | "view-list" | "bolt" | "home" | "visibility" | "visibility-off" | "magic-wand" | "highlighter" | "pencil" | "essay" | "magic-pencil" | "highlight-edit" | "paraphrase" | "bulb-exclamtionmark" | "bulb" | "make-easy" | "translate" | "info" | "apple" | "android" | "twitter" | "facebook" | "google" | "car" | "airplane" | "rocket" | "source" | "liner" | "setting" | "light-mode" | "dark-mode" | "fire" | "question-box" | "target" | "new-tab" | "quote" | "document-check" | "block" | "bookmark-cancel" | "email" | "filter" | "timer" | "play-button" | "text-select" | "bell" | "secret-mode" | "add-clock" | "clock" | "spinner" | "volume-up" | "volume" | "google-export" | "link" | "sheet-export" | "shield-person" | "shield-usage" | "formal-bag" | "casual-shoe" | "folder-open-share" | "folder-share" | "verification-badge" | "report" | "brain" | "mindmap" | "flowchart" | "focus" | "paragraph" | "add-to-folder" | "remove-from-folder" | "move-to-folder" | "new-thread-folder" | "chrome" | "new-chrome-extension" | "mobile" | "members" | "teams" | "stop" | "microscope" | "literature-review" | "expand-close" | "restaurant" | "color-liner" | "color-liner-variation" | "color-facebook" | "color-google" | "color-fire" | "color-txt" | "color-pdf" | "color-docx" | "more-horizontal" | "more-vertical" | "check-mark-in-circle" | "star", React.ForwardRefExoticComponent<any>>;
+declare const iconSizeMap: {
+    readonly xs: 16;
+    readonly s: 20;
+    readonly m: 24;
+    readonly l: 32;
+    readonly xl: 40;
+};
+interface IconProps {
+    fill?: boolean;
+    thick?: boolean;
+    className?: string;
+    name: keyof typeof IconMap;
+    size?: keyof typeof iconSizeMap;
+    type?: BasicColorType;
+    fillType?: BasicColorType;
+}
+declare const Icon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
+
+export { Icon, type IconName, type IconProps, type IconSizeKey };