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

moved and renamed icon picker files

Browse Source
This commit is contained in:
Jesper Møller Jensen
2022-09-06 11:04:23 +02:00
parent f2992a1e8a
commit 7d6a31e1a7
2 changed files with 15 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/Umbraco.Web.UI.Client/src/backoffice/components/icon-selector.element.ts → src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/icon-picker/modal-layout-icon-picker.element.ts
View File

@@ -1,14 +1,14 @@
import { css, html, LitElement } from 'lit';
import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
import { customElement, property, state } from 'lit/decorators.js';
import { UmbModalService } from '../../core/services/modal';
import { UmbModalLayoutElement } from '../../core/services/modal/layouts/modal-layout.element';
import { UmbModalContentPickerData } from '../../core/services/modal/layouts/content-picker/modal-layout-content-picker.element';
import { UmbModalService } from '../..';
import { UmbModalLayoutElement } from '../modal-layout.element';
import { UmbModalContentPickerData } from '../content-picker/modal-layout-content-picker.element';
import '../editors/shared/editor-entity/editor-entity.element';
import '../../../../../backoffice/editors/shared/editor-entity/editor-entity.element';
@customElement('umb-icon-selector')
class UmbIconSelector extends UmbModalLayoutElement<UmbModalContentPickerData> {
@customElement('umb-modal-layout-icon-picker')
class UmbModalLayoutIconPickerElement extends UmbModalLayoutElement<null> {
static styles = [
UUITextStyles,
css`
@@ -301,6 +301,6 @@ class UmbIconSelector extends UmbModalLayoutElement<UmbModalContentPickerData> {
declare global {
interface HTMLElementTagNameMap {
'umb-icon-selector': UmbIconSelector;
'umb-modal-layout-icon-picker': UmbModalLayoutIconPickerElement;
}
}

41
src/Umbraco.Web.UI.Client/src/stories/icon-selector.stories.ts → src/Umbraco.Web.UI.Client/src/stories/icon-picker.stories.ts
View File

@@ -2,7 +2,9 @@ import '../backoffice/components/backoffice-modal-container.element';
import '../core/services/modal/layouts/content-picker/modal-layout-content-picker.element';
import '../core/context/context-provider.element';
import '../backoffice/editors/shared/editor-layout/editor-layout.element';
import '../backoffice/components/icon-selector.element';
import '../backoffice/property-editors/property-editor-icon-picker.element';
import '../core/services/modal/layouts/icon-picker/modal-layout-icon-picker.element';
import '@umbraco-ui/uui-modal';
import '@umbraco-ui/uui-modal-container';
@@ -17,9 +19,9 @@ import { UmbModalService } from '../core/services/modal';
import { UmbContextConsumerMixin } from '../core/context';
export default {
title: 'Icon Selector',
component: 'umb-icon-selector',
id: 'icon-selector',
title: 'Icon Picker',
component: 'umb-property-editor-icon-picker',
id: 'icon-picker',
decorators: [
(story) =>
html`
@@ -35,38 +37,11 @@ export default {
],
} as Meta;
@customElement('story-modal-icon-selector')
class StoryModalIconSelector extends UmbContextConsumerMixin(LitElement) {
@state()
value = '';
private _modalService?: UmbModalService;
constructor() {
super();
this.consumeContext('umbModalService', (modalService: UmbModalService) => {
this._modalService = modalService;
});
}
private _openModal() {
this._modalService?.open('umb-icon-selector', { type: 'sidebar', size: 'small' });
}
render() {
return html`
<uui-button label="open-dialog" look="secondary" @click=${() => this._openModal()} style="margin-right: 9px;"
>Pick an icon</uui-button
>
`;
}
}
const Template: Story = () => {
return html`<umb-backoffice-modal-container></umb-backoffice-modal-container>
<story-modal-icon-selector></story-modal-icon-selector> `;
<umb-property-editor-icon-picker></umb-property-editor-icon-picker> `;
};
export const IconSelectorModal = Template.bind({});
export const IconSelector = () => html`<umb-icon-selector></umb-icon-selector>`;
export const IconSelector = () => html`<umb-modal-layout-icon-picker></umb-modal-layout-icon-picker>`;