@lotte-innovate/ui-component-test 0.2.52 → 0.2.53

package/dist/lib/components/Toast/ToastRoot.js

@@ -0,0 +1,98 @@
+'use client';
+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 { forwardRef, createContext, useContext, } from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils/utils';
+import { scalingVariants } from '../../../lib/constants';
+import * as ToastPrimitive from '@radix-ui/react-toast';
+import { useTheme } from '../../../lib/theme';
+export var toastVariants = cva('flex bg-white dark:bg-slateDark-1', {
+    variants: {
+        radius: {
+            none: 'rounded-none',
+            small: 'rounded-[3px]',
+            medium: 'rounded',
+            large: 'rounded-md',
+            full: 'rounded-md',
+        },
+        size: {
+            small: 'w-[300px] min-h-[55px] p-3',
+            medium: 'w-[400px] min-h-[63px] p-3',
+            large: 'w-[400px] min-h-[84px] p-4',
+            'x-large': 'w-[400px] min-h-[88px] p-4',
+        },
+        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',
+        },
+    },
+    defaultVariants: {
+        radius: 'medium',
+        scaling: '100%',
+        size: 'medium',
+    },
+});
+export var toastViewportVariants = cva("[--viewport-padding:_25px] fixed flex flex-col outline-none gap-[10px]\n    p-[var(--viewport-padding)] m-0 list-none z-[987654321]", {
+    variants: {
+        toastPosition: {
+            top_center: 'top-0 left-1/2 transform -translate-x-1/2',
+            top_left: 'top-0 left-0',
+            top_right: 'top-0 right-0',
+            bottom_center: 'bottom-0 left-1/2 transform -translate-x-1/2',
+            bottom_left: 'bottom-0 left-0',
+            bottom_right: 'bottom-0 right-0',
+        },
+    },
+    defaultVariants: {
+        toastPosition: 'top_right',
+    },
+});
+var ToastContext = createContext({
+    radius: 'medium',
+    scaling: '100%',
+    size: 'medium',
+    color: null,
+});
+export var useToastContext = function () {
+    return useContext(ToastContext);
+};
+export var ToastRoot = forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, openToast = _a.openToast, radius = _a.radius, scaling = _a.scaling, size = _a.size, color = _a.color, _b = _a.duration, duration = _b === void 0 ? 3000 : _b, _c = _a.toastPosition, toastPosition = _c === void 0 ? 'top_right' : _c, setOpenToast = _a.setOpenToast, props = __rest(_a, ["className", "children", "openToast", "radius", "scaling", "size", "color", "duration", "toastPosition", "setOpenToast"]);
+    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,
+        size: size,
+    };
+    var toastRootStyle = "\n      shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] \n      flex flex-col px-[15px] relative justify-center\n      data-[state=open]:animate-slideIn \n      data-[state=closed]:animate-hide \n      data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] \n      data-[swipe=cancel]:translate-x-0 \n      data-[swipe=cancel]:transition-[transform_200ms_ease-out] \n      data-[swipe=end]:animate-swipeOut\n    ";
+    var toastClassName = cn(toastVariants(contextValue), toastRootStyle, className);
+    return (_jsx(ToastContext.Provider, { value: contextValue, children: _jsxs(ToastPrimitive.Provider, { swipeDirection: "right", duration: duration, children: [_jsx(ToastPrimitive.Root, __assign({ ref: ref, className: toastClassName, open: openToast, onOpenChange: setOpenToast }, props, { children: children })), _jsx(ToastPrimitive.Viewport, { className: cn(toastViewportVariants({ toastPosition: toastPosition })) })] }) }));
+});
+ToastRoot.displayName = 'Toast.Root';
+export default ToastRoot;

