diff --git a/addons/rose/addon/components/rose/dialog/cover/index.hbs b/addons/rose/addon/components/rose/dialog/cover/index.hbs
new file mode 100644
index 000000000..4d56b0d2d
--- /dev/null
+++ b/addons/rose/addon/components/rose/dialog/cover/index.hbs
@@ -0,0 +1,21 @@
+
+
+
+
+
+ {{yield to="body"}}
+
+
diff --git a/addons/rose/addon/components/rose/dialog/cover/index.stories.mdx b/addons/rose/addon/components/rose/dialog/cover/index.stories.mdx
new file mode 100644
index 000000000..825bd4d80
--- /dev/null
+++ b/addons/rose/addon/components/rose/dialog/cover/index.stories.mdx
@@ -0,0 +1,42 @@
+
+import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';
+import { hbs } from 'ember-cli-htmlbars';
+import { action } from '@storybook/addon-actions';
+
+
+
+# Dialog Cover
+
+A template-only dialog component that covers the viewport and accepts arbitrary
+content. Note that this component is unique to Boundary and is not part of the
+Structure design system.
+
+Prerequisite: `ember-named-blocks-polyfill` must be installed in your app's
+`dependencies` rather than `devDependencies`.
+
+
+ {{
+ template: hbs`
+
+ <:header>
+ Cover Header
+
+ <:body>
+ Cover body
+
+
+ `
+ }}
+
+
+
+```htmlbars
+
+ <:header>
+ Cover Header
+
+ <:body>
+ Cover body
+
+
+```
diff --git a/addons/rose/addon/styles/rose/components/dialog/_cover.scss b/addons/rose/addon/styles/rose/components/dialog/_cover.scss
new file mode 100644
index 000000000..04ea3d566
--- /dev/null
+++ b/addons/rose/addon/styles/rose/components/dialog/_cover.scss
@@ -0,0 +1,34 @@
+.rose-dialog-cover {
+ position: fixed;
+ top: 0;
+ width: 100vw;
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ color: var(--white);
+ text-align: center;
+
+ a {
+ color: var(--white);
+ }
+
+ .rose-dialog-cover-header,
+ .rose-dialog-cover-body {
+ max-width: 650px;
+ }
+}
+// overlay
+.rose-dialog-cover-modal-overlay {
+ content: ' ';
+ background-color: var(--black);
+ width: 100vw;
+ height: 100vh;
+ position: fixed;
+ left: 0;
+ top: 0;
+ bottom: 0;
+ right: 0;
+ opacity: 0.85;
+}
diff --git a/addons/rose/addon/styles/rose/components/_dialog.scss b/addons/rose/addon/styles/rose/components/dialog/_dialog.scss
similarity index 97%
rename from addons/rose/addon/styles/rose/components/_dialog.scss
rename to addons/rose/addon/styles/rose/components/dialog/_dialog.scss
index 677af2bfc..be87d0b07 100644
--- a/addons/rose/addon/styles/rose/components/_dialog.scss
+++ b/addons/rose/addon/styles/rose/components/dialog/_dialog.scss
@@ -1,6 +1,6 @@
-@use '../variables/sizing';
-@use '../utilities/type';
-@use '../variables/media';
+@use '../../variables/sizing';
+@use '../../utilities/type';
+@use '../../variables/media';
$m: sizing.rems(m); // 16
$s: sizing.rems(s); // 12
diff --git a/addons/rose/addon/styles/rose/components/dialog/_index.scss b/addons/rose/addon/styles/rose/components/dialog/_index.scss
new file mode 100644
index 000000000..6b25fcfce
--- /dev/null
+++ b/addons/rose/addon/styles/rose/components/dialog/_index.scss
@@ -0,0 +1,2 @@
+@import 'cover';
+@import 'dialog';
diff --git a/addons/rose/app/components/rose/dialog/cover.js b/addons/rose/app/components/rose/dialog/cover.js
new file mode 100644
index 000000000..f4b33fe7f
--- /dev/null
+++ b/addons/rose/app/components/rose/dialog/cover.js
@@ -0,0 +1 @@
+export { default } from 'rose/components/rose/dialog/cover';
diff --git a/addons/rose/package.json b/addons/rose/package.json
index 14930a8fb..c26480a79 100644
--- a/addons/rose/package.json
+++ b/addons/rose/package.json
@@ -33,6 +33,7 @@
"ember-cli-babel": "^7.23.0",
"ember-cli-htmlbars": "^5.3.1",
"ember-focus-trap": "^0.4.0",
+ "ember-named-blocks-polyfill": "^0.2.4",
"ember-radio-button": "^2.0.1",
"ember-uuid": "^2.1.0",
"emberx-select": "github:adopted-ember-addons/emberx-select#bc5f774",
diff --git a/addons/rose/tests/dummy/app/templates/index.hbs b/addons/rose/tests/dummy/app/templates/index.hbs
index be1b76d79..8bb8b116d 100644
--- a/addons/rose/tests/dummy/app/templates/index.hbs
+++ b/addons/rose/tests/dummy/app/templates/index.hbs
@@ -28,17 +28,66 @@
-
+
+ Menu item
+ Menu item - danger
+
+
+ Button menu item
+ Button - danger
+
+
+
+ Menu item
+
+
+
+
+ Menu item
+ Button menu item
+
+
+
+
+
+
+ -
+
+
+
+
+ -
+
+
+
+
+ -
+
+
+
+
+
+
+
+
+
+
+
<:header>
- Rose Frame Header
+ Authentication Pending
<:body>
- Rose Frame Body
-
-
- Text
- Text
- Text
-
+ Complete authentication in the newly-opened window.
+ Don't see the new window? Try again.
+ Cancel
-
+
diff --git a/addons/rose/tests/integration/components/rose/dialog/cover-test.js b/addons/rose/tests/integration/components/rose/dialog/cover-test.js
new file mode 100644
index 000000000..ea9a44f76
--- /dev/null
+++ b/addons/rose/tests/integration/components/rose/dialog/cover-test.js
@@ -0,0 +1,29 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render, find } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Component | rose/dialog/cover', function (hooks) {
+ setupRenderingTest(hooks);
+
+ test('it renders', async function (assert) {
+ assert.expect(3);
+
+ await render(hbs`
+
+ <:header>
+ Authentication Pending
+
+ <:body>
+ Complete authentication in the newly-opened window.
+ Don't see the new window? Try again.
+ Cancel
+
+
+ `);
+
+ assert.ok(find('.rose-dialog-cover'));
+ assert.ok(find('.rose-dialog-cover-header'));
+ assert.ok(find('.rose-dialog-cover-body'));
+ });
+});
diff --git a/yarn.lock b/yarn.lock
index 4b6994ddd..227033b3a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6295,9 +6295,9 @@ caniuse-api@^3.0.0:
lodash.uniq "^4.5.0"
caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000844, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001125, caniuse-lite@^1.0.30001157, caniuse-lite@^1.0.30001181:
- version "1.0.30001207"
- resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001207.tgz#364d47d35a3007e528f69adb6fecb07c2bb2cc50"
- integrity sha512-UPQZdmAsyp2qfCTiMU/zqGSWOYaY9F9LL61V8f+8MrubsaDGpaHD9HRV/EWZGULZn0Hxu48SKzI5DgFwTvHuYw==
+ version "1.0.30001208"
+ resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001208.tgz#a999014a35cebd4f98c405930a057a0d75352eb9"
+ integrity sha512-OE5UE4+nBOro8Dyvv0lfx+SRtfVIOM9uhKqFmJeUbGriqhhStgp1A0OyBpgy3OUF8AhYCT+PVwPC1gMl2ZcQMA==
capture-exit@^2.0.0:
version "2.0.0"
@@ -11987,11 +11987,16 @@ homedir-polyfill@^1.0.1:
dependencies:
parse-passwd "^1.0.0"
-hosted-git-info@^2.1.4, hosted-git-info@^2.7.1, hosted-git-info@^2.8.8:
+hosted-git-info@^2.1.4, hosted-git-info@^2.7.1:
version "2.8.8"
resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.8.tgz#7539bd4bc1e0e0a895815a2e0262420b12858488"
integrity sha512-f/wzC2QaWBs7t9IYqB4T3sR1xviIViXJRJTWBlx2Gf3g0Xi5vI7Yy4koXQ1c9OYDGHN9sBy1DQ2AB8fqZBWhUg==
+hosted-git-info@^2.8.8:
+ version "2.8.9"
+ resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.8.9.tgz#dffc0bf9a21c02209090f2aa69429e1414daf3f9"
+ integrity sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==
+
hosted-git-info@^3.0.2:
version "3.0.8"
resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-3.0.8.tgz#6e35d4cc87af2c5f816e4cb9ce350ba87a3f370d"
@@ -19413,7 +19418,14 @@ sshpk@^1.7.0:
safer-buffer "^2.0.2"
tweetnacl "~0.14.0"
-ssri@^6.0.0, ssri@^6.0.1:
+ssri@^6.0.0:
+ version "6.0.2"
+ resolved "https://registry.yarnpkg.com/ssri/-/ssri-6.0.2.tgz#157939134f20464e7301ddba3e90ffa8f7728ac5"
+ integrity sha512-cepbSq/neFK7xB6A50KHN0xHDotYzq58wWCa5LeWqnPrHG8GzfEjO/4O8kpmcGW+oaxkvhEJCWgbgNk4/ZV93Q==
+ dependencies:
+ figgy-pudding "^3.5.1"
+
+ssri@^6.0.1:
version "6.0.1"
resolved "https://registry.yarnpkg.com/ssri/-/ssri-6.0.1.tgz#2a3c41b28dd45b62b63676ecb74001265ae9edd8"
integrity sha512-3Wge10hNcT1Kur4PDFwEieXSCMCJs/7WvSACcrMYrNp+b8kDL1/0wJch5Ni2WrtwEa2IO8OsVfeKIciKCDx/QA==