@liner-fe/prism 2.6.3 → 2.6.4

package/lib/index.d.ts

@@ -1,6 +1,6 @@
-import { SystemKeys, TypographyCaptionPrefix, TypographyParagraphPrefix, TypographyHeadingPrefix, TypographyTitlePrefix, TypographyDisplayPrefix } from '@liner-fe/design-token-primitive';
 import * as react from 'react';
-import react__default, { SVGProps, ButtonHTMLAttributes, RefAttributes, HTMLAttributes, ReactNode, ComponentPropsWithoutRef, InputHTMLAttributes, ComponentProps, LiHTMLAttributes, MouseEventHandler } from 'react';
+import react__default, { ComponentType, ForwardRefExoticComponent, RefAttributes, SVGProps, ButtonHTMLAttributes, HTMLAttributes, ReactNode, ComponentPropsWithoutRef, InputHTMLAttributes, ComponentProps, LiHTMLAttributes, MouseEventHandler } from 'react';
+import { SystemKeys, TypographyCaptionPrefix, TypographyParagraphPrefix, TypographyHeadingPrefix, TypographyTitlePrefix, TypographyDisplayPrefix } from '@liner-fe/design-token-primitive';
 import * as cva from 'cva';
 import { VariantProps } from 'cva';
 import * as react_jsx_runtime from 'react/jsx-runtime';
@@ -20,7 +20,7 @@ interface IconComponentProps {
     thick?: boolean;
     size?: 16 | 20 | 24 | 32 | 40;
 }
-type IconComponent = (props: IconComponentProps) => JSX.Element | undefined;
+type IconComponent = ComponentType<IconComponentProps> | ForwardRefExoticComponent<IconComponentProps & RefAttributes<SVGSVGElement>>;
 type IconMapType = typeof iconMap;
 type IconKey = 'close-fill' | 'more' | 'liner' | 'liner-variation' | 'person-fill' | 'list' | 'history' | 'start' | 'end' | 'paperclip' | 'share' | 'sign-out' | 'check-mark-fill' | 'exclamationmark-fill' | 'plus' | 'minus' | 'new-thread' | 'move' | 'search' | 'globe' | 'graduationcap' | 'palette' | 'download' | 'regenerate' | 'credit' | 'feedback' | 'tune' | 'arrow-back' | 'arrow-forward' | 'arrow-up' | 'arrow-down' | 'menu' | 'document-warning' | 'arrow-right' | 'arrow-left' | 'step' | 'arrow-turn' | 'power' | 'desktop' | 'desktop-on-cursor' | 'view-list' | 'chart-bar' | 'chart-line-uptrend' | 'folder' | 'person' | 'trash' | 'pencil' | 'copy' | 'book' | 'description' | 'bookmark' | 'photo' | 'camera' | 'bolt' | 'question-message' | 'books' | 'balance' | 'folder-add' | 'document' | 'person-add' | 'send' | 'check-mark' | 'exclamationmark' | 'close' | 'lock' | 'ai' | 'stack' | 'summarize' | 'memo' | 'highlighter' | 'creditcard' | 'speaker' | 'light' | 'document-add' | 'thumb-up' | 'thumb-down' | 'shield' | 'home' | 'visibility' | 'visibility-off' | 'magic-wand' | 'magic-pencil' | 'bulb-exclamtionmark' | 'bulb' | 'paraphase' | 'make-easy' | 'translate' | 'Info' | 'folder-open' | 'highlight-edit' | 'apple' | 'android' | 'twitter' | 'facebook' | 'google' | 'paraphrase' | 'car' | 'airplane' | 'rocket' | 'source' | 'setting' | 'extend' | 'shorten' | 'sun' | 'moon' | 'fire' | 'arrow-upward' | 'arrow-downward' | 'light-mode' | 'dark-mode' | 'target' | 'question-box' | 'new-tab' | 'example' | 'quote' | 'document-check' | 'block' | 'bookmark-cancel' | 'arrow-up-right' | 'arrow-down-left' | 'arrow-up-left' | 'email' | 'filter' | 'timer' | 'play-button' | 'text-select' | 'arrow-drop-down' | 'bell' | 'secret-mode' | 'add-clock' | 'clock' | 'arrow-backward' | 'link' | 'sheet-export' | 'shield-usage' | 'essay' | 'spinner' | 'drop-down' | 'drop-up' | 'arrow-drop-right' | 'arrow-up-down' | 'google-export' | 'shield-person' | 'formal-bag' | 'casual-shoe' | 'undo' | 'redo' | 'expand' | 'verification-badge' | 'volume-up' | 'volume' | 'folder-open-share' | 'folder-share' | 'report' | 'mindmap' | 'flowchart' | 'show-all' | 'hide-all' | 'brain' | 'zoom-in' | 'zoom-out' | 'focus' | 'help' | 'paragraph' | 'retry' | 'add-to-folder' | 'remove-from-folder' | 'move-to-folder' | 'new-thread-folder' | 'chrome' | 'new-chrome-extension' | 'mobile' | 'google-color' | 'stop' | 'microscope' | 'members' | 'teams' | 'literature-review' | 'expand-close';
 
