@lotte-innovate/ui-component-test 0.1.67 → 0.1.69-beta.0

package/dist/lib/Typography/Header/index.d.ts

@@ -1,13 +1,15 @@
-import { VariantProps } from 'class-variance-authority';
 import React from 'react';
-import { IColor } from '../../../lib/types';
+import { VariantProps } from 'class-variance-authority';
+import { IColor, ITypoSize } from '../../../lib/types';
 export interface HeaderProps extends VariantProps<typeof headerVariants> {
     color?: IColor;
+    size?: ITypoSize;
+    align?: 'left' | 'center' | 'right';
 }
 declare let headerVariants: (props?: ({
     weight?: "medium" | "regular" | "semibold" | "bold" | null | undefined;
-    headers?: "h2" | "h3" | "h1" | "h4" | "h5" | "h6" | null | undefined;
+    headers?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | null | undefined;
     color?: string | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export declare const Header: React.ForwardRefExoticComponent<Omit<import("@radix-ui/themes").HeadingProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & HeaderProps & React.RefAttributes<HTMLHeadingElement>>;
+export declare const Header: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & HeaderProps & React.RefAttributes<HTMLHeadingElement>>;
 export default Header;

package/dist/lib/Typography/Header/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++) {
@@ -21,11 +22,12 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import { cn } from '../../../lib/utils/utils';
 import { cva } from 'class-variance-authority';
 import { textColorStyle, weightVariants } from '../../../lib/constants';
 import { Heading as HeadingTheme, Theme } from '@radix-ui/themes';
-import React from 'react';
+import { useTheme } from '../../../lib/theme';
 var weights = __assign({}, weightVariants);
 var headers = {
     h1: 'h1',
@@ -47,9 +49,10 @@ var headerVariants = cva('', {
 });
 export var Header = React.forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, size = _a.size, weight = _a.weight, color = _a.color, headers = _a.headers, align = _a.align, rootProps = __rest(_a, ["className", "children", "size", "weight", "color", "headers", "align"]);
+    var theme = useTheme().theme;
     if (!headers)
         headers = 'h1';
-    return (_jsx(Theme, { children: _jsx(HeadingTheme, __assign({ ref: ref, as: headers, size: size, align: align, className: cn('leading-normal', headerVariants({ weight: weight, color: color }), className) }, rootProps, { children: children })) }));
+    return (_jsx(Theme, { children: _jsx(HeadingTheme, __assign({ ref: ref, as: headers, size: size, align: align, className: cn('leading-normal', headerVariants({ weight: weight, color: color !== null && color !== void 0 ? color : theme.themeColor }), className) }, rootProps, { children: children })) }));
 });
 Header.displayName = 'Header';
 export default Header;

package/dist/lib/Typography/Text/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,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';
+import { useTheme } from '../../../lib/theme';
 var textVariants = cva('', {
     variants: {
         weight: __assign({ light: 'font-light' }, weightVariants),
@@ -38,7 +40,8 @@ var textVariants = cva('', {
 });
 export var Text = forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, as = _a.as, align = _a.align, weight = _a.weight, color = _a.color, size = _a.size, props = __rest(_a, ["className", "children", "as", "align", "weight", "color", "size"]);
-    return (_jsx(Theme, { children: _jsx(TextTheme, __assign({ as: as, ref: ref, size: size, align: align, className: cn(textVariants({ weight: weight, color: color }), className) }, props, { children: children })) }));
+    var theme = useTheme().theme;
+    return (_jsx(Theme, { children: _jsx(TextTheme, __assign({ as: as, ref: ref, size: size, align: align, className: cn(textVariants({ weight: weight, color: color !== null && color !== void 0 ? color : theme.themeColor }), className) }, props, { children: children })) }));
 });
 Text.displayName = 'Text';
 export default Text;

package/dist/lib/color/constants.d.ts

@@ -1,4 +1,5 @@
 import { IColor, IAlphaColor, IDarkColor } from '../types';
+export declare const MAIN_COLOR: IColor;
 export declare const colorOptions: IColor[];
 export declare const alphaColorOptions: IAlphaColor[];
 export declare const darkColorOptions: IDarkColor[];

package/dist/lib/color/constants.js

@@ -1,5 +1,6 @@
 import { blue, crimson, teal, orange, purple, amber, slate, cyan, red, grass, brown, indigo, plum, yellow, sky, lime, } from './light';
 import { blueA, crimsonA, tealA, orangeA, purpleA, amberA, slateA, cyanA, redA, grassA, brownA, indigoA, plumA, yellowA, skyA, limeA, } from './alpha';
+export var MAIN_COLOR = 'red';
 export var colorOptions = [
     // 'black',
     'slate',

package/dist/lib/components/Accordion/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++) {
@@ -28,6 +29,7 @@ import { cn } from '../../../lib/utils/utils';
 import { cva } from 'class-variance-authority';
 import { scalingVariants } from '../../../lib/constants';
 import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 var accoridanVariants = cva('', {
     variants: {
         scaling: __assign({}, scalingVariants),
@@ -38,17 +40,18 @@ var accoridanVariants = cva('', {
 });
 var AccordionContext = createContext({
     scaling: '100%',
-    color: 'red',
+    color: MAIN_COLOR,
 });
 export var useAccordionContext = function () {
     return useContext(AccordionContext);
 };
 export var Root = React.forwardRef(function (_a, forwardedRef) {
-    var className = _a.className, children = _a.children, scaling = _a.scaling, _b = _a.color, color = _b === void 0 ? 'red' : _b, rootProps = __rest(_a, ["className", "children", "scaling", "color"]);
+    var _b;
+    var className = _a.className, children = _a.children, scaling = _a.scaling, color = _a.color, rootProps = __rest(_a, ["className", "children", "scaling", "color"]);
     var theme = useTheme().theme;
     var contextValue = {
-        scaling: theme.themeScaling || scaling,
-        color: theme.themeColor || color,
+        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(AccordionContext.Provider, { value: contextValue, children: _jsx(AccordionPrimitive.Root, __assign({ className: cn('w-[280px] rounded-md border border-slateA-4 dark:border-slateDarkA-4', accoridanVariants({ scaling: contextValue.scaling }), className) }, rootProps, { ref: forwardedRef, children: children })) }));
 });

package/dist/lib/components/AlertDialog/AlertDialogAction.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 { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { appearanceStyle, primaryColorStyle, weightVariants } from '../../../lib/constants';
 import { useAlertDialogContext } from './AlertDialogRoot';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 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: {
@@ -49,12 +51,12 @@ export var alertDialogActionVariants = cva("inline-flex items-center justify-cen
         radius: 'large',
         weight: 'medium',
         size: 'medium',
-        color: 'red',
+        color: MAIN_COLOR,
     },
 });
 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 _b = useAlertDialogContext(), radius = _b.radius, size = _b.size, _c = _b.color, color = _c === void 0 ? MAIN_COLOR : _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 })));
 });

package/dist/lib/components/AlertDialog/AlertDialogCancel.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/AlertDialog/AlertDialogContent.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++) {
@@ -46,6 +47,6 @@ export var alertDialogContentVariants = cva("fixed max-h-[85vh] top-[50%] left-[
 export var AlertDialogContent = forwardRef(function (_a, ref) {
     var className = _a.className, children = _a.children, props = __rest(_a, ["className", "children"]);
     var _b = useAlertDialogContext(), radius = _b.radius, size = _b.size, scaling = _b.scaling;
-    return (_jsxs(AlertDialogPrimitive.Portal, { children: [_jsx(AlertDialogPrimitive.Overlay, { className: "fixed data-[state=open]:animate-overlayShow inset-0" }), _jsx(AlertDialogPrimitive.Content, __assign({ className: cn(alertDialogContentVariants({ radius: radius, size: size, scaling: scaling }), className), ref: ref }, props, { children: children }))] }));
+    return (_jsxs(AlertDialogPrimitive.Portal, { children: [_jsx(AlertDialogPrimitive.Overlay, { className: "fixed inset-0 data-[state=open]:animate-overlayShow" }), _jsx(AlertDialogPrimitive.Content, __assign({ className: cn(alertDialogContentVariants({ radius: radius, size: size, scaling: scaling }), className), ref: ref }, props, { children: children }))] }));
 });
 AlertDialogContent.displayName = 'AlertDialog.Content';

package/dist/lib/components/AlertDialog/AlertDialogDescription.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/AlertDialog/AlertDialogRoot.js

@@ -25,10 +25,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, createContext, useContext, } from 'react';
 import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
 import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 var AlertDialogContext = createContext({
     size: 'medium',
     scaling: '100%',
-    color: 'red',
+    color: MAIN_COLOR,
     radius: 'medium',
     appearance: 'solid',
 });
@@ -39,9 +40,9 @@ export var AlertDialogRoot = forwardRef(function (_a, ref) {
     var children = _a.children, radius = _a.radius, size = _a.size, scaling = _a.scaling, color = _a.color, props = __rest(_a, ["children", "radius", "size", "scaling", "color"]);
     var theme = useTheme().theme;
     var contextValue = {
-        radius: theme.themeRadius || radius,
-        scaling: theme.themeScaling || scaling,
-        color: theme.themeColor || color,
+        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,
     };
     return (_jsx(AlertDialogContext.Provider, { value: contextValue, children: _jsx("div", { ref: ref, children: _jsx(AlertDialogPrimitive.Root, __assign({}, props, { children: children })) }) }));

package/dist/lib/components/AlertDialog/AlertDialogTitle.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/AlertDialog/AlertDialogTrigger.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 * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
 import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { radiusVariants, scalingVariants, weightVariants, primaryColorStyle, appearanceStyle, } from '../../../lib/constants';
+import { MAIN_COLOR } from '../../../lib/color/constants';
+import { useTheme } from '../../../lib/theme';
 var buttonVariants = cva("inline-flex items-center transition-colors focus:outline-none hover:cursor-pointer\n  disabled:cursor-not-allowed disabled:bg-slate-3 disabled:text-slate-8", {
     variants: {
         radius: __assign({}, radiusVariants['base']),
@@ -43,13 +46,22 @@ var buttonVariants = cva("inline-flex items-center transition-colors focus:outli
         radius: 'large',
         scaling: '100%',
         weight: 'medium',
-        color: 'red',
+        color: MAIN_COLOR,
         size: 'medium',
     },
 });
 export var AlertDialogTrigger = forwardRef(function (_a, ref) {
-    var children = _a.children, className = _a.className, radius = _a.radius, scaling = _a.scaling, size = _a.size, weight = _a.weight, _b = _a.color, color = _b === void 0 ? 'red' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'solid' : _c, props = __rest(_a, ["children", "className", "radius", "scaling", "size", "weight", "color", "appearance"]);
-    var buttonClassName = cn(buttonVariants({ radius: radius, scaling: scaling, size: size, weight: weight, color: color }), appearanceStyle(appearance, color), className);
+    var _b;
+    var children = _a.children, className = _a.className, radius = _a.radius, scaling = _a.scaling, size = _a.size, weight = _a.weight, color = _a.color, _c = _a.appearance, appearance = _c === void 0 ? 'solid' : _c, props = __rest(_a, ["children", "className", "radius", "scaling", "size", "weight", "color", "appearance"]);
+    var theme = useTheme().theme;
+    var buttonStyle = {
+        radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius,
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        weight: weight !== null && weight !== void 0 ? weight : theme.themeWeight,
+        color: (_b = color !== null && color !== void 0 ? color : theme.themeColor) !== null && _b !== void 0 ? _b : MAIN_COLOR,
+        size: size,
+    };
+    var buttonClassName = cn(buttonVariants(buttonStyle), appearanceStyle(appearance, buttonStyle.color), className);
     return (_jsx(AlertDialogPrimitive.Trigger, __assign({ asChild: true, ref: ref, className: buttonClassName }, props, { children: children })));
 });
 AlertDialogTrigger.displayName = 'AlertDialog.Trigger';

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

@@ -12,6 +12,6 @@ var AlertDialog = {
     Title: Title,
     Description: Description,
     Cancel: Cancel,
-    Action: Action
+    Action: Action,
 };
 export default AlertDialog;

package/dist/lib/components/AspectRatio/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++) {
@@ -38,7 +39,7 @@ export var aspectRatioVariants = cva('', {
 var AspectRatio = forwardRef(function (_a, ref) {
     var children = _a.children, className = _a.className, _b = _a.ratio, ratio = _b === void 0 ? 16 / 9 : _b, scaling = _a.scaling, props = __rest(_a, ["children", "className", "ratio", "scaling"]);
     var theme = useTheme().theme;
-    return (_jsx(AspectRatioPrimitive.Root, __assign({ ratio: ratio, ref: ref }, props, { className: cn(aspectRatioVariants({ scaling: theme.themeScaling || scaling }), className), children: children })));
+    return (_jsx(AspectRatioPrimitive.Root, __assign({ ratio: ratio, ref: ref }, props, { className: cn(aspectRatioVariants({ scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling }), className), children: children })));
 });
 AspectRatio.displayName = 'AspectRatio';
 export default AspectRatio;

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

@@ -28,6 +28,7 @@ import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { appearanceStyle, primaryColorStyle, radiusVariants, scalingVariants } from '../../../lib/constants';
 import { useTheme } from '../../../lib/theme/ThemeProvider';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 var AvatarVariants = cva('font-medium', {
     variants: {
         radius: __assign({}, radiusVariants['base']),
@@ -47,17 +48,17 @@ var AvatarVariants = cva('font-medium', {
     },
     defaultVariants: {
         radius: 'full',
-        color: 'red',
+        color: MAIN_COLOR,
         size: '3',
     },
 });
 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, _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 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, color = _a.color, ariaLabel = _a.ariaLabel, ariaLabelledby = _a.ariaLabelledby, title = _a.title, _c = _a.delayMs, delayMs = _c === void 0 ? 300 : _c, props = __rest(_a, ["className", "fallbackClassName", "radius", "scaling", "size", "fallbackText", "imagePath", "alt", "appearance", "color", "ariaLabel", "ariaLabelledby", "title", "delayMs"]);
     var theme = useTheme().theme;
     var avatarStyle = {
-        radius: theme.themeRadius || radius,
-        scaling: theme.themeScaling || scaling,
-        color: theme.themeColor || color,
+        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,
     };
     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(avatarStyle), appearanceStyle(appearance, avatarStyle.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 })] })));

package/dist/lib/components/Badge/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,7 @@ import { cva } from 'class-variance-authority';
 import { cn } from '../../../lib/utils/utils';
 import { appearanceStyle, primaryColorStyle, radiusVariants, scalingVariants, weightVariants, } from '../../../lib/constants';
 import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
 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']),
@@ -43,17 +45,17 @@ var BadgeVariants = cva('inline-flex items-center transition-colors focus:outlin
         size: 'medium',
         scaling: '100%',
         weight: 'medium',
-        color: 'red',
+        color: MAIN_COLOR,
     },
 });
 var Badge = forwardRef(function (_a, ref) {
-    var className = _a.className, children = _a.children, radius = _a.radius, scaling = _a.scaling, weight = _a.weight, size = _a.size, _b = _a.color, color = _b === void 0 ? 'red' : _b, _c = _a.appearance, appearance = _c === void 0 ? 'solid' : _c, props = __rest(_a, ["className", "children", "radius", "scaling", "weight", "size", "color", "appearance"]);
+    var className = _a.className, children = _a.children, radius = _a.radius, scaling = _a.scaling, weight = _a.weight, size = _a.size, color = _a.color, _b = _a.appearance, appearance = _b === void 0 ? 'solid' : _b, props = __rest(_a, ["className", "children", "radius", "scaling", "weight", "size", "color", "appearance"]);
     var theme = useTheme().theme;
     var badgeStyle = {
-        radius: theme.themeRadius || radius,
-        scaling: theme.themeScaling || scaling,
-        weight: theme.themeWeight || weight,
-        color: theme.themeColor || color,
+        radius: radius !== null && radius !== void 0 ? radius : theme.themeRadius,
+        scaling: scaling !== null && scaling !== void 0 ? scaling : theme.themeScaling,
+        weight: weight !== null && weight !== void 0 ? weight : theme.themeWeight,
+        color: color !== null && color !== void 0 ? color : theme.themeColor,
         size: size,
     };
     var badgeClassName = cn(BadgeVariants(badgeStyle), appearanceStyle(appearance, badgeStyle.color, false), className);

package/dist/lib/components/Breadcrumb/BreadcrumbEllipsis.d.ts

@@ -0,0 +1,9 @@
+import { ComponentProps } from 'react';
+import { VariantProps } from 'class-variance-authority';
+export interface BreadcrumbEllipsisProps extends VariantProps<typeof breadcrumbEllipsisVariants> {
+}
+export declare const breadcrumbEllipsisVariants: (props?: ({} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const BreadcrumbEllipsis: {
+    ({ className, ...props }: ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};

package/dist/lib/components/Breadcrumb/BreadcrumbEllipsis.js

@@ -0,0 +1,34 @@
+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 { cva } from 'class-variance-authority';
+import { MoreHorizontal } from 'lucide-react';
+import { cn } from '../../../lib/utils/utils';
+export var breadcrumbEllipsisVariants = cva("flex h-9 w-9 items-center justify-center", {
+    variants: {},
+});
+export var BreadcrumbEllipsis = function (_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (_jsxs("span", __assign({ role: "presentation", "aria-hidden": "true", className: cn(breadcrumbEllipsisVariants({}), className) }, props, { children: [_jsx(MoreHorizontal, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "More" })] })));
+};
+BreadcrumbEllipsis.displayName = 'Breadcrumb.Elipssis';

package/dist/lib/components/Breadcrumb/BreadcrumbItem.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { VariantProps } from 'class-variance-authority';
+export interface BreadcrumbItemProps extends VariantProps<typeof breadcrumbItemVariants> {
+}
+export declare const breadcrumbItemVariants: (props?: ({} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const BreadcrumbItem: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;

package/dist/lib/components/Breadcrumb/BreadcrumbItem.js

@@ -0,0 +1,32 @@
+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 { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils/utils';
+export var breadcrumbItemVariants = cva("inline-flex items-center gap-1.5", { variants: {} });
+export var BreadcrumbItem = forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (_jsx("li", __assign({ ref: ref, className: cn(breadcrumbItemVariants({}), className) }, props)));
+});
+BreadcrumbItem.displayName = 'Breadcrumb.Item';

package/dist/lib/components/Breadcrumb/BreadcrumbLink.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { VariantProps } from 'class-variance-authority';
+export interface BreadcrumbLinkProps extends VariantProps<typeof breadcrumbLinkVariants> {
+}
+export declare const breadcrumbLinkVariants: (props?: ({
+    size?: "small" | "medium" | "large" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const BreadcrumbLink: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    asChild?: boolean | undefined;
+} & React.RefAttributes<HTMLAnchorElement>>;

package/dist/lib/components/Breadcrumb/BreadcrumbLink.js

@@ -0,0 +1,47 @@
+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, useContext } from 'react';
+import { cva } from 'class-variance-authority';
+import { BreadCrumbContext } from './BreadcrumbRoot';
+import { Slot } from '@radix-ui/themes';
+import { cn } from '../../../lib/utils/utils';
+export var breadcrumbLinkVariants = cva("hover:text-foreground transition-colors", {
+    variants: {
+        size: {
+            small: 'text-xs',
+            medium: 'text-sm',
+            large: 'text-base',
+        },
+    },
+    defaultVariants: {
+        size: 'medium',
+    },
+});
+export var BreadcrumbLink = forwardRef(function (_a, ref) {
+    var asChild = _a.asChild, className = _a.className, props = __rest(_a, ["asChild", "className"]);
+    var size = useContext(BreadCrumbContext).size;
+    var Comp = asChild ? Slot : 'a';
+    return _jsx(Comp, __assign({ ref: ref, className: cn(breadcrumbLinkVariants({ size: size }), className) }, props));
+});
+BreadcrumbLink.displayName = 'Breadcrumb.Link';

package/dist/lib/components/Breadcrumb/BreadcrumbList.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { VariantProps } from 'class-variance-authority';
+export interface BreadcrumbListProps extends VariantProps<typeof breadcrumbListVariants> {
+}
+export declare const breadcrumbListVariants: (props?: ({} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const BreadcrumbList: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;

package/dist/lib/components/Breadcrumb/BreadcrumbList.js

@@ -0,0 +1,34 @@
+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 { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils/utils';
+export var breadcrumbListVariants = cva("text-muted-foreground flex flex-wrap items-center gap-1.5 break-words text-sm sm:gap-2.5", {
+    variants: {},
+});
+export var BreadcrumbList = forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (_jsx("ol", __assign({ ref: ref, className: cn(breadcrumbListVariants({}), className) }, props)));
+});
+BreadcrumbList.displayName = 'Breadcrumb.List';

package/dist/lib/components/Breadcrumb/BreadcrumbPage.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { VariantProps } from 'class-variance-authority';
+export interface BreadcrumbPageProps extends VariantProps<typeof breadcrumbPageVariants> {
+}
+export declare const breadcrumbPageVariants: (props?: ({
+    size?: "small" | "medium" | "large" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const BreadcrumbPage: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;

package/dist/lib/components/Breadcrumb/BreadcrumbPage.js

@@ -0,0 +1,45 @@
+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, useContext } from 'react';
+import { cva } from 'class-variance-authority';
+import { BreadCrumbContext } from './BreadcrumbRoot';
+import { cn } from '../../../lib/utils/utils';
+export var breadcrumbPageVariants = cva("text-foreground font-medium", {
+    variants: {
+        size: {
+            small: 'text-xs',
+            medium: 'text-sm',
+            large: 'text-base',
+        },
+    },
+    defaultVariants: {
+        size: 'medium',
+    },
+});
+export var BreadcrumbPage = forwardRef(function (_a, ref) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    var size = useContext(BreadCrumbContext).size;
+    return (_jsx("span", __assign({ ref: ref, role: "link", "aria-disabled": "true", "aria-current": "page", className: cn(breadcrumbPageVariants({ size: size }), className) }, props)));
+});
+BreadcrumbPage.displayName = 'Breadcrumb.Page';

package/dist/lib/components/Breadcrumb/BreadcrumbRoot.d.ts

@@ -0,0 +1,14 @@
+import React, { ReactNode } from 'react';
+import { VariantProps } from 'class-variance-authority';
+export interface BreadcrumbProps extends VariantProps<typeof breadcrumbVariants> {
+}
+declare const breadcrumbVariants: (props?: ({
+    scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
+    size?: "small" | "medium" | "large" | null | undefined;
+    color?: string | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const BreadCrumbContext: React.Context<BreadcrumbProps>;
+export declare const BreadcrumbRoot: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
+    separator?: ReactNode;
+} & BreadcrumbProps & React.RefAttributes<HTMLElement>>;
+export {};