@modul/mbui 0.0.27-beta-webpack-305b06ab → 0.0.27-beta-fix-pv-53496-7e9837e9

package/src/@/config/button.ts

@@ -1,77 +0,0 @@
-export default {
-	textColor: {
-		btn: {
-			primary: {
-				DEFAULT: 'var(--btn-primary)',
-			},
-			secondary: {
-				DEFAULT: 'var(--btn-secondary)',
-				disabled: 'var(--btn-secondary-disabled)',
-			},
-			ghost: {
-				DEFAULT: 'var(--btn-ghost)',
-				hover: 'var(--btn-ghost-hover)',
-				focus: 'var(--btn-ghost-focus)',
-				active: 'var(--btn-ghost-active)',
-				disabled: 'var(--btn-ghost-disabled)',
-			},
-			outline: {
-				DEFAULT: 'var(--btn-outline)',
-				disabled: 'var(--btn-outline-disabled)',
-			},
-		},
-	},
-	backgroundColor: {
-		btn: {
-			primary: {
-				DEFAULT: 'var(--btn-primary-bg)',
-				hover: 'var(--btn-primary-hover-bg)',
-				focus: 'var(--btn-primary-focus-bg)',
-				active: 'var(--btn-primary-active-bg)',
-				disabled: 'var(--btn-primary-disabled-bg)',
-			},
-			secondary: {
-				DEFAULT: 'var(--btn-secondary-bg)',
-				hover: 'var(--btn-secondary-hover-bg)',
-				focus: 'var(--btn-secondary-focus-bg)',
-				active: 'var(--btn-secondary-active-bg)',
-			},
-			ghost: {
-				DEFAULT: 'var(--btn-ghost-bg)',
-				hover: 'var(--btn-ghost-hover-bg)',
-				focus: 'var(--btn-ghost-focus-bg)',
-				active: 'var(--btn-ghost-active-bg)',
-			},
-		},
-	},
-	borderColor: {
-		btn: {
-			primary: {
-				DEFAULT: 'var(--btn-primary-bg)',
-				hover: 'var(--btn-primary-hover-bg)',
-				focus: 'var(--btn-primary-focus-bg)',
-				active: 'var(--btn-primary-active-bg)',
-				disabled: 'var(--btn-primary-disabled-bg)',
-			},
-			secondary: {
-				DEFAULT: 'var(--btn-secondary-bg)',
-				hover: 'var(--btn-secondary-hover-bg)',
-				focus: 'var(--btn-secondary-focus-bg)',
-				active: 'var(--btn-secondary-active-bg)',
-			},
-			ghost: {
-				DEFAULT: 'var(--btn-ghost-bg)',
-				hover: 'var(--btn-ghost-hover-bg)',
-				focus: 'var(--btn-ghost-focus-bg)',
-				active: 'var(--btn-ghost-active-bg)',
-			},
-			outline: {
-				DEFAULT: 'var(--btn-outline-border)',
-				hover: 'var(--btn-outline-hover-border)',
-				focus: 'var(--btn-outline-focus-border)',
-				active: 'var(--btn-outline-active-border)',
-				disabled: 'var(--btn-outline-disabled-border)',
-			},
-		},
-	},
-}

package/src/@/config/index.ts

