Feat/fullscreen takeover #2218

bsahitya · 2024-08-05T19:33:28Z

Description

Add a new web component called Fullscreen Takeover.
It uses the cv-dialog component internally.

What's included?

Fullscreen takeover component with a default slot for content.
Includes the below properties:
- open: Toggles the component open/close
- helpOpen: Toggles the help section open/close
- helpResizable: Whether the help section is resizable
- escapeKeyAction: Action to be taken when escape is pressed ('close` is the default action)
Includes a slot for help section.
Ability to resize the help section

Test Steps

npm run storybook
Navigate to the Fullscreen Takeover story
Play around with the properties

General Tests for Every PR

npm run start still works.
npm run lint passes.
npm run stylelint passes.
npm test passes and code coverage is not lower.
npm run build still works.

Screenshots or link to StackBlitz/Plunker

* feat(theme): styling and spacing tweaks to overall frame * feat(theme): adjust spacing of subnav items * fix(theme): make surface- and on- colors more blue * fix(styles): move default header color styles to typography component * fix(styles): correct accidental horizontal scrolling in help panel

…into blocks to match the other top level pages. - Adam

Co-authored-by: knapsack-cloud[bot] <57459571+knapsack-cloud[bot]@users.noreply.github.com>

)

Bumps [axios](https://github.com/axios/axios) from 1.6.7 to 1.7.4. - [Release notes](https://github.com/axios/axios/releases) - [Changelog](https://github.com/axios/axios/blob/v1.x/CHANGELOG.md) - [Commits](axios/axios@v1.6.7...v1.7.4) --- updated-dependencies: - dependency-name: axios dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

--------- Co-authored-by: Josh Mabry <[email protected]>

Bumps [body-parser](https://github.com/expressjs/body-parser) and [express](https://github.com/expressjs/express). These dependencies needed to be updated together. Updates `body-parser` from 1.20.2 to 1.20.3 - [Release notes](https://github.com/expressjs/body-parser/releases) - [Changelog](https://github.com/expressjs/body-parser/blob/master/HISTORY.md) - [Commits](expressjs/body-parser@1.20.2...1.20.3) Updates `express` from 4.19.2 to 4.21.0 - [Release notes](https://github.com/expressjs/express/releases) - [Changelog](https://github.com/expressjs/express/blob/4.21.0/History.md) - [Commits](expressjs/express@4.19.2...4.21.0) --- updated-dependencies: - dependency-name: body-parser dependency-type: indirect - dependency-name: express dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

Bumps [send](https://github.com/pillarjs/send) and [express](https://github.com/expressjs/express). These dependencies needed to be updated together. Updates `send` from 0.18.0 to 0.19.0 - [Release notes](https://github.com/pillarjs/send/releases) - [Changelog](https://github.com/pillarjs/send/blob/master/HISTORY.md) - [Commits](pillarjs/send@0.18.0...0.19.0) Updates `express` from 4.19.2 to 4.21.0 - [Release notes](https://github.com/expressjs/express/releases) - [Changelog](https://github.com/expressjs/express/blob/4.21.0/History.md) - [Commits](expressjs/express@4.19.2...4.21.0) --- updated-dependencies: - dependency-name: send dependency-type: indirect - dependency-name: express dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

Bumps [path-to-regexp](https://github.com/pillarjs/path-to-regexp) and [express](https://github.com/expressjs/express). These dependencies needed to be updated together. Updates `path-to-regexp` from 0.1.7 to 0.1.10 - [Release notes](https://github.com/pillarjs/path-to-regexp/releases) - [Changelog](https://github.com/pillarjs/path-to-regexp/blob/master/History.md) - [Commits](pillarjs/path-to-regexp@v0.1.7...v0.1.10) Updates `express` from 4.19.2 to 4.21.0 - [Release notes](https://github.com/expressjs/express/releases) - [Changelog](https://github.com/expressjs/express/blob/4.21.0/History.md) - [Commits](expressjs/express@4.19.2...4.21.0) --- updated-dependencies: - dependency-name: path-to-regexp dependency-type: indirect - dependency-name: express dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

Bumps [serve-static](https://github.com/expressjs/serve-static) and [express](https://github.com/expressjs/express). These dependencies needed to be updated together. Updates `serve-static` from 1.15.0 to 1.16.2 - [Release notes](https://github.com/expressjs/serve-static/releases) - [Changelog](https://github.com/expressjs/serve-static/blob/v1.16.2/HISTORY.md) - [Commits](expressjs/serve-static@v1.15.0...v1.16.2) Updates `express` from 4.19.2 to 4.21.0 - [Release notes](https://github.com/expressjs/express/releases) - [Changelog](https://github.com/expressjs/express/blob/4.21.0/History.md) - [Commits](expressjs/express@4.19.2...4.21.0) --- updated-dependencies: - dependency-name: serve-static dependency-type: indirect - dependency-name: express dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

Co-authored-by: knapsack-cloud[bot] <57459571+knapsack-cloud[bot]@users.noreply.github.com>

Bumps [vite](https://github.com/vitejs/vite/tree/HEAD/packages/vite) from 4.5.3 to 4.5.5. - [Release notes](https://github.com/vitejs/vite/releases) - [Changelog](https://github.com/vitejs/vite/blob/v4.5.5/packages/vite/CHANGELOG.md) - [Commits](https://github.com/vitejs/vite/commits/v4.5.5/packages/vite) --- updated-dependencies: - dependency-name: vite dependency-type: direct:development ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

Co-authored-by: knapsack-cloud[bot] <57459571+knapsack-cloud[bot]@users.noreply.github.com>

Co-authored-by: github-actions <[email protected]>

…Ellen Matthews (#2256)

* feat(user-menu): fixed styles for user menu profile --------- Co-authored-by: github-actions <[email protected]>

Bumps [cookie](https://github.com/jshttp/cookie) and [express](https://github.com/expressjs/express). These dependencies needed to be updated together. Updates `cookie` from 0.6.0 to 0.7.1 - [Release notes](https://github.com/jshttp/cookie/releases) - [Commits](jshttp/cookie@v0.6.0...v0.7.1) Updates `express` from 4.21.0 to 4.21.1 - [Release notes](https://github.com/expressjs/express/releases) - [Changelog](https://github.com/expressjs/express/blob/4.21.1/History.md) - [Commits](expressjs/express@4.21.0...4.21.1) --- updated-dependencies: - dependency-name: cookie dependency-type: indirect - dependency-name: express dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

adamnel · 2024-10-29T14:55:59Z

@bsahitya I'd like to know how this matches up with the separated patterns we ended up with on the design side:

Focused page, which is an actual full page, and
Full-screen dialog, which is an overlay on the current page, just... really big

Does this pattern cover both? I'd like to keep naming exact all the way through from design to code

bsahitya · 2024-10-29T15:26:00Z

@adamnel This PR only covers the full-screen dialog. We still need to add the focused page.
I started working on it today. I will probably close this PR and create a new one with all the changes.

To keep the naming consistent with design, would it make sense to create a separate component for the focused page?
@owilliams320 what do you think?

Figma link for reference.

bsahitya added 2 commits August 2, 2024 16:31

feat(fullscreen-takeover): add fullscreen takeover web component

afce3f3

fix(fullscreen-takeover): add helper comments

ae325a8

bsahitya requested review from owilliams320 and adamnel August 5, 2024 21:17

adamnel and others added 26 commits October 29, 2024 09:46

feat(components): optimizing the main theme file (#2210)

6ba8b7e

ci(release): 8.17.0 [skip ci]

7f704eb

fix(tokens): update tokens to latest (#2211)

6f370c0

ci(release): 8.17.1 [skip ci]

eb835d0

Add status sets - Adam

51c5bb2

Improved token type descriptions. Move links on content landing page …

bdd36fb

…into blocks to match the other top level pages. - Adam

Removed duplicate "content" status set - Adam

a677fbc

Add split button stub - Adam

99e1d41

feat(components): animations for app shell navigation (#2216)

46f06dd

ci(release): 8.18.0 [skip ci]

cfa76ff

Stubbed out action ribbon demos - Adam (#2215)

2e13485

Co-authored-by: knapsack-cloud[bot] <57459571+knapsack-cloud[bot]@users.noreply.github.com>

fix(tokens): adding index as pkg.json export (#2219)

148e4c8

ci(release): 8.18.1 [skip ci]

21bbcee

feat(notebook-cell): add code editor and notebook cell components (#2220

349c989

)

ci(release): 8.19.0 [skip ci]

b960a42

fix(styles): correct persistent unneeded vertical scrollbar (#2221)

2ef2bbe

ci(release): 8.19.1 [skip ci]

ceb6eb0

Update covalent-m3.json

f40966d

docs(knapsack): update design tokens

d588b31

feat(flavored-markdown): add support for file url clicks (#2225)

7b19645

ci(release): 8.20.0 [skip ci]

9230c36

fix(notebook-cell): prevent shift+enter action in cell editor (#2226)

a5cbb80

ci(release): 8.20.1 [skip ci]

e383a31

Increase homepage link tile header sizes - Adam

7dfe08d

bsahitya and others added 27 commits October 29, 2024 09:46

fix(breadcrumbs): fix rendering issues on load (#2239)

4bdb45a

ci(release): 8.20.7 [skip ci]

c6315c1

fix(styles): add covalent theming to angular code editor (#2241)

6b90e0a

ci(release): 8.20.8 [skip ci]

1cee6f4

Feat/knapsack renderer (#2240)

eb90dcb

--------- Co-authored-by: Josh Mabry <[email protected]>

feat(email-templates): library and app for email generation (#2243)

0cea9be

ci(release): 8.21.0 [skip ci]

1093584

fix(button): change button text to sentence case

2109a3a

fix(button): change button text in flavored markdown

aa2f670

ci(release): 8.21.1 [skip ci]

085fc27

Video: complete draft - null null (#2250)

f080f11

Co-authored-by: knapsack-cloud[bot] <57459571+knapsack-cloud[bot]@users.noreply.github.com>

Fixed a typo - null null (#2251)

a13ec82

Co-authored-by: knapsack-cloud[bot] <57459571+knapsack-cloud[bot]@users.noreply.github.com>

Update the brand guidelines link - null null (#2252)

e27832a

Co-authored-by: knapsack-cloud[bot] <57459571+knapsack-cloud[bot]@users.noreply.github.com>

build(nx): remove nx cloud token (#2254)

beabd9a

Co-authored-by: github-actions <[email protected]>

build(knapsack): update knapsack and enable prototyping (#2253)

1387bf6

Co-authored-by: github-actions <[email protected]>

enable web components prototyping - oseer

729db0b

Adjustments to considering users' feelings and tone spectrum - Mary …

62ccccc

…Ellen Matthews (#2256)

fix(code-editor): add disable scroll option for code editor (#2258)

3e8584d

ci(release): 8.21.2 [skip ci]

397c50a

feat(user-menu): fixed styles for user menu profile (#2259)

a16edae

* feat(user-menu): fixed styles for user menu profile --------- Co-authored-by: github-actions <[email protected]>

ci(release): 8.22.0 [skip ci]

79141ad

bsahitya closed this Oct 29, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feat/fullscreen takeover #2218

Feat/fullscreen takeover #2218

bsahitya commented Aug 5, 2024

adamnel commented Oct 29, 2024 •

edited

Loading

bsahitya commented Oct 29, 2024

Feat/fullscreen takeover #2218

Feat/fullscreen takeover #2218

Conversation

bsahitya commented Aug 5, 2024

Description

What's included?

Test Steps

General Tests for Every PR

Screenshots or link to StackBlitz/Plunker

adamnel commented Oct 29, 2024 • edited Loading

bsahitya commented Oct 29, 2024

adamnel commented Oct 29, 2024 •

edited

Loading