OpenServer
/
ThemePreact
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fix some problems with class and className

This commit is contained in:
Fabian Stamm 2020-04-21 00:47:38 +02:00
parent 3833510262
commit 81f124378f
12 changed files with 50 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "@hibas123/theme-preact",
"version": "1.0.6",
"version": "1.0.7",
"description": "",
"main": "out/index.js",
"dependencies": {

3
src/Button.tsx
View File

@ -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:

6
src/Card.tsx
View File

@ -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>
);

3
src/Container.tsx
View File

@ -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}

10
src/Fab.tsx
View File

@ -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>
);

3
src/Header.tsx
View File

@ -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}

5
src/IconButton.tsx
View File

@ -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}

18
src/Input.tsx
View File

@ -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>
);

3
src/List.tsx
View File

@ -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>
);

10
src/Modal.tsx
View File

@ -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}

6
src/Table.tsx
View File

@ -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>
);

23
src/index.ts
View File

@ -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,
};