webclipper fixes

dist/extension/css/foreground.css

@@ -3,6 +3,7 @@
 #anytypeWebclipper-iframe {
 	position: absolute; z-index: 1; width: 50%; height: 80%; background: #fff; left: 50%; top: 50%; transform: translate3d(-50%,-50%,0px);
 	border-radius: 16px; border: 1px solid rgba(172, 169, 152, 0.12); box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.10);
+	min-width: 600px;
 }
 
 #anytypeWebclipper-container .dimmer {

dist/extension/manifest.json

@@ -2,7 +2,7 @@
 	"manifest_version": 3,
 	"name": "Anytype Web Clipper",
 	"description": "Save web content to the Anytype — open, encrypted, and local-first application that connects everything as objects.",
-	"version": "0.0.5",
+	"version": "0.0.6",
 	"icons": {
 		"16": "img/icon16x16.png",
 		"128": "img/icon128x128.png"

extension/iframe/create.tsx

@@ -56,7 +56,7 @@ const Create = observer(class Create extends React.Component<I.PageComponent, St
 							}}
 						/>
 
-						<div id="select" className="select" onMouseDown={this.onSelect}>
+						<div id="select-object" className="select" onMouseDown={this.onSelect}>
 							<div className="item">
 								{object ? <IconObject object={object} iconSize={16} /> : ''}
 								<div className="name">{object ? object.name : translate('commonSelectObject')}</div>
@@ -95,7 +95,6 @@ const Create = observer(class Create extends React.Component<I.PageComponent, St
 
 	componentDidUpdate (): void {
 		this.initBlocks();
-
 	};
 
 	init () {
@@ -159,7 +158,7 @@ const Create = observer(class Create extends React.Component<I.PageComponent, St
 		];
 
 		S.Menu.open('searchObject', {
-			element: node.find('#select'),
+			element: node.find('#select-object'),
 			data: {
 				value: object ? [ object.id ] : [],
 				canAdd: true,

extension/lib/util.ts

@@ -1,4 +1,4 @@
-import { S, U, J, dispatcher } from 'Lib';
+import { S, U, J, C, dispatcher } from 'Lib';
 
 const INDEX_POPUP = '/popup/index.html';
 const INDEX_IFRAME = '/iframe/index.html'
@@ -56,13 +56,17 @@ class Util {
 				return;
 			};
 
-			if (message.accountId) {
-				S.Auth.accountSet({ id: message.accountId });
-			};
-			
-			if (onSuccess) {
-				onSuccess();
-			};
+			C.AccountSelect(message.accountId, '', 0, '', (message: any) => {
+				S.Auth.accountSet(message.account);
+				S.Common.configSet(message.account.config, false);
+				S.Common.showVaultSet(false);
+
+				U.Data.onInfo(message.account.info);
+
+				if (onSuccess) {
+					onSuccess();
+				};
+			});
 		});
 	};
 

extension/popup/create.tsx

@@ -164,7 +164,7 @@ const Create = observer(class Create extends React.Component<I.PageComponent, St
 		);
 	};
 
-	componentDidMount(): void {
+	componentDidMount (): void {
 		U.Data.createAllSubscriptions(() => {
 			this.initSpace();
 			this.initName();
@@ -249,7 +249,7 @@ const Create = observer(class Create extends React.Component<I.PageComponent, St
 		return this.getObjects(J.Constant.subId.type).
 			map(Util.optionMapper).
 			filter(this.filter).
-			filter(it => layouts.includes(it.recommendedLayout) && (it.spaceId == S.Common.space)).
+			filter(it => layouts.includes(it.recommendedLayout) && (it.spaceId == S.Common.space) && (it.uniqueKey != J.Constant.typeKey.template)).
 			sort(U.Data.sortByName);
 	};
 

extension/scss/common.scss

@@ -98,6 +98,14 @@ html.anytypeWebclipper-popup {
 	--line-height-description: 26px; 
 	--letter-spacing-description: -0.28px;
 
+	/* Menu */
+	--menu-width-common: 224px;
+	--menu-width-icon: 256px;
+	--menu-width-value: 288px;
+	--menu-width-set: 360px;
+	--menu-width-large: 408px;
+	--menu-width-add: 480px;
+
 	@import "~scss/common";
 	@import "~scss/form/common";
 	@import "~scss/component/common";

src/scss/form/select.scss

@@ -5,7 +5,7 @@
 	transition: $transitionAllCommon; position: relative; font-family: 'Inter';
 	white-space: nowrap; padding: 3px 20px 3px 6px; line-height: 20px !important;
 }
-.select:hover, .select.isFocused { background: var(--color-shape-tertiary); }
+.select:hover, .select.hover, .select.isFocused { background: var(--color-shape-tertiary); }
 
 .select {
 	.icon { transition: none; }

src/ts/component/menu/index.tsx

@@ -538,7 +538,7 @@ const Menu = observer(class Menu extends React.Component<I.Menu, State> {
 			let y = oy;
 			let flipX = false;
 
-			if (stickToElementEdge) {
+			if (stickToElementEdge != I.MenuDirection.None) {
 				switch (stickToElementEdge) {
 					case I.MenuDirection.Top: offsetY = -eh; break;
 					case I.MenuDirection.Bottom: offsetY = eh; break;