fix: Library 1.1

[auniverseaway]

Performance

• Delay da-library.js until Prose is ready
• Reduced da-library.js by ~100 lines
• Reduced da-library.css by ~300 lines

Complexity

• Simplified approach to search
• Simplified and standardized approach to dialogs
• Simplified approach to library loading
• Removed file-based / sk-based library support
• Simplified approach to preview handling
• Standardized on existing lazy patterns
• Standardized on existing render patterns for async objects
• Removed all async render functions (remove until)
• Rewrote all CSS from the ground up
• Standardized on "OOTB Plugins" vs "BYO Plugins" within library

User experience

• Updated to Spectrum 2 Icons
• Icons now properly change color on hover
• Search improvements
• Improved when scrollbars appear
• Improved close library button
• General fit & finish improvements
• Reduced overall font size

Bug fixes

• Fixed plugin rendering being clobbered by async renders
• Fixed plugin icon in dialog being broken if one was not set
• Fixed Grammarly breaking palettes

Not in scope

• Move to sl-dialog for dialogs
• More consistency with naming conventions
• Fit and finish issues: templates, icons, placeholder lists are "meh"
• Support generic lists

Resolves: #807

Related Issue

Motivation and Context

How Has This Been Tested?

End 2 end

https://libref--da-live--adobe.aem.live/edit#/aem-sandbox/block-collection/drafts/cmillar/demo-lib

1. Open page - observe da-library.js (and dependencies) are only loaded after prose is fully loaded.
2. Click Library - observe new icons, small font, search is still first focus item, search icon now blue on focus
3. Hover item (blocks) - observe icon changes color (previously did not)
4. Click blocks - observe ux consistency: spacing, icons, hover states
5. Click preview on accordion block - Preview dialog shows
6. Expand "accordion" block - observe info icon (tooltip) in variation to toggle description
7. Click add experience button - block is placed in document
8. Click preview on embed block - Preview dialog warns the doc has not been previewed
9. Back (to main menu) > Templates > Homepage > Click Add Experience - Inserts into doc
10. Templates > Homepage > Click Preview - Dialog preview loads
11. Templates > Nothing here > preview - Dialog warns this has not been previewed
12. Icons > Search > Click - inserts into document :search:
13. Placeholders > hello > Click - inserts into document {{hello}}
14. AEM Assets > Click - Opens AEM dialog (actual access may not be granted depending on tester)
15. Generate Variations > Click - Opens new window
16. Generate Tabs > Click - Inline library plugin
17. Generate Tabs pane > Click generate tags > Save - Pushes metadata block to document
18. Generate Tabs (dialog) > Click - Dialog library plugin
19. Generate Tabs (fullsize dialog) > Click - Fullsize dialog library plugin
20. Main Menu > Search > "acc" - Block
21. Main Menu > Search > "home" - Template
22. Main Menu > Search > "hell" - Placeholder
23. Main Menu > Search > "search" - Icon
24. Main Menu > Search > "ass" - AEM Assets
25. Main Menu > Search > "Generate" - Plugins

Screenshots (if appropriate):

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

• I have signed the Adobe Open Source CLA.
• My code follows the code style of this project.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have read the CONTRIBUTING document.
• I have added tests to cover my changes.
• All new and existing tests passed.

[aem-code-sync]

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch and validate page speed.
In case there are problems, just click a checkbox below to rerun the respective action.

• Re-run PSI checks
• Re-sync branch

Commits

• 685d82b ✅ (latest)

[usman-khalid]

@auniverseaway — may want to update the test URL in the PR description. libmerge seems to be an older branch where OOTB plugins are broken (spent some time debugging before realizing the branch is actually called libref)