diff --git a/browser/components/migration/content/migration-wizard-constants.mjs b/browser/components/migration/content/migration-wizard-constants.mjs
index 74d20397cc90..38cd00026f8c 100644
--- a/browser/components/migration/content/migration-wizard-constants.mjs
+++ b/browser/components/migration/content/migration-wizard-constants.mjs
@@ -15,6 +15,7 @@ export const MigrationWizardConstants = Object.freeze({
SELECTION: "selection",
PROGRESS: "progress",
SAFARI_PERMISSION: "safari-permission",
+ SAFARI_PASSWORD_PERMISSION: "safari-password-permission",
NO_BROWSERS_FOUND: "no-browsers-found",
}),
diff --git a/browser/components/migration/content/migration-wizard.mjs b/browser/components/migration/content/migration-wizard.mjs
index dcc3f75360e6..ff2e71d7285f 100644
--- a/browser/components/migration/content/migration-wizard.mjs
+++ b/browser/components/migration/content/migration-wizard.mjs
@@ -115,6 +115,24 @@ export class MigrationWizard extends HTMLElement {
+
+
+
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+
diff --git a/browser/components/storybook/stories/migration-wizard.stories.mjs b/browser/components/storybook/stories/migration-wizard.stories.mjs
index 16db48a972d4..d83dbfea46fd 100644
--- a/browser/components/storybook/stories/migration-wizard.stories.mjs
+++ b/browser/components/storybook/stories/migration-wizard.stories.mjs
@@ -199,6 +199,14 @@ SafariPermissions.args = {
},
};
+export const SafariPasswordPermissions = Template.bind({});
+SafariPasswordPermissions.args = {
+ dialogMode: true,
+ state: {
+ page: MigrationWizardConstants.PAGES.SAFARI_PASSWORD_PERMISSION,
+ },
+};
+
export const NoBrowsersFound = Template.bind({});
NoBrowsersFound.args = {
dialogMode: true,
diff --git a/browser/locales-preview/migrationWizard.ftl b/browser/locales-preview/migrationWizard.ftl
index 9ee8f13891b3..167e75e3e602 100644
--- a/browser/locales-preview/migrationWizard.ftl
+++ b/browser/locales-preview/migrationWizard.ftl
@@ -82,6 +82,16 @@ migration-wizard-progress-icon-in-progress =
migration-wizard-progress-icon-completed =
.aria-label = Completed
+migration-safari-password-import-header = Import Passwords from Safari
+migration-safari-password-import-steps-header = To import Safari passwords:
+migration-safari-password-import-step1 = In Safari, open “Safari” menu and go to Preferences > Passwords
+migration-safari-password-import-step2 = Select the
button and choose “Export All Passwords”
+migration-safari-password-import-step3 = Save the passwords file
+migration-safari-password-import-step4 = Use “Select File” below to choose the passwords file you saved
+migration-safari-password-import-skip-button = Skip
+migration-safari-password-import-select-button = Select File
+
+
# Shown in the migration wizard after importing bookmarks from another
# browser has completed.
#
diff --git a/browser/themes/shared/jar.inc.mn b/browser/themes/shared/jar.inc.mn
index 0669c8c434c3..7a1dfd61ac86 100644
--- a/browser/themes/shared/jar.inc.mn
+++ b/browser/themes/shared/jar.inc.mn
@@ -73,6 +73,7 @@
skin/classic/browser/migration/migration-wizard.css (../shared/migration/migration-wizard.css)
skin/classic/browser/migration/success.svg (../shared/migration/success.svg)
skin/classic/browser/migration/progress-mask.svg (../shared/migration/progress-mask.svg)
+ skin/classic/browser/migration/safari-icon-3dots.svg (../shared/migration/safari-icon-3dots.svg)
skin/classic/browser/notification-icons/autoplay-media.svg (../shared/notification-icons/autoplay-media.svg)
skin/classic/browser/notification-icons/autoplay-media-blocked.svg (../shared/notification-icons/autoplay-media-blocked.svg)
skin/classic/browser/notification-icons/camera-blocked.svg (../shared/notification-icons/camera-blocked.svg)
diff --git a/browser/themes/shared/migration/migration-wizard.css b/browser/themes/shared/migration/migration-wizard.css
index 39d74c27d0fa..0556fa46b925 100644
--- a/browser/themes/shared/migration/migration-wizard.css
+++ b/browser/themes/shared/migration/migration-wizard.css
@@ -219,6 +219,25 @@ details:not([open]) summary {
margin-inline-end: 8px;
}
+.page-portrait-icon {
+ width: 16px;
+ height: 16px;
+ content: url("chrome://global/skin/icons/page-portrait.svg");
+ -moz-context-properties: fill;
+ fill: currentColor;
+ vertical-align: middle;
+}
+
+.safari-icon-3dots {
+ width: 16px;
+ height: 16px;
+ vertical-align: middle;
+ content: url("chrome://browser/skin/migration/safari-icon-3dots.svg");
+ -moz-context-properties: fill, stroke;
+ fill: currentColor;
+ stroke: color-mix(in srgb, currentColor 10%, transparent 90%);
+}
+
.no-browsers-found-message {
display: flex;
}
diff --git a/browser/themes/shared/migration/safari-icon-3dots.svg b/browser/themes/shared/migration/safari-icon-3dots.svg
new file mode 100644
index 000000000000..df255b184fb2
--- /dev/null
+++ b/browser/themes/shared/migration/safari-icon-3dots.svg
@@ -0,0 +1,7 @@
+
+