@@ -1,97 +0,0 @@
-import button from './button'
-import label from './label'
-
-export default {
-	container: {
-		center: true,
-	},
-	screens: {
-		sm: '600px',
-	},
-	extend: {
-		colors: {
-			light: 'var(--light)',
-			dark: 'var(--dark)',
-			primary: {
-				DEFAULT: 'var(--primary)',
-				light: {
-					DEFAULT: 'var(--primary-light)',
-				},
-			},
-			success: {
-				DEFAULT: 'var(--success)',
-				light: 'var(--success-light)',
-			},
-			secondary: {
-				DEFAULT: 'var(--secondary)',
-			},
-			warning: {
-				DEFAULT: 'var(--warning)',
-				light: 'var(--warning-light)',
-			},
-			critical: {
-				DEFAULT: 'var(--critical)',
-				light: 'var(--critical-light)',
-			},
-			disabled: 'var(--disabled)',
-			transparent: 'transparent',
-			current: 'currentColor',
-		},
-		textColor: {
-			...button.textColor,
-			...label.textColor,
-		},
-		backgroundColor: {
-			page: 'var(--page-bg)',
-			light: 'var(--bg-light)',
-			dialog: 'var(--dialog-bg)',
-			...button.backgroundColor,
-			...label.backgroundColor,
-		},
-		dropShadow: {
-			sm: 'var(--shadow-sm)',
-			md: 'var(--shadow-md)',
-			lg: 'var(--shadow-lg)',
-		},
-		boxShadow: {
-			sm: 'var(--shadow-sm)',
-			md: 'var(--shadow-md)',
-			lg: 'var(--shadow-lg)',
-		},
-		borderColor: {
-			input: {
-				DEFAULT: 'var(--border-color)',
-			},
-			...button.borderColor,
-		},
-		borderRadius: {
-			sm: 'var(--border-radius-sm)',
-			md: 'var(--border-radius-md)',
-		},
-		keyframes: {
-			'accordion-down': {
-				from: { height: '0' },
-				to: { height: 'var(--radix-accordion-content-height)' },
-			},
-			'accordion-up': {
-				from: { height: 'var(--radix-accordion-content-height)' },
-				to: { height: '0' },
-			},
-			'caret-blink': {
-				'0%,70%,100%': { opacity: '1' },
-				'20%,50%': { opacity: '0' },
-			},
-			'pin-typing': {
-				'0%': {transform: 'scale(1)'},
-				'50%':{transform: 'scale(1.2)'},
-				'100%': {transform: 'scale(1)'},
-			},
-		},
-		animation: {
-			'accordion-down': 'accordion-down 0.2s ease-out',
-			'accordion-up': 'accordion-up 0.2s ease-out',
-			'caret-blink': 'caret-blink 1.25s ease-out infinite',
-			'pin-typing': 'pin-typing .25s ease-in-out'
-		},
-	},
-}

package/src/@/config/label.ts

@@ -1,89 +0,0 @@
-export default {
-	textColor: {
-		label: {
-			primary: {
-				DEFAULT: 'var(--btn-primary)',
-				outline: {
-					DEFAULT: 'var(--btn-primary-bg)',
-					hover: 'var(--btn-primary-hover-bg)',
-					focus: 'var(var(--btn-primary-focus-bg)',
-					active: 'var(--btn-primary-active-bg)',
-				}
-			},
-			secondary: 'var(--btn-secondary)',
-			success: 'var(--btn-success)',
-			ghost: 'var(--btn-ghost)',
-			outline: {
-				DEFAULT: 'var(--btn-ghost)',
-				hover: 'var(--btn-ghost-hover-bg)',
-				focus: 'var(var(--btn-ghost-focus-bg)',
-				active: 'var(--btn-ghost-active-bg)',
-			}
-		}
-	},
-	backgroundColor: {
-		label: {
-			primary: {
-				DEFAULT: 'var(--btn-primary-bg)',
-				hover: 'var(--btn-primary-hover-bg)',
-				focus: 'var(var(--btn-primary-focus-bg)',
-				active: 'var(--btn-primary-active-bg)',
-			},
-			secondary: {
-				DEFAULT: 'var(--btn-secondary-bg)',
-				hover: 'var(--btn-secondary-hover-bg)',
-				focus: 'var(var(--btn-secondary-focus-bg)',
-				active: 'var(--btn-secondary-active-bg)',
-			},
-			success: {
-				DEFAULT: 'var(--btn-success-bg)',
-				hover: 'var(--btn-success-hover-bg)',
-				focus: 'var(var(--btn-success-focus-bg)',
-				active: 'var(--btn-success-active-bg)',
-			},
-			ghost: {
-				DEFAULT: 'var(--btn-ghost-bg)',
-				hover: 'var(--btn-ghost-hover-bg)',
-				focus: 'var(var(--btn-ghost-focus-bg)',
-				active: 'var(--btn-ghost-active-bg)',
-			}
-		}
-	},
-	borderColor: {
-		btn: {
-			primary: {
-				DEFAULT: 'var(--btn-primary-bg)',
-				hover: 'var(--btn-primary-hover-bg)',
-				focus: 'var(var(--btn-primary-focus-bg)',
-				active: 'var(--btn-primary-active-bg)',
-				outline: {
-					DEFAULT: 'var(--btn-primary-bg)',
-					hover: 'var(--btn-primary-hover-bg)',
-					focus: 'var(var(--btn-primary-focus-bg)',
-					active: 'var(--btn-primary-active-bg)',
-				}
-			},
-			secondary: {
-				DEFAULT: 'var(--btn-secondary-bg)',
-				hover: 'var(--btn-secondary-hover-bg)',
-				focus: 'var(var(--btn-secondary-focus-bg)',
-				active: 'var(--btn-secondary-active-bg)',
-			},
-			success: {
-				DEFAULT: 'var(--btn-success-bg)',
-				hover: 'var(--btn-success-hover-bg)',
-				focus: 'var(var(--btn-success-focus-bg)',
-				active: 'var(--btn-success-active-bg)',
-			},
-			ghost: {
-				DEFAULT: 'var(--btn-ghost-bg)',
-				hover: 'var(--btn-ghost-hover-bg)',
-				focus: 'var(var(--btn-ghost-focus-bg)',
-				active: 'var(--btn-ghost-active-bg)',
-			},
-			outline: {
-				DEFAULT: 'var(--btn-ghost)',
-			}
-		}
-	}
-}

