@lotte-innovate/ui-component-test 0.1.73 → 0.1.74

package/dist/lib/color/light.js

@@ -1,2 +1,393 @@
-var f={1:"#fcfcfd",2:"#f9f9fb",3:"#f0f0f3",4:"#e8e8ec",5:"#e0e1e6",6:"#d9d9e0",7:"#cdced6",8:"#b9bbc6",9:"#8b8d98",10:"#80838d",11:"#60646c",12:"#1c2024"},e={1:"#fffcfc",2:"#fff7f7",3:"#feebec",4:"#ffdbdc",5:"#ffcdce",6:"#fdbdbe",7:"#f4a9aa",8:"#eb8e90",9:"#da291c",10:"#b52217",11:"#881a11",12:"#641723"},d={1:"#fffcfd",2:"#fef7f9",3:"#ffe9f0",4:"#fedce7",5:"#facedd",6:"#f3bed1",7:"#eaacc3",8:"#e093b2",9:"#e93d82",10:"#df3478",11:"#cb1d63",12:"#621639"},c={1:"#fefcff",2:"#fdf7fd",3:"#fbebfb",4:"#f7def8",5:"#f2d1f3",6:"#e9c2ec",7:"#deade3",8:"#cf91d8",9:"#ab4aba",10:"#a144af",11:"#953ea3",12:"#53195d"},b={1:"#fefcfe",2:"#fbf7fe",3:"#f7edfe",4:"#f2e2fc",5:"#ead5f9",6:"#e0c4f4",7:"#d1afec",8:"#be93e4",9:"#8e4ec6",10:"#8347b9",11:"#8145b5",12:"#402060"},a={1:"#fdfdfe",2:"#f7f9ff",3:"#edf2fe",4:"#e1e9ff",5:"#d2deff",6:"#c1d0ff",7:"#abbdf9",8:"#8da4ef",9:"#3e63dd",10:"#3358d4",11:"#3a5bc7",12:"#1f2d5c"},r={1:"#fbfdff",2:"#f4faff",3:"#e6f4fe",4:"#d5efff",5:"#c2e5ff",6:"#acd8fc",7:"#8ec8f6",8:"#5eb1ef",9:"#0090ff",10:"#0588f0",11:"#0d74ce",12:"#113264"},o={1:"#fafdfe",2:"#f2fafb",3:"#def7f9",4:"#caf1f6",5:"#b5e9f0",6:"#9ddde7",7:"#7dcedc",8:"#3db9cf",9:"#00a2c7",10:"#0797b9",11:"#107d98",12:"#0d3c48"},p={1:"#fafefd",2:"#f3fbf9",3:"#e0f8f3",4:"#ccf3ea",5:"#b8eae0",6:"#a1ded2",7:"#83cdc1",8:"#53b9ab",9:"#12a594",10:"#0d9b8a",11:"#008573",12:"#0d3d38"},t={1:"#fbfefb",2:"#f5fbf5",3:"#e9f6e9",4:"#daf1db",5:"#c9e8ca",6:"#b2ddb5",7:"#94ce9a",8:"#65ba74",9:"#46a758",10:"#3e9b4f",11:"#2a7e3b",12:"#203c25"},v={1:"#fefdfc",2:"#fcf9f6",3:"#f6eee7",4:"#f0e4d9",5:"#ebdaca",6:"#e4cdb7",7:"#dcbc9f",8:"#cea37e",9:"#ad7f58",10:"#a07553",11:"#815e46",12:"#3e332e"},x={1:"#f9feff",2:"#f1fafd",3:"#e1f6fd",4:"#d1f0fa",5:"#bee7f5",6:"#a9daed",7:"#8dcae3",8:"#60b3d7",9:"#7ce2fe",10:"#74daf8",11:"#00749e",12:"#1d3e56"},g={1:"#fcfdfa",2:"#f8faf3",3:"#eef6d6",4:"#e2f0bd",5:"#d3e7a6",6:"#c2da91",7:"#abc978",8:"#8db654",9:"#bdee63",10:"#b0e64c",11:"#5c7c2f",12:"#37401c"},h={1:"#fdfdf9",2:"#fefce9",3:"#fffab8",4:"#fff394",5:"#ffe770",6:"#f3d768",7:"#e4c767",8:"#d5ae39",9:"#ffe629",10:"#ffdc00",11:"#9e6c00",12:"#473b1f"},i={1:"#fefdfb",2:"#fefbe9",3:"#fff7c2",4:"#ffee9c",5:"#fbe577",6:"#f3d673",7:"#e9c162",8:"#e2a336",9:"#ffc53d",10:"#ffba18",11:"#ab6400",12:"#4f3422"},j={1:"#fefcfb",2:"#fff7ed",3:"#ffefd6",4:"#ffdfb5",5:"#ffd19a",6:"#ffc182",7:"#f5ae73",8:"#ec9455",9:"#f76b15",10:"#ef5f00",11:"#cc4e00",12:"#582d1d"};export{i as amber,r as blue,v as brown,d as crimson,o as cyan,t as grass,a as indigo,g as lime,j as orange,c as plum,b as purple,e as red,x as sky,f as slate,p as teal,h as yellow};
-//# sourceMappingURL=light.js.map
+// 기본 그레이 색상
+export var slate = {
+    1: '#fcfcfd',
+    2: '#f9f9fb',
+    3: '#f0f0f3',
+    4: '#e8e8ec',
+    5: '#e0e1e6',
+    6: '#d9d9e0',
+    7: '#cdced6',
+    8: '#b9bbc6',
+    9: '#8b8d98',
+    10: '#80838d',
+    11: '#60646c',
+    12: '#1c2024',
+};
+export var olive = {
+    1: '#fcfdfc',
+    2: '#f8faf8',
+    3: '#eff1ef',
+    4: '#e7e9e7',
+    5: '#dfe2df',
+    6: '#d7dad7',
+    7: '#cccfcc',
+    8: '#b9bcb8',
+    9: '#898e87',
+    10: '#7f847d',
+    11: '#60655f',
+    12: '#1d211c',
+};
+export var sand = {
+    1: '#fdfdfc',
+    2: '#f9f9f8',
+    3: '#f1f0ef',
+    4: '#e9e8e6',
+    5: '#e2e1de',
+    6: '#dad9d6',
+    7: '#cfceca',
+    8: '#bcbbb5',
+    9: '#8d8d86',
+    10: '#82827c',
+    11: '#63635e',
+    12: '#21201c',
+};
+export var tomato = {
+    1: '#fffcfc',
+    2: '#fff8f7',
+    3: '#feebe7',
+    4: '#ffdcd3',
+    5: '#ffcdc2',
+    6: '#fdbdaf',
+    7: '#f5a898',
+    8: '#ec8e7b',
+    9: '#e54d2e',
+    10: '#dd4425',
+    11: '#d13415',
+    12: '#5c271f',
+};
+export var red = {
+    1: '#fffcfc',
+    2: '#fff7f7',
+    3: '#feebec',
+    4: '#ffdbdc',
+    5: '#ffcdce',
+    6: '#fdbdbe',
+    7: '#f4a9aa',
+    8: '#eb8e90',
+    9: '#da291c',
+    10: '#b52217',
+    11: '#881a11',
+    12: '#641723',
+};
+export var ruby = {
+    1: '#fffcfd',
+    2: '#fff7f8',
+    3: '#feeaed',
+    4: '#ffdce1',
+    5: '#ffced6',
+    6: '#f8bfc8',
+    7: '#efacb8',
+    8: '#e592a3',
+    9: '#e54666',
+    10: '#dc3b5d',
+    11: '#ca244d',
+    12: '#64172b',
+};
+export var crimson = {
+    1: '#fffcfd',
+    2: '#fef7f9',
+    3: '#ffe9f0',
+    4: '#fedce7',
+    5: '#facedd',
+    6: '#f3bed1',
+    7: '#eaacc3',
+    8: '#e093b2',
+    9: '#e93d82',
+    10: '#df3478',
+    11: '#cb1d63',
+    12: '#621639',
+};
+export var pink = {
+    1: '#fffcfe',
+    2: '#fef7fb',
+    3: '#fee9f5',
+    4: '#fbdcef',
+    5: '#f6cee7',
+    6: '#efbfdd',
+    7: '#e7acd0',
+    8: '#dd93c2',
+    9: '#d6409f',
+    10: '#cf3897',
+    11: '#c2298a',
+    12: '#651249',
+};
+export var plum = {
+    1: '#fefcff',
+    2: '#fdf7fd',
+    3: '#fbebfb',
+    4: '#f7def8',
+    5: '#f2d1f3',
+    6: '#e9c2ec',
+    7: '#deade3',
+    8: '#cf91d8',
+    9: '#ab4aba',
+    10: '#a144af',
+    11: '#953ea3',
+    12: '#53195d',
+};
+export var purple = {
+    1: '#fefcfe',
+    2: '#fbf7fe',
+    3: '#f7edfe',
+    4: '#f2e2fc',
+    5: '#ead5f9',
+    6: '#e0c4f4',
+    7: '#d1afec',
+    8: '#be93e4',
+    9: '#8e4ec6',
+    10: '#8347b9',
+    11: '#8145b5',
+    12: '#402060',
+};
+export var violet = {
+    1: '#fdfcfe',
+    2: '#faf8ff',
+    3: '#f4f0fe',
+    4: '#ebe4ff',
+    5: '#e1d9ff',
+    6: '#d4cafe',
+    7: '#c2b5f5',
+    8: '#aa99ec',
+    9: '#6e56cf',
+    10: '#654dc4',
+    11: '#6550b9',
+    12: '#2f265f',
+};
+export var iris = {
+    1: '#fdfdff',
+    2: '#f8f8ff',
+    3: '#f0f1fe',
+    4: '#e6e7ff',
+    5: '#dadcff',
+    6: '#cbcdff',
+    7: '#b8baf8',
+    8: '#9b9ef0',
+    9: '#5b5bd6',
+    10: '#5151cd',
+    11: '#5753c6',
+    12: '#272962',
+};
+export var indigo = {
+    1: '#fdfdfe',
+    2: '#f7f9ff',
+    3: '#edf2fe',
+    4: '#e1e9ff',
+    5: '#d2deff',
+    6: '#c1d0ff',
+    7: '#abbdf9',
+    8: '#8da4ef',
+    9: '#3e63dd',
+    10: '#3358d4',
+    11: '#3a5bc7',
+    12: '#1f2d5c',
+};
+export var blue = {
+    1: '#fbfdff',
+    2: '#f4faff',
+    3: '#e6f4fe',
+    4: '#d5efff',
+    5: '#c2e5ff',
+    6: '#acd8fc',
+    7: '#8ec8f6',
+    8: '#5eb1ef',
+    9: '#0090ff',
+    10: '#0588f0',
+    11: '#0d74ce',
+    12: '#113264',
+};
+export var cyan = {
+    1: '#fafdfe',
+    2: '#f2fafb',
+    3: '#def7f9',
+    4: '#caf1f6',
+    5: '#b5e9f0',
+    6: '#9ddde7',
+    7: '#7dcedc',
+    8: '#3db9cf',
+    9: '#00a2c7',
+    10: '#0797b9',
+    11: '#107d98',
+    12: '#0d3c48',
+};
+export var teal = {
+    1: '#fafefd',
+    2: '#f3fbf9',
+    3: '#e0f8f3',
+    4: '#ccf3ea',
+    5: '#b8eae0',
+    6: '#a1ded2',
+    7: '#83cdc1',
+    8: '#53b9ab',
+    9: '#12a594',
+    10: '#0d9b8a',
+    11: '#008573',
+    12: '#0d3d38',
+};
+export var jade = {
+    1: '#fbfefd',
+    2: '#f4fbf7',
+    3: '#e6f7ed',
+    4: '#d6f1e3',
+    5: '#c3e9d7',
+    6: '#acdec8',
+    7: '#8bceb6',
+    8: '#56ba9f',
+    9: '#29a383',
+    10: '#26997b',
+    11: '#208368',
+    12: '#1d3b31',
+};
+export var green = {
+    1: '#fbfefc',
+    2: '#f4fbf6',
+    3: '#e6f6eb',
+    4: '#d6f1df',
+    5: '#c4e8d1',
+    6: '#adddc0',
+    7: '#8eceaa',
+    8: '#5bb98b',
+    9: '#30a46c',
+    10: '#2b9a66',
+    11: '#218358',
+    12: '#193b2d',
+};
+export var grass = {
+    1: '#fbfefb',
+    2: '#f5fbf5',
+    3: '#e9f6e9',
+    4: '#daf1db',
+    5: '#c9e8ca',
+    6: '#b2ddb5',
+    7: '#94ce9a',
+    8: '#65ba74',
+    9: '#46a758',
+    10: '#3e9b4f',
+    11: '#2a7e3b',
+    12: '#203c25',
+};
+export var brown = {
+    1: '#fefdfc',
+    2: '#fcf9f6',
+    3: '#f6eee7',
+    4: '#f0e4d9',
+    5: '#ebdaca',
+    6: '#e4cdb7',
+    7: '#dcbc9f',
+    8: '#cea37e',
+    9: '#ad7f58',
+    10: '#a07553',
+    11: '#815e46',
+    12: '#3e332e',
+};
+export var bronze = {
+    1: '#fdfcfc',
+    2: '#fdf7f5',
+    3: '#f6edea',
+    4: '#efe4df',
+    5: '#e7d9d3',
+    6: '#dfcdc5',
+    7: '#d3bcb3',
+    8: '#c2a499',
+    9: '#a18072',
+    10: '#957468',
+    11: '#7d5e54',
+    12: '#43302b',
+};
+export var gold = {
+    1: '#fdfdfc',
+    2: '#faf9f2',
+    3: '#f2f0e7',
+    4: '#eae6db',
+    5: '#e1dccf',
+    6: '#d8d0bf',
+    7: '#cbc0aa',
+    8: '#b9a88d',
+    9: '#978365',
+    10: '#8c7a5e',
+    11: '#71624b',
+    12: '#3b352b',
+};
+export var sky = {
+    1: '#f9feff',
+    2: '#f1fafd',
+    3: '#e1f6fd',
+    4: '#d1f0fa',
+    5: '#bee7f5',
+    6: '#a9daed',
+    7: '#8dcae3',
+    8: '#60b3d7',
+    9: '#7ce2fe',
+    10: '#74daf8',
+    11: '#00749e',
+    12: '#1d3e56',
+};
+export var mint = {
+    1: '#f9fefd',
+    2: '#f2fbf9',
+    3: '#ddf9f2',
+    4: '#c8f4e9',
+    5: '#b3ecde',
+    6: '#9ce0d0',
+    7: '#7ecfbd',
+    8: '#4cbba5',
+    9: '#86ead4',
+    10: '#7de0cb',
+    11: '#027864',
+    12: '#16433c',
+};
+export var lime = {
+    1: '#fcfdfa',
+    2: '#f8faf3',
+    3: '#eef6d6',
+    4: '#e2f0bd',
+    5: '#d3e7a6',
+    6: '#c2da91',
+    7: '#abc978',
+    8: '#8db654',
+    9: '#bdee63',
+    10: '#b0e64c',
+    11: '#5c7c2f',
+    12: '#37401c',
+};
+export var yellow = {
+    1: '#fdfdf9',
+    2: '#fefce9',
+    3: '#fffab8',
+    4: '#fff394',
+    5: '#ffe770',
+    6: '#f3d768',
+    7: '#e4c767',
+    8: '#d5ae39',
+    9: '#ffe629',
+    10: '#ffdc00',
+    11: '#9e6c00',
+    12: '#473b1f',
+};
+export var amber = {
+    1: '#fefdfb',
+    2: '#fefbe9',
+    3: '#fff7c2',
+    4: '#ffee9c',
+    5: '#fbe577',
+    6: '#f3d673',
+    7: '#e9c162',
+    8: '#e2a336',
+    9: '#ffc53d',
+    10: '#ffba18',
+    11: '#ab6400',
+    12: '#4f3422',
+};
+export var orange = {
+    1: '#fefcfb',
+    2: '#fff7ed',
+    3: '#ffefd6',
+    4: '#ffdfb5',
+    5: '#ffd19a',
+    6: '#ffc182',
+    7: '#f5ae73',
+    8: '#ec9455',
+    9: '#f76b15',
+    10: '#ef5f00',
+    11: '#cc4e00',
+    12: '#582d1d',
+};

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

