@descope-ui/descope-outbound-apps 0.0.5 → 0.1.0

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.1.0](https://github.com/descope/web-components-ui/compare/@descope-ui/descope-outbound-apps-0.0.5...@descope-ui/descope-outbound-apps-0.1.0) (2025-09-02)
+
+### Dependency Updates
+
+* `e2e-utils` updated to version `0.1.0`
+* `@descope-ui/common` updated to version `0.1.0`
+* `@descope-ui/theme-globals` updated to version `0.0.20`
+* `@descope-ui/descope-list` updated to version `0.1.0`
+* `@descope-ui/descope-list-item` updated to version `0.1.0`
+* `@descope-ui/descope-text` updated to version `0.0.20`
+* `@descope-ui/descope-avatar` updated to version `0.1.0`
+* `@descope-ui/descope-icon` updated to version `0.0.18`
+* `@descope-ui/descope-button` updated to version `0.0.20`
+
+### Features
+
+* Trusted Devices ([#697](https://github.com/descope/web-components-ui/issues/697)) ([fb2f0eb](https://github.com/descope/web-components-ui/commit/fb2f0eb6773ed624354ed9f0b97d713bb8b10fce))
+
 ## [0.0.5](https://github.com/descope/web-components-ui/compare/@descope-ui/descope-outbound-apps-0.0.4...@descope-ui/descope-outbound-apps-0.0.5) (2025-08-06)
 
 ## [0.0.4](https://github.com/descope/web-components-ui/compare/@descope-ui/descope-outbound-apps-0.0.3...@descope-ui/descope-outbound-apps-0.0.4) (2025-07-22)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope-ui/descope-outbound-apps",
-  "version": "0.0.5",
+  "version": "0.1.0",
   "exports": {
     ".": {
       "import": "./src/component/index.js"
@@ -17,14 +17,14 @@
     "e2e-utils": "0.0.1"
   },
   "dependencies": {
-    "@descope-ui/common": "0.0.18",
-    "@descope-ui/theme-globals": "0.0.19",
-    "@descope-ui/descope-list": "0.0.1",
-    "@descope-ui/descope-list-item": "0.0.1",
-    "@descope-ui/descope-text": "0.0.19",
-    "@descope-ui/descope-avatar": "0.0.19",
-    "@descope-ui/descope-icon": "0.0.17",
-    "@descope-ui/descope-button": "0.0.19"
+    "@descope-ui/common": "0.1.0",
+    "@descope-ui/theme-globals": "0.0.20",
+    "@descope-ui/descope-list": "0.1.0",
+    "@descope-ui/descope-list-item": "0.1.0",
+    "@descope-ui/descope-text": "0.0.20",
+    "@descope-ui/descope-avatar": "0.1.0",
+    "@descope-ui/descope-icon": "0.0.18",
+    "@descope-ui/descope-button": "0.0.20"
   },
   "publishConfig": {
     "link-workspace-packages": false

package/src/component/OutboundAppsClass.js

@@ -1,5 +1,9 @@
 import { compose } from '@descope-ui/common/utils';
-import { limitAbbreviation, getComponentName, injectStyle } from '@descope-ui/common/components-helpers';
+import {
+  limitAbbreviation,
+  getComponentName,
+  injectStyle,
+} from '@descope-ui/common/components-helpers';
 import {
   createStyleMixin,
   draggableMixin,
@@ -9,7 +13,6 @@ import {
 import { createBaseClass } from '@descope-ui/common/base-classes';
 import { IconClass } from '@descope-ui/descope-icon/class';
 import { TextClass } from '@descope-ui/descope-text/class';
-import { AvatarClass } from '@descope-ui/descope-avatar/class';
 import { ListClass } from '@descope-ui/descope-list/class';
 import { ListItemClass } from '@descope-ui/descope-list-item/class';
 
@@ -51,11 +54,11 @@ const itemRenderer = (
     </div>
     <div class="controls">
       <descope-button variant="link" mode="primary" size=${ref.size} data-action="${action}" data-outbound-app-id="${appId}" data-id="${action}">
-        ${isConnected ? ref.disconnectButtonLabel : ref.connectButtonLabel }
+        ${isConnected ? ref.disconnectButtonLabel : ref.connectButtonLabel}
       </descope-button>
     </div>
   </descope-list-item>
-`
+`;
 };
 
 const BaseClass = createBaseClass({
@@ -99,7 +102,7 @@ class RawOutboundAppsClass extends BaseClass {
         display: block;
       }
       `,
-      this
+      this,
     );
   }
 
@@ -120,7 +123,12 @@ class RawOutboundAppsClass extends BaseClass {
       const id = e.srcElement.getAttribute('data-outbound-app-id');
       const action = e.srcElement.getAttribute('data-action');
       if (id && action) {
-        this.dispatchEvent(new CustomEvent(`${action}-clicked`, { bubbles: true, detail: { id, action } }));
+        this.dispatchEvent(
+          new CustomEvent(`${action}-clicked`, {
+            bubbles: true,
+            detail: { id, action },
+          }),
+        );
       }
     }
   }
@@ -151,26 +159,32 @@ export const OutboundAppsClass = compose(
         { ...host, property: 'direction' },
         {
           selector: 'descope-list',
-          property: 'direction'
+          property: 'direction',
         },
         {
           selector: 'descope-list-item',
-          property: 'direction'
+          property: 'direction',
         },
       ],
-      iconColor: { selector: () => ' descope-icon', property: IconClass.cssVarList.fill },
-      errorIconColor: { selector: () => ' descope-icon.error-icon', property: IconClass.cssVarList.fill },
+      iconColor: {
+        selector: () => ' descope-icon',
+        property: IconClass.cssVarList.fill,
+      },
+      errorIconColor: {
+        selector: () => ' descope-icon.error-icon',
+        property: IconClass.cssVarList.fill,
+      },
       fontSize: {
         selector: TextClass.componentName,
         property: TextClass.cssVarList.fontSize,
       },
       appLogoGap: {
         selector: () => ' .app-logo',
-        property: 'margin-inline-end'
+        property: 'margin-inline-end',
       },
       contentGap: {
         selector: () => ' .content',
-        property: 'gap'
+        property: 'gap',
       },
       itemsTextAlign: {
         selector: TextClass.componentName,
@@ -178,45 +192,48 @@ export const OutboundAppsClass = compose(
       },
       itemCursor: {
         selector: ListItemClass.componentName,
-        property: ListItemClass.cssVarList.cursor
+        property: ListItemClass.cssVarList.cursor,
       },
       itemOutline: {
         selector: ListItemClass.componentName,
-        property: ListItemClass.cssVarList.outline
+        property: ListItemClass.cssVarList.outline,
       },
       itemBorderColor: {
         selector: ListItemClass.componentName,
-        property: ListItemClass.cssVarList.borderColor
+        property: ListItemClass.cssVarList.borderColor,
       },
       itemBackgroundColor: {
         selector: ListItemClass.componentName,
-        property: ListItemClass.cssVarList.backgroundColor
+        property: ListItemClass.cssVarList.backgroundColor,
       },
       listBorderWidth: {
         selector: () => ListClass.componentName,
-        property: ListClass.cssVarList.borderWidth
+        property: ListClass.cssVarList.borderWidth,
       },
       listBoxShadow: {
         selector: () => ListClass.componentName,
-        property: ListClass.cssVarList.boxShadow
+        property: ListClass.cssVarList.boxShadow,
       },
       listPadding: [
         {
           selector: () => ListClass.componentName,
-          property: ListClass.cssVarList.verticalPadding
+          property: ListClass.cssVarList.verticalPadding,
         },
         {
           selector: () => ListClass.componentName,
-          property: ListClass.cssVarList.horizontalPadding
-        }
-      ]
+          property: ListClass.cssVarList.horizontalPadding,
+        },
+      ],
     },
   }),
   draggableMixin,
-  createDynamicDataMixin({ itemRenderer, rerenderAttrsList: [
-    'size',
-    'connect-button-label',
-    'disconnect-button-label'
-  ]}),
+  createDynamicDataMixin({
+    itemRenderer,
+    rerenderAttrsList: [
+      'size',
+      'connect-button-label',
+      'disconnect-button-label',
+    ],
+  }),
   componentNameValidationMixin,
 )(RawOutboundAppsClass);