@woven-planet/lakefront 5.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +87 -0
- package/dist/index.cjs.d.ts +2775 -0
- package/dist/index.cjs.js +1 -0
- package/dist/index.esm.d.ts +2775 -0
- package/dist/index.esm.js +1 -0
- package/package.json +125 -0
package/README.md
ADDED
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
|
|
2
|
+
[](https://badge.fury.io/js/%40woven-planet%2Flakefront)
|
|
3
|
+
|
|
4
|
+
# lakefront
|
|
5
|
+
Lakefront is a simple React component library.
|
|
6
|
+
|
|
7
|
+
## Installation
|
|
8
|
+
|
|
9
|
+
Lakefront is available as an [npm package](https://www.npmjs.com/package/@woven-planet/lakefront).
|
|
10
|
+
|
|
11
|
+
```sh
|
|
12
|
+
// with npm
|
|
13
|
+
npm install @woven-planet/lakefront
|
|
14
|
+
|
|
15
|
+
// with yarn
|
|
16
|
+
yarn add @woven-planet/lakefront
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
Emotion's `ThemeProvider` must wrap your application for the components to style correctly.
|
|
20
|
+
```
|
|
21
|
+
import { ThemeProvider } from '@emotion/react';
|
|
22
|
+
import { theme } from '@woven-planet/lakefront';
|
|
23
|
+
|
|
24
|
+
<ThemeProvider theme={theme}>
|
|
25
|
+
...
|
|
26
|
+
</ThemeProvider>
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
## Usage
|
|
30
|
+
### ⚠️ <b>LakeFront requires the client application to use React 18 as well as Node 18.x. ⚠️ </b>
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
Here is a quick example to get you started, **it's all you need**:
|
|
34
|
+
|
|
35
|
+
```jsx
|
|
36
|
+
import { createRoot } from 'react-dom/client';
|
|
37
|
+
import { Button } from '@woven-planet/lakefront';
|
|
38
|
+
|
|
39
|
+
function App() {
|
|
40
|
+
return <Button>Hello World</Button>;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
createRoot.render(<App />, document.querySelector('#app'));
|
|
44
|
+
|
|
45
|
+
```
|
|
46
|
+
## Contributing
|
|
47
|
+
If you want to contribute to the action, even by just raising a problem or proposing an idea, you can click [here](CONTRIBUTING.md) to find out how to do it.
|
|
48
|
+
|
|
49
|
+
---
|
|
50
|
+
## Storybook Components
|
|
51
|
+
We've added Storybook pages to show how each component can be used.
|
|
52
|
+
|
|
53
|
+
---
|
|
54
|
+
## How to add components to this table
|
|
55
|
+
Upon a new component being added to this table run 'npm run update-readme' for boilerplate code. Please replace the three variables with the corresponding information as needed. Also, store screenshots of components in the 'screenshots' folder.
|
|
56
|
+
|
|
57
|
+
Please do not add information below this table, the 'npm run update-readme' will not work properly if the table is not last.
|
|
58
|
+
---
|
|
59
|
+
| Component | Picture | Component | Picture |
|
|
60
|
+
|:------------------------------------------------------------------------------------------------------------------------------------------------------| :------- |:----------------------------------------------------------------------------------------------------------------------------------------------------------------| :------- |
|
|
61
|
+
| [AnchorCopy](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-anchorcopy--anchor-copy) | <details><summary>Screenshot</summary><img src="src/screenshots/AnchorCopy.png"></details> | [BoundingBoxes](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-boundingboxes--bounding-boxes) | <details><summary>Screenshot</summary><img src="src/screenshots/BoundingBoxes.png"></details> |
|
|
62
|
+
| [Breadcrumb](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-breadcrumb--breadcrumb) | <details> <summary>Screenshot</summary><img src="src/screenshots/Breadcrumb.png"></details> | [Button](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-button--all-buttons) | <details><summary>Screenshot</summary><img src="src/screenshots/Button.png"></details> |
|
|
63
|
+
| [Card](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-card--card) | <details><summary>Screenshot</summary><img src="src/screenshots/Card.png"></details> | [Checkbox](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-checkbox--checkbox) | <details><summary>Screenshot</summary><img src="src/screenshots/Checkbox.png"></details> |
|
|
64
|
+
| [CheckboxGroup](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-checkboxgroup--checkbox-group) | <details><summary>Screenshot</summary><img src="src/screenshots/CheckboxGroup.png"></details> | [PopoverContent](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-popovercontent--popover-content) | <details><summary>Screenshot</summary><img src="src/screenshots/PopoverContent.png"></details> |
|
|
65
|
+
| [Collapsible](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-collapsible--collapsible) | <details><summary>Screenshot</summary><img src="src/screenshots/Collapsible.png"></details> | [CopyButton](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-copybutton--copy-button) | <details><summary>Screenshot</summary><img src="src/screenshots/CopyButton.png"></details> |
|
|
66
|
+
| [Drawer](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-drawer--drawer) | <details><summary>Screenshot</summary><img src="src/screenshots/Drawer.png"></details> | [Filter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-allfilters--no-filter-bar) | <details><summary>Screenshot</summary><img src="src/screenshots/Filter.png"></details> |
|
|
67
|
+
| [AdditionalJSONFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-additionaljsonfilter--additional-json-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/AdditionalJSONFilter.png"></details> | [DoubleMultiSelectFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-doublemultiselectfilter--double-multi-select-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/DoubleMultiSelectFilter.png"></details> |
|
|
68
|
+
| [DurationFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-durationfilter--duration-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/DurationFilter.png"></details>| [ListFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-listfilter--list-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/ListFilter.png"></details> |
|
|
69
|
+
| [MultiSelectFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-multiselectfilter--multi-select-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/MultiSelectFilter.png"></details> | [RadioFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-radiofilter--radio-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/RadioFilter.png"></details> |
|
|
70
|
+
| [SingleSelectFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-singleselectfilter--single-select-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/SingleSelectFilter.png"></details> | [TextFilter](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-filter-textfilter--text-filter) | <details><summary>Screenshot</summary><img src="src/screenshots/TextFilter.png"></details> |
|
|
71
|
+
| [Header](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-header--header) | <details><summary>Screenshot</summary><img src="src/screenshots/Header.png"></details> | [Input](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-input--placeholder) | <details><summary>Screenshot</summary><img src="src/screenshots/Input.png"></details> |
|
|
72
|
+
| [ItemGrid](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-itemgrid--item-grid) | <details><summary>Screenshot</summary><img src="src/screenshots/ItemGrid.png"></details> | [ItemResults](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-itemresults--item-results) | <details><summary>Screenshot</summary><img src="src/screenshots/ItemResults.png"></details> |
|
|
73
|
+
| [Loading](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-loading--loading) | <details><summary>Screenshot</summary><img src="src/screenshots/Loading.png"></details> | [MaskableImage](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-maskableimage--maskable-image) | <details><summary>Screenshot</summary><img src="src/screenshots/MaskableImage.png"></details>|
|
|
74
|
+
| [Modal](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-modal--simple-modal) | <details><summary>Screenshot</summary><img src="src/screenshots/Modal.png"></details> | [ConfirmationModal](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-modal-confirmationmodal--basic-confirm) | <details><summary>Screenshot</summary><img src="src/screenshots/ConfirmationModal.png"></details> |
|
|
75
|
+
| [Page](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-page--page) | <details><summary>Screenshot</summary><img src="src/screenshots/Page.png"></details> | [PlaybackBar](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-playbackbar--playback-bar) | <details><summary>Screenshot</summary><img src="src/screenshots/PlaybackBar.png"></details> |
|
|
76
|
+
| [Progress](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-progress-progressbar--progress-bar) | <details><summary>Screenshot</summary><img src="src/screenshots/Progress.png"></details> | [Circular Progress](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-progress-circularprogress--circular-progress) | <details><summary>Screenshot</summary><img src="src/screenshots/CircularProgress.png"></details> |
|
|
77
|
+
| [Device Progress](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-progress-deviceprogress--default-progress-bar) | <details><summary>Screenshot</summary><img src="src/screenshots/DeviceProgress.png"></details> | [Progress Bar](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-progress-progressbar--progress-bar) | <details><summary>Screenshot</summary><img src="src/screenshots/ProgressBar.png"></details> |
|
|
78
|
+
| [PropertyList](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-propertylist--property-list) | <details><summary>Screenshot</summary><img src="src/screenshots/PropertyList.png"></details> | [RadioGroup](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-radiogroup--standard-radio-group) | <details><summary>Screenshot</summary><img src="src/screenshots/RadioGroup.png"></details>|
|
|
79
|
+
| [RefreshToolBar](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-refreshtoolbar--refresh-toolbar) | <details><summary>Screenshot</summary><img src="src/screenshots/RefreshToolBar.png"></details> | [Select](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-select--select) | <details><summary>Screenshot</summary><img src="src/screenshots/Select.png"></details> |
|
|
80
|
+
| [SelectPopover](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-selectpopover--popover) | <details><summary>Screenshot</summary><img src="src/screenshots/SelectPopover.png"></details> | [Snackbar](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-snackbar) | <details><summary>Screenshot</summary><img src="src/screenshots/Snackbar.png"></details> |
|
|
81
|
+
| [SpeedInput](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-speedinput--speed-input) | <details><summary>Screenshot</summary><img src="src/screenshots/SpeedInput.png"></details> | [StackBanner](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-stack-banner--stack-banner) | <details><summary>Screenshot</summary><img src="src/screenshots/StackBanner.png"></details> |
|
|
82
|
+
| [StackBannerRow](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-stack-banner-stack-banner-row--error) | <details><summary>Screenshot</summary><img src="src/screenshots/StackBannerRow.png"></details> | [StepFunctionAuthoring](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-stepfunctionauthoring--new-step-function) | <details><summary>Screenshot</summary><img src="src/screenshots/StepFunctionAuthoring.png"></details> |
|
|
83
|
+
| [StatusTable](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-statustable--status-table-with-table-card) | <details><summary>Screenshot</summary><img src="src/screenshots/StatusTable.png"></details> | [StepFunctionGraph](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-stepfunctiongraph--simple-graph) | <details><summary>Screenshot</summary><img src="src/screenshots/StepFunctionAuthoring.png"></details> |
|
|
84
|
+
| [StepFunctionRenderer](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-stepfunctionrenderer--step-function-renderer) | <details><summary>Screenshot</summary><img src="src/screenshots/StepFunctionRenderer.png"></details> | [Table](https://woven-planet.github.io/lakefront?path=/docs/lakefront-table--table) | <details><summary>Screenshot</summary><img src="src/screenshots/Table.png"></details> |
|
|
85
|
+
| [Tabs](https://woven-planet.github.io/lakefront?path=/docs/lakefront-tabs--tabs) | <details><summary>Screenshot</summary><img src="src/screenshots/Tabs.png"></details> | [TextArea](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-textarea--placeholder) | <details><summary>Screenshot</summary><img src="src/screenshots/TextArea.png"></details> |
|
|
86
|
+
| [Toggle](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-toggle--toggle) | <details><summary>Screenshot</summary><img src="src/screenshots/Toggle.png"></details> | [TypeaheadSearch](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-typeaheadsearch--search-bottom-start) |<details><summary>Screenshot</summary><img src="src/screenshots/TypeaheadSearch.png"></details> |
|
|
87
|
+
| [ModeSelector](https://woven-planet.github.io/lakefront/?path=/docs/lakefront-modeselector--simple-mode-selector) | <details><summary>Screenshot</summary><img src="src/screenshots/ModeSelector.png"></details> |
|