@lotte-innovate/ui-component-test 0.2.76 → 0.2.78

package/dist/lib/components/Dialog/DialogCancel.js

@@ -27,7 +27,6 @@ import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
 import { DialogContext } from './DialogRoot';
 import { cn } from '../../../lib/utils/utils';
-import Text from '../../../lib/Typography/Text';
 export var dialogCancelVariants = cva("rounded-md font-medium inline-flex justify-center items-center text-slate-11 bg-slate-3 outline-none border-none\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4\n    active:border-none hover:cursor-pointer hover:bg-slateA-4", {
     variants: {
         radius: {
@@ -52,6 +51,6 @@ export var dialogCancelVariants = cva("rounded-md font-medium inline-flex justif
 export var DialogCancel = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     var _b = useContext(DialogContext), radius = _b.radius, size = _b.size;
-    return (_jsx(DialogPrimitive.Close, __assign({ ref: ref, className: cn(dialogCancelVariants({ radius: radius, size: size }), className) }, props, { children: typeof children === 'string' ? _jsx(Text, { children: children }) : children })));
+    return (_jsx(DialogPrimitive.Close, __assign({ ref: ref, className: cn(dialogCancelVariants({ radius: radius, size: size }), className) }, props, { children: children })));
 });
 DialogCancel.displayName = 'Dialog.Cancel';

package/dist/lib/components/Dialog/DialogCancel.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as e}from"react/jsx-runtime";import{forwardRef as r,useContext as t}from"react";import*as o from"@radix-ui/react-dialog";import{cva as a}from"class-variance-authority";import{DialogContext as n}from"./DialogRoot.mjs";import{cn as i}from"../../utils/utils.mjs";import{Text as l}from"../../Typography/Text/index.mjs";var s=function(){return s=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var a in r=arguments[t])Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a]);return e},s.apply(this,arguments)},m=function(e,r){var t={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(e);a<o.length;a++)r.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(e,o[a])&&(t[o[a]]=e[o[a]])}return t},p=a("rounded-md font-medium inline-flex justify-center items-center text-slate-11 bg-slate-3 outline-none border-none\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4\n    active:border-none hover:cursor-pointer hover:bg-slateA-4",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded-md",full:"rounded-full"},size:{small:"text-xs w-[52px] h-[24px] px-2 mr-2",medium:"text-sm w-[66px] h-[32px] px-3 mr-2",large:"text-base w-[72px] h-[32px] px-3 mr-3","x-large":"text-lg w-[86px] h-[40px] px-6 mr-4"}},defaultVariants:{radius:"medium",size:"medium"}}),d=r((function(r,a){var d=r.children,u=r.className,c=m(r,["children","className"]),x=t(n),f=x.radius,g=x.size;return e(o.Close,s({ref:a,className:i(p({radius:f,size:g}),u)},c,{children:"string"==typeof d?e(l,{children:d}):d}))}));d.displayName="Dialog.Cancel";export{d as DialogCancel,p as dialogCancelVariants};
+import{jsx as e}from"react/jsx-runtime";import{forwardRef as r,useContext as t}from"react";import*as a from"@radix-ui/react-dialog";import{cva as o}from"class-variance-authority";import{DialogContext as n}from"./DialogRoot.mjs";import{cn as i}from"../../utils/utils.mjs";var l=function(){return l=Object.assign||function(e){for(var r,t=1,a=arguments.length;t<a;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e},l.apply(this,arguments)},s=function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(e);o<a.length;o++)r.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(e,a[o])&&(t[a[o]]=e[a[o]])}return t},m=o("rounded-md font-medium inline-flex justify-center items-center text-slate-11 bg-slate-3 outline-none border-none\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4\n    active:border-none hover:cursor-pointer hover:bg-slateA-4",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded-md",full:"rounded-full"},size:{small:"text-xs w-[52px] h-[24px] px-2 mr-2",medium:"text-sm w-[66px] h-[32px] px-3 mr-2",large:"text-base w-[72px] h-[32px] px-3 mr-3","x-large":"text-lg w-[86px] h-[40px] px-6 mr-4"}},defaultVariants:{radius:"medium",size:"medium"}}),d=r((function(r,o){var d=r.children,p=r.className,u=s(r,["children","className"]),c=t(n),x=c.radius,f=c.size;return e(a.Close,l({ref:o,className:i(m({radius:x,size:f}),p)},u,{children:d}))}));d.displayName="Dialog.Cancel";export{d as DialogCancel,m as dialogCancelVariants};
 //# sourceMappingURL=DialogCancel.mjs.map

package/dist/lib/components/Dialog/DialogContent.js

@@ -53,6 +53,6 @@ export var dialogContentVariants = cva("fixed max-h-[85vh] top-[50%] left-[50%]
 export var DialogContent = forwardRef(function (_a, forwardedRef) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     var _b = useContext(DialogContext), radius = _b.radius, size = _b.size, scaling = _b.scaling;
-    return (_jsxs(DialogPrimitive.Portal, { children: [_jsx(DialogPrimitive.Overlay, { className: "fixed inset-0 bg-[#00000066] data-[state=open]:animate-overlayShow" }), _jsx(DialogPrimitive.Content, __assign({ ref: forwardedRef, "aria-describedby": undefined, className: cn(dialogContentVariants({ radius: radius, scaling: scaling, size: size }), className) }, props, { children: children }))] }));
+    return (_jsxs(DialogPrimitive.Portal, { children: [_jsx(DialogPrimitive.Overlay, { style: { backgroundColor: '#00000066' }, className: "fixed inset-0 data-[state=open]:animate-overlayShow" }), _jsx(DialogPrimitive.Content, __assign({ ref: forwardedRef, "aria-describedby": undefined, className: cn(dialogContentVariants({ radius: radius, scaling: scaling, size: size }), className) }, props, { children: children }))] }));
 });
 DialogContent.displayName = 'Dialog.Content';

package/dist/lib/components/Dialog/DialogContent.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import{forwardRef as a,useContext as t}from"react";import{cva as n}from"class-variance-authority";import*as o from"@radix-ui/react-dialog";import{scalingVariants as i}from"../../constants.mjs";import{DialogContext as l}from"./DialogRoot.mjs";import{cn as s}from"../../utils/utils.mjs";var p=function(){return p=Object.assign||function(e){for(var r,a=1,t=arguments.length;a<t;a++)for(var n in r=arguments[a])Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n]);return e},p.apply(this,arguments)},m=function(e,r){var a={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&r.indexOf(t)<0&&(a[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(t=Object.getOwnPropertySymbols(e);n<t.length;n++)r.indexOf(t[n])<0&&Object.prototype.propertyIsEnumerable.call(e,t[n])&&(a[t[n]]=e[t[n]])}return a},d=n("fixed max-h-[85vh] top-[50%] left-[50%] focus:outline-none\n  translate-x-[-50%] translate-y-[-50%] data-[state=open]:animate-contentShow bg-white dark:bg-slateDark-1 \n  shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px]",{variants:{radius:{none:"rounded-none",small:"rounded",medium:"rounded-lg",large:"rounded-xl",full:"rounded-xl"},size:{small:"p-3 w-[300px]",medium:"p-4 w-[400px]",large:"p-5 w-[500px]","x-large":"p-6 w-[600px]"},scaling:p({},i)},defaultVariants:{radius:"medium",size:"medium"}}),c=a((function(a,n){var i=a.children,c=a.className,u=m(a,["children","className"]),f=t(l),x=f.radius,g=f.size,h=f.scaling;return e(o.Portal,{children:[r(o.Overlay,{className:"fixed inset-0 bg-[#00000066] data-[state=open]:animate-overlayShow"}),r(o.Content,p({ref:n,"aria-describedby":void 0,className:s(d({radius:x,scaling:h,size:g}),c)},u,{children:i}))]})}));c.displayName="Dialog.Content";export{c as DialogContent,d as dialogContentVariants};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import{forwardRef as a,useContext as t}from"react";import{cva as o}from"class-variance-authority";import*as n from"@radix-ui/react-dialog";import{scalingVariants as i}from"../../constants.mjs";import{DialogContext as l}from"./DialogRoot.mjs";import{cn as s}from"../../utils/utils.mjs";var p=function(){return p=Object.assign||function(e){for(var r,a=1,t=arguments.length;a<t;a++)for(var o in r=arguments[a])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e},p.apply(this,arguments)},m=function(e,r){var a={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&r.indexOf(t)<0&&(a[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(t=Object.getOwnPropertySymbols(e);o<t.length;o++)r.indexOf(t[o])<0&&Object.prototype.propertyIsEnumerable.call(e,t[o])&&(a[t[o]]=e[t[o]])}return a},d=o("fixed max-h-[85vh] top-[50%] left-[50%] focus:outline-none\n  translate-x-[-50%] translate-y-[-50%] data-[state=open]:animate-contentShow bg-white dark:bg-slateDark-1 \n  shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px]",{variants:{radius:{none:"rounded-none",small:"rounded",medium:"rounded-lg",large:"rounded-xl",full:"rounded-xl"},size:{small:"p-3 w-[300px]",medium:"p-4 w-[400px]",large:"p-5 w-[500px]","x-large":"p-6 w-[600px]"},scaling:p({},i)},defaultVariants:{radius:"medium",size:"medium"}}),c=a((function(a,o){var i=a.children,c=a.className,u=m(a,["children","className"]),f=t(l),x=f.radius,y=f.size,g=f.scaling;return e(n.Portal,{children:[r(n.Overlay,{style:{backgroundColor:"#00000066"},className:"fixed inset-0 data-[state=open]:animate-overlayShow"}),r(n.Content,p({ref:o,"aria-describedby":void 0,className:s(d({radius:x,scaling:g,size:y}),c)},u,{children:i}))]})}));c.displayName="Dialog.Content";export{c as DialogContent,d as dialogContentVariants};
 //# sourceMappingURL=DialogContent.mjs.map

package/dist/lib/components/Editor/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { IAllProps } from '@tinymce/tinymce-react';
 import { VariantProps } from 'class-variance-authority';
+import 'tinymce/skins/ui/oxide/skin.css';
 export interface EditorProps extends VariantProps<typeof editorVariants> {
     language?: 'ko_KR' | 'zh_CN' | 'ja' | 'it' | 'vi';
 }

package/dist/lib/components/Editor/index.js

@@ -10,42 +10,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -57,23 +21,18 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { useState, forwardRef, useEffect, useRef, } from 'react';
 import { Editor as EditorUI } from '@tinymce/tinymce-react';
 import { cva } from 'class-variance-authority';
 import { loadTinymce } from '../../../lib/utils/useLoadTinyMCE';
-import { useDarkMode } from '../../../lib/utils/useDarkMode';
 import { scalingVariants, radiusVariants } from '../../../lib/constants';
-import { Spinner } from '../../../lib/components/Spinner/index';
 import { cn } from '../../../lib/utils/utils';
 import { useTheme } from '../../../lib/theme';
 import { marked } from 'marked';
-// import 'tinymce/skins/ui/oxide/skin.css';
-// import 'tinymce/skins/ui/oxide-dark/skin.css';
+import 'tinymce/skins/ui/oxide/skin.css';
 import contentUiSkinCss from '!!raw-loader!tinymce/skins/ui/oxide/content.css';
 import contentCss from '!!raw-loader!tinymce/skins/content/default/content.css';
-import contentUiDarkSkinCss from '!!raw-loader!tinymce/skins/ui/oxide-dark/content.css';
-import contentDarkCss from '!!raw-loader!tinymce/skins/content/dark/content.css';
 var editorVariants = cva('', {
     variants: {
         radius: __assign({}, radiusVariants['base']),
@@ -93,45 +52,13 @@ var editorVariants = cva('', {
 export var Editor = forwardRef(function (_a, ref) {
     var className = _a.className, size = _a.size, scaling = _a.scaling, radius = _a.radius, init = _a.init, _b = _a.language, language = _b === void 0 ? 'en' : _b, props = __rest(_a, ["className", "size", "scaling", "radius", "init", "language"]);
     var _c = useState(false), isClient = _c[0], setIsClient = _c[1];
-    var _d = useDarkMode(), isDark = _d[0], defaultScales = _d[1];
     var editorRef = useRef(null);
-    var _e = useState(0), editorKey = _e[0], setEditorKey = _e[1];
-    var _f = useState(true), isLoading = _f[0], setIsLoading = _f[1];
-    var _g = useState(false), isEditorInit = _g[0], setIsEditorInit = _g[1];
     var theme = useTheme().theme;
     var editorStyle = {
         radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius,
         scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
         size: size,
     };
-    useEffect(function () {
-        var loadSkin = function () { return __awaiter(void 0, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        if (!isDark) return [3 /*break*/, 2];
-                        return [4 /*yield*/, import('tinymce/skins/ui/oxide-dark/skin.css')];
-                    case 1:
-                        _a.sent();
-                        return [3 /*break*/, 4];
-                    case 2: return [4 /*yield*/, import('tinymce/skins/ui/oxide/skin.css')];
-                    case 3:
-                        _a.sent();
-                        _a.label = 4;
-                    case 4:
-                        // 에디터를 다시 로드하기 위해 key 변경
-                        setEditorKey(function (prevKey) { return prevKey + 1; });
-                        return [2 /*return*/];
-                }
-            });
-        }); };
-        loadSkin();
-    }, [isDark]);
-    var getContentStyle = function () {
-        var baseStyle = "".concat(contentUiSkinCss, "\n").concat(contentCss, "\n body { font-family:Noto Sans KR, sans-serif, Nunito Sans, Helvetica Neue, Helvetica }");
-        var darkStyle = "".concat(contentUiDarkSkinCss, "\n").concat(contentDarkCss, "\n body { font-family:Noto Sans KR, sans-serif, Nunito Sans, Helvetica Neue, Helvetica }");
-        return isDark ? baseStyle : baseStyle;
-    };
     var radiusTheme = '8px';
     if (editorStyle.radius === 'none')
         radiusTheme = '0px';
@@ -157,37 +84,32 @@ export var Editor = forwardRef(function (_a, ref) {
     if (!isClient) {
         return null;
     }
-    var handleEditorInit = function (evt, editor) {
-        editorRef.current = editor;
-        setIsLoading(false);
-        setIsEditorInit(true);
-    };
-    return (_jsxs("div", { className: cn(editorVariants(editorStyle), 'flex items-center justify-center', className), ref: ref, children: [isLoading && _jsx(Spinner, {}), isEditorInit && (_jsx(EditorUI, __assign({ onInit: handleEditorInit, init: __assign({ language: language, width: '100%', height: '100%', promotion: false, plugins: 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount charmap accordion', menubar: 'file edit view insert format tools table', toolbar: 'undo redo | accordion accordionremove | blocks fontfamily fontsize | bold italic underline strikethrough | align numlist bullist | link image | table media | lineheight outdent indent| forecolor backcolor removeformat | charmap | code fullscreen preview | save print | pagebreak anchor codesample | ltr rtl', autosave_ask_before_unload: true, autosave_interval: '30s', autosave_restore_when_empty: false, autosave_retention: '2m', image_advtab: true, image_caption: true, quickbars_selection_toolbar: '', toolbar_mode: 'sliding', skin: false, content_css: false, content_style: getContentStyle(), setup: function (editor) {
-                        editor.ui.registry.addButton('inlinecode', {
-                            icon: 'sourcecode',
-                            tooltip: 'Inline code',
-                            onAction: function () {
-                                editor.formatter.toggle('code');
-                            },
-                        });
-                        editor.on('init', function () {
-                            editor.formatter.register('code', {
-                                inline: 'code',
-                                remove: 'all',
-                            });
-                        });
-                        editor.ui.registry.addButton('markdown', {
-                            text: 'Markdown',
-                            onAction: function () {
-                                var content = editor.getContent({ format: 'text' });
-                                var html = marked(content);
-                                editor.setContent(html);
-                            },
-                        });
-                        editor.on('init', function () {
-                            editor.getContainer().style.borderRadius = radiusTheme;
+    return (_jsx("div", { className: cn(editorVariants(editorStyle), className), ref: ref, children: _jsx(EditorUI, __assign({ onInit: function (evt, editor) { return (editorRef.current = editor); }, init: __assign({ language: language, width: '100%', height: '100%', promotion: false, plugins: 'preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount charmap accordion', menubar: 'file edit view insert format tools table', toolbar: 'undo redo | accordion accordionremove | blocks fontfamily fontsize | bold italic underline strikethrough | align numlist bullist | link image | table media | lineheight outdent indent| forecolor backcolor removeformat | charmap | code fullscreen preview | save print | pagebreak anchor codesample | ltr rtl', autosave_ask_before_unload: true, autosave_interval: '30s', autosave_restore_when_empty: false, autosave_retention: '2m', image_advtab: true, image_caption: true, quickbars_selection_toolbar: '', toolbar_mode: 'sliding', skin: false, content_css: false, content_style: "".concat(contentUiSkinCss, "\n").concat(contentCss, "\n body { font-family:Noto Sans KR, sans-serif, Nunito Sans, Helvetica Neue, Helvetica }"), setup: function (editor) {
+                    editor.ui.registry.addButton('inlinecode', {
+                        icon: 'sourcecode',
+                        tooltip: 'Inline code',
+                        onAction: function () {
+                            editor.formatter.toggle('code');
+                        },
+                    });
+                    editor.on('init', function () {
+                        editor.formatter.register('code', {
+                            inline: 'code',
+                            remove: 'all',
                         });
-                    } }, init) }, props), editorKey))] }));
+                    });
+                    editor.ui.registry.addButton('markdown', {
+                        text: 'Markdown',
+                        onAction: function () {
+                            var content = editor.getContent({ format: 'text' });
+                            var html = marked(content);
+                            editor.setContent(html);
+                        },
+                    });
+                    editor.on('init', function () {
+                        editor.getContainer().style.borderRadius = radiusTheme;
+                    });
+                } }, init) }, props)) }));
 });
 Editor.displayName = 'Editor';
 export default Editor;

package/dist/lib/components/Editor/index.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{forwardRef as n,useState as r,useRef as i,useEffect as o}from"react";import{Editor as a}from"@tinymce/tinymce-react";import{cva as s}from"class-variance-authority";import{loadTinymce as c}from"../../utils/useLoadTinyMCE.mjs";import{useDarkMode as l}from"../../utils/useDarkMode.mjs";import{radiusVariants as u,scalingVariants as m}from"../../constants.mjs";import{Spinner as d}from"../Spinner/index.mjs";import{cn as f}from"../../utils/utils.mjs";import{useTheme as p}from"../../theme/ThemeProvider.mjs";import{marked as h}from"marked";import y from"!!raw-loader!tinymce/skins/ui/oxide/content.css";import b from"!!raw-loader!tinymce/skins/content/default/content.css";import"!!raw-loader!tinymce/skins/ui/oxide-dark/content.css";import"!!raw-loader!tinymce/skins/content/dark/content.css";var v=function(){return v=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var i in t=arguments[n])Object.prototype.hasOwnProperty.call(t,i)&&(e[i]=t[i]);return e},v.apply(this,arguments)},g=function(e,t,n,r){return new(n||(n=Promise))((function(i,o){function a(e){try{c(r.next(e))}catch(e){o(e)}}function s(e){try{c(r.throw(e))}catch(e){o(e)}}function c(e){var t;e.done?i(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(a,s)}c((r=r.apply(e,t||[])).next())}))},k=function(e,t){var n,r,i,o,a={label:0,sent:function(){if(1&i[0])throw i[1];return i[1]},trys:[],ops:[]};return o={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function s(s){return function(c){return function(s){if(n)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(a=0)),a;)try{if(n=1,r&&(i=2&s[0]?r.return:s[0]?r.throw||((i=r.return)&&i.call(r),0):r.next)&&!(i=i.call(r,s[1])).done)return i;switch(r=0,i&&(s=[2&s[0],i.value]),s[0]){case 0:case 1:i=s;break;case 4:return a.label++,{value:s[1],done:!1};case 5:a.label++,r=s[1],s=[0];continue;case 7:s=a.ops.pop(),a.trys.pop();continue;default:if(!(i=a.trys,(i=i.length>0&&i[i.length-1])||6!==s[0]&&2!==s[0])){a=0;continue}if(3===s[0]&&(!i||s[1]>i[0]&&s[1]<i[3])){a.label=s[1];break}if(6===s[0]&&a.label<i[1]){a.label=i[1],i=s;break}if(i&&a.label<i[2]){a.label=i[2],a.ops.push(s);break}i[2]&&a.ops.pop(),a.trys.pop();continue}s=t.call(e,a)}catch(e){s=[6,e],r=0}finally{n=i=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,c])}}},w=function(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(r=Object.getOwnPropertySymbols(e);i<r.length;i++)t.indexOf(r[i])<0&&Object.prototype.propertyIsEnumerable.call(e,r[i])&&(n[r[i]]=e[r[i]])}return n},x=s("",{variants:{radius:v({},u.base),scaling:v({},m),size:{small:"w-[650px] h-[350px]",medium:"w-[700px] h-[400px]",large:"w-[750px] h-[450px]"}},defaultVariants:{radius:"medium",scaling:"100%",size:"medium"}}),_=n((function(n,s){var u=n.className,m=n.size,_=n.scaling,j=n.radius,O=n.init,S=n.language,N=void 0===S?"en":S,z=w(n,["className","size","scaling","radius","init","language"]),P=r(!1),C=P[0],E=P[1],R=l()[0],I=i(null),M=r(0),T=M[0],A=M[1],B=r(!0),H=B[0],q=B[1],D=r(!1),G=D[0],K=D[1],L=p().theme,V={radius:null!=j?j:L.themeRadius,scaling:null!=_?_:L.themeScaling,size:m};o((function(){g(void 0,void 0,void 0,(function(){return k(this,(function(e){switch(e.label){case 0:return R?[4,import("tinymce/skins/ui/oxide-dark/skin.css")]:[3,2];case 1:return e.sent(),[3,4];case 2:return[4,import("tinymce/skins/ui/oxide/skin.css")];case 3:e.sent(),e.label=4;case 4:return A((function(e){return e+1})),[2]}}))}))}),[R]);var F="8px";if("none"===V.radius&&(F="0px"),"small"===V.radius&&(F="4px"),"large"===V.radius&&(F="12px"),"full"===V.radius&&(F="16px"),o((function(){c().then((function(){E(!0)}))}),[]),o((function(){if(I.current){var e=I.current.getContainer();e&&(e.style.borderRadius="".concat(F))}}),[F]),!C)return null;var J;return e("div",{className:f(x(V),"flex items-center justify-center",u),ref:s,children:[H&&t(d,{}),G&&t(a,v({onInit:function(e,t){I.current=t,q(!1),K(!0)},init:v({language:N,width:"100%",height:"100%",promotion:!1,plugins:"preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount charmap accordion",menubar:"file edit view insert format tools table",toolbar:"undo redo | accordion accordionremove | blocks fontfamily fontsize | bold italic underline strikethrough | align numlist bullist | link image | table media | lineheight outdent indent| forecolor backcolor removeformat | charmap | code fullscreen preview | save print | pagebreak anchor codesample | ltr rtl",autosave_ask_before_unload:!0,autosave_interval:"30s",autosave_restore_when_empty:!1,autosave_retention:"2m",image_advtab:!0,image_caption:!0,quickbars_selection_toolbar:"",toolbar_mode:"sliding",skin:!1,content_css:!1,content_style:(J="".concat(y,"\n").concat(b,"\n body { font-family:Noto Sans KR, sans-serif, Nunito Sans, Helvetica Neue, Helvetica }"),J),setup:function(e){e.ui.registry.addButton("inlinecode",{icon:"sourcecode",tooltip:"Inline code",onAction:function(){e.formatter.toggle("code")}}),e.on("init",(function(){e.formatter.register("code",{inline:"code",remove:"all"})})),e.ui.registry.addButton("markdown",{text:"Markdown",onAction:function(){var t=e.getContent({format:"text"}),n=h(t);e.setContent(n)}}),e.on("init",(function(){e.getContainer().style.borderRadius=F}))}},O)},z),T)]})}));_.displayName="Editor";export{_ as Editor,_ as default};
+import{jsx as e}from"react/jsx-runtime";import{forwardRef as t,useState as n,useRef as i,useEffect as o}from"react";import{Editor as r}from"@tinymce/tinymce-react";import{cva as a}from"class-variance-authority";import{loadTinymce as s}from"../../utils/useLoadTinyMCE.mjs";import{radiusVariants as l,scalingVariants as c}from"../../constants.mjs";import{cn as u}from"../../utils/utils.mjs";import{useTheme as m}from"../../theme/ThemeProvider.mjs";import{marked as d}from"marked";import"tinymce/skins/ui/oxide/skin.css";import p from"!!raw-loader!tinymce/skins/ui/oxide/content.css";import f from"!!raw-loader!tinymce/skins/content/default/content.css";var g=function(){return g=Object.assign||function(e){for(var t,n=1,i=arguments.length;n<i;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},g.apply(this,arguments)},v=function(e,t){var n={};for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&t.indexOf(i)<0&&(n[i]=e[i]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(i=Object.getOwnPropertySymbols(e);o<i.length;o++)t.indexOf(i[o])<0&&Object.prototype.propertyIsEnumerable.call(e,i[o])&&(n[i[o]]=e[i[o]])}return n},b=a("",{variants:{radius:g({},l.base),scaling:g({},c),size:{small:"w-[650px] h-[350px]",medium:"w-[700px] h-[400px]",large:"w-[750px] h-[450px]"}},defaultVariants:{radius:"medium",scaling:"100%",size:"medium"}}),h=t((function(t,a){var l=t.className,c=t.size,h=t.scaling,y=t.radius,k=t.init,x=t.language,w=void 0===x?"en":x,_=v(t,["className","size","scaling","radius","init","language"]),O=n(!1),j=O[0],N=O[1],z=i(null),C=m().theme,P={radius:null!=y?y:C.themeRadius,scaling:null!=h?h:C.themeScaling,size:c},S="8px";return"none"===P.radius&&(S="0px"),"small"===P.radius&&(S="4px"),"large"===P.radius&&(S="12px"),"full"===P.radius&&(S="16px"),o((function(){s().then((function(){N(!0)}))}),[]),o((function(){if(z.current){var e=z.current.getContainer();e&&(e.style.borderRadius="".concat(S))}}),[S]),j?e("div",{className:u(b(P),l),ref:a,children:e(r,g({onInit:function(e,t){return z.current=t},init:g({language:w,width:"100%",height:"100%",promotion:!1,plugins:"preview importcss searchreplace autolink autosave save directionality code visualblocks visualchars fullscreen image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount charmap accordion",menubar:"file edit view insert format tools table",toolbar:"undo redo | accordion accordionremove | blocks fontfamily fontsize | bold italic underline strikethrough | align numlist bullist | link image | table media | lineheight outdent indent| forecolor backcolor removeformat | charmap | code fullscreen preview | save print | pagebreak anchor codesample | ltr rtl",autosave_ask_before_unload:!0,autosave_interval:"30s",autosave_restore_when_empty:!1,autosave_retention:"2m",image_advtab:!0,image_caption:!0,quickbars_selection_toolbar:"",toolbar_mode:"sliding",skin:!1,content_css:!1,content_style:"".concat(p,"\n").concat(f,"\n body { font-family:Noto Sans KR, sans-serif, Nunito Sans, Helvetica Neue, Helvetica }"),setup:function(e){e.ui.registry.addButton("inlinecode",{icon:"sourcecode",tooltip:"Inline code",onAction:function(){e.formatter.toggle("code")}}),e.on("init",(function(){e.formatter.register("code",{inline:"code",remove:"all"})})),e.ui.registry.addButton("markdown",{text:"Markdown",onAction:function(){var t=e.getContent({format:"text"}),n=d(t);e.setContent(n)}}),e.on("init",(function(){e.getContainer().style.borderRadius=S}))}},k)},_))}):null}));h.displayName="Editor";export{h as Editor,h as default};
 //# sourceMappingURL=index.mjs.map

package/dist/lib/components/Grid/index.js

@@ -68,10 +68,11 @@ function Grid(_a) {
                             .rows.map(function (row) { return (_jsx(Table.Row, { onClick: function () { return table.options.onRowClick && table.options.onRowClick(row); }, onDoubleClick: function () {
                                 return table.options.onRowDoubleClick && table.options.onRowDoubleClick(row);
                             }, className: "hover:bg-slateA-3 dark:hover:bg-slateDarkA-3 ".concat(row.getIsSelected() ? 'bg-gray-200' : ''), children: row.getVisibleCells().map(function (cell, index) {
+                                var _a, _b;
                                 return (_jsx(Table.Cell, __assign({ style: {
                                         width: cell.column.getSize(),
                                         borderLeftWidth: index === 0 ? 0 : 1,
-                                    }, className: "border-l-slateA-5 dark:border-l-slateDarkA-5" }, cell.column.columnDef.meta, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }), cell.id));
+                                    } }, cell.column.columnDef.meta, { className: cn('border-l-slateA-5 dark:border-l-slateDarkA-5', (_b = (_a = cell.column.columnDef.meta) === null || _a === void 0 ? void 0 : _a.className) !== null && _b !== void 0 ? _b : ''), children: flexRender(cell.column.columnDef.cell, cell.getContext()) }), cell.id));
                             }) }, row.id)); }) })] }), ((_e = table.options) === null || _e === void 0 ? void 0 : _e.enableRowPagination) && (_jsx(_Fragment, { children: _jsx("div", { className: cn('py-[6px]'), children: _jsx(NumberingPagination, { table: table }) }) }))] }));
 }
 export default Grid;

