@things-factory/meta-ui 7.0.1-alpha.23 → 7.0.1-alpha.26

package/client/actions/main.js

@@ -1,4 +1,5 @@
-import '@material/mwc-icon'
+import '@material/web/icon/icon.js'
+
 import '../viewparts/dynamic-menu-part'
 
 import gql from 'graphql-tag'
@@ -43,12 +44,12 @@ export async function setupMenuPart(options) {
       HAMBURGER = {
         name: 'hamburger',
         template: html`
-          <mwc-icon
+          <md-icon
             @click=${e =>
               toggleOverlay('dynamic-menu-part', {
                 backdrop: true
               })}
-            >view_headline</mwc-icon
+            >view_headline</md-icon
           >
         `,
         position: TOOL_POSITION.FRONT_END

package/client/bootstrap.ts

@@ -1,3 +1,5 @@
+import '@material/web/icon/icon.js'
+
 import { html } from 'lit-html'
 
 import { navigate, store } from '@operato/shell'
@@ -81,7 +83,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html`<mwc-icon>auto_fix_high</mwc-icon>`,
+        icon: html`<md-icon>auto_fix_high</md-icon>`,
         name: html`<ox-i18n msgid="title.dynamic_menu"></ox-i18n>`,
         action: () => {
           navigate('dynamic-menu')
@@ -93,7 +95,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html`<mwc-icon>filter_tilt_shift</mwc-icon>`,
+        icon: html`<md-icon>filter_tilt_shift</md-icon>`,
         name: html`<ox-i18n msgid="title.entity"></ox-i18n>`,
         action: () => {
           navigate('config-entity')
@@ -105,7 +107,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html`<mwc-icon>speaker_notes</mwc-icon>`,
+        icon: html`<md-icon>speaker_notes</md-icon>`,
         name: html`<ox-i18n msgid="title.terminology"></ox-i18n>`,
         action: () => {
           navigate('config-terminology')
@@ -117,7 +119,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html`<mwc-icon>code</mwc-icon>`,
+        icon: html`<md-icon>code</md-icon>`,
         name: html`<ox-i18n msgid="title.code_management"></ox-i18n>`,
         action: () => {
           navigate('codes')
@@ -129,7 +131,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html`<mwc-icon>business_center</mwc-icon>`,
+        icon: html`<md-icon>business_center</md-icon>`,
         name: html`<ox-i18n msgid="title.meta_activity_list"></ox-i18n>`,
         action: () => {
           navigate('meta-activity-list')
@@ -140,7 +142,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html`<mwc-icon>margin</mwc-icon>`,
+        icon: html`<md-icon>margin</md-icon>`,
         name: html`<ox-i18n msgid="title.meta_activity_define"></ox-i18n>`,
         action: () => {
           navigate('meta-activity-define')
@@ -151,7 +153,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html`<mwc-icon>work</mwc-icon>`,
+        icon: html`<md-icon>work</md-icon>`,
         name: html`<ox-i18n msgid="title.activity_list"></ox-i18n>`,
         action: () => {
           navigate('activity-list')
@@ -162,7 +164,7 @@ export default async function bootstrap(module) {
     store.dispatch({
       type: ADD_MORENDA,
       morenda: {
-        icon: html` <mwc-icon>dataset</mwc-icon> `,
+        icon: html` <md-icon>dataset</md-icon> `,
         name: html` <ox-i18n msgid="text.attribute management"></ox-i18n> `,
         action: () => {
           navigate('attributes')

package/client/component/popup/code-input-editor-popup.js

@@ -1,7 +1,9 @@
+import '@material/web/button/elevated-button.js'
+
 import { css, html, LitElement } from 'lit'
 import { CommonGristStyles, ButtonContainerStyles } from '@operato/styles'
-import { TermsUtil } from '../../utils/terms-util';
-import { MetaApi } from "../../utils/meta-api"
+import { TermsUtil } from '../../utils/terms-util'
+import { MetaApi } from '../../utils/meta-api'
 import '@operato/input/ox-input-code.js'
 import { closePopup } from '@operato/popup'
 
@@ -24,7 +26,7 @@ export class CodeInputEditorPopup extends LitElement {
       }
 
       ox-input-code {
-        margin:10px;
+        margin: 10px;
         overflow-y: auto;
         flex: 1;
       }
@@ -36,35 +38,27 @@ export class CodeInputEditorPopup extends LitElement {
     `
   ]
 
-  async connectedCallback(){
-    
-    if(typeof this.value === 'object'){
-      this.codeVlaue = JSON.stringify(this.value, 0, 2);
+  async connectedCallback() {
+    if (typeof this.value === 'object') {
+      this.codeVlaue = JSON.stringify(this.value, 0, 2)
     } else {
-      this.codeVlaue = this.value;
-
+      this.codeVlaue = this.value
     }
 
-    await super.connectedCallback();
+    await super.connectedCallback()
   }
 
-  async firstUpdated(){
-    await super.firstUpdated();
+  async firstUpdated() {
+    await super.firstUpdated()
   }
 
-  render(){
+  render() {
     return html`
       <ox-input-code mode="javascript" value=${this.codeVlaue} tab-size="2" tab-as-space="true"></ox-input-code>
       <div id="button-container" class="button-container">
-        <mwc-button raised label="${TermsUtil.tButton('empty')}" style="margin-left:7px;margin-top:7px;"
-          @click=${this.clickEmpty.bind(this)}>
-        </mwc-button>
-        <mwc-button raised label="${TermsUtil.tButton('cancel')}" style="margin-left:7px;margin-top:7px;"
-          @click=${this.clickCancel.bind(this)}>
-        </mwc-button>
-        <mwc-button raised label="${TermsUtil.tButton('confirm')}" style="margin-left:7px;margin-top:7px;"
-          @click=${this.clickConfirm.bind(this)}>
-        </mwc-button>
+        <md-elevated-button style="margin-left:7px;margin-top:7px;" @click=${this.clickEmpty.bind(this)}> ${TermsUtil.tButton('empty')} </md-elevated-button>
+        <md-elevated-button style="margin-left:7px;margin-top:7px;" @click=${this.clickCancel.bind(this)}> ${TermsUtil.tButton('cancel')} </md-elevated-button>
+        <md-elevated-button style="margin-left:7px;margin-top:7px;" @click=${this.clickConfirm.bind(this)}> ${TermsUtil.tButton('confirm')} </md-elevated-button>
       </div>
     `
   }
@@ -76,42 +70,42 @@ export class CodeInputEditorPopup extends LitElement {
   /**
    * @description 비우기
    ***************************
-   * @returns 
+   * @returns
    */
-  async clickEmpty(e){
+  async clickEmpty(e) {
     this.confirmCallback && this.confirmCallback(null)
     closePopup(this)
   }
   /**
-   * @description 취소 
+   * @description 취소
    ***************************
-   * @returns 
+   * @returns
    */
-  async clickCancel(e){
+  async clickCancel(e) {
     closePopup(this)
   }
   /**
-   * @description 확인 
+   * @description 확인
    ***************************
-   * @returns 
+   * @returns
    */
-  async clickConfirm(e){
-    if(this.codeVlaue === this.codeEditor.value){
-      MetaApi.showToast('info', TermsUtil.tText('NOTHING_CHANGED'));
-      return;
+  async clickConfirm(e) {
+    if (this.codeVlaue === this.codeEditor.value) {
+      MetaApi.showToast('info', TermsUtil.tText('NOTHING_CHANGED'))
+      return
     }
-    this.changedValue(this.codeEditor.value);
+    this.changedValue(this.codeEditor.value)
   }
 
   /**
-   * @description 확정  
+   * @description 확정
    ***************************
-   * @param {*} record 
+   * @param {*} record
    */
-  async changedValue(value){
+  async changedValue(value) {
     this.confirmCallback && this.confirmCallback(value)
     closePopup(this)
   }
 }
-  
-customElements.define('code-input-editor-popup', CodeInputEditorPopup)
+
+customElements.define('code-input-editor-popup', CodeInputEditorPopup)

package/client/component/popup/file-upload-popup.js

@@ -1,13 +1,15 @@
+import '@material/web/button/elevated-button.js'
+
 import { client, gqlContext } from '@things-factory/shell'
 import { css, html, LitElement } from 'lit'
 import { SingleColumnFormStyles } from '@things-factory/form-ui'
 import { CommonGristStyles, ButtonContainerStyles } from '@operato/styles'
 import gql from 'graphql-tag'
-import { TermsUtil } from '../../utils/terms-util';
+import { TermsUtil } from '../../utils/terms-util'
 import { ValueUtil } from '../../utils/value-util'
 import { ServiceUtil } from '../../utils/service-util'
-import { MetaApi } from "../../utils/meta-api"
-import { MetaUiUtil } from "../../utils/meta-ui-util"
+import { MetaApi } from '../../utils/meta-api'
+import { MetaUiUtil } from '../../utils/meta-ui-util'
 import { isMobileDevice } from '@operato/utils'
 import { closePopup } from '@operato/popup'
 
@@ -84,7 +86,7 @@ class FileUploadPopup extends LitElement {
       </div>
 
       <div class="button-container">
-        <mwc-button raised @click="${this._createAttachment}" label="${TermsUtil.tButton('create')}"></mwc-button>
+        <md-elevated-button @click=${this._createAttachment}>${TermsUtil.tButton('create')}</md-elevated-button>
       </div>
     `
   }

package/client/component/popup/meta-object-selector-popup.js

@@ -1,6 +1,8 @@
+import '@material/web/button/elevated-button.js'
+
 import { css, html, LitElement } from 'lit'
 import { CommonGristStyles, ButtonContainerStyles } from '@operato/styles'
-import { TermsUtil } from '../../utils/terms-util';
+import { TermsUtil } from '../../utils/terms-util'
 import { ValueUtil } from '../../utils/value-util'
 import { ServiceUtil } from '../../utils/service-util'
 import { MetaApi } from '../../utils/meta-api'
@@ -8,7 +10,6 @@ import { MetaUiUtil } from '../../utils/meta-ui-util'
 import { isMobileDevice } from '@operato/utils'
 import { closePopup } from '@operato/popup'
 
-
 export class MetaObjectSelectorPopup extends LitElement {
   static styles = [
     CommonGristStyles,
@@ -36,16 +37,13 @@ export class MetaObjectSelectorPopup extends LitElement {
   ]
 
   async connectedCallback() {
-
     // 숨김 검색 조건
-    this.search_hidden_fields = this.options.filters 
-                              ? this.options.filters 
-                              : (this.basicArgs && this.basicArgs.filters ? this.basicArgs.filters : []);
+    this.search_hidden_fields = this.options.filters ? this.options.filters : this.basicArgs && this.basicArgs.filters ? this.basicArgs.filters : []
 
     this.search_hidden_fields = this.search_hidden_fields.map(x => {
-      let {name, operator, value} = x;
+      let { name, operator, value } = x
 
-      if(value.startsWith('::')) {
+      if (value.startsWith('::')) {
         value = ValueUtil.getParams(this.record, ...value.substring(2).split('.'))
       }
 
@@ -56,29 +54,27 @@ export class MetaObjectSelectorPopup extends LitElement {
       }
     })
 
+    // 기본 정렬
+    let sortFields = this.options.sorters ? this.options.sorters : this.basicArgs && this.basicArgs.sorters ? this.basicArgs.sorters : []
 
-    // 기본 정렬                          
-    let sortFields = this.options.sorters
-                  ? this.options.sorters 
-                  : (this.basicArgs && this.basicArgs.sorters ? this.basicArgs.sorters : []);
-
-                              
-    // 기본 검색 조건 
+    // 기본 검색 조건
     let filterFields = this.options.filterFields
-                     ? this.options.filterFields 
-                     : (this.options.menu_template?.search && this.options.menu_template?.search.length > 0 ? this.options.menu_template.search : []);
+      ? this.options.filterFields
+      : this.options.menu_template?.search && this.options.menu_template?.search.length > 0
+      ? this.options.menu_template.search
+      : []
 
-    // 그리드 컬럼                  
-    let gridColumns = this.options.select ;
+    // 그리드 컬럼
+    let gridColumns = this.options.select
 
     // 기본 검색 조건이 없으면 코드 (code-selector), 또는 이름 (object-selector)
-    if(!filterFields || filterFields.length == 0){
-      let defaultFilter = undefined;
-      
-      if(this.options.codeField) defaultFilter = this.options.codeField;
-      if(this.options.nameField) defaultFilter = this.options.nameField;
+    if (!filterFields || filterFields.length == 0) {
+      let defaultFilter = undefined
 
-      if(defaultFilter){
+      if (this.options.codeField) defaultFilter = this.options.codeField
+      if (this.options.nameField) defaultFilter = this.options.nameField
+
+      if (defaultFilter) {
         filterFields.push({
           name: defaultFilter,
           operator: 'eq'
@@ -86,97 +82,96 @@ export class MetaObjectSelectorPopup extends LitElement {
       }
     }
 
-    let selectFields = [...MetaApi.getGristGuttersConfig(true, false)];
+    let selectFields = [...MetaApi.getGristGuttersConfig(true, false)]
 
-    if(gridColumns && gridColumns.length > 0){
-      for(let idx = 0 ; idx < gridColumns.length; idx++){
+    if (gridColumns && gridColumns.length > 0) {
+      for (let idx = 0; idx < gridColumns.length; idx++) {
         let {
           type = 'string',
           name,
           hidden = false,
-          record = { align: 'left'},
+          record = { align: 'left' },
           header = undefined,
-          sortable= false,
-          width= 135,
+          sortable = false,
+          width = 135,
           options = undefined,
           select_opt = undefined,
           object_opt = undefined
-        } = gridColumns[idx];
+        } = gridColumns[idx]
 
-        if(select_opt) options = select_opt;
-        if(object_opt) options = object_opt;
+        if (select_opt) options = select_opt
+        if (object_opt) options = object_opt
 
-        if(['resource-object','object'].includes(type)){
-          type = 'meta-object-selector';
-        } else if (['resource-code-selector'].includes(type)){
-          type = 'meta-code-selector';
+        if (['resource-object', 'object'].includes(type)) {
+          type = 'meta-object-selector'
+        } else if (['resource-code-selector'].includes(type)) {
+          type = 'meta-code-selector'
         }
 
-        if(name == 'id'){
+        if (name == 'id') {
           selectFields.push({
             type: 'string',
             name: name,
             hidden: true
           })
         } else {
-          if(type == 'boolean-all'){
-            type = 'boolean';
+          if (type == 'boolean-all') {
+            type = 'boolean'
           }
 
-          let columnConfig =  MetaApi.getGristColumnConfig2(type, name, header?header:name, record.align ? record.align : 'left', false, sortable, width);
-
+          let columnConfig = MetaApi.getGristColumnConfig2(type, name, header ? header : name, record.align ? record.align : 'left', false, sortable, width)
 
-          if(type.startsWith('meta-') && object_opt && object_opt.menu){
-            options = await MetaUiUtil.getGristMetaObjectOptions(type, options);
+          if (type.startsWith('meta-') && object_opt && object_opt.menu) {
+            options = await MetaUiUtil.getGristMetaObjectOptions(type, options)
           }
 
-          if (type === 'select'){
+          if (type === 'select') {
             if (Array.isArray(options)) {
-              columnConfig.record.options = options;
+              columnConfig.record.options = options
             } else {
-              if (options.type === 'code') { // 공통 코드 
-                columnConfig.record.options = await ServiceUtil.getCodeSelectorData(options.values? options.values : options.name);
-              } else if (options.type === 'scenario') { // 시나리오
-                columnConfig.record.options = await ServiceUtil.getCodeByScenario(options.name, options.args);
-              } else if (options.type === 'entity'){ // 엔티티 
+              if (options.type === 'code') {
+                // 공통 코드
+                columnConfig.record.options = await ServiceUtil.getCodeSelectorData(options.values ? options.values : options.name)
+              } else if (options.type === 'scenario') {
+                // 시나리오
+                columnConfig.record.options = await ServiceUtil.getCodeByScenario(options.name, options.args)
+              } else if (options.type === 'entity') {
+                // 엔티티
                 columnConfig.record.options = await ServiceUtil.getCodeByEntity(options.args)
               }
             }
           } else if (type === 'meta-object-selector') {
             // object-option
-            columnConfig.record.options = {...options};
-
-          } else if( type == 'meta-code-selector'){
-            if(options.dispField){
-              options.codes = await ServiceUtil.getCodeByEntity(options);
+            columnConfig.record.options = { ...options }
+          } else if (type == 'meta-code-selector') {
+            if (options.dispField) {
+              options.codes = await ServiceUtil.getCodeByEntity(options)
             }
 
-            columnConfig.record.options = {...options};
+            columnConfig.record.options = { ...options }
           }
 
+          columnConfig.hidden = hidden
 
-          columnConfig.hidden = hidden;
-
-          selectFields.push(columnConfig);          
+          selectFields.push(columnConfig)
         }
       }
     } else {
-      selectFields.push(MetaApi.getGristColumnConfig2('string', this.options.codeField, this.options.codeField, 'left', false, true, 180));
+      selectFields.push(MetaApi.getGristColumnConfig2('string', this.options.codeField, this.options.codeField, 'left', false, true, 180))
 
-      if(this.options.dispField){
-        selectFields.push(MetaApi.getGristColumnConfig2('string', this.options.dispField, this.options.dispField, 'left', false, true, 300));
+      if (this.options.dispField) {
+        selectFields.push(MetaApi.getGristColumnConfig2('string', this.options.dispField, this.options.dispField, 'left', false, true, 300))
       }
     }
 
-    selectFields.forEach(x=>{
-      let filters = filterFields.filter(y => typeof y === 'string' ? x.name == y : x.name == y.name);
+    selectFields.forEach(x => {
+      let filters = filterFields.filter(y => (typeof y === 'string' ? x.name == y : x.name == y.name))
 
-      if(filters && filters.length > 0 ){
-        x.filter = typeof filters[0] === 'string' ? 'search' : filters[0];
+      if (filters && filters.length > 0) {
+        x.filter = typeof filters[0] === 'string' ? 'search' : filters[0]
       }
     })
 
-
     let gridConfig = {
       rows: MetaApi.getGristSelectableConfig(false),
       pagination: MetaApi.getGristPagination100Config(),
@@ -184,28 +179,27 @@ export class MetaObjectSelectorPopup extends LitElement {
       sorters: [...sortFields]
     }
 
-    gridConfig.rows.handlers = { 
+    gridConfig.rows.handlers = {
       click: 'select-row-toggle',
-      dblclick: ((columns, data, column, record, rowIndex, field) => {
+      dblclick: (columns, data, column, record, rowIndex, field) => {
         this.selectRecord(record)
-      })
-    } 
+      }
+    }
 
-    gridConfig.rows.appendable = false;  
+    gridConfig.rows.appendable = false
 
-    this.gridConfig = gridConfig;
+    this.gridConfig = gridConfig
 
-    await super.connectedCallback();
+    await super.connectedCallback()
   }
 
-  async firstUpdated(){
-    await super.firstUpdated();
+  async firstUpdated() {
+    await super.firstUpdated()
   }
 
-  render(){
+  render() {
     return html`
-      <ox-grist id="ox-grist" .config=${this.gridConfig} .mode=${isMobileDevice() ? 'LIST' : 'GRID'} auto-fetch
-        .fetchHandler=${this.fetchHandler.bind(this)}>
+      <ox-grist id="ox-grist" .config=${this.gridConfig} .mode=${isMobileDevice() ? 'LIST' : 'GRID'} auto-fetch .fetchHandler=${this.fetchHandler.bind(this)}>
         <div slot="headroom">
           <div id="filters">
             <ox-filters-form></ox-filters-form>
@@ -213,102 +207,93 @@ export class MetaObjectSelectorPopup extends LitElement {
         </div>
       </ox-grist>
       <div id="button-container" class="button-container">
-        <mwc-button raised label="${TermsUtil.tButton('empty')}" style="margin-left:7px;margin-top:7px;"
-          @click=${this.clickEmpty.bind(this)}>
-        </mwc-button>
-        <mwc-button raised label="${TermsUtil.tButton('cancel')}" style="margin-left:7px;margin-top:7px;"
-          @click=${this.clickCancel.bind(this)}>
-        </mwc-button>
-        <mwc-button raised label="${TermsUtil.tButton('select')}" style="margin-left:7px;margin-top:7px;"
-          @click=${this.clickSelect.bind(this)}>
-        </mwc-button>
+        <md-elevated-button style="margin-left:7px;margin-top:7px;" @click=${this.clickEmpty.bind(this)}> ${TermsUtil.tButton('empty')} </md-elevated-button>
+        <md-elevated-button style="margin-left:7px;margin-top:7px;" @click=${this.clickCancel.bind(this)}> ${TermsUtil.tButton('cancel')} </md-elevated-button>
+        <md-elevated-button style="margin-left:7px;margin-top:7px;" @click=${this.clickSelect.bind(this)}> ${TermsUtil.tButton('select')} </md-elevated-button>
       </div>
     `
   }
 
-
   /**
    * @description 그리드 리턴
    **************************
    * @returns {Object} 그리드
    */
-   get grist() {
+  get grist() {
     return this.shadowRoot.querySelector('#ox-grist')
   }
 
   /**
-   * @description 컬럼 조회 
+   * @description 컬럼 조회
    ***************************
-   * @returns 
+   * @returns
    */
-  async fetchHandler({ page= 0, limit= 0, sorters= [], filters= [] }) {
+  async fetchHandler({ page = 0, limit = 0, sorters = [], filters = [] }) {
+    let resFilter = [...this.search_hidden_fields]
 
-    let resFilter = [...this.search_hidden_fields];
-
-    filters.forEach(x=>{
-      let dupFilter = resFilter.filter(y=> x.name == y.name)
-      if(dupFilter && dupFilter.length > 0){
-        delete resFilter[x.name];
+    filters.forEach(x => {
+      let dupFilter = resFilter.filter(y => x.name == y.name)
+      if (dupFilter && dupFilter.length > 0) {
+        delete resFilter[x.name]
       }
 
-      resFilter.push(x);
+      resFilter.push(x)
     })
 
-
-    let queryAfterSetFields = ValueUtil.getParams((this.options.menu_template ? this.options.menu_template.gql||{} : {}), 'query', 'after_set_fields');
+    let queryAfterSetFields = ValueUtil.getParams(this.options.menu_template ? this.options.menu_template.gql || {} : {}, 'query', 'after_set_fields')
     let selectSkipFields = Object.keys(queryAfterSetFields || {})
 
     // 조회 컬럼 추출 후 조회
     let selectFields = MetaApi.getSelectColumns(this.gridConfig.columns.filter(x => !selectSkipFields.includes(x.name)))
 
-    // 조회 실행 
+    // 조회 실행
     let result = await MetaApi.searchByPagination(this.options.queryName, resFilter, sorters, page, limit, selectFields)
 
-    return result;
-  }  
+    return result
+  }
 
   /**
    * @description 비우기
    ***************************
-   * @returns 
+   * @returns
    */
-  async clickEmpty(e){
+  async clickEmpty(e) {
     this.confirmCallback && this.confirmCallback(null)
     closePopup(this)
   }
   /**
-   * @description 취소 
+   * @description 취소
    ***************************
-   * @returns 
+   * @returns
    */
-  async clickCancel(e){
+  async clickCancel(e) {
     closePopup(this)
   }
   /**
-   * @description 선택 
+   * @description 선택
    ***************************
-   * @returns 
+   * @returns
    */
-  async clickSelect(e){
-    let selected = this.grist.selected;
+  async clickSelect(e) {
+    let selected = this.grist.selected
 
-    if(!selected || selected.length == 0){
-      MetaApi.showToast('info', TermsUtil.tText('NOTHING_SELECTED'));
-      return;
+    if (!selected || selected.length == 0) {
+      MetaApi.showToast('info', TermsUtil.tText('NOTHING_SELECTED'))
+      return
     }
 
-    this.selectRecord(selected[0]);
+    this.selectRecord(selected[0])
   }
 
   /**
-   * @description 확정  
+   * @description 확정
    ***************************
-   * @param {*} record 
+   * @param {*} record
    */
-  async selectRecord(record){
+  async selectRecord(record) {
     this.confirmCallback && this.confirmCallback(record)
     closePopup(this)
   }
 }
-  
-customElements.define('meta-object-selector-popup', MetaObjectSelectorPopup)
+
+customElements.define('meta-object-selector-popup', MetaObjectSelectorPopup)