Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
610719f
fix: line-height for RTFV2
rkeerthient Jan 5, 2026
e70e2bf
reduced event card default text
rkeerthient Jan 5, 2026
8546345
renamed test case
rkeerthient Jan 5, 2026
0f3964a
Update component screenshots for visual-editor
github-actions[bot] Jan 5, 2026
ce0d8d0
Update component screenshots for visual-editor
github-actions[bot] Jan 5, 2026
6f1ca92
Merge remote-tracking branch 'origin/main' into line-height-event-des…
rkeerthient Jan 5, 2026
d104434
Update component screenshots for visual-editor
github-actions[bot] Jan 5, 2026
562d9a6
Update component screenshots for visual-editor
github-actions[bot] Jan 5, 2026
e7a4921
Merge remote-tracking branch 'origin/main' into line-height-event-des…
rkeerthient Jan 6, 2026
cd7fe25
Update component screenshots for visual-editor
github-actions[bot] Jan 6, 2026
51d4a79
updated default data
rkeerthient Jan 7, 2026
2a28058
updated 2nd instance default text
rkeerthient Jan 7, 2026
3371d54
updated default layout
rkeerthient Jan 7, 2026
dabec2b
Update component screenshots for visual-editor
github-actions[bot] Jan 7, 2026
e468fea
Merge branch 'main' into line-height-cta-padding
rkeerthient Jan 8, 2026
08f46d5
Update component screenshots for visual-editor
github-actions[bot] Jan 8, 2026
303812f
Update component screenshots for visual-editor
github-actions[bot] Jan 8, 2026
2f7f544
Merge remote-tracking branch 'origin/main' into line-height-event-des…
rkeerthient Jan 8, 2026
2095e5f
Update component screenshots for visual-editor
github-actions[bot] Jan 8, 2026
1b6caeb
Update component screenshots for visual-editor
github-actions[bot] Jan 8, 2026
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 9 additions & 14 deletions packages/visual-editor/src/components/atoms/maybeRTF.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,94 +2,89 @@
p {
font-family: var(--fontFamily-body-fontFamily) !important;
font-size: var(--fontSize-body-fontSize) !important;
line-height: calc(var(--fontSize-body-fontSize) + 4px) !important;
line-height: 1.5 !important;
font-weight: var(--fontWeight-body-fontWeight) !important;
text-transform: var(--textTransform-body-textTransform) !important;
}
li {
font-family: var(--fontFamily-body-fontFamily) !important;
font-size: var(--fontSize-body-fontSize) !important;
line-height: calc(var(--fontSize-body-fontSize) + 4px) !important;
line-height: 1.5 !important;
font-weight: var(--fontWeight-body-fontWeight) !important;
text-transform: var(--textTransform-body-textTransform) !important;
}
h1 {
font-family: var(--fontFamily-h2-fontFamily) !important;
font-size: var(--fontSize-h2-fontSize) !important;
line-height: calc(var(--fontSize-h2-fontSize) + 4px) !important;
line-height: 1.2 !important;
font-weight: var(--fontWeight-h2-fontWeight) !important;
text-transform: var(--textTransform-h1-textTransform) !important;
@media (min-width: 640px) {
font-family: var(--fontFamily-h1-fontFamily) !important;
font-size: var(--fontSize-h1-fontSize) !important;
line-height: calc(var(--fontSize-h1-fontSize) + 4px) !important;
font-weight: var(--fontWeight-h1-fontWeight) !important;
}
}
h2 {
font-family: var(--fontFamily-h3-fontFamily) !important;
font-size: var(--fontSize-h3-fontSize) !important;
line-height: calc(var(--fontSize-h3-fontSize) + 4px) !important;
line-height: 1.2 !important;
font-weight: var(--fontWeight-h3-fontWeight) !important;
text-transform: var(--textTransform-h2-textTransform) !important;
@media (min-width: 640px) {
font-family: var(--fontFamily-h2-fontFamily) !important;
font-size: var(--fontSize-h2-fontSize) !important;
line-height: calc(var(--fontSize-h2-fontSize) + 4px) !important;
font-weight: var(--fontWeight-h2-fontWeight) !important;
}
}
h3 {
font-family: var(--fontFamily-h4-fontFamily) !important;
font-size: var(--fontSize-h4-fontSize) !important;
line-height: calc(var(--fontSize-h4-fontSize) + 4px) !important;
line-height: 1.2 !important;
font-weight: var(--fontWeight-h4-fontWeight) !important;
text-transform: var(--textTransform-h3-textTransform) !important;
@media (min-width: 640px) {
font-family: var(--fontFamily-h3-fontFamily) !important;
font-size: var(--fontSize-h3-fontSize) !important;
line-height: calc(var(--fontSize-h3-fontSize) + 4px) !important;
font-weight: var(--fontWeight-h3-fontWeight) !important;
}
}
h4 {
font-family: var(--fontFamily-h5-fontFamily) !important;
font-size: var(--fontSize-h5-fontSize) !important;
line-height: calc(var(--fontSize-h5-fontSize) + 4px) !important;
line-height: 1.2 !important;
font-weight: var(--fontWeight-h5-fontWeight) !important;
text-transform: var(--textTransform-h4-textTransform) !important;
@media (min-width: 640px) {
font-family: var(--fontFamily-h4-fontFamily) !important;
font-size: var(--fontSize-h4-fontSize) !important;
line-height: calc(var(--fontSize-h4-fontSize) + 4px) !important;
font-weight: var(--fontWeight-h4-fontWeight) !important;
}
}
h5 {
font-family: var(--fontFamily-h6-fontFamily) !important;
font-size: var(--fontSize-h6-fontSize) !important;
line-height: calc(var(--fontSize-h6-fontSize) + 4px) !important;
line-height: 1.2 !important;
font-weight: var(--fontWeight-h6-fontWeight) !important;
text-transform: var(--textTransform-h5-textTransform) !important;
@media (min-width: 640px) {
font-family: var(--fontFamily-h5-fontFamily) !important;
font-size: var(--fontSize-h5-fontSize) !important;
line-height: calc(var(--fontSize-h5-fontSize) + 4px) !important;
font-weight: var(--fontWeight-h5-fontWeight) !important;
}
}
h6 {
font-family: var(--fontFamily-h6-fontFamily) !important;
font-size: var(--fontSize-h6-fontSize) !important;
line-height: calc(var(--fontSize-h6-fontSize) + 4px) !important;
line-height: 1.2 !important;
font-weight: var(--fontWeight-h6-fontWeight) !important;
text-transform: var(--textTransform-h6-textTransform) !important;
}
a {
font-family: var(--fontFamily-link-fontFamily) !important;
font-size: var(--fontSize-link-fontSize) !important;
font-weight: var(--fontWeight-link-fontWeight) !important;
line-height: calc(var(--fontSize-link-fontSize) + 4px) !important;
line-height: 1.5 !important;
text-decoration: underline !important;
color: hsl(
from var(--colors-palette-primary) h s 20
Expand Down
123 changes: 122 additions & 1 deletion packages/visual-editor/src/components/layoutBlocks/Grid.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,8 @@ const testAddress = {
postalCode: "11211",
region: "NY",
};

const rtfHtml =
'<div class="rtf-theme"><h1><span>Heading One — Lorem Ipsum</span></h1><h2><span>Heading Two — Lorem Ipsum</span></h2><p><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<strong>Lorem ipsum</strong> dolor sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. <strong>Lorem ipsum</strong> dolor sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<strong>Lorem ipsum</strong> dolor sit amet.</span></p><ul style="padding: 0; margin: 0; margin-left: 16px; list-style-type: disc; list-style-position: inside;"><li><span>Lorem ipsum dolor sit amet</span></li><li><span>Consectetur adipiscing elit</span></li></ul><p><span>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.<a href=\\"#\\">Lorem link</a></span></p></div>';
const tests: ComponentTest[] = [
{
name: "version 18 - atoms used to make a HeroSection",
Expand Down Expand Up @@ -1922,6 +1923,126 @@ const tests: ComponentTest[] = [
},
version: 50,
},
{
name: "version 49 - Body text - small variant",
document: {
address: testAddress,
id: "test-id",
name: "Galaxy Grill",
},
props: {
columns: 1,
slots: [
{
Column: [
{
type: "BodyText",
props: {
id: "BodyText-547941ef-1bc8-4e88-96e6-81b3b65a4f54",
data: {
text: {
field: "",
constantValue: {
en: {
html: rtfHtml,
},
hasLocalizedValue: "true",
},
constantValueEnabled: true,
},
},
styles: { variant: "sm" },
},
},
],
},
],
backgroundColor: { bgColor: "bg-white", textColor: "text-black" },
liveVisibility: true,
analytics: { scope: "gridSection" },
},
version: 49,
},
{
name: "version 49 - Body text - base variant",
document: {
address: testAddress,
id: "test-id",
name: "Galaxy Grill",
},
props: {
columns: 1,
slots: [
{
Column: [
{
type: "BodyText",
props: {
id: "BodyText-547941ef-1bc8-4e88-96e6-81b3b65a4f54",
data: {
text: {
field: "",
constantValue: {
en: {
html: rtfHtml,
},
hasLocalizedValue: "true",
},
constantValueEnabled: true,
},
},
styles: { variant: "base" },
},
},
],
},
],
backgroundColor: { bgColor: "bg-white", textColor: "text-black" },
liveVisibility: true,
analytics: { scope: "gridSection" },
},
version: 49,
},
{
name: "version 49 - Body text - large variant",
document: {
address: testAddress,
id: "test-id",
name: "Galaxy Grill",
},
props: {
columns: 1,
slots: [
{
Column: [
{
type: "BodyText",
props: {
id: "BodyText-547941ef-1bc8-4e88-96e6-81b3b65a4f54",
data: {
text: {
field: "",
constantValue: {
en: {
html: rtfHtml,
},
hasLocalizedValue: "true",
},
constantValueEnabled: true,
},
},
styles: { variant: "lg" },
},
},
],
},
],
backgroundColor: { bgColor: "bg-white", textColor: "text-black" },
liveVisibility: true,
analytics: { scope: "gridSection" },
},
version: 49,
},
];

describe("Grid", async () => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ const defaultEvent = {
dateTime: "2022-12-12T14:00:00",
description: {
en: getDefaultRTF(
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam."
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
),
hasLocalizedValue: "true",
},
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
12 changes: 6 additions & 6 deletions packages/visual-editor/src/vite-plugin/defaultLayoutData.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3074,8 +3074,8 @@ const mainDefaultLayout = {
field: "",
constantValue: {
en: {
json: '{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"paragraph","version":1}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}',
html: '<p dir="ltr" style="font-size: 14.67px; font-weight: 400; line-height: 18.67px; color: rgb(0, 0, 0); margin: 0; padding: 3px 2px 3px 2px; position: relative;"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</span></p>',
json: '{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"paragraph","version":1}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}',
html: '<p dir="ltr" style="font-size: 14.67px; font-weight: 400; line-height: 18.67px; color: rgb(0, 0, 0); margin: 0; padding: 3px 2px 3px 2px; position: relative;"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</span></p>',
},
hasLocalizedValue: "true",
},
Expand Down Expand Up @@ -3221,8 +3221,8 @@ const mainDefaultLayout = {
field: "",
constantValue: {
en: {
json: '{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"paragraph","version":1}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}',
html: '<p dir="ltr" style="font-size: 14.67px; font-weight: 400; line-height: 18.67px; color: rgb(0, 0, 0); margin: 0; padding: 3px 2px 3px 2px; position: relative;"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</span></p>',
json: '{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"paragraph","version":1}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}',
html: '<p dir="ltr" style="font-size: 14.67px; font-weight: 400; line-height: 18.67px; color: rgb(0, 0, 0); margin: 0; padding: 3px 2px 3px 2px; position: relative;"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</span></p>',
},
hasLocalizedValue: "true",
},
Expand Down Expand Up @@ -3368,8 +3368,8 @@ const mainDefaultLayout = {
field: "",
constantValue: {
en: {
json: '{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"paragraph","version":1}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}',
html: '<p dir="ltr" style="font-size: 14.67px; font-weight: 400; line-height: 18.67px; color: rgb(0, 0, 0); margin: 0; padding: 3px 2px 3px 2px; position: relative;"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</span></p>',
json: '{"root":{"children":[{"children":[{"detail":0,"format":0,"mode":"normal","style":"","text":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.","type":"text","version":1}],"direction":"ltr","format":"","indent":0,"type":"paragraph","version":1}],"direction":"ltr","format":"","indent":0,"type":"root","version":1}}',
html: '<p dir="ltr" style="font-size: 14.67px; font-weight: 400; line-height: 18.67px; color: rgb(0, 0, 0); margin: 0; padding: 3px 2px 3px 2px; position: relative;"><span>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</span></p>',
},
hasLocalizedValue: "true",
},
Expand Down