Skip to content

Commit 0bf3f48

Browse files
fmontesfmontes
committed
Create dotcms-container and dotcms-contentlet
1 parent 39172d4 commit 0bf3f48

13 files changed

Lines changed: 5405 additions & 105 deletions

File tree

‎package-lock.json‎

Lines changed: 5226 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,12 @@
2222
"generate": "stencil generate"
2323
},
2424
"devDependencies": {
25-
"@stencil/core": "^1.3.3"
25+
"@stencil/core": "^1.3.3",
26+
"@types/jest": "24.0.19",
27+
"@types/puppeteer": "1.20.2",
28+
"jest": "24.8.0",
29+
"jest-cli": "24.8.0",
30+
"puppeteer": "1.20.0"
2631
},
2732
"license": "MIT"
2833
}

‎src/components.d.ts‎

Lines changed: 29 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* eslint-disable */
12
/* tslint:disable */
23
/**
34
* This is an autogenerated file created by the Stencil compiler.
@@ -9,53 +10,45 @@ import { HTMLStencilElement, JSXBase } from '@stencil/core/internal';
910

1011

1112
export namespace Components {
12-
interface MyComponent {
13-
/**
14-
* The first name
15-
*/
16-
'first': string;
17-
/**
18-
* The last name
19-
*/
20-
'last': string;
21-
/**
22-
* The middle name
23-
*/
24-
'middle': string;
13+
interface DotcmsContainer {
14+
'container': { acceptTypes: string; inode: string; identifier: string; uuid: string; maxContentlets: string; };
15+
}
16+
interface DotcmsContentlet {
17+
'contentlet': { inode: string; identifier: string; contentType: string; baseType: string; dotLang: string; title: string; dotCanEdit: string; dotContentTypeId: string; };
2518
}
2619
}
2720

