diff --git a/package.json b/package.json
index 51b0740..e69965b 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
    "name": "@hibas123/theme-preact",
-   "version": "1.0.6",
+   "version": "1.0.7",
    "description": "",
    "main": "out/index.js",
    "dependencies": {
diff --git a/src/Button.tsx b/src/Button.tsx
index 19aefa5..739bf56 100644
--- a/src/Button.tsx
+++ b/src/Button.tsx
@@ -16,11 +16,12 @@ export default function Button({
    children,
    format,
    className,
+   class: c,
    ...props
 }: IButtonProps) {
    let cl = "ht-btn";
 
-   if (className) cl += " " + (className || "") + (props.class || "");
+   if (className) cl += " " + (className || "") + (c || "");
 
    switch (format) {
       case ButtonFormats.DEFAULT:
diff --git a/src/Card.tsx b/src/Card.tsx
index 145f838..5b286c9 100644
--- a/src/Card.tsx
+++ b/src/Card.tsx
@@ -1,14 +1,12 @@
 import { h, JSX } from "preact";
 export default function Card({
    className,
+   class: c,
    children,
    ...props
 }: JSX.HTMLAttributes<HTMLDivElement>) {
    return (
-      <div
-         className={"ht-card " + (className || "") + (props.class || "")}
-         {...props}
-      >
+      <div className={"ht-card " + (className || "") + (c || "")} {...props}>
          {children}
       </div>
    );
diff --git a/src/Container.tsx b/src/Container.tsx
index 73eaaf3..774255a 100644
--- a/src/Container.tsx
+++ b/src/Container.tsx
@@ -2,11 +2,12 @@ import { h, JSX } from "preact";
 export default function Container({
    className,
    children,
+   class: c,
    ...props
 }: JSX.HTMLAttributes<HTMLDivElement>) {
    return (
       <div
-         className={"ht-container " + (className || "") + (props.class || "")}
+         className={"ht-container " + (className || "") + (c || "")}
          {...props}
       >
          {children}
diff --git a/src/Fab.tsx b/src/Fab.tsx
index f1bd30e..3a69886 100644
--- a/src/Fab.tsx
+++ b/src/Fab.tsx
@@ -4,15 +4,15 @@ export default function Fab({
    className,
    children,
    alignLeft,
+   class: c,
    ...props
-}: JSX.HTMLAttributes<HTMLButtonElement> & { alignLeft: boolean }) {
+}: JSX.HTMLAttributes<HTMLButtonElement> & {
+   alignLeft: boolean;
+}) {
    let cl = "ht-fab " + (alignLeft ? "ht-fab-left " : "");
 
    return (
-      <button
-         className={cl + (className || "") + (props.class || "")}
-         {...props}
-      >
+      <button className={cl + (className || "") + (c || "")} {...props}>
          {children}
       </button>
    );
diff --git a/src/Header.tsx b/src/Header.tsx
index 3dc4190..21f9b0d 100644
--- a/src/Header.tsx
+++ b/src/Header.tsx
@@ -5,11 +5,12 @@ import { h, JSX } from "preact";
 export default function Header({
    children,
    className,
+   class: c,
    ...props
 }: JSX.HTMLAttributes<HTMLDivElement>) {
    return (
       <header
-         className={"ht-header " + (className || "") + (props.class || "")}
+         className={"ht-header " + (className || "") + (c || "")}
          {...props}
       >
          {children}
diff --git a/src/IconButton.tsx b/src/IconButton.tsx
index f296edb..e12393a 100644
--- a/src/IconButton.tsx
+++ b/src/IconButton.tsx
@@ -2,13 +2,12 @@ import { h, JSX } from "preact";
 export default function IconButton({
    children,
    className,
+   class: c,
    ...props
 }: JSX.HTMLAttributes<HTMLButtonElement>) {
    return (
       <button
-         className={
-            "ht-btn ht-btn-icon " + (className || "") + (props.class || "")
-         }
+         className={"ht-btn ht-btn-icon " + (className || "") + (c || "")}
          {...props}
       >
          {children}
diff --git a/src/Input.tsx b/src/Input.tsx
index 02614c5..ecc1bde 100644
--- a/src/Input.tsx
+++ b/src/Input.tsx
@@ -3,10 +3,11 @@ import { h, JSX } from "preact";
 export function Input({
    className,
    children,
+   class: c,
    ...props
 }: JSX.HTMLAttributes<HTMLInputElement>) {
    return (
-      <input className={"ht-inp " + (className || "")} {...props}>
+      <input className={"ht-inp " + (className || "") + (c || "")} {...props}>
          {children}
       </input>
    );
@@ -15,10 +16,14 @@ export function Input({
 export function TextArea({
    className,
    children,
+   class: c,
    ...props
 }: JSX.HTMLAttributes<HTMLTextAreaElement>) {
    return (
-      <textarea className={"ht-inp " + (className || "")} {...props}>
+      <textarea
+         className={"ht-inp " + (className || "") + (c || "")}
+         {...props}
+      >
          {children}
       </textarea>
    );
@@ -27,10 +32,14 @@ export function TextArea({
 export function InputGroup({
    className,
    children,
+   class: c,
    ...props
 }: JSX.HTMLAttributes<HTMLDivElement>) {
    return (
-      <div className={"ht-input-group " + (className || "")} {...props}>
+      <div
+         className={"ht-input-group " + (className || "") + (c || "")}
+         {...props}
+      >
          {children}
       </div>
    );
@@ -70,11 +79,12 @@ export function InputRadio({
 
 export function InputSelect({
    className,
+   class: c,
    children,
    ...props
 }: JSX.HTMLAttributes<HTMLSelectElement>) {
    return (
-      <select className={"ht-inp " + (className || "")} {...props}>
+      <select className={"ht-inp " + (className || "") + c} {...props}>
          {children}
       </select>
    );
diff --git a/src/List.tsx b/src/List.tsx
index 77bf5bf..5590940 100644
--- a/src/List.tsx
+++ b/src/List.tsx
@@ -9,6 +9,7 @@ export default function List({
    clickable,
    divider,
    className,
+   class: c,
    children,
    ...props
 }: JSX.HTMLAttributes<HTMLUListElement> & IListProps) {
@@ -18,7 +19,7 @@ export default function List({
    if (divider) cl += "ht-list-divider ";
 
    return (
-      <ul className={cl + (className || "") + (props.class || "")} {...props}>
+      <ul className={cl + (className || "") + c} {...props}>
          {children}
       </ul>
    );
diff --git a/src/Modal.tsx b/src/Modal.tsx
index 4365e41..b627c9e 100644
--- a/src/Modal.tsx
+++ b/src/Modal.tsx
@@ -38,14 +38,13 @@ export function ModalTitle({
 
 export function ModalContent({
    className,
+   class: c,
    children,
    ...props
 }: JSX.HTMLAttributes<HTMLDivElement>) {
    return (
       <div
-         className={
-            "ht-modal-content " + (className || "") + (props.class || "")
-         }
+         className={"ht-modal-content " + (className || "") + (c || "")}
          {...props}
       >
          {children}
@@ -55,14 +54,13 @@ export function ModalContent({
 
 export function ModalActions({
    className,
+   class: c,
    children,
    ...props
 }: JSX.HTMLAttributes<HTMLDivElement>) {
    return (
       <div
-         className={
-            "ht-modal-action " + (className || "") + (props.class || "")
-         }
+         className={"ht-modal-action " + (className || "") + (c || "")}
          {...props}
       >
          {children}
diff --git a/src/Table.tsx b/src/Table.tsx
index 5490dca..3693cd8 100644
--- a/src/Table.tsx
+++ b/src/Table.tsx
@@ -2,14 +2,12 @@ import { h, JSX } from "preact";
 
 export default function Table({
    className,
+   class: c,
    children,
    ...props
 }: JSX.HTMLAttributes<HTMLDivElement>) {
    return (
-      <div
-         className={"ht-table " + (className || "") + (props.class || "")}
-         {...props}
-      >
+      <div className={"ht-table " + (className || "") + (c || "")} {...props}>
          {children}
       </div>
    );
diff --git a/src/index.ts b/src/index.ts
index 4919a68..dfbaa78 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,18 +1,19 @@
 import "@hibas123/theme/out/prefix.css";
-import Button, { ButtonFormats, IButtonProps } from "./Button";
-import Card from "./Card";
+import Theme, {
+   IThemeProps,
+   ThemeModes,
+   IThemeContext,
+   ThemeContext,
+} from "./Theme";
 import Container from "./Container";
+import Button, { ButtonFormats, IButtonProps } from "./Button";
 import Fab from "./Fab";
+import Card from "./Card";
 import Header from "./Header";
 import IconButton from "./IconButton";
 import List from "./List";
+export { Modal, ModalActions, ModalContent, ModalTitle } from "./Modal";
 import Table from "./Table";
-import Theme, {
-   IThemeContext,
-   IThemeProps,
-   ThemeContext,
-   ThemeModes,
-} from "./Theme";
 
 export {
    IInputCheckboxProps,
@@ -24,11 +25,13 @@ export {
    InputSelect,
    TextArea,
 } from "./Input";
-export { Modal, ModalActions, ModalContent, ModalTitle } from "./Modal";
+
 export {
    Theme,
    IThemeProps,
    ThemeModes,
+   IThemeContext,
+   ThemeContext,
    Container,
    Button,
    ButtonFormats,
@@ -39,6 +42,4 @@ export {
    Header,
    List,
    Table,
-   IThemeContext,
-   ThemeContext,
 };