42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import { html } from '@design.estate/dees-element';
|
|
|
|
export const demoFunc = () => html`
|
|
<style>
|
|
.demoContainer {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
background: #222;
|
|
}
|
|
</style>
|
|
<div class="demoContainer">
|
|
<dees-chips
|
|
selectionMode="none"
|
|
.selectableChips=${[
|
|
{ key: 'account1', value: 'Payment Account 1' },
|
|
{ key: 'account2', value: 'PaymentAccount2' },
|
|
{ key: 'account3', value: 'Payment Account 3' },
|
|
]}
|
|
></dees-chips>
|
|
<dees-chips
|
|
selectionMode="single"
|
|
chipsAreRemovable
|
|
.selectableChips=${[
|
|
{ key: 'account1', value: 'Payment Account 1' },
|
|
{ key: 'account2', value: 'PaymentAccount2' },
|
|
{ key: 'account3', value: 'Payment Account 3' },
|
|
]}
|
|
></dees-chips>
|
|
<dees-chips
|
|
selectionMode="multiple"
|
|
.selectableChips=${[
|
|
{ key: 'account1', value: 'Payment Account 1' },
|
|
{ key: 'account2', value: 'PaymentAccount2' },
|
|
{ key: 'account3', value: 'Payment Account 3' },
|
|
]}
|
|
></dees-chips>
|
|
</div>
|
|
`;
|