@descope/web-components-ui 1.0.44 → 1.0.46

package/src/components/descope-logo/Logo.js

@@ -0,0 +1,57 @@
+import {
+	getComponentName,
+	createStyleMixin,
+	draggableMixin,
+	compose,
+	componentNameValidationMixin
+} from '../../componentsHelpers';
+
+export const componentName = getComponentName('logo');
+
+let style
+const getStyle = () => style;
+
+class RawLogo extends HTMLElement {
+	static get componentName() {
+		return componentName;
+	}
+	constructor() {
+		super();
+		const template = document.createElement('template');
+		template.innerHTML = `
+		<style>
+			${getStyle()}
+		</style>
+		<div></div>`;
+
+		this.attachShadow({ mode: 'open' });
+		this.shadowRoot.appendChild(template.content.cloneNode(true));
+
+		this.baseSelector = ':host > div';
+	}
+}
+
+const Logo = compose(
+	createStyleMixin({
+		mappings: {
+			height: {},
+			width: {},
+			url: {},
+			fallbackUrl: {},
+		}
+	}),
+	draggableMixin,
+	componentNameValidationMixin
+)(RawLogo);
+
+style = `
+:host {
+	display: inline-block;
+}
+:host > div {
+	display: inline-block;
+	content: var(${Logo.cssVarList.url}, var(${Logo.cssVarList.fallbackUrl}));
+}
+`
+
+export default Logo;

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

@@ -0,0 +1,5 @@
+import Logo, { componentName } from './Logo';
+
+customElements.define(componentName, Logo);
+
+export { Logo };

package/src/dev/index.js

@@ -1,7 +1,2 @@
-import theme from '../theme';
-import { themeToStyle } from '../themeHelpers';
-
-// this file is used for exposing stuff to the dev env only
-
-export const getDefaultThemeStyles = (themeName) =>
-	themeToStyle(theme, themeName);
+export {default as defaultTheme} from '../theme';
+export { themeToStyle } from '../themeHelpers';

package/src/theme/components/index.js

@@ -7,6 +7,7 @@ import textArea from './textArea';
 import checkbox from './checkbox';
 import switchToggle from './switchToggle';
 import container from './container';
+import logo from './logo';
 
 export default {
 	button,
@@ -17,5 +18,6 @@ export default {
 	textArea,
 	checkbox,
 	switchToggle,
-	container
+	container,
+	logo
 };

package/src/theme/components/logo.js

@@ -0,0 +1,9 @@
+import Logo from "../../components/descope-logo/Logo";
+
+const vars = Logo.cssVarList
+
+const logo = {
+	[vars.fallbackUrl]: 'url(https://content.app.descope.com/assets/flows/noLogoPlaceholder.svg)'
+};
+
+export default logo;

package/src/theme/components/textField.js

@@ -46,7 +46,7 @@ export const textField = (vars) => ({
 	[vars.borderWidthReadOnly]: '0',
 	[vars.borderRadius]: globalRefs.radius.sm,
 
-	_borderoffset: {
+	_borderOffset: {
 		[vars.outlineOffset]: '2px'
 	},