@descope/web-components-ui 1.0.426 → 1.0.428

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/web-components-ui",
-  "version": "1.0.426",
+  "version": "1.0.428",
   "description": "",
   "main": "dist/cjs/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -60,14 +60,6 @@
     "test-drivers": "0.0.1",
     "webpack-replace-plugin": "0.0.1"
   },
-  "bundledDependencies": [
-    "common",
-    "theme-globals",
-    "theme-input-wrapper",
-    "descope-text",
-    "descope-avatar",
-    "descope-combo-box"
-  ],
   "dependencies": {
     "@vaadin/button": "24.3.4",
     "@vaadin/checkbox": "24.3.4",
@@ -93,11 +85,11 @@
     "lodash.debounce": "4.0.8",
     "lodash.merge": "4.6.2",
     "markdown-it": "14.1.0",
-    "common": "0.0.1",
-    "descope-avatar": "0.0.1",
-    "descope-combo-box": "0.0.1",
-    "descope-text": "0.0.1",
-    "theme-globals": "0.0.1",
+    "@descope-ui/common": "0.0.1",
+    "@descope-ui/descope-text": "0.0.1",
+    "@descope-ui/descope-avatar": "0.0.1",
+    "@descope-ui/descope-combo-box": "0.0.1",
+    "@descope-ui/theme-globals": "0.0.1",
     "theme-input-wrapper": "0.0.1"
   },
   "overrides": {
@@ -147,7 +139,7 @@
     "prebuild": "rm -rf dist",
     "build:umd": "webpack -c webpack.prod.js",
     "build:lib": "rollup -c",
-    "build": "npm run build:umd && npm run build:lib && cp src/index.d.ts dist",
+    "build": "npm run build:umd && npm run build:lib",
     "start": "webpack serve -c webpack.dev.js --port=8888",
     "format": "prettier --ignore-path .gitignore --write .",
     "format:all": "npm run format .",

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

@@ -7,7 +7,7 @@ import {
   componentNameValidationMixin,
 } from '../../mixins';
 import { createDynamicDataMixin } from '../../mixins/createDynamicDataMixin';
-import { TextClass } from 'descope-text/class';
+import { TextClass } from '@descope-ui/descope-text/class';
 
 export const componentName = getComponentName('apps-list');
 

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

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

package/src/components/descope-date-field/descope-calendar/index.js

@@ -1,4 +1,4 @@
-import 'descope-combo-box';
+import '@descope-ui/descope-combo-box';
 import '../../descope-icon';
 import '../../descope-button';
 

package/src/components/descope-divider/DividerClass.js

@@ -2,7 +2,7 @@ import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '
 import { createBaseClass } from '../../baseClasses/createBaseClass';
 import { compose } from '../../helpers';
 import { forwardAttrs, getComponentName } from '../../helpers/componentHelpers';
-import { TextClass } from 'descope-text/class';
+import { TextClass } from '@descope-ui/descope-text/class';
 
 export const componentName = getComponentName('divider');
 class RawDivider extends createBaseClass({ componentName, baseSelector: ':host > div' }) {

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

@@ -1,5 +1,5 @@
 import { componentName, DividerClass } from './DividerClass';
-import 'descope-text';
+import '@descope-ui/descope-text';
 
 customElements.define(componentName, DividerClass);
 

package/src/components/descope-link/LinkClass.js

@@ -1,6 +1,6 @@
 import { createStyleMixin, draggableMixin, componentNameValidationMixin } from '../../mixins';
 import { createBaseClass } from '../../baseClasses/createBaseClass';
-import { TextClass } from 'descope-text/class';
+import { TextClass } from '@descope-ui/descope-text/class';
 import { compose } from '../../helpers';
 import { forwardAttrs, getComponentName } from '../../helpers/componentHelpers';
 

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

@@ -1,5 +1,5 @@
 import { componentName, LinkClass } from './LinkClass';
-import 'descope-text';
+import '@descope-ui/descope-text';
 
 customElements.define(componentName, LinkClass);
 

package/src/components/descope-security-questions-setup/SecurityQuestionsSetupClass.js

@@ -2,7 +2,7 @@ import { createBaseClass } from '../../baseClasses/createBaseClass';
 import { compose } from '../../helpers';
 import { getComponentName, observeAttributes } from '../../helpers/componentHelpers';
 import { componentNameValidationMixin, createStyleMixin, draggableMixin } from '../../mixins';
-import { ComboBoxClass } from 'descope-combo-box/class';
+import { ComboBoxClass } from '@descope-ui/descope-combo-box/class';
 import { TextFieldClass } from '../descope-text-field/TextFieldClass';
 
 export const componentName = getComponentName('security-questions-setup');

package/src/components/descope-security-questions-setup/index.js

@@ -1,6 +1,6 @@
 import { componentName, SecurityQuestionsSetupClass } from './SecurityQuestionsSetupClass';
 import '../descope-text-field';
-import 'descope-combo-box';
+import '@descope-ui/descope-combo-box';
 
 customElements.define(componentName, SecurityQuestionsSetupClass);
 

package/src/components/descope-security-questions-verify/SecurityQuestionsVerifyClass.js

@@ -2,7 +2,7 @@ import { createBaseClass } from '../../baseClasses/createBaseClass';
 import { compose } from '../../helpers';
 import { getComponentName, observeAttributes } from '../../helpers/componentHelpers';
 import { componentNameValidationMixin, createStyleMixin, draggableMixin } from '../../mixins';
-import { TextClass } from 'descope-text/class';
+import { TextClass } from '@descope-ui/descope-text/class';
 import { TextFieldClass } from '../descope-text-field/TextFieldClass';
 
 export const componentName = getComponentName('security-questions-verify');

package/src/components/descope-security-questions-verify/index.js

@@ -1,5 +1,5 @@
 import { componentName, SecurityQuestionsVerifyClass } from './SecurityQuestionsVerifyClass';
-import 'descope-text';
+import '@descope-ui/descope-text';
 import '../descope-text-field';
 
 customElements.define(componentName, SecurityQuestionsVerifyClass);

package/src/components/descope-user-attribute/UserAttributeClass.js

@@ -4,7 +4,7 @@ import { compose } from '../../helpers';
 import { getComponentName } from '../../helpers/componentHelpers';
 import deleteIcon from './delete.svg';
 import editIcon from './edit.svg';
-import { TextClass } from 'descope-text/class';
+import { TextClass } from '@descope-ui/descope-text/class';
 import { ButtonClass } from '../descope-button/ButtonClass';
 import { BadgeClass } from '../descope-badge/BadgeClass';
 

package/src/components/descope-user-attribute/index.js

@@ -1,5 +1,5 @@
 import { componentName, UserAttributeClass } from './UserAttributeClass';
-import 'descope-text';
+import '@descope-ui/descope-text';
 import '../descope-button';
 import '../descope-badge';
 import '@vaadin/icon';

package/src/components/descope-user-auth-method/UserAuthMethodClass.js

@@ -3,7 +3,7 @@ import { createBaseClass } from '../../baseClasses/createBaseClass';
 import { compose } from '../../helpers';
 import { getComponentName } from '../../helpers/componentHelpers';
 import greenVIcon from './green-v.svg';
-import { TextClass } from 'descope-text/class';
+import { TextClass } from '@descope-ui/descope-text/class';
 import { ButtonClass } from '../descope-button/ButtonClass';
 import { BadgeClass } from '../descope-badge/BadgeClass';
 import { IconClass } from '../descope-icon/IconClass';

package/src/components/descope-user-auth-method/index.js

@@ -1,5 +1,5 @@
 import { componentName, UserAuthMethodClass } from './UserAuthMethodClass';
-import 'descope-text';
+import '@descope-ui/descope-text';
 import '../descope-button';
 import '../descope-badge';
 import '@vaadin/icon';

package/src/components/mapping-fields/descope-mappings-field/MappingsFieldClass.js

@@ -5,7 +5,7 @@ import {
   proxyInputMixin,
   componentNameValidationMixin,
 } from '../../../mixins';
-import { TextClass } from 'descope-text/class';
+import { TextClass } from '@descope-ui/descope-text/class';
 import { compose } from '../../../helpers';
 import { forwardAttrs, getComponentName, syncAttrs } from '../../../helpers/componentHelpers';
 import { componentName as descopeInternalComponentName } from './descope-mappings-field-internal/MappingsFieldInternal';

package/src/components/mapping-fields/descope-mappings-field/index.js

@@ -2,10 +2,10 @@ import '@vaadin/custom-field';
 import '@vaadin/icon';
 import '@vaadin/icons';
 import { componentName, MappingsFieldClass } from './MappingsFieldClass';
-import 'descope-text';
+import '@descope-ui/descope-text';
 import '../../descope-button';
 import '../../descope-text-field';
-import 'descope-combo-box';
+import '@descope-ui/descope-combo-box';
 import './descope-mappings-field-internal';
 import './descope-mapping-item';
 

package/src/components/phone-fields/descope-phone-field/PhoneFieldClass.js

@@ -3,7 +3,7 @@ import { forwardAttrs, getComponentName } from '../../../helpers/componentHelper
 import { compose } from '../../../helpers';
 import { createProxy, createStyleMixin, draggableMixin, proxyInputMixin } from '../../../mixins';
 import { TextFieldClass } from '../../descope-text-field/TextFieldClass';
-import { ComboBoxClass } from 'descope-combo-box/class';
+import { ComboBoxClass } from '@descope-ui/descope-combo-box/class';
 import CountryCodes from '../CountryCodes';
 import {
   resetInputCursor,

package/src/components/phone-fields/descope-phone-field/descope-phone-field-internal/index.js

@@ -1,4 +1,4 @@
-import 'descope-combo-box';
+import '@descope-ui/descope-combo-box';
 import '../../../descope-text-field';
 
 import PhoneFieldInternal, { componentName } from './PhoneFieldInternal';

package/src/components/phone-fields/descope-phone-field/index.js

@@ -1,5 +1,5 @@
 import './descope-phone-field-internal';
-import 'descope-combo-box';
+import '@descope-ui/descope-combo-box';
 import '../../descope-text-field';
 
 import { componentName, PhoneFieldClass } from './PhoneFieldClass';

package/src/components/phone-fields/descope-phone-input-box-field/index.js

@@ -1,5 +1,5 @@
 import './descope-phone-input-box-internal';
-import 'descope-combo-box';
+import '@descope-ui/descope-combo-box';
 import '../../descope-text-field';
 
 import { componentName, PhoneFieldInputBoxClass } from './PhoneFieldInputBoxClass';

package/src/helpers/themeHelpers/index.js

@@ -172,4 +172,4 @@ export const createHelperVars = (theme, prefix) => {
   return [res.theme, res.useVars, res.vars];
 };
 
-export { componentsThemeManager } from 'common/theme-helpers';
+export { componentsThemeManager } from '@descope-ui/common/theme-helpers';

package/src/theme/components/alert.js

@@ -1,7 +1,7 @@
 import globals from '../globals';
 import { getThemeRefs, useVar } from '../../helpers/themeHelpers';
 import { AlertClass } from '../../components/descope-alert/AlertClass';
-import { vars as textCompVars } from 'descope-text/theme';
+import { vars as textCompVars } from '@descope-ui/descope-text/theme';
 
 const globalRefs = getThemeRefs(globals);
 const vars = AlertClass.cssVarList;

package/src/theme/components/enrichedText.js

@@ -1,7 +1,7 @@
 import globals from '../globals';
 import { getThemeRefs, useVar } from '../../helpers/themeHelpers';
 import { EnrichedTextClass } from '../../components/descope-enriched-text/EnrichedTextClass';
-import { vars as textCompVars } from 'descope-text/theme';
+import { vars as textCompVars } from '@descope-ui/descope-text/theme';
 import { vars as linkCompVars } from './link';
 
 const globalRefs = getThemeRefs(globals);

package/src/theme/components/index.js

@@ -10,13 +10,13 @@ import * as container from './container';
 import * as logo from './logo';
 import * as totpImage from './totpImage';
 import * as notpImage from './notpImage';
-import * as text from 'descope-text/theme';
+import * as text from '@descope-ui/descope-text/theme';
 import * as enrichedText from './enrichedText';
 import * as link from './link';
 import * as divider from './divider';
 import * as passcode from './passcode';
 import { loaderRadial, loaderLinear } from './loader';
-import * as comboBox from 'descope-combo-box/theme';
+import * as comboBox from '@descope-ui/descope-combo-box/theme';
 import * as image from './image';
 import * as phoneField from './phoneField';
 import * as phoneInputBoxField from './phoneInputBoxField';
@@ -31,7 +31,7 @@ import * as grid from './grid';
 import * as notificationCard from './notificationCard';
 import * as multiSelectComboBox from './multiSelectComboBox';
 import * as badge from './badge';
-import * as avatar from 'descope-avatar/theme';
+import * as avatar from '@descope-ui/descope-avatar/theme';
 import * as mappingsField from './mappingsField';
 import * as userAttribute from './userAttribute';
 import * as userAuthMethod from './userAuthMethod';

package/dist/index.d.ts

@@ -1,72 +0,0 @@
-export {
-  globalsThemeToStyle,
-  createComponentsTheme,
-  themeToStyle,
-  componentsThemeManager,
-} from './helpers/themeHelpers';
-export { genColor } from './helpers/themeHelpers/colorsHelpers';
-export { defaultTheme, themeVars } from './theme';
-export { default as darkTheme } from './darkTheme';
-export { ButtonClass } from './components/descope-button';
-export { CheckboxClass } from './components/boolean-fields/descope-checkbox';
-export { SwitchToggleClass } from './components/boolean-fields/descope-switch-toggle';
-export { LoaderLinearClass } from './components/descope-loader-linear';
-export { LoaderRadialClass } from './components/descope-loader-radial';
-export { ContainerClass } from './components/descope-container';
-export { DividerClass } from './components/descope-divider';
-export { EmailFieldClass } from './components/descope-email-field';
-export { LinkClass } from './components/descope-link';
-export { LogoClass } from './components/descope-logo';
-export { TotpImageClass } from './components/descope-totp-image';
-export { NotpImageClass } from './components/descope-notp-image';
-export { NumberFieldClass } from './components/descope-number-field';
-export { PasscodeClass } from './components/descope-passcode';
-export { PasswordClass } from './components/descope-password';
-export { TextClass } from './components/descope-text';
-export { EnrichedTextClass } from './components/descope-enriched-text';
-export { TextAreaClass } from './components/descope-text-area';
-export { TextFieldClass } from './components/descope-text-field';
-export { ImageClass } from './components/descope-image';
-export { PhoneFieldClass } from './components/phone-fields/descope-phone-field';
-export { PhoneFieldInputBoxClass } from './components/phone-fields/descope-phone-input-box-field';
-export { NewPasswordClass } from './components/descope-new-password';
-export { RecaptchaClass } from './components/descope-recaptcha';
-export { UploadFileClass } from './components/descope-upload-file';
-export { ButtonSelectionGroupClass } from './components/button-selection-group-fields/descope-button-selection-group/ButtonSelectionGroupClass';
-export { ButtonMultiSelectionGroupClass } from './components/button-selection-group-fields/descope-button-multi-selection-group/ButtonMultiSelectionGroupClass';
-export { GridClass } from './components/descope-grid/GridClass';
-export { GridTextColumnClass } from './components/descope-grid/descope-grid-text-column/index';
-export { GridSelectionColumnClass } from './components/descope-grid/descope-grid-selection-column/index';
-export { ModalClass } from './components/descope-modal/ModalClass';
-export { NotificationClass } from './components/descope-notification/';
-export { BadgeClass } from './components/descope-badge/';
-export { MultiSelectComboBoxClass } from './components/descope-multi-select-combo-box/';
-export { MappingsFieldClass } from './components/mapping-fields/descope-mappings-field/';
-export { SamlGroupMappingsClass } from './components/mapping-fields/descope-saml-group-mappings/';
-export { PolicyValidationClass } from './components/descope-policy-validation/';
-export { CodeSnippetClass } from './components/descope-code-snippet/';
-export { CalendarClass } from './components/descope-date-field/descope-calendar';
-export { DateFieldClass } from './components/descope-date-field/';
-export { HybridFieldClass } from './components/descope-hybrid-field';
-
-export type Theme = {
-  globals: {
-    colors: Record<string, string>;
-    fonts: Record<string, any>;
-    typography: Record<string, any>;
-    shadow: Record<string, string>;
-    spacing: Record<string, string>;
-    radius: Record<string, string>;
-    border: Record<string, string>;
-  };
-  components: {
-    button: Record<string, any>;
-    textField: Record<string, any>;
-    logo: Record<string, any>;
-    container: Record<string, any>;
-    link: Record<string, any>;
-    text: Record<string, any>;
-    inputWrapper: Record<string, any>;
-    buttonSelectionGroupItem: Record<string, any>;
-  };
-};

package/node_modules/common/.eslintrc.json

@@ -1,18 +0,0 @@
-{
-  "extends": ["../../../.eslintrc.json"],
-  "ignorePatterns": ["!**/*"],
-  "overrides": [
-    {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.ts", "*.tsx"],
-      "rules": {}
-    },
-    {
-      "files": ["*.js", "*.jsx"],
-      "rules": {}
-    }
-  ]
-}

package/node_modules/common/README.md

@@ -1,7 +0,0 @@
-# common
-
-This library was generated with [Nx](https://nx.dev).
-
-## Running unit tests
-
-Run `nx test common` to execute the unit tests via [Jest](https://jestjs.io).

package/node_modules/common/package.json

@@ -1,37 +0,0 @@
-{
-  "name": "common",
-  "version": "0.0.1",
-  "dependencies": {
-    "element-internals-polyfill": "^1.3.9",
-    "color": "^4.2.3",
-    "lodash.merge": "4.6.2"
-  },
-  "private": true,
-  "exports": {
-    "./constants": {
-      "import": "./src/constants.js"
-    },
-    "./utils": {
-      "import": "./src/utils/index.js"
-    },
-    "./theme-helpers": {
-      "import": "./src/themeHelpers/index.js",
-      "require": "./src/themeHelpers/index.js"
-    },
-    "./components-mixins": {
-      "import": "./src/componentsMixins/index.js"
-    },
-    "./base-classes": {
-      "import": "./src/baseClasses/index.js"
-    },
-    "./components-helpers": {
-      "import": "./src/componentsHelpers/index.js"
-    },
-    "./sb-controls": {
-      "import": "./src/sbControls.js"
-    },
-    "./sb-helpers": {
-      "import": "./src/sbHelpers.js"
-    }
-  }
-}

package/node_modules/common/project.json

@@ -1,7 +0,0 @@
-{
-  "name": "common",
-  "$schema": "../../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "packages/libs/common/src",
-  "projectType": "library",
-  "tags": []
-}

package/node_modules/common/src/baseClasses/baseClasses/createBaseClass.js

@@ -1,66 +0,0 @@
-import { compose } from '../../utils';
-import { componentNameValidationMixin } from '../../componentsMixins/mixins/componentNameValidationMixin';
-import { componentsContextMixin } from '../../componentsMixins/mixins/componentsContextMixin';
-import { hoverableMixin } from '../../componentsMixins/mixins/hoverableMixin';
-import { normalizeBooleanAttributesMixin } from '../../componentsMixins/mixins/normalizeBooleanAttributesMixin';
-
-export const createBaseClass = ({ componentName, baseSelector = '' }) => {
-  class DescopeBaseClass extends HTMLElement {
-    static get componentName() {
-      return componentName;
-    }
-
-    #baseElement;
-
-    #isInit = true;
-
-    // base selector is the selector for the component wrapper,
-    // it's the highest element that is relevant for the layout
-    // eslint-disable-next-line class-methods-use-this
-    get baseSelector() {
-      return baseSelector;
-    }
-
-    // this is the base element, which returned by querying the base selector
-    get baseElement() {
-      this.#baseElement ??= this.baseSelector
-        ? this.rootElement.querySelector(this.baseSelector)
-        : this;
-
-      if (!this.#baseElement) {
-        // eslint-disable-next-line no-console
-        console.warn('missing base element for component', this.localName);
-      }
-      return this.#baseElement;
-    }
-
-    // this is the component root level element,
-    // it can be either a shadow root or the component's node from the light DOM
-    get rootElement() {
-      return this.shadowRoot || this;
-    }
-
-    get name() {
-      return this.getAttribute('name');
-    }
-
-    connectedCallback() {
-      super.connectedCallback?.();
-
-      if (this.rootElement.isConnected) {
-        // the init function is running once, on the first time the component is connected
-        if (this.#isInit) {
-          this.#isInit = false;
-          this.init?.();
-        }
-      }
-    }
-  }
-
-  return compose(
-    componentNameValidationMixin,
-    hoverableMixin,
-    normalizeBooleanAttributesMixin,
-    componentsContextMixin
-  )(DescopeBaseClass);
-};

package/node_modules/common/src/baseClasses/baseClasses/createBaseInputClass.js

@@ -1,14 +0,0 @@
-import { compose } from '../../utils';
-import { changeMixin } from '../../componentsMixins/mixins/changeMixin';
-import { inputEventsDispatchingMixin } from '../../componentsMixins/mixins/inputEventsDispatchingMixin';
-import { inputValidationMixin } from '../../componentsMixins/mixins/inputValidationMixin';
-import { normalizeBooleanAttributesMixin } from '../../componentsMixins/mixins/normalizeBooleanAttributesMixin';
-import { createBaseClass } from './createBaseClass';
-
-export const createBaseInputClass = (...args) =>
-  compose(
-    inputValidationMixin,
-    changeMixin,
-    normalizeBooleanAttributesMixin,
-    inputEventsDispatchingMixin
-  )(createBaseClass(...args));

package/node_modules/common/src/baseClasses/baseClasses/createCssVarImageClass.js

@@ -1,55 +0,0 @@
-import { compose } from '../../utils';
-import { componentNameValidationMixin } from '../../componentsMixins/mixins/componentNameValidationMixin';
-import { createStyleMixin } from '../../componentsMixins/mixins/createStyleMixin';
-import { draggableMixin } from '../../componentsMixins/mixins/draggableMixin';
-import { createBaseClass } from './createBaseClass';
-
-export const createCssVarImageClass = ({ componentName, varName, fallbackVarName }) => {
-  let style;
-  const getContent = () => style;
-
-  class RawCssVarImageClass extends createBaseClass({
-    componentName,
-    baseSelector: ':host > div',
-  }) {
-    constructor() {
-      super();
-      this.attachShadow({ mode: 'open' }).innerHTML = `
-			<style>
-				:host {
-					display: inline-flex;
-				}
-				:host([draggable="true"]) > div {
-					pointer-events: none
-				}
-				:host > div {
-					display: inline-block;
-					max-width: 100%;
-					max-height: 100%;
-					object-fit: contain;
-					margin: auto;
-					${getContent()}
-				}
-			</style>
-			<div></div>
-			`;
-    }
-  }
-
-  const CssVarImageClass = compose(
-    createStyleMixin({
-      mappings: {
-        height: { selector: () => ':host > div' },
-        width: { selector: () => ':host > div' },
-        [varName]: { property: 'content' },
-        [fallbackVarName]: { property: 'content' },
-      },
-    }),
-    draggableMixin,
-    componentNameValidationMixin
-  )(RawCssVarImageClass);
-
-  style = `content: var(${CssVarImageClass.cssVarList[varName]}, var(${CssVarImageClass.cssVarList[fallbackVarName]}));`;
-
-  return CssVarImageClass;
-};

package/node_modules/common/src/baseClasses/index.js

@@ -1,3 +0,0 @@
-export * from './baseClasses/createBaseClass';
-export * from './baseClasses/createCssVarImageClass';
-export * from './baseClasses/createBaseInputClass';