@@ -65,7 +65,7 @@ interface IconProps extends VariantProps<typeof iconVariants>, Omit<SVGProps<SVG
     fill?: boolean;
     className?: string;
 }
-declare const Icon: (props: IconProps) => react_jsx_runtime.JSX.Element;
+declare const Icon: react.ForwardRefExoticComponent<Omit<IconProps, "ref"> & react.RefAttributes<SVGSVGElement>>;
 
 declare const defaultButtonVariants: (props?: ({
     level?: "primary" | "secondary" | "tertiary" | "quaternary" | "quinary" | "negative" | "static" | "inverse-static" | undefined;

package/lib/index.js

@@ -13687,7 +13687,7 @@ var arrayToStyleObject = /* @__PURE__ */ __name((colorKeys, style, prefix) => co
 var isEmptyObject = /* @__PURE__ */ __name((obj) => Object.getOwnPropertyNames(obj).length === 0, "isEmptyObject");
 
 // src/components/Button/index.tsx
-var import_react = require("react");
+var import_react2 = require("react");
 
 // src/components/Button/style.module.scss
 var style_module_default = {
@@ -13725,6 +13725,7 @@ var import_clsx2 = __toESM(require("clsx"));
 // src/components/Icon/index.tsx
 var import_cva = require("cva");
 var import_clsx = __toESM(require("clsx"));
+var import_react = require("react");
 
 // src/components/Icon/style.module.scss
 var style_module_default2 = {
@@ -13903,7 +13904,7 @@ var iconVariants = (0, import_cva.cva)({
   }
 });
 var getIconComponent = /* @__PURE__ */ __name((iconKey, map) => map[iconKey], "getIconComponent");
-var Icon = /* @__PURE__ */ __name((props) => {
+var Icon = (0, import_react.forwardRef)((props, ref) => {
   const {
     name,
     type = "neutral-label-primary",
@@ -13916,17 +13917,19 @@ var Icon = /* @__PURE__ */ __name((props) => {
   } = props;
   const IconComponent = getIconComponent(name, iconMap);
   const iconSize = iconSizeMap[size4];
-  return /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
-    IconComponent,
-    {
-      ...rest,
-      className: (0, import_clsx.default)(iconVariants({ type, fillType }), className),
-      size: iconSize,
-      thick,
-      fill
-    }
-  );
-}, "Icon");
+  const iconProps = {
+    ...rest,
+    className: (0, import_clsx.default)(iconVariants({ type, fillType }), className),
+    size: iconSize,
+    thick,
+    fill
+  };
+  const isForwardRef = "$$typeof" in IconComponent && IconComponent.$$typeof === Symbol.for("react.forward_ref");
+  if (isForwardRef && ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(IconComponent, { ...iconProps, ref });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(IconComponent, { ...iconProps });
+});
 
 // src/components/Loading/style.module.scss
 var style_module_default3 = {
@@ -14125,7 +14128,7 @@ var defaultButtonChildrenVariants = (0, import_cva3.cva)({
     }
   }
 });
-var DefaultButton = (0, import_react.forwardRef)(
+var DefaultButton = (0, import_react2.forwardRef)(
   ({
     asChild = false,
     level = "primary",
@@ -14155,9 +14158,9 @@ var DefaultButton = (0, import_react.forwardRef)(
       !!rightIcon && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime182.jsx)(Icon, { ...iconProps, ...rightIcon })
     ] }), "renderContent");
     if (asChild) {
-      const parent = import_react.Children.only(children);
+      const parent = import_react2.Children.only(children);
       const newChildren = parent.props.children;
-      const ParentClone = (0, import_react.cloneElement)(
+      const ParentClone = (0, import_react2.cloneElement)(
         parent,
         {
           ...rest,
@@ -14183,7 +14186,7 @@ var DefaultButton = (0, import_react.forwardRef)(
   }
 );
 DefaultButton.displayName = "DefaultButton";
-var Button = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime182.jsx)(DefaultButton, { ...props, ref }));
+var Button = (0, import_react2.forwardRef)((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime182.jsx)(DefaultButton, { ...props, ref }));
 Button.displayName = "Button";
 
 // src/hooks/useToast.ts
@@ -14274,7 +14277,7 @@ function useComposedRefs(...refs) {
 __name(useComposedRefs, "useComposedRefs");
 
 // ../../node_modules/@radix-ui/react-collection/dist/index.mjs
-var import_react2 = __toESM(require("react"), 1);
+var import_react3 = __toESM(require("react"), 1);
 
 // ../../node_modules/@radix-ui/react-context/dist/index.mjs
 var React2 = __toESM(require("react"), 1);
@@ -14435,7 +14438,7 @@ __name(getElementRef, "getElementRef");
 
 // ../../node_modules/@radix-ui/react-collection/dist/index.mjs
 var import_jsx_runtime185 = require("react/jsx-runtime");
-var import_react3 = __toESM(require("react"), 1);
+var import_react4 = __toESM(require("react"), 1);
 var import_jsx_runtime186 = require("react/jsx-runtime");
 function createCollection(name) {
   const PROVIDER_NAME2 = name + "CollectionProvider";
@@ -14446,14 +14449,14 @@ function createCollection(name) {
   );
   const CollectionProvider2 = /* @__PURE__ */ __name((props) => {
     const { scope, children } = props;
-    const ref = import_react2.default.useRef(null);
-    const itemMap = import_react2.default.useRef(/* @__PURE__ */ new Map()).current;
+    const ref = import_react3.default.useRef(null);
+    const itemMap = import_react3.default.useRef(/* @__PURE__ */ new Map()).current;
     return /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(CollectionProviderImpl, { scope, itemMap, collectionRef: ref, children });
   }, "CollectionProvider");
   CollectionProvider2.displayName = PROVIDER_NAME2;
   const COLLECTION_SLOT_NAME = name + "CollectionSlot";
   const CollectionSlotImpl = createSlot(COLLECTION_SLOT_NAME);
-  const CollectionSlot = import_react2.default.forwardRef(
+  const CollectionSlot = import_react3.default.forwardRef(
     (props, forwardedRef) => {
       const { scope, children } = props;
       const context = useCollectionContext2(COLLECTION_SLOT_NAME, scope);
@@ -14465,13 +14468,13 @@ function createCollection(name) {
   const ITEM_SLOT_NAME = name + "CollectionItemSlot";
   const ITEM_DATA_ATTR = "data-radix-collection-item";
   const CollectionItemSlotImpl = createSlot(ITEM_SLOT_NAME);
-  const CollectionItemSlot = import_react2.default.forwardRef(
+  const CollectionItemSlot = import_react3.default.forwardRef(
     (props, forwardedRef) => {
       const { scope, children, ...itemData } = props;
-      const ref = import_react2.default.useRef(null);
+      const ref = import_react3.default.useRef(null);
       const composedRefs = useComposedRefs(forwardedRef, ref);
       const context = useCollectionContext2(ITEM_SLOT_NAME, scope);
-      import_react2.default.useEffect(() => {
+      import_react3.default.useEffect(() => {
         context.itemMap.set(ref, { ref, ...itemData });
         return () => void context.itemMap.delete(ref);
       });
@@ -14481,7 +14484,7 @@ function createCollection(name) {
   CollectionItemSlot.displayName = ITEM_SLOT_NAME;
   function useCollection2(scope) {
     const context = useCollectionContext2(name + "CollectionConsumer", scope);
-    const getItems = import_react2.default.useCallback(() => {
+    const getItems = import_react3.default.useCallback(() => {
       const collectionNode = context.collectionRef.current;
       if (!collectionNode) return [];
       const orderedNodes = Array.from(collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`));
@@ -15671,11 +15674,11 @@ var style_module_default4 = {
 };
 
 // src/components/Toast/index.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 
 // src/components/Typography/Set/Paragraph.tsx
 var import_clsx3 = __toESM(require("clsx"));
-var import_react4 = require("react");
+var import_react5 = require("react");
 
 // src/components/Typography/utils.ts
 var import_cva4 = require("cva");
@@ -15718,7 +15721,7 @@ var colorVariants = (0, import_cva4.cva)({
 
 // src/components/Typography/Set/Paragraph.tsx
 var import_jsx_runtime192 = require("react/jsx-runtime");
-var Paragraph = (0, import_react4.forwardRef)(
+var Paragraph = (0, import_react5.forwardRef)(
   ({
     size: size4,
     type,
@@ -16225,26 +16228,26 @@ var loading_default = {
 // src/components/Toast/index.tsx
 var import_constants2 = require("date-fns/constants");
 var import_jsx_runtime193 = require("react/jsx-runtime");
-var import_react6 = require("react");
+var import_react7 = require("react");
 var Toaster = /* @__PURE__ */ __name(() => {
   const list = (0, import_recoil2.useRecoilValue)(toastAtom);
   return /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)(Provider, { children: [
-    list.map((props) => /* @__PURE__ */ (0, import_react6.createElement)(SingleToast, { ...props, key: props.toastId })),
+    list.map((props) => /* @__PURE__ */ (0, import_react7.createElement)(SingleToast, { ...props, key: props.toastId })),
     /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(Viewport, { className: style_module_default4.ToastViewport })
   ] });
 }, "Toaster");
 var SingleToast = /* @__PURE__ */ __name((props) => {
   const setToast = (0, import_recoil2.useSetRecoilState)(toastAtom);
-  const timerRef = (0, import_react5.useRef)();
+  const timerRef = (0, import_react6.useRef)();
   const { message, icon, button, timer, toastId, isLoading } = props;
-  const [isOpen, setIsOpen] = (0, import_react5.useState)(true);
-  const lottieRef = (0, import_react5.useRef)(null);
-  const toastSuccess = (0, import_react5.useRef)(false);
+  const [isOpen, setIsOpen] = (0, import_react6.useState)(true);
+  const lottieRef = (0, import_react6.useRef)(null);
+  const toastSuccess = (0, import_react6.useRef)(false);
   const removeToast = /* @__PURE__ */ __name(() => {
     setToast((prev) => prev.filter((toast) => toast.toastId !== toastId));
     timerRef.current && clearTimeout(timerRef.current);
   }, "removeToast");
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     if (isLoading && !toastSuccess.current) {
       if (lottieRef.current) {
         import_lottie_web.default.loadAnimation({
@@ -16310,10 +16313,10 @@ var SingleToast = /* @__PURE__ */ __name((props) => {
 }, "SingleToast");
 
 // src/components/Typography/Set/Heading.tsx
-var import_react7 = require("react");
+var import_react8 = require("react");
 var import_clsx4 = __toESM(require("clsx"));
 var import_jsx_runtime194 = require("react/jsx-runtime");
-var Heading = (0, import_react7.forwardRef)(
+var Heading = (0, import_react8.forwardRef)(
   ({ size: size4, children, type, className, color = "neutral-label-primary", as, ...rest }, ref) => {
     const Element2 = as || `h${size4}`;
     return /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
@@ -16334,9 +16337,9 @@ var Heading = (0, import_react7.forwardRef)(
 
 // src/components/Typography/Set/Caption.tsx
 var import_clsx5 = __toESM(require("clsx"));
-var import_react8 = require("react");
+var import_react9 = require("react");
 var import_jsx_runtime195 = require("react/jsx-runtime");
-var Caption = (0, import_react8.forwardRef)(
+var Caption = (0, import_react9.forwardRef)(
   ({
     children,
     size: size4,
@@ -16366,10 +16369,10 @@ var Caption = (0, import_react8.forwardRef)(
 Caption.displayName = "Caption";
 
 // src/components/Typography/Set/Title.tsx
-var import_react9 = require("react");
+var import_react10 = require("react");
 var import_clsx6 = __toESM(require("clsx"));
 var import_jsx_runtime196 = require("react/jsx-runtime");
-var Title2 = (0, import_react9.forwardRef)(
+var Title2 = (0, import_react10.forwardRef)(
   ({
     weight,
     size: size4,
@@ -16398,9 +16401,9 @@ var Title2 = (0, import_react9.forwardRef)(
 
 // src/components/Typography/Set/Display.tsx
 var import_clsx7 = __toESM(require("clsx"));
-var import_react10 = require("react");
+var import_react11 = require("react");
 var import_jsx_runtime197 = require("react/jsx-runtime");
-var Display = (0, import_react10.forwardRef)(
+var Display = (0, import_react11.forwardRef)(
   ({
     size: size4,
     type,
@@ -16449,7 +16452,7 @@ var { MediaContextProvider, Media } = AppMedia;
 
 // src/components/Typography/Responsive/index.tsx
 var import_jsx_runtime198 = require("react/jsx-runtime");
-var import_react11 = require("react");
+var import_react12 = require("react");
 var TypographyImpl = /* @__PURE__ */ __name(({ level, text, ...rest }) => {
   const commonProps = {
     ...rest,
@@ -16510,7 +16513,7 @@ var Typography = /* @__PURE__ */ __name((props) => {
       const variable = props[breakPointKey];
       const isExistVariable = !!variable;
       if (isExistVariable) {
-        return /* @__PURE__ */ (0, import_react11.createElement)(Media, { ...createMediaProps(breakPointKey), key: breakPointKey }, /* @__PURE__ */ (0, import_jsx_runtime198.jsx)(TypographyImpl, { ...variable, text: variable.text || children }));
+        return /* @__PURE__ */ (0, import_react12.createElement)(Media, { ...createMediaProps(breakPointKey), key: breakPointKey }, /* @__PURE__ */ (0, import_jsx_runtime198.jsx)(TypographyImpl, { ...variable, text: variable.text || children }));
       }
       return null;
     }) })
@@ -16562,7 +16565,7 @@ var style_module_default7 = {
 };
 
 // src/components/TextButton/index.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 var import_clsx8 = __toESM(require("clsx"));
 var import_jsx_runtime199 = require("react/jsx-runtime");
 var textButtonLevelIconTypeMap = {
@@ -16601,7 +16604,7 @@ var textButtonVariants = (0, import_cva5.cva)({
     }
   }
 });
-var TextButton = (0, import_react12.forwardRef)(
+var TextButton = (0, import_react13.forwardRef)(
   ({
     level = "primary",
     thick = false,
@@ -16627,8 +16630,8 @@ var TextButton = (0, import_react12.forwardRef)(
       rightIcon && /* @__PURE__ */ (0, import_jsx_runtime199.jsx)(Icon, { ...getIconProps(rightIcon) })
     ] }), "renderContent");
     if (asChild) {
-      const parent = import_react12.Children.only(children);
-      return (0, import_react12.cloneElement)(
+      const parent = import_react13.Children.only(children);
+      return (0, import_react13.cloneElement)(
         parent,
         {
           ...rest,
@@ -16784,7 +16787,7 @@ var Popover = Object.assign(PopoverRoot, {
 
 // src/components/Tooltip/index.tsx
 var import_radix_ui2 = require("radix-ui");
-var import_react13 = require("react");
+var import_react14 = require("react");
 
 // src/components/Tooltip/style.module.scss
 var style_module_default8 = {
@@ -16801,7 +16804,7 @@ var tooltipVariants = (0, import_cva7.cva)({ base: [style_module_default8.toolti
 var TooltipProvider = import_radix_ui2.Tooltip.Provider;
 var TooltipRoot = /* @__PURE__ */ __name(({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime201.jsx)(import_radix_ui2.Tooltip.Root, { delayDuration: 0, ...props, children }), "TooltipRoot");
 var TooltipTrigger = /* @__PURE__ */ __name(({ by }) => /* @__PURE__ */ (0, import_jsx_runtime201.jsx)(import_radix_ui2.Tooltip.Trigger, { asChild: true, children: by }), "TooltipTrigger");
-var TooltipContent = (0, import_react13.forwardRef)(
+var TooltipContent = (0, import_react14.forwardRef)(
   ({
     description,
     position = "top",
@@ -16830,7 +16833,7 @@ var Tooltip = Object.assign(TooltipRoot, {
 
 // src/components/IconButton/index.tsx
 var import_cva8 = require("cva");
-var import_react14 = require("react");
+var import_react15 = require("react");
 var import_clsx11 = __toESM(require("clsx"));
 
 // src/components/IconButton/style.module.scss
@@ -16925,7 +16928,7 @@ var iconButtonVariants = (0, import_cva8.cva)({
     }
   }
 });
-var IconButton = (0, import_react14.forwardRef)(
+var IconButton = (0, import_react15.forwardRef)(
   ({
     asChild,
     level = "primary",
@@ -16973,11 +16976,11 @@ var style_module_default10 = {
 };
 
 // src/components/CheckBox/index.tsx
-var import_react16 = require("react");
+var import_react17 = require("react");
 var import_clsx13 = __toESM(require("clsx"));
 
 // src/components/Label/index.tsx
-var import_react15 = require("react");
+var import_react16 = require("react");
 var import_radix_ui4 = require("radix-ui");
 var import_clsx12 = __toESM(require("clsx"));
 
@@ -17030,7 +17033,7 @@ var defaultLabelVariants = (0, import_cva9.cva)({
     }
   }
 });
-var Label = (0, import_react15.forwardRef)(
+var Label = (0, import_react16.forwardRef)(
   ({
     className,
     level = "primary",
@@ -17058,7 +17061,7 @@ Label.displayName = "Label";
 
 // src/components/CheckBox/index.tsx
 var import_jsx_runtime204 = require("react/jsx-runtime");
-var Checkbox = (0, import_react16.forwardRef)(
+var Checkbox = (0, import_react17.forwardRef)(
   ({ className, label, description, ...props }, ref) => {
     const CheckboxWrapper = /* @__PURE__ */ __name(({ children }) => label ? /* @__PURE__ */ (0, import_jsx_runtime204.jsxs)(Label, { position: "right", htmlFor: props.id, children: [
       /* @__PURE__ */ (0, import_jsx_runtime204.jsxs)("div", { className: style_module_default10["label-wrapper"], children: [
@@ -17074,7 +17077,7 @@ var Checkbox = (0, import_react16.forwardRef)(
 // src/components/Radio/index.tsx
 var import_radix_ui6 = require("radix-ui");
 var import_clsx14 = __toESM(require("clsx"));
-var import_react17 = require("react");
+var import_react18 = require("react");
 
 // src/components/Radio/style.module.scss
 var style_module_default12 = {
@@ -17087,9 +17090,9 @@ var style_module_default12 = {
 // src/components/Radio/index.tsx
 var import_jsx_runtime205 = require("react/jsx-runtime");
 var RadioIndicator = /* @__PURE__ */ __name(() => /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: /* @__PURE__ */ (0, import_jsx_runtime205.jsx)("circle", { cx: "5", cy: "5", r: "5", fill: "#313133" }) }), "RadioIndicator");
-var RadioRoot = (0, import_react17.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(import_radix_ui6.RadioGroup.Root, { ref, className, ...props }));
+var RadioRoot = (0, import_react18.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(import_radix_ui6.RadioGroup.Root, { ref, className, ...props }));
 RadioRoot.displayName = "RadioRoot";
-var RadioItem = (0, import_react17.forwardRef)(
+var RadioItem = (0, import_react18.forwardRef)(
   ({ className, label, description, ...props }, ref) => {
     const RadioItemWrapper = /* @__PURE__ */ __name(({ children }) => label ? /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)(Label, { position: "right", children: [
       /* @__PURE__ */ (0, import_jsx_runtime205.jsxs)("div", { className: style_module_default12["label-wrapper"], children: [
@@ -17116,7 +17119,7 @@ var Radio = Object.assign(RadioRoot, {
 });
 
 // src/components/Textfield/index.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 
 // src/components/Textfield/style.module.scss
 var style_module_default13 = {
@@ -17154,9 +17157,9 @@ var defaultTextfieldVariants = (0, import_cva10.cva)({
     }
   }
 });
-var Textfield = (0, import_react18.forwardRef)((props, ref) => {
+var Textfield = (0, import_react19.forwardRef)((props, ref) => {
   const {
-    id = (0, import_react18.useId)(),
+    id = (0, import_react19.useId)(),
     type,
     label,
     value: controlledValue,
@@ -17170,9 +17173,9 @@ var Textfield = (0, import_react18.forwardRef)((props, ref) => {
     onClear,
     ...rest
   } = props;
-  const inputRef = (0, import_react18.useRef)(null);
-  const [value, setValue] = (0, import_react18.useState)("");
-  const [deidentifiy, setDeidentifiy] = (0, import_react18.useState)(true);
+  const inputRef = (0, import_react19.useRef)(null);
+  const [value, setValue] = (0, import_react19.useState)("");
+  const [deidentifiy, setDeidentifiy] = (0, import_react19.useState)(true);
   const isControlled = controlledValue !== void 0;
   const isPassword = type === "password";
   const isDeidentified = isPassword && deidentifiy;
@@ -17212,7 +17215,7 @@ var Textfield = (0, import_react18.forwardRef)((props, ref) => {
       inputRef.current.setSelectionRange(length, length);
     }
   }, "handleDeidentify");
-  (0, import_react18.useImperativeHandle)(ref, () => inputRef.current);
+  (0, import_react19.useImperativeHandle)(ref, () => inputRef.current);
   return /* @__PURE__ */ (0, import_jsx_runtime206.jsxs)("div", { className: style_module_default13["textfield-container"], children: [
     /* @__PURE__ */ (0, import_jsx_runtime206.jsx)(
       "div",
@@ -17317,7 +17320,7 @@ var Textfield = (0, import_react18.forwardRef)((props, ref) => {
 Textfield.displayName = "Textfield";
 
 // src/components/Slider/index.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 
 // src/components/Slider/style.module.scss
 var style_module_default14 = {
@@ -17335,7 +17338,7 @@ var style_module_default14 = {
 // src/components/Slider/index.tsx
 var import_radix_ui7 = require("radix-ui");
 var import_jsx_runtime207 = require("react/jsx-runtime");
-var SliderRoot = (0, import_react19.forwardRef)(
+var SliderRoot = (0, import_react20.forwardRef)(
   (props, ref) => {
     const { label, tooltip, rangeLeft, rangeRight, min: min2, max: max2, step = 50, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime207.jsx)(import_jsx_runtime207.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime207.jsxs)(Tooltip.Provider, { children: [
@@ -17396,11 +17399,11 @@ var style_module_default15 = {
 };
 
 // src/components/Select/index.tsx
-var import_react20 = require("react");
+var import_react21 = require("react");
 var import_clsx16 = __toESM(require("clsx"));
 var import_jsx_runtime208 = require("react/jsx-runtime");
 var Badge = /* @__PURE__ */ __name(({ children }) => /* @__PURE__ */ (0, import_jsx_runtime208.jsx)("div", { className: style_module_default15.badgeContainer, children: /* @__PURE__ */ (0, import_jsx_runtime208.jsx)(Caption, { className: style_module_default15.badge, size: 2, type: "normal", weight: "medium", children }) }), "Badge");
-var SelectContent = (0, import_react20.forwardRef)(
+var SelectContent = (0, import_react21.forwardRef)(
   (props, ref) => {
     const { id, isResponsive, popSide, sideOffset, listLabel, children, container } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime208.jsx)(import_radix_ui8.Select.Portal, { container, children: /* @__PURE__ */ (0, import_jsx_runtime208.jsx)(
@@ -17452,7 +17455,7 @@ var SelectContent = (0, import_react20.forwardRef)(
     ) });
   }
 );
-var SelectRoot = (0, import_react20.forwardRef)(
+var SelectRoot = (0, import_react21.forwardRef)(
   (props, ref) => {
     const {
       id,
@@ -17472,8 +17475,8 @@ var SelectRoot = (0, import_react20.forwardRef)(
       ...rest
     } = props;
     const contentProps = { id, isResponsive, popSide, sideOffset, listLabel, children, container };
-    const [isOpen, setIsOpen] = (0, import_react20.useState)(false);
-    (0, import_react20.useEffect)(() => {
+    const [isOpen, setIsOpen] = (0, import_react21.useState)(false);
+    (0, import_react21.useEffect)(() => {
       setIsOpen(open);
     }, [open]);
     return /* @__PURE__ */ (0, import_jsx_runtime208.jsxs)("div", { children: [
@@ -17541,18 +17544,18 @@ var style_module_default16 = {
 };
 
 // src/components/List/index.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 
 // src/hooks/collection.tsx
-var import_react21 = require("react");
+var import_react22 = require("react");
 var import_jsx_runtime209 = require("react/jsx-runtime");
-var CollectionContext = (0, import_react21.createContext)(void 0);
+var CollectionContext = (0, import_react22.createContext)(void 0);
 var CollectionProvider = /* @__PURE__ */ __name(({ value, onChangeValue, children }) => {
-  const contextValue = (0, import_react21.useMemo)(() => ({ value, onChangeValue }), [value, onChangeValue]);
+  const contextValue = (0, import_react22.useMemo)(() => ({ value, onChangeValue }), [value, onChangeValue]);
   return /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(CollectionContext.Provider, { value: contextValue, children });
 }, "CollectionProvider");
 var useCollectionContext = /* @__PURE__ */ __name(() => {
-  const context = (0, import_react21.useContext)(CollectionContext);
+  const context = (0, import_react22.useContext)(CollectionContext);
   if (!context) {
     throw new Error("useCollectionContext must be used within a CollectionProvider");
   }
@@ -17566,7 +17569,7 @@ var ListRoot = /* @__PURE__ */ __name(({ children, className, ...props }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(CollectionProvider, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime210.jsx)("ul", { className: (0, import_clsx17.default)(style_module_default16.list, className), children }) });
 }, "ListRoot");
 var Item = /* @__PURE__ */ __name(({ value, text, disabled, icon, onClick }) => {
-  const [isFocused, setIsFocused] = (0, import_react22.useState)(false);
+  const [isFocused, setIsFocused] = (0, import_react23.useState)(false);
   const { value: contextValue, onChangeValue } = useCollectionContext();
   const isSelected = contextValue === value;
   const iconProps = isSelected ? { name: "check-mark", type: "brand-label-primary", thick: true } : icon ? icon : {};
@@ -19577,9 +19580,9 @@ var computePosition2 = /* @__PURE__ */ __name((reference, floating, options) =>
 
 // ../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.mjs
 var React21 = __toESM(require("react"), 1);
-var import_react23 = require("react");
+var import_react24 = require("react");
 var ReactDOM4 = __toESM(require("react-dom"), 1);
-var index = typeof document !== "undefined" ? import_react23.useLayoutEffect : import_react23.useEffect;
+var index = typeof document !== "undefined" ? import_react24.useLayoutEffect : import_react24.useEffect;
 function deepEqual(a, b) {
   if (a === b) {
     return true;
@@ -20365,9 +20368,9 @@ function assignRef(ref, value) {
 __name(assignRef, "assignRef");
 
 // ../../node_modules/use-callback-ref/dist/es2015/useRef.js
-var import_react24 = require("react");
+var import_react25 = require("react");
 function useCallbackRef2(initialValue, callback) {
-  var ref = (0, import_react24.useState)(function() {
+  var ref = (0, import_react25.useState)(function() {
     return {
       // value
       value: initialValue,
@@ -21322,7 +21325,7 @@ var Arrow22 = PopoverArrow;
 // src/components/coach-mark/primitive/index.tsx
 var import_cva11 = require("cva");
 var import_clsx18 = __toESM(require("clsx"));
-var import_react25 = require("react");
+var import_react26 = require("react");
 
 // src/components/coach-mark/primitive/style.module.scss
 var style_module_default17 = {
@@ -21364,7 +21367,7 @@ var PrimitiveCoachMarkAnchor = /* @__PURE__ */ __name(({ className }) => /* @__P
     )
   }
 ), "PrimitiveCoachMarkAnchor");
-var PrimitiveCoachMarkContent = (0, import_react25.forwardRef)(({ children, className, container, ...rest }, ref) => /* @__PURE__ */ (0, import_jsx_runtime216.jsx)(Portal2, { container, children: /* @__PURE__ */ (0, import_jsx_runtime216.jsxs)(
+var PrimitiveCoachMarkContent = (0, import_react26.forwardRef)(({ children, className, container, ...rest }, ref) => /* @__PURE__ */ (0, import_jsx_runtime216.jsx)(Portal2, { container, children: /* @__PURE__ */ (0, import_jsx_runtime216.jsxs)(
   Content2,
   {
     ref,
@@ -21383,7 +21386,7 @@ var PrimitiveCoachMark = Object.assign(PrimitiveCoachMarkRoot, {
 });
 
 // src/components/coach-mark/compact/index.tsx
-var import_react27 = require("react");
+var import_react28 = require("react");
 
 // src/components/coach-mark/compact/style.module.scss
 var style_module_default18 = {
@@ -21400,7 +21403,7 @@ var import_clsx19 = __toESM(require("clsx"));
 var import_cva13 = require("cva");
 
 // src/components/Tag/index.tsx
-var import_react26 = require("react");
+var import_react27 = require("react");
 
 // src/components/Tag/style.module.scss
 var style_module_default19 = {
@@ -21647,7 +21650,7 @@ var tagVariants = (0, import_cva12.cva)({
     }
   }
 });
-var Tag = (0, import_react26.forwardRef)(
+var Tag = (0, import_react27.forwardRef)(
   ({
     children,
     color = "neutral-label-static-primary",
@@ -21689,7 +21692,7 @@ var compactCoachMarkVariants = (0, import_cva13.cva)({
 var CompactCoachMarkRoot = /* @__PURE__ */ __name((props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime218.jsx)(PrimitiveCoachMark, { ...props });
 }, "CompactCoachMarkRoot");
-var CompactCoachMarkContent = (0, import_react27.forwardRef)(({ tag, title, level = "brand", className, side = "top", sideOffset = -15, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime218.jsxs)(
+var CompactCoachMarkContent = (0, import_react28.forwardRef)(({ tag, title, level = "brand", className, side = "top", sideOffset = -15, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime218.jsxs)(
   PrimitiveCoachMark.Content,
   {
     ref,
@@ -21734,7 +21737,7 @@ var style_module_default20 = {
 };
 
 // src/components/coach-mark/main/index.tsx
-var import_react28 = require("react");
+var import_react29 = require("react");
 var import_cva14 = require("cva");
 var import_clsx20 = __toESM(require("clsx"));
 
@@ -21843,8 +21846,8 @@ var coachMarkLevelButtonLevelMap = {
 };
 var CoachMarkRoot = /* @__PURE__ */ __name((props) => {
   const { children } = props;
-  (0, import_react28.useEffect)(() => {
-    if ((0, import_react28.isValidElement)(children) && "image" in children.props) {
+  (0, import_react29.useEffect)(() => {
+    if ((0, import_react29.isValidElement)(children) && "image" in children.props) {
       const imageProps = children.props.image;
       if (imageProps?.src) {
         const img = new Image();
@@ -21854,7 +21857,7 @@ var CoachMarkRoot = /* @__PURE__ */ __name((props) => {
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime220.jsx)(PrimitiveCoachMark, { ...props });
 }, "CoachMarkRoot");
-var CoachMarkContent = (0, import_react28.forwardRef)(
+var CoachMarkContent = (0, import_react29.forwardRef)(
   ({
     level = "brand",
     width,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liner-fe/prism",
-  "version": "2.6.3",
+  "version": "2.6.4",
   "scripts": {
     "dev": "next dev",
     "start": "next start",