package/src/@/lib/utils.ts

@@ -1,7 +0,0 @@
-import { type ClassValue, clsx } from "clsx";
-import { twMerge } from 'tailwind-merge';
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
-}
-

package/src/Alert/Alert.tsx

@@ -1,81 +0,0 @@
-import * as React from 'react'
-import { cn } from '../@/lib/utils'
-import { CheckCircleSolid, InfoSolid, Warning } from '../../src/Icon'
-import { ReactNode } from "react";
-
-const AleltIconClasses = '[&+div]:ml-[8px] shrink-0'
-const AlertIcons = {
-	info: <InfoSolid aria-hidden={true} className={cn(AleltIconClasses, 'text-primary')} width={24} height={24} />,
-	warning: <Warning aria-hidden={true} className={cn(AleltIconClasses, 'text-warning')} width={24} height={24} />,
-	success: <CheckCircleSolid aria-hidden={true} className={cn(AleltIconClasses, 'text-success')} width={24} height={24} />,
-	critical: <InfoSolid aria-hidden={true} className={cn(AleltIconClasses, 'text-critical')} width={24} height={24} />
-}
-
-const Title = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(({ className, ...props }, ref) => (
-	<div
-		role="heading"
-		ref={ref}
-		className={cn('text-[14px] font-medium', className)}
-		{...props}
-	/>
-))
-
-const Description = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(({ className, ...props }, ref) => (
-	<p
-		ref={ref}
-		className={cn('text-[14px] [&>a]:text-primary [&>a]:underline', className)}
-		{...props}
-	/>
-))
-
-const getClass = (variant, type): string => {
-	const commonClasses = 'px-[8px] py-[16px] border rounded-md '
-	const variants = {
-		info: `${type !== 'text' ? `${commonClasses} bg-primary-light  border-primary` : 'text-primary'}`,
-		warning: `${type !== 'text' ? `${commonClasses} bg-warning-light  border-warning` : 'text-warning'}`,
-		success: `${type !== 'text' ? `${commonClasses} bg-success-light  border-success` : 'text-success'}`,
-		critical: `${type !== 'text' ? `${commonClasses} bg-critical-light  border-critical` : 'text-critical'}`,
-	}
-	return variants[variant]
-
-}
-
-interface IAlertComponents {
-	displayName: string;
-	Title: typeof Title;
-	Description: typeof Description;
-}
-
-interface IAlertProps {
-	className?: string;
-	variant?: string;
-	type?: string;
-	children: ReactNode;
-}
-
-type TAlertProps = IAlertProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>
-
-const Alert: React.FC<TAlertProps> & IAlertComponents = ({ className, variant = 'info', type, children, ...props }) => {
-	return (
-		<div
-			className={cn('flex', getClass(variant, type), className)}
-			role='alert'
-			{...props}
-		>
-			{AlertIcons[variant]}
-			<div className='pt-[2px]'>
-				{children}
-			</div>
-		</div>
-	)
-}
-
-Alert.displayName = 'Alert'
-
-Alert.Title = Title
-Alert.Title.displayName = 'Alert.Title'
-
-Alert.Description = Description
-Alert.Description.displayName = "Alert.Description"
-
-export { Alert }

package/src/Alert/index.ts

@@ -1 +0,0 @@
-export { Alert } from './Alert'

package/src/AlertDialog/AlertDialog.tsx