package/dist/lib/components/Grid/index.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsxs as e,jsx as o,Fragment as t}from"react/jsx-runtime";import{flexRender as n}from"@tanstack/react-table";import r from"../Table/index.mjs";import{ChevronUpIcon as l,ChevronDownIcon as i}from"@radix-ui/react-icons";import{cn as a}from"../../utils/utils.mjs";import{bgColorStyle as s,radiusVariants as c}from"../../constants.mjs";import{cva as d}from"class-variance-authority";import u from"./NumberingPagination.mjs";var m=function(){return m=Object.assign||function(e){for(var o,t=1,n=arguments.length;t<n;t++)for(var r in o=arguments[t])Object.prototype.hasOwnProperty.call(o,r)&&(e[r]=o[r]);return e},m.apply(this,arguments)},p=d("",{variants:{color:s(),radius:m({},c.large)},defaultVariants:{radius:"medium"}});function g(s){var c,d,g,f,b=s.table;return e("div",{style:{direction:b.options.columnResizeDirection},children:[e(r.Root,{size:null===(c=b.options)||void 0===c?void 0:c.size,appearance:null===(d=b.options)||void 0===d?void 0:d.appearance,radius:b.options.radius,className:a("",null===(g=b.options)||void 0===g?void 0:g.tableRootClassName),children:[o(r.Header,{children:b.getHeaderGroups().map((function(t){return o(r.Row,{children:t.headers.map((function(t,s){var c;return e(r.ColumnHeaderCell,{colSpan:t.colSpan,style:{width:t.getSize(),borderLeftWidth:0===s?0:1},className:"border-l-slateA-5 dark:border-l-slateDarkA-5",children:[t.isPlaceholder?null:e("div",{className:t.column.getCanSort()?"flex cursor-pointer select-none items-center justify-between":"h-full w-full flex-1",onClick:t.column.getToggleSortingHandler(),title:t.column.getCanSort()?"asc"===t.column.getNextSortingOrder()?"Sort ascending":"desc"===t.column.getNextSortingOrder()?"Sort descending":"Clear sort":void 0,children:[n(t.column.columnDef.header,t.getContext()),"asc"==t.column.getIsSorted()?o(l,{}):"desc"==t.column.getIsSorted()?o(i,{}):null]}),o("div",{onDoubleClick:function(){return t.column.resetSize()},onMouseDown:t.getResizeHandler(),onTouchStart:t.getResizeHandler(),className:a("absolute top-0 h-full w-[3px] bg-slateA-3 cursor-col-resize select-none touch-none right-0 opacity-0 hover:opacity-100",b.options.columnResizeDirection,t.column.getIsResizing()?p({color:b.options.color}):""),style:{transform:t.column.getIsResizing()?"translateX(".concat(("rtl"===b.options.columnResizeDirection?-1:1)*(null!==(c=b.getState().columnSizingInfo.deltaOffset)&&void 0!==c?c:0),"px)"):""}})]},t.id)}))},t.id)}))}),o(r.Body,{className:"border-b border-b-slateA-5 dark:border-b-slateDarkA-5",children:b.getRowModel().rows.map((function(e){return o(r.Row,{onClick:function(){return b.options.onRowClick&&b.options.onRowClick(e)},onDoubleClick:function(){return b.options.onRowDoubleClick&&b.options.onRowDoubleClick(e)},className:"hover:bg-slateA-3 dark:hover:bg-slateDarkA-3 ".concat(e.getIsSelected()?"bg-gray-200":""),children:e.getVisibleCells().map((function(e,t){return o(r.Cell,m({style:{width:e.column.getSize(),borderLeftWidth:0===t?0:1},className:"border-l-slateA-5 dark:border-l-slateDarkA-5"},e.column.columnDef.meta,{children:n(e.column.columnDef.cell,e.getContext())}),e.id)}))},e.id)}))})]}),(null===(f=b.options)||void 0===f?void 0:f.enableRowPagination)&&o(t,{children:o("div",{className:a("py-[6px]"),children:o(u,{table:b})})})]})}export{p as GridVariants,g as default};
+import{jsxs as e,jsx as o,Fragment as t}from"react/jsx-runtime";import{flexRender as n}from"@tanstack/react-table";import r from"../Table/index.mjs";import{ChevronUpIcon as l,ChevronDownIcon as i}from"@radix-ui/react-icons";import{cn as a}from"../../utils/utils.mjs";import{bgColorStyle as s,radiusVariants as c}from"../../constants.mjs";import{cva as d}from"class-variance-authority";import u from"./NumberingPagination.mjs";var m=function(){return m=Object.assign||function(e){for(var o,t=1,n=arguments.length;t<n;t++)for(var r in o=arguments[t])Object.prototype.hasOwnProperty.call(o,r)&&(e[r]=o[r]);return e},m.apply(this,arguments)},p=d("",{variants:{color:s(),radius:m({},c.large)},defaultVariants:{radius:"medium"}});function g(s){var c,d,g,f,b=s.table;return e("div",{style:{direction:b.options.columnResizeDirection},children:[e(r.Root,{size:null===(c=b.options)||void 0===c?void 0:c.size,appearance:null===(d=b.options)||void 0===d?void 0:d.appearance,radius:b.options.radius,className:a("",null===(g=b.options)||void 0===g?void 0:g.tableRootClassName),children:[o(r.Header,{children:b.getHeaderGroups().map((function(t){return o(r.Row,{children:t.headers.map((function(t,s){var c;return e(r.ColumnHeaderCell,{colSpan:t.colSpan,style:{width:t.getSize(),borderLeftWidth:0===s?0:1},className:"border-l-slateA-5 dark:border-l-slateDarkA-5",children:[t.isPlaceholder?null:e("div",{className:t.column.getCanSort()?"flex cursor-pointer select-none items-center justify-between":"h-full w-full flex-1",onClick:t.column.getToggleSortingHandler(),title:t.column.getCanSort()?"asc"===t.column.getNextSortingOrder()?"Sort ascending":"desc"===t.column.getNextSortingOrder()?"Sort descending":"Clear sort":void 0,children:[n(t.column.columnDef.header,t.getContext()),"asc"==t.column.getIsSorted()?o(l,{}):"desc"==t.column.getIsSorted()?o(i,{}):null]}),o("div",{onDoubleClick:function(){return t.column.resetSize()},onMouseDown:t.getResizeHandler(),onTouchStart:t.getResizeHandler(),className:a("absolute top-0 h-full w-[3px] bg-slateA-3 cursor-col-resize select-none touch-none right-0 opacity-0 hover:opacity-100",b.options.columnResizeDirection,t.column.getIsResizing()?p({color:b.options.color}):""),style:{transform:t.column.getIsResizing()?"translateX(".concat(("rtl"===b.options.columnResizeDirection?-1:1)*(null!==(c=b.getState().columnSizingInfo.deltaOffset)&&void 0!==c?c:0),"px)"):""}})]},t.id)}))},t.id)}))}),o(r.Body,{className:"border-b border-b-slateA-5 dark:border-b-slateDarkA-5",children:b.getRowModel().rows.map((function(e){return o(r.Row,{onClick:function(){return b.options.onRowClick&&b.options.onRowClick(e)},onDoubleClick:function(){return b.options.onRowDoubleClick&&b.options.onRowDoubleClick(e)},className:"hover:bg-slateA-3 dark:hover:bg-slateDarkA-3 ".concat(e.getIsSelected()?"bg-gray-200":""),children:e.getVisibleCells().map((function(e,t){var l,i;return o(r.Cell,m({style:{width:e.column.getSize(),borderLeftWidth:0===t?0:1}},e.column.columnDef.meta,{className:a("border-l-slateA-5 dark:border-l-slateDarkA-5",null!==(i=null===(l=e.column.columnDef.meta)||void 0===l?void 0:l.className)&&void 0!==i?i:""),children:n(e.column.columnDef.cell,e.getContext())}),e.id)}))},e.id)}))})]}),(null===(f=b.options)||void 0===f?void 0:f.enableRowPagination)&&o(t,{children:o("div",{className:a("py-[6px]"),children:o(u,{table:b})})})]})}export{p as GridVariants,g as default};
 //# sourceMappingURL=index.mjs.map

