0.6.4 • Published 5 months ago

@protorians/widgets v0.6.4

Weekly downloads
-
License
ISC
Repository
github
Last release
5 months ago

Protorians Widgets

Create your web user interfaces with widgets

Syntax

import {Widget, H1, H4, Paragraph, Component} from "@protorians/widgets"
import {IWidget} from "./widget";

/**
 * Define Type
 */
type MyType = {
  fullname: string;
}

/**
 * Create widget
 */
const myWidget = ({fullname}: MyType): IWidget<ICommonAttributes, HTMLElement> => Widget({
  classname: "my-widget",
  style: {
    padding: "1rem",
    width: "calc( 100% - 2rem )"
  },
  children: [
    H1('Protorians Widget'),
    Paragraph(`Welcome to the futur ${fullname}`)
  ],
  signal: {
    mount: (context) => console.log('My widget is mounted with context :', context)
  }
})


/**
 * Define component
 */
Component<MyType>('MyWidget', myWidget)

/**
 * Or Use in other widget
 */
const otherWidget = () => Widget({
  children:[
    H4('Home'),
    myWidget({fullname: 'Carter'})
  ]
})

Use in HTML page

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>My Page</title>
</head>
<body>
...
    <my-widget fullanme="Ian"></my-widget>
...
</body>
</html>

Coming Soon...

protorianswidgetelementhtmlfrontendlibrary
@protorians/spectra@protorians/animetric@protorians/colorimetric@protorians/core
@visualkit/core@visualkit/coverage@visualkit/progress@protorians/kit
0.1.8-beta.0

8 months ago

0.1.10

8 months ago

0.1.11

8 months ago

0.1.12

8 months ago

0.6.6

5 months ago

0.1.13

8 months ago

0.1.14

8 months ago

0.6.8

5 months ago

0.3.0

8 months ago

0.1.8

8 months ago

0.3.5

7 months ago

0.1.9

8 months ago

0.5.0

6 months ago

0.3.2

8 months ago

0.3.1

8 months ago

0.1.3

9 months ago

0.1.6

9 months ago

0.5.1

6 months ago

0.3.3

7 months ago

0.1.5

9 months ago

0.1.7-beta.1

9 months ago

0.1.7-beta.2

9 months ago

0.1.7-beta.3

8 months ago

0.1.7-beta.4

8 months ago

0.3.9

7 months ago

0.1.7-beta.0

9 months ago

0.3.11

7 months ago

0.3.10

7 months ago

0.1.20

8 months ago

0.1.21

8 months ago

0.1.22

8 months ago

0.1.23

8 months ago

0.1.24

8 months ago

0.6.3

5 months ago

0.1.16

8 months ago

0.6.2

6 months ago

0.1.17

8 months ago

0.6.5

5 months ago

0.1.18

8 months ago

0.6.4

5 months ago

0.1.19

8 months ago

0.4.0

6 months ago

0.0.14

1 year ago

0.0.13

1 year ago

0.0.10

1 year ago

0.0.11

1 year ago

0.0.9

1 year ago

0.0.8

1 year ago

0.0.5

1 year ago

0.0.4

1 year ago

0.0.7

1 year ago

0.0.6

1 year ago

0.0.4-beta.13

1 year ago

0.0.4-beta.6

1 year ago

0.0.4-beta.7

1 year ago

0.0.4-beta.5

1 year ago

0.0.3

1 year ago

0.0.4-beta.0

1 year ago

0.0.4-beta.2

1 year ago

0.0.3-beta.2

1 year ago

0.0.4-beta.1

1 year ago

0.0.3-beta.3

1 year ago

0.0.4-beta.3

1 year ago

0.0.3-beta.1

1 year ago

0.0.3-beta.4

1 year ago

0.0.3-beta.5

1 year ago

0.0.2-beta.7

1 year ago

0.0.2-beta.8

1 year ago

0.0.2-beta.9

1 year ago

0.0.2-beta.6

1 year ago

0.0.2-beta.3

1 year ago

0.0.2-beta.1

1 year ago

0.0.2-beta.2

1 year ago

0.0.1-alpha.11

2 years ago

0.0.1-alpha.10

2 years ago

0.0.1-alpha.8

2 years ago

0.0.1-alpha.9

2 years ago

0.0.1-alpha.6

2 years ago

0.0.1-alpha.7

2 years ago

0.0.1-alpha.5

2 years ago

0.0.1-alpha.2

2 years ago

0.0.1-alpha.3

2 years ago

0.0.1-alpha.1

2 years ago

0.0.1

2 years ago