@tumaet/prompt-ui-components 1.0.11 → 1.1.0

package/dist/types/components/pages/CoursePhaseParticipationsTable/table/participationRow.d.ts

@@ -0,0 +1,35 @@
+import { ColumnDef } from '@tanstack/react-table';
+import type { AccessorFn, SortingFn, FilterFn } from '@tanstack/react-table';
+import { CoursePhaseParticipationWithStudent, PassStatus, Student } from '@tumaet/prompt-shared-state';
+export interface ParticipantRow {
+    id: string;
+    coursePhaseID: string;
+    courseParticipationID: string;
+    passStatus: PassStatus;
+    restrictedData: Record<string, any>;
+    studentReadableData?: Record<string, any>;
+    prevData?: Record<string, any>;
+    student: Student;
+    firstName: string;
+    lastName: string;
+    email?: string;
+    matriculationNumber?: string;
+    universityLogin?: string;
+    [key: string]: unknown;
+}
+export interface ExtraParticipantColumn<TValue> {
+    id: string;
+    header: string;
+    accessorFn?: AccessorFn<ParticipantRow, TValue>;
+    cell?: ColumnDef<ParticipantRow, TValue>['cell'];
+    enableSorting?: boolean;
+    sortingFn?: SortingFn<ParticipantRow>;
+    enableColumnFilter?: boolean;
+    filterFn?: FilterFn<ParticipantRow>;
+    extraData: {
+        courseParticipationID: string;
+        value: TValue;
+        stringValue?: string;
+    }[];
+}
+export declare function buildParticipantRows(participants: CoursePhaseParticipationWithStudent[], extraColumns: ExtraParticipantColumn<any>[]): ParticipantRow[];

package/dist/types/components/pages/CoursePhaseParticipationsTable/utils/downloadParticipations.d.ts

@@ -0,0 +1,3 @@
+import { CoursePhaseParticipationWithStudent } from '@tumaet/prompt-shared-state';
+import { ExtraParticipantColumn } from '../table/participationRow';
+export declare const downloadParticipations: (data: CoursePhaseParticipationWithStudent[], prevDataKeys: string[], restrictedDataKeys: string[], studentReadableDataKeys: string[], extraColumns?: ExtraParticipantColumn<any>[], filename?: string) => void;

package/dist/types/components/pages/CoursePhaseParticipationsTable/utils/updateBatch.d.ts

@@ -0,0 +1,5 @@
+import { ParticipantRow } from '../table/participationRow';
+export declare function useParticipantBatchActions(phaseId: string): {
+    setPassed: (rows: ParticipantRow[]) => void;
+    setFailed: (rows: ParticipantRow[]) => void;
+};

package/dist/types/components/pages/Mailing/CoursePhaseMailing.d.ts

