@liner-fe/prism 2.8.26 → 2.8.28

package/lib/index.css

@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 /* esbuild-sass-plugin:css-chunk:src/components/Button/style.module.scss */
-._button_60r7l_1 {
+._button_1k6qi_1 {
   position: relative;
   display: flex;
   align-items: center;
@@ -16,192 +16,193 @@
   overflow: hidden;
   cursor: pointer;
 }
-._button_60r7l_1:disabled {
+._button_1k6qi_1:disabled {
   background: var(--neutral-fill-overlay-mid);
   color: var(--neutral-label-tertiary);
   cursor: not-allowed;
 }
-._button_60r7l_1:disabled span svg path:not([fill=white]) {
+._button_1k6qi_1:disabled span svg path:not([fill=white]) {
   fill: var(--neutral-label-tertiary) !important;
 }
-._button_60r7l_1:disabled span svg path[fill=white] {
+._button_1k6qi_1:disabled span svg path[fill=white] {
   fill: var(--inverse-label-primary) !important;
 }
-._default_60r7l_28 {
+._default_1k6qi_28 {
   color: var(--inverse-label-primary);
   background: var(--lp-pri-achromatic-white);
 }
-._default_60r7l_28 svg path {
+._default_1k6qi_28 svg path {
   fill: var(--inverse-label-primary);
 }
-._primary_60r7l_36 {
+._primary_1k6qi_36 {
   color: var(--inverse-label-static-primary);
   background: var(--brand-container-mid);
 }
-._primary_60r7l_36:not(:disabled):hover {
+._primary_1k6qi_36:not(:disabled):hover {
   background: var(--brand-container-mid-hover);
 }
-._secondary_60r7l_44 {
+._secondary_1k6qi_44 {
   color: var(--inverse-label-static-primary);
   background: var(--brand-container-mid);
 }
-._secondary_60r7l_44:not(:disabled):hover {
+._secondary_1k6qi_44:not(:disabled):hover {
   background: var(--brand-container-mid-hover);
 }
-._tertiary_60r7l_52 {
+._tertiary_1k6qi_52 {
   color: var(--neutral-label-primary);
   background: var(--neutral-fill-overlay-mid);
 }
-._tertiary_60r7l_52:not(:disabled):hover {
+._tertiary_1k6qi_52:not(:disabled):hover {
   background: var(--neutral-fill-overlay-mid-hover);
 }
-._quaternary_60r7l_60 {
+._quaternary_1k6qi_60 {
   color: var(--neutral-label-primary);
   border: 1px solid var(--neutral-border-overlay-normal);
   background: var(--neutral-fill-overlay-lowest);
 }
-._quaternary_60r7l_60:not(:disabled):hover {
+._quaternary_1k6qi_60:not(:disabled):hover {
   background: var(--neutral-fill-overlay-lowest-hover);
 }
-._quaternary_60r7l_60:disabled {
+._quaternary_1k6qi_60:disabled {
   background: var(--neutral-fill-overlay-lowest);
   color: var(--neutral-label-tertiary);
   opacity: 0.4;
 }
-._quaternary_60r7l_60:disabled svg path {
+._quaternary_1k6qi_60:disabled svg path {
   fill: var(--neutral-label-tertiary) !important;
 }
-._quinary_60r7l_77 {
+._quinary_1k6qi_77 {
   color: var(--neutral-label-primary);
   background: var(--neutral-container-lowest);
 }
-._quinary_60r7l_77:not(:disabled):hover {
+._quinary_1k6qi_77:not(:disabled):hover {
   background: var(--neutral-fill-overlay-lowest-hover);
 }
-._quinary_60r7l_77:disabled {
+._quinary_1k6qi_77:disabled {
   background: var(--neutral-fill-overlay-mid);
   color: var(--neutral-label-tertiary);
 }
-._quinary_60r7l_77:disabled svg path {
+._quinary_1k6qi_77:disabled svg path {
   fill: var(--neutral-label-tertiary) !important;
 }
-._negative_60r7l_92 {
+._negative_1k6qi_92 {
   color: var(--inverse-label-static-primary);
   background: var(--function-fill-negative-mid);
 }
-._negative_60r7l_92:not(:disabled):hover {
+._negative_1k6qi_92:not(:disabled):hover {
   background: var(--function-fill-negative-mid-hover);
 }
-._static_60r7l_100 {
+._static_1k6qi_100 {
   background: var(--neutral-container-static-lowest);
   color: var(--neutral-label-static-primary);
 }
-._static_60r7l_100:not(:disabled):hover {
+._static_1k6qi_100:not(:disabled):hover {
   background: var(--neutral-container-static-lowest-hover);
 }
-._inverse-static_60r7l_108 {
+._inverse-static_1k6qi_108 {
   background: var(--inverse-container-static-high);
   color: var(--inverse-label-static-primary);
 }
-._inverse-static_60r7l_108:not(:disabled):hover {
+._inverse-static_1k6qi_108:not(:disabled):hover {
   background: var(--inverse-container-static-high-hover);
 }
-._ghost_60r7l_116._primary_60r7l_36 {
+._ghost_1k6qi_116._primary_1k6qi_36 {
   background: var(--inverse-fill-lowest);
   color: var(--neutral-label-primary);
 }
-._ghost_60r7l_116._primary_60r7l_36:not(:disabled):hover {
+._ghost_1k6qi_116._primary_1k6qi_36:not(:disabled):hover {
   background: var(--neutral-fill-overlay-lowest-hover);
 }
-._ghost_60r7l_116._primary_60r7l_36:disabled {
+._ghost_1k6qi_116._primary_1k6qi_36:disabled {
   background: var(--neutral-fill-overlay-lowest);
   color: var(--neutral-label-tertiary);
 }
-._ghost_60r7l_116._primary_60r7l_36:disabled span svg path:not([fill=white]) {
+._ghost_1k6qi_116._primary_1k6qi_36:disabled span svg path:not([fill=white]) {
   fill: var(--neutral-label-tertiary);
 }
-._ghost_60r7l_116._primary_60r7l_36:disabled span svg path[fill=white] {
+._ghost_1k6qi_116._primary_1k6qi_36:disabled span svg path[fill=white] {
   fill: var(--inverse-label-primary);
 }
-._ghost_60r7l_116._secondary_60r7l_44 {
+._ghost_1k6qi_116._secondary_1k6qi_44 {
   background: var(--inverse-fill-lowest);
   color: var(--neutral-label-primary);
 }
-._ghost_60r7l_116._secondary_60r7l_44:not(:disabled):hover {
+._ghost_1k6qi_116._secondary_1k6qi_44:not(:disabled):hover {
   background: var(--neutral-fill-overlay-lowest-hover);
 }
-._ghost_60r7l_116._secondary_60r7l_44:disabled {
+._ghost_1k6qi_116._secondary_1k6qi_44:disabled {
   background: var(--neutral-fill-overlay-lowest);
   color: var(--neutral-label-tertiary);
 }
-._ghost_60r7l_116._secondary_60r7l_44:disabled span svg path:not([fill=white]) {
+._ghost_1k6qi_116._secondary_1k6qi_44:disabled span svg path:not([fill=white]) {
   fill: var(--neutral-label-tertiary);
 }
-._ghost_60r7l_116._secondary_60r7l_44:disabled span svg path[fill=white] {
+._ghost_1k6qi_116._secondary_1k6qi_44:disabled span svg path[fill=white] {
   fill: var(--inverse-label-primary);
 }
-._cta_60r7l_151 {
+._cta_1k6qi_151 {
   border-radius: var(--lp-sys-radius-m);
   width: fit-content;
   height: 52px;
   gap: 8px;
   min-width: 52px;
 }
-._l_60r7l_159 {
+._l_1k6qi_159 {
   border-radius: var(--lp-sys-radius-s);
   width: fit-content;
   height: 44px;
   min-width: 44px;
 }
-._m_60r7l_166 {
+._m_1k6qi_166 {
   border-radius: var(--lp-sys-radius-s);
   width: fit-content;
   height: 36px;
   min-width: 36px;
 }
-._s_60r7l_44 {
+._s_1k6qi_44 {
   border-radius: var(--lp-sys-radius-s);
   width: fit-content;
   height: 28px;
   min-width: 28px;
 }
-._align-center_60r7l_180 > span {
+._align-center_1k6qi_180 > span {
   width: 100%;
   justify-content: center;
 }
-._align-space-between_60r7l_185 > span {
+._align-space-between_1k6qi_185 > span {
   width: 100%;
   justify-content: space-between;
 }
-._content_60r7l_190 {
+._content_1k6qi_190 {
   flex-shrink: 0;
   line-height: 0;
   padding: 0px var(--lp-sys-padding-component-100);
 }
-._full_60r7l_196 {
+._full_1k6qi_196 {
   width: 100%;
 }
-._fit-content_60r7l_200 {
+._fit-content_1k6qi_200 {
   width: fit-content;
 }
-._children_60r7l_204 {
+._children_1k6qi_204 {
+  position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
 }
-._cta-children_60r7l_210 {
+._cta-children_1k6qi_211 {
   padding: 0 var(--lp-sys-gap-positive-300);
   gap: var(--lp-sys-gap-positive-100);
 }
-._l-children_60r7l_215 {
+._l-children_1k6qi_216 {
   padding: 0 var(--lp-sys-gap-positive-200);
   gap: var(--lp-sys-gap-positive-50);
 }
-._m-children_60r7l_220 {
+._m-children_1k6qi_221 {
   padding: 0 var(--lp-sys-gap-positive-150);
   gap: var(--lp-sys-gap-positive-50);
 }
-._s-children_60r7l_225 {
+._s-children_1k6qi_226 {
   padding: 0 var(--lp-sys-gap-positive-150);
   gap: var(--lp-sys-gap-positive-50);
 }
@@ -1805,10 +1806,10 @@
 }
 
 /* esbuild-sass-plugin:css-chunk:src/components/coach-mark/primitive/style.module.scss */
-._anchor_1pmfi_1 {
+._anchor_1d9jc_1 {
   transform: rotate(270deg) translateX(7px);
 }
-._content_1pmfi_5 {
+._content_1d9jc_5 {
   border-radius: var(--lp-sys-radius-m);
   width: 100%;
   box-shadow:
@@ -1816,7 +1817,10 @@
     0px 1px 8px 0px rgba(0, 0, 0, 0.06),
     0px 0px 1px 0px rgba(0, 0, 0, 0.06);
 }
-._overlay_1pmfi_11 {
+._content_1d9jc_5 p {
+  margin: 0;
+}
+._overlay_1d9jc_14 {
   position: fixed;
   top: 0;
   left: 0;
@@ -1825,18 +1829,21 @@
   background: rgba(255, 255, 255, 0.7490196078);
   z-index: 9;
 }
+._close_1d9jc_24 {
+  cursor: pointer;
+}
 
 /* esbuild-sass-plugin:css-chunk:src/components/coach-mark/compact/style.module.scss */
-._content_1tkjk_1 {
+._content_mrnt5_1 {
   position: relative;
   display: flex;
   align-items: center;
   gap: var(--lp-sys-gap-positive-100);
   padding: var(--lp-sys-padding-component-200);
   width: fit-content;
-  animation: _slideIn_1tkjk_1 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
+  animation: _slideIn_mrnt5_1 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
 }
-@keyframes _slideIn_1tkjk_1 {
+@keyframes _slideIn_mrnt5_1 {
   from {
     transform: translateY(10px);
     opacity: 0;
@@ -1846,33 +1853,35 @@
     opacity: 1;
   }
 }
-._content_1tkjk_1:hover ._closeButton_1tkjk_20 {
+._content_mrnt5_1:hover ._closeButton_mrnt5_20 {
   display: block;
 }
-._brand_1tkjk_24 {
+._brand_mrnt5_24 {
   background: var(--brand-container-mid);
 }
-._brand_1tkjk_24 svg > path {
+._brand_mrnt5_24 svg > path {
   fill: var(--brand-container-mid);
 }
-._inverse-static_1tkjk_31 {
+._inverse-static_mrnt5_31 {
   background: var(--inverse-container-static-high);
 }
-._inverse-static_1tkjk_31 svg > path {
+._inverse-static_mrnt5_31 svg > path {
   fill: var(--inverse-container-static-high);
 }
-._inverse_1tkjk_31 {
+._inverse_mrnt5_31 {
   background: var(--inverse-container-lowest);
 }
-._inverse_1tkjk_31 svg > path {
+._inverse_mrnt5_31 svg > path {
   fill: var(--inverse-container-lowest);
 }
-._closeButton_1tkjk_20 {
+._close_mrnt5_20 {
   position: absolute;
   top: 0;
   right: 0;
   transform: translate(40%, -40%);
-  display: none;
+}
+._main_mrnt5_52 {
+  margin: 0;
 }
 
 /* esbuild-sass-plugin:css-chunk:src/components/Tag/style.module.scss */

package/lib/index.d.ts

@@ -14,7 +14,7 @@ import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { PopoverProps, PopoverPortalProps } from '@radix-ui/react-popover';
 import { IllustProps } from '@liner-fe/illust';
 
-declare const objectToArray: <T extends Record<string, unknown>>(obj: T) => [string, unknown][];
+declare const objectToArray: <T extends Record<string, unknown>>(obj: T) => [keyof T, T[keyof T]][];
 declare const arrayToStyleObject: <T extends SystemKeys>(colorKeys: T[], style: {
     readonly [key: string]: string;
 }, prefix?: string) => Partial<Record<SystemKeys, string>>;
@@ -470,7 +470,7 @@ declare const useSnackbar: () => {
 
 declare const defaultLabelVariants: (props?: ({
     level?: "primary" | "secondary" | undefined;
-    position?: "right" | "top" | undefined;
+    position?: "top" | "right" | undefined;
     size?: "l" | "m" | "s" | undefined;
     offset?: "medium" | "high" | "low" | undefined;
     disabled?: boolean | undefined;
@@ -523,7 +523,7 @@ declare const TextButton: react.ForwardRefExoticComponent<TextButtonProps & reac
 
 type LoadingSizeType = 'xl' | 'l' | 'm' | 's' | 'xs';
 type LoadingLevelType = 'brand-label-primary' | 'neutral-label-primary' | 'neutral-label-static-primary' | 'inverse-label-primary' | 'inverse-label-static-primary';
-interface LoadingProps {
+interface LoadingProps extends HTMLAttributes<HTMLSpanElement> {
     size?: LoadingSizeType;
     level?: LoadingLevelType;
     type?: 'dots' | 'spinner';
@@ -563,6 +563,7 @@ interface PrimitiveCoachMarkContentProps extends PopoverPrimitive.PopoverContent
 declare const PrimitiveCoachMark: (({ trigger, children, ...props }: PrimitiveCoachMarkRootProps) => react_jsx_runtime.JSX.Element) & {
     Content: react.ForwardRefExoticComponent<PrimitiveCoachMarkContentProps & react.RefAttributes<HTMLDivElement>>;
     Portal: react.FC<PopoverPrimitive.PopoverPortalProps>;
+    Close: ({ className }: HTMLAttributes<HTMLOrSVGElement>) => react_jsx_runtime.JSX.Element;
 };
 
 interface Step {

package/lib/index.js

@@ -1,9 +1,14 @@
 var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 
+// src/utils/typedObjectEntries.ts
+var typedObjectEntries = /* @__PURE__ */ __name((obj) => {
+  return Object.entries(obj);
+}, "typedObjectEntries");
+
 // src/utils/object.ts
 var objectToArray = /* @__PURE__ */ __name((obj) => {
-  return Object.entries(obj);
+  return typedObjectEntries(obj);
 }, "objectToArray");
 var arrayToStyleObject = /* @__PURE__ */ __name((colorKeys, style, prefix) => colorKeys.reduce(
   (acc, value) => ({ ...acc, [value]: prefix ? style[`${prefix}-${value}`] : style[value] }),
@@ -20,31 +25,31 @@ import {
 
 // src/components/Button/style.module.scss
 var style_module_default = {
-  "button": "_button_60r7l_1",
-  "default": "_default_60r7l_28",
-  "primary": "_primary_60r7l_36",
-  "secondary": "_secondary_60r7l_44",
-  "tertiary": "_tertiary_60r7l_52",
-  "quaternary": "_quaternary_60r7l_60",
-  "quinary": "_quinary_60r7l_77",
-  "negative": "_negative_60r7l_92",
-  "static": "_static_60r7l_100",
-  "inverse-static": "_inverse-static_60r7l_108",
-  "ghost": "_ghost_60r7l_116",
-  "cta": "_cta_60r7l_151",
-  "l": "_l_60r7l_159",
-  "m": "_m_60r7l_166",
-  "s": "_s_60r7l_44",
-  "align-center": "_align-center_60r7l_180",
-  "align-space-between": "_align-space-between_60r7l_185",
-  "content": "_content_60r7l_190",
-  "full": "_full_60r7l_196",
-  "fit-content": "_fit-content_60r7l_200",
-  "children": "_children_60r7l_204",
-  "cta-children": "_cta-children_60r7l_210",
-  "l-children": "_l-children_60r7l_215",
-  "m-children": "_m-children_60r7l_220",
-  "s-children": "_s-children_60r7l_225"
+  "button": "_button_1k6qi_1",
+  "default": "_default_1k6qi_28",
+  "primary": "_primary_1k6qi_36",
+  "secondary": "_secondary_1k6qi_44",
+  "tertiary": "_tertiary_1k6qi_52",
+  "quaternary": "_quaternary_1k6qi_60",
+  "quinary": "_quinary_1k6qi_77",
+  "negative": "_negative_1k6qi_92",
+  "static": "_static_1k6qi_100",
+  "inverse-static": "_inverse-static_1k6qi_108",
+  "ghost": "_ghost_1k6qi_116",
+  "cta": "_cta_1k6qi_151",
+  "l": "_l_1k6qi_159",
+  "m": "_m_1k6qi_166",
+  "s": "_s_1k6qi_44",
+  "align-center": "_align-center_1k6qi_180",
+  "align-space-between": "_align-space-between_1k6qi_185",
+  "content": "_content_1k6qi_190",
+  "full": "_full_1k6qi_196",
+  "fit-content": "_fit-content_1k6qi_200",
+  "children": "_children_1k6qi_204",
+  "cta-children": "_cta-children_1k6qi_211",
+  "l-children": "_l-children_1k6qi_216",
+  "m-children": "_m-children_1k6qi_221",
+  "s-children": "_s-children_1k6qi_226"
 };
 
 // src/components/Button/index.tsx
@@ -96,8 +101,12 @@ var dotsLoaderVariants = cva({
     }
   }
 });
-var DotsLoader = /* @__PURE__ */ __name(({ size: size4 = "m", level = "inverse-label-static-primary" }) => {
-  return /* @__PURE__ */ jsxs("div", { className: style_module_default2["dots-loader-container"], children: [
+var DotsLoader = /* @__PURE__ */ __name(({
+  size: size4 = "m",
+  level = "inverse-label-static-primary",
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: style_module_default2["dots-loader-container"], ...props, children: [
     /* @__PURE__ */ jsx("div", { className: dotsLoaderVariants({ size: size4, level }) }),
     /* @__PURE__ */ jsx("div", { className: dotsLoaderVariants({ size: size4, level }) }),
     /* @__PURE__ */ jsx("div", { className: dotsLoaderVariants({ size: size4, level }) })
@@ -124,9 +133,10 @@ var spinnerLoaderVariants = cva({
 });
 var SpinnerLoader = /* @__PURE__ */ __name(({
   size: size4 = "m",
-  level = "inverse-label-static-primary"
+  level = "inverse-label-static-primary",
+  ...props
 }) => {
-  return /* @__PURE__ */ jsx("span", { className: spinnerLoaderVariants({ size: size4, level }) });
+  return /* @__PURE__ */ jsx("span", { className: spinnerLoaderVariants({ size: size4, level }), ...props });
 }, "SpinnerLoader");
 
 // src/components/Button/index.tsx
@@ -274,7 +284,32 @@ var DefaultButton = forwardRef(
       isLoading ? !!leftIcon || !!rightIcon ? /* @__PURE__ */ jsxs2(Fragment, { children: [
         /* @__PURE__ */ jsx2(Loading, { size: buttonLoadingSizeMap[size4], level: buttonLoadingLevelMap[level] }),
         /* @__PURE__ */ jsx2("p", { className: style_module_default.content, children: children2 })
-      ] }) : /* @__PURE__ */ jsx2(Loading, { size: buttonLoadingSizeMap[size4], level: buttonLoadingLevelMap[level] }) : /* @__PURE__ */ jsx2("p", { className: style_module_default.content, children: children2 }),
+      ] }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
+        /* @__PURE__ */ jsx2(
+          Loading,
+          {
+            size: buttonLoadingSizeMap[size4],
+            level: buttonLoadingLevelMap[level],
+            style: {
+              position: "absolute",
+              left: "50%",
+              top: "50%",
+              transform: "translate(-50%, -50%)",
+              margin: "auto"
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "p",
+          {
+            className: style_module_default.content,
+            style: {
+              opacity: 0
+            },
+            children: children2
+          }
+        )
+      ] }) : /* @__PURE__ */ jsx2("p", { className: style_module_default.content, children: children2 }),
       !!rightIcon && !isLoading && /* @__PURE__ */ jsx2(rightIcon.icon, { ...iconProps, ...rightIcon })
     ] }), "renderContent");
     if (asChild) {
@@ -7910,12 +7945,14 @@ import { forwardRef as forwardRef28 } from "react";
 
 // src/components/coach-mark/primitive/style.module.scss
 var style_module_default18 = {
-  "anchor": "_anchor_1pmfi_1",
-  "content": "_content_1pmfi_5",
-  "overlay": "_overlay_1pmfi_11"
+  "anchor": "_anchor_1d9jc_1",
+  "content": "_content_1d9jc_5",
+  "overlay": "_overlay_1d9jc_14",
+  "close": "_close_1d9jc_24"
 };
 
 // src/components/coach-mark/primitive/index.tsx
+import { IconCloseFill as IconCloseFill4 } from "@liner-fe/icon";
 import { jsx as jsx41, jsxs as jsxs15 } from "react/jsx-runtime";
 var primitiveCoachMarkVariants = cva9({
   base: style_module_default18.content
@@ -7948,6 +7985,7 @@ var PrimitiveCoachMarkAnchor = /* @__PURE__ */ __name(({ className }) => /* @__P
     )
   }
 ), "PrimitiveCoachMarkAnchor");
+var PrimitiveCoachMarkClose = /* @__PURE__ */ __name(({ className }) => /* @__PURE__ */ jsx41(Close, { asChild: true, className: clsx19(style_module_default18.close, className), children: /* @__PURE__ */ jsx41(IconCloseFill4, { fill: true, size: "xs", type: "neutral-label-static-primary" }) }), "PrimitiveCoachMarkClose");
 var PrimitiveCoachMarkContent = forwardRef28(({ children, className, container, ...rest }, ref) => /* @__PURE__ */ jsx41(Portal2, { container, children: /* @__PURE__ */ jsxs15(
   Content2,
   {
@@ -7963,20 +8001,23 @@ var PrimitiveCoachMarkContent = forwardRef28(({ children, className, container,
 PrimitiveCoachMarkContent.displayName = "CoachMarkContent";
 var PrimitiveCoachMark = Object.assign(PrimitiveCoachMarkRoot, {
   Content: PrimitiveCoachMarkContent,
-  Portal: Portal2
+  Portal: Portal2,
+  Close: PrimitiveCoachMarkClose
 });
 
 // src/components/coach-mark/compact/index.tsx
-import { forwardRef as forwardRef30 } from "react";
+import { forwardRef as forwardRef30, useState as useState19 } from "react";
 
 // src/components/coach-mark/compact/style.module.scss
 var style_module_default19 = {
-  "content": "_content_1tkjk_1",
-  "slideIn": "_slideIn_1tkjk_1",
-  "closeButton": "_closeButton_1tkjk_20",
-  "brand": "_brand_1tkjk_24",
-  "inverse-static": "_inverse-static_1tkjk_31",
-  "inverse": "_inverse_1tkjk_31"
+  "content": "_content_mrnt5_1",
+  "slideIn": "_slideIn_mrnt5_1",
+  "closeButton": "_closeButton_mrnt5_20",
+  "brand": "_brand_mrnt5_24",
+  "inverse-static": "_inverse-static_mrnt5_31",
+  "inverse": "_inverse_mrnt5_31",
+  "close": "_close_mrnt5_20",
+  "main": "_main_mrnt5_52"
 };
 
 // src/components/coach-mark/compact/index.tsx
@@ -8194,27 +8235,43 @@ var compactCoachMarkVariants = cva11({
 var CompactCoachMarkRoot = /* @__PURE__ */ __name((props) => {
   return /* @__PURE__ */ jsx43(PrimitiveCoachMark, { ...props });
 }, "CompactCoachMarkRoot");
-var CompactCoachMarkContent = forwardRef30(({ tag, title, level = "brand", className, side = "top", sideOffset = -15, ...props }, ref) => /* @__PURE__ */ jsxs16(
-  PrimitiveCoachMark.Content,
-  {
-    ref,
-    className: clsx21(compactCoachMarkVariants({ level }), className),
-    side,
-    sideOffset,
-    ...props,
-    children: [
-      tag && /* @__PURE__ */ jsx43(
-        Tag,
-        {
-          color: level === "inverse" ? "neutral-label-primary" : "neutral-label-static-primary",
-          backgroundColor: level === "inverse" ? "neutral-container-lowest" : "neutral-container-static-lowest",
-          children: tag
-        }
-      ),
-      /* @__PURE__ */ jsx43(Caption, { size: 2, type: "normal", weight: "bold", color: "inverse-label-static-primary", children: title })
-    ]
-  }
-));
+var CompactCoachMarkContent = forwardRef30(({ tag, title, level = "brand", className, side = "top", sideOffset = -15, ...props }, ref) => {
+  const [isHover, setIsHover] = useState19(false);
+  return /* @__PURE__ */ jsxs16(
+    PrimitiveCoachMark.Content,
+    {
+      ref,
+      className: clsx21(compactCoachMarkVariants({ level }), className),
+      side,
+      sideOffset,
+      onMouseEnter: () => setIsHover(true),
+      onMouseLeave: () => setIsHover(false),
+      ...props,
+      children: [
+        tag && /* @__PURE__ */ jsx43(
+          Tag,
+          {
+            color: level === "inverse" ? "neutral-label-primary" : "neutral-label-static-primary",
+            backgroundColor: level === "inverse" ? "neutral-container-lowest" : "neutral-container-static-lowest",
+            children: tag
+          }
+        ),
+        /* @__PURE__ */ jsx43(
+          Caption,
+          {
+            size: 2,
+            type: "normal",
+            weight: "bold",
+            color: "inverse-label-static-primary",
+            className: style_module_default19.main,
+            children: title
+          }
+        ),
+        isHover && /* @__PURE__ */ jsx43(PrimitiveCoachMark.Close, { className: style_module_default19.close })
+      ]
+    }
+  );
+});
 CompactCoachMarkContent.displayName = "CompactCoachMarkContent";
 var CompactCoachMark = Object.assign(CompactCoachMarkRoot, {
   Content: CompactCoachMarkContent,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liner-fe/prism",
-  "version": "2.8.26",
+  "version": "2.8.28",
   "type": "module",
   "sideEffects": false,
   "scripts": {