package/dist/lib/components/Toast/ToastRoot.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{jsx as t,jsxs as e}from"react/jsx-runtime";import{createContext as r,forwardRef as a,useContext as o}from"react";import{cva as n}from"class-variance-authority";import{cn as i}from"../../utils/utils.mjs";import{scalingVariants as s}from"../../constants.mjs";import*as l from"@radix-ui/react-toast";import{useTheme as p}from"../../theme/ThemeProvider.mjs";var d=function(){return d=Object.assign||function(t){for(var e,r=1,a=arguments.length;r<a;r++)for(var o in e=arguments[r])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t},d.apply(this,arguments)},m=function(t,e){var r={};for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&e.indexOf(a)<0&&(r[a]=t[a]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(t);o<a.length;o++)e.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(t,a[o])&&(r[a[o]]=t[a[o]])}return r},c=n("flex bg-white dark:bg-slateDark-1",{variants:{radius:{none:"rounded-none",small:"rounded-[3px]",medium:"rounded",large:"rounded-md",full:"rounded-md"},size:{small:"w-[300px] min-h-[55px] p-3",medium:"w-[400px] min-h-[63px] p-3",large:"w-[400px] min-h-[84px] p-4","x-large":"w-[400px] min-h-[88px] p-4"},scaling:d({},s),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"}},defaultVariants:{radius:"medium",scaling:"100%",size:"medium"}}),u=n("[--viewport-padding:_25px] fixed flex flex-col outline-none gap-[10px]\n    p-[var(--viewport-padding)] m-0 list-none z-[987654321]",{variants:{toastPosition:{top_center:"top-0 left-1/2 transform -translate-x-1/2",top_left:"top-0 left-0",top_right:"top-0 right-0",bottom_center:"bottom-0 left-1/2 transform -translate-x-1/2",bottom_left:"bottom-0 left-0",bottom_right:"bottom-0 right-0"}},defaultVariants:{toastPosition:"top_right"}}),f=r({radius:"medium",scaling:"100%",size:"medium",color:null}),g=function(){return o(f)},x=a((function(r,a){var o=r.className,n=r.children,s=r.openToast,g=r.radius,x=r.scaling,h=r.size,_=r.color,b=r.duration,v=void 0===b?3e3:b,w=r.toastPosition,y=void 0===w?"top_right":w,O=r.setOpenToast,k=m(r,["className","children","openToast","radius","scaling","size","color","duration","toastPosition","setOpenToast"]),P=p().theme,j={radius:null!=g?g:P.themeRadius,scaling:null!=x?x:P.themeScaling,color:_,size:h},z=i(c(j),"\n      shadow-[hsl(206_22%_7%_/_35%)_0px_10px_38px_-10px,_hsl(206_22%_7%_/_20%)_0px_10px_20px_-15px] \n      flex flex-col px-[15px] relative justify-center\n      data-[state=open]:animate-slideIn \n      data-[state=closed]:animate-hide \n      data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] \n      data-[swipe=cancel]:translate-x-0 \n      data-[swipe=cancel]:transition-[transform_200ms_ease-out] \n      data-[swipe=end]:animate-swipeOut\n    ",o);return t(f.Provider,{value:j,children:e(l.Provider,{swipeDirection:"right",duration:v,children:[t(l.Root,d({ref:a,className:z,open:s,onOpenChange:O},k,{children:n})),t(l.Viewport,{className:i(u({toastPosition:y}))})]})})}));x.displayName="Toast.Root";export{x as ToastRoot,x as default,c as toastVariants,u as toastViewportVariants,g as useToastContext};
+//# sourceMappingURL=ToastRoot.mjs.map

package/dist/lib/components/Toast/ToastRoot.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastRoot.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/lib/components/Toast/ToastTitle.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import * as ToastPrimitive from '@radix-ui/react-toast';
+import { VariantProps } from 'class-variance-authority';
+import { IAppearance } from '../../../lib/types';
+export interface ToastTitleProps extends VariantProps<typeof toastTitleVariants> {
+    titleText?: string;
+    appearance?: IAppearance;
+}
+export declare const toastTitleVariants: (props?: ({
+    size?: "small" | "medium" | "large" | "x-large" | null | undefined;
+    color?: "danger" | "warning" | "success" | "information" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const ToastTitle: React.ForwardRefExoticComponent<Omit<ToastPrimitive.ToastTitleProps & React.RefAttributes<HTMLDivElement>, "ref"> & ToastTitleProps & React.RefAttributes<HTMLDivElement>>;

package/dist/lib/components/Toast/ToastTitle.js

@@ -0,0 +1,54 @@
+'use client';
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import * as ToastPrimitive from '@radix-ui/react-toast';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../../lib/utils/utils';
+import { useToastContext } from './ToastRoot';
+export var toastTitleVariants = cva('flex mb-[5px] text-slate-12 dark:text-slateDark-12 text-wrap break-words font-medium', {
+    variants: {
+        size: {
+            small: 'text-sm w-[220px]',
+            medium: 'text-sm w-[312px]',
+            large: 'text-xl w-[284px]',
+            'x-large': 'text-2xl w-[284px]',
+        },
+        color: {
+            danger: 'text-red-11',
+            warning: 'text-amber-11',
+            success: 'text-green-11',
+            information: 'text-sky-11',
+        },
+    },
+    defaultVariants: {
+        size: 'medium',
+    },
+});
+export var ToastTitle = forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, titleText = _a.titleText, props = __rest(_a, ["className", "children", "titleText"]);
+    var _b = useToastContext(), size = _b.size, color = _b.color;
+    return (_jsx(ToastPrimitive.Title, __assign({ ref: ref }, props, { children: _jsx("p", { className: cn(toastTitleVariants({ size: size, color: color }), className), children: titleText !== null && titleText !== void 0 ? titleText : children }) })));
+});
+ToastTitle.displayName = 'Toast.Title';

package/dist/lib/components/Toast/ToastTitle.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{jsx as t}from"react/jsx-runtime";import{forwardRef as e}from"react";import*as r from"@radix-ui/react-toast";import{cva as a}from"class-variance-authority";import{cn as o}from"../../utils/utils.mjs";import{useToastContext as i}from"./ToastRoot.mjs";var l=function(){return l=Object.assign||function(t){for(var e,r=1,a=arguments.length;r<a;r++)for(var o in e=arguments[r])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t},l.apply(this,arguments)},n=function(t,e){var r={};for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&e.indexOf(a)<0&&(r[a]=t[a]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(t);o<a.length;o++)e.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(t,a[o])&&(r[a[o]]=t[a[o]])}return r},s=a("flex mb-[5px] text-slate-12 dark:text-slateDark-12 text-wrap break-words font-medium",{variants:{size:{small:"text-sm w-[220px]",medium:"text-sm w-[312px]",large:"text-xl w-[284px]","x-large":"text-2xl w-[284px]"},color:{danger:"text-red-11",warning:"text-amber-11",success:"text-green-11",information:"text-sky-11"}},defaultVariants:{size:"medium"}}),m=e((function(e,a){var m=e.className,c=e.children,p=e.titleText,x=n(e,["className","children","titleText"]),f=i(),u=f.size,d=f.color;return t(r.Title,l({ref:a},x,{children:t("p",{className:o(s({size:u,color:d}),m),children:null!=p?p:c})}))}));m.displayName="Toast.Title";export{m as ToastTitle,s as toastTitleVariants};
+//# sourceMappingURL=ToastTitle.mjs.map

package/dist/lib/components/Toast/ToastTitle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastTitle.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare const Toast: {
+    Root: import("react").ForwardRefExoticComponent<import("@radix-ui/react-toast").ToastProviderProps & import("./ToastRoot").ToastProps & import("react").RefAttributes<never>>;
+    Title: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-toast").ToastTitleProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./ToastTitle").ToastTitleProps & import("react").RefAttributes<HTMLDivElement>>;
+    Description: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-toast").ToastDescriptionProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("./ToastDescription").ToastDescriptionProps & import("react").RefAttributes<HTMLDivElement>>;
+    ActionButton: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-toast").ToastActionProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./ToastActionButton").ToastActionButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export default Toast;

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

@@ -0,0 +1,11 @@
+import { ToastRoot as Root } from './ToastRoot';
+import { ToastTitle as Title } from './ToastTitle';
+import { ToastDescription as Description } from './ToastDescription';
+import { ToastActionButton as ActionButton } from './ToastActionButton';
+var Toast = {
+    Root: Root,
+    Title: Title,
+    Description: Description,
+    ActionButton: ActionButton,
+};
+export default Toast;

package/dist/lib/components/Toast/index.mjs

@@ -0,0 +1,2 @@
+import{ToastRoot as o}from"./ToastRoot.mjs";import{ToastTitle as t}from"./ToastTitle.mjs";import{ToastDescription as i}from"./ToastDescription.mjs";import{ToastActionButton as m}from"./ToastActionButton.mjs";var r={Root:o,Title:t,Description:i,ActionButton:m};export{r as default};
+//# sourceMappingURL=index.mjs.map

package/dist/lib/components/Toast/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../lib/components/Toast/index.js"],"sourcesContent":["import { ToastRoot as Root } from './ToastRoot';\nimport { ToastTitle as Title } from './ToastTitle';\nimport { ToastDescription as Description } from './ToastDescription';\nimport { ToastActionButton as ActionButton } from './ToastActionButton';\nvar Toast = {\n    Root: Root,\n    Title: Title,\n    Description: Description,\n    ActionButton: ActionButton,\n};\nexport default Toast;\n"],"names":["Toast","Root","Title","Description","ActionButton"],"mappings":"gNAIG,IAACA,EAAQ,CACRC,KAAMA,EACNC,MAAOA,EACPC,YAAaA,EACbC,aAAcA"}

package/dist/lib/components/Toggle/ToggleWithText.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import { VariantProps } from 'class-variance-authority';
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import { IAppearance } from '../../../lib/types';
+export interface ToggleWithTextProps extends VariantProps<typeof toggleWithTextVariants> {
+    text?: string;
+    appearance?: IAppearance;
+    size?: 'small' | 'medium' | 'large';
+}
+declare const toggleWithTextVariants: (props?: ({
+    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;
+export declare const IconScaling: {
+    small: string;
+    medium: string;
+    large: string;
+};
+export declare const ToggleWithText: React.ForwardRefExoticComponent<Omit<TogglePrimitive.ToggleProps & React.RefAttributes<HTMLButtonElement>, "ref"> & ToggleWithTextProps & React.RefAttributes<HTMLButtonElement>>;
+export default ToggleWithText;

package/dist/lib/components/Toggle/ToggleWithText.js

@@ -0,0 +1,69 @@
+'use client';
+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 { jsxs as _jsxs } from "react/jsx-runtime";
+import React, { Children, forwardRef } from 'react';
+import { cva } from 'class-variance-authority';
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import { radiusVariants, toggleAppearanceStyle } from '../../../lib/constants';
+import { scalingVariants } from '../../../lib/constants';
+import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
+var toggleWithTextVariants = cva('flex items-center justify-center box-border font-medium w-fit', {
+    variants: {
+        radius: __assign({}, radiusVariants['base']),
+        size: {
+            small: 'h-6 px-2 text-xs gap-1',
+            medium: 'h-8 px-3 text-sm gap-2',
+            large: 'h-10 px-4 text-base gap-3',
+        },
+        scaling: __assign({}, scalingVariants),
+    },
+    defaultVariants: {
+        radius: 'medium',
+        size: 'medium',
+        scaling: '100%',
+    },
+});
+export var IconScaling = {
+    small: 'w-[14px]',
+    medium: 'w-4',
+    large: 'w-[18px]',
+};
+export var ToggleWithText = forwardRef(function (_a, ref) {
+    var _b;
+    var className = _a.className, children = _a.children, radius = _a.radius, _c = _a.size, size = _c === void 0 ? 'medium' : _c, scaling = _a.scaling, color = _a.color, _d = _a.appearance, appearance = _d === void 0 ? 'surface' : _d, text = _a.text, props = __rest(_a, ["className", "children", "radius", "size", "scaling", "color", "appearance", "text"]);
+    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: (_b = color !== null && color !== void 0 ? color : theme.themeColor) !== null && _b !== void 0 ? _b : MAIN_COLOR,
+        size: size,
+    };
+    return (_jsxs(TogglePrimitive.Root, __assign({ ref: ref, className: cn(toggleWithTextVariants(contextValue), toggleAppearanceStyle(appearance, contextValue.color, true, 'data-[state=on]:'), className) }, props, { children: [Children.map(children, function (child) {
+                return React.cloneElement(child, { className: IconScaling[size] });
+            }), text] })));
+});
+ToggleWithText.displayName = 'ToggleWithText';
+export default ToggleWithText;

package/dist/lib/components/Toggle/ToggleWithText.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{jsxs as e}from"react/jsx-runtime";import t,{forwardRef as r,Children as a}from"react";import{cva as o}from"class-variance-authority";import*as i from"@radix-ui/react-toggle";import{radiusVariants as s,scalingVariants as n,toggleAppearanceStyle as l}from"../../constants.mjs";import{cn as m}from"../../utils/utils.mjs";import{useTheme as c}from"../../theme/ThemeProvider.mjs";import{MAIN_COLOR as p}from"../../color/constants.mjs";var u=function(){return u=Object.assign||function(e){for(var t,r=1,a=arguments.length;r<a;r++)for(var o in t=arguments[r])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},u.apply(this,arguments)},f=function(e,t){var r={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(r[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(e);o<a.length;o++)t.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(e,a[o])&&(r[a[o]]=e[a[o]])}return r},d=o("flex items-center justify-center box-border font-medium w-fit",{variants:{radius:u({},s.base),size:{small:"h-6 px-2 text-xs gap-1",medium:"h-8 px-3 text-sm gap-2",large:"h-10 px-4 text-base gap-3"},scaling:u({},n)},defaultVariants:{radius:"medium",size:"medium",scaling:"100%"}}),g={small:"w-[14px]",medium:"w-4",large:"w-[18px]"},h=r((function(r,o){var s,n=r.className,h=r.children,x=r.radius,y=r.size,b=void 0===y?"medium":y,v=r.scaling,j=r.color,O=r.appearance,w=void 0===O?"surface":O,z=r.text,N=f(r,["className","children","radius","size","scaling","color","appearance","text"]),P=c().theme,S={radius:null!=x?x:P.themeRadius,scaling:null!=v?v:P.themeScaling,color:null!==(s=null!=j?j:P.themeColor)&&void 0!==s?s:p,size:b};return e(i.Root,u({ref:o,className:m(d(S),l(w,S.color,!0,"data-[state=on]:"),n)},N,{children:[a.map(h,(function(e){return t.cloneElement(e,{className:g[b]})})),z]}))}));h.displayName="ToggleWithText";export{g as IconScaling,h as ToggleWithText,h as default};
+//# sourceMappingURL=ToggleWithText.mjs.map

package/dist/lib/components/Toggle/ToggleWithText.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleWithText.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -0,0 +1,21 @@
+import React from 'react';
+import { VariantProps } from 'class-variance-authority';
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import { IAppearance } from '../../../lib/types';
+export { ToggleWithText } from './ToggleWithText';
+export interface ToggleProps extends VariantProps<typeof toggleVariants> {
+    size?: 'small' | 'medium' | 'large';
+    appearance?: IAppearance;
+}
+declare const toggleVariants: (props?: ({
+    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;
+export declare const IconScaling: {
+    small: string;
+    medium: string;
+    large: string;
+};
+export declare const Toggle: React.ForwardRefExoticComponent<Omit<TogglePrimitive.ToggleProps & React.RefAttributes<HTMLButtonElement>, "ref"> & ToggleProps & React.RefAttributes<HTMLButtonElement>>;
+export default Toggle;

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

@@ -0,0 +1,69 @@
+'use client';
+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 React, { Children, forwardRef } from 'react';
+import { cva } from 'class-variance-authority';
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import { radiusVariants, scalingVariants, toggleAppearanceStyle } from '../../../lib/constants';
+import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
+export { ToggleWithText } from './ToggleWithText';
+var toggleVariants = cva('grid place-content-center items-center justify-center box-border"', {
+    variants: {
+        radius: __assign({}, radiusVariants['base']),
+        size: {
+            small: 'w-6 h-6 p-[6px]',
+            medium: 'w-8 h-8 p-2',
+            large: 'w-10 h-10 p-[11px]',
+        },
+        scaling: __assign({}, scalingVariants),
+    },
+    defaultVariants: {
+        radius: 'medium',
+        size: 'medium',
+        scaling: '100%',
+    },
+});
+export var IconScaling = {
+    small: 'w-[14px]',
+    medium: 'w-4',
+    large: 'w-[18px]',
+};
+export var Toggle = forwardRef(function (_a, ref) {
+    var _b;
+    var className = _a.className, children = _a.children, radius = _a.radius, _c = _a.size, size = _c === void 0 ? 'medium' : _c, scaling = _a.scaling, color = _a.color, _d = _a.appearance, appearance = _d === void 0 ? 'surface' : _d, props = __rest(_a, ["className", "children", "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: (_b = color !== null && color !== void 0 ? color : theme.themeColor) !== null && _b !== void 0 ? _b : MAIN_COLOR,
+        size: size,
+    };
+    return (_jsx(TogglePrimitive.Root, __assign({ ref: ref, className: cn(toggleVariants(contextValue), toggleAppearanceStyle(appearance, contextValue.color, true, 'data-[state=on]:'), className) }, props, { children: Children.map(children, function (child) {
+            return React.cloneElement(child, { className: IconScaling[size] });
+        }) })));
+});
+Toggle.displayName = 'Toggle';
+export default Toggle;

package/dist/lib/components/Toggle/index.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{jsx as e}from"react/jsx-runtime";import r,{forwardRef as t,Children as o}from"react";import{cva as a}from"class-variance-authority";import*as i from"@radix-ui/react-toggle";import{radiusVariants as n,scalingVariants as l,toggleAppearanceStyle as s}from"../../constants.mjs";import{cn as m}from"../../utils/utils.mjs";import{useTheme as c}from"../../theme/ThemeProvider.mjs";import{MAIN_COLOR as p}from"../../color/constants.mjs";export{ToggleWithText}from"./ToggleWithText.mjs";var u=function(){return u=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var a in r=arguments[t])Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a]);return e},u.apply(this,arguments)},f=function(e,r){var t={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(e);a<o.length;a++)r.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(e,o[a])&&(t[o[a]]=e[o[a]])}return t},d=a('grid place-content-center items-center justify-center box-border"',{variants:{radius:u({},n.base),size:{small:"w-6 h-6 p-[6px]",medium:"w-8 h-8 p-2",large:"w-10 h-10 p-[11px]"},scaling:u({},l)},defaultVariants:{radius:"medium",size:"medium",scaling:"100%"}}),g={small:"w-[14px]",medium:"w-4",large:"w-[18px]"},h=t((function(t,a){var n,l=t.className,h=t.children,y=t.radius,j=t.size,v=void 0===j?"medium":j,x=t.scaling,b=t.color,O=t.appearance,w=void 0===O?"surface":O,T=f(t,["className","children","radius","size","scaling","color","appearance"]),z=c().theme,N={radius:null!=y?y:z.themeRadius,scaling:null!=x?x:z.themeScaling,color:null!==(n=null!=b?b:z.themeColor)&&void 0!==n?n:p,size:v};return e(i.Root,u({ref:a,className:m(d(N),s(w,N.color,!0,"data-[state=on]:"),l)},T,{children:o.map(h,(function(e){return r.cloneElement(e,{className:g[v]})}))}))}));h.displayName="Toggle";export{g as IconScaling,h as Toggle,h as default};
+//# sourceMappingURL=index.mjs.map

package/dist/lib/components/Toggle/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/lib/components/ToggleGroup/ToggleGroupItem.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import { VariantProps } from 'class-variance-authority';
+import { IAppearance } from '../../../lib/types';
+export interface ToggleGroupItemProps extends VariantProps<typeof toggleGroupItemVariants> {
+    appearance?: IAppearance;
+    size?: 'small' | 'medium' | 'large';
+}
+export declare const toggleGroupItemVariants: (props?: ({
+    size?: "small" | "medium" | "large" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const IconScaling: {
+    small: string;
+    medium: string;
+    large: string;
+};
+export declare const ToggleGroupItem: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/lib/components/ToggleGroup/ToggleGroupItem.js

@@ -0,0 +1,55 @@
+'use client';
+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 React, { Children, forwardRef, useContext, } from 'react';
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import { cva } from 'class-variance-authority';
+import { toggleAppearanceStyle } from '../../../lib/constants';
+import { ToggleGroupContext } from './ToggleGroupRoot';
+import { cn } from '../../../lib/utils/utils';
+export var toggleGroupItemVariants = cva('grid place-content-center mr-[-1px] first:rounded-l last:rounded-r', {
+    variants: {
+        size: {
+            small: 'w-6 h-6 p-[6px]',
+            medium: 'w-8 h-8 p-2',
+            large: 'w-10 h-10 p-[11px]',
+        },
+    },
+    defaultVariants: {
+        size: 'medium',
+    },
+});
+export var IconScaling = {
+    small: 'w-[14px]',
+    medium: 'w-4',
+    large: 'w-[18px]',
+};
+export var ToggleGroupItem = forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, value = _a.value, props = __rest(_a, ["className", "children", "value"]);
+    var _b = useContext(ToggleGroupContext), size = _b.size, color = _b.color, _c = _b.appearance, appearance = _c === void 0 ? 'surface' : _c;
+    return (_jsx(ToggleGroupPrimitive.Item, __assign({ ref: ref, value: value, className: cn(toggleGroupItemVariants({ size: size }), toggleAppearanceStyle(appearance, color, true, 'data-[state=on]:'), className) }, props, { children: Children.map(children, function (child) {
+            return React.cloneElement(child, { className: IconScaling[size !== null && size !== void 0 ? size : 'medium'] });
+        }) })));
+});
+ToggleGroupItem.displayName = 'ToggleGroup.Item';

package/dist/lib/components/ToggleGroup/ToggleGroupItem.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{jsx as r}from"react/jsx-runtime";import e,{forwardRef as t,useContext as a,Children as o}from"react";import*as n from"@radix-ui/react-toggle-group";import{cva as l}from"class-variance-authority";import{toggleAppearanceStyle as i}from"../../constants.mjs";import{ToggleGroupContext as m}from"./ToggleGroupRoot.mjs";import{cn as s}from"../../utils/utils.mjs";var p=function(){return p=Object.assign||function(r){for(var e,t=1,a=arguments.length;t<a;t++)for(var o in e=arguments[t])Object.prototype.hasOwnProperty.call(e,o)&&(r[o]=e[o]);return r},p.apply(this,arguments)},c=function(r,e){var t={};for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&e.indexOf(a)<0&&(t[a]=r[a]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(a=Object.getOwnPropertySymbols(r);o<a.length;o++)e.indexOf(a[o])<0&&Object.prototype.propertyIsEnumerable.call(r,a[o])&&(t[a[o]]=r[a[o]])}return t},u=l("grid place-content-center mr-[-1px] first:rounded-l last:rounded-r",{variants:{size:{small:"w-6 h-6 p-[6px]",medium:"w-8 h-8 p-2",large:"w-10 h-10 p-[11px]"}},defaultVariants:{size:"medium"}}),f={small:"w-[14px]",medium:"w-4",large:"w-[18px]"},d=t((function(t,l){var d=t.className,g=t.children,y=t.value,v=c(t,["className","children","value"]),h=a(m),O=h.size,j=h.color,w=h.appearance,x=void 0===w?"surface":w;return r(n.Item,p({ref:l,value:y,className:s(u({size:O}),i(x,j,!0,"data-[state=on]:"),d)},v,{children:o.map(g,(function(r){return e.cloneElement(r,{className:f[null!=O?O:"medium"]})}))}))}));d.displayName="ToggleGroup.Item";export{f as IconScaling,d as ToggleGroupItem,u as toggleGroupItemVariants};
+//# sourceMappingURL=ToggleGroupItem.mjs.map

package/dist/lib/components/ToggleGroup/ToggleGroupItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleGroupItem.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/lib/components/ToggleGroup/ToggleGroupRoot.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import { VariantProps } from 'class-variance-authority';
+import { toggleGroupItemVariants } from './ToggleGroupItem';
+import { IAppearance, IColor } from '../../../lib/types';
+export interface ToggleGroupProps extends VariantProps<typeof toggleVariants>, VariantProps<typeof toggleGroupItemVariants> {
+    appearance?: IAppearance;
+    color?: IColor;
+}
+declare const toggleVariants: (props?: ({
+    scaling?: "90%" | "95%" | "100%" | "105%" | "110%" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+export declare const ToggleGroupContext: React.Context<ToggleGroupProps>;
+export declare const ToggleGroupRoot: React.ForwardRefExoticComponent<(React.ComponentPropsWithoutRef<React.ForwardRefExoticComponent<(ToggleGroupPrimitive.ToggleGroupSingleProps | ToggleGroupPrimitive.ToggleGroupMultipleProps) & React.RefAttributes<HTMLDivElement>>> & ToggleGroupProps) & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/lib/components/ToggleGroup/ToggleGroupRoot.js

@@ -0,0 +1,58 @@
+'use client';
+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 { createContext, forwardRef } from 'react';
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import { cva } from 'class-variance-authority';
+import { scalingVariants } from '../../../lib/constants';
+import { cn } from '../../../lib/utils/utils';
+import { useTheme } from '../../../lib/theme';
+import { MAIN_COLOR } from '../../../lib/color/constants';
+var toggleVariants = cva('inline-flex', {
+    variants: {
+        scaling: __assign({}, scalingVariants),
+    },
+    defaultVariants: {
+        scaling: '100%',
+    },
+});
+export var ToggleGroupContext = createContext({
+    size: 'medium',
+    color: MAIN_COLOR,
+    appearance: 'surface',
+});
+export var ToggleGroupRoot = forwardRef(function (_a, ref) {
+    var _b;
+    var className = _a.className, children = _a.children, scaling = _a.scaling, size = _a.size, color = _a.color, appearance = _a.appearance, props = __rest(_a, ["className", "children", "scaling", "size", "color", "appearance"]);
+    var theme = useTheme().theme;
+    var type = __assign({}, props).type;
+    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,
+        appearance: appearance,
+    };
+    return (_jsx(ToggleGroupContext.Provider, { value: contextValue, children: type === 'single' ? (_jsx(ToggleGroupPrimitive.Root, __assign({ className: cn(toggleVariants(contextValue), className) }, props, { ref: ref, children: children }))) : (_jsx(ToggleGroupPrimitive.Root, __assign({ className: cn(toggleVariants(contextValue), className) }, props, { ref: ref, children: children }))) }));
+});
+ToggleGroupRoot.displayName = 'ToggleGroup.Root';

package/dist/lib/components/ToggleGroup/ToggleGroupRoot.mjs

@@ -0,0 +1,3 @@
+"use client";
+import{jsx as r}from"react/jsx-runtime";import{createContext as e,forwardRef as o}from"react";import*as t from"@radix-ui/react-toggle-group";import{cva as a}from"class-variance-authority";import{scalingVariants as n}from"../../constants.mjs";import{cn as i}from"../../utils/utils.mjs";import{useTheme as l}from"../../theme/ThemeProvider.mjs";import{MAIN_COLOR as c}from"../../color/constants.mjs";var s=function(){return s=Object.assign||function(r){for(var e,o=1,t=arguments.length;o<t;o++)for(var a in e=arguments[o])Object.prototype.hasOwnProperty.call(e,a)&&(r[a]=e[a]);return r},s.apply(this,arguments)},p=function(r,e){var o={};for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&e.indexOf(t)<0&&(o[t]=r[t]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(t=Object.getOwnPropertySymbols(r);a<t.length;a++)e.indexOf(t[a])<0&&Object.prototype.propertyIsEnumerable.call(r,t[a])&&(o[t[a]]=r[t[a]])}return o},m=a("inline-flex",{variants:{scaling:s({},n)},defaultVariants:{scaling:"100%"}}),f=e({size:"medium",color:c,appearance:"surface"}),u=o((function(e,o){var a,n=e.className,u=e.children,g=e.scaling,h=e.size,y=e.color,d=e.appearance,v=p(e,["className","children","scaling","size","color","appearance"]),O=l().theme,j=(s({},v).type,{scaling:null!=g?g:O.themeScaling,color:null!==(a=null!=y?y:O.themeColor)&&void 0!==a?a:c,size:h,appearance:d});return r(f.Provider,{value:j,children:r(t.Root,s({className:i(m(j),n)},v,{ref:o,children:u}))})}));u.displayName="ToggleGroup.Root";export{f as ToggleGroupContext,u as ToggleGroupRoot};
+//# sourceMappingURL=ToggleGroupRoot.mjs.map

package/dist/lib/components/ToggleGroup/ToggleGroupRoot.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleGroupRoot.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

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

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const ToggleGroup: {
+    Root: import("react").ForwardRefExoticComponent<(import("react").ComponentPropsWithoutRef<import("react").ForwardRefExoticComponent<(import("@radix-ui/react-toggle-group").ToggleGroupSingleProps | import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps) & import("react").RefAttributes<HTMLDivElement>>> & import("./ToggleGroupRoot").ToggleGroupProps) & import("react").RefAttributes<HTMLDivElement>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("./ToggleGroupItem").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export default ToggleGroup;

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

@@ -0,0 +1,7 @@
+import { ToggleGroupRoot } from './ToggleGroupRoot';
+import { ToggleGroupItem } from './ToggleGroupItem';
+var ToggleGroup = {
+    Root: ToggleGroupRoot,
+    Item: ToggleGroupItem,
+};
+export default ToggleGroup;