32 lines
915 B
TypeScript
32 lines
915 B
TypeScript
|
import { html } from '@design.estate/dees-element';
|
||
|
|
import type { IAppIcon } from './eco-view-home.js';
|
||
|
|
|
||
|
|
const mockApps: IAppIcon[] = [
|
||
|
|
{ name: 'SaaS Share', icon: 'lucide:share2' },
|
||
|
|
{ name: 'System', icon: 'lucide:activity' },
|
||
|
|
{ name: 'Peripherals', icon: 'lucide:monitor' },
|
||
|
|
{ name: 'Settings', icon: 'lucide:settings' },
|
||
|
|
{ name: 'Files', icon: 'lucide:folder' },
|
||
|
|
{ name: 'Terminal', icon: 'lucide:terminal' },
|
||
|
|
{ name: 'Browser', icon: 'lucide:globe' },
|
||
|
|
{ name: 'Camera', icon: 'lucide:camera' },
|
||
|
|
];
|
||
|
|
|
||
|
|
export const demo = () => html`
|
||
|
|
<style>
|
||
|
|
.demo-container {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background: hsl(240 10% 4%);
|
||
|
|
border-radius: 12px;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<div class="demo-container">
|
||
|
|
<eco-view-home
|
||
|
|
.apps=${mockApps}
|
||
|
|
@app-click=${(e: CustomEvent) => console.log('App clicked:', e.detail.app)}
|
||
|
|
></eco-view-home>
|
||
|
|
</div>
|
||
|
|
`;
|