2821
declare global {
2922

3023

31-
interface HTMLMyComponentElement extends Components.MyComponent, HTMLStencilElement {}
32-
var HTMLMyComponentElement: {
33-
prototype: HTMLMyComponentElement;
34-
new (): HTMLMyComponentElement;
24+
interface HTMLDotcmsContainerElement extends Components.DotcmsContainer, HTMLStencilElement {}
25+
const HTMLDotcmsContainerElement: {
26+
prototype: HTMLDotcmsContainerElement;
27+
new (): HTMLDotcmsContainerElement;
28+
};
29+
30+
interface HTMLDotcmsContentletElement extends Components.DotcmsContentlet, HTMLStencilElement {}
31+
const HTMLDotcmsContentletElement: {
32+
prototype: HTMLDotcmsContentletElement;
33+
new (): HTMLDotcmsContentletElement;
3534
};
3635
interface HTMLElementTagNameMap {
37-
'my-component': HTMLMyComponentElement;
36+
'dotcms-container': HTMLDotcmsContainerElement;
37+
'dotcms-contentlet': HTMLDotcmsContentletElement;
3838
}
3939
}
4040

4141
declare namespace LocalJSX {
42-
interface MyComponent extends JSXBase.HTMLAttributes<HTMLMyComponentElement> {
43-
/**
44-
* The first name
45-
*/
46-
'first'?: string;
47-
/**
48-
* The last name
49-
*/
50-
'last'?: string;
51-
/**
52-
* The middle name
53-
*/
54-
'middle'?: string;
42+
interface DotcmsContainer {
43+
'container'?: { acceptTypes: string; inode: string; identifier: string; uuid: string; maxContentlets: string; };
44+
}
45+
interface DotcmsContentlet {
46+
'contentlet'?: { inode: string; identifier: string; contentType: string; baseType: string; dotLang: string; title: string; dotCanEdit: string; dotContentTypeId: string; };
5547
}
5648

5749
interface IntrinsicElements {
58-
'my-component': MyComponent;
50+
'dotcms-container': DotcmsContainer;
51+
'dotcms-contentlet': DotcmsContentlet;
5952
}
6053
}
6154

@@ -64,7 +57,10 @@ export { LocalJSX as JSX };
6457

6558
declare module "@stencil/core" {
6659
export namespace JSX {
67-
interface IntrinsicElements extends LocalJSX.IntrinsicElements {}
60+
interface IntrinsicElements {
61+
'dotcms-container': LocalJSX.DotcmsContainer & JSXBase.HTMLAttributes<HTMLDotcmsContainerElement>;
62+
'dotcms-contentlet': LocalJSX.DotcmsContentlet & JSXBase.HTMLAttributes<HTMLDotcmsContentletElement>;
63+
}
6864
}
6965
}
7066

src/components/my-component/my-component.e2e.ts renamed to src/components/dotcms-container/dotcms-container.e2e..ts

File renamed without changes.

‎src/components/dotcms-container/dotcms-container.tsx‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { Component, h, Prop, Host } from '@stencil/core';
2+
3+
@Component({
4+
tag: 'dotcms-container',
5+
shadow: true
6+
})
7+
export class DotcmsContainer {
8+
@Prop() container = {
9+
acceptTypes: '',
10+
inode: '',
11+
identifier: '',
12+
uuid: '',
13+
maxContentlets: ''
14+
};
15+
render() {
16+
const { acceptTypes, inode, identifier, uuid, maxContentlets } = this.container;
17+
18+
return (
19+
<Host
20+
style={{ display: 'block' }}
21+
data-dot-accept-types={acceptTypes}
22+
data-dot-object="container"
23+
data-dot-inode={inode}
24+
data-dot-identifier={identifier}
25+
data-dot-uuid={uuid}
26+
data-max-contentlets={maxContentlets}
27+
data-dot-can-add="CONTENT,FORM,WIDGET"
28+
>
29+
<slot />
30+
</Host>
31+
);
32+
}
33+
}

‎src/components/dotcms-container/readme.md‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# dotcms-container
2+
3+
<!-- Auto Generated Below -->
4+
5+
## Properties
6+
7+
| Property | Attribute | Description | Type | Default |
8+
| ----------- | --------- | ----------- | --------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------ |
9+
| `container` | -- | | `{ acceptTypes: string; inode: string; identifier: string; uuid: string; maxContentlets: string; }` | `{ acceptTypes: '', inode: '', identifier: '', uuid: '', maxContentlets: '' }` |
10+
11+
---
12+
13+
_Built with [StencilJS](https://stenciljs.com/)_

‎src/components/dotcms-contentlet/dotcms-contentlet.e2e..ts‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { newE2EPage } from '@stencil/core/testing';
2+
3+
describe('my-component', () => {
4+
it('renders', async () => {
5+
const page = await newE2EPage();
6+
7+
await page.setContent('<my-component></my-component>');
8+
const element = await page.find('my-component');
9+
expect(element).toHaveClass('hydrated');
10+
});
11+
12+
it('renders changes to the name data', async () => {
13+
const page = await newE2EPage();
14+
15+
await page.setContent('<my-component></my-component>');
16+
const component = await page.find('my-component');
17+
const element = await page.find('my-component >>> div');
18+
expect(element.textContent).toEqual(`Hello, World! I'm `);
19+
20+
component.setProperty('first', 'James');
21+
await page.waitForChanges();
22+
expect(element.textContent).toEqual(`Hello, World! I'm James`);
23+
24+
component.setProperty('last', 'Quincy');
25+
await page.waitForChanges();
26+
expect(element.textContent).toEqual(`Hello, World! I'm James Quincy`);
27+
28+
component.setProperty('middle', 'Earl');
29+
await page.waitForChanges();
30+
expect(element.textContent).toEqual(`Hello, World! I'm James Earl Quincy`);
31+
});
32+
});

‎src/components/dotcms-contentlet/dotcms-contentlet.tsx‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import { Component, h, Prop, Host } from '@stencil/core';
2+
3+
@Component({
4+
tag: 'dotcms-contentlet',
5+
shadow: true
6+
})
7+
export class DotcmsContentlet {
8+
@Prop() contentlet = {
9+
inode: '',
10+
identifier: '',
11+
contentType: '',
12+
baseType: '',
13+
dotLang: '',
14+
title: '',
15+
dotCanEdit: '',
16+
dotContentTypeId: ''
17+
};
18+
render() {
19+
const { inode, identifier, contentType, baseType, dotLang, title, dotCanEdit, dotContentTypeId } = this.contentlet;
20+
21+
return (
22+
<Host
23+
style={{ display: 'block' }}
24+
data-dot-object="contentlet"
25+
data-dot-inode={inode}
26+
data-dot-identifier={identifier}
27+
data-dot-type={contentType}
28+
data-dot-basetype={baseType}
29+
data-dot-lang={dotLang}
30+
data-dot-title={title}
31+
data-dot-can-edit={`${dotCanEdit}`}
32+
data-dot-content-type-id={dotContentTypeId}
33+
data-dot-has-page-lang-version="true"
34+
>
35+
<slot />
36+
</Host>
37+
);
38+
}
39+
}

‎src/components/dotcms-contentlet/readme.md‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# dotcms-contentlet
2+
3+
<!-- Auto Generated Below -->
4+
5+
## Properties
6+
7+
| Property | Attribute | Description | Type | Default |
8+
| ------------ | --------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------- |
9+
| `contentlet` | -- | | `{ inode: string; identifier: string; contentType: string; baseType: string; dotLang: string; title: string; dotCanEdit: string; dotContentTypeId: string; }` | `{ inode: '', identifier: '', contentType: '', baseType: '', dotLang: '', title: '', dotCanEdit: '', dotContentTypeId: '' }` |
10+
11+
---
12+
13+
_Built with [StencilJS](https://stenciljs.com/)_

‎src/components/my-component/my-component.css‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

0 commit comments

Comments
 (0)