@lotte-innovate/ui-component-test 0.1.51 → 0.1.52

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

@@ -1,108 +1,52 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DoughnutChart = exports.PieChart = exports.LineChart = exports.RadarChart = exports.BubbleChart = exports.BarChart = exports.Tooltip = exports.ToggleSwitch = exports.ToggleGroup = exports.ToggleWithText = exports.Toggle = exports.Toast = exports.TextField = exports.TextArea = exports.Tabs = exports.TabNav = exports.Table = exports.Spinner = exports.Slider = exports.Skeleton = exports.Separator = exports.Select = exports.SegmentedControl = exports.ScrollArea = exports.RadioGroup = exports.RadioCards = exports.Radio = exports.Progress = exports.Popover = exports.NavigationMenu = exports.Menubar = exports.Label = exports.Inset = exports.IconButton = exports.HoverCard = exports.DropdownMenu = exports.Dialog = exports.DataList = exports.ContextMenu = exports.CheckboxGroup = exports.CheckboxCard = exports.Checkbox = exports.Card = exports.Callout = exports.Button = exports.Badge = exports.Avatar = exports.AspectRatio = exports.AlertDialog = exports.Accordion = void 0;
 // Component
-var Accordion_1 = require("./Accordion");
-Object.defineProperty(exports, "Accordion", { enumerable: true, get: function () { return __importDefault(Accordion_1).default; } });
-var AlertDialog_1 = require("./AlertDialog");
-Object.defineProperty(exports, "AlertDialog", { enumerable: true, get: function () { return __importDefault(AlertDialog_1).default; } });
-var AspectRatio_1 = require("./AspectRatio");
-Object.defineProperty(exports, "AspectRatio", { enumerable: true, get: function () { return __importDefault(AspectRatio_1).default; } });
-var Avatar_1 = require("./Avatar");
-Object.defineProperty(exports, "Avatar", { enumerable: true, get: function () { return __importDefault(Avatar_1).default; } });
-var Badge_1 = require("./Badge");
-Object.defineProperty(exports, "Badge", { enumerable: true, get: function () { return __importDefault(Badge_1).default; } });
-var Button_1 = require("./Button");
-Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return __importDefault(Button_1).default; } });
-var Callout_1 = require("./Callout");
-Object.defineProperty(exports, "Callout", { enumerable: true, get: function () { return __importDefault(Callout_1).default; } });
-var Card_1 = require("./Card");
-Object.defineProperty(exports, "Card", { enumerable: true, get: function () { return __importDefault(Card_1).default; } });
-var Checkbox_1 = require("./Checkbox");
-Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return __importDefault(Checkbox_1).default; } });
-var CheckboxCard_1 = require("./CheckboxCard");
-Object.defineProperty(exports, "CheckboxCard", { enumerable: true, get: function () { return __importDefault(CheckboxCard_1).default; } });
-var CheckboxGroup_1 = require("./CheckboxGroup");
-Object.defineProperty(exports, "CheckboxGroup", { enumerable: true, get: function () { return __importDefault(CheckboxGroup_1).default; } });
-var ContextMenu_1 = require("./ContextMenu");
-Object.defineProperty(exports, "ContextMenu", { enumerable: true, get: function () { return __importDefault(ContextMenu_1).default; } });
-var DataList_1 = require("./DataList");
-Object.defineProperty(exports, "DataList", { enumerable: true, get: function () { return __importDefault(DataList_1).default; } });
-var Dialog_1 = require("./Dialog");
-Object.defineProperty(exports, "Dialog", { enumerable: true, get: function () { return __importDefault(Dialog_1).default; } });
-var DropdownMenu_1 = require("./DropdownMenu");
-Object.defineProperty(exports, "DropdownMenu", { enumerable: true, get: function () { return __importDefault(DropdownMenu_1).default; } });
-var HoverCard_1 = require("./HoverCard");
-Object.defineProperty(exports, "HoverCard", { enumerable: true, get: function () { return __importDefault(HoverCard_1).default; } });
-var IconButton_1 = require("./IconButton");
-Object.defineProperty(exports, "IconButton", { enumerable: true, get: function () { return __importDefault(IconButton_1).default; } });
-var Inset_1 = require("./Inset");
-Object.defineProperty(exports, "Inset", { enumerable: true, get: function () { return __importDefault(Inset_1).default; } });
-var Label_1 = require("./Label");
-Object.defineProperty(exports, "Label", { enumerable: true, get: function () { return __importDefault(Label_1).default; } });
-var Menubar_1 = require("./Menubar");
-Object.defineProperty(exports, "Menubar", { enumerable: true, get: function () { return __importDefault(Menubar_1).default; } });
-var NavigationMenu_1 = require("./NavigationMenu");
-Object.defineProperty(exports, "NavigationMenu", { enumerable: true, get: function () { return __importDefault(NavigationMenu_1).default; } });
-var Popover_1 = require("./Popover");
-Object.defineProperty(exports, "Popover", { enumerable: true, get: function () { return __importDefault(Popover_1).default; } });
-var Progress_1 = require("./Progress");
-Object.defineProperty(exports, "Progress", { enumerable: true, get: function () { return __importDefault(Progress_1).default; } });
-var Radio_1 = require("./Radio");
-Object.defineProperty(exports, "Radio", { enumerable: true, get: function () { return __importDefault(Radio_1).default; } });
-var RadioCards_1 = require("./RadioCards");
-Object.defineProperty(exports, "RadioCards", { enumerable: true, get: function () { return __importDefault(RadioCards_1).default; } });
-var RadioGroup_1 = require("./RadioGroup");
-Object.defineProperty(exports, "RadioGroup", { enumerable: true, get: function () { return __importDefault(RadioGroup_1).default; } });
-var ScrollArea_1 = require("./ScrollArea");
-Object.defineProperty(exports, "ScrollArea", { enumerable: true, get: function () { return __importDefault(ScrollArea_1).default; } });
-var SegmentedControl_1 = require("./SegmentedControl");
-Object.defineProperty(exports, "SegmentedControl", { enumerable: true, get: function () { return __importDefault(SegmentedControl_1).default; } });
-var Select_1 = require("./Select");
-Object.defineProperty(exports, "Select", { enumerable: true, get: function () { return __importDefault(Select_1).default; } });
-var Separator_1 = require("./Separator");
-Object.defineProperty(exports, "Separator", { enumerable: true, get: function () { return __importDefault(Separator_1).default; } });
-var Skeleton_1 = require("./Skeleton");
-Object.defineProperty(exports, "Skeleton", { enumerable: true, get: function () { return __importDefault(Skeleton_1).default; } });
-var Slider_1 = require("./Slider");
-Object.defineProperty(exports, "Slider", { enumerable: true, get: function () { return __importDefault(Slider_1).default; } });
-var Spinner_1 = require("./Spinner");
-Object.defineProperty(exports, "Spinner", { enumerable: true, get: function () { return __importDefault(Spinner_1).default; } });
-var Table_1 = require("./Table");
-Object.defineProperty(exports, "Table", { enumerable: true, get: function () { return __importDefault(Table_1).default; } });
-var TabNav_1 = require("./TabNav");
-Object.defineProperty(exports, "TabNav", { enumerable: true, get: function () { return __importDefault(TabNav_1).default; } });
-var Tabs_1 = require("./Tabs");
-Object.defineProperty(exports, "Tabs", { enumerable: true, get: function () { return __importDefault(Tabs_1).default; } });
-var TextArea_1 = require("./TextArea");
-Object.defineProperty(exports, "TextArea", { enumerable: true, get: function () { return __importDefault(TextArea_1).default; } });
-var TextField_1 = require("./TextField");
-Object.defineProperty(exports, "TextField", { enumerable: true, get: function () { return __importDefault(TextField_1).default; } });
-var Toast_1 = require("./Toast");
-Object.defineProperty(exports, "Toast", { enumerable: true, get: function () { return __importDefault(Toast_1).default; } });
-var Toggle_1 = require("./Toggle");
-Object.defineProperty(exports, "Toggle", { enumerable: true, get: function () { return __importDefault(Toggle_1).default; } });
-var ToggleWithText_1 = require("./Toggle/ToggleWithText");
-Object.defineProperty(exports, "ToggleWithText", { enumerable: true, get: function () { return __importDefault(ToggleWithText_1).default; } });
-var ToggleGroup_1 = require("./ToggleGroup");
-Object.defineProperty(exports, "ToggleGroup", { enumerable: true, get: function () { return __importDefault(ToggleGroup_1).default; } });
-var ToggleSwitch_1 = require("./ToggleSwitch");
-Object.defineProperty(exports, "ToggleSwitch", { enumerable: true, get: function () { return __importDefault(ToggleSwitch_1).default; } });
-var Tooltip_1 = require("./Tooltip");
-Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return __importDefault(Tooltip_1).default; } });
+export { default as Accordion } from './Accordion';
+export { default as AlertDialog } from './AlertDialog';
+export { default as AspectRatio } from './AspectRatio';
+export { default as Avatar } from './Avatar';
+export { default as Badge } from './Badge';
+export { default as Button } from './Button';
+export { default as Callout } from './Callout';
+export { default as Card } from './Card';
+export { default as Checkbox } from './Checkbox';
+export { default as CheckboxCard } from './CheckboxCard';
+export { default as CheckboxGroup } from './CheckboxGroup';
+export { default as ContextMenu } from './ContextMenu';
+export { default as DataList } from './DataList';
+export { default as Dialog } from './Dialog';
+export { default as DropdownMenu } from './DropdownMenu';
+export { default as HoverCard } from './HoverCard';
+export { default as IconButton } from './IconButton';
+export { default as Inset } from './Inset';
+export { default as Label } from './Label';
+export { default as Menubar } from './Menubar';
+export { default as NavigationMenu } from './NavigationMenu';
+export { default as Popover } from './Popover';
+export { default as Progress } from './Progress';
+export { default as Radio } from './Radio';
+export { default as RadioCards } from './RadioCards';
+export { default as RadioGroup } from './RadioGroup';
+export { default as ScrollArea } from './ScrollArea';
+export { default as SegmentedControl } from './SegmentedControl';
+export { default as Select } from './Select';
+export { default as Separator } from './Separator';
+export { default as Skeleton } from './Skeleton';
+export { default as Slider } from './Slider';
+export { default as Spinner } from './Spinner';
+export { default as Table } from './Table';
+export { default as TabNav } from './TabNav';
+export { default as Tabs } from './Tabs';
+export { default as TextArea } from './TextArea';
+export { default as TextField } from './TextField';
+export { default as Toast } from './Toast';
+export { default as Toggle } from './Toggle';
+export { default as ToggleWithText } from './Toggle/ToggleWithText';
+export { default as ToggleGroup } from './ToggleGroup';
+export { default as ToggleSwitch } from './ToggleSwitch';
+export { default as Tooltip } from './Tooltip';
 // Chart
-var BarChart_1 = require("./BarChart");
-Object.defineProperty(exports, "BarChart", { enumerable: true, get: function () { return __importDefault(BarChart_1).default; } });
-var BubbleChart_1 = require("./BubbleChart");
-Object.defineProperty(exports, "BubbleChart", { enumerable: true, get: function () { return __importDefault(BubbleChart_1).default; } });
-var RadarChart_1 = require("./RadarChart");
-Object.defineProperty(exports, "RadarChart", { enumerable: true, get: function () { return __importDefault(RadarChart_1).default; } });
-var LineChart_1 = require("./LineChart");
-Object.defineProperty(exports, "LineChart", { enumerable: true, get: function () { return __importDefault(LineChart_1).default; } });
-var PieChart_1 = require("./PieChart");
-Object.defineProperty(exports, "PieChart", { enumerable: true, get: function () { return __importDefault(PieChart_1).default; } });
-var DoughnutChart_1 = require("./DoughnutChart");
-Object.defineProperty(exports, "DoughnutChart", { enumerable: true, get: function () { return __importDefault(DoughnutChart_1).default; } });
+export { default as BarChart } from './BarChart';
+export { default as BubbleChart } from './BubbleChart';
+export { default as RadarChart } from './RadarChart';
+export { default as LineChart } from './LineChart';
+export { default as PieChart } from './PieChart';
+export { default as DoughnutChart } from './DoughnutChart';

package/dist/cjs/lib/constants.js

@@ -1,38 +1,12 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.selectAppearanceStyle = exports.checkboxAppearanceStyle = exports.switchCheckedApperanceStyle = exports.menuItemAppearanceStyle = exports.toggleAppearanceStyle = exports.appearanceStyle = exports.textColorStyle = exports.bgColorStyle = exports.primaryColorStyle = exports.blackText = exports.chartDatalabelsArgsTypes = exports.chartDatasetsArgsTypes = exports.chartLegendArgTypes = exports.chartTitleArgTypes = exports.chartColorStyle = exports.commonArgTypes = exports.scalingVariants = exports.weightVariants = exports.radiusVariants = exports.pointStyleList = exports.labelPositionList = exports.appearanceOptions = exports.themeOptions = exports.weightOptions = exports.sizeOptions = exports.scalingOptions = exports.typoSizeOptions = exports.radiusOptions = void 0;
-var constants_1 = require("lib/color/constants");
-var lightColors = __importStar(require("lib/color/light"));
-exports.radiusOptions = ['none', 'small', 'medium', 'large', 'full'];
-exports.typoSizeOptions = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
-exports.scalingOptions = ['90%', '95%', '100%', '105%', '110%'];
-exports.sizeOptions = ['x-small', 'small', 'medium', 'large', 'x-large'];
-exports.weightOptions = ['regular', 'medium', 'semibold', 'bold'];
-exports.themeOptions = ['light', 'dark'];
-exports.appearanceOptions = [
+import { ColorStyle, DarkColorStyle, colorOptions, chartColorOptions } from 'lib/color/constants';
+import * as lightColors from 'lib/color/light';
+export var radiusOptions = ['none', 'small', 'medium', 'large', 'full'];
+export var typoSizeOptions = ['1', '2', '3', '4', '5', '6', '7', '8', '9'];
+export var scalingOptions = ['90%', '95%', '100%', '105%', '110%'];
+export var sizeOptions = ['x-small', 'small', 'medium', 'large', 'x-large'];
+export var weightOptions = ['regular', 'medium', 'semibold', 'bold'];
+export var themeOptions = ['light', 'dark'];
+export var appearanceOptions = [
     'classic',
     'ghost',
     'outline',
@@ -41,8 +15,8 @@ exports.appearanceOptions = [
     'surface',
 ];
 //차트
-exports.labelPositionList = ['top', 'bottom', 'left', 'right'];
-exports.pointStyleList = [
+export var labelPositionList = ['top', 'bottom', 'left', 'right'];
+export var pointStyleList = [
     'circle',
     'cross',
     'crossRot',
@@ -55,7 +29,7 @@ exports.pointStyleList = [
     'triangle',
     false,
 ];
-exports.radiusVariants = {
+export var radiusVariants = {
     // 체크박스
     small: {
         none: 'rounded-none',
@@ -97,13 +71,13 @@ exports.radiusVariants = {
         full: 'rounded',
     },
 };
-exports.weightVariants = {
+export var weightVariants = {
     regular: 'font-normal', // 400
     medium: 'font-medium', // 500
     semibold: 'font-semibold', // 600
     bold: 'font-bold', // 700
 };
-exports.scalingVariants = {
+export var scalingVariants = {
     '90%': 'scale-90',
     '95%': 'scale-95',
     '100%': 'scale-100',
@@ -111,40 +85,40 @@ exports.scalingVariants = {
     '110%': 'scale-110',
 };
 // 스토리북 공통 argTypes 설정
-exports.commonArgTypes = {
+export var commonArgTypes = {
     typoSize: {
         table: {
             category: 'Theme Props',
             type: { summary: '1 ~ 9' },
         },
         control: { type: 'select' },
-        options: exports.typoSizeOptions,
+        options: typoSizeOptions,
         defaultValue: { summary: '3' },
     },
     scaling: {
         table: {
             category: 'Theme Props',
-            type: { summary: exports.scalingOptions.join(' | ') },
+            type: { summary: scalingOptions.join(' | ') },
         },
         control: { type: 'select' },
-        options: exports.scalingOptions,
+        options: scalingOptions,
         defaultValue: { summary: '100%' },
     },
     weight: {
         table: {
             category: 'Theme Props',
-            type: { summary: exports.weightOptions.join(' | ') },
+            type: { summary: weightOptions.join(' | ') },
         },
-        options: exports.weightOptions,
+        options: weightOptions,
         control: { type: 'select' },
         defaultValue: { summary: 'medium' },
     },
     radius: {
         table: {
             category: 'Theme Props',
-            type: { summary: exports.radiusOptions.join(' | ') },
+            type: { summary: radiusOptions.join(' | ') },
         },
-        options: exports.radiusOptions,
+        options: radiusOptions,
         control: { type: 'select' },
         defaultValue: { summary: 'medium' },
     },
@@ -153,7 +127,7 @@ exports.commonArgTypes = {
             category: 'Theme Props',
             type: { summary: 'colorVariants' },
         },
-        options: constants_1.colorOptions,
+        options: colorOptions,
         control: { type: 'select' },
         defaultValue: { summary: 'red' },
     },
@@ -167,19 +141,19 @@ exports.commonArgTypes = {
     appearance: {
         table: {
             category: 'Props',
-            type: { summary: exports.appearanceOptions.join(' | ') },
+            type: { summary: appearanceOptions.join(' | ') },
         },
-        options: exports.appearanceOptions,
+        options: appearanceOptions,
         control: { type: 'select' },
         defaultValue: { summary: 'solid' },
     },
     size: {
         table: {
             category: 'Props',
-            type: { summary: exports.sizeOptions.join(' | ') },
+            type: { summary: sizeOptions.join(' | ') },
         },
         control: { type: 'select' },
-        options: exports.sizeOptions,
+        options: sizeOptions,
         defaultValue: { summary: 'medium' },
     },
     isColorMixed: {
@@ -217,16 +191,15 @@ exports.commonArgTypes = {
         },
     },
 };
-var chartColorStyle = function () {
+export var chartColorStyle = function () {
     var colorValues = lightColors;
     var colorMappings = {};
-    constants_1.chartColorOptions.forEach(function (color) {
+    chartColorOptions.forEach(function (color) {
         colorMappings[color] = colorValues[color][9];
     });
     return colorMappings;
 };
-exports.chartColorStyle = chartColorStyle;
-exports.chartTitleArgTypes = {
+export var chartTitleArgTypes = {
     title: {
         description: '차트 타이틀',
         table: {
@@ -282,7 +255,7 @@ exports.chartTitleArgTypes = {
         defaultValue: { summary: 12 },
     },
 };
-exports.chartLegendArgTypes = {
+export var chartLegendArgTypes = {
     legend: {
         description: '차트 범례',
         table: {
@@ -368,14 +341,14 @@ exports.chartLegendArgTypes = {
         description: "- \uB77C\uBCA8 \uD3EC\uC778\uD2B8 \uC2A4\uD0C0\uC77C\n      - usePointStyle\uAC00 true\uC778 \uACBD\uC6B0 \uC801\uC6A9",
         table: {
             category: 'Legend Props',
-            type: { summary: exports.pointStyleList.join(' | ') },
+            type: { summary: pointStyleList.join(' | ') },
         },
         control: { type: 'select' },
-        options: exports.pointStyleList,
+        options: pointStyleList,
         defaultValue: { summary: 'false' },
     },
 };
-exports.chartDatasetsArgsTypes = {
+export var chartDatasetsArgsTypes = {
     'datasets[n].data': {
         description: '데이터셋 데이터',
         table: {
@@ -489,7 +462,7 @@ exports.chartDatasetsArgsTypes = {
         },
     },
 };
-exports.chartDatalabelsArgsTypes = {
+export var chartDatalabelsArgsTypes = {
     datalabels: {
         table: {
             disable: true,
@@ -515,36 +488,33 @@ exports.chartDatalabelsArgsTypes = {
         defaultValue: { summary: 'gray' },
     },
 };
-exports.blackText = ['sky', 'mint', 'lime', 'yellow', 'amber', 'orange', 'white'];
-var primaryColorStyle = function () {
+export var blackText = ['sky', 'mint', 'lime', 'yellow', 'amber', 'orange', 'white'];
+export var primaryColorStyle = function () {
     var color = {};
-    for (var i in constants_1.ColorStyle) {
+    for (var i in ColorStyle) {
         var darkColor = "".concat(i, "Dark");
-        color[i] = exports.blackText.includes(i)
-            ? "bg-".concat(constants_1.ColorStyle[i], " text-slate-12 dark:bg-").concat(constants_1.DarkColorStyle[darkColor], " dark:text-slateDark-12")
-            : "bg-".concat(constants_1.ColorStyle[i], " text-white dark:bg-").concat(constants_1.DarkColorStyle[darkColor], " dark:text-slateDark-1");
+        color[i] = blackText.includes(i)
+            ? "bg-".concat(ColorStyle[i], " text-slate-12 dark:bg-").concat(DarkColorStyle[darkColor], " dark:text-slateDark-12")
+            : "bg-".concat(ColorStyle[i], " text-white dark:bg-").concat(DarkColorStyle[darkColor], " dark:text-slateDark-1");
     }
     return color;
 };
-exports.primaryColorStyle = primaryColorStyle;
-var bgColorStyle = function () {
+export var bgColorStyle = function () {
     var color = {};
-    for (var i in constants_1.ColorStyle) {
+    for (var i in ColorStyle) {
         var darkColor = "".concat(i, "Dark");
-        color[i] = "bg-".concat(constants_1.ColorStyle[i], " dark:bg-").concat(constants_1.DarkColorStyle[darkColor]);
+        color[i] = "bg-".concat(ColorStyle[i], " dark:bg-").concat(DarkColorStyle[darkColor]);
     }
     return color;
 };
-exports.bgColorStyle = bgColorStyle;
-var textColorStyle = function () {
+export var textColorStyle = function () {
     var color = {};
-    for (var i in constants_1.ColorStyle) {
+    for (var i in ColorStyle) {
         var darkColor = "".concat(i, "Dark");
-        color[i] = "text-".concat(constants_1.ColorStyle[i], " dark:text-").concat(constants_1.DarkColorStyle[darkColor]);
+        color[i] = "text-".concat(ColorStyle[i], " dark:text-").concat(DarkColorStyle[darkColor]);
     }
     return color;
 };
-exports.textColorStyle = textColorStyle;
 var makeClassName = function (type, isClickable) {
     var className = '';
     className += "".concat(type.light.default, " ").concat(type.dark.default);
@@ -553,7 +523,7 @@ var makeClassName = function (type, isClickable) {
     }
     return className;
 };
-var appearanceStyle = function (type, color, isClickable) {
+export var appearanceStyle = function (type, color, isClickable) {
     if (isClickable === void 0) { isClickable = true; }
     var darkColor = "".concat(color, "Dark");
     var classic = {
@@ -657,8 +627,7 @@ var appearanceStyle = function (type, color, isClickable) {
             return '';
     }
 };
-exports.appearanceStyle = appearanceStyle;
-var toggleAppearanceStyle = function (type, color, isClickable, stateOn) {
+export var toggleAppearanceStyle = function (type, color, isClickable, stateOn) {
     if (isClickable === void 0) { isClickable = true; }
     if (stateOn === void 0) { stateOn = ''; }
     var darkColor = "".concat(color, "Dark");
@@ -763,12 +732,11 @@ var toggleAppearanceStyle = function (type, color, isClickable, stateOn) {
             return '';
     }
 };
-exports.toggleAppearanceStyle = toggleAppearanceStyle;
-var menuItemAppearanceStyle = function (type, color) {
+export var menuItemAppearanceStyle = function (type, color) {
     var appearanceStyle = '';
     if (type === 'solid') {
         appearanceStyle = "hover:bg-".concat(color, "-9 dark:hover:bg-").concat(color, "Dark-9 ");
-        appearanceStyle += exports.blackText.includes(color)
+        appearanceStyle += blackText.includes(color)
             ? "hover:text-slateA-11 dark:hover:text-white"
             : "hover:text-white dark:hover:text-white";
     }
@@ -780,8 +748,7 @@ var menuItemAppearanceStyle = function (type, color) {
     }
     return appearanceStyle;
 };
-exports.menuItemAppearanceStyle = menuItemAppearanceStyle;
-var switchCheckedApperanceStyle = function (type, color) {
+export var switchCheckedApperanceStyle = function (type, color) {
     var softStyle = "data-[state=checked]:bg-".concat(color, "A-3  data-[state=unchecked]:bg-").concat(color, "A-2 ");
     var surfaceStyle = "data-[state=checked]:bg-".concat(color, "A-2 border border-solid border-").concat(color, "A-7 data-[state=unchecked]:bg-slateA-2 data-[state=unchecked]:bg-slateA-6 ");
     var classicStyle = "data-[state=checked]:bg-".concat(color, "-9 text-white border border-solid border-").concat(color, "-9 shadow-custom-1 shadow-custom-2 shadow-custom-3 data-[state=unchecked]:border-slate-4 data-[state=unchecked]:bg-slateA-3 data-[state=unchecked]:text-slateA-8");
@@ -796,8 +763,7 @@ var switchCheckedApperanceStyle = function (type, color) {
             return '';
     }
 };
-exports.switchCheckedApperanceStyle = switchCheckedApperanceStyle;
-var checkboxAppearanceStyle = function (type, color, indeterminate) {
+export var checkboxAppearanceStyle = function (type, color, indeterminate) {
     var darkColor = "".concat(color, "Dark");
     var surface = {
         light: {
@@ -870,8 +836,7 @@ var checkboxAppearanceStyle = function (type, color, indeterminate) {
             return makeClassName(surface, true);
     }
 };
-exports.checkboxAppearanceStyle = checkboxAppearanceStyle;
-var selectAppearanceStyle = function (type, color) {
+export var selectAppearanceStyle = function (type, color) {
     var darkColor = "".concat(color, "Dark");
     var surface = {
         light: {
@@ -947,4 +912,3 @@ var selectAppearanceStyle = function (type, color) {
             return '';
     }
 };
-exports.selectAppearanceStyle = selectAppearanceStyle;

package/dist/cjs/lib/index.js

@@ -1,18 +1,2 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./components"), exports);
-__exportStar(require("./Typography"), exports);
+export * from './components';
+export * from './Typography';

package/dist/cjs/lib/types.js

@@ -1,2 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};

package/dist/cjs/lib/utils/useDarkMode.js

@@ -1,38 +1,35 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDarkMode = void 0;
-var alpha_1 = require("lib/color/alpha");
-var react_1 = require("react");
-var useDarkMode = function (isRAxes) {
+import { slateA, slateDarkA } from 'lib/color/alpha';
+import { useEffect, useState } from 'react';
+export var useDarkMode = function (isRAxes) {
     if (isRAxes === void 0) { isRAxes = false; }
     var lightmode = {};
     var darkmode = {};
     if (isRAxes === true) {
         lightmode = {
-            r: { grid: { color: alpha_1.slateA[8] } },
+            r: { grid: { color: slateA[8] } },
         };
         darkmode = {
-            r: { grid: { color: alpha_1.slateDarkA[8] }, ticks: { backdropColor: 'rgba(0, 0, 0, 0)' } },
+            r: { grid: { color: slateDarkA[8] }, ticks: { backdropColor: 'rgba(0, 0, 0, 0)' } },
         };
     }
     else {
         lightmode = {
-            x: { grid: { color: alpha_1.slateA[8] } },
-            y: { grid: { color: alpha_1.slateA[8] } },
+            x: { grid: { color: slateA[8] } },
+            y: { grid: { color: slateA[8] } },
         };
         darkmode = {
-            x: { grid: { color: alpha_1.slateDarkA[8] } },
-            y: { grid: { color: alpha_1.slateDarkA[8] } },
+            x: { grid: { color: slateDarkA[8] } },
+            y: { grid: { color: slateDarkA[8] } },
         };
     }
-    var _a = (0, react_1.useState)(checkDarkMode()), isDarkMode = _a[0], setIsDarkMode = _a[1];
-    var _b = (0, react_1.useState)({
+    var _a = useState(checkDarkMode()), isDarkMode = _a[0], setIsDarkMode = _a[1];
+    var _b = useState({
         linescale: {},
     }), defaultOptions = _b[0], setDefaultOptions = _b[1];
     function checkDarkMode() {
         return document.body.classList.contains('dark');
     }
-    (0, react_1.useEffect)(function () {
+    useEffect(function () {
         setIsDarkMode(checkDarkMode());
         setDefaultOptions({ linescale: !checkDarkMode() ? lightmode : darkmode });
         var mutationObserver = new MutationObserver(function (mutations) {
@@ -50,4 +47,3 @@ var useDarkMode = function (isRAxes) {
     }, []);
     return [isDarkMode, defaultOptions];
 };
-exports.useDarkMode = useDarkMode;

package/dist/cjs/lib/utils/utils.js

@@ -1,14 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.cn = void 0;
-var clsx_1 = require("clsx");
-var tailwind_merge_1 = require("tailwind-merge");
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
 // tailwind를 merge할 때 발생할 수 있는 클래스 충돌 문제 해결
-function cn() {
+export function cn() {
     var inputs = [];
     for (var _i = 0; _i < arguments.length; _i++) {
         inputs[_i] = arguments[_i];
     }
-    return (0, tailwind_merge_1.twMerge)((0, clsx_1.clsx)(inputs));
+    return twMerge(clsx(inputs));
 }
-exports.cn = cn;

package/dist/cjs/src/app/layout.jsx

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.metadata = void 0;
+// import { Inter } from 'next/font/google';
+require("./globals.css");
+// const inter = Inter({ subsets: ['latin'] });
+exports.metadata = {
+    title: 'Create Next App',
+    description: 'Generated by create next app',
+};
+function RootLayout(_a) {
+    var children = _a.children;
+    return (<html lang="en">
+      <body>{children}</body>
+    </html>);
+}
+exports.default = RootLayout;