@lotte-innovate/ui-component-test 0.1.96 → 0.1.98

package/dist/lib/components/NavigationMenu/NavigationMenuContent.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -43,6 +44,6 @@ export var navigationMenuContentVariants = cva("text-slate-12 dark:text-slateDar
 export var NavigationMenuContent = forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
     var _b = useNavigationMenuContext(), radius = _b.radius, size = _b.size;
-    return (_jsx(NavigationMenuPrimitive.Content, __assign({ ref: ref, className: cn("data-[motion=from-start]:animate-enterFromLeft data-[motion=from-end]:animate-enterFromRight data-[motion=to-start]:animate-exitToLeft data-[motion=to-end]:animate-exitToRight absolute left-0 top-0 w-full sm:w-auto", navigationMenuContentVariants({ radius: radius, size: size }), className) }, props, { children: children })));
+    return (_jsx(NavigationMenuPrimitive.Content, __assign({ ref: ref, className: cn("data-[motion=from-start]:animate-enterFromLeft data-[motion=from-end]:animate-enterFromRight data-[motion=to-start]:animate-exitToLeft data-[motion=to-end]:animate-exitToRight absolute left-0 top-0 z-10 w-full bg-white sm:w-auto", navigationMenuContentVariants({ radius: radius, size: size }), className) }, props, { children: children })));
 });
 NavigationMenuContent.displayName = 'NavigationMenu.Content';

package/dist/lib/components/NavigationMenu/NavigationMenuIndicator.js

@@ -26,6 +26,6 @@ import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
 import { cn } from '../../../lib/utils/utils';
 export var NavigationMenuIndicator = forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
-    return (_jsxs(NavigationMenuPrimitive.Indicator, __assign({ ref: ref, className: "data-[state=visible]:animate-fadeIn data-[state=hidden]:animate-fadeOut top-full z-[1] flex h-[10px] items-end justify-center overflow-hidden transition-[width,transform_250ms_ease]" }, props, { children: [_jsx("div", { className: cn("relative top-[70%] h-[10px] w-[10px] rotate-[45deg] rounded-tl-[2px] bg-white shadow shadow-slate-4 dark:bg-slateDark-2 dark:shadow-slateDark-4", className) }), children] })));
+    return (_jsxs(NavigationMenuPrimitive.Indicator, __assign({ ref: ref, className: "data-[state=visible]:animate-fadeIn data-[state=hidden]:animate-fadeOut top-full z-30 flex h-[10px] items-end justify-center overflow-hidden transition-[width,transform_250ms_ease]" }, props, { children: [_jsx("div", { className: cn("relative top-[70%] h-[10px] w-[10px] rotate-[45deg] rounded-tl-[2px] bg-white shadow shadow-slate-4 dark:bg-slateDark-2 dark:shadow-slateDark-4", className) }), children] })));
 });
 NavigationMenuIndicator.displayName = 'NavigationMenu.Indicator';

package/dist/lib/components/NavigationMenu/NavigationMenuLink.d.ts