@@ -1,137 +0,0 @@
-import * as React from "react"
-import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog"
-import { cn } from "../@/lib/utils"
-import { buttonVariants } from "../../src/Button"
-
-const AlertDialog = AlertDialogPrimitive.Root
-
-const AlertDialogTrigger = AlertDialogPrimitive.Trigger
-
-const AlertDialogPortal = AlertDialogPrimitive.Portal
-
-const AlertDialogOverlay = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Overlay>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Overlay
-    className={cn(
-      "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
-    )}
-    {...props}
-    ref={ref}
-  />
-))
-AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName
-
-const AlertDialogContent = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content>
->(({ className, ...props }, ref) => (
-  <AlertDialogPortal>
-    <AlertDialogOverlay />
-    <AlertDialogPrimitive.Content
-      ref={ref}
-      className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-input bg-dialog p-[16px] shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] rounded-md",
-        className
-      )}
-      {...props}
-    />
-  </AlertDialogPortal>
-))
-AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName
-
-const AlertDialogHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
-      className
-    )}
-    {...props}
-  />
-)
-AlertDialogHeader.displayName = "AlertDialogHeader"
-
-const AlertDialogFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
-    )}
-    {...props}
-  />
-)
-AlertDialogFooter.displayName = "AlertDialogFooter"
-
-const AlertDialogTitle = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Title>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Title
-    ref={ref}
-    className={cn("text-lg font-semibold", className)}
-    {...props}
-  />
-))
-AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName
-
-const AlertDialogDescription = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Description>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Description
-    ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
-    {...props}
-  />
-))
-AlertDialogDescription.displayName =
-  AlertDialogPrimitive.Description.displayName
-
-const AlertDialogAction = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Action>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Action
-    ref={ref}
-    className={cn(buttonVariants({variant: 'primary'}), className)}
-    {...props}
-  />
-))
-AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName
-
-const AlertDialogCancel = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Cancel>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Cancel
-    ref={ref}
-    className={cn(
-      buttonVariants({ variant: "outline"}),
-      className
-    )}
-    {...props}
-  />
-))
-AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName
-
-export {
-  AlertDialog,
-  AlertDialogPortal,
-  AlertDialogOverlay,
-  AlertDialogTrigger,
-  AlertDialogContent,
-  AlertDialogHeader,
-  AlertDialogFooter,
-  AlertDialogTitle,
-  AlertDialogDescription,
-  AlertDialogAction,
-  AlertDialogCancel,
-}

package/src/AlertDialog/index.ts

@@ -1,13 +0,0 @@
-export {
-	AlertDialog,
-	AlertDialogPortal,
-	AlertDialogOverlay,
-	AlertDialogTrigger,
-	AlertDialogContent,
-	AlertDialogHeader,
-	AlertDialogFooter,
-	AlertDialogTitle,
-	AlertDialogDescription,
-	AlertDialogAction,
-	AlertDialogCancel,
-} from './AlertDialog'

package/src/Audio/Audio.styl

@@ -1,115 +0,0 @@
-
-.player
-    display flex
-    align-items center
-
-    &__btn
-        position relative
-        margin-right 12px
-        width 40px
-        height @width
-        font-size $fz-large
-        color $cl-white
-        background-color $cl-green-3
-        border 0
-        border-radius 50%
-        outline 0
-        transition background-color .3s ease-in-out
-
-        &:hover
-        &:focus
-            background-color $cl-green-4
-
-        &:active
-            background-color $cl-green-2
-
-        [class*=icon]
-            position absolute
-            top 50%
-            left 53%
-            transform translate(-50%, -50%)
-
-    &__progress
-        position relative
-        flex-grow 1
-
-        &-buffer
-            position absolute
-            top 0
-            left 0
-            height 2px
-            background-color $ca-graphite-5
-            border-radius 1px
-
-        .ant-slider-rail
-            cursor pointer
-            height 2px
-            background-color $ca-graphite-5
-            border-radius 1px
-
-        .ant-slider-track
-            position absolute
-            top 0
-            left 0
-            height 2px
-            background-color $cl-green-2
-            border-radius 1px
-
-        .ant-slider-handle
-            margin 0
-            cursor pointer
-            position absolute
-            top -4px
-            width 10px
-            height @width
-            border-radius 0
-            border 0
-            background-color transparent
-            transform translateX(-50%)
-            &::before
-                position absolute
-                display block
-                content ''
-                width 2px
-                height 8px
-                left 50%
-                top 50%
-                transform translate(-50%, -50%)
-                background-color $cl-green-2
-                border-radius 1px
-
-        .player__time
-            margin-top 14px
-
-        & + .player__time
-            margin-left 12px
-
-    &__range
-        position relative
-        height 2px
-        border-radius 1px
-
-    &__slider
-        position absolute
-        top 50%
-        left 0
-        margin-left -5px
-        width 10px
-        height @width
-        transform translateY(-50%)
-
-        &::after
-            content ''
-            position absolute
-            top 1px
-            left 50%
-            width 2px
-            height 8px
-            background-color $cl-green-2
-            border-radius 1px
-            transform translateX(-50%)
-
-    &__time
-        line-height 1
-        font-size 12px
-        color $cl-text-success