@lotte-innovate/ui-component-test 0.1.34 → 0.1.35

package/dist/lib/Typography/Text/index.js

@@ -26,7 +26,7 @@ import { cva } from 'class-variance-authority';
 import { Text as TextTheme, Theme } from '@radix-ui/themes';
 import { textColorStyle, weightVariants } from '../../../lib/constants';
 import { cn } from '../../../lib/utils/utils';
-var textVariants = cva('text', {
+var textVariants = cva('', {
     variants: {
         weight: __assign({ light: 'font-light' }, weightVariants),
         color: textColorStyle(),

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

@@ -27,7 +27,7 @@ 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", {
+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',
@@ -37,10 +37,10 @@ export var alertDialogActionVariants = cva("inline-flex items-center justify-cen
             full: 'rounded-full',
         },
         size: {
-            small: 'text-xs h-[24px] px-2',
-            medium: 'text-sm h-[32px] px-3',
-            large: 'text-sm h-[32px] px-3',
-            'x-large': 'text-base h-[40px] px-4',
+            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(),

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

@@ -27,7 +27,7 @@ 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", {
+export var alertDialogCancelVariants = cva("inline-flex justify-center items-center outline-none w-fit", {
     variants: {
         radius: {
             none: 'rounded-none',
@@ -37,10 +37,10 @@ export var alertDialogCancelVariants = cva("inline-flex justify-center items-cen
             full: 'rounded-full',
         },
         size: {
-            small: 'text-xs h-[24px] px-2 mr-2',
-            medium: 'text-sm h-[32px] px-3 mr-2',
-            large: 'text-sm h-[32px] px-3 mr-3',
-            'x-large': 'text-base h-[40px] px-4 mr-3',
+            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),
     },

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

@@ -44,7 +44,7 @@ var buttonVariants = cva("inline-flex items-center transition-colors focus:outli
         scaling: '100%',
         weight: 'medium',
         color: 'red',
-        size: 'large',
+        size: 'medium',
     },
 });
 export var AlertDialogTrigger = forwardRef(function (_a, ref) {

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

@@ -9,6 +9,7 @@ export interface AvatarProps extends VariantProps<typeof AvatarVariants> {
     ariaLabel?: string;
     ariaLabelledby?: string;
     title?: string;
+    delayMs?: number;
 }
 declare const AvatarVariants: (props?: ({
     radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;

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

@@ -50,9 +50,9 @@ var AvatarVariants = cva('font-medium', {
     },
 });
 var Avatar = forwardRef(function (_a, ref) {
-    var className = _a.className, fallbackClassName = _a.fallbackClassName, radius = _a.radius, scaling = _a.scaling, size = _a.size, fallbackText = _a.fallbackText, imagePath = _a.imagePath, alt = _a.alt, _b = _a.appearance, appearance = _b === void 0 ? 'solid' : _b, _c = _a.color, color = _c === void 0 ? 'red' : _c, ariaLabel = _a.ariaLabel, ariaLabelledby = _a.ariaLabelledby, title = _a.title, props = __rest(_a, ["className", "fallbackClassName", "radius", "scaling", "size", "fallbackText", "imagePath", "alt", "appearance", "color", "ariaLabel", "ariaLabelledby", "title"]);
+    var className = _a.className, fallbackClassName = _a.fallbackClassName, radius = _a.radius, scaling = _a.scaling, size = _a.size, fallbackText = _a.fallbackText, imagePath = _a.imagePath, alt = _a.alt, _b = _a.appearance, appearance = _b === void 0 ? 'solid' : _b, _c = _a.color, color = _c === void 0 ? 'red' : _c, ariaLabel = _a.ariaLabel, ariaLabelledby = _a.ariaLabelledby, title = _a.title, _d = _a.delayMs, delayMs = _d === void 0 ? 300 : _d, props = __rest(_a, ["className", "fallbackClassName", "radius", "scaling", "size", "fallbackText", "imagePath", "alt", "appearance", "color", "ariaLabel", "ariaLabelledby", "title", "delayMs"]);
     var imgAltText = alt || ariaLabel || fallbackText || 'Avatar Image';
-    return (_jsxs(AvatarPrimitive.Root, __assign({ className: cn("inline-flex select-none items-center justify-center overflow-hidden align-middle", AvatarVariants({ radius: radius, scaling: scaling, size: size, color: color }), appearanceStyle(appearance, color, false), className) }, props, { ref: ref, role: "img", "aria-label": ariaLabel || imgAltText, "aria-labelledby": ariaLabelledby, title: title || imgAltText, tabIndex: 0, children: [_jsx(AvatarPrimitive.Image, { className: "h-full w-full border-none object-cover", src: imagePath, alt: imgAltText, title: title || imgAltText }), _jsx(AvatarPrimitive.Fallback, { className: cn("leading-1 flex h-full w-full items-center justify-center", className), delayMs: 300, "aria-hidden": "true", children: fallbackText })] })));
+    return (_jsxs(AvatarPrimitive.Root, __assign({ className: cn("inline-flex select-none items-center justify-center overflow-hidden align-middle", AvatarVariants({ radius: radius, scaling: scaling, size: size, color: color }), appearanceStyle(appearance, color, false), className) }, props, { ref: ref, role: "img", "aria-label": ariaLabel || imgAltText, "aria-labelledby": ariaLabelledby, title: title || imgAltText, tabIndex: 0, children: [_jsx(AvatarPrimitive.Image, { className: "h-full w-full border-none object-cover", src: imagePath, alt: imgAltText, title: title || imgAltText }), _jsx(AvatarPrimitive.Fallback, { className: cn("leading-1 flex h-full w-full items-center justify-center", className), delayMs: delayMs, "aria-hidden": "true", children: fallbackText })] })));
 });
 Avatar.displayName = 'Avatar';
 export default Avatar;

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

@@ -25,7 +25,7 @@ import { forwardRef } from 'react';
 import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { appearanceStyle, primaryColorStyle, radiusVariants, scalingVariants, weightVariants, } from '../../../lib/constants';
-var BadgeVariants = cva('inline-flex items-center transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', {
+var BadgeVariants = cva('inline-flex items-center transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 w-fit', {
     variants: {
         radius: __assign({}, radiusVariants['base']),
         size: {

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

@@ -27,6 +27,7 @@ import { scalingVariants } from '../../../lib/constants';
 import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { chartAlphaColorList, chartColorList } from '../../../lib/color/constants';
+import { useDarkMode } from '../../../lib/utils/useDarkMode';
 ChartJS.register(CategoryScale, LinearScale, BarElement, Tooltip, Legend);
 var barChartVariants = cva('', {
     variants: {
@@ -38,6 +39,7 @@ var barChartVariants = cva('', {
 });
 var BarChart = function (_a) {
     var className = _a.className, title = _a.title, datasets = _a.datasets, labels = _a.labels, scaling = _a.scaling, legend = _a.legend, width = _a.width, height = _a.height, indexAxis = _a.indexAxis, _b = _a.appearance, appearance = _b === void 0 ? 'solid' : _b, _c = _a.isColorMixed, isColorMixed = _c === void 0 ? true : _c, props = __rest(_a, ["className", "title", "datasets", "labels", "scaling", "legend", "width", "height", "indexAxis", "appearance", "isColorMixed"]);
+    var _d = useDarkMode(), isDark = _d[0], defaultScales = _d[1];
     datasets.forEach(function (dataset, index) {
         if (!dataset.backgroundColor) {
             if (isColorMixed) {
@@ -54,6 +56,7 @@ var BarChart = function (_a) {
                 legend: legend,
             },
             indexAxis: indexAxis,
+            scales: __assign({}, defaultScales.linescale),
         }, className: cn(barChartVariants({ scaling: scaling }), className), width: width, height: height }, props)));
 };
 BarChart.displayName = 'BarChart';

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

@@ -1,35 +1,28 @@
-import { PointStyle } from '../../../lib/types';
 import { VariantProps } from 'class-variance-authority';
-export interface BubbleChartProps extends VariantProps<typeof bubbleChartVariants> {
-    datasets: {
-        label: string;
-        data: {
-            x: number;
-            y: number;
-            r: number;
-        }[];
-        backgroundColor?: string;
-        borderColor?: string;
-        borderWidth?: number;
-        hoverBackgroundColor?: string;
-        hoverBorderColor?: string;
-        hoverBorderWidth?: number;
-        pointStyle?: PointStyle;
-        rotation?: number;
-        radius?: number;
-        order?: number;
+import { IChartDataLabels, IChartDatasets, IChartLegend, IChartTitle } from '../../../lib/types';
+type IBubbleChartDataset = IChartDatasets & {
+    data: {
+        x: number;
+        y: number;
+        r: number;
     }[];
-    options?: {};
+};
+export interface BubbleChartProps extends VariantProps<typeof bubbleChartVariants> {
+    appearance?: 'solid' | 'soft';
+    isColorMixed?: boolean;
     className?: string;
+    title?: IChartTitle;
+    legend?: IChartLegend;
+    datasets: IBubbleChartDataset[];
+    datalabels?: IChartDataLabels;
     width?: string | number;
     height?: string | number;
-    isColorMixed?: boolean;
 }
 declare const bubbleChartVariants: (props?: ({
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const BubbleChart: {
-    ({ className, datasets, scaling, width, height, isColorMixed, ...props }: BubbleChartProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, title, legend, datalabels, datasets, scaling, width, height, appearance, isColorMixed, ...props }: BubbleChartProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default BubbleChart;

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

@@ -22,12 +22,17 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Bubble } from 'react-chartjs-2';
-import { Chart as ChartJS, LinearScale, PointElement, Tooltip, Legend } from 'chart.js/auto';
+import { Chart as ChartJS, LinearScale, PointElement, Tooltip, Legend, plugins, } from 'chart.js/auto';
 import { scalingVariants } from '../../../lib/constants';
 import { cva } from 'class-variance-authority';
-import { chartColorList } from '../../../lib/color/constants';
+import { chartColorList, chartAlphaColorList } from '../../../lib/color/constants';
+import ChartDataLabels from 'chartjs-plugin-datalabels';
+import { useDarkMode } from '../../../lib/utils/useDarkMode';
 import { cn } from '../../../lib/utils/utils';
-ChartJS.register(LinearScale, PointElement, Tooltip, Legend);
+ChartJS.register(LinearScale, PointElement, Tooltip, Legend, plugins, ChartDataLabels);
+ChartJS.defaults.set('plugins.datalabels', {
+    display: false,
+});
 var bubbleChartVariants = cva('', {
     variants: {
         scaling: __assign({}, scalingVariants),
@@ -37,18 +42,32 @@ var bubbleChartVariants = cva('', {
     },
 });
 export var BubbleChart = function (_a) {
-    var className = _a.className, datasets = _a.datasets, scaling = _a.scaling, width = _a.width, height = _a.height, _b = _a.isColorMixed, isColorMixed = _b === void 0 ? true : _b, props = __rest(_a, ["className", "datasets", "scaling", "width", "height", "isColorMixed"]);
-    if (isColorMixed) {
-        datasets.forEach(function (dataset, index) {
-            dataset.backgroundColor = chartColorList.mixed[index];
-        });
-    }
-    else {
-        datasets.forEach(function (dataset, index) {
-            dataset.backgroundColor = chartColorList.sorting[index];
-        });
-    }
-    return (_jsx(Bubble, __assign({ data: { datasets: datasets }, className: cn(bubbleChartVariants({ scaling: scaling }), className), width: width, height: height }, props)));
+    var className = _a.className, title = _a.title, legend = _a.legend, datalabels = _a.datalabels, datasets = _a.datasets, scaling = _a.scaling, width = _a.width, height = _a.height, _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", "scaling", "width", "height", "appearance", "isColorMixed"]);
+    var _d = useDarkMode(), isDark = _d[0], defaultScales = _d[1];
+    var getChartColor = function (isColorMixed, appearance) {
+        if (appearance === 'solid') {
+            return isColorMixed ? chartColorList.mixed : chartColorList.sorting;
+        }
+        if (appearance === 'soft') {
+            return isColorMixed ? chartAlphaColorList.mixed : chartAlphaColorList.sorting;
+        }
+    };
+    datasets.forEach(function (dataset, index) {
+        var ChartColor = getChartColor(isColorMixed, appearance);
+        var BorderColor = getChartColor(isColorMixed, 'solid');
+        if (!ChartColor || !BorderColor)
+            return;
+        dataset.backgroundColor = ChartColor[index];
+        dataset.borderColor = BorderColor[index];
+    });
+    return (_jsx(Bubble, __assign({ data: { datasets: datasets }, options: {
+            plugins: {
+                title: title,
+                legend: legend,
+                datalabels: datalabels,
+            },
+            scales: __assign({}, defaultScales.linescale),
+        }, className: cn(bubbleChartVariants({ scaling: scaling }), className), width: width, height: height }, props)));
 };
 BubbleChart.displayName = 'BubbleChart';
 export default BubbleChart;

package/dist/lib/components/Callout/CalloutIcon.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { Callout as CalloutTheme } from '@radix-ui/themes';
 import { VariantProps } from 'class-variance-authority';
 export interface CalloutIconProps extends VariantProps<typeof calloutIconVariants> {
     iconType?: 'danger' | 'success' | 'warning' | 'information';
@@ -8,5 +9,5 @@ declare const calloutIconVariants: (props?: ({
     size?: "small" | "medium" | "large" | null | undefined;
     color?: "danger" | "warning" | "success" | "information" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export declare const CalloutIcon: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & CalloutIconProps & React.RefAttributes<HTMLDivElement>>;
+export declare const CalloutIcon: React.ForwardRefExoticComponent<Omit<CalloutTheme.IconProps & React.RefAttributes<HTMLDivElement>, "ref"> & CalloutIconProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/lib/components/Callout/CalloutRoot.js

@@ -36,10 +36,10 @@ var calloutVariants = cva('flex w-fit max-w-[600px]', {
         },
         scaling: __assign({}, scalingVariants),
         color: {
-            danger: 'bg-red-3 dark:bg-redDark-3',
-            warning: 'bg-amber-3 dark:bg-amberDark-3',
-            success: 'bg-green-3 dark:bg-greenDark-3',
-            information: 'bg-sky-3 dark:bg-skyDark-3',
+            danger: 'bg-redA-3 dark:bg-redDarkA-3',
+            warning: 'bg-amberA-3 dark:bg-amberDarkA-3',
+            success: 'bg-greenA-3 dark:bg-greenDarkA-3',
+            information: 'bg-skyA-3 dark:bg-skyDarkA-3',
         },
     },
     defaultVariants: {

package/dist/lib/components/Callout/CalloutText.js

@@ -25,7 +25,7 @@ import { forwardRef } from 'react';
 import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { useCalloutContext } from './CalloutRoot';
-export var calloutTextVariants = cva('break-words font-normal text-slate-12 dark:text-slateDark-12 ', {
+export var calloutTextVariants = cva('break-words font-normal text-slate-12 dark:text-slateDark-12', {
     variants: {
         size: {
             small: 'text-sm',

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

@@ -2,6 +2,6 @@
 declare const Callout: {
     Root: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("./CalloutRoot").CalloutProps & import("react").RefAttributes<HTMLDivElement>>;
     Text: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("./CalloutText").CalloutTextProps & import("react").RefAttributes<HTMLParagraphElement>>;
-    Icon: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("./CalloutIcon").CalloutIconProps & import("react").RefAttributes<HTMLDivElement>>;
+    Icon: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes/dist/cjs/components/callout").IconProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./CalloutIcon").CalloutIconProps & import("react").RefAttributes<HTMLDivElement>>;
 };
 export default Callout;

package/dist/lib/components/CheckboxGroup/CheckboxGroupRoot.d.ts

@@ -1,4 +1,5 @@
 import React, { ReactNode } from 'react';
+import { CheckboxGroup as CheckboxGroupTheme } from '@radix-ui/themes';
 import { CheckboxVariants } from '../../../lib/components/Checkbox';
 import { VariantProps } from 'class-variance-authority';
 import { IAppearance, IColor } from '../../../lib/types';
@@ -12,5 +13,5 @@ export declare const CheckboxGroupVariants: (props?: ({
     size?: "small" | "medium" | "large" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const useCheckboxGroupContext: () => CheckboxGroupRootProps;
-export declare const CheckboxGroupRoot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & CheckboxGroupRootProps & React.RefAttributes<HTMLDivElement>>;
+export declare const CheckboxGroupRoot: React.ForwardRefExoticComponent<Omit<CheckboxGroupTheme.RootProps & React.RefAttributes<HTMLDivElement>, "ref"> & CheckboxGroupRootProps & React.RefAttributes<HTMLDivElement>>;
 export default CheckboxGroupRoot;

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 declare const CheckboxGroup: {
-    Root: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("./CheckboxGroupRoot").CheckboxGroupRootProps & import("react").RefAttributes<HTMLDivElement>>;
+    Root: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/themes/dist/cjs/components/checkbox-group").RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./CheckboxGroupRoot").CheckboxGroupRootProps & import("react").RefAttributes<HTMLDivElement>>;
     Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-checkbox").CheckboxProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("../../../lib/components/Checkbox").CheckboxProps & import("react").RefAttributes<HTMLButtonElement>>;
 };
 export default CheckboxGroup;

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

@@ -27,6 +27,7 @@ import { scalingVariants } from '../../../lib/constants';
 import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { chartAlphaColorList, chartColorList } from '../../../lib/color/constants';
+import { useDarkMode } from '../../../lib/utils/useDarkMode';
 ChartJS.register(CategoryScale, LinearScale, LineElement, PointElement, Tooltip, Legend);
 var lineChartVariants = cva('', {
     variants: {
@@ -38,6 +39,7 @@ var lineChartVariants = cva('', {
 });
 var LineChart = function (_a) {
     var className = _a.className, title = _a.title, datasets = _a.datasets, labels = _a.labels, scaling = _a.scaling, legend = _a.legend, width = _a.width, height = _a.height, indexAxis = _a.indexAxis, _b = _a.appearance, appearance = _b === void 0 ? 'solid' : _b, scales = _a.scales, _c = _a.isColorMixed, isColorMixed = _c === void 0 ? true : _c, props = __rest(_a, ["className", "title", "datasets", "labels", "scaling", "legend", "width", "height", "indexAxis", "appearance", "scales", "isColorMixed"]);
+    var _d = useDarkMode(), isDark = _d[0], defaultScales = _d[1];
     var colorset = isColorMixed ? chartColorList.mixed : chartColorList.sorting;
     var colorAlphaset = isColorMixed ? chartAlphaColorList.mixed : chartAlphaColorList.sorting;
     datasets.forEach(function (dataset, index) {
@@ -52,7 +54,7 @@ var LineChart = function (_a) {
                 legend: legend,
             },
             indexAxis: indexAxis,
-            scales: scales,
+            scales: __assign(__assign({}, defaultScales.linescale), scales),
         }, className: cn(lineChartVariants({ scaling: scaling }), className), width: width, height: height }, props)));
 };
 LineChart.displayName = 'LineChart';

package/dist/lib/components/Menubar/MenubarMenu.d.ts

@@ -1,2 +1,5 @@
 import React from 'react';
-export declare const MenubarMenu: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<never>>;
+import * as MenubarPrimitive from '@radix-ui/react-menubar';
+export declare const MenubarMenu: React.ForwardRefExoticComponent<MenubarPrimitive.MenubarMenuProps & {
+    __scopeMenubar?: import("@radix-ui/react-context").Scope;
+} & React.RefAttributes<never>>;

package/dist/lib/components/Menubar/MenubarRoot.js

@@ -54,7 +54,7 @@ export var useMenubarContext = function () {
 export var MenubarRoot = 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 ? 'ghost' : _c, _d = _a.itemAppearance, itemAppearance = _d === void 0 ? 'solid' : _d, props = __rest(_a, ["children", "className", "radius", "scaling", "size", "color", "appearance", "itemAppearance"]);
     var contextValue = useMemo(function () { return ({ radius: radius, size: size, scaling: scaling, color: color, appearance: appearance, itemAppearance: itemAppearance }); }, [radius, size, scaling, color, appearance, itemAppearance]);
-    var menuClassName = cn(menubarVariants({ radius: radius, scaling: scaling, size: size }), appearance === 'solid' && "bg-".concat(color, "-9 dark:bg-$").concat(color, "Dark-9"), 'w-fit', className);
+    var menuClassName = cn(menubarVariants({ radius: radius, scaling: scaling, size: size }), appearance === 'solid' && "bg-".concat(color, "-9 dark:bg-$").concat(color, "Dark-9"), className);
     return (_jsx(MenubarContext.Provider, { value: contextValue, children: _jsx(MenubarPrimitive.Root, __assign({ ref: ref, className: menuClassName }, props, { children: children })) }));
 });
 MenubarRoot.displayName = 'Menubar.Root';

package/dist/lib/components/Menubar/MenubarTrigger.js

@@ -27,7 +27,7 @@ import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { appearanceStyle, scalingVariants } from '../../../lib/constants';
 import { useMenubarContext } from './MenubarRoot';
-export var menubarTriggerVariants = cva("flex items-center justify-between gap-[2px] outline-none select-none leading-none py-1 px-3 font-medium", {
+export var menubarTriggerVariants = cva("flex items-center justify-between gap-[2px] outline-none select-none leading-none py-1 px-3 \n    font-medium truncate w-fit", {
     variants: {
         size: {
             small: 'text-xs',

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

@@ -1,7 +1,9 @@
 /// <reference types="react" />
 declare const Menubar: {
     Root: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarRoot").MenubarProps & import("react").RefAttributes<HTMLDivElement>>;
-    Menu: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<never>>;
+    Menu: import("react").ForwardRefExoticComponent<import("@radix-ui/react-menubar").MenubarMenuProps & {
+        __scopeMenubar?: import("@radix-ui/react-context").Scope;
+    } & import("react").RefAttributes<never>>;
     Trigger: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./MenubarTrigger").MenubarTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
     Content: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarContent").MenubarContentProps & import("react").RefAttributes<HTMLDivElement>>;
     Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-menubar").MenubarItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./MenubarItem").MenubarItemProps & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -27,7 +27,7 @@ import { cn } from '../../../lib/utils/utils';
 import { cva } from 'class-variance-authority';
 import { radiusVariants } from '../../../lib/constants';
 import { useNavigationMenuContext } from './NavigationMenuRoot';
-export var navigationMenuContentVariants = cva("text-slate-12 dark:text-slateDark-12 bg-white dark:bg-slateDark-1 p-2", {
+export var navigationMenuContentVariants = cva("text-slate-12 dark:text-slateDark-12 bg-white dark:bg-slateDark-1 p-2 cursor-pointer", {
     variants: {
         radius: __assign({}, radiusVariants['extra-large']),
         size: {
@@ -43,6 +43,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("absolute top-0 left-0 w-full sm:w-auto\n          data-[motion=from-start]:animate-enterFromLeft \n          data-[motion=from-end]:animate-enterFromRight \n          data-[motion=to-start]:animate-exitToLeft \n          data-[motion=to-end]:animate-exitToRight", 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 w-full 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: "flex z-[1] top-full h-[10px] items-end justify-center overflow-hidden\n        data-[state=visible]:animate-fadeIn data-[state=hidden]:animate-fadeOut \n        transition-[width,transform_250ms_ease]" }, props, { children: [_jsx("div", { className: cn("relative top-[70%] h-[10px] w-[10px] rotate-[45deg] rounded-tl-[2px] \n          bg-white dark:bg-slateDark-2 shadow-slate-4 shadow 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-[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] })));
 });
 NavigationMenuIndicator.displayName = 'NavigationMenu.Indicator';

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

@@ -28,7 +28,7 @@ import { cva } from 'class-variance-authority';
 import { appearanceStyle, radiusVariants, scalingVariants } from '../../../lib/constants';
 import { NavigationMenuIndicator } from './NavigationMenuIndicator';
 import { useNavigationMenuContext } from './NavigationMenuRoot';
-export var navigationMenuListVariants = cva('flex items-center p-1 space-x-1 shadow-slate-4 shadow dark:shadow-slateDark-4 bg-white dark:bg-slateDark-1', {
+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']),
         scaling: __assign({}, scalingVariants),

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

@@ -37,7 +37,7 @@ 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]);
-    return (_jsx(NavigationMenuContext.Provider, { value: contextValue, children: _jsx(NavigationMenuPrimitive.Root, __assign({ ref: ref, className: cn('flex relative z-[1] w-screen justify-center', className) }, props, { children: children })) }));
+    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';
 export default NavigationMenuRoot;

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

@@ -48,6 +48,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 top-full left-0 flex w-full justify-center ", children: _jsx(NavigationMenuPrimitive.Viewport, __assign({ ref: ref, className: viewportClassName }, props)) }));
+    return (_jsx("div", { className: "perspective-[2000px] absolute left-0 top-full flex w-full", children: _jsx(NavigationMenuPrimitive.Viewport, __assign({ ref: ref, className: viewportClassName }, props)) }));
 });
 NavigationMenuViewport.displayName = 'NavigationMenu.Viewport';

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

@@ -1,8 +1,6 @@
 import React from 'react';
 import { VariantProps } from 'class-variance-authority';
-import * as ProgressPrimitive from '@radix-ui/react-progress';
 export interface ProgressProps extends VariantProps<typeof progressVariants> {
-    color?: any;
     size?: any;
     appearance?: 'classic' | 'surface' | 'soft';
 }
@@ -10,7 +8,6 @@ declare const progressVariants: (props?: ({
     radius?: "small" | "none" | "medium" | "large" | "full" | null | undefined;
     size?: "small" | "medium" | "large" | null | undefined;
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
-    color?: string | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export declare const Progress: React.ForwardRefExoticComponent<Omit<ProgressPrimitive.ProgressProps & React.RefAttributes<HTMLDivElement>, "ref"> & ProgressProps & React.RefAttributes<HTMLDivElement>>;
+export declare const Progress: React.ForwardRefExoticComponent<Omit<import("@radix-ui/themes").ProgressProps & React.RefAttributes<HTMLDivElement>, "ref"> & ProgressProps & React.RefAttributes<HTMLDivElement>>;
 export default Progress;

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

@@ -23,7 +23,7 @@ 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, bgColorStyle } from '../../../lib/constants';
+import { scalingVariants } from '../../../lib/constants';
 import { Theme, Progress as ProgressTheme } from '@radix-ui/themes';
 import { cn } from '../../../lib/utils/utils';
 var progressVariants = cva('w-[300px]', {
@@ -41,7 +41,6 @@ var progressVariants = cva('w-[300px]', {
             large: 'h-2',
         },
         scaling: __assign({}, scalingVariants),
-        color: bgColorStyle(),
     },
     defaultVariants: {
         radius: 'medium',
@@ -50,7 +49,7 @@ var progressVariants = cva('w-[300px]', {
     },
 });
 export var Progress = forwardRef(function (_a, ref) {
-    var className = _a.className, children = _a.children, 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", "children", "radius", "size", "value", "appearance", "color", "scaling"]);
+    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)) }));
 });
 Progress.displayName = 'Progress';

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

@@ -1,39 +1,32 @@
 import { VariantProps } from 'class-variance-authority';
-import { PointStyle } from '../../../lib/types';
+import { IChartDataLabels, IChartDatasets, IChartLegend, IChartTitle } from '../../../lib/types';
+type IRadarChartDataset = IChartDatasets & {
+    data: number[];
+    pointBackgroundColor?: string;
+    pointBorderColor?: string;
+    pointBorderWidth?: number;
+    pointHoverBackgroundColor?: string;
+    pointHoverBorderColor?: string;
+    pointHoverBorderWidth?: number;
+    fill?: boolean;
+};
 export interface RadarChartProps extends VariantProps<typeof radarChartVariants> {
-    labels?: string[];
-    datasets: {
-        label?: string;
-        data: number[];
-        backgroundColor?: string;
-        borderColor?: string;
-        borderWidth?: number;
-        hoverBackgroundColor?: string;
-        hoverBorderColor?: string;
-        hoverBorderWidth?: number;
-        pointBackgroundColor?: string;
-        pointBorderColor?: string;
-        pointBorderWidth?: number;
-        pointHoverBackgroundColor?: string;
-        pointHoverBorderColor?: string;
-        pointHoverBorderWidth?: number;
-        pointStyle?: PointStyle;
-        pointRotation?: number;
-        fill?: boolean;
-        order?: number;
-        tension?: number;
-    }[];
-    options?: {};
+    appearance?: 'solid' | 'soft';
+    isColorMixed?: boolean;
     className?: string;
+    datasets: IRadarChartDataset[];
+    title?: IChartTitle;
+    legend?: IChartLegend;
+    labels?: string[];
+    datalabels?: IChartDataLabels;
     width?: string | number;
     height?: string | number;
-    isColorMixed?: boolean;
 }
 declare const radarChartVariants: (props?: ({
     scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export declare const RadarChart: {
-    ({ className, labels, datasets, width, height, scaling, isColorMixed, ...props }: RadarChartProps): import("react/jsx-runtime").JSX.Element;
+    ({ className, title, legend, datalabels, datasets, labels, width, height, scaling, appearance, isColorMixed, ...props }: RadarChartProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default RadarChart;