# @pageboard/elements-semantic-ui

> Elements can be defined in three parts:

Latest version **0.5.19** (published 2025-04-08) · MIT license · 0 weekly downloads

## Install

```sh
npm install @pageboard/elements-semantic-ui
pnpm add @pageboard/elements-semantic-ui
yarn add @pageboard/elements-semantic-ui
bun add @pageboard/elements-semantic-ui
```

## Health

**Score 35/100 (D)** — status: stable.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 0.5.19 |
| Published | 2025-04-08 |
| First published | 2018-06-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 7 |
| Unpacked size | 157.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | yes |
| GitHub stars | 4 |
| Author | Jérémy Lal |
| Maintainers | kapouer |

## Links

- npm: https://www.npmjs.com/package/@pageboard/elements-semantic-ui
- Repository: https://github.com/pageboard/client
- Homepage: https://github.com/pageboard/client/packages/elements-semantic-ui#readme
- Issues: https://github.com/pageboard/client/issues
- npm.io page: https://npm.io/package/@pageboard/elements-semantic-ui

## Dependencies (7)

- [nouislider](https://npm.io/package/nouislider.md) 11.1.0
- [postinstall](https://npm.io/package/postinstall.md) 0.4.0
- [stickyfilljs](https://npm.io/package/stickyfilljs.md) 2.1.0
- [semantic-ui-css](https://npm.io/package/semantic-ui-css.md) 2.3.2
- [formdata-polyfill](https://npm.io/package/formdata-polyfill.md) 3.0.11
- [object-fit-images](https://npm.io/package/object-fit-images.md) 3.2.3
- [postinstall-browserify](https://npm.io/package/postinstall-browserify.md) 0.1.0

## Recent versions

- 0.5.19 (latest) — 2025-04-08
- 0.6.29 — 2021-11-08
- 0.6.28 — 2019-09-23
- 0.7.4 — 2019-09-02
- 0.7.3 — 2019-09-02
- 0.7.2 — 2019-08-16
- 0.7.1 — 2019-08-02
- 0.7.0 — 2019-08-02
- 0.6.27 — 2019-06-21
- 0.6.26 — 2019-06-20
- 0.6.25 — 2019-06-20
- 0.6.24 — 2019-06-20
- 0.6.23 — 2019-06-20
- 0.6.22 — 2019-06-13
- 0.6.21 — 2019-06-07
- … 44 more at https://npm.io/package/@pageboard/elements-semantic-ui/versions

## README

# pageboard-elements

Elements can be defined in three parts:

- view, needed by pageboard-read to render blocks
- schema, needed by pageboard-write to edit attributes, and by pageboard-api to
  validate blocks
- edit, defines the specs of the rich text content and optionally a render
  function for edition.

It's up to pageboard-read and pageboard-write main files to load the files,
using either js files or html imports.

## everything in a single, requireable js file

Exports everything in a single file, accessible from
`public/elements/myname.js`

```
(function(exports) {
	exports.myname = {
		view: function(doc, block) {
			// do more than that of course
			return doc.createElement('div');
		},
		edit: function(doc, block) {
			// optional function
		},
		properties: {
			myprop: {
				type: 'string'
			}
		}
		specs: {
			mycontent: 'block+'
		}
	};
})(typeof exports != "undefined" ? exports : window.Pagecut.modules);
```


## multiple js files

Exports edit, view, schema from different files, accessible from
`public/elements/myname/view.js`
`public/elements/myname/edit.js`
`public/elements/myname/index.js` (defines the schema, must be requireable)

It is advised to test before assigning like this

```
(function(exports) {
	if (!exports.myname) exports.myname = {}; // test here
	exports.myname.properties = {
		myprop: {
			type: 'string'
		}
	};
})(typeof exports != "undefined" ? exports : window.Pagecut.modules);
```

view and edit files are not supposed to be requireable

```
(function(exports) {
	if (!exports.myname) exports.myname = {}; // test here
	exports.myname.view = function() {};//...
})(window.Pagecut.modules);
```


## multiple html imports

This layout is also supported:
`public/elements/myname/view.html`
`public/elements/myname/edit.html`
`public/elements/myname/index.js` (defines the schema, must be requireable)

Where view and edit load their assets as script (inline or not), link, or style
tags.

---
_Source: https://npm.io/package/@pageboard/elements-semantic-ui · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._