@descope/web-components-ui 1.109.0 → 1.111.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/web-components-ui",
-  "version": "1.109.0",
+  "version": "1.111.0",
   "description": "",
   "main": "dist/cjs/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -75,22 +75,26 @@
     "libphonenumber-js": "^1.11.12",
     "lodash.debounce": "4.0.8",
     "lodash.merge": "4.6.2",
-    "@descope-ui/common": "0.0.17",
-    "@descope-ui/descope-button": "0.0.16",
-    "@descope-ui/descope-image": "0.0.9",
-    "@descope-ui/descope-icon": "0.0.15",
-    "@descope-ui/descope-text": "0.0.18",
-    "@descope-ui/descope-avatar": "0.0.18",
-    "@descope-ui/descope-combo-box": "0.1.8",
-    "@descope-ui/descope-autocomplete-field": "0.0.21",
-    "@descope-ui/descope-address-field": "0.0.20",
-    "@descope-ui/descope-timer": "0.0.15",
-    "@descope-ui/descope-timer-button": "0.0.17",
-    "@descope-ui/descope-password-strength": "0.0.12",
-    "@descope-ui/descope-collapsible-container": "0.0.16",
-    "@descope-ui/descope-recovery-codes": "0.0.5",
-    "@descope-ui/descope-link": "0.0.2",
-    "@descope-ui/descope-enriched-text": "0.0.2"
+    "@descope-ui/common": "0.0.18",
+    "@descope-ui/descope-button": "0.0.18",
+    "@descope-ui/descope-image": "0.0.10",
+    "@descope-ui/descope-icon": "0.0.17",
+    "@descope-ui/descope-text": "0.0.19",
+    "@descope-ui/descope-avatar": "0.0.19",
+    "@descope-ui/descope-combo-box": "0.1.9",
+    "@descope-ui/descope-autocomplete-field": "0.0.22",
+    "@descope-ui/descope-address-field": "0.0.21",
+    "@descope-ui/descope-timer": "0.0.17",
+    "@descope-ui/descope-timer-button": "0.0.19",
+    "@descope-ui/descope-list": "0.0.1",
+    "@descope-ui/descope-list-item": "0.0.1",
+    "@descope-ui/descope-apps-list": "0.0.1",
+    "@descope-ui/descope-outbound-apps": "0.0.1",
+    "@descope-ui/descope-password-strength": "0.0.13",
+    "@descope-ui/descope-collapsible-container": "0.0.18",
+    "@descope-ui/descope-recovery-codes": "0.0.6",
+    "@descope-ui/descope-link": "0.0.3",
+    "@descope-ui/descope-enriched-text": "0.0.3"
   },
   "overrides": {
     "@vaadin/avatar": "24.3.4",

package/src/components/descope-scopes-list/index.js

@@ -1,6 +1,7 @@
 import { componentName, ScopesListClass } from './ScopesListClass';
-import '../descope-list';
+import '@descope-ui/descope-list';
 import '../boolean-fields/descope-checkbox';
+import '../boolean-fields/descope-switch-toggle';
 
 customElements.define(componentName, ScopesListClass);
 

package/src/index.cjs.js

@@ -43,9 +43,6 @@ export { RadioGroupClass } from './components/descope-radio-group/RadioGroupClas
 export { RadioButtonClass } from './components/descope-radio-group/RadioButtonClass';
 export { DateFieldClass } from './components/descope-date-field/DateFieldClass';
 export { CalendarClass } from './components/descope-date-field/descope-calendar/CalendarClass';
-export { ListClass } from './components/descope-list/ListClass';
-export { ListItemClass } from './components/descope-list/ListItemClass';
-export { AppsListClass } from './components/descope-apps-list/AppsListClass';
 export { ScopesListClass } from './components/descope-scopes-list/ScopesListClass';
 export { ThirdPartyAppLogoClass } from './components/descope-third-party-app-logo/ThirdPartyAppLogoClass';
 export { SecurityQuestionsSetupClass } from './components/descope-security-questions-setup/SecurityQuestionsSetupClass';

package/src/index.js

@@ -34,8 +34,6 @@ export * from './components/mapping-fields/descope-saml-group-mappings';
 export * from './components/descope-policy-validation';
 export * from './components/descope-code-snippet';
 export * from './components/descope-radio-group';
-export * from './components/descope-list';
-export * from './components/descope-apps-list';
 export * from './components/descope-scopes-list';
 export * from './components/descope-third-party-app-logo';
 export * from './components/descope-security-questions-setup';

package/src/theme/components/index.js

@@ -43,9 +43,9 @@ import * as radioGroup from './radioGroup/radioGroup';
 import * as radioButton from './radioGroup/radioButton';
 import * as calendar from './calendar';
 import * as dateField from './dateField';
-import * as list from './list/list';
-import * as listItem from './list/listItem';
-import * as appsList from './appsList';
+import * as appsList from '@descope-ui/descope-apps-list/theme';
+import * as list from '@descope-ui/descope-list/theme';
+import * as listItem from '@descope-ui/descope-list-item/theme';
 import * as scopesList from './scopesList';
 import * as thirdPartyAppLogo from './thirdPartyAppLogo';
 import * as securityQuestionsSetup from './securityQuestionsSetup';
@@ -60,6 +60,7 @@ import * as timerButton from '@descope-ui/descope-timer-button/theme';
 import * as passwordStrength from '@descope-ui/descope-password-strength/theme';
 import * as collapsibleContainer from '@descope-ui/descope-collapsible-container/theme';
 import * as recoveryCodes from '@descope-ui/descope-recovery-codes/theme';
+import * as outboundApps from '@descope-ui/descope-outbound-apps/theme';
 
 const components = {
   button,
@@ -125,6 +126,7 @@ const components = {
   collapsibleContainer,
   recoveryCodes,
   hcaptcha,
+  outboundApps,
 };
 
 const theme = Object.keys(components).reduce(

package/dist/umd/descope-apps-list-index-js.js

@@ -1,2 +0,0 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[2272,2294,3057,7640],{18708:(t,e,n)=>{n.r(e),n.d(e,{ListClass:()=>h,componentName:()=>p});var o=n(79365),s=n(81365),i=n(9696),r=n(97810),a=n(25964);const l=(0,r.xE)("list-item"),d=(0,i.Zz)((0,o.RF)({mappings:{padding:{},backgroundColor:{},borderColor:{},borderStyle:{},borderWidth:{},borderRadius:{},outline:{},cursor:{},gap:{},maxWidth:{selector:()=>":host"},alignItems:{},flexDirection:{},transition:{}}}),o.VO,o.tQ,(t=>class extends t{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n      <slot></slot>\n    ",(0,a.fz)("\n      slot {\n          width: 100%;\n          display: flex;\n          overflow: hidden;\n          box-sizing: border-box;\n      }\n      :host {\n        display: block;\n      }\n        ",this)}}),(t=>class extends t{init(){super.init?.(),this.baseElement.addEventListener("mousedown",(t=>{t.preventDefault(),this.setAttribute("active","true"),window.addEventListener("mouseup",(()=>this.removeAttribute("active")),{once:!0})}))}}))((0,s.q)({componentName:l,baseSelector:"slot"})),p=(0,r.xE)("list");class c extends((0,s.q)({componentName:p,baseSelector:".wrapper"})){static get observedAttributes(){return["variant","readonly"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <div class="wrapper">\n    <slot></slot>\n    <slot name="empty-state">\n      No item...\n    </slot>\n    </div>\n\t',(0,a.fz)('\n    .wrapper {\n        overflow: auto;\n        display: grid;\n        max-height: 100%;\n        width: 100%;\n      }\n\n      :host {\n        display: inline-flex;\n        width: 100%;\n      }\n      slot[name="empty-state"] {\n        justify-content: center;\n        align-items: center;\n        display: flex;\n        flex-grow: 1;\n      }\n\n      :host slot[name="empty-state"] {\n        display: none;\n      }\n      :host([empty]) slot[name="empty-state"] {\n        display: flex;\n      }\n      ::slotted(:not([slot])) {\n        width: 100%;\n      }\n        ',this)}get items(){return this.shadowRoot.querySelector("slot").assignedElements()}#t(){0===this.items.length?this.setAttribute("empty","true"):this.removeAttribute("empty")}get variant(){return this.getAttribute("variant")||"list"}#e(){this.items.forEach((t=>{let e=t;e.localName!==d.componentName&&(e=t.querySelector(d.componentName));const n="tiles"===this.variant?"tile":"row";e.setAttribute("variant",n)}))}init(){super.init?.(),(0,r.Ge)(this,(()=>{this.#t(),this.#e(),this.#n()}))}get isReadOnly(){return"true"===this.getAttribute("readonly")}#n(){this.items.forEach((t=>{this.isReadOnly?t.setAttribute("inert",""):t.removeAttribute("inert")}))}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),n!==e&&("variant"===t?this.#e():"readonly"===t&&this.#n())}}const h=(0,i.Zz)((0,o.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},maxHeight:{selector:()=>":host"},minHeight:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],hostDirection:{selector:()=>":host",property:"direction"},fontFamily:{},gap:{},backgroundColor:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},boxShadow:{},gridTemplateColumns:{},maxItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"max-width"},minItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"min-width"},itemsHorizontalAlign:{selector:()=>"::slotted(*)",property:"justify-self"},emptyStateTextColor:{selector:()=>'slot[name="empty-state"]',property:"color"},emptyStateTextFontFamily:{selector:()=>'slot[name="empty-state"]',property:"font-family"}}}),o.VO,o.tQ)(c);customElements.define(p,h),customElements.define(l,d)},45503:(t,e,n)=>{n.r(e),n.d(e,{AppsListClass:()=>d,componentName:()=>l}),n(18708),n(53557),n(63595);var o=n(9696),s=n(97810),i=n(79365),r=n(72203),a=n(66434);const l=(0,s.xE)("apps-list"),d=(0,o.Zz)((0,i.RF)({mappings:{maxHeight:{selector:()=>":host"},minHeight:{selector:()=>":host"},hostDirection:{selector:()=>":host",property:"direction"},itemsFontWeight:{selector:a.s.componentName,property:a.s.cssVarList.fontWeight},itemsFontSize:{selector:a.s.componentName,property:a.s.cssVarList.fontSize},itemsTextAlign:{selector:a.s.componentName,property:a.s.cssVarList.textAlign}}}),(0,r.t)({itemRenderer:({name:t,icon:e,url:n},o,s)=>`\n  <a ${n?`href="${n}" title="${n}"`:""} target="_blank">\n    <descope-list-item>\n    <descope-avatar\n      ${e?`img="${e}"`:""}\n      ${t?`display-name="${t}" abbr=${((t,e=2)=>t.trim().split(" ").splice(0,e).map((t=>t[0]?.toUpperCase())).join(""))(t)}`:""}\n      size=${s.size}\n    ></descope-avatar>\n    <descope-text\n      variant="body1"\n      mode="primary"\n    >${t}</descope-text>\n    </descope-list-item>\n  </a>\n`,rerenderAttrsList:["size"]}),i.VO,i.tQ,(t=>class extends t{get size(){return this.getAttribute("size")||"sm"}}))((0,i.tz)({slots:["empty-state"],wrappedEleName:"descope-list",excludeAttrsSync:["tabindex","class","empty"],componentName:l,style:()=>`\n      :host {\n        width: 100%;\n        display: inline-flex;\n      }\n\n      descope-text::part(text-wrapper) {\n        display: -webkit-box;\n        -webkit-line-clamp: 2;\n        -webkit-box-orient: vertical;\n        overflow: hidden;\n      }\n\n      a {\n        text-decoration: none;\n      }\n\n      descope-text {\n        ${a.s.cssVarList.hostDirection}: var(${d.cssVarList.hostDirection});\n      }\n    `}));customElements.define(l,d)},53557:(t,e,n)=>{n.r(e),n.d(e,{AvatarClass:()=>h,componentName:()=>a});var o=n(88961),s=n(72270),i=n(63200),r=n(25964);const a=(0,r.xE)("avatar");class l extends((0,s.qu)({componentName:a,baseSelector:":host > .wrapper"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n      <div class="wrapper">\n        <vaadin-avatar></vaadin-avatar>\n        <div class="editableBadge">\n          <vaadin-icon icon="vaadin:pencil"></vaadin-icon>\n        </div>\n      </div>\n\t\t',(0,r.fz)("\n        :host {\n\t\t\t\t\tdisplay: inline-flex;\n\t\t\t\t}\n\n        .editableBadge {\n          border: 1px solid;\n          border-radius: 100%;\n          height: fit-content;\n          width: 25%;\n          height: 25%;\n          display: flex;\n          justify-content: center;\n          align-items: center;\n          padding: 5%;\n          box-sizing: border-box;\n          position: absolute;\n          bottom: 0;\n          inset-inline-end: 0;\n        }\n\n        vaadin-icon {\n          color: currentcolor;\n        }\n\n        vaadin-avatar {\n          width: 100%;\n          height: 100%;\n          margin: 0;\n          border: none\n        }\n\n        .wrapper {\n          display: inline-flex;\n          position: relative;\n          width: 100%;\n          height: 100%;\n        }\n    ",this),this.avatarComponent=this.shadowRoot.querySelector("vaadin-avatar"),(0,r.EA)(this,this.avatarComponent,{includeAttrs:["display-name","img","abbr"],mapAttrs:{"display-name":"name"}});const t=this.shadowRoot.querySelector(".editableBadge");(0,r.mx)(this,(()=>{t.style.display=this.isEditable?"":"none"}),{includeAttrs:["editable"]})}get isEditable(){return"true"===this.getAttribute("editable")}}const{host:d,editableBadge:p,avatar:c}={host:{selector:()=>":host"},editableBadge:{selector:"> .editableBadge"},avatar:{selector:"vaadin-avatar"}},h=(0,i.Zz)((0,o.RF)({mappings:{hostWidth:[{...d,property:"width"},{...d,property:"min-width"}],hostHeight:{...d,property:"height"},cursor:[c,d],hostDirection:{...d,property:"direction"},avatarTextColor:{...c,property:"color"},avatarBackgroundColor:{...c,property:"background-color"},editableIconColor:{...p,property:"color"},editableBorderColor:{...p,property:"border-color"},editableBackgroundColor:{...p,property:"background-color"}}}),o.VO,o.tQ)(l);n(4408),n(95260),n(37182),customElements.define(a,h)},63595:(t,e,n)=>{n.r(e),n.d(e,{TextClass:()=>o.s,componentName:()=>o.T});var o=n(66434);customElements.define(o.T,o.s)},66434:(t,e,n)=>{n.d(e,{T:()=>a,s:()=>p});var o=n(88961),s=n(63200),i=n(25964),r=n(72270);const a=(0,i.xE)("text");class l extends((0,r.qu)({componentName:a,baseSelector:":host > slot"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <slot part="text-wrapper"></slot>\n    ',(0,i.fz)("\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    ",this)}get hideWhenEmpty(){return"true"===this.getAttribute("hide-when-empty")}init(){super.init(),(0,i.Ge)(this,(()=>{const t=!!this.childNodes.length;this.style.display=!t&&this.hideWhenEmpty?"none":""}))}}const{host:d}={host:{selector:()=>":host"}},p=(0,s.Zz)((0,o.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},hostDirection:{selector:()=>":host",property:"direction"},fontSize:{},textColor:[{property:"color"}],textLineHeight:{property:"line-height"},textLetterSpacing:{property:"letter-spacing"},textShadow:{},textAlign:{},textTransform:{},fontFamily:{},fontStyle:{},fontWeight:{},borderWidth:{},borderStyle:{},borderColor:{}}}),o.VO,o.tQ)(l)},72203:(t,e,n)=>{n.d(e,{t:()=>r});var o=n(97810);const s=()=>!0,i=t=>`<pre>${JSON.stringify(t,null,4)}</pre>`,r=({itemRenderer:t=i,validateSchema:e=s,slotName:n,rerenderAttrsList:r=[]})=>s=>class extends s{#o=[];#s(t){if(!e)return!0;const n=e(t);return!0===n||(console.error("Data schema validation failed",n||""),!1)}#i(){const t=n?`*[slot="${n}"]`:":not([slot])";this.baseElement.querySelectorAll(t).forEach((t=>t.remove()))}#r(){this.#i(),this.data.forEach(((e,n)=>{const o="string"==typeof(s=t(e,n,this))?(t=>{const e=document.createElement("template");return e.innerHTML=t,e})(s).content:s instanceof HTMLTemplateElement?s.content:(console.error("Invalid template",s),null);var s;this.baseElement.appendChild(o?.cloneNode(!0))}))}set data(t){this.#s(t)&&(this.#o=t,this.#r())}get data(){return this.#o}init(){super.init?.(),(0,o.mx)(this,(t=>{t.includes("data")?this.#a():this.#r()}),{includeAttrs:[...r,"data"]})}#a(){const t=this.getAttribute("data");if(t)try{this.data=JSON.parse(t)}catch(e){console.warn("Invalid JSON data",t)}}}}}]);
-//# sourceMappingURL=descope-apps-list-index-js.js.map

package/dist/umd/descope-apps-list-index-js.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"descope-apps-list-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/./src/components/descope-list/ListItemClass.js","webpack://@descope/web-components-ui/./src/mixins/activableMixin.js","webpack://@descope/web-components-ui/./src/components/descope-list/ListClass.js","webpack://@descope/web-components-ui/./src/components/descope-list/index.js","webpack://@descope/web-components-ui/./src/components/descope-apps-list/AppsListClass.js","webpack://@descope/web-components-ui/./src/components/descope-apps-list/index.js","webpack://@descope/web-components-ui/../components/descope-avatar/src/component/AvatarClass.js","webpack://@descope/web-components-ui/../components/descope-avatar/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/index.js","webpack://@descope/web-components-ui/../components/descope-text/src/component/TextClass.js","webpack://@descope/web-components-ui/./src/mixins/createDynamicDataMixin.js"],"sourcesContent":["import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { createBaseClass } from '../../baseClasses/createBaseClass';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport { activeableMixin } from '../../mixins/activableMixin';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('list-item');\n\nconst customMixin = (superclass) =>\n  class ListItemMixinClass extends superclass {\n    constructor() {\n      super();\n\n      this.attachShadow({ mode: 'open' }).innerHTML = `\n      <slot></slot>\n    `;\n\n      injectStyle(\n        `\n      slot {\n          width: 100%;\n          display: flex;\n          overflow: hidden;\n          box-sizing: border-box;\n      }\n      :host {\n        display: block;\n      }\n        `,\n        this\n      );\n    }\n  };\n\nexport const ListItemClass = compose(\n  createStyleMixin({\n    mappings: {\n      padding: {},\n      backgroundColor: {},\n      borderColor: {},\n      borderStyle: {},\n      borderWidth: {},\n      borderRadius: {},\n      outline: {},\n      cursor: {},\n      gap: {},\n      maxWidth: { selector: () => ':host' },\n      alignItems: {},\n      flexDirection: {},\n      transition: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n  customMixin,\n  activeableMixin\n)(createBaseClass({ componentName, baseSelector: 'slot' }));\n","export const activeableMixin = (superclass) =>\n  class ActiveableMixinClass extends superclass {\n    init() {\n      super.init?.();\n\n      this.baseElement.addEventListener('mousedown', (e) => {\n        e.preventDefault();\n        this.setAttribute('active', 'true');\n        window.addEventListener('mouseup', () => this.removeAttribute('active'), {\n          once: true,\n        });\n      });\n    }\n  };\n","import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { createBaseClass } from '../../baseClasses/createBaseClass';\nimport { compose } from '../../helpers';\nimport { getComponentName, observeChildren } from '../../helpers/componentHelpers';\nimport { ListItemClass } from './ListItemClass';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('list');\n\nclass RawList extends createBaseClass({ componentName, baseSelector: '.wrapper' }) {\n  static get observedAttributes() {\n    return ['variant', 'readonly'];\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <div class=\"wrapper\">\n    <slot></slot>\n    <slot name=\"empty-state\">\n      No item...\n    </slot>\n    </div>\n\t`;\n\n    injectStyle(\n      `\n    .wrapper {\n        overflow: auto;\n        display: grid;\n        max-height: 100%;\n        width: 100%;\n      }\n\n      :host {\n        display: inline-flex;\n        width: 100%;\n      }\n      slot[name=\"empty-state\"] {\n        justify-content: center;\n        align-items: center;\n        display: flex;\n        flex-grow: 1;\n      }\n\n      :host slot[name=\"empty-state\"] {\n        display: none;\n      }\n      :host([empty]) slot[name=\"empty-state\"] {\n        display: flex;\n      }\n      ::slotted(:not([slot])) {\n        width: 100%;\n      }\n        `,\n      this\n    );\n  }\n\n  get items() {\n    return this.shadowRoot.querySelector('slot').assignedElements();\n  }\n\n  #handleEmptyState() {\n    if (this.items.length === 0) {\n      this.setAttribute('empty', 'true');\n    } else {\n      this.removeAttribute('empty');\n    }\n  }\n\n  get variant() {\n    return this.getAttribute('variant') || 'list';\n  }\n\n  #handleItemsVariant() {\n    this.items.forEach((item) => {\n      let listItem = item;\n      if (listItem.localName !== ListItemClass.componentName) {\n        listItem = item.querySelector(ListItemClass.componentName);\n      }\n\n      const listItemVariant = this.variant === 'tiles' ? 'tile' : 'row';\n      listItem.setAttribute('variant', listItemVariant);\n    });\n  }\n\n  init() {\n    super.init?.();\n\n    // we want new items to get the size\n    observeChildren(this, () => {\n      this.#handleEmptyState();\n      this.#handleItemsVariant();\n      this.#handleReadOnly();\n    });\n  }\n\n  get isReadOnly() {\n    return this.getAttribute('readonly') === 'true';\n  }\n\n  #handleReadOnly() {\n    this.items.forEach((item) => {\n      if (this.isReadOnly) item.setAttribute('inert', '');\n      else item.removeAttribute('inert');\n    });\n  }\n\n  attributeChangedCallback(name, oldValue, newValue) {\n    super.attributeChangedCallback?.(name, oldValue, newValue);\n\n    if (newValue === oldValue) return;\n\n    if (name === 'variant') {\n      this.#handleItemsVariant();\n    } else if (name === 'readonly') {\n      this.#handleReadOnly();\n    }\n  }\n}\n\nexport const ListClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      maxHeight: { selector: () => ':host' },\n      minHeight: {},\n      verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\n      horizontalPadding: [{ property: 'padding-left' }, { property: 'padding-right' }],\n      hostDirection: { selector: () => ':host', property: 'direction' },\n      fontFamily: {},\n      gap: {},\n\n      backgroundColor: {},\n      borderRadius: {},\n      borderColor: {},\n      borderStyle: {},\n      borderWidth: {},\n\n      boxShadow: {},\n      gridTemplateColumns: {},\n      maxItemsWidth: { selector: () => '::slotted(:not([slot]))', property: 'max-width' },\n      minItemsWidth: { selector: () => '::slotted(:not([slot]))', property: 'min-width' },\n      itemsHorizontalAlign: { selector: () => '::slotted(*)', property: 'justify-self' },\n      emptyStateTextColor: { selector: () => 'slot[name=\"empty-state\"]', property: 'color' },\n      emptyStateTextFontFamily: {\n        selector: () => 'slot[name=\"empty-state\"]',\n        property: 'font-family',\n      },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin\n)(RawList);\n","import { componentName as listComponentName, ListClass } from './ListClass';\nimport { componentName as listItemComponentName, ListItemClass } from './ListItemClass';\n\ncustomElements.define(listComponentName, ListClass);\ncustomElements.define(listItemComponentName, ListItemClass);\n\nexport { ListClass, listComponentName as componentName };\n","import { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport {\n  createStyleMixin,\n  draggableMixin,\n  createProxy,\n  componentNameValidationMixin,\n} from '../../mixins';\nimport { createDynamicDataMixin } from '../../mixins/createDynamicDataMixin';\nimport { TextClass } from '@descope-ui/descope-text/class';\n\nexport const componentName = getComponentName('apps-list');\n\nconst limitAbbreviation = (str, limit = 2) =>\n  str\n    .trim()\n    .split(' ')\n    .splice(0, limit)\n    .map((s) => s[0]?.toUpperCase())\n    .join('');\n\nconst itemRenderer = ({ name, icon, url }, _, ref) => `\n  <a ${url ? `href=\"${url}\" title=\"${url}\"` : ''} target=\"_blank\">\n    <descope-list-item>\n    <descope-avatar\n      ${icon ? `img=\"${icon}\"` : ''}\n      ${name ? `display-name=\"${name}\" abbr=${limitAbbreviation(name)}` : ''}\n      size=${ref.size}\n    ></descope-avatar>\n    <descope-text\n      variant=\"body1\"\n      mode=\"primary\"\n    >${name}</descope-text>\n    </descope-list-item>\n  </a>\n`;\n\nconst customMixin = (superclass) =>\n  class AppsListMixinClass extends superclass {\n    get size() {\n      return this.getAttribute('size') || 'sm';\n    }\n  };\n\nexport const AppsListClass = compose(\n  createStyleMixin({\n    mappings: {\n      maxHeight: { selector: () => ':host' },\n      minHeight: { selector: () => ':host' },\n      hostDirection: { selector: () => ':host', property: 'direction' },\n      itemsFontWeight: {\n        selector: TextClass.componentName,\n        property: TextClass.cssVarList.fontWeight,\n      },\n      itemsFontSize: {\n        selector: TextClass.componentName,\n        property: TextClass.cssVarList.fontSize,\n      },\n      itemsTextAlign: {\n        selector: TextClass.componentName,\n        property: TextClass.cssVarList.textAlign,\n      },\n    },\n  }),\n  createDynamicDataMixin({ itemRenderer, rerenderAttrsList: ['size'] }),\n  draggableMixin,\n  componentNameValidationMixin,\n  customMixin\n)(\n  createProxy({\n    slots: ['empty-state'],\n    wrappedEleName: 'descope-list',\n    excludeAttrsSync: ['tabindex', 'class', 'empty'],\n    componentName,\n    style: () => `\n      :host {\n        width: 100%;\n        display: inline-flex;\n      }\n\n      descope-text::part(text-wrapper) {\n        display: -webkit-box;\n        -webkit-line-clamp: 2;\n        -webkit-box-orient: vertical;\n        overflow: hidden;\n      }\n\n      a {\n        text-decoration: none;\n      }\n\n      descope-text {\n        ${TextClass.cssVarList.hostDirection}: var(${AppsListClass.cssVarList.hostDirection});\n      }\n    `,\n  })\n);\n","import '../descope-list';\nimport '@descope-ui/descope-avatar';\nimport '@descope-ui/descope-text';\nimport { componentName, AppsListClass } from './AppsListClass';\n\ncustomElements.define(componentName, AppsListClass);\n\nexport { AppsListClass, componentName };\n","import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  forwardAttrs,\n  getComponentName,\n  injectStyle,\n  observeAttributes,\n} from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('avatar');\nclass RawAvatar extends createBaseClass({\n  componentName,\n  baseSelector: ':host > .wrapper',\n}) {\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n      <div class=\"wrapper\">\n        <vaadin-avatar></vaadin-avatar>\n        <div class=\"editableBadge\">\n          <vaadin-icon icon=\"vaadin:pencil\"></vaadin-icon>\n        </div>\n      </div>\n\t\t`;\n\n    injectStyle(`\n        :host {\n\t\t\t\t\tdisplay: inline-flex;\n\t\t\t\t}\n\n        .editableBadge {\n          border: 1px solid;\n          border-radius: 100%;\n          height: fit-content;\n          width: 25%;\n          height: 25%;\n          display: flex;\n          justify-content: center;\n          align-items: center;\n          padding: 5%;\n          box-sizing: border-box;\n          position: absolute;\n          bottom: 0;\n          inset-inline-end: 0;\n        }\n\n        vaadin-icon {\n          color: currentcolor;\n        }\n\n        vaadin-avatar {\n          width: 100%;\n          height: 100%;\n          margin: 0;\n          border: none\n        }\n\n        .wrapper {\n          display: inline-flex;\n          position: relative;\n          width: 100%;\n          height: 100%;\n        }\n    `, this);\n\n    this.avatarComponent = this.shadowRoot.querySelector('vaadin-avatar');\n\n    forwardAttrs(this, this.avatarComponent, {\n      includeAttrs: ['display-name', 'img', 'abbr'],\n      mapAttrs: { 'display-name': 'name' },\n    });\n\n    const editableIcon = this.shadowRoot.querySelector('.editableBadge');\n\n    observeAttributes(\n      this,\n      () => {\n        editableIcon.style.display = this.isEditable ? '' : 'none';\n      },\n      { includeAttrs: ['editable'] },\n    );\n  }\n\n  get isEditable() {\n    return this.getAttribute('editable') === 'true';\n  }\n}\n\nconst { host, editableBadge, avatar } = {\n  host: { selector: () => ':host' },\n  editableBadge: { selector: '> .editableBadge' },\n  avatar: { selector: 'vaadin-avatar' },\n};\n\nexport const AvatarClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: [\n        { ...host, property: 'width' },\n        { ...host, property: 'min-width' },\n      ],\n      hostHeight: { ...host, property: 'height' },\n      cursor: [avatar, host],\n      hostDirection: { ...host, property: 'direction' },\n      avatarTextColor: { ...avatar, property: 'color' },\n      avatarBackgroundColor: { ...avatar, property: 'background-color' },\n      editableIconColor: { ...editableBadge, property: 'color' },\n      editableBorderColor: { ...editableBadge, property: 'border-color' },\n      editableBackgroundColor: {\n        ...editableBadge,\n        property: 'background-color',\n      },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawAvatar);\n","import { componentName, AvatarClass } from './AvatarClass';\nimport '@vaadin/avatar';\nimport '@vaadin/icon';\nimport '@vaadin/icons';\n\ncustomElements.define(componentName, AvatarClass);\n\nexport { AvatarClass, componentName };\n","import { componentName, TextClass } from './TextClass';\n\ncustomElements.define(componentName, TextClass);\n\nexport { TextClass, componentName };\n","import {\n  createStyleMixin,\n  draggableMixin,\n  componentNameValidationMixin,\n} from '@descope-ui/common/components-mixins';\nimport { compose } from '@descope-ui/common/utils';\nimport {\n  getComponentName,\n  injectStyle,\n  observeChildren,\n} from '@descope-ui/common/components-helpers';\nimport { createBaseClass } from '@descope-ui/common/base-classes';\n\nexport const componentName = getComponentName('text');\n\nclass RawText extends createBaseClass({\n  componentName,\n  baseSelector: ':host > slot',\n}) {\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <slot part=\"text-wrapper\"></slot>\n    `;\n\n    injectStyle(`\n      :host {\n        display: inline-block;\n        line-height: 1em;\n      }\n      :host > slot {\n        width: 100%;\n        display: inline-block;\n      }\n    `, this);\n  }\n\n  get hideWhenEmpty() {\n    return this.getAttribute('hide-when-empty') === 'true';\n  }\n\n  init() {\n    super.init();\n\n    observeChildren(this, () => {\n      const hasChildren = !!this.childNodes.length;\n      this.style.display = !hasChildren && this.hideWhenEmpty ? 'none' : '';\n    });\n  }\n}\n\nconst { host } = {\n  host: { selector: () => ':host' }\n}\n\nexport const TextClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      hostDirection: { selector: () => ':host', property: 'direction' },\n      fontSize: {},\n      textColor: [\n        { property: 'color' }\n      ],\n      textLineHeight: { property: 'line-height' },\n      textLetterSpacing: { property: 'letter-spacing' },\n      textShadow: {},\n      textAlign: {},\n      textTransform: {},\n      fontFamily: {},\n      fontStyle: {},\n      fontWeight: {},\n      borderWidth: {},\n      borderStyle: {},\n      borderColor: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n)(RawText);\n","import { observeAttributes } from '../helpers/componentHelpers';\n\nconst defaultValidateSchema = () => true;\nconst defaultItemRenderer = (item) => `<pre>${JSON.stringify(item, null, 4)}</pre>`;\n\nconst createTemplate = (templateString) => {\n  const template = document.createElement('template');\n  template.innerHTML = templateString;\n\n  return template;\n};\n\nconst getTemplateContent = (templateOrString) => {\n  if (typeof templateOrString === 'string') {\n    return createTemplate(templateOrString).content;\n  }\n\n  if (templateOrString instanceof HTMLTemplateElement) {\n    return templateOrString.content;\n  }\n\n  // eslint-disable-next-line no-console\n  console.error('Invalid template', templateOrString);\n  return null;\n};\n\nexport const createDynamicDataMixin =\n  ({\n    itemRenderer = defaultItemRenderer,\n    validateSchema = defaultValidateSchema,\n    slotName,\n    rerenderAttrsList = [],\n  }) =>\n  (superclass) =>\n    class DynamicDataMixinClass extends superclass {\n      #data = [];\n\n      // eslint-disable-next-line class-methods-use-this\n      #validateSchema(data) {\n        if (!validateSchema) return true;\n\n        const validation = validateSchema(data);\n        if (validation === true) return true;\n\n        // eslint-disable-next-line no-console\n        console.error('Data schema validation failed', validation || '');\n\n        return false;\n      }\n\n      #removeOldItems() {\n        const selector = slotName ? `*[slot=\"${slotName}\"]` : ':not([slot])';\n        this.baseElement.querySelectorAll(selector).forEach((item) => item.remove());\n      }\n\n      #renderItems() {\n        this.#removeOldItems();\n        this.data.forEach((item, index) => {\n          const content = getTemplateContent(itemRenderer(item, index, this));\n          this.baseElement.appendChild(content?.cloneNode(true));\n        });\n      }\n\n      set data(value) {\n        if (this.#validateSchema(value)) {\n          this.#data = value;\n          this.#renderItems();\n        }\n      }\n\n      get data() {\n        return this.#data;\n      }\n\n      init() {\n        super.init?.();\n\n        observeAttributes(\n          this,\n          (attrs) => {\n            if (attrs.includes('data')) this.#handleDataAttr();\n            else this.#renderItems();\n          },\n          { includeAttrs: [...rerenderAttrsList, 'data'] }\n        );\n      }\n\n      #handleDataAttr() {\n        const dataAttr = this.getAttribute('data');\n\n        if (!dataAttr) return;\n\n        try {\n          this.data = JSON.parse(dataAttr);\n        } catch (e) {\n          // eslint-disable-next-line no-console\n          console.warn('Invalid JSON data', dataAttr);\n        }\n      }\n    };\n"],"names":["componentName","ListItemClass","mappings","padding","backgroundColor","borderColor","borderStyle","borderWidth","borderRadius","outline","cursor","gap","maxWidth","selector","alignItems","flexDirection","transition","superclass","constructor","super","this","attachShadow","mode","innerHTML","init","baseElement","addEventListener","e","preventDefault","setAttribute","window","removeAttribute","once","createBaseClass","baseSelector","RawList","observedAttributes","items","shadowRoot","querySelector","assignedElements","length","variant","getAttribute","forEach","item","listItem","localName","listItemVariant","isReadOnly","attributeChangedCallback","name","oldValue","newValue","ListClass","hostWidth","property","maxHeight","minHeight","verticalPadding","horizontalPadding","hostDirection","fontFamily","boxShadow","gridTemplateColumns","maxItemsWidth","minItemsWidth","itemsHorizontalAlign","emptyStateTextColor","emptyStateTextFontFamily","customElements","define","AppsListClass","itemsFontWeight","TextClass","cssVarList","fontWeight","itemsFontSize","fontSize","itemsTextAlign","textAlign","createDynamicDataMixin","itemRenderer","icon","url","_","ref","str","limit","trim","split","splice","map","s","toUpperCase","join","limitAbbreviation","size","rerenderAttrsList","slots","wrappedEleName","excludeAttrsSync","style","RawAvatar","avatarComponent","includeAttrs","mapAttrs","editableIcon","display","isEditable","host","editableBadge","avatar","AvatarClass","hostHeight","avatarTextColor","avatarBackgroundColor","editableIconColor","editableBorderColor","editableBackgroundColor","RawText","hideWhenEmpty","hasChildren","childNodes","textColor","textLineHeight","textLetterSpacing","textShadow","textTransform","fontStyle","defaultValidateSchema","defaultItemRenderer","JSON","stringify","validateSchema","slotName","data","validation","console","error","querySelectorAll","remove","index","content","templateOrString","templateString","template","document","createElement","createTemplate","HTMLTemplateElement","appendChild","cloneNode","value","attrs","includes","dataAttr","parse","warn"],"sourceRoot":""}

package/dist/umd/descope-list-index-js.js

@@ -1,2 +0,0 @@
-"use strict";(self.webpackChunk_descope_web_components_ui=self.webpackChunk_descope_web_components_ui||[]).push([[7640],{18708:(t,e,n)=>{n.r(e),n.d(e,{ListClass:()=>m,componentName:()=>p});var o=n(79365),s=n(81365),i=n(9696),r=n(97810),a=n(25964);const l=(0,r.xE)("list-item"),d=(0,i.Zz)((0,o.RF)({mappings:{padding:{},backgroundColor:{},borderColor:{},borderStyle:{},borderWidth:{},borderRadius:{},outline:{},cursor:{},gap:{},maxWidth:{selector:()=>":host"},alignItems:{},flexDirection:{},transition:{}}}),o.VO,o.tQ,(t=>class extends t{constructor(){super(),this.attachShadow({mode:"open"}).innerHTML="\n      <slot></slot>\n    ",(0,a.fz)("\n      slot {\n          width: 100%;\n          display: flex;\n          overflow: hidden;\n          box-sizing: border-box;\n      }\n      :host {\n        display: block;\n      }\n        ",this)}}),(t=>class extends t{init(){super.init?.(),this.baseElement.addEventListener("mousedown",(t=>{t.preventDefault(),this.setAttribute("active","true"),window.addEventListener("mouseup",(()=>this.removeAttribute("active")),{once:!0})}))}}))((0,s.q)({componentName:l,baseSelector:"slot"})),p=(0,r.xE)("list");class h extends((0,s.q)({componentName:p,baseSelector:".wrapper"})){static get observedAttributes(){return["variant","readonly"]}constructor(){super(),this.attachShadow({mode:"open"}).innerHTML='\n    <div class="wrapper">\n    <slot></slot>\n    <slot name="empty-state">\n      No item...\n    </slot>\n    </div>\n\t',(0,a.fz)('\n    .wrapper {\n        overflow: auto;\n        display: grid;\n        max-height: 100%;\n        width: 100%;\n      }\n\n      :host {\n        display: inline-flex;\n        width: 100%;\n      }\n      slot[name="empty-state"] {\n        justify-content: center;\n        align-items: center;\n        display: flex;\n        flex-grow: 1;\n      }\n\n      :host slot[name="empty-state"] {\n        display: none;\n      }\n      :host([empty]) slot[name="empty-state"] {\n        display: flex;\n      }\n      ::slotted(:not([slot])) {\n        width: 100%;\n      }\n        ',this)}get items(){return this.shadowRoot.querySelector("slot").assignedElements()}#t(){0===this.items.length?this.setAttribute("empty","true"):this.removeAttribute("empty")}get variant(){return this.getAttribute("variant")||"list"}#e(){this.items.forEach((t=>{let e=t;e.localName!==d.componentName&&(e=t.querySelector(d.componentName));const n="tiles"===this.variant?"tile":"row";e.setAttribute("variant",n)}))}init(){super.init?.(),(0,r.Ge)(this,(()=>{this.#t(),this.#e(),this.#n()}))}get isReadOnly(){return"true"===this.getAttribute("readonly")}#n(){this.items.forEach((t=>{this.isReadOnly?t.setAttribute("inert",""):t.removeAttribute("inert")}))}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),n!==e&&("variant"===t?this.#e():"readonly"===t&&this.#n())}}const m=(0,i.Zz)((0,o.RF)({mappings:{hostWidth:{selector:()=>":host",property:"width"},maxHeight:{selector:()=>":host"},minHeight:{},verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}],hostDirection:{selector:()=>":host",property:"direction"},fontFamily:{},gap:{},backgroundColor:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},boxShadow:{},gridTemplateColumns:{},maxItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"max-width"},minItemsWidth:{selector:()=>"::slotted(:not([slot]))",property:"min-width"},itemsHorizontalAlign:{selector:()=>"::slotted(*)",property:"justify-self"},emptyStateTextColor:{selector:()=>'slot[name="empty-state"]',property:"color"},emptyStateTextFontFamily:{selector:()=>'slot[name="empty-state"]',property:"font-family"}}}),o.VO,o.tQ)(h);customElements.define(p,m),customElements.define(l,d)}}]);
-//# sourceMappingURL=descope-list-index-js.js.map

package/dist/umd/descope-list-index-js.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"descope-list-index-js.js","mappings":"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","sources":["webpack://@descope/web-components-ui/./src/components/descope-list/ListItemClass.js","webpack://@descope/web-components-ui/./src/mixins/activableMixin.js","webpack://@descope/web-components-ui/./src/components/descope-list/ListClass.js","webpack://@descope/web-components-ui/./src/components/descope-list/index.js"],"sourcesContent":["import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { createBaseClass } from '../../baseClasses/createBaseClass';\nimport { compose } from '../../helpers';\nimport { getComponentName } from '../../helpers/componentHelpers';\nimport { activeableMixin } from '../../mixins/activableMixin';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('list-item');\n\nconst customMixin = (superclass) =>\n  class ListItemMixinClass extends superclass {\n    constructor() {\n      super();\n\n      this.attachShadow({ mode: 'open' }).innerHTML = `\n      <slot></slot>\n    `;\n\n      injectStyle(\n        `\n      slot {\n          width: 100%;\n          display: flex;\n          overflow: hidden;\n          box-sizing: border-box;\n      }\n      :host {\n        display: block;\n      }\n        `,\n        this\n      );\n    }\n  };\n\nexport const ListItemClass = compose(\n  createStyleMixin({\n    mappings: {\n      padding: {},\n      backgroundColor: {},\n      borderColor: {},\n      borderStyle: {},\n      borderWidth: {},\n      borderRadius: {},\n      outline: {},\n      cursor: {},\n      gap: {},\n      maxWidth: { selector: () => ':host' },\n      alignItems: {},\n      flexDirection: {},\n      transition: {},\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin,\n  customMixin,\n  activeableMixin\n)(createBaseClass({ componentName, baseSelector: 'slot' }));\n","export const activeableMixin = (superclass) =>\n  class ActiveableMixinClass extends superclass {\n    init() {\n      super.init?.();\n\n      this.baseElement.addEventListener('mousedown', (e) => {\n        e.preventDefault();\n        this.setAttribute('active', 'true');\n        window.addEventListener('mouseup', () => this.removeAttribute('active'), {\n          once: true,\n        });\n      });\n    }\n  };\n","import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';\nimport { createBaseClass } from '../../baseClasses/createBaseClass';\nimport { compose } from '../../helpers';\nimport { getComponentName, observeChildren } from '../../helpers/componentHelpers';\nimport { ListItemClass } from './ListItemClass';\nimport { injectStyle } from '@descope-ui/common/components-helpers';\n\nexport const componentName = getComponentName('list');\n\nclass RawList extends createBaseClass({ componentName, baseSelector: '.wrapper' }) {\n  static get observedAttributes() {\n    return ['variant', 'readonly'];\n  }\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' }).innerHTML = `\n    <div class=\"wrapper\">\n    <slot></slot>\n    <slot name=\"empty-state\">\n      No item...\n    </slot>\n    </div>\n\t`;\n\n    injectStyle(\n      `\n    .wrapper {\n        overflow: auto;\n        display: grid;\n        max-height: 100%;\n        width: 100%;\n      }\n\n      :host {\n        display: inline-flex;\n        width: 100%;\n      }\n      slot[name=\"empty-state\"] {\n        justify-content: center;\n        align-items: center;\n        display: flex;\n        flex-grow: 1;\n      }\n\n      :host slot[name=\"empty-state\"] {\n        display: none;\n      }\n      :host([empty]) slot[name=\"empty-state\"] {\n        display: flex;\n      }\n      ::slotted(:not([slot])) {\n        width: 100%;\n      }\n        `,\n      this\n    );\n  }\n\n  get items() {\n    return this.shadowRoot.querySelector('slot').assignedElements();\n  }\n\n  #handleEmptyState() {\n    if (this.items.length === 0) {\n      this.setAttribute('empty', 'true');\n    } else {\n      this.removeAttribute('empty');\n    }\n  }\n\n  get variant() {\n    return this.getAttribute('variant') || 'list';\n  }\n\n  #handleItemsVariant() {\n    this.items.forEach((item) => {\n      let listItem = item;\n      if (listItem.localName !== ListItemClass.componentName) {\n        listItem = item.querySelector(ListItemClass.componentName);\n      }\n\n      const listItemVariant = this.variant === 'tiles' ? 'tile' : 'row';\n      listItem.setAttribute('variant', listItemVariant);\n    });\n  }\n\n  init() {\n    super.init?.();\n\n    // we want new items to get the size\n    observeChildren(this, () => {\n      this.#handleEmptyState();\n      this.#handleItemsVariant();\n      this.#handleReadOnly();\n    });\n  }\n\n  get isReadOnly() {\n    return this.getAttribute('readonly') === 'true';\n  }\n\n  #handleReadOnly() {\n    this.items.forEach((item) => {\n      if (this.isReadOnly) item.setAttribute('inert', '');\n      else item.removeAttribute('inert');\n    });\n  }\n\n  attributeChangedCallback(name, oldValue, newValue) {\n    super.attributeChangedCallback?.(name, oldValue, newValue);\n\n    if (newValue === oldValue) return;\n\n    if (name === 'variant') {\n      this.#handleItemsVariant();\n    } else if (name === 'readonly') {\n      this.#handleReadOnly();\n    }\n  }\n}\n\nexport const ListClass = compose(\n  createStyleMixin({\n    mappings: {\n      hostWidth: { selector: () => ':host', property: 'width' },\n      maxHeight: { selector: () => ':host' },\n      minHeight: {},\n      verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],\n      horizontalPadding: [{ property: 'padding-left' }, { property: 'padding-right' }],\n      hostDirection: { selector: () => ':host', property: 'direction' },\n      fontFamily: {},\n      gap: {},\n\n      backgroundColor: {},\n      borderRadius: {},\n      borderColor: {},\n      borderStyle: {},\n      borderWidth: {},\n\n      boxShadow: {},\n      gridTemplateColumns: {},\n      maxItemsWidth: { selector: () => '::slotted(:not([slot]))', property: 'max-width' },\n      minItemsWidth: { selector: () => '::slotted(:not([slot]))', property: 'min-width' },\n      itemsHorizontalAlign: { selector: () => '::slotted(*)', property: 'justify-self' },\n      emptyStateTextColor: { selector: () => 'slot[name=\"empty-state\"]', property: 'color' },\n      emptyStateTextFontFamily: {\n        selector: () => 'slot[name=\"empty-state\"]',\n        property: 'font-family',\n      },\n    },\n  }),\n  draggableMixin,\n  componentNameValidationMixin\n)(RawList);\n","import { componentName as listComponentName, ListClass } from './ListClass';\nimport { componentName as listItemComponentName, ListItemClass } from './ListItemClass';\n\ncustomElements.define(listComponentName, ListClass);\ncustomElements.define(listItemComponentName, ListItemClass);\n\nexport { ListClass, listComponentName as componentName };\n"],"names":["componentName","ListItemClass","mappings","padding","backgroundColor","borderColor","borderStyle","borderWidth","borderRadius","outline","cursor","gap","maxWidth","selector","alignItems","flexDirection","transition","superclass","constructor","super","this","attachShadow","mode","innerHTML","init","baseElement","addEventListener","e","preventDefault","setAttribute","window","removeAttribute","once","createBaseClass","baseSelector","RawList","observedAttributes","items","shadowRoot","querySelector","assignedElements","length","variant","getAttribute","forEach","item","listItem","localName","listItemVariant","isReadOnly","attributeChangedCallback","name","oldValue","newValue","ListClass","hostWidth","property","maxHeight","minHeight","verticalPadding","horizontalPadding","hostDirection","fontFamily","boxShadow","gridTemplateColumns","maxItemsWidth","minItemsWidth","itemsHorizontalAlign","emptyStateTextColor","emptyStateTextFontFamily","customElements","define"],"sourceRoot":""}

package/src/components/descope-apps-list/AppsListClass.js

@@ -1,97 +0,0 @@
-import { compose } from '../../helpers';
-import { getComponentName } from '../../helpers/componentHelpers';
-import {
-  createStyleMixin,
-  draggableMixin,
-  createProxy,
-  componentNameValidationMixin,
-} from '../../mixins';
-import { createDynamicDataMixin } from '../../mixins/createDynamicDataMixin';
-import { TextClass } from '@descope-ui/descope-text/class';
-
-export const componentName = getComponentName('apps-list');
-
-const limitAbbreviation = (str, limit = 2) =>
-  str
-    .trim()
-    .split(' ')
-    .splice(0, limit)
-    .map((s) => s[0]?.toUpperCase())
-    .join('');
-
-const itemRenderer = ({ name, icon, url }, _, ref) => `
-  <a ${url ? `href="${url}" title="${url}"` : ''} target="_blank">
-    <descope-list-item>
-    <descope-avatar
-      ${icon ? `img="${icon}"` : ''}
-      ${name ? `display-name="${name}" abbr=${limitAbbreviation(name)}` : ''}
-      size=${ref.size}
-    ></descope-avatar>
-    <descope-text
-      variant="body1"
-      mode="primary"
-    >${name}</descope-text>
-    </descope-list-item>
-  </a>
-`;
-
-const customMixin = (superclass) =>
-  class AppsListMixinClass extends superclass {
-    get size() {
-      return this.getAttribute('size') || 'sm';
-    }
-  };
-
-export const AppsListClass = compose(
-  createStyleMixin({
-    mappings: {
-      maxHeight: { selector: () => ':host' },
-      minHeight: { selector: () => ':host' },
-      hostDirection: { selector: () => ':host', property: 'direction' },
-      itemsFontWeight: {
-        selector: TextClass.componentName,
-        property: TextClass.cssVarList.fontWeight,
-      },
-      itemsFontSize: {
-        selector: TextClass.componentName,
-        property: TextClass.cssVarList.fontSize,
-      },
-      itemsTextAlign: {
-        selector: TextClass.componentName,
-        property: TextClass.cssVarList.textAlign,
-      },
-    },
-  }),
-  createDynamicDataMixin({ itemRenderer, rerenderAttrsList: ['size'] }),
-  draggableMixin,
-  componentNameValidationMixin,
-  customMixin
-)(
-  createProxy({
-    slots: ['empty-state'],
-    wrappedEleName: 'descope-list',
-    excludeAttrsSync: ['tabindex', 'class', 'empty'],
-    componentName,
-    style: () => `
-      :host {
-        width: 100%;
-        display: inline-flex;
-      }
-
-      descope-text::part(text-wrapper) {
-        display: -webkit-box;
-        -webkit-line-clamp: 2;
-        -webkit-box-orient: vertical;
-        overflow: hidden;
-      }
-
-      a {
-        text-decoration: none;
-      }
-
-      descope-text {
-        ${TextClass.cssVarList.hostDirection}: var(${AppsListClass.cssVarList.hostDirection});
-      }
-    `,
-  })
-);

package/src/components/descope-apps-list/index.js

@@ -1,8 +0,0 @@
-import '../descope-list';
-import '@descope-ui/descope-avatar';
-import '@descope-ui/descope-text';
-import { componentName, AppsListClass } from './AppsListClass';
-
-customElements.define(componentName, AppsListClass);
-
-export { AppsListClass, componentName };

package/src/components/descope-list/ListClass.js

@@ -1,156 +0,0 @@
-import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';
-import { createBaseClass } from '../../baseClasses/createBaseClass';
-import { compose } from '../../helpers';
-import { getComponentName, observeChildren } from '../../helpers/componentHelpers';
-import { ListItemClass } from './ListItemClass';
-import { injectStyle } from '@descope-ui/common/components-helpers';
-
-export const componentName = getComponentName('list');
-
-class RawList extends createBaseClass({ componentName, baseSelector: '.wrapper' }) {
-  static get observedAttributes() {
-    return ['variant', 'readonly'];
-  }
-
-  constructor() {
-    super();
-
-    this.attachShadow({ mode: 'open' }).innerHTML = `
-    <div class="wrapper">
-    <slot></slot>
-    <slot name="empty-state">
-      No item...
-    </slot>
-    </div>
-	`;
-
-    injectStyle(
-      `
-    .wrapper {
-        overflow: auto;
-        display: grid;
-        max-height: 100%;
-        width: 100%;
-      }
-
-      :host {
-        display: inline-flex;
-        width: 100%;
-      }
-      slot[name="empty-state"] {
-        justify-content: center;
-        align-items: center;
-        display: flex;
-        flex-grow: 1;
-      }
-
-      :host slot[name="empty-state"] {
-        display: none;
-      }
-      :host([empty]) slot[name="empty-state"] {
-        display: flex;
-      }
-      ::slotted(:not([slot])) {
-        width: 100%;
-      }
-        `,
-      this
-    );
-  }
-
-  get items() {
-    return this.shadowRoot.querySelector('slot').assignedElements();
-  }
-
-  #handleEmptyState() {
-    if (this.items.length === 0) {
-      this.setAttribute('empty', 'true');
-    } else {
-      this.removeAttribute('empty');
-    }
-  }
-
-  get variant() {
-    return this.getAttribute('variant') || 'list';
-  }
-
-  #handleItemsVariant() {
-    this.items.forEach((item) => {
-      let listItem = item;
-      if (listItem.localName !== ListItemClass.componentName) {
-        listItem = item.querySelector(ListItemClass.componentName);
-      }
-
-      const listItemVariant = this.variant === 'tiles' ? 'tile' : 'row';
-      listItem.setAttribute('variant', listItemVariant);
-    });
-  }
-
-  init() {
-    super.init?.();
-
-    // we want new items to get the size
-    observeChildren(this, () => {
-      this.#handleEmptyState();
-      this.#handleItemsVariant();
-      this.#handleReadOnly();
-    });
-  }
-
-  get isReadOnly() {
-    return this.getAttribute('readonly') === 'true';
-  }
-
-  #handleReadOnly() {
-    this.items.forEach((item) => {
-      if (this.isReadOnly) item.setAttribute('inert', '');
-      else item.removeAttribute('inert');
-    });
-  }
-
-  attributeChangedCallback(name, oldValue, newValue) {
-    super.attributeChangedCallback?.(name, oldValue, newValue);
-
-    if (newValue === oldValue) return;
-
-    if (name === 'variant') {
-      this.#handleItemsVariant();
-    } else if (name === 'readonly') {
-      this.#handleReadOnly();
-    }
-  }
-}
-
-export const ListClass = compose(
-  createStyleMixin({
-    mappings: {
-      hostWidth: { selector: () => ':host', property: 'width' },
-      maxHeight: { selector: () => ':host' },
-      minHeight: {},
-      verticalPadding: [{ property: 'padding-top' }, { property: 'padding-bottom' }],
-      horizontalPadding: [{ property: 'padding-left' }, { property: 'padding-right' }],
-      hostDirection: { selector: () => ':host', property: 'direction' },
-      fontFamily: {},
-      gap: {},
-
-      backgroundColor: {},
-      borderRadius: {},
-      borderColor: {},
-      borderStyle: {},
-      borderWidth: {},
-
-      boxShadow: {},
-      gridTemplateColumns: {},
-      maxItemsWidth: { selector: () => '::slotted(:not([slot]))', property: 'max-width' },
-      minItemsWidth: { selector: () => '::slotted(:not([slot]))', property: 'min-width' },
-      itemsHorizontalAlign: { selector: () => '::slotted(*)', property: 'justify-self' },
-      emptyStateTextColor: { selector: () => 'slot[name="empty-state"]', property: 'color' },
-      emptyStateTextFontFamily: {
-        selector: () => 'slot[name="empty-state"]',
-        property: 'font-family',
-      },
-    },
-  }),
-  draggableMixin,
-  componentNameValidationMixin
-)(RawList);

package/src/components/descope-list/ListItemClass.js

@@ -1,58 +0,0 @@
-import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';
-import { createBaseClass } from '../../baseClasses/createBaseClass';
-import { compose } from '../../helpers';
-import { getComponentName } from '../../helpers/componentHelpers';
-import { activeableMixin } from '../../mixins/activableMixin';
-import { injectStyle } from '@descope-ui/common/components-helpers';
-
-export const componentName = getComponentName('list-item');
-
-const customMixin = (superclass) =>
-  class ListItemMixinClass extends superclass {
-    constructor() {
-      super();
-
-      this.attachShadow({ mode: 'open' }).innerHTML = `
-      <slot></slot>
-    `;
-
-      injectStyle(
-        `
-      slot {
-          width: 100%;
-          display: flex;
-          overflow: hidden;
-          box-sizing: border-box;
-      }
-      :host {
-        display: block;
-      }
-        `,
-        this
-      );
-    }
-  };
-
-export const ListItemClass = compose(
-  createStyleMixin({
-    mappings: {
-      padding: {},
-      backgroundColor: {},
-      borderColor: {},
-      borderStyle: {},
-      borderWidth: {},
-      borderRadius: {},
-      outline: {},
-      cursor: {},
-      gap: {},
-      maxWidth: { selector: () => ':host' },
-      alignItems: {},
-      flexDirection: {},
-      transition: {},
-    },
-  }),
-  draggableMixin,
-  componentNameValidationMixin,
-  customMixin,
-  activeableMixin
-)(createBaseClass({ componentName, baseSelector: 'slot' }));

package/src/components/descope-list/index.js

@@ -1,7 +0,0 @@
-import { componentName as listComponentName, ListClass } from './ListClass';
-import { componentName as listItemComponentName, ListItemClass } from './ListItemClass';
-
-customElements.define(listComponentName, ListClass);
-customElements.define(listItemComponentName, ListItemClass);
-
-export { ListClass, listComponentName as componentName };

package/src/theme/components/appsList.js

@@ -1,36 +0,0 @@
-import { AppsListClass } from '../../components/descope-apps-list/AppsListClass';
-import { getThemeRefs } from '../../helpers/themeHelpers';
-import globals from '../globals';
-
-export const vars = AppsListClass.cssVarList;
-const globalRefs = getThemeRefs(globals);
-
-const defaultHeight = '400px';
-
-const appsList = {
-  [vars.itemsFontWeight]: 'normal',
-  [vars.itemsTextAlign]: 'start',
-  [vars.hostDirection]: globalRefs.direction,
-  [vars.maxHeight]: defaultHeight,
-
-  _empty: {
-    [vars.minHeight]: defaultHeight,
-  },
-
-  size: {
-    xs: {
-      [vars.itemsFontSize]: '14px',
-    },
-    sm: {
-      [vars.itemsFontSize]: '14px',
-    },
-    md: {
-      [vars.itemsFontSize]: '16px',
-    },
-    lg: {
-      [vars.itemsFontSize]: '20px',
-    },
-  },
-};
-
-export default appsList;