@@ -0,0 +1,22 @@
+import React from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { VariantProps } from 'class-variance-authority';
+import { IColor } from '../../../lib/types';
+export interface AccordionProps extends React.InputHTMLAttributes<HTMLInputElement>, VariantProps<typeof accoridanVariants> {
+    defaultValue?: string;
+    color?: IColor;
+}
+declare const accoridanVariants: (props?: ({
+    scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const Root: React.ForwardRefExoticComponent<((Omit<AccordionPrimitive.AccordionSingleProps & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<AccordionPrimitive.AccordionMultipleProps & React.RefAttributes<HTMLDivElement>, "ref">) & AccordionProps) & React.RefAttributes<HTMLDivElement>>;
+export declare const Item: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & AccordionProps & React.RefAttributes<HTMLDivElement>>;
+export declare const Trigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & AccordionProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const Content: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & AccordionProps & React.RefAttributes<HTMLDivElement>>;
+declare const Accordion: {
+    Root: React.ForwardRefExoticComponent<((Omit<AccordionPrimitive.AccordionSingleProps & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<AccordionPrimitive.AccordionMultipleProps & React.RefAttributes<HTMLDivElement>, "ref">) & AccordionProps) & React.RefAttributes<HTMLDivElement>>;
+    Item: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & AccordionProps & React.RefAttributes<HTMLDivElement>>;
+    Trigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & AccordionProps & React.RefAttributes<HTMLButtonElement>>;
+    Content: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & AccordionProps & React.RefAttributes<HTMLDivElement>>;
+};
+export default Accordion;

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

@@ -1,2 +1,64 @@
-import{j as a}from"../../../../_virtual/jsx-runtime.js";import e from"react";import{Root as r,Item as t,Header as o,Trigger as s,Content as n}from"../../../../node_modules/@radix-ui/react-accordion/dist/index.mjs.js";import{ChevronDownIcon as d}from"../../../../node_modules/@radix-ui/react-icons/dist/react-icons.esm.js";import{cn as i}from"../../utils/utils.js";import{cva as c}from"../../../../node_modules/class-variance-authority/dist/index.mjs.js";import{scalingVariants as l}from"../../constants.js";var m=function(){return m=Object.assign||function(a){for(var e,r=1,t=arguments.length;r<t;r++)for(var o in e=arguments[r])Object.prototype.hasOwnProperty.call(e,o)&&(a[o]=e[o]);return a},m.apply(this,arguments)},p=function(a,e){var r={};for(var t in a)Object.prototype.hasOwnProperty.call(a,t)&&e.indexOf(t)<0&&(r[t]=a[t]);if(null!=a&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(t=Object.getOwnPropertySymbols(a);o<t.length;o++)e.indexOf(t[o])<0&&Object.prototype.propertyIsEnumerable.call(a,t[o])&&(r[t[o]]=a[t[o]])}return r},f=c("",{variants:{scaling:m({},l)},defaultVariants:{scaling:"100%"}}),x=e.forwardRef((function(e,t){var o=e.className,s=e.children,n=e.scaling,d=p(e,["className","children","scaling"]);return a.jsx(r,m({className:i("w-[280px] rounded-md border border-slateA-4 dark:border-slateDarkA-4",f({scaling:n}),o)},d,{ref:t,children:s}))}));x.displayName="Accordion.Root";var u=e.forwardRef((function(e,r){var o=e.className,s=e.children,n=p(e,["className","children"]);return a.jsx(t,m({},n,{ref:r,className:i("mt-px w-[278px] overflow-hidden first:mt-0 first:rounded-t last:rounded-b",o),children:s}))}));u.displayName="Accordion.Item";var b=e.forwardRef((function(e,r){var t=e.className,n=e.children,c=e.color,l=void 0===c?"red":c,f=p(e,["className","children","color"]);return a.jsx(o,m({},f,{className:i("flex",t),children:a.jsxs(s,m({},f,{ref:r,className:i("group flex h-[44px] w-[278px] cursor-default items-center justify-between px-[20px] py-[10px] text-base font-normal","dark:bg-[#111113] text-".concat(l,"A-11 dark:text-").concat(l,"Dark-11 "),"hover:bg-".concat(l,"A-4 dark:hover:bg-").concat(l,"Dark-4 hover:text-").concat(l,"A-11 dark:hover:text-").concat(l,"DarkA-11"),"data-[state=open]:bg-".concat(l,"A-5 dark:data-[state=open]:bg-").concat(l,"DarkA-5"),"disabled:bg-slateA-3 disabled:text-slateA-8 disabled:dark:bg-slateDarkA-3 disabled:dark:text-slateDarkA-8",t),children:[n,a.jsx(d,{className:"transition-transform duration-300 ease-[cubic-bezier(0.87,_0,_0.13,_1)] group-data-[state=open]:rotate-180","aria-hidden":!0})]}))}))}));b.displayName="Accordion.Trigger";var h=e.forwardRef((function(e,r){var t=e.className,o=e.children,s=p(e,["className","children"]);return a.jsx(n,m({},s,{ref:r,className:i("max-h-[800px] w-[278px] overflow-hidden border-t border-t-slateA-4 bg-slateA-2 text-[16px] text-slateA-11 data-[state=closed]:animate-slideUp data-[state=open]:animate-slideDown dark:border-t-slateDarkA-4 dark:bg-slateDarkA-2 dark:text-slateDarkA-11",t),children:a.jsx("div",{className:"h-auto max-h-[1000px] overflow-y-auto px-[20px] py-[15px] text-base font-normal",children:o})}))}));h.displayName="Accordion.Content";var g={Root:x,Item:u,Trigger:b,Content:h};export{h as Content,u as Item,x as Root,b as Trigger,g as default};
-//# sourceMappingURL=index.js.map
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { ChevronDownIcon } from '@radix-ui/react-icons';
+import { cn } from '../../../lib/utils/utils';
+import { cva } from 'class-variance-authority';
+import { scalingVariants } from '../../../lib/constants';
+var accoridanVariants = cva('', {
+    variants: {
+        scaling: __assign({}, scalingVariants),
+    },
+    defaultVariants: {
+        scaling: '100%',
+    },
+});
+export var Root = React.forwardRef(function (_a, forwardedRef) {
+    var className = _a.className, children = _a.children, scaling = _a.scaling, rootProps = __rest(_a, ["className", "children", "scaling"]);
+    return (_jsx(AccordionPrimitive.Root, __assign({ className: cn('w-[280px] rounded-md border border-slateA-4 dark:border-slateDarkA-4', accoridanVariants({ scaling: scaling }), className) }, rootProps, { ref: forwardedRef, children: children })));
+});
+Root.displayName = 'Accordion.Root';
+export var Item = React.forwardRef(function (_a, forwardedRef) {
+    var className = _a.className, children = _a.children, rootProps = __rest(_a, ["className", "children"]);
+    return (_jsx(AccordionPrimitive.Item, __assign({}, rootProps, { ref: forwardedRef, className: cn('mt-px w-[278px] overflow-hidden first:mt-0 first:rounded-t last:rounded-b', className), children: children })));
+});
+Item.displayName = 'Accordion.Item';
+export var Trigger = React.forwardRef(function (_a, forwardedRef) {
+    var className = _a.className, children = _a.children, _b = _a.color, color = _b === void 0 ? 'red' : _b, rootProps = __rest(_a, ["className", "children", "color"]);
+    return (_jsx(AccordionPrimitive.Header, __assign({}, rootProps, { className: cn('flex', className), children: _jsxs(AccordionPrimitive.Trigger, __assign({}, rootProps, { ref: forwardedRef, className: cn("group flex h-[44px] w-[278px] cursor-default items-center justify-between px-[20px] py-[10px] text-base font-normal", "dark:bg-[#111113] text-".concat(color, "A-11 dark:text-").concat(color, "Dark-11 "), "hover:bg-".concat(color, "A-4 dark:hover:bg-").concat(color, "Dark-4 hover:text-").concat(color, "A-11 dark:hover:text-").concat(color, "DarkA-11"), "data-[state=open]:bg-".concat(color, "A-5 dark:data-[state=open]:bg-").concat(color, "DarkA-5"), "disabled:bg-slateA-3 disabled:text-slateA-8 disabled:dark:bg-slateDarkA-3 disabled:dark:text-slateDarkA-8", className), children: [children, _jsx(ChevronDownIcon, { className: "transition-transform duration-300 ease-[cubic-bezier(0.87,_0,_0.13,_1)] group-data-[state=open]:rotate-180", "aria-hidden": true })] })) })));
+});
+Trigger.displayName = 'Accordion.Trigger';
+export var Content = React.forwardRef(function (_a, forwardedRef) {
+    var className = _a.className, children = _a.children, rootProps = __rest(_a, ["className", "children"]);
+    return (_jsx(AccordionPrimitive.Content, __assign({}, rootProps, { ref: forwardedRef, className: cn('max-h-[800px] w-[278px] overflow-hidden border-t border-t-slateA-4 bg-slateA-2 text-[16px] text-slateA-11 data-[state=closed]:animate-slideUp data-[state=open]:animate-slideDown dark:border-t-slateDarkA-4 dark:bg-slateDarkA-2 dark:text-slateDarkA-11', className), children: _jsx("div", { className: "h-auto max-h-[1000px] overflow-y-auto px-[20px] py-[15px] text-base font-normal", children: children }) })));
+});
+Content.displayName = 'Accordion.Content';
+var Accordion = {
+    Root: Root,
+    Item: Item,
+    Trigger: Trigger,
+    Content: Content,
+};
+export default Accordion;

package/dist/lib/components/AlertDialog/AlertDialogAction.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { VariantProps } from 'class-variance-authority';
+import { IAppearance } from '../../../lib/types';
+export interface AlertDialogActionProps extends VariantProps<typeof alertDialogActionVariants> {
+    appearance?: IAppearance;
+}
+export declare const alertDialogActionVariants: (props?: ({
+    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    size?: "small" | "medium" | "large" | "x-large" | null | undefined;
+    weight?: "bold" | "medium" | "regular" | "semibold" | null | undefined;
+    color?: string | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/AlertDialog/AlertDialogAction.js

@@ -1,2 +1,61 @@
-import{j as e}from"../../../../_virtual/jsx-runtime.js";import{forwardRef as r}from"react";import{Action as t}from"../../../../node_modules/@radix-ui/react-alert-dialog/dist/index.mjs.js";import{cva as o}from"../../../../node_modules/class-variance-authority/dist/index.mjs.js";import{cn as i}from"../../utils/utils.js";import{weightVariants as n,primaryColorStyle as a,appearanceStyle as s}from"../../constants.js";import{useAlertDialogContext as l}from"./AlertDialogRoot.js";var m=function(){return m=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var i in r=arguments[t])Object.prototype.hasOwnProperty.call(r,i)&&(e[i]=r[i]);return e},m.apply(this,arguments)},p=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 i=0;for(o=Object.getOwnPropertySymbols(e);i<o.length;i++)r.indexOf(o[i])<0&&Object.prototype.propertyIsEnumerable.call(e,o[i])&&(t[o[i]]=e[o[i]])}return t},d=o("inline-flex items-center justify-center px-[15px] outline-none focus:shadow-[0_0_0_2px] font-normal w-fit",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded",full:"rounded-full"},size:{small:"text-xs min-w-[40px] h-[24px] px-2",medium:"text-sm min-w-[50px] h-[32px] px-3",large:"text-sm min-w-[50px] h-[32px] px-3","x-large":"text-base min-w-[62px] h-[40px] px-4"},weight:m({},n),color:a()},defaultVariants:{radius:"large",weight:"medium",size:"medium",color:"red"}}),u=r((function(r,o){var n=r.className,a=r.children,u=r.weight,c=p(r,["className","children","weight"]),x=l(),f=x.radius,h=x.size,j=x.color,g=void 0===j?"red":j,w=x.appearance,y=void 0===w?"solid":w,v=i(d({radius:f,size:h,weight:u,color:g}),s(y,g),n);return e.jsx(t,m({ref:o,className:v},c,{children:a}))}));u.displayName="AlertDialog.Action";export{u as AlertDialogAction,d as alertDialogActionVariants};
-//# sourceMappingURL=AlertDialogAction.js.map
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils/utils';
+import { appearanceStyle, primaryColorStyle, weightVariants } from '../../../lib/constants';
+import { useAlertDialogContext } from './AlertDialogRoot';
+export var alertDialogActionVariants = cva("inline-flex items-center justify-center px-[15px] outline-none focus:shadow-[0_0_0_2px] font-normal w-fit", {
+    variants: {
+        radius: {
+            none: 'rounded-none',
+            small: 'rounded-[3px]',
+            medium: 'rounded',
+            large: 'rounded',
+            full: 'rounded-full',
+        },
+        size: {
+            small: 'text-xs min-w-[40px] h-[24px] px-2',
+            medium: 'text-sm min-w-[50px] h-[32px] px-3',
+            large: 'text-sm min-w-[50px] h-[32px] px-3',
+            'x-large': 'text-base min-w-[62px] h-[40px] px-4',
+        },
+        weight: __assign({}, weightVariants),
+        color: primaryColorStyle(),
+    },
+    defaultVariants: {
+        radius: 'large',
+        weight: 'medium',
+        size: 'medium',
+        color: 'red',
+    },
+});
+export var AlertDialogAction = forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, weight = _a.weight, props = __rest(_a, ["className", "children", "weight"]);
+    var _b = useAlertDialogContext(), radius = _b.radius, size = _b.size, _c = _b.color, color = _c === void 0 ? 'red' : _c, _d = _b.appearance, appearance = _d === void 0 ? 'solid' : _d;
+    var buttonClassName = cn(alertDialogActionVariants({ radius: radius, size: size, weight: weight, color: color }), appearanceStyle(appearance, color), className);
+    return (_jsx(AlertDialogPrimitive.Action, __assign({ ref: ref, className: buttonClassName }, props, { children: children })));
+});
+AlertDialogAction.displayName = 'AlertDialog.Action';

package/dist/lib/components/AlertDialog/AlertDialogCancel.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { VariantProps } from 'class-variance-authority';
+import { IAppearance } from '../../../lib/types';
+export interface AlertDialogCancelProps extends VariantProps<typeof alertDialogCancelVariants> {
+    appearance?: IAppearance;
+}
+export declare const alertDialogCancelVariants: (props?: ({
+    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    size?: "small" | "medium" | "large" | "x-large" | null | undefined;
+    weight?: "bold" | "medium" | "regular" | "semibold" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>, "ref"> & AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/AlertDialog/AlertDialogCancel.js

@@ -1,2 +1,60 @@
-import{j as e}from"../../../../_virtual/jsx-runtime.js";import{forwardRef as r}from"react";import{Cancel as t}from"../../../../node_modules/@radix-ui/react-alert-dialog/dist/index.mjs.js";import{cva as a}from"../../../../node_modules/class-variance-authority/dist/index.mjs.js";import{cn as i}from"../../utils/utils.js";import{weightVariants as n,appearanceStyle as o}from"../../constants.js";import{useAlertDialogContext as s}from"./AlertDialogRoot.js";var l=function(){return l=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},l.apply(this,arguments)},m=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=a("inline-flex justify-center items-center outline-none w-fit",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded",full:"rounded-full"},size:{small:"text-xs min-w-[40px] h-[24px] px-2 mr-2",medium:"text-sm min-w-[50px] h-[32px] px-3 mr-2",large:"text-sm min-w-[50px] h-[32px] px-3 mr-3","x-large":"text-base min-w-[62px] h-[40px] px-4 mr-3"},weight:l({},n)},defaultVariants:{radius:"large",weight:"medium",size:"large"}}),p=r((function(r,a){var n=r.className,p=r.children,u=r.weight,c=m(r,["className","children","weight"]),x=s(),f=x.radius,g=x.size,h=x.appearance,j=void 0===h?"solid":h,b=i(d({radius:f,size:g,weight:u}),o(j,"slate"),"border-none text-slate-11 bg-slate-3 \n    active:bg-slate-4 active:border-none hover:cursor-pointer hover:bg-slateA-4\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4",n);return e.jsx(t,l({ref:a},c,{className:b,children:p}))}));p.displayName="AlertDialog.Cancel";export{p as AlertDialogCancel,d as alertDialogCancelVariants};
-//# sourceMappingURL=AlertDialogCancel.js.map
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils/utils';
+import { appearanceStyle, weightVariants } from '../../../lib/constants';
+import { useAlertDialogContext } from './AlertDialogRoot';
+export var alertDialogCancelVariants = cva("inline-flex justify-center items-center outline-none w-fit", {
+    variants: {
+        radius: {
+            none: 'rounded-none',
+            small: 'rounded-[3px]',
+            medium: 'rounded',
+            large: 'rounded',
+            full: 'rounded-full',
+        },
+        size: {
+            small: 'text-xs min-w-[40px] h-[24px] px-2 mr-2',
+            medium: 'text-sm min-w-[50px] h-[32px] px-3 mr-2',
+            large: 'text-sm min-w-[50px] h-[32px] px-3 mr-3',
+            'x-large': 'text-base min-w-[62px] h-[40px] px-4 mr-3',
+        },
+        weight: __assign({}, weightVariants),
+    },
+    defaultVariants: {
+        radius: 'large',
+        weight: 'medium',
+        size: 'large',
+    },
+});
+export var AlertDialogCancel = forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, weight = _a.weight, props = __rest(_a, ["className", "children", "weight"]);
+    var _b = useAlertDialogContext(), radius = _b.radius, size = _b.size, _c = _b.appearance, appearance = _c === void 0 ? 'solid' : _c;
+    var disabledButtonStyle = "border-none text-slate-11 bg-slate-3 \n    active:bg-slate-4 active:border-none hover:cursor-pointer hover:bg-slateA-4\n    dark:text-slateDark-11 dark:bg-slateDark-3 dark:hover:bg-slateDarkA-4";
+    var buttonClassName = cn(alertDialogCancelVariants({ radius: radius, size: size, weight: weight }), appearanceStyle(appearance, 'slate'), disabledButtonStyle, className);
+    return (_jsx(AlertDialogPrimitive.Cancel, __assign({ ref: ref }, props, { className: buttonClassName, children: children })));
+});
+AlertDialogCancel.displayName = 'AlertDialog.Cancel';