@digital-realty/ix-account-switcher - npm Package Compare versions

Comparing version 1.1.13-alpha-245271-t51.0 to 1.1.13-alpha-246374-t51.0

dist/ix-account-switcher.js

@@ -12,3 +12,3 @@ import { css } from 'lit';
       :host {
-        --md-theme-primary: var(--ix-sys-primary, blue);
+        --md-theme-primary: var(--clr-primary, blue);
       }
@@ -15,0 +15,0 @@ `,

dist/ix-account-switcher.min.js

@@ -1,1 +0,1 @@
-import{LitElement,html,nothing,css}from"lit";import{elementTheme}from"@digital-realty/theme";import{__decorate}from"tslib";import"@digital-realty/ix-dialog/ix-dialog.js";import"@digital-realty/ix-field/ix-field.js";import"@digital-realty/ix-icon-button/ix-icon-button.js";import"@digital-realty/ix-label-tag/ix-label-tag.js";import"@digital-realty/ix-select/ix-select.js";import"@digital-realty/ix-select/ix-select-option.js";import"@digital-realty/ix-tree/ix-tree.js";import{property,state}from"lit/decorators.js";import{makeAutoObservable}from"mobx";import{makePersistable,isHydrated,hydrateStore,clearPersistedStore,getPersistedStore}from"mobx-persist-store";let findAccountById=(t,e)=>{var i,r=t.find(t=>t.id===e);if(r)return r;for(i of t)if(i.subaccounts){var c=findAccountById(i.subaccounts,e);if(c)return c}return null},mapAccountToTreeNode=(t,e)=>{let i,r,c={expanded:!1,id:t.id,label:null!=(i=t.displayName)?i:t.name,parentId:e.id};return c.children=null==(r=t.subaccounts)?void 0:r.map(t=>mapAccountToTreeNode(t,c)),c},mapAccountsToTreeNode=t=>{let e={expanded:!1,id:"root",label:"",parentId:void 0};return e.children=t.map(t=>mapAccountToTreeNode(t,e)),e};class AuthedUserState{constructor(){this.account_number="",this.email="",this.name="",this.auth_time="",this.access_token="",this.id_token="",this.bearer="",this.account_hierarchy=void 0,makeAutoObservable(this),makePersistable(this,{name:"x-auth",properties:["email","account_number","name","auth_time","id_token","access_token","bearer","account_hierarchy"],storage:window.localStorage})}setAccount({accountNumber:t,email:e,name:i,authTime:r=(new Date).getTime().toString(),accessToken:c,idToken:o,bearer:s="Bearer"}){this.account_number=t,this.email=e,this.name=i,this.auth_time=r,this.access_token=c,this.id_token=o,this.bearer=s}getAccount(){return{accountNumber:this.account_number,email:this.email,name:this.name,authTime:this.auth_time}}getAccountNumber(){return this.account_number}getAccessToken(){return this.access_token}getBearer(){return this.bearer}getIdToken(){return this.id_token}setAccountHierarchy(t){this.account_hierarchy=t}getAccountHierarchy(){return this.account_hierarchy}get isHydrated(){return isHydrated(this)}async hydrateStore(){await hydrateStore(this)}async clearStoredDate(){await clearPersistedStore(this)}async getStoredData(){return getPersistedStore(this)}}let authedUser=new AuthedUserState,findAccountHierarchy=(t,c)=>{let o=(t,e)=>{var i,r;for(r of null!=t?t:[]){if(r.id===c)return r;if(0<(null!=(i=r.subaccounts)?i:[]).length)if(o(r.subaccounts))return r}return null};for(var e of t)if(o([e]))return e;return null},filters=["#","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];class IxAccountSwitcher extends LitElement{constructor(){super(...arguments),this.selectedAccountNumber="",this.accounts=[],this.disabled=!1,this.showDialog=!1,this.visibleAccounts=[],this.currentFilter="#",this.loading=!1,this.displayFilters=!1}updated(t){super.updated(t),t.has("accounts")&&(this.displayFilters=1e3<=this.accounts.length),(t.has("currentFilter")||t.has("accounts"))&&(authedUser.setAccountHierarchy(findAccountHierarchy(this.accounts,this.selectedAccountNumber)),this.filterVisibleAccounts())}filterVisibleAccounts(){this.loading=!0,this.displayFilters?this.visibleAccounts="#"===this.currentFilter?this.accounts.filter(t=>t.name.length&&!filters.includes(t.name[0].toUpperCase())):this.accounts.filter(t=>t.name.length&&t.name[0].toUpperCase().startsWith(this.currentFilter)):this.visibleAccounts=this.accounts,setTimeout(()=>{this.loading=!1},10)}renderTree(){return html`<ix-tree aria-label="Account Switcher" .rootNode="${mapAccountsToTreeNode(this.visibleAccounts)}" selectedNodeId="${this.selectedAccountNumber}" ?allowMultiline="${!0}" @on-tree-node-selected="${t=>{this.dispatchEvent(new CustomEvent("account-switched",{detail:t.detail.message.id,bubbles:!0,composed:!0})),this.showDialog=!1}}"></ix-tree>`}renderDialog(){return html`<ix-dialog id="account-switcher-dialog" ?open="${this.showDialog}" @closed="${()=>{this.showDialog=!1}}"><div class="headline" slot="headline"><span class="title">Switch Account</span><ix-icon-button @click="${()=>{this.showDialog=!1}}" icon="close"></ix-icon-button></div><form id="account-switcher-dialog-form" class="form" method="dialog" slot="content">${this.displayFilters?html`<div class="padded-container stick-to-top"><div>Filter accounts by:</div>${filters.map(e=>html`<span class="account-filter ${this.currentFilter===e?"active":""}" @click="${()=>{this.currentFilter=e}}" @keydown="${t=>{"Enter"!==t.key&&" "!==t.key||(this.currentFilter=e,t.preventDefault())}}">${e}</span>`)}</div>`:nothing} ${this.loading?html`<div class="padded-container">Loading...</div>`:this.renderTree()}</form></ix-dialog>`}getSelectedAccount(){return findAccountById(this.accounts,this.selectedAccountNumber)}renderNestedAccountStructureSelect(){var t,e=this.getSelectedAccount();return html`<ix-field ?disabled="${this.disabled}" @click="${()=>{this.disabled||(this.showDialog=!0)}}"><div class="subaccount-wrap"><span class="subaccount-name">${null!=(t=null==e?void 0:e.displayName)?t:null==e?void 0:e.name}</span><ix-icon class="dd-icon">arrow_drop_down</ix-icon></div></ix-field>`}renderFlatAccountStructureSelect(){let r=this.getSelectedAccount(),c=html`<ix-label-tag>Active</ix-label-tag>`;var t=this.accounts.map(t=>{var e,i=t.id===(null==r?void 0:r.id);return html`<ix-select-option value="${t.id}" .selected="${i}"><div slot="headline">${null!=(e=null==t?void 0:t.displayName)?e:t.name}</div><div slot="end">${i?c:nothing}</div></ix-select-option>`});return html`<div class="account-switcher__select"><ix-select ?disabled="${this.disabled}" @request-selection="${t=>{t=t.target;this.dispatchEvent(new CustomEvent("account-switched",{detail:t.value,bubbles:!0,composed:!0}))}}">${t}</ix-select></div>`}render(){var t=this.accounts.some(t=>t.subaccounts&&0<t.subaccounts.length);return html`<div class="account-switcher-container">${t?this.renderNestedAccountStructureSelect():this.renderFlatAccountStructureSelect()}</div>${t?this.renderDialog():null}`}}__decorate([property({type:String,reflect:!0})],IxAccountSwitcher.prototype,"selectedAccountNumber",void 0),__decorate([property({type:Array})],IxAccountSwitcher.prototype,"accounts",void 0),__decorate([property({type:Boolean})],IxAccountSwitcher.prototype,"disabled",void 0),__decorate([state()],IxAccountSwitcher.prototype,"showDialog",void 0),__decorate([state()],IxAccountSwitcher.prototype,"visibleAccounts",void 0),__decorate([state()],IxAccountSwitcher.prototype,"currentFilter",void 0),__decorate([state()],IxAccountSwitcher.prototype,"loading",void 0),__decorate([state()],IxAccountSwitcher.prototype,"displayFilters",void 0);let AccountSwitcherStyles=css`#account-switcher-dialog{position:relative;z-index:var(--ix-account-switcher-z-index,50)}.subaccount-wrap{display:flex;--ix-icon-font-size:1.6rem}.subaccount-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:0;flex:1}.dd-icon{margin:-2px -5px -5px 0}.headline{display:flex}.title{flex:1}.form{border:1px solid #e0e0e0;border-radius:.25rem;height:calc(488px - 3rem);margin:1rem 1.5rem 1.5rem 1.5rem;padding:0;width:calc(560px - 3rem);overflow:auto}.account-filter{cursor:pointer;padding:2px}.account-filter:hover{text-decoration:underline}.account-filter.active{text-decoration:underline;font-weight:700}.padded-container{padding:12px}.stick-to-top{position:sticky;top:0;background-color:#c8dffa;z-index:1}`;class IxAccountSwitcherStyled extends IxAccountSwitcher{}IxAccountSwitcherStyled.styles=[elementTheme,AccountSwitcherStyles,css`:host{--md-theme-primary:var(--ix-sys-primary, blue)}`],window.customElements.define("ix-account-switcher",IxAccountSwitcherStyled);export{IxAccountSwitcherStyled};
+import{LitElement,html,nothing,css}from"lit";import{elementTheme}from"@digital-realty/theme";import{__decorate}from"tslib";import"@digital-realty/ix-dialog/ix-dialog.js";import"@digital-realty/ix-field/ix-field.js";import"@digital-realty/ix-icon-button/ix-icon-button.js";import"@digital-realty/ix-label-tag/ix-label-tag.js";import"@digital-realty/ix-select/ix-select.js";import"@digital-realty/ix-select/ix-select-option.js";import"@digital-realty/ix-tree/ix-tree.js";import{property,state}from"lit/decorators.js";import{makeAutoObservable}from"mobx";import{makePersistable,isHydrated,hydrateStore,clearPersistedStore,getPersistedStore}from"mobx-persist-store";let findAccountById=(t,e)=>{var i,r=t.find(t=>t.id===e);if(r)return r;for(i of t)if(i.subaccounts){var c=findAccountById(i.subaccounts,e);if(c)return c}return null},mapAccountToTreeNode=(t,e)=>{let i,r,c={expanded:!1,id:t.id,label:null!=(i=t.displayName)?i:t.name,parentId:e.id};return c.children=null==(r=t.subaccounts)?void 0:r.map(t=>mapAccountToTreeNode(t,c)),c},mapAccountsToTreeNode=t=>{let e={expanded:!1,id:"root",label:"",parentId:void 0};return e.children=t.map(t=>mapAccountToTreeNode(t,e)),e};class AuthedUserState{constructor(){this.account_number="",this.email="",this.name="",this.auth_time="",this.access_token="",this.id_token="",this.bearer="",this.account_hierarchy=void 0,makeAutoObservable(this),makePersistable(this,{name:"x-auth",properties:["email","account_number","name","auth_time","id_token","access_token","bearer","account_hierarchy"],storage:window.localStorage})}setAccount({accountNumber:t,email:e,name:i,authTime:r=(new Date).getTime().toString(),accessToken:c,idToken:o,bearer:s="Bearer"}){this.account_number=t,this.email=e,this.name=i,this.auth_time=r,this.access_token=c,this.id_token=o,this.bearer=s}getAccount(){return{accountNumber:this.account_number,email:this.email,name:this.name,authTime:this.auth_time}}getAccountNumber(){return this.account_number}getAccessToken(){return this.access_token}getBearer(){return this.bearer}getIdToken(){return this.id_token}setAccountHierarchy(t){this.account_hierarchy=t}getAccountHierarchy(){return this.account_hierarchy}get isHydrated(){return isHydrated(this)}async hydrateStore(){await hydrateStore(this)}async clearStoredDate(){await clearPersistedStore(this)}async getStoredData(){return getPersistedStore(this)}}let authedUser=new AuthedUserState,findAccountHierarchy=(t,c)=>{let o=(t,e)=>{var i,r;for(r of null!=t?t:[]){if(r.id===c)return r;if(0<(null!=(i=r.subaccounts)?i:[]).length)if(o(r.subaccounts))return r}return null};for(var e of t)if(o([e]))return e;return null},filters=["#","A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];class IxAccountSwitcher extends LitElement{constructor(){super(...arguments),this.selectedAccountNumber="",this.accounts=[],this.disabled=!1,this.showDialog=!1,this.visibleAccounts=[],this.currentFilter="#",this.loading=!1,this.displayFilters=!1}updated(t){super.updated(t),t.has("accounts")&&(this.displayFilters=1e3<=this.accounts.length),(t.has("currentFilter")||t.has("accounts"))&&(authedUser.setAccountHierarchy(findAccountHierarchy(this.accounts,this.selectedAccountNumber)),this.filterVisibleAccounts())}filterVisibleAccounts(){this.loading=!0,this.displayFilters?this.visibleAccounts="#"===this.currentFilter?this.accounts.filter(t=>t.name.length&&!filters.includes(t.name[0].toUpperCase())):this.accounts.filter(t=>t.name.length&&t.name[0].toUpperCase().startsWith(this.currentFilter)):this.visibleAccounts=this.accounts,setTimeout(()=>{this.loading=!1},10)}renderTree(){return html`<ix-tree aria-label="Account Switcher" .rootNode="${mapAccountsToTreeNode(this.visibleAccounts)}" selectedNodeId="${this.selectedAccountNumber}" ?allowMultiline="${!0}" @on-tree-node-selected="${t=>{this.dispatchEvent(new CustomEvent("account-switched",{detail:t.detail.message.id,bubbles:!0,composed:!0})),this.showDialog=!1}}"></ix-tree>`}renderDialog(){return html`<ix-dialog id="account-switcher-dialog" ?open="${this.showDialog}" @closed="${()=>{this.showDialog=!1}}"><div class="headline" slot="headline"><span class="title">Switch Account</span><ix-icon-button @click="${()=>{this.showDialog=!1}}" icon="close"></ix-icon-button></div><form id="account-switcher-dialog-form" class="form" method="dialog" slot="content">${this.displayFilters?html`<div class="padded-container stick-to-top"><div>Filter accounts by:</div>${filters.map(e=>html`<span class="account-filter ${this.currentFilter===e?"active":""}" @click="${()=>{this.currentFilter=e}}" @keydown="${t=>{"Enter"!==t.key&&" "!==t.key||(this.currentFilter=e,t.preventDefault())}}">${e}</span>`)}</div>`:nothing} ${this.loading?html`<div class="padded-container">Loading...</div>`:this.renderTree()}</form></ix-dialog>`}getSelectedAccount(){return findAccountById(this.accounts,this.selectedAccountNumber)}renderNestedAccountStructureSelect(){var t,e=this.getSelectedAccount();return html`<ix-field ?disabled="${this.disabled}" @click="${()=>{this.disabled||(this.showDialog=!0)}}"><div class="subaccount-wrap"><span class="subaccount-name">${null!=(t=null==e?void 0:e.displayName)?t:null==e?void 0:e.name}</span><ix-icon class="dd-icon">arrow_drop_down</ix-icon></div></ix-field>`}renderFlatAccountStructureSelect(){let r=this.getSelectedAccount(),c=html`<ix-label-tag>Active</ix-label-tag>`;var t=this.accounts.map(t=>{var e,i=t.id===(null==r?void 0:r.id);return html`<ix-select-option value="${t.id}" .selected="${i}"><div slot="headline">${null!=(e=null==t?void 0:t.displayName)?e:t.name}</div><div slot="end">${i?c:nothing}</div></ix-select-option>`});return html`<div class="account-switcher__select"><ix-select ?disabled="${this.disabled}" @request-selection="${t=>{t=t.target;this.dispatchEvent(new CustomEvent("account-switched",{detail:t.value,bubbles:!0,composed:!0}))}}">${t}</ix-select></div>`}render(){var t=this.accounts.some(t=>t.subaccounts&&0<t.subaccounts.length);return html`<div class="account-switcher-container">${t?this.renderNestedAccountStructureSelect():this.renderFlatAccountStructureSelect()}</div>${t?this.renderDialog():null}`}}__decorate([property({type:String,reflect:!0})],IxAccountSwitcher.prototype,"selectedAccountNumber",void 0),__decorate([property({type:Array})],IxAccountSwitcher.prototype,"accounts",void 0),__decorate([property({type:Boolean})],IxAccountSwitcher.prototype,"disabled",void 0),__decorate([state()],IxAccountSwitcher.prototype,"showDialog",void 0),__decorate([state()],IxAccountSwitcher.prototype,"visibleAccounts",void 0),__decorate([state()],IxAccountSwitcher.prototype,"currentFilter",void 0),__decorate([state()],IxAccountSwitcher.prototype,"loading",void 0),__decorate([state()],IxAccountSwitcher.prototype,"displayFilters",void 0);let AccountSwitcherStyles=css`#account-switcher-dialog{position:relative;z-index:var(--ix-account-switcher-z-index,50)}.subaccount-wrap{display:flex;--ix-icon-font-size:1.6rem}.subaccount-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:0;flex:1}.dd-icon{margin:-2px -5px -5px 0}.headline{display:flex}.title{flex:1}.form{border:1px solid #e0e0e0;border-radius:.25rem;height:calc(488px - 3rem);margin:1rem 1.5rem 1.5rem 1.5rem;padding:0;width:calc(560px - 3rem);overflow:auto}.account-filter{cursor:pointer;padding:2px}.account-filter:hover{text-decoration:underline}.account-filter.active{text-decoration:underline;font-weight:700}.padded-container{padding:12px}.stick-to-top{position:sticky;top:0;background-color:#c8dffa;z-index:1}`;class IxAccountSwitcherStyled extends IxAccountSwitcher{}IxAccountSwitcherStyled.styles=[elementTheme,AccountSwitcherStyles,css`:host{--md-theme-primary:var(--clr-primary, blue)}`],window.customElements.define("ix-account-switcher",IxAccountSwitcherStyled);export{IxAccountSwitcherStyled};

package.json

@@ -6,3 +6,3 @@ {
   "author": "Digital Realty",
-  "version": "1.1.13-alpha-245271-t51.0",
+  "version": "1.1.13-alpha-246374-t51.0",
   "type": "module",
@@ -30,8 +30,8 @@ "main": "dist/index.js",
     "@adobe/lit-mobx": "^2.2.2",
-    "@digital-realty/ix-dialog": "^1.1.10",
+    "@digital-realty/ix-dialog": "^1.1.11-alpha-246374-t51.0",
     "@digital-realty/ix-field": "^1.1.3",
     "@digital-realty/ix-icon-button": "^1.1.3",
-    "@digital-realty/ix-label-tag": "^2.2.3",
-    "@digital-realty/ix-select": "^1.1.6",
-    "@digital-realty/ix-tree": "^3.1.7-alpha-245271-t51.0",
+    "@digital-realty/ix-label-tag": "^2.2.4-alpha-246374-t51.0",
+    "@digital-realty/ix-select": "^1.1.7-alpha-246374-t51.0",
+    "@digital-realty/ix-tree": "^3.1.7-alpha-246374-t51.0",
     "@digital-realty/theme": "^1.0.30",
@@ -111,3 +111,3 @@ "lit": "^2.8.0 || ^3.0.0",
   ],
-  "gitHead": "440bd58e53568a03c90729829643474c594d9bfe"
+  "gitHead": "a796f08349c6265d3e2389f3c6ffaad41ddd13d4"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

59617

increased by0.08%

Dependency changes

• + Added@digital-realty/ix-dialog@1.1.11-alpha-251841-t51.0(transitive)

• + Added@digital-realty/ix-label-tag@2.2.4-alpha-246443-t51.0(transitive)

• + Added@digital-realty/ix-select@1.1.7-alpha-251841-t51.0(transitive)

• - Removed@digital-realty/ix-dialog@1.1.10(transitive)

• - Removed@digital-realty/ix-label-tag@2.2.3(transitive)

• - Removed@digital-realty/ix-select@1.1.6(transitive)

• Updated@digital-realty/ix-dialog@^1.1.11-alpha-246374-t51.0

• Updated@digital-realty/ix-label-tag@^2.2.4-alpha-246374-t51.0

• Updated@digital-realty/ix-select@^1.1.7-alpha-246374-t51.0

• Updated@digital-realty/ix-tree@^3.1.7-alpha-246374-t51.0