@@ -7,7 +7,7 @@ export interface NavigationMenuLinkProps extends VariantProps<typeof navigationM
 }
 export declare const navigationMenuLinkVariants: (props?: ({
     size?: "small" | "medium" | null | undefined;
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const NavigationMenuLink: React.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>, "ref"> & NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>>;

package/dist/lib/components/NavigationMenu/NavigationMenuLink.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -27,6 +28,7 @@ import { cn } from '../../../lib/utils/utils';
 import { cva } from 'class-variance-authority';
 import { appearanceStyle, radiusVariants, scalingVariants } from '../../../lib/constants';
 import { useNavigationMenuContext } from './NavigationMenuRoot';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 export var navigationMenuLinkVariants = cva("block select-none leading-none outline-none py-1 px-3 cursor-alias hover:underline font-medium", {
     variants: {
         size: {
@@ -44,7 +46,7 @@ export var navigationMenuLinkVariants = cva("block select-none leading-none outl
 });
 export var NavigationMenuLink = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, href = _a.href, props = __rest(_a, ["children", "className", "href"]);
-    var _b = useNavigationMenuContext(), scaling = _b.scaling, size = _b.size, radius = _b.radius, _c = _b.color, color = _c === void 0 ? 'red' : _c, _d = _b.appearance, appearance = _d === void 0 ? 'ghost' : _d;
+    var _b = useNavigationMenuContext(), scaling = _b.scaling, size = _b.size, radius = _b.radius, _c = _b.color, color = _c === void 0 ? MAIN_COLOR : _c, _d = _b.appearance, appearance = _d === void 0 ? 'ghost' : _d;
     var linkClassName = cn(navigationMenuLinkVariants({ scaling: scaling, size: size, radius: radius }), appearanceStyle(appearance, color), className);
     return (_jsx(NavigationMenuPrimitive.Link, __assign({ ref: ref, href: href, title: href, className: linkClassName }, props, { children: children })));
 });

package/dist/lib/components/NavigationMenu/NavigationMenuList.d.ts

@@ -6,7 +6,7 @@ export interface NavigationMenuListProps extends VariantProps<typeof navigationM
     appearance?: 'ghost' | 'solid';
 }
 export declare const navigationMenuListVariants: (props?: ({
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const NavigationMenuList: React.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>, "ref"> & NavigationMenuListProps & React.RefAttributes<HTMLUListElement>>;

package/dist/lib/components/NavigationMenu/NavigationMenuList.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -28,6 +29,7 @@ import { cva } from 'class-variance-authority';
 import { appearanceStyle, radiusVariants, scalingVariants } from '../../../lib/constants';
 import { NavigationMenuIndicator } from './NavigationMenuIndicator';
 import { useNavigationMenuContext } from './NavigationMenuRoot';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 export var navigationMenuListVariants = cva('flex p-1 space-x-1 shadow-slate-4 shadow dark:shadow-slateDark-4 bg-white dark:bg-slateDark-1', {
     variants: {
         radius: __assign({}, radiusVariants['base']),
@@ -40,7 +42,7 @@ export var navigationMenuListVariants = cva('flex p-1 space-x-1 shadow-slate-4 s
 });
 export var NavigationMenuList = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.isShowIndicator, isShowIndicator = _b === void 0 ? true : _b, props = __rest(_a, ["children", "className", "isShowIndicator"]);
-    var _c = useNavigationMenuContext(), scaling = _c.scaling, radius = _c.radius, _d = _c.appearance, appearance = _d === void 0 ? 'ghost' : _d, _e = _c.color, color = _e === void 0 ? 'red' : _e;
+    var _c = useNavigationMenuContext(), scaling = _c.scaling, radius = _c.radius, _d = _c.appearance, appearance = _d === void 0 ? 'ghost' : _d, _e = _c.color, color = _e === void 0 ? MAIN_COLOR : _e;
     var navigationMenuListClassName = cn(navigationMenuListVariants({ scaling: scaling, radius: radius }), appearanceStyle(appearance, color, false), 'border-none', appearance === 'ghost' && 'bg-white', className);
     return (_jsxs(NavigationMenuPrimitive.List, __assign({ ref: ref, className: navigationMenuListClassName }, props, { children: [children, isShowIndicator && _jsx(NavigationMenuIndicator, {})] })));
 });

package/dist/lib/components/NavigationMenu/NavigationMenuRoot.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -21,14 +22,16 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, createContext, useContext, useMemo, } from 'react';
+import { forwardRef, createContext, useContext, } from 'react';
 import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
 import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 var NavigationMenuContext = createContext({
     radius: 'medium',
     scaling: '100%',
     size: 'medium',
-    color: 'red',
+    color: MAIN_COLOR,
     appearance: 'ghost',
 });
 export var useNavigationMenuContext = function () {
@@ -36,7 +39,14 @@ export var useNavigationMenuContext = function () {
 };
 export var NavigationMenuRoot = forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, radius = _a.radius, size = _a.size, scaling = _a.scaling, color = _a.color, appearance = _a.appearance, props = __rest(_a, ["className", "children", "radius", "size", "scaling", "color", "appearance"]);
-    var contextValue = useMemo(function () { return ({ radius: radius, size: size, scaling: scaling, color: color, appearance: appearance }); }, [radius, size, scaling, color, appearance]);
+    var theme = useTheme().theme;
+    var contextValue = {
+        radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius,
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        color: color !== null && color !== void 0 ? color : theme.themeColor,
+        size: size,
+        appearance: appearance,
+    };
     return (_jsx(NavigationMenuContext.Provider, { value: contextValue, children: _jsx(NavigationMenuPrimitive.Root, __assign({ ref: ref, className: cn('relative flex', className) }, props, { children: children })) }));
 });
 NavigationMenuRoot.displayName = 'NavigationMenu.Root';

package/dist/lib/components/NavigationMenu/NavigationMenuTrigger.d.ts

@@ -7,7 +7,7 @@ export interface NavigationMenuTriggerProps extends VariantProps<typeof navigati
 }
 export declare const navigationMenuTriggerVariants: (props?: ({
     size?: "small" | "medium" | null | undefined;
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const NavigationMenuTrigger: React.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & NavigationMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/NavigationMenu/NavigationMenuTrigger.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -28,6 +29,7 @@ import { cva } from 'class-variance-authority';
 import { appearanceStyle, scalingVariants } from '../../../lib/constants';
 import { CaretDownIcon } from '@radix-ui/react-icons';
 import { useNavigationMenuContext } from './NavigationMenuRoot';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 export var navigationMenuTriggerVariants = cva("flex items-center justify-between outline-none select-none leading-none py-1 px-3 font-medium", {
     variants: {
         size: {
@@ -51,7 +53,7 @@ export var navigationMenuTriggerVariants = cva("flex items-center justify-betwee
 });
 export var NavigationMenuTrigger = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.isShowIcon, isShowIcon = _b === void 0 ? true : _b, props = __rest(_a, ["children", "className", "isShowIcon"]);
-    var _c = useNavigationMenuContext(), scaling = _c.scaling, size = _c.size, radius = _c.radius, _d = _c.color, color = _d === void 0 ? 'red' : _d, _e = _c.appearance, appearance = _e === void 0 ? 'ghost' : _e;
+    var _c = useNavigationMenuContext(), scaling = _c.scaling, size = _c.size, radius = _c.radius, _d = _c.color, color = _d === void 0 ? MAIN_COLOR : _d, _e = _c.appearance, appearance = _e === void 0 ? 'ghost' : _e;
     var triggerClassName = cn(navigationMenuTriggerVariants({ scaling: scaling, size: size, radius: radius }), appearanceStyle(appearance, color), className);
     return (_jsxs(NavigationMenuPrimitive.Trigger, __assign({ ref: ref, className: triggerClassName }, props, { children: [children, isShowIcon && (_jsx(CaretDownIcon, { className: cn("relative top-[1px] transition-transform duration-[250] ease-in group-data-[state=open]:-rotate-180"), "aria-hidden": true }))] })));
 });

package/dist/lib/components/NavigationMenu/NavigationMenuViewport.d.ts

@@ -4,8 +4,8 @@ import { VariantProps } from 'class-variance-authority';
 export interface NavigationViewportProps extends VariantProps<typeof navigationViewportVariants> {
 }
 export declare const navigationViewportVariants: (props?: ({
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
-    weight?: "bold" | "medium" | "regular" | "semibold" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
+    weight?: "medium" | "regular" | "semibold" | "bold" | null | undefined;
     size?: "small" | "medium" | null | undefined;
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;

package/dist/lib/components/NavigationMenu/NavigationMenuViewport.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -27,7 +28,7 @@ import { cn } from '../../../lib/utils/utils';
 import { cva } from 'class-variance-authority';
 import { radiusVariants, scalingVariants, weightVariants } from '../../../lib/constants';
 import { useNavigationMenuContext } from './NavigationMenuRoot';
-export var navigationViewportVariants = cva("data-[state=open]:animate-scaleIn data-[state=closed]:animate-scaleOut relative mt-[10px] \n    h-[var(--radix-navigation-menu-viewport-height)] w-full origin-[top_center] overflow-hidden \n    transition-[width,_height] duration-300 shadow-slate-4 shadow dark:shadow-slateDark-4\n    sm:w-[var(--radix-navigation-menu-viewport-width)]", {
+export var navigationViewportVariants = cva("data-[state=open]:animate-scaleIn data-[state=closed]:animate-scaleOut relative mt-[10px] \n    h-[var(--radix-navigation-menu-viewport-height)] w-full origin-[top_center] overflow-hidden \n    transition-[width,_height] duration-300 shadow-slate-4 shadow dark:shadow-slateDark-4\n    sm:w-[var(--radix-navigation-menu-viewport-width)] bg-white", {
     variants: {
         radius: __assign({}, radiusVariants['extra-large']),
         weight: __assign({}, weightVariants),
@@ -48,6 +49,6 @@ export var NavigationMenuViewport = forwardRef(function (_a, ref) {
     var className = _a.className, props = __rest(_a, ["className"]);
     var _b = useNavigationMenuContext(), size = _b.size, scaling = _b.scaling, radius = _b.radius;
     var viewportClassName = cn(navigationViewportVariants({ size: size, scaling: scaling, radius: radius }), className);
-    return (_jsx("div", { className: "perspective-[2000px] absolute left-0 top-full flex w-full", children: _jsx(NavigationMenuPrimitive.Viewport, __assign({ ref: ref, className: viewportClassName }, props)) }));
+    return (_jsx("div", { className: "perspective-[2000px] absolute left-0 top-full z-20 flex w-full bg-white", children: _jsx(NavigationMenuPrimitive.Viewport, __assign({ ref: ref, className: viewportClassName }, props)) }));
 });
 NavigationMenuViewport.displayName = 'NavigationMenu.Viewport';

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const NavigationMenu: {
     Root: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuProps & import("react").RefAttributes<HTMLElement>, "ref"> & import("./NavigationMenuRoot").NavigationMenuProps & import("react").RefAttributes<HTMLElement>>;
     List: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>, "ref"> & import("./NavigationMenuList").NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>;

package/dist/lib/components/Popover/PopoverClose.d.ts

@@ -4,6 +4,6 @@ import { Popover as PopoverTheme } from '@radix-ui/themes';
 export interface PopoverCloseProps extends VariantProps<typeof popoverCloseVariants> {
 }
 export declare const popoverCloseVariants: (props?: ({
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const PopoverClose: React.ForwardRefExoticComponent<Omit<PopoverTheme.CloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & PopoverCloseProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/Popover/PopoverClose.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {

package/dist/lib/components/Popover/PopoverContent.d.ts

@@ -6,7 +6,7 @@ export interface PopoverContentProps extends VariantProps<typeof popoverContentV
     size?: Exclude<ISize, 'x-small'>;
 }
 export declare const popoverContentVariants: (props?: ({
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
     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;

package/dist/lib/components/Popover/PopoverContent.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {

package/dist/lib/components/Popover/PopoverRoot.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -23,6 +24,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createContext } from 'react';
 import { Theme, Popover as PopoverTheme } from '@radix-ui/themes';
+import { useTheme } from '../../../lib/theme';
 export var PopoverContext = createContext({
     radius: 'medium',
     size: 'medium',
@@ -30,7 +32,12 @@ export var PopoverContext = createContext({
 });
 export var PopoverRoot = function (_a) {
     var children = _a.children, radius = _a.radius, size = _a.size, scaling = _a.scaling, props = __rest(_a, ["children", "radius", "size", "scaling"]);
-    var contextValue = { radius: radius, size: size, scaling: scaling };
+    var theme = useTheme().theme;
+    var contextValue = {
+        radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius,
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        size: size,
+    };
     return (_jsx(Theme, { children: _jsx(PopoverContext.Provider, { value: contextValue, children: _jsx(PopoverTheme.Root, __assign({}, props, { children: children })) }) }));
 };
 PopoverRoot.displayName = 'Popover.Root';

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

@@ -1,6 +1,7 @@
+/// <reference types="react" />
 declare const Popover: {
     Root: {
-        ({ children, radius, size, scaling, ...props }: import("react").ComponentPropsWithoutRef<import("react").FC<import("@radix-ui/themes/dist/cjs/components/popover").RootProps>> & import("./PopoverRoot").PopoverProps): import("react/jsx-runtime").JSX.Element;
+        ({ children, radius, size, scaling, ...props }: import("@radix-ui/themes/dist/cjs/components/popover").RootProps & import("./PopoverRoot").PopoverProps): import("react/jsx-runtime").JSX.Element;
         displayName: string;
     };
     Trigger: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes/dist/cjs/components/popover").TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -5,7 +5,7 @@ export interface ProgressProps extends VariantProps<typeof progressVariants> {
     appearance?: 'classic' | 'surface' | 'soft';
 }
 declare const progressVariants: (props?: ({
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
     size?: "small" | "medium" | "large" | null | undefined;
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;

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

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -23,9 +24,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { cva } from 'class-variance-authority';
-import { scalingVariants } from '../../../lib/constants';
 import { Theme, Progress as ProgressTheme } from '@radix-ui/themes';
 import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
+import { scalingVariants } from '../../../lib/constants';
 var progressVariants = cva('w-[300px]', {
     variants: {
         radius: {
@@ -49,8 +52,16 @@ var progressVariants = cva('w-[300px]', {
     },
 });
 export var Progress = forwardRef(function (_a, ref) {
-    var className = _a.className, radius = _a.radius, size = _a.size, value = _a.value, _b = _a.appearance, appearance = _b === void 0 ? 'surface' : _b, _c = _a.color, color = _c === void 0 ? 'red' : _c, scaling = _a.scaling, props = __rest(_a, ["className", "radius", "size", "value", "appearance", "color", "scaling"]);
-    return (_jsx(Theme, { accentColor: color, children: _jsx(ProgressTheme, __assign({ ref: ref, value: value, variant: appearance, className: cn(progressVariants({ radius: radius, size: size, scaling: scaling }), className) }, props)) }));
+    var _b;
+    var className = _a.className, radius = _a.radius, size = _a.size, value = _a.value, _c = _a.appearance, appearance = _c === void 0 ? 'surface' : _c, color = _a.color, scaling = _a.scaling, props = __rest(_a, ["className", "radius", "size", "value", "appearance", "color", "scaling"]);
+    var theme = useTheme().theme;
+    var progressStyle = {
+        radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius,
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        color: (_b = color !== null && color !== void 0 ? color : theme.themeColor) !== null && _b !== void 0 ? _b : MAIN_COLOR,
+        size: size,
+    };
+    return (_jsx(Theme, { accentColor: progressStyle.color, children: _jsx(ProgressTheme, __assign({ ref: ref, value: value, variant: appearance, className: cn(progressVariants(progressStyle), className) }, props)) }));
 });
 Progress.displayName = 'Progress';
 export default Progress;

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

@@ -52,7 +52,7 @@ var radarChartVariants = cva('', {
 });
 export var RadarChart = function (_a) {
     var className = _a.className, title = _a.title, legend = _a.legend, datalabels = _a.datalabels, datasets = _a.datasets, labels = _a.labels, width = _a.width, height = _a.height, scaling = _a.scaling, _b = _a.appearance, appearance = _b === void 0 ? 'solid' : _b, _c = _a.isColorMixed, isColorMixed = _c === void 0 ? true : _c, props = __rest(_a, ["className", "title", "legend", "datalabels", "datasets", "labels", "width", "height", "scaling", "appearance", "isColorMixed"]);
-    var _d = useDarkMode(true), isDark = _d[0], defaultScales = _d[1];
+    var _d = useDarkMode(true), defaultScales = _d[1];
     var getChartColor = function (isColorMixed, appearance) {
         if (appearance === 'solid') {
             return isColorMixed ? chartColorList.mixed : chartColorList.sorting;

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

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -26,6 +27,8 @@ import { cva } from 'class-variance-authority';
 import { Theme, Radio as RadioTheme, Flex } from '@radix-ui/themes';
 import { Text } from '../../../lib/Typography/Text';
 import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 var radioVariants = cva('font-normal', {
     variants: {
         size: {
@@ -39,15 +42,19 @@ var radioVariants = cva('font-normal', {
     },
 });
 export var Radio = forwardRef(function (_a, ref) {
-    var value = _a.value, scaling = _a.scaling, color = _a.color, _b = _a.size, size = _b === void 0 ? 'medium' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'surface' : _c, children = _a.children, className = _a.className, props = __rest(_a, ["value", "scaling", "color", "size", "appearance", "children", "className"]);
-    if (!color)
-        color = 'red';
+    var _b;
+    var value = _a.value, scaling = _a.scaling, color = _a.color, _c = _a.size, size = _c === void 0 ? 'medium' : _c, _d = _a.appearance, appearance = _d === void 0 ? 'surface' : _d, children = _a.children, className = _a.className, props = __rest(_a, ["value", "scaling", "color", "size", "appearance", "children", "className"]);
+    var theme = useTheme().theme;
     var sizeTheme = '2';
     if (size === 'small')
         sizeTheme = '1';
     if (size === 'large')
         sizeTheme = '3';
-    return (_jsx(Theme, { accentColor: color, scaling: scaling, children: _jsx(Flex, { asChild: true, className: cn(radioVariants({ size: size }), className), children: _jsxs(Text, { as: "label", size: sizeTheme, children: [_jsx(RadioTheme, __assign({ ref: ref, value: value, variant: appearance, size: sizeTheme }, props)), children] }) }) }));
+    var radioStyle = {
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        color: (_b = color !== null && color !== void 0 ? color : theme.themeColor) !== null && _b !== void 0 ? _b : MAIN_COLOR,
+    };
+    return (_jsx(Theme, { accentColor: radioStyle.color, scaling: radioStyle.scaling, children: _jsx(Flex, { asChild: true, className: cn(radioVariants({ size: size }), className), children: _jsxs(Text, { as: "label", size: sizeTheme, color: "black", children: [_jsx(RadioTheme, __assign({ ref: ref, value: value, variant: appearance, size: sizeTheme }, props)), children] }) }) }));
 });
 Radio.displayName = 'Radio';
 export default Radio;

package/dist/lib/components/RadioCards/RadioCardsItem.d.ts

@@ -4,7 +4,7 @@ import { RadioCards as RadioCardsTheme } from '@radix-ui/themes';
 export interface RadioCardsItemProps extends VariantProps<typeof radioCardsItemVariants> {
 }
 export declare const radioCardsItemVariants: (props?: ({
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
     size?: "small" | "medium" | "large" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const RadioCardsItem: React.ForwardRefExoticComponent<Omit<RadioCardsTheme.ItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & RadioCardsItemProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/RadioCards/RadioCardsItem.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {

package/dist/lib/components/RadioCards/RadioCardsRoot.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -26,6 +27,8 @@ import { cva } from 'class-variance-authority';
 import { scalingVariants } from '../../../lib/constants';
 import { Theme, RadioCards as RadioCardsTheme } from '@radix-ui/themes';
 import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 var radioCardsVariants = cva('flex items-center gap-2', {
     variants: {
         scaling: __assign({}, scalingVariants),
@@ -39,8 +42,15 @@ export var RadioCardsContext = createContext({
     size: 'medium',
 });
 export var RadioCardsRoot = forwardRef(function (_a, ref) {
-    var children = _a.children, className = _a.className, radius = _a.radius, scaling = _a.scaling, size = _a.size, _b = _a.color, color = _b === void 0 ? 'red' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'surface' : _c, props = __rest(_a, ["children", "className", "radius", "scaling", "size", "color", "appearance"]);
-    var contextValue = { radius: radius, size: size };
-    return (_jsx(Theme, { accentColor: color, children: _jsx(RadioCardsContext.Provider, { value: contextValue, children: _jsx(RadioCardsTheme.Root, __assign({ ref: ref, variant: appearance, className: cn(radioCardsVariants({ scaling: scaling }), className) }, props, { children: children })) }) }));
+    var _b;
+    var children = _a.children, className = _a.className, radius = _a.radius, scaling = _a.scaling, size = _a.size, color = _a.color, _c = _a.appearance, appearance = _c === void 0 ? 'surface' : _c, props = __rest(_a, ["children", "className", "radius", "scaling", "size", "color", "appearance"]);
+    var theme = useTheme().theme;
+    var contextValue = {
+        radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius,
+        color: (_b = color !== null && color !== void 0 ? color : theme.themeColor) !== null && _b !== void 0 ? _b : MAIN_COLOR,
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        size: size,
+    };
+    return (_jsx(Theme, { accentColor: contextValue.color, children: _jsx(RadioCardsContext.Provider, { value: contextValue, children: _jsx(RadioCardsTheme.Root, __assign({ ref: ref, variant: appearance, className: cn(radioCardsVariants({ scaling: contextValue.scaling }), className) }, props, { children: children })) }) }));
 });
 RadioCardsRoot.displayName = 'RadioCards.Root';

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const RadioCards: {
     Root: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/themes/dist/cjs/components/radio-cards").RootProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "size"> & import("./RadioCardsRoot").RadioCardsProps & import("react").RefAttributes<HTMLDivElement>>;
     Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes/dist/cjs/components/radio-cards").ItemProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./RadioCardsItem").RadioCardsItemProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/RadioGroup/RadioGroupItem.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {

package/dist/lib/components/RadioGroup/RadioGroupRoot.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -25,6 +26,8 @@ import { createContext, forwardRef } from 'react';
 import { Theme, RadioGroup as RadioGroupTheme } from '@radix-ui/themes';
 import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 var radioGroupVariants = cva('', {
     variants: {
         size: {
@@ -41,13 +44,19 @@ export var RadioGroupContext = createContext({
     size: 'medium',
 });
 export var RadioGroupRoot = forwardRef(function (_a, ref) {
-    var className = _a.className, children = _a.children, scaling = _a.scaling, size = _a.size, _b = _a.color, color = _b === void 0 ? 'red' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'surface' : _c, props = __rest(_a, ["className", "children", "scaling", "size", "color", "appearance"]);
-    var contextValue = { size: size };
+    var _b;
+    var className = _a.className, children = _a.children, scaling = _a.scaling, size = _a.size, color = _a.color, _c = _a.appearance, appearance = _c === void 0 ? 'surface' : _c, props = __rest(_a, ["className", "children", "scaling", "size", "color", "appearance"]);
+    var theme = useTheme().theme;
+    var contextValue = {
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        color: (_b = color !== null && color !== void 0 ? color : theme.themeColor) !== null && _b !== void 0 ? _b : MAIN_COLOR,
+        size: size,
+    };
     var sizeTheme = '2';
     if (size === 'small')
         sizeTheme = '1';
     if (size === 'large')
         sizeTheme = '3';
-    return (_jsx(Theme, { accentColor: color, scaling: scaling, children: _jsx(RadioGroupContext.Provider, { value: contextValue, children: _jsx(RadioGroupTheme.Root, __assign({ ref: ref, size: sizeTheme, variant: appearance, className: cn(radioGroupVariants({ size: size }), className) }, props, { children: children })) }) }));
+    return (_jsx(Theme, { accentColor: contextValue.color, scaling: contextValue.scaling, children: _jsx(RadioGroupContext.Provider, { value: contextValue, children: _jsx(RadioGroupTheme.Root, __assign({ ref: ref, size: sizeTheme, variant: appearance, className: cn(radioGroupVariants({ size: size }), className) }, props, { children: children })) }) }));
 });
 RadioGroupRoot.displayName = 'RadioGroup.Root';

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const RadioGroup: {
     Root: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/themes/dist/cjs/components/radio-group").RootProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "size"> & import("./RadioGroupRoot").RadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
     Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes/dist/cjs/components/radio-group").ItemProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./RadioGroupItem").RadioGroupItemProps & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -23,14 +24,16 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { Theme, ScrollArea as ScrollAreaTheme } from '@radix-ui/themes';
+import { useTheme } from '../../../lib/theme';
 export var ScrollArea = forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, scrollbars = _a.scrollbars, radius = _a.radius, _b = _a.size, size = _b === void 0 ? 'small' : _b, props = __rest(_a, ["className", "children", "scrollbars", "radius", "size"]);
+    var theme = useTheme().theme;
     var sizeTheme = '1';
     if (size === 'medium')
         sizeTheme = '2';
     if (size === 'large')
         sizeTheme = '3';
-    return (_jsx(Theme, { children: _jsx(ScrollAreaTheme, __assign({ ref: ref, scrollbars: scrollbars, radius: radius, size: sizeTheme, className: className }, props, { children: children })) }));
+    return (_jsx(Theme, { children: _jsx(ScrollAreaTheme, __assign({ ref: ref, scrollbars: scrollbars, radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius, size: sizeTheme, className: className }, props, { children: children })) }));
 });
 ScrollArea.displayName = 'ScrollArea';
 export default ScrollArea;

package/dist/lib/components/SegmentedControl/SegmentedControlRoot.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { VariantProps } from 'class-variance-authority';
 import { SegmentedControl as SegmentedControlTheme } from '@radix-ui/themes';
-export * from './SegmentedControlItem';
+export { SegmentedControlItem } from './SegmentedControlItem';
 import { ISize } from '../../../lib/types';
 export interface SegmentedControlProps extends VariantProps<typeof segmentedControlVariants> {
     appearance?: 'surface' | 'classic';

package/dist/lib/components/SegmentedControl/SegmentedControlRoot.js

@@ -1,3 +1,4 @@
+'use client';
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -25,8 +26,9 @@ import React, { Children, forwardRef } from 'react';
 import { cva } from 'class-variance-authority';
 import { SegmentedControl as SegmentedControlTheme, Theme } from '@radix-ui/themes';
 import { scalingVariants } from '../../../lib/constants';
-export * from './SegmentedControlItem';
+export { SegmentedControlItem } from './SegmentedControlItem';
 import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
 var segmentedControlVariants = cva('text-slateA-12 dark:text-slateDarkA-12', {
     variants: {
         scaling: __assign({}, scalingVariants),
@@ -36,12 +38,18 @@ var segmentedControlVariants = cva('text-slateA-12 dark:text-slateDarkA-12', {
     },
 });
 export var SegmentedControlRoot = forwardRef(function (_a, ref) {
-    var children = _a.children, className = _a.className, _b = _a.appearance, appearance = _b === void 0 ? 'surface' : _b, _c = _a.radius, radius = _c === void 0 ? 'medium' : _c, _d = _a.size, size = _d === void 0 ? 'medium' : _d, scaling = _a.scaling, props = __rest(_a, ["children", "className", "appearance", "radius", "size", "scaling"]);
+    var _b;
+    var children = _a.children, className = _a.className, _c = _a.appearance, appearance = _c === void 0 ? 'surface' : _c, radius = _a.radius, _d = _a.size, size = _d === void 0 ? 'medium' : _d, scaling = _a.scaling, props = __rest(_a, ["children", "className", "appearance", "radius", "size", "scaling"]);
+    var theme = useTheme().theme;
     var sizeTheme = '2';
     if (size === 'small')
         sizeTheme = '1';
     if (size === 'large')
         sizeTheme = '3';
-    return (_jsx(Theme, { children: _jsx(SegmentedControlTheme.Root, __assign({ ref: ref, size: sizeTheme, radius: radius, variant: appearance, className: cn(segmentedControlVariants({ scaling: scaling }), className) }, props, { children: Children.map(children, function (child) { return React.cloneElement(child, { appearance: appearance }); }) })) }));
+    var contextValue = {
+        radius: (_b = radius !== null && radius !== void 0 ? radius : theme.themeRadius) !== null && _b !== void 0 ? _b : 'medium',
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+    };
+    return (_jsx(Theme, { children: _jsx(SegmentedControlTheme.Root, __assign({ ref: ref, size: sizeTheme, radius: contextValue.radius, variant: appearance, className: cn(segmentedControlVariants({ scaling: contextValue.scaling }), className) }, props, { children: Children.map(children, function (child) { return React.cloneElement(child, { appearance: appearance }); }) })) }));
 });
 SegmentedControlRoot.displayName = 'SegmentedControl.Root';

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const SegmentedControl: {
     Root: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/themes/dist/cjs/components/segmented-control").RootProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "size"> & import("./SegmentedControlRoot").SegmentedControlProps & import("react").RefAttributes<HTMLDivElement>>;
     Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes/dist/cjs/components/segmented-control").ItemProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./SegmentedControlItem").SegmentedControlItemProps & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -1,5 +1,5 @@
 import { SegmentedControlRoot } from './SegmentedControlRoot';
-import { SegmentedControlItem } from './SegmentedControlRoot';
+import { SegmentedControlItem } from './SegmentedControlItem';
 var SegmentedControl = {
     Root: SegmentedControlRoot,
     Item: SegmentedControlItem,

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

@@ -1,7 +1,7 @@
 import { Select as SelectTheme } from '@radix-ui/themes';
 import React from 'react';
 import { VariantProps } from 'class-variance-authority';
-import { IScaling } from '../../../lib/types';
+import { IRadius, IScaling } from '../../../lib/types';
 export interface SelectProps extends VariantProps<typeof selectVariants> {
     label?: string;
     defaultValue?: string;
@@ -11,10 +11,12 @@ export interface SelectProps extends VariantProps<typeof selectVariants> {
     scaling?: IScaling;
     appearance?: 'classic' | 'surface' | 'soft' | 'ghost';
     size?: 'small' | 'medium' | 'large';
+    radius?: IRadius;
 }
 declare const selectVariants: (props?: ({
-    radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
+    radius?: "none" | "small" | "medium" | "large" | "full" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const useSelectContext: () => SelectProps;
 export declare const Root: React.ForwardRefExoticComponent<SelectTheme.RootProps & SelectProps & React.RefAttributes<never>>;
 export declare const Trigger: React.ForwardRefExoticComponent<Omit<SelectTheme.TriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & SelectProps & React.RefAttributes<HTMLButtonElement>>;
 export declare const Content: React.ForwardRefExoticComponent<Omit<SelectTheme.ContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & SelectProps & React.RefAttributes<HTMLDivElement>>;