@@ -0,0 +1,6 @@
+import { CoursePhaseWithMetaData } from '@tumaet/prompt-shared-state';
+interface CoursePhaseMailingProps {
+    coursePhase: CoursePhaseWithMetaData | undefined;
+}
+export declare const CoursePhaseMailing: ({ coursePhase }: CoursePhaseMailingProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/pages/Mailing/components/AvailableMailPlaceholders.d.ts

@@ -0,0 +1,12 @@
+interface AvailableMailPlaceholdersProps {
+    customAdditionalPlaceholders?: {
+        placeholder: string;
+        description: string;
+    }[];
+}
+export declare const availablePlaceholders: {
+    placeholder: string;
+    description: string;
+}[];
+export declare const AvailableMailPlaceholders: ({ customAdditionalPlaceholders, }: AvailableMailPlaceholdersProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/pages/Mailing/components/ConfirmSendEmailDialog.d.ts

@@ -0,0 +1,8 @@
+import { PassStatus } from '@tumaet/prompt-shared-state';
+interface ConfirmSendEmailDialogProps {
+    isOpen: boolean;
+    onClose: () => void;
+    emailType: PassStatus;
+}
+export declare const ConfirmSendEmailDialog: ({ isOpen, onClose, emailType, }: ConfirmSendEmailDialogProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/pages/Mailing/components/MailingEditor.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+interface EmailTemplateEditorProps {
+    subject: string;
+    content: string;
+    onInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    label: string;
+    subjectHTMLLabel: string;
+    contentHTMLLabel: string;
+    placeholders: string[];
+}
+export declare const EmailTemplateEditor: ({ subject, content, onInputChange, label, subjectHTMLLabel, contentHTMLLabel, placeholders, }: EmailTemplateEditorProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/pages/Mailing/components/ManualMailSending.d.ts

@@ -0,0 +1,7 @@
+import { CoursePhaseMailingConfigData } from '@tumaet/prompt-shared-state';
+interface ManualMailSendingProps {
+    mailingMetaData: CoursePhaseMailingConfigData | null;
+    isModified: boolean;
+}
+export declare const ManualMailSending: ({ mailingMetaData, isModified }: ManualMailSendingProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/pages/Mailing/components/SettingsCard.d.ts

@@ -0,0 +1,7 @@
+import { CoursePhaseMailingConfigData } from '@tumaet/prompt-shared-state';
+interface SettingsCardProps {
+    mailingMetaData: CoursePhaseMailingConfigData;
+    isModified: boolean;
+}
+export declare const SettingsCard: ({ mailingMetaData, isModified }: SettingsCardProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/table/GroupActionDialog.d.ts

@@ -0,0 +1,11 @@
+interface ActionDialogProps {
+    title: string;
+    description: string;
+    confirmLabel: string;
+    confirmVariant?: 'default' | 'destructive';
+    isOpen: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+}
+export declare const ActionDialog: ({ title, description, confirmLabel, confirmVariant, isOpen, onClose, onConfirm, }: ActionDialogProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/components/table/SortableHeader.d.ts

@@ -0,0 +1,4 @@
+export declare const SortableHeader: ({ column, title }: {
+    column: any;
+    title: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/ui/alert.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
 declare const Alert: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
     variant?: "default" | "destructive" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
 declare const AlertTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const AlertDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
 export { Alert, AlertTitle, AlertDescription };

package/dist/types/components/ui/badge.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
 declare const badgeVariants: (props?: ({
     variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
 }
 declare function Badge({ className, variant, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/ui/button.d.ts

@@ -3,7 +3,7 @@ import { type VariantProps } from 'class-variance-authority';
 declare const buttonVariants: (props?: ({
     variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
     size?: "default" | "sm" | "lg" | "icon" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
 }

package/dist/types/components/ui/label.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { type VariantProps } from 'class-variance-authority';
-declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: import("class-variance-authority/dist/types").ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>>;
+declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: import("class-variance-authority/types").ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>>;
 export { Label };

package/dist/types/components/ui/sheet.d.ts

@@ -8,7 +8,7 @@ declare const SheetPortal: React.FC<SheetPrimitive.DialogPortalProps>;
 declare const SheetOverlay: React.ForwardRefExoticComponent<Omit<SheetPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const sheetVariants: (props?: ({
     side?: "top" | "bottom" | "right" | "left" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface SheetContentProps extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>, VariantProps<typeof sheetVariants> {
 }
 declare const SheetContent: React.ForwardRefExoticComponent<SheetContentProps & React.RefAttributes<HTMLDivElement>>;

package/dist/types/components/ui/sidebar.d.ts

@@ -47,7 +47,7 @@ declare const SidebarMenuButton: React.ForwardRefExoticComponent<Omit<React.Clas
 } & VariantProps<(props?: ({
     variant?: "default" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 declare const SidebarMenuAction: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLButtonElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & {
     asChild?: boolean;
     showOnHover?: boolean;

package/dist/types/components/ui/toast.d.ts

@@ -5,7 +5,7 @@ declare const ToastProvider: React.FC<ToastPrimitives.ToastProviderProps>;
 declare const ToastViewport: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastViewportProps & React.RefAttributes<HTMLOListElement>, "ref"> & React.RefAttributes<HTMLOListElement>>;
 declare const Toast: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastProps & React.RefAttributes<HTMLLIElement>, "ref"> & VariantProps<(props?: ({
     variant?: "default" | "destructive" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLLIElement>>;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLLIElement>>;
 declare const ToastAction: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 declare const ToastClose: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastCloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 declare const ToastTitle: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastTitleProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/types/components/ui/toggle-group.d.ts

@@ -4,9 +4,9 @@ import { type VariantProps } from "class-variance-authority";
 declare const ToggleGroup: React.ForwardRefExoticComponent<((Omit<ToggleGroupPrimitive.ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<ToggleGroupPrimitive.ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement>, "ref">) & VariantProps<(props?: ({
     variant?: "default" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string>) & React.RefAttributes<HTMLDivElement>>;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string>) & React.RefAttributes<HTMLDivElement>>;
 declare const ToggleGroupItem: React.ForwardRefExoticComponent<Omit<ToggleGroupPrimitive.ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
     variant?: "default" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
 export { ToggleGroup, ToggleGroupItem };

package/dist/types/components/ui/toggle.d.ts

@@ -4,9 +4,9 @@ import { type VariantProps } from "class-variance-authority";
 declare const toggleVariants: (props?: ({
     variant?: "default" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const Toggle: React.ForwardRefExoticComponent<Omit<TogglePrimitive.ToggleProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
     variant?: "default" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
-} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
 export { Toggle, toggleVariants };

package/dist/types/contexts/DarkModeProvider.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+type Theme = 'light' | 'dark' | 'system';
+interface DarkModeContextProps {
+    theme: Theme;
+    setTheme: (theme: Theme) => void;
+}
+export declare const useDarkMode: () => DarkModeContextProps;
+declare const DarkModeProvider: React.FC<{
+    children: React.ReactNode;
+}>;
+export default DarkModeProvider;

package/dist/types/index.d.ts

@@ -1,3 +1,5 @@
 export * from './components';
 export * from './hooks';
 export * from './lib';
+export * from './contexts/DarkModeProvider';
+export { default as DarkModeProvider } from './contexts/DarkModeProvider';

package/dist/types/lib/formatFileSize.d.ts

@@ -0,0 +1 @@
+export declare const formatFileSize: (bytes: number) => string;

package/dist/types/lib/getCountries.d.ts

@@ -0,0 +1,5 @@
+export declare const countriesArr: {
+    label: string;
+    value: string;
+}[];
+export declare const getCountryName: (code: string) => string | undefined;

package/dist/types/lib/getGravatarUrl.d.ts

@@ -0,0 +1 @@
+export declare const getGravatarUrl: (email: string, size?: number) => string;

package/dist/types/lib/getStatusBadge.d.ts

@@ -0,0 +1,3 @@
+import { PassStatus } from '@tumaet/prompt-shared-state';
+export declare function getStatusBadge(status: PassStatus): import("react/jsx-runtime").JSX.Element;
+export declare function getStatusString(status: PassStatus): string;

package/dist/types/lib/getStatusColor.d.ts

@@ -0,0 +1,2 @@
+import { PassStatus } from '@tumaet/prompt-shared-state';
+export declare const getStatusColor: (assessmentStatus: PassStatus) => "bg-green-500 dark:bg-green-700" | "bg-red-500 dark:bg-red-700" | "bg-gray-500 dark:bg-gray-700";

package/dist/types/lib/index.d.ts

@@ -1 +1,7 @@
 export * from './utils';
+export * from './formatFileSize';
+export * from './getCountries';
+export * from './getGravatarUrl';
+export * from './getStatusBadge';
+export * from './getStatusColor';
+export * from './openFileDownload';

package/dist/types/lib/openFileDownload.d.ts

@@ -0,0 +1,6 @@
+type OpenFileDownloadParams = {
+    downloadUrl: string;
+    fileName?: string;
+};
+export declare const openFileDownload: ({ downloadUrl, fileName, }: OpenFileDownloadParams) => Promise<void>;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tumaet/prompt-ui-components",
-  "version": "1.0.11",
+  "version": "1.1.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/prompt-edu/prompt-lib.git"
@@ -12,11 +12,13 @@
   "exports": {
     ".": "./dist/index.js",
     "./index.css": "./dist/index.css",
-    "./minimal-tiptap/index.css": "./dist/components/minimal-tiptap/styles/index.css"
+    "./minimal-tiptap/index.css": "./dist/components/minimal-tiptap/styles/index.css",
+    "./tailwind-config": "./tailwind-config.js"
   },
   "files": [
     "dist",
     "tailwind",
+    "tailwind-config.js",
     "src/index.css",
     "src/components/minimal-tiptap/styles/index.css"
   ],
@@ -26,7 +28,7 @@
     "build": "yarn build:esm && yarn build:copy-css",
     "lint": "eslint \"**/*.{js,jsx,ts,tsx}\""
   },
-  "packageManager": "yarn@4.13.0",
+  "packageManager": "yarn@4.14.1",
   "dependencies": {
     "@hookform/resolvers": "^5.2.2",
     "@radix-ui/react-accordion": "^1.2.12",
@@ -51,54 +53,70 @@
     "@radix-ui/react-toggle-group": "^1.1.11",
     "@radix-ui/react-tooltip": "^1.2.8",
     "@tanstack/react-table": "^8.21.3",
-    "@tiptap/core": "^2.27.2",
-    "@tiptap/extension-code-block": "^2.27.2",
-    "@tiptap/extension-code-block-lowlight": "^2.27.2",
-    "@tiptap/extension-color": "^2.27.2",
-    "@tiptap/extension-heading": "^2.27.2",
-    "@tiptap/extension-horizontal-rule": "^2.27.2",
-    "@tiptap/extension-image": "^2.27.2",
-    "@tiptap/extension-link": "^2.27.2",
-    "@tiptap/extension-placeholder": "^2.27.2",
-    "@tiptap/extension-text-style": "^2.27.2",
-    "@tiptap/extension-typography": "^2.27.2",
-    "@tiptap/extension-underline": "^2.27.2",
-    "@tiptap/pm": "^2.27.2",
-    "@tiptap/react": "^2.27.2",
-    "@tiptap/starter-kit": "^2.27.2",
-    "@tumaet/prompt-shared-state": "^1.0.13",
+    "@tiptap/core": "3.22.4",
+    "@tiptap/extension-bubble-menu": "3.22.4",
+    "@tiptap/extension-code-block": "3.22.4",
+    "@tiptap/extension-code-block-lowlight": "3.22.4",
+    "@tiptap/extension-color": "3.22.4",
+    "@tiptap/extension-heading": "3.22.4",
+    "@tiptap/extension-horizontal-rule": "3.22.4",
+    "@tiptap/extension-image": "3.22.4",
+    "@tiptap/extension-link": "3.22.4",
+    "@tiptap/extension-placeholder": "3.22.4",
+    "@tiptap/extension-text-style": "3.22.4",
+    "@tiptap/extension-typography": "3.22.4",
+    "@tiptap/extension-underline": "3.22.4",
+    "@tiptap/extensions": "3.22.4",
+    "@tiptap/pm": "3.22.4",
+    "@tiptap/react": "3.22.4",
+    "@tiptap/starter-kit": "3.22.4",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "cmdk": "1.1.1",
     "date-fns": "^4.1.0",
+    "file-saver": "^2.0.5",
     "highlight.js": "^11.11.1",
+    "i18n-iso-countries": "^7.14.0",
+    "js-sha256": "^0.11.1",
     "lowlight": "^3.3.0",
     "lucide-react": "^1.8.0",
     "postcss": "^8.5.10",
     "postcss-preset-env": "^11.2.1",
-    "react": "^19.2.5",
     "react-day-picker": "8.10.1",
-    "react-dom": "^19.2.5",
-    "react-hook-form": "^7.72.1",
+    "react-hook-form": "^7.73.1",
     "react-medium-image-zoom": "^5.4.3",
-    "react-router-dom": "^7.14.2",
     "recharts": "^3.8.1",
     "sonner": "^2.0.7",
     "tailwind-merge": "^3.5.0",
     "tsc-alias": "^1.8.16",
     "typescript": "^5.9.3"
   },
+  "peerDependencies": {
+    "@tanstack/react-query": "^5.99.2",
+    "@tumaet/prompt-shared-state": "^1.1.1",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "react-router-dom": "^7.14.1"
+  },
   "devDependencies": {
     "@eslint/compat": "^2.0.5",
+    "@tanstack/react-query": "^5.99.2",
+    "@tumaet/prompt-shared-state": "1.1.1",
+    "@types/file-saver": "^2.0.7",
     "@types/react": "^19.2.14",
-    "@typescript-eslint/eslint-plugin": "^8.57.1",
-    "@typescript-eslint/parser": "^8.57.1",
-    "eslint": "^10.2.1",
+    "@types/react-dom": "^19.2.3",
+    "@typescript-eslint/eslint-plugin": "^8.59.0",
+    "@typescript-eslint/parser": "^8.59.0",
+    "eslint": "^9.39.2",
     "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.1.1",
+    "globals": "^16.5.0",
     "postcss-cli": "^11.0.1",
-    "prettier": "^3.8.3"
+    "prettier": "^3.8.3",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "react-router-dom": "^7.14.1"
   },
   "resolutions": {
     "tar": "^7.5.13"

package/tailwind-config.js

@@ -0,0 +1,50 @@
+/** @type {import('tailwindcss').Config} */
+const config = {
+  darkMode: ['class'],
+  theme: {
+    extend: {
+      colors: {
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+        destructive: {
+          DEFAULT: 'hsl(var(--destructive))',
+          foreground: 'hsl(var(--destructive-foreground))',
+        },
+        muted: {
+          DEFAULT: 'hsl(var(--muted))',
+          foreground: 'hsl(var(--muted-foreground))',
+        },
+        accent: {
+          DEFAULT: 'hsl(var(--accent))',
+          foreground: 'hsl(var(--accent-foreground))',
+        },
+        popover: {
+          DEFAULT: 'hsl(var(--popover))',
+          foreground: 'hsl(var(--popover-foreground))',
+        },
+        card: {
+          DEFAULT: 'hsl(var(--card))',
+          foreground: 'hsl(var(--card-foreground))',
+        },
+      },
+      borderRadius: {
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+    },
+  },
+}
+
+export default config