Lyra Gen सँग जेनेरेटिभ UI

मोडेलका उत्तरहरू वास्तविक, प्रमाणित Lyra कन्ट्रोलका रूपमा देखिन्छन्।

Lyra Gen ले मोडेलको संरचित उत्तरलाई समीक्षा गरिएको क्याटलगमार्फत पहुँचयोग्य Lyra कम्पोनेन्टमा बदल्छ। उत्पन्न सामग्रीले क्याटलगका भूमिका मात्र नाम दिन सक्छ, मनपरी ट्याग, स्क्रिप्ट वा कार्य कहिल्यै होइन; मोडेल अनुरोध, डेटा, कार्य र भण्डारण तपाईंको एप्लिकेसनमै रहन्छ।

उदाहरण

समीक्षा गरिएको क्याटलगको उपसमूह छान्नुहोस्, अनि उत्पन्न दृश्य देखाउनुअघि यसलाई प्रमाणित गर्नुहोस्।

import '@aceshooting/lyra-ui/theme.css';
import { initialCatalog, subsetCatalog } from '@aceshooting/lyra-gen/catalog.js';
import { validateView } from '@aceshooting/lyra-gen/runtime.js';
import { LyraGenViewElement } from '@aceshooting/lyra-gen/gen-view.js';

const selected = subsetCatalog(initialCatalog, ['stack', 'heading', 'text']);
if (!selected.ok) throw new Error('The requested catalog is unavailable.');
const catalog = selected.value;
const result = validateView({
  version: '1', catalog: { id: catalog.id, version: catalog.version },
  surfaceId: 'answer-1', revision: 0,
  root: { id: 'summary', type: 'stack', children: [
    { id: 'title', type: 'heading', text: 'Quarterly summary' },
    { id: 'detail', type: 'text', text: 'Revenue increased this quarter.' },
  ] },
}, catalog);
if (!result.ok) throw new Error('The generated view was rejected.');

const view = new LyraGenViewElement();
view.catalog = catalog;
view.document = result.value;
document.body.append(view);

घटकहरू हेर्नुहोस् · मार्गदर्शिका पढ्नुहोस् (अङ्ग्रेजीमा)