package/dist/lib/components/Modal/ModalAction.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { VariantProps } from 'class-variance-authority';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
 export interface ModalActionProps extends VariantProps<typeof modalActionVariants> {
 }
 export declare const modalActionVariants: (props?: ({
@@ -8,4 +8,4 @@ export declare const modalActionVariants: (props?: ({
     size?: "small" | "medium" | "large" | "x-large" | null | undefined;
     color?: string | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export declare const ModalAction: React.ForwardRefExoticComponent<Omit<DialogTheme.CloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & ModalActionProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const ModalAction: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & ModalActionProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/Modal/ModalAction.js

@@ -23,8 +23,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useContext } from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
 import { primaryColorStyle } from '../../../lib/constants';
 import { MAIN_COLOR } from '../../../lib/color/constants';
 import { ModalContext } from './ModalRoot';
@@ -56,6 +56,6 @@ export var ModalAction = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     var _b = useContext(ModalContext), radius = _b.radius, size = _b.size, color = _b.color;
     var buttonClassName = cn(modalActionVariants({ radius: radius, size: size, color: color }), className);
-    return (_jsx(DialogTheme.Close, __assign({ ref: ref, className: buttonClassName }, props, { children: children })));
+    return (_jsx(DialogPrimitive.Close, __assign({ ref: ref, className: buttonClassName }, props, { children: children })));
 });
 ModalAction.displayName = 'Modal.Action';

package/dist/lib/components/Modal/ModalAction.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as r}from"react/jsx-runtime";import{forwardRef as e,useContext as t}from"react";import{cva as o}from"class-variance-authority";import{Dialog as n}from"@radix-ui/themes";import{primaryColorStyle as i}from"../../constants.mjs";import{MAIN_COLOR as a}from"../../color/constants.mjs";import{ModalContext as s}from"./ModalRoot.mjs";import{cn as l}from"../../utils/utils.mjs";var m=function(){return m=Object.assign||function(r){for(var e,t=1,o=arguments.length;t<o;t++)for(var n in e=arguments[t])Object.prototype.hasOwnProperty.call(e,n)&&(r[n]=e[n]);return r},m.apply(this,arguments)},p=function(r,e){var t={};for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&e.indexOf(o)<0&&(t[o]=r[o]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(r);n<o.length;n++)e.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(r,o[n])&&(t[o[n]]=r[o[n]])}return t},u=o("rounded-md inline-flex font-medium items-center justify-center px-[15px] hover:cursor-pointer",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded-md",full:"rounded-full"},size:{small:"text-xs w-[52px] h-[24px] px-2",medium:"text-sm w-[66px] h-[32px] px-3",large:"text-base w-[72px] h-[32px] px-3","x-large":"text-lg w-[86px] h-[40px] px-6"},color:i()},defaultVariants:{radius:"medium",size:"medium",color:a}}),c=e((function(e,o){var i=e.children,a=e.className,c=p(e,["children","className"]),d=t(s),f=d.radius,x=d.size,h=d.color,y=l(u({radius:f,size:x,color:h}),a);return r(n.Close,m({ref:o,className:y},c,{children:i}))}));c.displayName="Modal.Action";export{c as ModalAction,u as modalActionVariants};
+import{jsx as r}from"react/jsx-runtime";import{forwardRef as e,useContext as o}from"react";import*as t from"@radix-ui/react-dialog";import{cva as n}from"class-variance-authority";import{primaryColorStyle as i}from"../../constants.mjs";import{MAIN_COLOR as a}from"../../color/constants.mjs";import{ModalContext as l}from"./ModalRoot.mjs";import{cn as s}from"../../utils/utils.mjs";var m=function(){return m=Object.assign||function(r){for(var e,o=1,t=arguments.length;o<t;o++)for(var n in e=arguments[o])Object.prototype.hasOwnProperty.call(e,n)&&(r[n]=e[n]);return r},m.apply(this,arguments)},p=function(r,e){var o={};for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&e.indexOf(t)<0&&(o[t]=r[t]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(t=Object.getOwnPropertySymbols(r);n<t.length;n++)e.indexOf(t[n])<0&&Object.prototype.propertyIsEnumerable.call(r,t[n])&&(o[t[n]]=r[t[n]])}return o},c=n("rounded-md inline-flex font-medium items-center justify-center px-[15px] hover:cursor-pointer",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded-md",full:"rounded-full"},size:{small:"text-xs w-[52px] h-[24px] px-2",medium:"text-sm w-[66px] h-[32px] px-3",large:"text-base w-[72px] h-[32px] px-3","x-large":"text-lg w-[86px] h-[40px] px-6"},color:i()},defaultVariants:{radius:"medium",size:"medium",color:a}}),u=e((function(e,n){var i=e.children,a=e.className,u=p(e,["children","className"]),d=o(l),f=d.radius,x=d.size,y=d.color,h=s(c({radius:f,size:x,color:y}),a);return r(t.Close,m({ref:n,className:h},u,{children:i}))}));u.displayName="Modal.Action";export{u as ModalAction,c as modalActionVariants};
 //# sourceMappingURL=ModalAction.mjs.map

package/dist/lib/components/Modal/ModalCancel.d.ts

@@ -1,10 +1,10 @@
 import React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { VariantProps } from 'class-variance-authority';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
 export interface ModalCancelProps extends VariantProps<typeof modalCancelVariants> {
 }
 export declare const modalCancelVariants: (props?: ({
     radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
     size?: "small" | "medium" | "large" | "x-large" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export declare const ModalCancel: React.ForwardRefExoticComponent<Omit<DialogTheme.CloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & ModalCancelProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const ModalCancel: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & ModalCancelProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/Modal/ModalCancel.js

@@ -23,8 +23,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useContext } from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
 import { ModalContext } from './ModalRoot';
 import { cn } from '../../../lib/utils/utils';
 export var modalCancelVariants = cva("rounded-md font-medium inline-flex justify-center items-center text-slate-11 bg-slate-3 outline-none border-none\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4\n    active:border-none hover:cursor-pointer hover:bg-slateA-4", {
@@ -52,6 +52,6 @@ export var ModalCancel = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     var _b = useContext(ModalContext), radius = _b.radius, size = _b.size;
     var buttonClassName = cn(modalCancelVariants({ radius: radius, size: size }), className);
-    return (_jsx(DialogTheme.Close, __assign({ ref: ref, className: buttonClassName }, props, { children: children })));
+    return (_jsx(DialogPrimitive.Close, __assign({ ref: ref, className: buttonClassName }, props, { children: children })));
 });
 ModalCancel.displayName = 'Modal.Cancel';

package/dist/lib/components/Modal/ModalCancel.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as e}from"react/jsx-runtime";import{forwardRef as r,useContext as t}from"react";import{cva as o}from"class-variance-authority";import{Dialog as a}from"@radix-ui/themes";import{ModalContext as n}from"./ModalRoot.mjs";import{cn as i}from"../../utils/utils.mjs";var l=function(){return l=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var a in r=arguments[t])Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a]);return e},l.apply(this,arguments)},s=function(e,r){var t={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(e);a<o.length;a++)r.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(e,o[a])&&(t[o[a]]=e[o[a]])}return t},m=o("rounded-md font-medium inline-flex justify-center items-center text-slate-11 bg-slate-3 outline-none border-none\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4\n    active:border-none hover:cursor-pointer hover:bg-slateA-4",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded-md",full:"rounded-full"},size:{small:"text-xs w-[52px] h-[24px] px-2 mr-2",medium:"text-sm w-[66px] h-[32px] px-3 mr-2",large:"text-base w-[72px] h-[32px] px-3 mr-3","x-large":"text-lg w-[86px] h-[40px] px-6 mr-4"}},defaultVariants:{radius:"medium",size:"medium"}}),d=r((function(r,o){var d=r.children,p=r.className,u=s(r,["children","className"]),c=t(n),x=c.radius,f=c.size,h=i(m({radius:x,size:f}),p);return e(a.Close,l({ref:o,className:h},u,{children:d}))}));d.displayName="Modal.Cancel";export{d as ModalCancel,m as modalCancelVariants};
+import{jsx as e}from"react/jsx-runtime";import{forwardRef as r,useContext as t}from"react";import*as a from"@radix-ui/react-dialog";import{cva as o}from"class-variance-authority";import{ModalContext as n}from"./ModalRoot.mjs";import{cn as i}from"../../utils/utils.mjs";var l=function(){return l=Object.assign||function(e){for(var r,t=1,a=arguments.length;t<a;t++)for(var o in r=arguments[t])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e},l.apply(this,arguments)},s=function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(e);o<a.length;o++)r.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(e,a[o])&&(t[a[o]]=e[a[o]])}return t},m=o("rounded-md font-medium inline-flex justify-center items-center text-slate-11 bg-slate-3 outline-none border-none\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4\n    active:border-none hover:cursor-pointer hover:bg-slateA-4",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded-md",full:"rounded-full"},size:{small:"text-xs w-[52px] h-[24px] px-2 mr-2",medium:"text-sm w-[66px] h-[32px] px-3 mr-2",large:"text-base w-[72px] h-[32px] px-3 mr-3","x-large":"text-lg w-[86px] h-[40px] px-6 mr-4"}},defaultVariants:{radius:"medium",size:"medium"}}),d=r((function(r,o){var d=r.children,p=r.className,u=s(r,["children","className"]),c=t(n),x=c.radius,f=c.size,b=i(m({radius:x,size:f}),p);return e(a.Close,l({ref:o,className:b},u,{children:d}))}));d.displayName="Modal.Cancel";export{d as ModalCancel,m as modalCancelVariants};
 //# sourceMappingURL=ModalCancel.mjs.map

package/dist/lib/components/Modal/ModalContent.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { VariantProps } from 'class-variance-authority';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
 export interface ModalContentProps extends VariantProps<typeof modalContentVariants> {
 }
 export declare const modalContentVariants: (props?: ({
@@ -8,4 +8,4 @@ export declare const modalContentVariants: (props?: ({
     size?: "small" | "medium" | "large" | "x-large" | null | undefined;
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export declare const ModalContent: React.ForwardRefExoticComponent<Omit<DialogTheme.ContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & ModalContentProps & React.RefAttributes<HTMLDivElement>>;
+export declare const ModalContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & ModalContentProps & React.RefAttributes<HTMLDivElement>>;

package/dist/lib/components/Modal/ModalContent.js

@@ -21,14 +21,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useContext } from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
 import { scalingVariants } from '../../../lib/constants';
 import { ModalContext } from './ModalRoot';
 import { cn } from '../../../lib/utils/utils';
-export var modalContentVariants = cva("p-0", {
+export var modalContentVariants = cva("fixed max-h-[85vh] top-[50%] left-[50%] focus:outline-none\n  translate-x-[-50%] translate-y-[-50%] data-[state=open]:animate-contentShow bg-white dark:bg-slateDark-1 \n  shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] z-50", {
     variants: {
         radius: {
             none: 'rounded-none',
@@ -56,6 +56,6 @@ export var ModalContent = forwardRef(function (_a, ref) {
     var ModalStyle = {
         '--max-width': '1200px',
     };
-    return (_jsx(DialogTheme.Content, __assign({ ref: ref, "aria-describedby": ariaDescribedby !== undefined ? ariaDescribedby : undefined, className: cn(modalContentVariants({ radius: radius, size: size, scaling: scaling }), className), style: ModalStyle }, props, { children: children })));
+    return (_jsxs(DialogPrimitive.Portal, { children: [_jsx(DialogPrimitive.Overlay, { style: { backgroundColor: '#00000066' }, className: "fixed inset-0 z-40 data-[state=open]:animate-overlayShow" }), _jsx(DialogPrimitive.Content, __assign({ ref: ref, "aria-describedby": ariaDescribedby !== undefined ? ariaDescribedby : undefined, className: cn(modalContentVariants({ radius: radius, size: size, scaling: scaling }), className), style: ModalStyle }, props, { children: children }))] }));
 });
 ModalContent.displayName = 'Modal.Content';

package/dist/lib/components/Modal/ModalContent.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as r}from"react/jsx-runtime";import{forwardRef as e,useContext as t}from"react";import{cva as a}from"class-variance-authority";import{Dialog as i}from"@radix-ui/themes";import{scalingVariants as o}from"../../constants.mjs";import{ModalContext as n}from"./ModalRoot.mjs";import{cn as s}from"../../utils/utils.mjs";var l=function(){return l=Object.assign||function(r){for(var e,t=1,a=arguments.length;t<a;t++)for(var i in e=arguments[t])Object.prototype.hasOwnProperty.call(e,i)&&(r[i]=e[i]);return r},l.apply(this,arguments)},d=function(r,e){var t={};for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&e.indexOf(a)<0&&(t[a]=r[a]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(a=Object.getOwnPropertySymbols(r);i<a.length;i++)e.indexOf(a[i])<0&&Object.prototype.propertyIsEnumerable.call(r,a[i])&&(t[a[i]]=r[a[i]])}return t},m=a("p-0",{variants:{radius:{none:"rounded-none",small:"rounded",medium:"rounded-lg",large:"rounded-xl",full:"rounded-xl"},size:{small:"w-[600px]",medium:"w-[800px]",large:"w-[1000px]","x-large":"w-[1200px]"},scaling:l({},o)},defaultVariants:{radius:"medium",size:"medium"}}),c=e((function(e,a){var o=e.children,c=e.className,u=e["aria-describedby"],p=d(e,["children","className","aria-describedby"]),f=t(n),y=f.radius,b=f.size,x=f.scaling;return r(i.Content,l({ref:a,"aria-describedby":void 0!==u?u:void 0,className:s(m({radius:y,size:b,scaling:x}),c),style:{"--max-width":"1200px"}},p,{children:o}))}));c.displayName="Modal.Content";export{c as ModalContent,m as modalContentVariants};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import{forwardRef as a,useContext as t}from"react";import*as o from"@radix-ui/react-dialog";import{cva as n}from"class-variance-authority";import{scalingVariants as i}from"../../constants.mjs";import{ModalContext as l}from"./ModalRoot.mjs";import{cn as s}from"../../utils/utils.mjs";var d=function(){return d=Object.assign||function(e){for(var r,a=1,t=arguments.length;a<t;a++)for(var o in r=arguments[a])Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o]);return e},d.apply(this,arguments)},m=function(e,r){var a={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&r.indexOf(t)<0&&(a[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(t=Object.getOwnPropertySymbols(e);o<t.length;o++)r.indexOf(t[o])<0&&Object.prototype.propertyIsEnumerable.call(e,t[o])&&(a[t[o]]=e[t[o]])}return a},p=n("fixed max-h-[85vh] top-[50%] left-[50%] focus:outline-none\n  translate-x-[-50%] translate-y-[-50%] data-[state=open]:animate-contentShow bg-white dark:bg-slateDark-1 \n  shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] z-50",{variants:{radius:{none:"rounded-none",small:"rounded",medium:"rounded-lg",large:"rounded-xl",full:"rounded-xl"},size:{small:"w-[600px]",medium:"w-[800px]",large:"w-[1000px]","x-large":"w-[1200px]"},scaling:d({},i)},defaultVariants:{radius:"medium",size:"medium"}}),c=a((function(a,n){var i=a.children,c=a.className,u=a["aria-describedby"],f=m(a,["children","className","aria-describedby"]),x=t(l),y=x.radius,h=x.size,b=x.scaling;return e(o.Portal,{children:[r(o.Overlay,{style:{backgroundColor:"#00000066"},className:"fixed inset-0 z-40 data-[state=open]:animate-overlayShow"}),r(o.Content,d({ref:n,"aria-describedby":void 0!==u?u:void 0,className:s(p({radius:y,size:h,scaling:b}),c),style:{"--max-width":"1200px"}},f,{children:i}))]})}));c.displayName="Modal.Content";export{c as ModalContent,p as modalContentVariants};
 //# sourceMappingURL=ModalContent.mjs.map

package/dist/lib/components/Modal/ModalRoot.d.ts

@@ -1,5 +1,5 @@
-import React, { ComponentPropsWithoutRef } from 'react';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
+import React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { VariantProps } from 'class-variance-authority';
 import { modalContentVariants } from './ModalContent';
 import { IColor, IRadius, IScaling, ISize } from '../../../lib/types';
@@ -10,7 +10,4 @@ export interface ModalRootProps extends VariantProps<typeof modalContentVariants
     radius?: IRadius;
 }
 export declare const ModalContext: React.Context<ModalRootProps>;
-export declare const ModalRoot: {
-    ({ children, radius, size, scaling, color, ...props }: ComponentPropsWithoutRef<typeof DialogTheme.Root> & ModalRootProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const ModalRoot: React.ForwardRefExoticComponent<DialogPrimitive.DialogProps & ModalRootProps & React.RefAttributes<never>>;

package/dist/lib/components/Modal/ModalRoot.js

@@ -22,13 +22,13 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import { createContext } from 'react';
-import { Theme, Dialog as DialogTheme } from '@radix-ui/themes';
+import { forwardRef, createContext } from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { useTheme } from '../../../lib/theme';
 export var ModalContext = createContext({
     size: 'medium',
 });
-export var ModalRoot = function (_a) {
+export var ModalRoot = forwardRef(function (_a, ref) {
     var children = _a.children, radius = _a.radius, size = _a.size, scaling = _a.scaling, color = _a.color, props = __rest(_a, ["children", "radius", "size", "scaling", "color"]);
     var theme = useTheme().theme;
     var contextValue = {
@@ -37,6 +37,6 @@ export var ModalRoot = function (_a) {
         color: color !== null && color !== void 0 ? color : theme.themeColor,
         size: size,
     };
-    return (_jsx(Theme, { accentColor: contextValue.color, children: _jsx(ModalContext.Provider, { value: contextValue, children: _jsx(DialogTheme.Root, __assign({}, props, { children: children })) }) }));
-};
+    return (_jsx(ModalContext.Provider, { value: contextValue, children: _jsx("div", { ref: ref, children: _jsx(DialogPrimitive.Root, __assign({}, props, { children: children })) }) }));
+});
 ModalRoot.displayName = 'Modal.Root';

package/dist/lib/components/Modal/ModalRoot.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsx as r}from"react/jsx-runtime";import{createContext as e}from"react";import{Theme as o,Dialog as t}from"@radix-ui/themes";import{useTheme as n}from"../../theme/ThemeProvider.mjs";var i=function(){return i=Object.assign||function(r){for(var e,o=1,t=arguments.length;o<t;o++)for(var n in e=arguments[o])Object.prototype.hasOwnProperty.call(e,n)&&(r[n]=e[n]);return r},i.apply(this,arguments)},l=function(r,e){var o={};for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&e.indexOf(t)<0&&(o[t]=r[t]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(t=Object.getOwnPropertySymbols(r);n<t.length;n++)e.indexOf(t[n])<0&&Object.prototype.propertyIsEnumerable.call(r,t[n])&&(o[t[n]]=r[t[n]])}return o},a=e({size:"medium"}),c=function(e){var c=e.children,m=e.radius,s=e.size,u=e.scaling,p=e.color,d=l(e,["children","radius","size","scaling","color"]),f=n().theme,h={radius:null!=m?m:f.themeRadius,scaling:null!=u?u:f.themeScaling,color:null!=p?p:f.themeColor,size:s};return r(o,{accentColor:h.color,children:r(a.Provider,{value:h,children:r(t.Root,i({},d,{children:c}))})})};c.displayName="Modal.Root";export{a as ModalContext,c as ModalRoot};
+import{jsx as r}from"react/jsx-runtime";import{createContext as e,forwardRef as o}from"react";import*as t from"@radix-ui/react-dialog";import{useTheme as i}from"../../theme/ThemeProvider.mjs";var n=function(){return n=Object.assign||function(r){for(var e,o=1,t=arguments.length;o<t;o++)for(var i in e=arguments[o])Object.prototype.hasOwnProperty.call(e,i)&&(r[i]=e[i]);return r},n.apply(this,arguments)},l=function(r,e){var o={};for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&e.indexOf(t)<0&&(o[t]=r[t]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(t=Object.getOwnPropertySymbols(r);i<t.length;i++)e.indexOf(t[i])<0&&Object.prototype.propertyIsEnumerable.call(r,t[i])&&(o[t[i]]=r[t[i]])}return o},a=e({size:"medium"}),c=o((function(e,o){var c=e.children,s=e.radius,m=e.size,u=e.scaling,p=e.color,d=l(e,["children","radius","size","scaling","color"]),f=i().theme,h={radius:null!=s?s:f.themeRadius,scaling:null!=u?u:f.themeScaling,color:null!=p?p:f.themeColor,size:m};return r(a.Provider,{value:h,children:r("div",{ref:o,children:r(t.Root,n({},d,{children:c}))})})}));c.displayName="Modal.Root";export{a as ModalContext,c as ModalRoot};
 //# sourceMappingURL=ModalRoot.mjs.map

package/dist/lib/components/Modal/ModalTitle.js

@@ -23,8 +23,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useContext } from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
 import IconButton from '../../../lib/components/IconButton';
 import { Cross2Icon } from '@radix-ui/react-icons';
 import { ModalContext } from './ModalRoot';
@@ -42,7 +42,7 @@ export var modalTitleVariants = cva('m-0', {
         size: 'medium',
     },
 });
-export var modalCloseVariants = cva("inline-flex items-center justify-center bg-transparent text-slate-11 outline-none hover:cursor-pointer hover:bg-transparent active:border-none active:bg-transparent dark:bg-transparent dark:text-slateDark-11 dark:hover:bg-transparent dark:active:bg-transparent", {
+export var modalCloseVariants = cva("p-0 hover:text-slate-12 dark:hover:text-slateDark-12 inline-flex items-center justify-center bg-transparent text-slate-11 outline-none hover:cursor-pointer hover:bg-transparent active:border-none active:bg-transparent dark:bg-transparent dark:text-slateDark-11 dark:hover:bg-transparent dark:active:bg-transparent", {
     variants: {
         size: {
             small: 'w-[24px] h-[24px]',
@@ -58,6 +58,6 @@ export var modalCloseVariants = cva("inline-flex items-center justify-center bg-
 export var ModalTitle = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, props = __rest(_a, ["children", "className"]);
     var size = useContext(ModalContext).size;
-    return (_jsxs("div", __assign({ ref: ref, className: "flex items-center justify-between border border-slate-5 p-4 font-bold text-slate-12 dark:border-slateDark-5 dark:text-slateDark-12" }, props, { children: [_jsx(DialogTheme.Title, { className: cn(modalTitleVariants({ size: size }), className), children: children }), _jsx(DialogTheme.Close, { className: modalCloseVariants({ size: size }), children: _jsx(IconButton, { "aria-label": "Close", className: "p-0 hover:text-slate-12 dark:hover:text-slateDark-12", size: size, children: _jsx(Cross2Icon, {}) }) })] })));
+    return (_jsxs("div", __assign({ ref: ref, className: "flex items-center justify-between border-b border-slate-5 p-4 font-bold text-slate-12 dark:border-slateDark-5 dark:text-slateDark-12" }, props, { children: [_jsx(DialogPrimitive.Title, { className: cn(modalTitleVariants({ size: size }), className), children: children }), _jsx(DialogPrimitive.Close, { children: _jsx(IconButton, { "aria-label": "Close", className: cn(modalCloseVariants({ size: size })), size: size, children: _jsx(Cross2Icon, {}) }) })] })));
 });
 ModalTitle.displayName = 'Modal.Title';

package/dist/lib/components/Modal/ModalTitle.mjs

@@ -1,3 +1,3 @@
 "use client";
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import{forwardRef as t,useContext as a}from"react";import{cva as i}from"class-variance-authority";import{Dialog as n}from"@radix-ui/themes";import{IconButton as s}from"../IconButton/index.mjs";import{Cross2Icon as o}from"@radix-ui/react-icons";import{ModalContext as l}from"./ModalRoot.mjs";import{cn as m}from"../../utils/utils.mjs";var p=function(){return p=Object.assign||function(e){for(var r,t=1,a=arguments.length;t<a;t++)for(var i in r=arguments[t])Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i]);return e},p.apply(this,arguments)},c=function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(a=Object.getOwnPropertySymbols(e);i<a.length;i++)r.indexOf(a[i])<0&&Object.prototype.propertyIsEnumerable.call(e,a[i])&&(t[a[i]]=e[a[i]])}return t},d=i("m-0",{variants:{size:{small:"text-sm",medium:"text-lg",large:"text-xl","x-large":"text-2xl"}},defaultVariants:{size:"medium"}}),x=i("inline-flex items-center justify-center bg-transparent text-slate-11 outline-none hover:cursor-pointer hover:bg-transparent active:border-none active:bg-transparent dark:bg-transparent dark:text-slateDark-11 dark:hover:bg-transparent dark:active:bg-transparent",{variants:{size:{small:"w-[24px] h-[24px]",medium:"w-[32px] h-[32px]",large:"w-[32px] h-[32px]","x-large":"w-[40px] h-[40px]"}},defaultVariants:{size:"medium"}}),f=t((function(t,i){var f=t.children,u=t.className,b=c(t,["children","className"]),h=a(l).size;return e("div",p({ref:i,className:"flex items-center justify-between border border-slate-5 p-4 font-bold text-slate-12 dark:border-slateDark-5 dark:text-slateDark-12"},b,{children:[r(n.Title,{className:m(d({size:h}),u),children:f}),r(n.Close,{className:x({size:h}),children:r(s,{"aria-label":"Close",className:"p-0 hover:text-slate-12 dark:hover:text-slateDark-12",size:h,children:r(o,{})})})]}))}));f.displayName="Modal.Title";export{f as ModalTitle,x as modalCloseVariants,d as modalTitleVariants};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import{forwardRef as t,useContext as a}from"react";import*as i from"@radix-ui/react-dialog";import{cva as n}from"class-variance-authority";import{IconButton as o}from"../IconButton/index.mjs";import{Cross2Icon as s}from"@radix-ui/react-icons";import{ModalContext as l}from"./ModalRoot.mjs";import{cn as m}from"../../utils/utils.mjs";var p=function(){return p=Object.assign||function(e){for(var r,t=1,a=arguments.length;t<a;t++)for(var i in r=arguments[t])Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i]);return e},p.apply(this,arguments)},c=function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(a=Object.getOwnPropertySymbols(e);i<a.length;i++)r.indexOf(a[i])<0&&Object.prototype.propertyIsEnumerable.call(e,a[i])&&(t[a[i]]=e[a[i]])}return t},d=n("m-0",{variants:{size:{small:"text-sm",medium:"text-lg",large:"text-xl","x-large":"text-2xl"}},defaultVariants:{size:"medium"}}),x=n("p-0 hover:text-slate-12 dark:hover:text-slateDark-12 inline-flex items-center justify-center bg-transparent text-slate-11 outline-none hover:cursor-pointer hover:bg-transparent active:border-none active:bg-transparent dark:bg-transparent dark:text-slateDark-11 dark:hover:bg-transparent dark:active:bg-transparent",{variants:{size:{small:"w-[24px] h-[24px]",medium:"w-[32px] h-[32px]",large:"w-[32px] h-[32px]","x-large":"w-[40px] h-[40px]"}},defaultVariants:{size:"medium"}}),f=t((function(t,n){var f=t.children,u=t.className,b=c(t,["children","className"]),h=a(l).size;return e("div",p({ref:n,className:"flex items-center justify-between border-b border-slate-5 p-4 font-bold text-slate-12 dark:border-slateDark-5 dark:text-slateDark-12"},b,{children:[r(i.Title,{className:m(d({size:h}),u),children:f}),r(i.Close,{children:r(o,{"aria-label":"Close",className:m(x({size:h})),size:h,children:r(s,{})})})]}))}));f.displayName="Modal.Title";export{f as ModalTitle,x as modalCloseVariants,d as modalTitleVariants};
 //# sourceMappingURL=ModalTitle.mjs.map

package/dist/lib/components/Modal/ModalTrigger.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { Dialog as DialogTheme } from '@radix-ui/themes';
-export declare const ModalTrigger: React.ForwardRefExoticComponent<Omit<DialogTheme.TriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+export declare const ModalTrigger: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;