@elementor/editor-app-bar 4.4.0-1078 → 4.4.0-1080

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@elementor/editor-app-bar",
3
3
  "description": "App Bar extension for @elementor/editor",
4
- "version": "4.4.0-1078",
4
+ "version": "4.4.0-1080",
5
5
  "private": false,
6
6
  "author": "Elementor Team",
7
7
  "homepage": "https://elementor.com/",
@@ -40,18 +40,18 @@
40
40
  "dev": "tsup --config=../../tsup.dev.ts"
41
41
  },
42
42
  "dependencies": {
43
- "@elementor/editor-current-user": "4.4.0-1078",
44
- "@elementor/editor-ui": "4.4.0-1078",
45
- "@elementor/http-client": "4.4.0-1078",
46
- "@elementor/editor": "4.4.0-1078",
47
- "@elementor/editor-documents": "4.4.0-1078",
48
- "@elementor/editor-mcp": "4.4.0-1078",
49
- "@elementor/editor-responsive": "4.4.0-1078",
50
- "@elementor/editor-v1-adapters": "4.4.0-1078",
43
+ "@elementor/editor-current-user": "4.4.0-1080",
44
+ "@elementor/editor-ui": "4.4.0-1080",
45
+ "@elementor/http-client": "4.4.0-1080",
46
+ "@elementor/editor": "4.4.0-1080",
47
+ "@elementor/editor-documents": "4.4.0-1080",
48
+ "@elementor/editor-mcp": "4.4.0-1080",
49
+ "@elementor/editor-responsive": "4.4.0-1080",
50
+ "@elementor/editor-v1-adapters": "4.4.0-1080",
51
51
  "@elementor/icons": "~1.75.1",
52
- "@elementor/locations": "4.4.0-1078",
53
- "@elementor/menus": "4.4.0-1078",
54
- "@elementor/events": "4.4.0-1078",
52
+ "@elementor/locations": "4.4.0-1080",
53
+ "@elementor/menus": "4.4.0-1080",
54
+ "@elementor/events": "4.4.0-1080",
55
55
  "@elementor/ui": "1.37.5",
56
56
  "@wordpress/i18n": "^5.13.0"
57
57
  },
@@ -16,5 +16,8 @@ export const ANGIE_DESCRIPTION = __(
16
16
 
17
17
  export const AI_WIDGET_CTA_VIEWED_EVENT = 'ai_widget_cta_viewed' as const;
18
18
  export const ANGIE_TOP_BAR_PROMOTION_IMAGE_URL =
19
- 'https://assets.elementor.com/packages/v1/images/angie-top-bar-promotion.svg';
20
- export const ANGIE_TOP_BAR_DESCRIPTION = __( 'Build custom widgets using simple instructions.', 'elementor' );
19
+ 'https://assets.elementor.com/packages/v1/images/angie-top-bar-promotion-0926.svg';
20
+ export const ANGIE_TOP_BAR_DESCRIPTION = __(
21
+ 'Describe what you want to build in plain language and Angie generates it in native Elementor structure, fully editable and customizable.',
22
+ 'elementor'
23
+ );
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { Button, Chip, ClickAwayListener, CloseButton, Image, Stack, Typography } from '@elementor/ui';
2
+ import { Box, Button, ClickAwayListener, CloseButton, Image, Stack, Typography } from '@elementor/ui';
3
3
  import { __ } from '@wordpress/i18n';
4
4
 
5
5
  type Props = {
@@ -14,23 +14,44 @@ export function AngieGuideCard( { imageUrl, description, learnMoreUrl, onInstall
14
14
  return (
15
15
  <ClickAwayListener onClickAway={ onClose }>
16
16
  <Stack sx={ { width: 296 } } data-testid="e-angie-guide-card">
17
- <Stack direction="row" alignItems="center" gap={ 1 } py={ 1 } px={ 2 }>
18
- <Typography variant="subtitle2">{ __( 'Meet Angie', 'elementor' ) }</Typography>
19
- <Chip label={ __( 'New', 'elementor' ) } size="small" color="info" variant="standard" />
17
+ <Box sx={ { position: 'relative', p: 1.5 } }>
18
+ <Image
19
+ src={ imageUrl }
20
+ alt={ __( 'Angie', 'elementor' ) }
21
+ sx={ {
22
+ width: '100%',
23
+ maxHeight: 200,
24
+ objectFit: 'cover',
25
+ objectPosition: 'center top',
26
+ borderRadius: 1,
27
+ display: 'block',
28
+ } }
29
+ />
20
30
  <CloseButton
21
- edge="end"
22
- sx={ { ml: 'auto' } }
31
+ sx={ {
32
+ position: 'absolute',
33
+ top: 15,
34
+ insetInlineEnd: 15,
35
+ color: 'common.white',
36
+ filter: 'drop-shadow(0 1px 2px rgba(0,0,0,0.6))',
37
+ '&:hover': {
38
+ bgcolor: 'rgba(255,255,255,0.2)',
39
+ color: 'common.white',
40
+ },
41
+ } }
23
42
  slotProps={ { icon: { fontSize: 'small' } } }
24
43
  onClick={ onClose }
25
44
  />
45
+ </Box>
46
+ <Stack px={ 2 } pt={ 0.5 } pb={ 0.5 }>
47
+ <Typography variant="subtitle2">{ __( 'Generate full pages with AI', 'elementor' ) }</Typography>
26
48
  </Stack>
27
- <Image src={ imageUrl } alt={ __( 'Angie', 'elementor' ) } sx={ { height: 150, width: '100%' } } />
28
- <Stack px={ 2 } pt={ 1.5 } pb={ 1 }>
49
+ <Stack px={ 2 } pt={ 0.5 } pb={ 1.5 }>
29
50
  <Typography variant="body2" color="secondary">
30
51
  { description }
31
52
  </Typography>
32
53
  </Stack>
33
- <Stack direction="row" justifyContent="flex-end" gap={ 1 } pt={ 1 } pb={ 1.5 } px={ 2 }>
54
+ <Stack direction="row" justifyContent="flex-end" gap={ 1 } pb={ 1.5 } px={ 2 }>
34
55
  <Button
35
56
  variant="text"
36
57
  size="small"
@@ -43,8 +64,8 @@ export function AngieGuideCard( { imageUrl, description, learnMoreUrl, onInstall
43
64
  { __( 'Learn More', 'elementor' ) }
44
65
  </Button>
45
66
  { onInstall && (
46
- <Button variant="contained" size="small" color="accent" onClick={ onInstall }>
47
- { __( 'Try for free', 'elementor' ) }
67
+ <Button variant="contained" size="small" color="primary" onClick={ onInstall }>
68
+ { __( 'Build with Angie', 'elementor' ) }
48
69
  </Button>
49
70
  ) }
50
71
  </Stack>