fix(Mockup): hardcoded classes for mockup components

daisyui · Apr 4, 2023 · 3575ed4 · 3575ed4
1 parent c91ab4c
commit 3575ed4
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 5 deletions.
diff --git a/src/CodeMockup/CodeMockupLine.tsx b/src/CodeMockup/CodeMockupLine.tsx
@@ -28,8 +28,14 @@ export const CodeMockupLine = forwardRef<HTMLPreElement, CodeMockupLineProps>(
   ): JSX.Element => {
     const classes = twMerge(
       clsx({
-        [`bg-${status}`]: status,
-        [`text-${status}-content`]: status,
+        'bg-info': status === 'info',
+        'bg-success': status === 'success',
+        'bg-warning': status === 'warning',
+        'bg-error': status === 'error',
+        'text-info-content': status === 'info',
+        'text-success-content': status === 'success',
+        'text-warning-content': status === 'warning',
+        'text-error-content': status === 'error',
       }),
       className
     )

diff --git a/src/PhoneMockup/PhoneMockup.tsx b/src/PhoneMockup/PhoneMockup.tsx
@@ -19,7 +19,12 @@ const PhoneMockup = forwardRef<HTMLDivElement, PhoneMockupProps>(
     const classes = twMerge(
       'mockup-phone',
       clsx({
-        [`border-${color}`]: color,
+        'border-primary': color === 'primary',
+        'border-secondary': color === 'secondary',
+        'border-info': color === 'info',
+        'border-success': color === 'success',
+        'border-warning': color === 'warning',
+        'border-error': color === 'error',
       }),
       className
     )

diff --git a/src/WindowMockup/WindowMockup.tsx b/src/WindowMockup/WindowMockup.tsx
@@ -44,8 +44,28 @@ const WindowMockup = forwardRef<HTMLDivElement, WindowMockupProps>(
       'mockup-window',
       border && `border border-${borderColorValue}`,
       clsx({
-        [`border-${borderColorValue}`]: borderColorValue,
-        [`bg-${frameColor}`]: frameColor,
+        'border-primary': borderColorValue === 'primary',
+        'border-secondary': borderColorValue === 'secondary',
+        'border-accent': borderColorValue === 'accent',
+        'border-info': borderColorValue === 'info',
+        'border-success': borderColorValue === 'success',
+        'border-warning': borderColorValue === 'warning',
+        'border-error': borderColorValue === 'error',
+        'border-base-100': borderColorValue === 'base-100',
+        'border-base-200': borderColorValue === 'base-200',
+        'border-base-300': borderColorValue === 'base-300',
+        'border-neutral': borderColorValue === 'neutral',
+        'bg-primary': frameColor === 'primary',
+        'bg-secondary': frameColor === 'secondary',
+        'bg-accent': frameColor === 'accent',
+        'bg-info': frameColor === 'info',
+        'bg-success': frameColor === 'success',
+        'bg-warning': frameColor === 'warning',
+        'bg-error': frameColor === 'error',
+        'bg-base-100': frameColor === 'base-100',
+        'bg-base-200': frameColor === 'base-200',
+        'bg-base-300': frameColor === 'base-300',
+        'bg-neutral': frameColor === 'neutral',
       }),
       className
     )