yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move property editors into folders + add basic stories

Browse Source
This commit is contained in:
Mads Rasmussen
2022-08-24 17:00:54 +02:00
parent a185c1a885
commit fa58a6f4c8
10 changed files with 484 additions and 959 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1325
src/Umbraco.Web.UI.Client/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

8
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/property-editor-content-picker.element.ts → src/Umbraco.Web.UI.Client/src/backoffice/property-editors/content-picker/property-editor-content-picker.element.ts
View File

@@ -2,8 +2,8 @@ import { css, html, LitElement } from 'lit';
import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { customElement, state } from 'lit/decorators.js';
import { UmbContextConsumerMixin } from '../../core/context';
import { UmbModalService } from '../../core/services/modal';
import { UmbContextConsumerMixin } from '../../../core/context';
import { UmbModalService } from '../../../core/services/modal';
// TODO: remove these imports when they are part of UUI
import '@umbraco-ui/uui-modal';
@@ -12,7 +12,7 @@ import '@umbraco-ui/uui-modal-container';
import '@umbraco-ui/uui-modal-dialog';
@customElement('umb-property-editor-content-picker')
export class UmbPropertyEditorContentPicker extends UmbContextConsumerMixin(LitElement) {
export class UmbPropertyEditorContentPickerElement extends UmbContextConsumerMixin(LitElement) {
static styles = [
UUITextStyles,
css`
@@ -91,6 +91,6 @@ export class UmbPropertyEditorContentPicker extends UmbContextConsumerMixin(LitE
declare global {
interface HTMLElementTagNameMap {
'umb-property-editor-content-picker': UmbPropertyEditorContentPicker;
'umb-property-editor-content-picker': UmbPropertyEditorContentPickerElement;
}
}

24
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/content-picker/property-editor-content-picker.stories.ts Normal file
View File

@@ -0,0 +1,24 @@
import { Meta, Story } from '@storybook/web-components';
import { html } from 'lit-html';
import type { UmbPropertyEditorContentPickerElement } from './property-editor-content-picker.element';
import './property-editor-content-picker.element';
import { UmbModalService } from '../../../core/services/modal';
import '../../../backoffice/components/backoffice-modal-container.element';
export default {
title: 'Property Editors/Content Picker',
component: 'umb-property-editor-content-picker',
id: 'umb-property-editor-content-picker',
decorators: [
(story) =>
html`<umb-context-provider key="umbModalService" .value=${new UmbModalService()}>
${story()}
<umb-backoffice-modal-container></umb-backoffice-modal-container>
</umb-context-provider>`,
],
} as Meta;
export const AAAOverview: Story<UmbPropertyEditorContentPickerElement> = () =>
html` <umb-property-editor-content-picker></umb-property-editor-content-picker>`;
AAAOverview.storyName = 'Overview';

12
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/property-editor-context-example.element.ts → src/Umbraco.Web.UI.Client/src/backoffice/property-editors/context-example/property-editor-context-example.element.ts
View File

@@ -1,11 +1,11 @@
import { html, LitElement } from 'lit';
import { customElement } from 'lit/decorators.js';
import { UmbContextConsumerMixin } from '../../core/context';
import type { UmbNotificationDefaultData } from '../../core/services/notification/layouts/default';
import type { UmbNotificationService } from '../../core/services/notification';
import { UmbContextConsumerMixin } from '../../../core/context';
import type { UmbNotificationDefaultData } from '../../../core/services/notification/layouts/default';
import type { UmbNotificationService } from '../../../core/services/notification';
@customElement('umb-property-editor-context-example')
export default class UmbPropertyEditorContextExample extends UmbContextConsumerMixin(LitElement) {
export class UmbPropertyEditorContextExampleElement extends UmbContextConsumerMixin(LitElement) {
private _notificationService?: UmbNotificationService;
constructor() {
@@ -25,8 +25,10 @@ export default class UmbPropertyEditorContextExample extends UmbContextConsumerM
}
}
export default UmbPropertyEditorContextExampleElement;
declare global {
interface HTMLElementTagNameMap {
'umb-property-editor-context-example': UmbPropertyEditorContextExample;
'umb-property-editor-context-example': UmbPropertyEditorContextExampleElement;
}
}

24
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/context-example/property-editor-context-example.stories.ts Normal file
View File

@@ -0,0 +1,24 @@
import { Meta, Story } from '@storybook/web-components';
import { html } from 'lit-html';
import type { UmbPropertyEditorContextExampleElement } from './property-editor-context-example.element';
import './property-editor-context-example.element';
import { UmbNotificationService } from '../../../core/services/notification';
import '../../../backoffice/components/backoffice-notification-container.element';
export default {
title: 'Property Editors/Context Example',
component: 'umb-property-editor-context-example',
id: 'umb-property-editor-context-example',
decorators: [
(story) =>
html`<umb-context-provider key="umbNotificationService" .value=${new UmbNotificationService()}>
${story()}
<umb-backoffice-notification-container></umb-backoffice-notification-container>
</umb-context-provider>`,
],
} as Meta;
export const AAAOverview: Story<UmbPropertyEditorContextExampleElement> = () =>
html` <umb-property-editor-context-example></umb-property-editor-context-example>`;
AAAOverview.storyName = 'Overview';

6
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/property-editor-text.element.ts → src/Umbraco.Web.UI.Client/src/backoffice/property-editors/text/property-editor-text.element.ts
View File

@@ -3,7 +3,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { customElement, property } from 'lit/decorators.js';
@customElement('umb-property-editor-text')
export default class UmbPropertyEditorText extends LitElement {
export class UmbPropertyEditorTextElement extends LitElement {
static styles = [
UUITextStyles,
css`
@@ -26,8 +26,10 @@ export default class UmbPropertyEditorText extends LitElement {
}
}
export default UmbPropertyEditorTextElement;
declare global {
interface HTMLElementTagNameMap {
'umb-property-editor-text': UmbPropertyEditorText;
'umb-property-editor-text': UmbPropertyEditorTextElement;
}
}

15
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/text/property-editor-text.stories.ts Normal file
View File

@@ -0,0 +1,15 @@
import { Meta, Story } from '@storybook/web-components';
import { html } from 'lit-html';
import type { UmbPropertyEditorTextElement } from './property-editor-text.element';
import './property-editor-text.element';
export default {
title: 'Property Editors/Text',
component: 'umb-property-editor-text',
id: 'umb-property-editor-text',
} as Meta;
export const AAAOverview: Story<UmbPropertyEditorTextElement> = () =>
html` <umb-property-editor-text></umb-property-editor-text>`;
AAAOverview.storyName = 'Overview';

6
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/property-editor-textarea.element.ts → src/Umbraco.Web.UI.Client/src/backoffice/property-editors/textarea/property-editor-textarea.element.ts
View File

@@ -3,7 +3,7 @@ import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { customElement, property } from 'lit/decorators.js';
@customElement('umb-property-editor-textarea')
class UmbPropertyEditorTextarea extends LitElement {
export class UmbPropertyEditorTextareaElement extends LitElement {
static styles = [
UUITextStyles,
css`
@@ -26,8 +26,10 @@ class UmbPropertyEditorTextarea extends LitElement {
}
}
export default UmbPropertyEditorTextareaElement;
declare global {
interface HTMLElementTagNameMap {
'umb-property-editor-textarea': UmbPropertyEditorTextarea;
'umb-property-editor-textarea': UmbPropertyEditorTextareaElement;
}
}

15
src/Umbraco.Web.UI.Client/src/backoffice/property-editors/textarea/property-editor-textarea.stories.ts Normal file
View File

@@ -0,0 +1,15 @@
import { Meta, Story } from '@storybook/web-components';
import { html } from 'lit-html';
import type { UmbPropertyEditorTextareaElement } from './property-editor-textarea.element';
import './property-editor-textarea.element';
export default {
title: 'Property Editors/Textarea',
component: 'umb-property-editor-textarea',
id: 'umb-property-editor-textarea',
} as Meta;
export const AAAOverview: Story<UmbPropertyEditorTextareaElement> = () =>
html` <umb-property-editor-textarea></umb-property-editor-textarea>`;
AAAOverview.storyName = 'Overview';

8
src/Umbraco.Web.UI.Client/src/temp-internal-manifests.ts
View File

@@ -123,7 +123,7 @@ export const internalManifests: Array<UmbExtensionManifestCore> = [
type: 'propertyEditorUI',
alias: 'Umb.PropertyEditorUI.Text',
name: 'Text',
js: () => import('./backoffice/property-editors/property-editor-text.element'),
js: () => import('./backoffice/property-editors/text/property-editor-text.element'),
meta: {
icon: 'edit',
group: 'common',
@@ -134,7 +134,7 @@ export const internalManifests: Array<UmbExtensionManifestCore> = [
alias: 'Umb.PropertyEditorUI.Textarea',
name: 'Textarea',
elementName: 'umb-property-editor-textarea',
js: () => import('./backoffice/property-editors/property-editor-textarea.element'),
js: () => import('./backoffice/property-editors/textarea/property-editor-textarea.element'),
meta: {
icon: 'edit',
group: 'common',
@@ -144,7 +144,7 @@ export const internalManifests: Array<UmbExtensionManifestCore> = [
type: 'propertyEditorUI',
alias: 'Umb.PropertyEditorUI.ContextExample',
name: 'Context Example',
js: () => import('./backoffice/property-editors/property-editor-context-example.element'),
js: () => import('./backoffice/property-editors/context-example/property-editor-context-example.element'),
meta: {
icon: 'favorite',
group: 'common',
@@ -235,7 +235,7 @@ export const internalManifests: Array<UmbExtensionManifestCore> = [
alias: 'Umb.PropertyEditorUI.ContentPicker',
name: 'ContentPicker',
elementName: 'umb-property-editor-content-picker',
js: () => import('./backoffice/property-editors/property-editor-content-picker.element'),
js: () => import('./backoffice/property-editors/content-picker/property-editor-content-picker.element'),
meta: {
icon: 'document',
group: 'common',