You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+23-15
Original file line number
Diff line number
Diff line change
@@ -1,7 +1,7 @@
1
1
# Lit Functional components
2
-
Aims to provide a cool wrapper around lit-components. That's not a goal to introduce every Reactlike syntax and feature.
2
+
Lit Functional Components aims to provide a simple wrapper around Lit components, offering a streamlined development experience without introducing every React-like syntax and feature.
3
3
4
-
## Install
4
+
## Installation
5
5
6
6
### Yarn
7
7
`yarn add lit-functions`
@@ -12,10 +12,9 @@ Aims to provide a cool wrapper around lit-components. That's not a goal to intro
12
12
## Usage
13
13
14
14
### Component and props
15
-
`useProp` is like `useState` in React, but in Lit there are props and attributes only and there is no point to have a `useState` here. Instead let's define `lit` properties and whenever a property changes the component rerenders.
16
-
The intellisense will figure out the type of the props from the `type`.
15
+
The useProp function is similar to useState in React. In Lit, properties and attributes are used, eliminating the need for a separate useState. Instead, define Lit properties, and whenever a property changes, the component re-renders. The type of the properties is inferred from the type argument.
17
16
18
-
The `component` method will create the custom web component and the name is generated from the function name.
17
+
The component function creates a custom web component, with the name generated from the function name.
Add some test and document what you've done. That's it :D
117
+
To contribute, add tests and document your changes. That's it! 😄
120
118
121
119
### Install
122
120
@@ -126,10 +124,20 @@ Add `"private": true` to the package.json to support `yarn workspaces`.
126
124
127
125
### Start
128
126
129
-
You can try out ur changes with the command `yarn start:app:ts` or you can test how it works with js either `yarn start:app:js`. Before runninf the JS app, do not forget to create a new version locally with `yarn build && yarn pack` command.
127
+
Test your changes with the command:
128
+
129
+
`yarn start:app:ts`
130
+
131
+
Or test how it works with JavaScript:
132
+
133
+
`yarn start:app:js`
134
+
135
+
Before running the JavaScript app, create a new version locally with:
0 commit comments