Skip to content

Widgets.stories.mdx

Latest commit

 

History

History
64 lines (50 loc) · 2.1 KB

Widgets.stories.mdx

File metadata and controls

64 lines (50 loc) · 2.1 KB
Raw

import * as UI from '../../lib'

import { Canvas, Meta, Story } from '@storybook/addon-docs/blocks'

twoLineTransactions

Display a transaction

API Documentation

{ () => { const twoLineTransaction = UI.widgets.index.twoLine['http://www.w3.org/2000/10/swap/pim/qif#Transaction'] const thing = UI.rdf.namedNode('http://example.com/#transaction') UI.store.add(thing, UI.ns.qu('payee'), UI.rdf.namedNode('https://payee.com/#me')) UI.store.add(thing, UI.ns.qu('date'), UI.rdf.literal('2020-01-01')) UI.store.add(thing, UI.ns.qu('amount'), UI.rdf.literal('20 USD')) return twoLineTransaction(document, thing) } }

twoLineTrip

Display a trip

API Documentation

{ () => { const twoLineTrip = UI.widgets.index.twoLine['http://www.w3.org/ns/pim/trip#Trip'] const thing = UI.rdf.namedNode('http://example.com/#trip') UI.store.add(thing, UI.ns.dc('title'), 'Some trip') UI.store.add(thing, UI.ns.cal('dtstart'), UI.rdf.literal('2020-01-01')) UI.store.add(thing, UI.ns.cal('dtend'), UI.rdf.literal('2020-02-02')) return twoLineTrip(document, thing) } }

twoLineWidgetForClass

Find a function that can create a widget for a given class

API Documentation

{ () => { const rdfClass = UI.ns.foaf('Person') const thing = UI.rdf.namedNode('https://michielbdejong.inrupt.net/profile/card#me') const widgetFunction = UI.widgets.index.twoLine.widgetForClass(rdfClass) const widget = widgetFunction(document, thing) return widget } }