Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: click event props #250

Merged
merged 2 commits into from
Jan 24, 2023
Merged

fix: click event props #250

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6a05145
fix: prevent double click events in angular
annsch Jan 24, 2023
1879a4b
fix: added commit mail
annsch Jan 24, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
fix: prevent double click events in angular
  • Loading branch information
@annsch
annsch committed Jan 24, 2023
commit 6a051450c2fc0ac06eeee120e6621bc687cbea2e
3 changes: 0 additions & 3 deletions packages/components/src/components/button/button.lite.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,6 @@ export default function DBButton(props: DBButtonProps) {
if (props.onClick) {
props.onClick(event);
}
if (props.click) {
props.click(event);
}
}
});

Expand Down
3 changes: 0 additions & 3 deletions packages/components/src/components/card/card.lite.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,9 +32,6 @@ export default function DBCard(props: DBCardProps) {
if (props.onClick) {
props.onClick(event);
}
if (props.click) {
props.click(event);
}
}
});

Expand Down
1 change: 0 additions & 1 deletion packages/components/src/shared/model.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ export type GlobalTextProps = {
};

export type ClickEventProps = {
click?: (event: any) => void;
onClick?: (event: any) => void;
};

Expand Down
2 changes: 1 addition & 1 deletion showcases/angular-current-showcase/src/app/app.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ <h1>Angular</h1>
<DBCard>
<div style="display: flex; gap: 4px; align-items: center">
<DBButton variant="secondary">Test</DBButton>
<DBButton text="Test" icon="account"></DBButton>
<DBButton text="Test" icon="account" (click)="onClick()"></DBButton>
<DBIcon icon="account"></DBIcon>

<section class="db-ui-expressive">
Expand Down
4 changes: 4 additions & 0 deletions showcases/angular-current-showcase/src/app/app.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,4 +16,8 @@ export class AppComponent {
},
{ name: 'tab-bar-2', label: '2-Tab2', content: 'Content 2-2' }
];

onClick() {
console.log("click button");
}
}
176 changes: 91 additions & 85 deletions showcases/react-showcase/src/app.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,98 +6,104 @@ import {
DBInput
} from '../../../output/react/src';

const App = () => (
<main>
<h1>React</h1>
<DBCard>
const App = () => {

const onClick = (event: any) => {
console.log("test");
}

return (
<main>
<h1>React</h1>
<DBCard>
<div
style={{
display: 'flex',
gap: '4px',
alignItems: 'stretch'
}}>
<DBDivider variant="vertical" />
<DBButton variant="secondary">Test</DBButton>
<DBDivider variant="vertical" />
<DBButton text="Test" icon="account" onClick={onClick} />
<DBIcon className="icon" icon="account" />
</div>
</DBCard>

<div
style={{
display: 'flex',
gap: '4px',
alignItems: 'stretch'
gap: '1rem',
margin: '1rem 0'
}}>
<DBDivider variant="vertical" />
<DBButton variant="secondary">Test</DBButton>
<DBDivider variant="vertical" />
<DBButton text="Test" icon="account" />
<DBIcon className="icon" icon="account" />
</div>
</DBCard>

<div
style={{
display: 'flex',
gap: '1rem',
margin: '1rem 0'
}}>
<section className="db-ui-expressive">
<DBInput
description="Das ist die Beschreibung"
label="Startbahnhof eingeben"
placeholder="irgendein Text"
iconBefore="edit"
variant="error"
value="hello"
/>
<section className="db-ui-expressive">
<DBInput
description="Das ist die Beschreibung"
label="Startbahnhof eingeben"
placeholder="irgendein Text"
iconBefore="edit"
variant="error"
value="hello"
/>

<DBInput
description="Valid test"
label="Mit Event"
placeholder="irgendein Text"
iconBefore="edit"
iconAfter="heart"
variant="warning"
id="input-expr-warning"
required={true}
/>
<DBInput
label="Startdatum"
placeholder="irgendein Text"
type="datetime-local"
id="input-expr-date"
/>
</section>
<DBInput
description="Valid test"
label="Mit Event"
placeholder="irgendein Text"
iconBefore="edit"
iconAfter="heart"
variant="warning"
id="input-expr-warning"
required={true}
/>
<DBInput
label="Startdatum"
placeholder="irgendein Text"
type="datetime-local"
id="input-expr-date"
/>
</section>

<section className="db-ui-regular">
<DBInput
label="Startbahnhof eingeben"
placeholder="irgendein Text"
iconAfter="heart"
id="input-reg"
required={true}
minLength={5}
/>
<DBInput
label="Startdatum"
placeholder="irgendein Text"
type="week"
id="input-reg-date"
/>
</section>
<section className="db-ui-regular">
<DBInput
label="Startbahnhof eingeben"
placeholder="irgendein Text"
iconAfter="heart"
id="input-reg"
required={true}
minLength={5}
/>
<DBInput
label="Startdatum"
placeholder="irgendein Text"
type="week"
id="input-reg-date"
/>
</section>

<section className="db-ui-functional">
<DBInput
id="db-input-functional-1"
label="Startbahnhof eingeben"
placeholder="irgendein Text"
/>
<DBInput
id="db-input-functional-2"
label="Textinput eingeben disabled"
placeholder="irgendein Text"
variant="information"
disabled={true}
/>
<section className="db-ui-functional">
<DBInput
id="db-input-functional-1"
label="Startbahnhof eingeben"
placeholder="irgendein Text"
/>
<DBInput
id="db-input-functional-2"
label="Textinput eingeben disabled"
placeholder="irgendein Text"
variant="information"
disabled={true}
/>

<DBInput
label="Startdatum"
placeholder="irgendein Text"
type="datetime-local"
id="input-func-date"
/>
</section>
</div>
</main>
);
<DBInput
label="Startdatum"
placeholder="irgendein Text"
type="datetime-local"
id="input-func-date"
/>
</section>
</div>
</main>
);};

export default App;
8 changes: 7 additions & 1 deletion showcases/vue-showcase/src/App.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,12 @@ import {
DBCard,
DBInput
} from "../../../output/vue/vue3/src";

function onClick() {
console.log("Button clicked");
}


</script>

<template>
Expand All @@ -13,7 +19,7 @@ import {
<DBCard>
<div style="display: flex; gap: 4px; align-items: center">
<DBButton variant="secondary">Test</DBButton>
<DBButton text="Test" icon="account" />
<DBButton text="Test" icon="account" @click="onClick"/>
<DBIcon icon="account" />
</div>
</DBCard>
Expand Down