Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Reexport preact && bundle library #124

Merged
merged 3 commits into from
Dec 15, 2021
Merged

Reexport preact && bundle library #124

merged 3 commits into from
Dec 15, 2021

Conversation

barmac
Copy link
Member

@barmac barmac commented Dec 9, 2021

This PR introduces bundling to the library so that it's easier to re-export
its contents in the context of a pluggable application (Camunda Modeler).

We re-export preact package together with subpackages to make sure
plugin creators can depend on the same instance which is essential
for the hooks to work correctly.

Some examples of the new way (copied from the commit messages):

import { Group, TextFieldEntry } from @bpmn-io/properties-panel;

const myGroup = {
  id: myGroup,
  component: Group,
  entries: [
    { id: customEntry, component: <TextFieldEntry /* ... */ /> }
  ]
};

For preact

import { h } from '@bpmn-io/properties-panel/preact';

function CustomComponent(props) {
	return h('div', 'hello world!');
}

If you transpile from JSX, the babel importSource should be set
accordingly:

{
  "plugins": [
    [ "@babel/plugin-transform-react-jsx", {
      "importSource": "@bpmn-io/properties-panel/preact",
      "runtime": "automatic"
    } ]

BREAKING CHANGES:

  • Internal structure of the library is no longer exposed.
    Use root exports instead.

@bpmn-io-tasks bpmn-io-tasks bot added the in progress Currently worked on label Dec 9, 2021
barmac added a commit to bpmn-io/bpmn-js-properties-panel that referenced this pull request Dec 10, 2021
This adjusts the imports according to the new structure
implemented via bpmn-io/properties-panel#124
barmac added a commit to bpmn-io/bpmn-js-properties-panel that referenced this pull request Dec 10, 2021
This adjusts the imports according to the new structure
implemented via bpmn-io/properties-panel#124
This allows to make sure any packages depending on the project
as well as user's extension use the same instance of the preact
package, thus making hooks and other features work smoothly.

Instead of installing and import preact in your project, import
the library from the properties panel package, e.g.

```javascript
import { h } from '@bpmn-io/properties-panel/preact';

function CustomComponent(props) {
	return h('div', 'hello world!');
}
```

If you transpile from JSX, the babel `importSource` should be set
accordingly:

```json
{
  "plugins": [
    [ "@babel/plugin-transform-react-jsx", {
      "importSource": "@bpmn-io/properties-panel/preact",
      "runtime": "automatic"
    } ]
```
@barmac barmac marked this pull request as ready for review December 13, 2021 16:07
@bpmn-io-tasks bpmn-io-tasks bot added needs review Review pending and removed in progress Currently worked on labels Dec 13, 2021
@@ -0,0 +1,15 @@
{
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Renamed so that it can be automatically parsed via require in the karma config.

.eslintignore Outdated
/node_modules
/lib
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Prepending slash means that the ignore will be applied only to the root of the repo.

The library no longer exposes its internal structure in `lib`.
Instead, exports can be accessed from the root.

```javascript
import { Group, TextFieldEntry } from @bpmn-io/properties-panel;

const myGroup = {
  id: myGroup,
  component: Group,
  entries: [
    { id: customEntry, component: <TextFieldEntry /* ... */ /> }
  ]
};
```

BREAKING CHANGES:

* Internal structure of the library is no longer exposed.
  Use root exports instead.
barmac added a commit to bpmn-io/bpmn-js-properties-panel that referenced this pull request Dec 14, 2021
This adjusts the imports according to the new structure
implemented via bpmn-io/properties-panel#124
barmac added a commit to bpmn-io/bpmn-js-properties-panel that referenced this pull request Dec 15, 2021
This adjusts the imports according to the new structure
implemented via bpmn-io/properties-panel#124
Copy link
Member

@nikku nikku left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A fundamental improvement. 👍

@nikku nikku merged commit 6ceac4f into main Dec 15, 2021
@nikku nikku deleted the reexport-preact branch December 15, 2021 13:02
@bpmn-io-tasks bpmn-io-tasks bot removed the needs review Review pending label Dec 15, 2021
barmac added a commit to bpmn-io/bpmn-js-properties-panel that referenced this pull request Dec 15, 2021
This adjusts the imports according to the new structure
implemented via bpmn-io/properties-panel#124
barmac added a commit to bpmn-io/bpmn-js-properties-panel that referenced this pull request Dec 15, 2021
This adjusts the imports according to the new structure
implemented via bpmn-io/properties-panel#124
marstamm pushed a commit to bpmn-io/bpmn-js-element-templates that referenced this pull request Jun 8, 2023
This adjusts the imports according to the new structure
implemented via bpmn-io/properties-panel#124
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants