Skip to content

Commit c8b5e31

Browse files
authored
Update README.md
1 parent bd15a33 commit c8b5e31

1 file changed

Lines changed: 23 additions & 58 deletions

File tree

README.md

Lines changed: 23 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,26 @@ User Interface widgets and utilities for Solid (solid-ui)
77
These are HTML5 widgets which connect to a solid store. Building blocks for solid-based apps.
88
Vanilla JS. Includes large widgets like chat, table, matrix, form fields, and small widgets.
99

10+
See [storybook](http://solidos.github.io/solid-ui/examples/storybook/) for SolidUI widgets.
11+
See [API](https://solidos.github.io/solid-ui/Documentation/api/) for SolidUI functions.
12+
See [Forms](https://solidos.github.io/solid-ui/Documentation/form-examples/demo.html) for UI vocabulary implementation.
13+
14+
Table of content:
15+
- Getting started(#getting-started)
16+
- Further documentation(#further-ocumentation)
17+
18+
1019
## Getting started
20+
21+
Contributions of bug fixes and new functionality, documentation, and tests are
22+
always appreciated.
23+
1124
### In npm-based projects
1225
When including solid-ui in an npm-based project, you can use it with:
1326

1427
```js
15-
import { ns, rdf, acl, aclControl, authn, create, dom, icons, log, matrix, media,
16-
messageArea, infiniteMessageArea, pad, preferences, store, style, table, tabs, utils, widgets, versionInfo
28+
import { ns, rdf, acl, aclControl, create, dom, icons, log, matrix, media,
29+
messageArea, infiniteMessageArea, pad, preferences, style, table, tabs, utils, widgets, versionInfo
1730
} from 'solid-ui'
1831

1932
```
@@ -23,10 +36,8 @@ Clone this repo, and in the repo root run:
2336
* `npm install`
2437
* `npm run build`
2538

26-
This will generate a `lib/` folder containing, among other artifacts, `lib/webpack-bundle.js`.
27-
Now run `npx serve` and go to http://localhost:5000/examples/ with your browser to see some examples.
28-
See the ['examples' folder](https://github.com/solidos/solid-ui/tree/examples/examples) for the
29-
source code of those examples.
39+
This will generate a `dist/` folder containing, among other artifacts, `dist/main.js`.
40+
Now run `npx serve` and go to http://localhost:3000/Documentation/ with your browser to see some examples.
3041

3142
While viewing one of those examples, you can open the web console in your browser and for instance
3243
try how you can create a button:
@@ -44,56 +55,7 @@ const chat = UI.infiniteMessageArea(document, store, UI.rdf.namedNode(chatChanne
4455
document.body.appendChild(chat)
4556
```
4657

47-
Or a full ACL Control Box:
48-
```js
49-
const exampleFolder = 'https://example-user.inrupt.net/public/public-control/'
50-
const aclControlBox = UI.aclControl.ACLControlBox5(UI.rdf.namedNode(exampleFolder), { dom: document }, '', store)
51-
document.body.appendChild(aclControlBox)
52-
```
53-
54-
55-
## Documentation
56-
- [talk presentation](https://solidos.github.io/solid-ui/Documentation/talks/FormsTalk.html)
57-
- API https://solidos.github.io/solid-ui/Documentation/api/ for the API documentation.
58-
- The UI components are presented in a [storybook](http://solidos.github.io/solid-ui/examples/storybook/).
59-
60-
## Overview
61-
This has been a place to put any functionality from solid views which has been generalized to be usable in other views.
62-
63-
- Authentication UI: manage the user's logged in/out state.
64-
- Discovery: finding the user's stuff, and leaving records of new things
65-
- Preferences: UI for managing a user's preferences with two axes of defaults
66-
- An Access Control List widget for Solid ACL system
67-
- Acess Control Logic
68-
- Create a new object from modules/extensions which have registered their ability to create things
69-
70-
- A [form system](https://solidos.github.io/solid-ui/Documentation/forms-intro.html): Forms are defined in RDF, and create/edit RDF data, including form definitions
71-
- A collection of shortcut namespace objects for a selection of relevant RDF vocabularies.
72-
- Small atomic widgets (buttons etc) of which the others are constructed.
73-
- An error message panel
74-
75-
Some of the larger controls include:
76-
77-
- A chat widget: add discussion to any object. Infinite scroll, embedded images, social reactions, etc etc
78-
- A people picker widget for choosing a set of people or an existing group
79-
- A general purpose table display with built-in faceted browsing
80-
- A two-dimentional matrix of editable live data that extends in both dimensions.
81-
- A notepad of shared notes for real-time collaboration
82-
- Drag and drop code for linking things and uploading files
83-
- A set of tabs for holding other widgets and arbitrary UI elements
84-
85-
The typical style of the widgets is to know what data it has been derived from,
86-
allow users to edit it, and to automatically sync with data as it changes in the future.
87-
To see how these are used, see the panes which use them within the data browser.
88-
89-
The level of support for this varies.
90-
91-
See also: [A short introduction to the Form system](https://solidos.github.io/solid-ui/Documentation/forms-intro.html)
92-
93-
Contributions of bug fixes and new functionality, documentation, and tests are
94-
always appreciated.
95-
96-
## Development
58+
### Development new components
9759

9860
When developing a component in solid-ui you can test it in isolation using storybook
9961

@@ -104,5 +66,8 @@ npm run storybook
10466

10567
If there is no story for the component yet, add a new one to `./src/stories`.
10668

107-
When you want to test the component within a solid-pane, you can use the [development mode of solid-panes](https://github.com/solidos/solid-panes#development) or
108-
[mashlib-dev](https://github.com/solidos/mashlib-dev).
69+
When you want to test the component within a solid-pane, you can use the [development mode of solid-panes](https://github.com/solidos/solid-panes#development).
70+
71+
## Further documentation
72+
- [Slides about forms](https://solidos.github.io/solid-ui/Documentation/talks/FormsTalk.html)
73+
- [Some code know-how](https://github.com/SolidOS/solidos/wiki/2.-Solid-UI-know-how)

0 commit comments

Comments
 (0)