From 7d6a31e1a7ce1f09257da27ab59efd8badcff05c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jesper=20M=C3=B8ller=20Jensen?= <jmj@umbraco.dk>
Date: Tue, 6 Sep 2022 11:04:23 +0200
Subject: [PATCH] moved and renamed icon picker files

---
 .../modal-layout-icon-picker.element.ts}      | 14 +++----
 ...ctor.stories.ts => icon-picker.stories.ts} | 41 ++++---------------
 2 files changed, 15 insertions(+), 40 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/{backoffice/components/icon-selector.element.ts => core/services/modal/layouts/icon-picker/modal-layout-icon-picker.element.ts} (92%)
 rename src/Umbraco.Web.UI.Client/src/stories/{icon-selector.stories.ts => icon-picker.stories.ts} (57%)

diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/components/icon-selector.element.ts b/src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/icon-picker/modal-layout-icon-picker.element.ts
similarity index 92%
rename from src/Umbraco.Web.UI.Client/src/backoffice/components/icon-selector.element.ts
rename to src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/icon-picker/modal-layout-icon-picker.element.ts
index 4f04d7a9f8..e6ec60bd29 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/components/icon-selector.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/core/services/modal/layouts/icon-picker/modal-layout-icon-picker.element.ts
@@ -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;
 	}
 }
diff --git a/src/Umbraco.Web.UI.Client/src/stories/icon-selector.stories.ts b/src/Umbraco.Web.UI.Client/src/stories/icon-picker.stories.ts
similarity index 57%
rename from src/Umbraco.Web.UI.Client/src/stories/icon-selector.stories.ts
rename to src/Umbraco.Web.UI.Client/src/stories/icon-picker.stories.ts
index 91d3296eb5..5d1f9a85d9 100644
--- a/src/Umbraco.Web.UI.Client/src/stories/icon-selector.stories.ts
+++ b/src/Umbraco.Web.UI.Client/src/stories/icon-picker.stories.ts
@@ -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>`;