chrome-devtools-frontend 1.0.943986 → 1.0.945579
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/config/gni/devtools_grd_files.gni +4 -0
- package/config/gni/devtools_image_files.gni +1 -0
- package/front_end/Images/src/circled_exclamation_icon.svg +3 -0
- package/front_end/core/common/ParsedURL.ts +1 -1
- package/front_end/core/host/UserMetrics.ts +2 -1
- package/front_end/core/i18n/i18nImpl.ts +7 -4
- package/front_end/core/i18n/locales/en-US.json +3 -72
- package/front_end/core/i18n/locales/en-XL.json +15 -84
- package/front_end/core/protocol_client/NodeURL.ts +1 -0
- package/front_end/core/sdk/CSSMetadata.ts +0 -1
- package/front_end/core/sdk/CSSStyleDeclaration.ts +4 -0
- package/front_end/core/sdk/CSSStyleSheetHeader.ts +2 -3
- package/front_end/core/sdk/CompilerSourceMappingContentProvider.ts +2 -3
- package/front_end/core/sdk/Cookie.ts +17 -0
- package/front_end/core/sdk/CookieModel.ts +1 -0
- package/front_end/core/sdk/DebuggerModel.ts +5 -4
- package/front_end/core/sdk/NetworkManager.ts +4 -1
- package/front_end/core/sdk/NetworkRequest.ts +2 -2
- package/front_end/core/sdk/OverlayModel.ts +0 -9
- package/front_end/core/sdk/Resource.ts +2 -2
- package/front_end/core/sdk/Script.ts +2 -3
- package/front_end/core/sdk/sdk-meta.ts +0 -26
- package/front_end/entrypoints/inspector_main/RenderingOptions.ts +0 -13
- package/front_end/entrypoints/main/MainImpl.ts +4 -0
- package/front_end/generated/protocol.d.ts +0 -4
- package/front_end/models/bindings/BreakpointManager.ts +3 -4
- package/front_end/models/bindings/ResourceMapping.ts +1 -2
- package/front_end/models/bindings/StylesSourceMapping.ts +1 -2
- package/front_end/models/emulation/EmulatedDevices.ts +2 -4
- package/front_end/models/persistence/IsolatedFileSystem.ts +7 -6
- package/front_end/models/persistence/PersistenceActions.ts +4 -1
- package/front_end/models/persistence/PlatformFileSystem.ts +3 -4
- package/front_end/models/text_utils/ContentProvider.ts +1 -2
- package/front_end/models/text_utils/StaticContentProvider.ts +2 -3
- package/front_end/models/workspace/UISourceCode.ts +2 -2
- package/front_end/models/workspace_diff/WorkspaceDiff.ts +20 -6
- package/front_end/panels/animation/animationTimeline.css +2 -0
- package/front_end/panels/application/BackForwardCacheStrings.ts +15 -75
- package/front_end/panels/application/BackForwardCacheView.ts +8 -1
- package/front_end/panels/application/ReportingApiView.ts +15 -1
- package/front_end/panels/application/components/EndpointsGrid.ts +63 -4
- package/front_end/panels/application/components/FrameDetailsView.ts +21 -34
- package/front_end/panels/changes/ChangesView.ts +8 -7
- package/front_end/panels/console/ConsolePinPane.ts +1 -0
- package/front_end/panels/console/ConsolePrompt.ts +121 -171
- package/front_end/panels/console/ConsoleView.ts +1 -1
- package/front_end/panels/console/consoleView.css +1 -1
- package/front_end/panels/css_overview/cssOverviewCompletedView.css +2 -2
- package/front_end/panels/elements/AccessibilityTreeUtils.ts +2 -1
- package/front_end/panels/elements/ElementsTreeElement.ts +1 -0
- package/front_end/panels/elements/StyleEditorWidget.ts +13 -2
- package/front_end/panels/elements/StylePropertyHighlighter.ts +29 -19
- package/front_end/panels/elements/StylePropertyTreeElement.ts +8 -12
- package/front_end/panels/elements/StylesSidebarPane.ts +36 -10
- package/front_end/panels/elements/components/AccessibilityTreeNode.ts +27 -3
- package/front_end/panels/emulation/DeviceModeView.ts +3 -0
- package/front_end/panels/help/ReleaseNoteText.ts +3 -1
- package/front_end/panels/network/NetworkDataGridNode.ts +5 -1
- package/front_end/panels/snippets/ScriptSnippetFileSystem.ts +1 -1
- package/front_end/panels/sources/BreakpointEditDialog.ts +1 -0
- package/front_end/panels/sources/DebuggerPlugin.ts +1 -1
- package/front_end/panels/sources/NavigatorView.ts +1 -1
- package/front_end/panels/sources/UISourceCodeFrame.ts +0 -1
- package/front_end/panels/timeline/TimelineFlameChartDataProvider.ts +3 -34
- package/front_end/panels/timeline/TimelineUIUtils.ts +51 -3
- package/front_end/services/window_bounds/WindowBoundsService.ts +27 -0
- package/front_end/services/window_bounds/window_bounds.ts +9 -0
- package/front_end/third_party/acorn/README.chromium +2 -2
- package/front_end/third_party/acorn/acorn.ts +1 -1
- package/front_end/third_party/acorn/package/CHANGELOG.md +31 -1
- package/front_end/third_party/acorn/package/README.md +1 -1
- package/front_end/third_party/acorn/package/dist/acorn.d.ts +3 -0
- package/front_end/third_party/acorn/package/dist/acorn.js +772 -708
- package/front_end/third_party/acorn/package/dist/acorn.mjs +767 -703
- package/front_end/third_party/acorn/package/dist/bin.js +47 -21
- package/front_end/third_party/acorn/package/package.json +1 -1
- package/front_end/third_party/acorn-loose/README.chromium +2 -2
- package/front_end/third_party/acorn-loose/package/CHANGELOG.md +12 -0
- package/front_end/third_party/acorn-loose/package/dist/acorn-loose.js +27 -7
- package/front_end/third_party/acorn-loose/package/dist/acorn-loose.mjs +28 -8
- package/front_end/third_party/acorn-loose/package/package.json +2 -2
- package/front_end/third_party/codemirror.next/bundle.ts +4 -3
- package/front_end/third_party/codemirror.next/chunk/codemirror.js +1 -1
- package/front_end/third_party/codemirror.next/codemirror.next.d.ts +39 -1
- package/front_end/third_party/codemirror.next/codemirror.next.js +1 -1
- package/front_end/third_party/codemirror.next/package.json +4 -4
- package/front_end/third_party/i18n/i18n-impl.ts +1 -1
- package/front_end/third_party/lit-html/README.chromium +2 -2
- package/front_end/third_party/lit-html/package/CHANGELOG.md +216 -28
- package/front_end/third_party/lit-html/package/LICENSE +9 -9
- package/front_end/third_party/lit-html/package/README.md +12 -162
- package/front_end/third_party/lit-html/package/async-directive.d.ts +23 -54
- package/front_end/third_party/lit-html/package/async-directive.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/async-directive.js +2 -7
- package/front_end/third_party/lit-html/package/async-directive.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/async-directive.d.ts +23 -54
- package/front_end/third_party/lit-html/package/development/async-directive.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/async-directive.js +44 -194
- package/front_end/third_party/lit-html/package/development/async-directive.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directive-helpers.d.ts +6 -5
- package/front_end/third_party/lit-html/package/development/directive-helpers.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directive-helpers.js +25 -9
- package/front_end/third_party/lit-html/package/development/directive-helpers.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directive.d.ts +3 -16
- package/front_end/third_party/lit-html/package/development/directive.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directive.js +6 -1
- package/front_end/third_party/lit-html/package/development/directive.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/async-append.d.ts +7 -14
- package/front_end/third_party/lit-html/package/development/directives/async-append.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/async-append.js +17 -58
- package/front_end/third_party/lit-html/package/development/directives/async-append.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/async-replace.d.ts +9 -14
- package/front_end/third_party/lit-html/package/development/directives/async-replace.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/async-replace.js +57 -37
- package/front_end/third_party/lit-html/package/development/directives/async-replace.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/cache.d.ts +2 -3
- package/front_end/third_party/lit-html/package/development/directives/cache.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/cache.js +4 -6
- package/front_end/third_party/lit-html/package/development/directives/cache.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/class-map.d.ts +2 -2
- package/front_end/third_party/lit-html/package/development/directives/class-map.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/class-map.js +17 -7
- package/front_end/third_party/lit-html/package/development/directives/class-map.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/guard.d.ts +3 -2
- package/front_end/third_party/lit-html/package/development/directives/guard.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/guard.js +3 -2
- package/front_end/third_party/lit-html/package/development/directives/guard.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/live.d.ts +4 -3
- package/front_end/third_party/lit-html/package/development/directives/live.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/live.js +5 -7
- package/front_end/third_party/lit-html/package/development/directives/live.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/private-async-helpers.d.ts +58 -0
- package/front_end/third_party/lit-html/package/development/directives/private-async-helpers.d.ts.map +1 -0
- package/front_end/third_party/lit-html/package/development/directives/private-async-helpers.js +85 -0
- package/front_end/third_party/lit-html/package/development/directives/private-async-helpers.js.map +1 -0
- package/front_end/third_party/lit-html/package/development/directives/ref.d.ts +14 -11
- package/front_end/third_party/lit-html/package/development/directives/ref.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/ref.js +13 -11
- package/front_end/third_party/lit-html/package/development/directives/ref.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/repeat.d.ts +8 -4
- package/front_end/third_party/lit-html/package/development/directives/repeat.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/repeat.js +23 -9
- package/front_end/third_party/lit-html/package/development/directives/repeat.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/style-map.d.ts +1 -2
- package/front_end/third_party/lit-html/package/development/directives/style-map.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/style-map.js +1 -2
- package/front_end/third_party/lit-html/package/development/directives/style-map.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/template-content.d.ts +1 -2
- package/front_end/third_party/lit-html/package/development/directives/template-content.js +1 -2
- package/front_end/third_party/lit-html/package/development/directives/unsafe-html.d.ts +6 -4
- package/front_end/third_party/lit-html/package/development/directives/unsafe-html.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/unsafe-html.js +7 -5
- package/front_end/third_party/lit-html/package/development/directives/unsafe-html.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/unsafe-svg.d.ts +4 -1
- package/front_end/third_party/lit-html/package/development/directives/unsafe-svg.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/unsafe-svg.js +3 -0
- package/front_end/third_party/lit-html/package/development/directives/unsafe-svg.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/until.d.ts +12 -8
- package/front_end/third_party/lit-html/package/development/directives/until.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/directives/until.js +63 -23
- package/front_end/third_party/lit-html/package/development/directives/until.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/experimental-hydrate.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/experimental-hydrate.js +9 -8
- package/front_end/third_party/lit-html/package/development/experimental-hydrate.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/lit-html.d.ts +81 -136
- package/front_end/third_party/lit-html/package/development/lit-html.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/lit-html.js +249 -76
- package/front_end/third_party/lit-html/package/development/lit-html.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/polyfill-support.d.ts +1 -41
- package/front_end/third_party/lit-html/package/development/polyfill-support.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/polyfill-support.js +40 -21
- package/front_end/third_party/lit-html/package/development/polyfill-support.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/private-ssr-support.d.ts +12 -10
- package/front_end/third_party/lit-html/package/development/private-ssr-support.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/private-ssr-support.js +11 -3
- package/front_end/third_party/lit-html/package/development/private-ssr-support.js.map +1 -1
- package/front_end/third_party/lit-html/package/development/static.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/development/static.js +6 -5
- package/front_end/third_party/lit-html/package/development/static.js.map +1 -1
- package/front_end/third_party/lit-html/package/directive-helpers.d.ts +6 -5
- package/front_end/third_party/lit-html/package/directive-helpers.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directive-helpers.js +2 -2
- package/front_end/third_party/lit-html/package/directive-helpers.js.map +1 -1
- package/front_end/third_party/lit-html/package/directive.d.ts +3 -16
- package/front_end/third_party/lit-html/package/directive.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directive.js +1 -1
- package/front_end/third_party/lit-html/package/directive.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/async-append.d.ts +7 -14
- package/front_end/third_party/lit-html/package/directives/async-append.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/async-append.js +2 -6
- package/front_end/third_party/lit-html/package/directives/async-append.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/async-replace.d.ts +9 -14
- package/front_end/third_party/lit-html/package/directives/async-replace.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/async-replace.js +2 -5
- package/front_end/third_party/lit-html/package/directives/async-replace.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/cache.d.ts +2 -3
- package/front_end/third_party/lit-html/package/directives/cache.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/cache.js +2 -5
- package/front_end/third_party/lit-html/package/directives/cache.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/class-map.d.ts +2 -2
- package/front_end/third_party/lit-html/package/directives/class-map.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/class-map.js +2 -4
- package/front_end/third_party/lit-html/package/directives/class-map.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/guard.d.ts +3 -2
- package/front_end/third_party/lit-html/package/directives/guard.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/guard.js +2 -4
- package/front_end/third_party/lit-html/package/directives/guard.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/live.d.ts +4 -3
- package/front_end/third_party/lit-html/package/directives/live.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/live.js +1 -4
- package/front_end/third_party/lit-html/package/directives/live.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/private-async-helpers.d.ts +58 -0
- package/front_end/third_party/lit-html/package/directives/private-async-helpers.d.ts.map +1 -0
- package/front_end/third_party/lit-html/package/directives/private-async-helpers.js +7 -0
- package/front_end/third_party/lit-html/package/directives/private-async-helpers.js.map +1 -0
- package/front_end/third_party/lit-html/package/directives/ref.d.ts +14 -11
- package/front_end/third_party/lit-html/package/directives/ref.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/ref.js +2 -5
- package/front_end/third_party/lit-html/package/directives/ref.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/repeat.d.ts +8 -4
- package/front_end/third_party/lit-html/package/directives/repeat.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/repeat.js +2 -5
- package/front_end/third_party/lit-html/package/directives/repeat.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/style-map.d.ts +1 -2
- package/front_end/third_party/lit-html/package/directives/style-map.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/style-map.js +2 -4
- package/front_end/third_party/lit-html/package/directives/style-map.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/template-content.d.ts +1 -2
- package/front_end/third_party/lit-html/package/directives/template-content.js +2 -4
- package/front_end/third_party/lit-html/package/directives/template-content.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/unsafe-html.d.ts +6 -4
- package/front_end/third_party/lit-html/package/directives/unsafe-html.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/unsafe-html.js +2 -4
- package/front_end/third_party/lit-html/package/directives/unsafe-html.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/unsafe-svg.d.ts +4 -1
- package/front_end/third_party/lit-html/package/directives/unsafe-svg.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/unsafe-svg.js.map +1 -1
- package/front_end/third_party/lit-html/package/directives/until.d.ts +12 -8
- package/front_end/third_party/lit-html/package/directives/until.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/directives/until.js +2 -6
- package/front_end/third_party/lit-html/package/directives/until.js.map +1 -1
- package/front_end/third_party/lit-html/package/experimental-hydrate.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/experimental-hydrate.js +2 -5
- package/front_end/third_party/lit-html/package/experimental-hydrate.js.map +1 -1
- package/front_end/third_party/lit-html/package/lit-html.d.ts +81 -136
- package/front_end/third_party/lit-html/package/lit-html.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/lit-html.js +1 -1
- package/front_end/third_party/lit-html/package/lit-html.js.map +1 -1
- package/front_end/third_party/lit-html/package/package.json +75 -24
- package/front_end/third_party/lit-html/package/polyfill-support.d.ts +1 -41
- package/front_end/third_party/lit-html/package/polyfill-support.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/polyfill-support.js +1 -1
- package/front_end/third_party/lit-html/package/polyfill-support.js.map +1 -1
- package/front_end/third_party/lit-html/package/private-ssr-support.d.ts +12 -10
- package/front_end/third_party/lit-html/package/private-ssr-support.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/private-ssr-support.js +2 -2
- package/front_end/third_party/lit-html/package/private-ssr-support.js.map +1 -1
- package/front_end/third_party/lit-html/package/static.d.ts.map +1 -1
- package/front_end/third_party/lit-html/package/static.js +1 -1
- package/front_end/third_party/lit-html/package/static.js.map +1 -1
- package/front_end/third_party/marked/README.chromium +2 -2
- package/front_end/third_party/marked/marked.ts +2 -2
- package/front_end/third_party/marked/package/README.md +7 -1
- package/front_end/third_party/marked/package/bin/marked.js +214 -0
- package/front_end/third_party/marked/package/lib/marked.cjs +2907 -0
- package/front_end/third_party/marked/package/lib/marked.esm.d.ts +1 -3
- package/front_end/third_party/marked/package/lib/marked.esm.js +627 -586
- package/front_end/third_party/marked/package/lib/marked.umd.js +2913 -0
- package/front_end/third_party/marked/package/man/marked.1 +5 -24
- package/front_end/third_party/marked/package/man/marked.1.txt +21 -31
- package/front_end/third_party/marked/package/marked.min.js +1 -1
- package/front_end/third_party/marked/package/package.json +41 -32
- package/front_end/third_party/marked/package/src/Lexer.js +109 -108
- package/front_end/third_party/marked/package/src/Parser.js +38 -15
- package/front_end/third_party/marked/package/src/Renderer.js +5 -5
- package/front_end/third_party/marked/package/src/Slugger.js +2 -2
- package/front_end/third_party/marked/package/src/TextRenderer.js +2 -2
- package/front_end/third_party/marked/package/src/Tokenizer.js +215 -190
- package/front_end/third_party/marked/package/src/defaults.js +6 -9
- package/front_end/third_party/marked/package/src/helpers.js +16 -27
- package/front_end/third_party/marked/package/src/marked.js +146 -63
- package/front_end/third_party/marked/package/src/rules.js +20 -45
- package/front_end/third_party/wasmparser/README.chromium +2 -2
- package/front_end/third_party/wasmparser/package/.github/workflows/main.yml +47 -0
- package/front_end/third_party/wasmparser/package/CHANGELOG.md +12 -0
- package/front_end/third_party/wasmparser/package/dist/cjs/WasmParser.js +53 -53
- package/front_end/third_party/wasmparser/package/dist/cjs/WasmParser.js.map +1 -1
- package/front_end/third_party/wasmparser/package/dist/esm/WasmParser.js +53 -53
- package/front_end/third_party/wasmparser/package/dist/esm/WasmParser.js.map +1 -1
- package/front_end/third_party/wasmparser/package/package.json +1 -1
- package/front_end/third_party/wasmparser/package/src/WasmParser.ts +53 -53
- package/front_end/ui/components/adorners/Adorner.ts +14 -14
- package/front_end/ui/components/buttons/Button.ts +116 -42
- package/front_end/ui/components/data_grid/DataGrid.ts +122 -122
- package/front_end/ui/components/data_grid/DataGridController.ts +42 -42
- package/front_end/ui/components/diff_view/DiffView.ts +4 -4
- package/front_end/ui/components/docs/button/basic.html +3 -0
- package/front_end/ui/components/docs/button/basic.ts +16 -0
- package/front_end/ui/components/expandable_list/ExpandableList.ts +11 -11
- package/front_end/ui/components/icon_button/Icon.ts +24 -21
- package/front_end/ui/components/icon_button/IconButton.ts +31 -31
- package/front_end/ui/components/issue_counter/IssueCounter.ts +52 -52
- package/front_end/ui/components/issue_counter/IssueLinkIcon.ts +42 -42
- package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspector.ts +67 -67
- package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspectorController.ts +22 -22
- package/front_end/ui/components/linear_memory_inspector/LinearMemoryInspectorPane.ts +36 -36
- package/front_end/ui/components/linear_memory_inspector/LinearMemoryNavigator.ts +19 -19
- package/front_end/ui/components/linear_memory_inspector/LinearMemoryValueInterpreter.ts +25 -25
- package/front_end/ui/components/linear_memory_inspector/LinearMemoryViewer.ts +52 -52
- package/front_end/ui/components/linear_memory_inspector/ValueInterpreterDisplay.ts +21 -21
- package/front_end/ui/components/linear_memory_inspector/ValueInterpreterSettings.ts +6 -6
- package/front_end/ui/components/markdown_view/MarkdownImage.ts +14 -14
- package/front_end/ui/components/markdown_view/MarkdownLink.ts +8 -8
- package/front_end/ui/components/markdown_view/MarkdownView.ts +6 -6
- package/front_end/ui/components/render_coordinator/RenderCoordinator.ts +33 -33
- package/front_end/ui/components/report_view/ReportView.ts +18 -18
- package/front_end/ui/components/request_link_icon/RequestLinkIcon.ts +53 -53
- package/front_end/ui/components/settings/SettingCheckbox.ts +15 -15
- package/front_end/ui/components/survey_link/SurveyLink.ts +28 -28
- package/front_end/ui/components/text_editor/TextEditor.ts +65 -36
- package/front_end/ui/components/text_editor/config.ts +36 -14
- package/front_end/ui/components/text_editor/javascript.ts +20 -15
- package/front_end/ui/components/text_editor/theme.ts +29 -4
- package/front_end/ui/components/text_prompt/TextPrompt.ts +19 -19
- package/front_end/ui/components/tree_outline/TreeOutline.ts +56 -56
- package/front_end/ui/legacy/Infobar.ts +9 -0
- package/front_end/ui/legacy/InspectorView.ts +1 -1
- package/front_end/ui/legacy/ViewManager.ts +6 -0
- package/front_end/ui/legacy/components/cookie_table/CookiesTable.ts +20 -0
- package/front_end/ui/legacy/components/source_frame/SourceFrame.ts +1 -0
- package/front_end/ui/legacy/components/utils/Linkifier.ts +49 -79
- package/front_end/ui/legacy/tabbedPane.css +1 -1
- package/front_end/ui/legacy/themeColors.css +2 -0
- package/inspector_overlay/main.ts +3 -0
- package/package.json +1 -1
|
@@ -1,135 +1,21 @@
|
|
|
1
|
-
# lit-html 2.0
|
|
1
|
+
# lit-html 2.0
|
|
2
2
|
|
|
3
3
|
Efficient, Expressive, Extensible HTML templates in JavaScript
|
|
4
4
|
|
|
5
|
-
[](https://github.com/lit/lit/actions?query=workflow%3ATests)
|
|
6
|
+
[](https://www.npmjs.com/package/lit-html)
|
|
7
7
|
[](https://www.polymer-project.org/slack-invite)
|
|
8
8
|
[](https://github.com/web-padawan/awesome-lit)
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
This is a major version pre-release of lit-html 2.0. See issue
|
|
13
|
-
[#1182](https://github.com/Polymer/lit-html/issues/1182) for the full list of changes
|
|
14
|
-
planned/considered for this release.
|
|
15
|
-
|
|
16
|
-
This pre-release is not yet feature complete or API stable. Please note the
|
|
17
|
-
breaking changes, known issues, and limitations below, and use at your risk
|
|
18
|
-
until the stable release is available. Issues are welcome
|
|
19
|
-
for unexpected changes not noted below or in the changelog.
|
|
20
|
-
|
|
21
|
-
## 🚨 Breaking changes
|
|
22
|
-
|
|
23
|
-
While `lit-html` 2.0 is intended to be a backward-compatible change for the
|
|
24
|
-
majority of 1.x users, please be aware of the following notable breaking
|
|
25
|
-
changes:
|
|
26
|
-
|
|
27
|
-
- New `directive` and `Part` API (see below for migration info)
|
|
28
|
-
- `render()` no longer clears its container on first render
|
|
29
|
-
- Custom `templateFactory`, `TemplateProcessor`, and custom tag functions are no
|
|
30
|
-
longer supported
|
|
31
|
-
- The `polyfill-support.js` file must be loaded when using the `webcomponents`
|
|
32
|
-
polyfills
|
|
33
|
-
|
|
34
|
-
See the full [changelog](CHANGELOG.md) for more details on
|
|
35
|
-
these and other minor breaking changes.
|
|
36
|
-
|
|
37
|
-
## 🚨 Migrating directives
|
|
38
|
-
|
|
39
|
-
While the API for _using_ directives should be 100% backward-compatible with
|
|
40
|
-
1.x, there is a breaking change to how custom directives are _authored_. The API
|
|
41
|
-
change improves ergonomics around making stateful directives while providing a
|
|
42
|
-
clear pattern for SSR-compatible directives: only `render` will be called on the
|
|
43
|
-
server, while `update` will not be.
|
|
44
|
-
|
|
45
|
-
<details>
|
|
46
|
-
<summary>Expand here for details on migrating directives.</summary>
|
|
47
|
-
|
|
48
|
-
### Overview of directive API changes
|
|
49
|
-
|
|
50
|
-
| | 1.x API | 2.0 API |
|
|
51
|
-
| -------------------------------------------- | ------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------- |
|
|
52
|
-
| Code idiom for directive | function that takes directive arguments, and returns function that takes `part` and returns value | class with `update` & `render` methods which accept directive arguments |
|
|
53
|
-
| Where to do declarative rendering | pass value to `part.setValue()` | return value from `render()` method |
|
|
54
|
-
| Where to do imperative DOM/part manipulation | directive function | `update()` method |
|
|
55
|
-
| Where state is stored between renders | `WeakMap` keyed on `part` | class instance fields |
|
|
56
|
-
| How part validation is done | `instanceof` check on `part` in every render | `part.type` check in constructor |
|
|
57
|
-
|
|
58
|
-
### Example directive migration
|
|
59
|
-
|
|
60
|
-
Below is an example of a lit-html 1.x directive, and how to migrate it to the
|
|
61
|
-
new API:
|
|
62
|
-
|
|
63
|
-
1.x Directive API:
|
|
64
|
-
|
|
65
|
-
```js
|
|
66
|
-
import {directive, NodePart, html} from 'lit-html';
|
|
67
|
-
|
|
68
|
-
// State stored in WeakMap
|
|
69
|
-
const previousState = new WeakMap();
|
|
70
|
-
|
|
71
|
-
// Functional-based directive API
|
|
72
|
-
export const renderCounter = directive((initialValue) => (part) => {
|
|
73
|
-
// When necessary, validate part type each render using `instanceof`
|
|
74
|
-
if (!(part instanceof NodePart)) {
|
|
75
|
-
throw new Error('renderCounter only supports NodePart');
|
|
76
|
-
}
|
|
77
|
-
// Retrieve value from previous state
|
|
78
|
-
let value = previousState.get(part);
|
|
79
|
-
// Update state
|
|
80
|
-
if (previous === undefined) {
|
|
81
|
-
value = initialValue;
|
|
82
|
-
} else {
|
|
83
|
-
value++;
|
|
84
|
-
}
|
|
85
|
-
// Store state
|
|
86
|
-
previousState.set(part, value);
|
|
87
|
-
// Update part with new rendering
|
|
88
|
-
part.setValue(html`<p>${value}</p>`);
|
|
89
|
-
});
|
|
90
|
-
```
|
|
10
|
+
lit-html is the template system that powers the [Lit](https://lit.dev) library for building fast web components. When using `lit-html` to develop web components, most users should import lit-html via the [`lit`](https://www.npmjs.com/package/lit) package rather than installing and importing from `lit-html` directly.
|
|
91
11
|
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
```js
|
|
95
|
-
import {html} from 'lit-html';
|
|
96
|
-
import {directive, Directive, PartType} from 'lit-html/directive.js';
|
|
97
|
-
|
|
98
|
-
// Class-based directive API
|
|
99
|
-
export const renderCounter = directive(
|
|
100
|
-
class extends Directive {
|
|
101
|
-
// State stored in class field
|
|
102
|
-
value = undefined;
|
|
103
|
-
constructor(partInfo: PartInfo, index?: number) {
|
|
104
|
-
super(partInfo, index);
|
|
105
|
-
// When necessary, validate part in constructor using `part.type`
|
|
106
|
-
if (partInfo.type !== PartType.CHILD) {
|
|
107
|
-
throw new Error('renderCounter only supports child expressions');
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
// Any imperative updates to DOM/parts would go here
|
|
111
|
-
update(part, [initialValue]) {
|
|
112
|
-
// ...
|
|
113
|
-
}
|
|
114
|
-
// Do SSR-compatible rendering (arguments are passed from call site)
|
|
115
|
-
render(initialValue) {
|
|
116
|
-
// Previous state available on class field
|
|
117
|
-
if (this.value === undefined) {
|
|
118
|
-
this.value = initialValue;
|
|
119
|
-
} else {
|
|
120
|
-
this.value++;
|
|
121
|
-
}
|
|
122
|
-
return html`<p>${this.value}</p>`;
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
);
|
|
126
|
-
```
|
|
12
|
+
## About this release
|
|
127
13
|
|
|
128
|
-
|
|
14
|
+
This is a stable release of `lit-html` 2.0 (part of the Lit 2.0 release). If upgrading from previous versions of `lit-html`, please note the minor breaking changes from lit-html 1.0 in the [Upgrade Guide](https://lit.dev/docs/releases/upgrade/).
|
|
129
15
|
|
|
130
|
-
|
|
16
|
+
## Documentation
|
|
131
17
|
|
|
132
|
-
|
|
18
|
+
Full documentation is available at [lit.dev](https://lit.dev).
|
|
133
19
|
|
|
134
20
|
## Overview
|
|
135
21
|
|
|
@@ -161,48 +47,12 @@ render(helloTemplate('Kevin'), document.body);
|
|
|
161
47
|
$ npm install lit-html
|
|
162
48
|
```
|
|
163
49
|
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
lit-html includes a development mode which adds additional checks that are
|
|
167
|
-
reported in the console.
|
|
168
|
-
|
|
169
|
-
To enable development mode, add the `development` exports condition to your node
|
|
170
|
-
resolve configuration.
|
|
171
|
-
|
|
172
|
-
#### @web/dev-server
|
|
173
|
-
|
|
174
|
-
```js
|
|
175
|
-
{
|
|
176
|
-
nodeResolve: {
|
|
177
|
-
exportConditions: ['development'],
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
```
|
|
50
|
+
Or use from `lit`:
|
|
181
51
|
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
```js
|
|
185
|
-
{
|
|
186
|
-
plugins: [
|
|
187
|
-
nodeResolve({
|
|
188
|
-
exportConditions: ['development'],
|
|
189
|
-
}),
|
|
190
|
-
],
|
|
191
|
-
}
|
|
192
|
-
```
|
|
193
|
-
|
|
194
|
-
#### Webpack
|
|
195
|
-
|
|
196
|
-
> NOTE: Requires [Webpack v5](https://webpack.js.org/migrate/5/)
|
|
197
|
-
|
|
198
|
-
```js
|
|
199
|
-
{
|
|
200
|
-
resolve: {
|
|
201
|
-
conditionNames: ['development'],
|
|
202
|
-
}
|
|
203
|
-
}
|
|
52
|
+
```bash
|
|
53
|
+
$ npm install lit
|
|
204
54
|
```
|
|
205
55
|
|
|
206
56
|
## Contributing
|
|
207
57
|
|
|
208
|
-
Please see [CONTRIBUTING.md](
|
|
58
|
+
Please see [CONTRIBUTING.md](./CONTRIBUTING.md).
|
|
@@ -25,13 +25,14 @@
|
|
|
25
25
|
* The sparse tree created by means of the `AsyncDirective` constructor
|
|
26
26
|
* crawling up the `_$parent` tree and placing a `_$disconnectableChildren` Set
|
|
27
27
|
* on each parent that includes each child that contains a
|
|
28
|
-
* `AsyncDirective` directly or transitively via its children. In order
|
|
29
|
-
* disconnect (or reconnect) a tree, the
|
|
30
|
-
* onto ChildParts as a directive
|
|
31
|
-
*
|
|
32
|
-
* over the sparse tree of
|
|
33
|
-
* AsyncDirectives, and calls
|
|
34
|
-
* directives that are encountered
|
|
28
|
+
* `AsyncDirective` directly or transitively via its children. In order to
|
|
29
|
+
* notify connection state changes and disconnect (or reconnect) a tree, the
|
|
30
|
+
* `_$notifyConnectionChanged` API is patched onto ChildParts as a directive
|
|
31
|
+
* climbs the parent tree, which is called by the core when clearing a part if
|
|
32
|
+
* it exists. When called, that method iterates over the sparse tree of
|
|
33
|
+
* Set<DisconnectableChildren> built up by AsyncDirectives, and calls
|
|
34
|
+
* `_$notifyDirectiveConnectionChanged` on any directives that are encountered
|
|
35
|
+
* in that tree, running the required callbacks.
|
|
35
36
|
*
|
|
36
37
|
* A given "logical tree" of lit-html data-structures might look like this:
|
|
37
38
|
*
|
|
@@ -87,7 +88,7 @@
|
|
|
87
88
|
* Example 1: The directive in ChildPart(N12) updates and returns `nothing`. The
|
|
88
89
|
* ChildPart will _clear() itself, and so we need to disconnect the "value" of
|
|
89
90
|
* the ChildPart (but not its directive). In this case, when `_clear()` calls
|
|
90
|
-
* `_$
|
|
91
|
+
* `_$notifyConnectionChanged()`, we don't iterate all of the
|
|
91
92
|
* _$disconnectableChildren, rather we do a value-specific disconnection: i.e.
|
|
92
93
|
* since the _value was an Array<ChildPart> (because an iterable had been
|
|
93
94
|
* committed), we iterate the array of ChildParts (N14, N16) and run
|
|
@@ -109,32 +110,37 @@
|
|
|
109
110
|
*
|
|
110
111
|
* Example 3: If the LitElement containing the entire tree above becomes
|
|
111
112
|
* disconnected, it will run `childPart.setConnected()` (which calls
|
|
112
|
-
* `childPart._$
|
|
113
|
+
* `childPart._$notifyConnectionChanged()` if it exists); in this case, we
|
|
113
114
|
* recursively run `setConnected()` over the entire tree, without removing any
|
|
114
115
|
* children from `_$disconnectableChildren`, since this tree is required to
|
|
115
116
|
* re-connect the tree, which does the same operation, simply passing
|
|
116
117
|
* `isConnectd: true` down the tree, signaling which callback to run.
|
|
117
118
|
*/
|
|
118
|
-
import { Directive } from './directive.js';
|
|
119
119
|
import { Disconnectable, Part } from './lit-html.js';
|
|
120
|
-
|
|
120
|
+
import { Directive } from './directive.js';
|
|
121
121
|
export { directive } from './directive.js';
|
|
122
|
-
|
|
123
122
|
/**
|
|
124
123
|
* An abstract `Directive` base class whose `disconnected` method will be
|
|
125
124
|
* called when the part containing the directive is cleared as a result of
|
|
126
|
-
* re-rendering, or when the user calls `part.
|
|
127
|
-
* a part that was previously rendered containing the directive
|
|
125
|
+
* re-rendering, or when the user calls `part.setConnected(false)` on
|
|
126
|
+
* a part that was previously rendered containing the directive (as happens
|
|
127
|
+
* when e.g. a LitElement disconnects from the DOM).
|
|
128
128
|
*
|
|
129
|
-
* If `part.
|
|
129
|
+
* If `part.setConnected(true)` is subsequently called on a
|
|
130
130
|
* containing part, the directive's `reconnected` method will be called prior
|
|
131
131
|
* to its next `update`/`render` callbacks. When implementing `disconnected`,
|
|
132
132
|
* `reconnected` should also be implemented to be compatible with reconnection.
|
|
133
|
+
*
|
|
134
|
+
* Note that updates may occur while the directive is disconnected. As such,
|
|
135
|
+
* directives should generally check the `this.isConnected` flag during
|
|
136
|
+
* render/update to determine whether it is safe to subscribe to resources
|
|
137
|
+
* that may prevent garbage collection.
|
|
133
138
|
*/
|
|
134
139
|
export declare abstract class AsyncDirective extends Directive {
|
|
140
|
+
/**
|
|
141
|
+
* The connection state for this Directive.
|
|
142
|
+
*/
|
|
135
143
|
isConnected: boolean;
|
|
136
|
-
private _pendingValue;
|
|
137
|
-
_$disconnetableChildren?: Set<Disconnectable>;
|
|
138
144
|
/**
|
|
139
145
|
* Initialize the part with internal fields
|
|
140
146
|
* @param part
|
|
@@ -142,40 +148,6 @@ export declare abstract class AsyncDirective extends Directive {
|
|
|
142
148
|
* @param attributeIndex
|
|
143
149
|
*/
|
|
144
150
|
_$initialize(part: Part, parent: Disconnectable, attributeIndex: number | undefined): void;
|
|
145
|
-
/**
|
|
146
|
-
* Called from the core code when a directive is going away from a part (in
|
|
147
|
-
* which case `shouldRemoveFromParent` should be true), and from the
|
|
148
|
-
* `setChildrenConnected` helper function when recursively changing the
|
|
149
|
-
* connection state of a tree (in which case `shouldRemoveFromParent` should
|
|
150
|
-
* be false).
|
|
151
|
-
*
|
|
152
|
-
* @param isConnected
|
|
153
|
-
* @param isClearingDirective - True when the directive itself is being
|
|
154
|
-
* removed; false when the tree is being disconnected
|
|
155
|
-
* @internal
|
|
156
|
-
*/
|
|
157
|
-
_$setDirectiveConnected(isConnected: boolean, isClearingDirective?: boolean): void;
|
|
158
|
-
/**
|
|
159
|
-
* Private method used to set the connection state of the directive and call
|
|
160
|
-
* the respective `disconnected` or `reconnected` callback. Note thatsince
|
|
161
|
-
* `isConnected` defaults to true, we do not run `reconnected` on first
|
|
162
|
-
* render.
|
|
163
|
-
*
|
|
164
|
-
* If a call to `setValue` was made while disconnected, flush it to the part
|
|
165
|
-
* before reconnecting.
|
|
166
|
-
*
|
|
167
|
-
* @param isConnected
|
|
168
|
-
* @internal
|
|
169
|
-
*/
|
|
170
|
-
private _setConnected;
|
|
171
|
-
/**
|
|
172
|
-
* Override of the base `_resolve` method to ensure `reconnected` is run
|
|
173
|
-
* prior to the next render.
|
|
174
|
-
*
|
|
175
|
-
* @override
|
|
176
|
-
* @internal
|
|
177
|
-
*/
|
|
178
|
-
_$resolve(part: Part, props: Array<unknown>): unknown;
|
|
179
151
|
/**
|
|
180
152
|
* Sets the value of the directive's Part outside the normal `update`/`render`
|
|
181
153
|
* lifecycle of a directive.
|
|
@@ -183,9 +155,6 @@ export declare abstract class AsyncDirective extends Directive {
|
|
|
183
155
|
* This method should not be called synchronously from a directive's `update`
|
|
184
156
|
* or `render`.
|
|
185
157
|
*
|
|
186
|
-
* If the method is called while the part is disconnected, the value will be
|
|
187
|
-
* queued until directive is reconnected.
|
|
188
|
-
*
|
|
189
158
|
* @param directive The directive to update
|
|
190
159
|
* @param value The value to set
|
|
191
160
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"async-directive.d.ts","sourceRoot":"","sources":["../src/async-directive.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH
|
|
1
|
+
{"version":3,"file":"async-directive.d.ts","sourceRoot":"","sources":["../src/async-directive.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgHG;AAEH,OAAO,EAA2B,cAAc,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AAE7E,OAAO,EAAC,SAAS,EAAqB,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AA0JzC;;;;;;;;;;;;;;;;GAgBG;AACH,8BAAsB,cAAe,SAAQ,SAAS;IAMpD;;OAEG;IACH,WAAW,EAAG,OAAO,CAAC;IAItB;;;;;OAKG;IACM,YAAY,CACnB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,cAAc,EACtB,cAAc,EAAE,MAAM,GAAG,SAAS;IAqCpC;;;;;;;;;OASG;IACH,QAAQ,CAAC,KAAK,EAAE,OAAO;IAevB;;;;;OAKG;IACH,SAAS,CAAC,YAAY;IACtB,SAAS,CAAC,WAAW;CACtB"}
|
|
@@ -1,12 +1,7 @@
|
|
|
1
|
-
import{isSingleExpression as
|
|
2
|
-
import{Directive as t,PartType as s}from"./directive.js";
|
|
3
|
-
import{noChange as i}from"./lit-html.js";
|
|
4
|
-
|
|
5
|
-
export{directive}from"./directive.js";
|
|
6
|
-
|
|
1
|
+
import{isSingleExpression as i}from"./directive-helpers.js";import{Directive as t,PartType as s}from"./directive.js";export{directive}from"./directive.js";
|
|
7
2
|
/**
|
|
8
3
|
* @license
|
|
9
4
|
* Copyright 2017 Google LLC
|
|
10
5
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
11
|
-
*/const
|
|
6
|
+
*/const e=(i,t)=>{var s,o;const n=i._$AN;if(void 0===n)return!1;for(const i of n)null===(o=(s=i)._$AO)||void 0===o||o.call(s,t,!1),e(i,t);return!0},o=i=>{let t,s;do{if(void 0===(t=i._$AM))break;s=t._$AN,s.delete(i),i=t}while(0===(null==s?void 0:s.size))},n=i=>{for(let t;t=i._$AM;i=t){let s=t._$AN;if(void 0===s)t._$AN=s=new Set;else if(s.has(i))break;s.add(i),l(t)}};function r(i){void 0!==this._$AN?(o(this),this._$AM=i,n(this)):this._$AM=i}function h(i,t=!1,s=0){const n=this._$AH,r=this._$AN;if(void 0!==r&&0!==r.size)if(t)if(Array.isArray(n))for(let i=s;i<n.length;i++)e(n[i],!1),o(n[i]);else null!=n&&(e(n,!1),o(n));else e(this,i)}const l=i=>{var t,e,o,n;i.type==s.CHILD&&(null!==(t=(o=i)._$AP)&&void 0!==t||(o._$AP=h),null!==(e=(n=i)._$AQ)&&void 0!==e||(n._$AQ=r))};class d extends t{constructor(){super(...arguments),this._$AN=void 0}_$AT(i,t,s){super._$AT(i,t,s),n(this),this.isConnected=i._$AU}_$AO(i,t=!0){var s,n;i!==this.isConnected&&(this.isConnected=i,i?null===(s=this.reconnected)||void 0===s||s.call(this):null===(n=this.disconnected)||void 0===n||n.call(this)),t&&(e(this,i),o(this))}setValue(t){if(i(this._$Ct))this._$Ct._$AI(t,this);else{const i=[...this._$Ct._$AH];i[this._$Ci]=t,this._$Ct._$AI(i,this,0)}}disconnected(){}reconnected(){}}export{d as AsyncDirective};
|
|
12
7
|
//# sourceMappingURL=async-directive.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"async-directive.js","sources":["src/async-directive.ts"],"sourcesContent":["/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Overview:\n *\n * This module is designed to add support for an async `setValue` API and\n * `disconnected` callback to directives with the least impact on the core\n * runtime or payload when that feature is not used.\n *\n * The strategy is to introduce a `AsyncDirective` subclass of\n * `Directive` that climbs the \"parent\" tree in its constructor to note which\n * branches of lit-html's \"logical tree\" of data structures contain such\n * directives and thus need to be crawled when a subtree is being cleared (or\n * manually disconnected) in order to run the `disconnected` callback.\n *\n * The \"nodes\" of the logical tree include Parts, TemplateInstances (for when a\n * TemplateResult is committed to a value of a ChildPart), and Directives; these\n * all implement a common interface called `DisconnectableChild`. Each has a\n * `_$parent` reference which is set during construction in the core code, and a\n * `_$disconnectableChildren` field which is initially undefined.\n *\n * The sparse tree created by means of the `AsyncDirective` constructor\n * crawling up the `_$parent` tree and placing a `_$disconnectableChildren` Set\n * on each parent that includes each child that contains a\n * `AsyncDirective` directly or transitively via its children. In order\n * disconnect (or reconnect) a tree, the `_$setChildPartConnected` API is patched\n * onto ChildParts as a directive climbs the parent tree, which is called by the\n * core when clearing a part if it exists. When called, that method iterates\n * over the sparse tree of Set<DisconnectableChildren> built up by\n * AsyncDirectives, and calls `_$setDirectiveConnected` on any\n * directives that are encountered in that tree, running the required callbacks.\n *\n * A given \"logical tree\" of lit-html data-structures might look like this:\n *\n * ChildPart(N1) _$dC=[D2,T3]\n * ._directive\n * AsyncDirective(D2)\n * ._value // user value was TemplateResult\n * TemplateInstance(T3) _$dC=[A4,A6,N10,N12]\n * ._parts[]\n * AttributePart(A4) _$dC=[D5]\n * ._directives[]\n * AsyncDirective(D5)\n * AttributePart(A6) _$dC=[D7,D8]\n * ._directives[]\n * AsyncDirective(D7)\n * Directive(D8) _$dC=[D9]\n * ._directive\n * AsyncDirective(D9)\n * ChildPart(N10) _$dC=[D11]\n * ._directive\n * AsyncDirective(D11)\n * ._value\n * string\n * ChildPart(N12) _$dC=[D13,N14,N16]\n * ._directive\n * AsyncDirective(D13)\n * ._value // user value was iterable\n * Array<ChildPart>\n * ChildPart(N14) _$dC=[D15]\n * ._value\n * string\n * ChildPart(N16) _$dC=[D17,T18]\n * ._directive\n * AsyncDirective(D17)\n * ._value // user value was TemplateResult\n * TemplateInstance(T18) _$dC=[A19,A21,N25]\n * ._parts[]\n * AttributePart(A19) _$dC=[D20]\n * ._directives[]\n * AsyncDirective(D20)\n * AttributePart(A21) _$dC=[22,23]\n * ._directives[]\n * AsyncDirective(D22)\n * Directive(D23) _$dC=[D24]\n * ._directive\n * AsyncDirective(D24)\n * ChildPart(N25) _$dC=[D26]\n * ._directive\n * AsyncDirective(D26)\n * ._value\n * string\n *\n * Example 1: The directive in ChildPart(N12) updates and returns `nothing`. The\n * ChildPart will _clear() itself, and so we need to disconnect the \"value\" of\n * the ChildPart (but not its directive). In this case, when `_clear()` calls\n * `_$setChildPartConnected()`, we don't iterate all of the\n * _$disconnectableChildren, rather we do a value-specific disconnection: i.e.\n * since the _value was an Array<ChildPart> (because an iterable had been\n * committed), we iterate the array of ChildParts (N14, N16) and run\n * `setConnected` on them (which does recurse down the full tree of\n * `_$disconnectableChildren` below it, and also removes N14 and N16 from N12's\n * `_$disconnectableChildren`). Once the values have been disconnected, we then\n * check whether the ChildPart(N12)'s list of `_$disconnectableChildren` is empty\n * (and would remove it from its parent TemplateInstance(T3) if so), but since\n * it would still contain its directive D13, it stays in the disconnectable\n * tree.\n *\n * Example 2: In the course of Example 1, `setConnected` will reach\n * ChildPart(N16); in this case the entire part is being disconnected, so we\n * simply iterate all of N16's `_$disconnectableChildren` (D17,T18) and\n * recursively run `setConnected` on them. Note that we only remove children\n * from `_$disconnectableChildren` for the top-level values being disconnected\n * on a clear; doing this bookkeeping lower in the tree is wasteful since it's\n * all being thrown away.\n *\n * Example 3: If the LitElement containing the entire tree above becomes\n * disconnected, it will run `childPart.setConnected()` (which calls\n * `childPart._$setChildPartConnected()` if it exists); in this case, we\n * recursively run `setConnected()` over the entire tree, without removing any\n * children from `_$disconnectableChildren`, since this tree is required to\n * re-connect the tree, which does the same operation, simply passing\n * `isConnectd: true` down the tree, signaling which callback to run.\n */\n\nimport {\n AttributePart,\n ChildPart,\n Disconnectable,\n noChange,\n Part,\n} from './lit-html.js';\nimport {isSingleExpression} from './directive-helpers.js';\nimport {Directive, PartInfo, PartType} from './directive.js';\nexport {directive} from './directive.js';\n\nconst DEV_MODE = true;\n\n/**\n * Recursively walks down the tree of Parts/TemplateInstances/Directives to set\n * the connected state of directives and run `disconnected`/ `reconnected`\n * callbacks.\n *\n * @return True if there were children to disconnect; false otherwise\n */\nconst setChildrenConnected = (\n parent: Disconnectable,\n isConnected: boolean\n): boolean => {\n const children = parent._$disconnetableChildren;\n if (children === undefined) {\n return false;\n }\n for (const obj of children) {\n // The existence of `_$setDirectiveConnected` is used as a \"brand\" to\n // disambiguate AsyncDirectives from other DisconnectableChildren\n // (as opposed to using an instanceof check to know when to call it); the\n // redundancy of \"Directive\" in the API name is to avoid conflicting with\n // `_$setChildPartConnected`, which exists `ChildParts` which are also in\n // this list\n // Disconnect Directive (and any nested directives contained within)\n (obj as AsyncDirective)._$setDirectiveConnected?.(isConnected, false);\n // Disconnect Part/TemplateInstance\n setChildrenConnected(obj, isConnected);\n }\n return true;\n};\n\n/**\n * Removes the given child from its parent list of disconnectable children, and\n * if the parent list becomes empty as a result, removes the parent from its\n * parent, and so forth up the tree when that causes subsequent parent lists to\n * become empty.\n */\nconst removeDisconnectableFromParent = (obj: Disconnectable) => {\n let parent, children;\n do {\n if ((parent = obj._$parent) === undefined) {\n break;\n }\n children = parent._$disconnetableChildren!;\n children.delete(obj);\n obj = parent;\n } while (children?.size === 0);\n};\n\nconst addDisconnectableToParent = (obj: Disconnectable) => {\n // Climb the parent tree, creating a sparse tree of children needing\n // disconnection\n for (let parent; (parent = obj._$parent); obj = parent) {\n let children = parent._$disconnetableChildren;\n if (children === undefined) {\n parent._$disconnetableChildren = children = new Set();\n } else if (children.has(obj)) {\n // Once we've reached a parent that already contains this child, we\n // can short-circuit\n break;\n }\n children.add(obj);\n installDisconnectAPI(parent);\n }\n};\n\n/**\n * Changes the parent reference of the ChildPart, and updates the sparse tree of\n * Disconnectable children accordingly.\n *\n * Note, this method will be patched onto ChildPart instances and called from\n * the core code when parts are moved between different parents.\n */\nfunction reparentDisconnectables(this: ChildPart, newParent: Disconnectable) {\n if (this._$disconnetableChildren !== undefined) {\n removeDisconnectableFromParent(this);\n this._$parent = newParent;\n addDisconnectableToParent(this);\n } else {\n this._$parent = newParent;\n }\n}\n\n/**\n * Sets the connected state on any directives contained within the committed\n * value of this part (i.e. within a TemplateInstance or iterable of\n * ChildParts) and runs their `disconnected`/`reconnected`s, as well as within\n * any directives stored on the ChildPart (when `valueOnly` is false).\n *\n * `isClearingValue` should be passed as `true` on a top-level part that is\n * clearing itself, and not as a result of recursively disconnecting directives\n * as part of a `clear` operation higher up the tree. This both ensures that any\n * directive on this ChildPart that produced a value that caused the clear\n * operation is not disconnected, and also serves as a performance optimization\n * to avoid needless bookkeeping when a subtree is going away; when clearing a\n * subtree, only the top-most part need to remove itself from the parent.\n *\n * `fromPartIndex` is passed only in the case of a partial `_clear` running as a\n * result of truncating an iterable.\n *\n * Note, this method will be patched onto ChildPart instances and called from the\n * core code when parts are cleared or the connection state is changed by the\n * user.\n */\nfunction setChildPartConnected(\n this: ChildPart,\n isConnected: boolean,\n isClearingValue = false,\n fromPartIndex = 0\n) {\n const value = this._$committedValue;\n const children = this._$disconnetableChildren;\n if (children === undefined || children.size === 0) {\n return;\n }\n if (isClearingValue) {\n if (Array.isArray(value)) {\n // Iterable case: Any ChildParts created by the iterable should be\n // disconnected and removed from this ChildPart's disconnectable\n // children (starting at `fromPartIndex` in the case of truncation)\n for (let i = fromPartIndex; i < value.length; i++) {\n setChildrenConnected(value[i], false);\n removeDisconnectableFromParent(value[i]);\n }\n } else if (value != null) {\n // TemplateInstance case: If the value has disconnectable children (will\n // only be in the case that it is a TemplateInstance), we disconnect it\n // and remove it from this ChildPart's disconnectable children\n setChildrenConnected(value as Disconnectable, false);\n removeDisconnectableFromParent(value as Disconnectable);\n }\n } else {\n setChildrenConnected(this, isConnected);\n }\n}\n\n/**\n * Patches disconnection API onto ChildParts.\n */\nconst installDisconnectAPI = (obj: Disconnectable) => {\n if ((obj as ChildPart).type == PartType.CHILD) {\n (obj as ChildPart)._$setChildPartConnected ??= setChildPartConnected;\n (obj as ChildPart)._$reparentDisconnectables ??= reparentDisconnectables;\n }\n};\n\n/**\n * An abstract `Directive` base class whose `disconnected` method will be\n * called when the part containing the directive is cleared as a result of\n * re-rendering, or when the user calls `part.setDirectiveConnection(false)` on\n * a part that was previously rendered containing the directive.\n *\n * If `part.setDirectiveConnection(true)` is subsequently called on a\n * containing part, the directive's `reconnected` method will be called prior\n * to its next `update`/`render` callbacks. When implementing `disconnected`,\n * `reconnected` should also be implemented to be compatible with reconnection.\n */\nexport abstract class AsyncDirective extends Directive {\n isConnected = true;\n private _pendingValue: unknown = noChange;\n // @internal\n _$disconnetableChildren?: Set<Disconnectable> = undefined;\n /**\n * Initialize the part with internal fields\n * @param part\n * @param parent\n * @param attributeIndex\n */\n _$initialize(\n part: Part,\n parent: Disconnectable,\n attributeIndex: number | undefined\n ) {\n super._$initialize(part, parent, attributeIndex);\n addDisconnectableToParent(this);\n }\n /**\n * Called from the core code when a directive is going away from a part (in\n * which case `shouldRemoveFromParent` should be true), and from the\n * `setChildrenConnected` helper function when recursively changing the\n * connection state of a tree (in which case `shouldRemoveFromParent` should\n * be false).\n *\n * @param isConnected\n * @param isClearingDirective - True when the directive itself is being\n * removed; false when the tree is being disconnected\n * @internal\n */\n _$setDirectiveConnected(isConnected: boolean, isClearingDirective = true) {\n this._setConnected(isConnected);\n if (isClearingDirective) {\n setChildrenConnected(this, isConnected);\n removeDisconnectableFromParent(this);\n }\n }\n /**\n * Private method used to set the connection state of the directive and call\n * the respective `disconnected` or `reconnected` callback. Note thatsince\n * `isConnected` defaults to true, we do not run `reconnected` on first\n * render.\n *\n * If a call to `setValue` was made while disconnected, flush it to the part\n * before reconnecting.\n *\n * @param isConnected\n * @internal\n */\n private _setConnected(isConnected: boolean) {\n if (isConnected !== this.isConnected) {\n if (isConnected) {\n this.isConnected = true;\n if (this._pendingValue !== noChange) {\n this.setValue(this._pendingValue);\n this._pendingValue = noChange;\n }\n this.reconnected?.();\n } else {\n this.isConnected = false;\n this.disconnected?.();\n }\n }\n }\n\n /**\n * Override of the base `_resolve` method to ensure `reconnected` is run\n * prior to the next render.\n *\n * @override\n * @internal\n */\n _$resolve(part: Part, props: Array<unknown>): unknown {\n if (!this.isConnected) {\n throw new Error(\n `AsyncDirective ${this.constructor.name} was ` +\n `rendered while its tree was disconnected.`\n );\n }\n return super._$resolve(part, props);\n }\n\n /**\n * Sets the value of the directive's Part outside the normal `update`/`render`\n * lifecycle of a directive.\n *\n * This method should not be called synchronously from a directive's `update`\n * or `render`.\n *\n * If the method is called while the part is disconnected, the value will be\n * queued until directive is reconnected.\n *\n * @param directive The directive to update\n * @param value The value to set\n */\n setValue(value: unknown) {\n if (this.isConnected) {\n if (isSingleExpression((this.__part as unknown) as PartInfo)) {\n this.__part._$setValue(value, this);\n } else {\n // this.__attributeIndex will be defined in this case, but\n // assert it in dev mode\n if (DEV_MODE && this.__attributeIndex === undefined) {\n throw new Error(`Expected this.__attributeIndex to be a number`);\n }\n const newValues = [...(this.__part._$committedValue as Array<unknown>)];\n newValues[this.__attributeIndex!] = value;\n (this.__part as AttributePart)._$setValue(newValues, this, 0);\n }\n } else {\n this._pendingValue = value;\n }\n }\n\n /**\n * User callbacks for implementing logic to release any resources/subscriptions\n * that may have been retained by this directive. Since directives may also be\n * re-connected, `reconnected` should also be implemented to restore the\n * working state of the directive prior to the next render.\n */\n protected disconnected() {}\n protected reconnected() {}\n}\n"],"names":["setChildrenConnected","parent","isConnected","children","_$disconnetableChildren","undefined","obj","_$setDirectiveConnected","removeDisconnectableFromParent","_$parent","delete","size","addDisconnectableToParent","Set","has","add","installDisconnectAPI","reparentDisconnectables","newParent","this","setChildPartConnected","isClearingValue","fromPartIndex","value","_$committedValue","Array","isArray","i","length","type","PartType","CHILD","_$setChildPartConnected","_$reparentDisconnectables","AsyncDirective","Directive","[object Object]","noChange","part","attributeIndex","super","_$initialize","isClearingDirective","_setConnected","_pendingValue","setValue","reconnected","disconnected","props","Error","constructor","name","_$resolve","isSingleExpression","__part","_$setValue","newValues","__attributeIndex"],"mappings":";;;;;GA2IA,MAAMA,EAAuB,CAC3BC,EACAC,aAEA,MAAMC,EAAWF,EAAOG,EACxB,QAAiBC,IAAbF,EACF,OAAO,EAET,IAAK,MAAMG,KAAOH,eAQfG,GAAuBC,yBAA0BL,GAAa,GAE/DF,EAAqBM,EAAKJ,GAE5B,OAAO,GASHM,EAAkCF,IACtC,IAAIL,EAAQE,EACZ,EAAG,CACD,QAAgCE,KAA3BJ,EAASK,EAAIG,GAChB,MAEFN,EAAWF,EAAOG,EAClBD,EAASO,OAAOJ,GAChBA,EAAML,QACoB,KAAnBE,MAAAA,SAAAA,EAAUQ,QAGfC,EAA6BN,IAGjC,IAAK,IAAIL,EAASA,EAASK,EAAIG,EAAWH,EAAML,EAAQ,CACtD,IAAIE,EAAWF,EAAOG,EACtB,QAAiBC,IAAbF,EACFF,EAAOG,EAA0BD,EAAW,IAAIU,SAC3C,GAAIV,EAASW,IAAIR,GAGtB,MAEFH,EAASY,IAAIT,GACbU,EAAqBf,KAWzB,SAASgB,EAAyCC,QACXb,IAAjCc,KAAKf,GACPI,EAA+BW,MAC/BA,KAAKV,EAAWS,EAChBN,EAA0BO,OAE1BA,KAAKV,EAAWS,EAyBpB,SAASE,EAEPlB,EACAmB,GAAkB,EAClBC,EAAgB,GAEhB,MAAMC,EAAQJ,KAAKK,EACbrB,EAAWgB,KAAKf,EACtB,QAAiBC,IAAbF,GAA4C,IAAlBA,EAASQ,KAGvC,GAAIU,EACF,GAAII,MAAMC,QAAQH,GAIhB,IAAK,IAAII,EAAIL,EAAeK,EAAIJ,EAAMK,OAAQD,IAC5C3B,EAAqBuB,EAAMI,IAAI,GAC/BnB,EAA+Be,EAAMI,SAErB,MAATJ,IAITvB,EAAqBuB,GAAyB,GAC9Cf,EAA+Be,SAGjCvB,EAAqBmB,KAAMjB,GAO/B,MAAMc,EAAwBV,gBACvBA,EAAkBuB,MAAQC,EAASC,qBACrCzB,GAAkB0B,mBAAAA,EAA4BZ,gBAC9Cd,GAAkB2B,mBAAAA,EAA8BhB,WAe/BiB,UAAuBC,EAA7CC,kCACEjB,kBAAc,EACNA,QAAyBkB,EAEjClB,YAAgDd,EAOhD+B,EACEE,EACArC,EACAsC,GAEAC,MAAMC,EAAaH,EAAMrC,EAAQsC,GACjC3B,EAA0BO,MAc5BiB,EAAwBlC,EAAsBwC,GAAsB,GAClEvB,KAAKwB,GAAczC,GACfwC,IACF1C,EAAqBmB,KAAMjB,GAC3BM,EAA+BW,OAe3BiB,GAAclC,WAChBA,IAAgBiB,KAAKjB,cACnBA,GACFiB,KAAKjB,aAAc,EACfiB,KAAKyB,KAAkBP,IACzBlB,KAAK0B,SAAS1B,KAAKyB,IACnBzB,KAAKyB,GAAgBP,aAEvBlB,KAAK2B,iCAAL3B,QAEAA,KAAKjB,aAAc,YACnBiB,KAAK4B,kCAAL5B,QAYNiB,EAAUE,EAAYU,GACpB,IAAK7B,KAAKjB,YACR,MAAU+C,MACR,kBAAkB9B,KAAK+B,YAAYC,sDAIvC,OAAOX,MAAMY,EAAUd,EAAMU,GAgB/BZ,SAASb,GACP,GAAIJ,KAAKjB,YACP,GAAImD,EAAoBlC,KAAKmC,KAC3BnC,KAAKmC,IAAOC,EAAWhC,EAAOJ,UACzB,CAML,MAAMqC,EAAY,IAAKrC,KAAKmC,IAAO9B,GACnCgC,EAAUrC,KAAKsC,KAAqBlC,EACnCJ,KAAKmC,IAAyBC,EAAWC,EAAWrC,KAAM,QAG7DA,KAAKyB,GAAgBrB,EAUfa,gBACAA"}
|
|
1
|
+
{"version":3,"file":"async-directive.js","sources":["src/async-directive.ts"],"sourcesContent":["/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Overview:\n *\n * This module is designed to add support for an async `setValue` API and\n * `disconnected` callback to directives with the least impact on the core\n * runtime or payload when that feature is not used.\n *\n * The strategy is to introduce a `AsyncDirective` subclass of\n * `Directive` that climbs the \"parent\" tree in its constructor to note which\n * branches of lit-html's \"logical tree\" of data structures contain such\n * directives and thus need to be crawled when a subtree is being cleared (or\n * manually disconnected) in order to run the `disconnected` callback.\n *\n * The \"nodes\" of the logical tree include Parts, TemplateInstances (for when a\n * TemplateResult is committed to a value of a ChildPart), and Directives; these\n * all implement a common interface called `DisconnectableChild`. Each has a\n * `_$parent` reference which is set during construction in the core code, and a\n * `_$disconnectableChildren` field which is initially undefined.\n *\n * The sparse tree created by means of the `AsyncDirective` constructor\n * crawling up the `_$parent` tree and placing a `_$disconnectableChildren` Set\n * on each parent that includes each child that contains a\n * `AsyncDirective` directly or transitively via its children. In order to\n * notify connection state changes and disconnect (or reconnect) a tree, the\n * `_$notifyConnectionChanged` API is patched onto ChildParts as a directive\n * climbs the parent tree, which is called by the core when clearing a part if\n * it exists. When called, that method iterates over the sparse tree of\n * Set<DisconnectableChildren> built up by AsyncDirectives, and calls\n * `_$notifyDirectiveConnectionChanged` on any directives that are encountered\n * in that tree, running the required callbacks.\n *\n * A given \"logical tree\" of lit-html data-structures might look like this:\n *\n * ChildPart(N1) _$dC=[D2,T3]\n * ._directive\n * AsyncDirective(D2)\n * ._value // user value was TemplateResult\n * TemplateInstance(T3) _$dC=[A4,A6,N10,N12]\n * ._parts[]\n * AttributePart(A4) _$dC=[D5]\n * ._directives[]\n * AsyncDirective(D5)\n * AttributePart(A6) _$dC=[D7,D8]\n * ._directives[]\n * AsyncDirective(D7)\n * Directive(D8) _$dC=[D9]\n * ._directive\n * AsyncDirective(D9)\n * ChildPart(N10) _$dC=[D11]\n * ._directive\n * AsyncDirective(D11)\n * ._value\n * string\n * ChildPart(N12) _$dC=[D13,N14,N16]\n * ._directive\n * AsyncDirective(D13)\n * ._value // user value was iterable\n * Array<ChildPart>\n * ChildPart(N14) _$dC=[D15]\n * ._value\n * string\n * ChildPart(N16) _$dC=[D17,T18]\n * ._directive\n * AsyncDirective(D17)\n * ._value // user value was TemplateResult\n * TemplateInstance(T18) _$dC=[A19,A21,N25]\n * ._parts[]\n * AttributePart(A19) _$dC=[D20]\n * ._directives[]\n * AsyncDirective(D20)\n * AttributePart(A21) _$dC=[22,23]\n * ._directives[]\n * AsyncDirective(D22)\n * Directive(D23) _$dC=[D24]\n * ._directive\n * AsyncDirective(D24)\n * ChildPart(N25) _$dC=[D26]\n * ._directive\n * AsyncDirective(D26)\n * ._value\n * string\n *\n * Example 1: The directive in ChildPart(N12) updates and returns `nothing`. The\n * ChildPart will _clear() itself, and so we need to disconnect the \"value\" of\n * the ChildPart (but not its directive). In this case, when `_clear()` calls\n * `_$notifyConnectionChanged()`, we don't iterate all of the\n * _$disconnectableChildren, rather we do a value-specific disconnection: i.e.\n * since the _value was an Array<ChildPart> (because an iterable had been\n * committed), we iterate the array of ChildParts (N14, N16) and run\n * `setConnected` on them (which does recurse down the full tree of\n * `_$disconnectableChildren` below it, and also removes N14 and N16 from N12's\n * `_$disconnectableChildren`). Once the values have been disconnected, we then\n * check whether the ChildPart(N12)'s list of `_$disconnectableChildren` is empty\n * (and would remove it from its parent TemplateInstance(T3) if so), but since\n * it would still contain its directive D13, it stays in the disconnectable\n * tree.\n *\n * Example 2: In the course of Example 1, `setConnected` will reach\n * ChildPart(N16); in this case the entire part is being disconnected, so we\n * simply iterate all of N16's `_$disconnectableChildren` (D17,T18) and\n * recursively run `setConnected` on them. Note that we only remove children\n * from `_$disconnectableChildren` for the top-level values being disconnected\n * on a clear; doing this bookkeeping lower in the tree is wasteful since it's\n * all being thrown away.\n *\n * Example 3: If the LitElement containing the entire tree above becomes\n * disconnected, it will run `childPart.setConnected()` (which calls\n * `childPart._$notifyConnectionChanged()` if it exists); in this case, we\n * recursively run `setConnected()` over the entire tree, without removing any\n * children from `_$disconnectableChildren`, since this tree is required to\n * re-connect the tree, which does the same operation, simply passing\n * `isConnectd: true` down the tree, signaling which callback to run.\n */\n\nimport {AttributePart, ChildPart, Disconnectable, Part} from './lit-html.js';\nimport {isSingleExpression} from './directive-helpers.js';\nimport {Directive, PartInfo, PartType} from './directive.js';\nexport {directive} from './directive.js';\n\nconst DEV_MODE = true;\n\n/**\n * Recursively walks down the tree of Parts/TemplateInstances/Directives to set\n * the connected state of directives and run `disconnected`/ `reconnected`\n * callbacks.\n *\n * @return True if there were children to disconnect; false otherwise\n */\nconst notifyChildrenConnectedChanged = (\n parent: Disconnectable,\n isConnected: boolean\n): boolean => {\n const children = parent._$disconnectableChildren;\n if (children === undefined) {\n return false;\n }\n for (const obj of children) {\n // The existence of `_$notifyDirectiveConnectionChanged` is used as a \"brand\" to\n // disambiguate AsyncDirectives from other DisconnectableChildren\n // (as opposed to using an instanceof check to know when to call it); the\n // redundancy of \"Directive\" in the API name is to avoid conflicting with\n // `_$notifyConnectionChanged`, which exists `ChildParts` which are also in\n // this list\n // Disconnect Directive (and any nested directives contained within)\n // This property needs to remain unminified.\n (obj as AsyncDirective)['_$notifyDirectiveConnectionChanged']?.(\n isConnected,\n false\n );\n // Disconnect Part/TemplateInstance\n notifyChildrenConnectedChanged(obj, isConnected);\n }\n return true;\n};\n\n/**\n * Removes the given child from its parent list of disconnectable children, and\n * if the parent list becomes empty as a result, removes the parent from its\n * parent, and so forth up the tree when that causes subsequent parent lists to\n * become empty.\n */\nconst removeDisconnectableFromParent = (obj: Disconnectable) => {\n let parent, children;\n do {\n if ((parent = obj._$parent) === undefined) {\n break;\n }\n children = parent._$disconnectableChildren!;\n children.delete(obj);\n obj = parent;\n } while (children?.size === 0);\n};\n\nconst addDisconnectableToParent = (obj: Disconnectable) => {\n // Climb the parent tree, creating a sparse tree of children needing\n // disconnection\n for (let parent; (parent = obj._$parent); obj = parent) {\n let children = parent._$disconnectableChildren;\n if (children === undefined) {\n parent._$disconnectableChildren = children = new Set();\n } else if (children.has(obj)) {\n // Once we've reached a parent that already contains this child, we\n // can short-circuit\n break;\n }\n children.add(obj);\n installDisconnectAPI(parent);\n }\n};\n\n/**\n * Changes the parent reference of the ChildPart, and updates the sparse tree of\n * Disconnectable children accordingly.\n *\n * Note, this method will be patched onto ChildPart instances and called from\n * the core code when parts are moved between different parents.\n */\nfunction reparentDisconnectables(this: ChildPart, newParent: Disconnectable) {\n if (this._$disconnectableChildren !== undefined) {\n removeDisconnectableFromParent(this);\n this._$parent = newParent;\n addDisconnectableToParent(this);\n } else {\n this._$parent = newParent;\n }\n}\n\n/**\n * Sets the connected state on any directives contained within the committed\n * value of this part (i.e. within a TemplateInstance or iterable of\n * ChildParts) and runs their `disconnected`/`reconnected`s, as well as within\n * any directives stored on the ChildPart (when `valueOnly` is false).\n *\n * `isClearingValue` should be passed as `true` on a top-level part that is\n * clearing itself, and not as a result of recursively disconnecting directives\n * as part of a `clear` operation higher up the tree. This both ensures that any\n * directive on this ChildPart that produced a value that caused the clear\n * operation is not disconnected, and also serves as a performance optimization\n * to avoid needless bookkeeping when a subtree is going away; when clearing a\n * subtree, only the top-most part need to remove itself from the parent.\n *\n * `fromPartIndex` is passed only in the case of a partial `_clear` running as a\n * result of truncating an iterable.\n *\n * Note, this method will be patched onto ChildPart instances and called from the\n * core code when parts are cleared or the connection state is changed by the\n * user.\n */\nfunction notifyChildPartConnectedChanged(\n this: ChildPart,\n isConnected: boolean,\n isClearingValue = false,\n fromPartIndex = 0\n) {\n const value = this._$committedValue;\n const children = this._$disconnectableChildren;\n if (children === undefined || children.size === 0) {\n return;\n }\n if (isClearingValue) {\n if (Array.isArray(value)) {\n // Iterable case: Any ChildParts created by the iterable should be\n // disconnected and removed from this ChildPart's disconnectable\n // children (starting at `fromPartIndex` in the case of truncation)\n for (let i = fromPartIndex; i < value.length; i++) {\n notifyChildrenConnectedChanged(value[i], false);\n removeDisconnectableFromParent(value[i]);\n }\n } else if (value != null) {\n // TemplateInstance case: If the value has disconnectable children (will\n // only be in the case that it is a TemplateInstance), we disconnect it\n // and remove it from this ChildPart's disconnectable children\n notifyChildrenConnectedChanged(value as Disconnectable, false);\n removeDisconnectableFromParent(value as Disconnectable);\n }\n } else {\n notifyChildrenConnectedChanged(this, isConnected);\n }\n}\n\n/**\n * Patches disconnection API onto ChildParts.\n */\nconst installDisconnectAPI = (obj: Disconnectable) => {\n if ((obj as ChildPart).type == PartType.CHILD) {\n (obj as ChildPart)._$notifyConnectionChanged ??=\n notifyChildPartConnectedChanged;\n (obj as ChildPart)._$reparentDisconnectables ??= reparentDisconnectables;\n }\n};\n\n/**\n * An abstract `Directive` base class whose `disconnected` method will be\n * called when the part containing the directive is cleared as a result of\n * re-rendering, or when the user calls `part.setConnected(false)` on\n * a part that was previously rendered containing the directive (as happens\n * when e.g. a LitElement disconnects from the DOM).\n *\n * If `part.setConnected(true)` is subsequently called on a\n * containing part, the directive's `reconnected` method will be called prior\n * to its next `update`/`render` callbacks. When implementing `disconnected`,\n * `reconnected` should also be implemented to be compatible with reconnection.\n *\n * Note that updates may occur while the directive is disconnected. As such,\n * directives should generally check the `this.isConnected` flag during\n * render/update to determine whether it is safe to subscribe to resources\n * that may prevent garbage collection.\n */\nexport abstract class AsyncDirective extends Directive {\n // As opposed to other Disconnectables, AsyncDirectives always get notified\n // when the RootPart connection changes, so the public `isConnected`\n // is a locally stored variable initialized via its part's getter and synced\n // via `_$notifyDirectiveConnectionChanged`. This is cheaper than using\n // the _$isConnected getter, which has to look back up the tree each time.\n /**\n * The connection state for this Directive.\n */\n isConnected!: boolean;\n\n // @internal\n override _$disconnectableChildren?: Set<Disconnectable> = undefined;\n /**\n * Initialize the part with internal fields\n * @param part\n * @param parent\n * @param attributeIndex\n */\n override _$initialize(\n part: Part,\n parent: Disconnectable,\n attributeIndex: number | undefined\n ) {\n super._$initialize(part, parent, attributeIndex);\n addDisconnectableToParent(this);\n this.isConnected = part._$isConnected;\n }\n // This property needs to remain unminified.\n /**\n * Called from the core code when a directive is going away from a part (in\n * which case `shouldRemoveFromParent` should be true), and from the\n * `setChildrenConnected` helper function when recursively changing the\n * connection state of a tree (in which case `shouldRemoveFromParent` should\n * be false).\n *\n * @param isConnected\n * @param isClearingDirective - True when the directive itself is being\n * removed; false when the tree is being disconnected\n * @internal\n */\n override ['_$notifyDirectiveConnectionChanged'](\n isConnected: boolean,\n isClearingDirective = true\n ) {\n if (isConnected !== this.isConnected) {\n this.isConnected = isConnected;\n if (isConnected) {\n this.reconnected?.();\n } else {\n this.disconnected?.();\n }\n }\n if (isClearingDirective) {\n notifyChildrenConnectedChanged(this, isConnected);\n removeDisconnectableFromParent(this);\n }\n }\n\n /**\n * Sets the value of the directive's Part outside the normal `update`/`render`\n * lifecycle of a directive.\n *\n * This method should not be called synchronously from a directive's `update`\n * or `render`.\n *\n * @param directive The directive to update\n * @param value The value to set\n */\n setValue(value: unknown) {\n if (isSingleExpression(this.__part as unknown as PartInfo)) {\n this.__part._$setValue(value, this);\n } else {\n // this.__attributeIndex will be defined in this case, but\n // assert it in dev mode\n if (DEV_MODE && this.__attributeIndex === undefined) {\n throw new Error(`Expected this.__attributeIndex to be a number`);\n }\n const newValues = [...(this.__part._$committedValue as Array<unknown>)];\n newValues[this.__attributeIndex!] = value;\n (this.__part as AttributePart)._$setValue(newValues, this, 0);\n }\n }\n\n /**\n * User callbacks for implementing logic to release any resources/subscriptions\n * that may have been retained by this directive. Since directives may also be\n * re-connected, `reconnected` should also be implemented to restore the\n * working state of the directive prior to the next render.\n */\n protected disconnected() {}\n protected reconnected() {}\n}\n"],"names":["notifyChildrenConnectedChanged","parent","isConnected","children","_$disconnectableChildren","undefined","obj","removeDisconnectableFromParent","_$parent","delete","size","addDisconnectableToParent","Set","has","add","installDisconnectAPI","reparentDisconnectables","newParent","this","notifyChildPartConnectedChanged","isClearingValue","fromPartIndex","value","_$committedValue","Array","isArray","i","length","type","PartType","CHILD","_$notifyConnectionChanged","_$reparentDisconnectables","AsyncDirective","Directive","constructor","_$initialize","part","attributeIndex","super","_$isConnected","_$AO","isClearingDirective","reconnected","disconnected","setValue","isSingleExpression","__part","_$setValue","newValues","__attributeIndex"],"mappings":";;;;;GAsIA,MAAMA,EAAiC,CACrCC,EACAC,aAEA,MAAMC,EAAWF,EAAOG,KACxB,QAAiBC,IAAbF,EACF,OAAO,EAET,IAAK,MAAMG,KAAOH,eASfG,GAA2D,4BAC1DJ,GACA,GAGFF,EAA+BM,EAAKJ,GAEtC,OAAO,GASHK,EAAkCD,IACtC,IAAIL,EAAQE,EACZ,EAAG,CACD,QAAgCE,KAA3BJ,EAASK,EAAIE,MAChB,MAEFL,EAAWF,EAAOG,KAClBD,EAASM,OAAOH,GAChBA,EAAML,QACoB,KAAnBE,MAAAA,SAAAA,EAAUO,QAGfC,EAA6BL,IAGjC,IAAK,IAAIL,EAASA,EAASK,EAAIE,KAAWF,EAAML,EAAQ,CACtD,IAAIE,EAAWF,EAAOG,KACtB,QAAiBC,IAAbF,EACFF,EAAOG,KAA2BD,EAAW,IAAIS,SAC5C,GAAIT,EAASU,IAAIP,GAGtB,MAEFH,EAASW,IAAIR,GACbS,EAAqBd,KAWzB,SAASe,EAAyCC,QACVZ,IAAlCa,KAAKd,MACPG,EAA+BW,MAC/BA,KAAKV,KAAWS,EAChBN,EAA0BO,OAE1BA,KAAKV,KAAWS,EAyBpB,SAASE,EAEPjB,EACAkB,GAAkB,EAClBC,EAAgB,GAEhB,MAAMC,EAAQJ,KAAKK,KACbpB,EAAWe,KAAKd,KACtB,QAAiBC,IAAbF,GAA4C,IAAlBA,EAASO,KAGvC,GAAIU,EACF,GAAII,MAAMC,QAAQH,GAIhB,IAAK,IAAII,EAAIL,EAAeK,EAAIJ,EAAMK,OAAQD,IAC5C1B,EAA+BsB,EAAMI,IAAI,GACzCnB,EAA+Be,EAAMI,SAErB,MAATJ,IAITtB,EAA+BsB,GAAyB,GACxDf,EAA+Be,SAGjCtB,EAA+BkB,KAAMhB,GAOzC,MAAMa,EAAwBT,gBACvBA,EAAkBsB,MAAQC,EAASC,qBACrCxB,GAAkByB,sBAAAA,KACjBZ,gBACDb,GAAkB0B,sBAAAA,KAA8BhB,WAqB/BiB,UAAuBC,EAA7CC,kCAYWjB,eAAiDb,EAOjD+B,KACPC,EACApC,EACAqC,GAEAC,MAAMH,KAAaC,EAAMpC,EAAQqC,GACjC3B,EAA0BO,MAC1BA,KAAKhB,YAAcmC,EAAKG,KAejBC,KACPvC,EACAwC,GAAsB,WAElBxC,IAAgBgB,KAAKhB,cACvBgB,KAAKhB,YAAcA,EACfA,YACFgB,KAAKyB,iCAALzB,gBAEAA,KAAK0B,kCAAL1B,OAGAwB,IACF1C,EAA+BkB,KAAMhB,GACrCK,EAA+BW,OAcnC2B,SAASvB,GACP,GAAIwB,EAAmB5B,KAAK6B,MAC1B7B,KAAK6B,KAAOC,KAAW1B,EAAOJ,UACzB,CAML,MAAM+B,EAAY,IAAK/B,KAAK6B,KAAOxB,MACnC0B,EAAU/B,KAAKgC,MAAqB5B,EACnCJ,KAAK6B,KAAyBC,KAAWC,EAAW/B,KAAM,IAUrD0B,gBACAD"}
|
|
@@ -25,13 +25,14 @@
|
|
|
25
25
|
* The sparse tree created by means of the `AsyncDirective` constructor
|
|
26
26
|
* crawling up the `_$parent` tree and placing a `_$disconnectableChildren` Set
|
|
27
27
|
* on each parent that includes each child that contains a
|
|
28
|
-
* `AsyncDirective` directly or transitively via its children. In order
|
|
29
|
-
* disconnect (or reconnect) a tree, the
|
|
30
|
-
* onto ChildParts as a directive
|
|
31
|
-
*
|
|
32
|
-
* over the sparse tree of
|
|
33
|
-
* AsyncDirectives, and calls
|
|
34
|
-
* directives that are encountered
|
|
28
|
+
* `AsyncDirective` directly or transitively via its children. In order to
|
|
29
|
+
* notify connection state changes and disconnect (or reconnect) a tree, the
|
|
30
|
+
* `_$notifyConnectionChanged` API is patched onto ChildParts as a directive
|
|
31
|
+
* climbs the parent tree, which is called by the core when clearing a part if
|
|
32
|
+
* it exists. When called, that method iterates over the sparse tree of
|
|
33
|
+
* Set<DisconnectableChildren> built up by AsyncDirectives, and calls
|
|
34
|
+
* `_$notifyDirectiveConnectionChanged` on any directives that are encountered
|
|
35
|
+
* in that tree, running the required callbacks.
|
|
35
36
|
*
|
|
36
37
|
* A given "logical tree" of lit-html data-structures might look like this:
|
|
37
38
|
*
|
|
@@ -87,7 +88,7 @@
|
|
|
87
88
|
* Example 1: The directive in ChildPart(N12) updates and returns `nothing`. The
|
|
88
89
|
* ChildPart will _clear() itself, and so we need to disconnect the "value" of
|
|
89
90
|
* the ChildPart (but not its directive). In this case, when `_clear()` calls
|
|
90
|
-
* `_$
|
|
91
|
+
* `_$notifyConnectionChanged()`, we don't iterate all of the
|
|
91
92
|
* _$disconnectableChildren, rather we do a value-specific disconnection: i.e.
|
|
92
93
|
* since the _value was an Array<ChildPart> (because an iterable had been
|
|
93
94
|
* committed), we iterate the array of ChildParts (N14, N16) and run
|
|
@@ -109,32 +110,37 @@
|
|
|
109
110
|
*
|
|
110
111
|
* Example 3: If the LitElement containing the entire tree above becomes
|
|
111
112
|
* disconnected, it will run `childPart.setConnected()` (which calls
|
|
112
|
-
* `childPart._$
|
|
113
|
+
* `childPart._$notifyConnectionChanged()` if it exists); in this case, we
|
|
113
114
|
* recursively run `setConnected()` over the entire tree, without removing any
|
|
114
115
|
* children from `_$disconnectableChildren`, since this tree is required to
|
|
115
116
|
* re-connect the tree, which does the same operation, simply passing
|
|
116
117
|
* `isConnectd: true` down the tree, signaling which callback to run.
|
|
117
118
|
*/
|
|
118
|
-
import { Directive } from './directive.js';
|
|
119
119
|
import { Disconnectable, Part } from './lit-html.js';
|
|
120
|
-
|
|
120
|
+
import { Directive } from './directive.js';
|
|
121
121
|
export { directive } from './directive.js';
|
|
122
|
-
|
|
123
122
|
/**
|
|
124
123
|
* An abstract `Directive` base class whose `disconnected` method will be
|
|
125
124
|
* called when the part containing the directive is cleared as a result of
|
|
126
|
-
* re-rendering, or when the user calls `part.
|
|
127
|
-
* a part that was previously rendered containing the directive
|
|
125
|
+
* re-rendering, or when the user calls `part.setConnected(false)` on
|
|
126
|
+
* a part that was previously rendered containing the directive (as happens
|
|
127
|
+
* when e.g. a LitElement disconnects from the DOM).
|
|
128
128
|
*
|
|
129
|
-
* If `part.
|
|
129
|
+
* If `part.setConnected(true)` is subsequently called on a
|
|
130
130
|
* containing part, the directive's `reconnected` method will be called prior
|
|
131
131
|
* to its next `update`/`render` callbacks. When implementing `disconnected`,
|
|
132
132
|
* `reconnected` should also be implemented to be compatible with reconnection.
|
|
133
|
+
*
|
|
134
|
+
* Note that updates may occur while the directive is disconnected. As such,
|
|
135
|
+
* directives should generally check the `this.isConnected` flag during
|
|
136
|
+
* render/update to determine whether it is safe to subscribe to resources
|
|
137
|
+
* that may prevent garbage collection.
|
|
133
138
|
*/
|
|
134
139
|
export declare abstract class AsyncDirective extends Directive {
|
|
140
|
+
/**
|
|
141
|
+
* The connection state for this Directive.
|
|
142
|
+
*/
|
|
135
143
|
isConnected: boolean;
|
|
136
|
-
private _pendingValue;
|
|
137
|
-
_$disconnetableChildren?: Set<Disconnectable>;
|
|
138
144
|
/**
|
|
139
145
|
* Initialize the part with internal fields
|
|
140
146
|
* @param part
|
|
@@ -142,40 +148,6 @@ export declare abstract class AsyncDirective extends Directive {
|
|
|
142
148
|
* @param attributeIndex
|
|
143
149
|
*/
|
|
144
150
|
_$initialize(part: Part, parent: Disconnectable, attributeIndex: number | undefined): void;
|
|
145
|
-
/**
|
|
146
|
-
* Called from the core code when a directive is going away from a part (in
|
|
147
|
-
* which case `shouldRemoveFromParent` should be true), and from the
|
|
148
|
-
* `setChildrenConnected` helper function when recursively changing the
|
|
149
|
-
* connection state of a tree (in which case `shouldRemoveFromParent` should
|
|
150
|
-
* be false).
|
|
151
|
-
*
|
|
152
|
-
* @param isConnected
|
|
153
|
-
* @param isClearingDirective - True when the directive itself is being
|
|
154
|
-
* removed; false when the tree is being disconnected
|
|
155
|
-
* @internal
|
|
156
|
-
*/
|
|
157
|
-
_$setDirectiveConnected(isConnected: boolean, isClearingDirective?: boolean): void;
|
|
158
|
-
/**
|
|
159
|
-
* Private method used to set the connection state of the directive and call
|
|
160
|
-
* the respective `disconnected` or `reconnected` callback. Note thatsince
|
|
161
|
-
* `isConnected` defaults to true, we do not run `reconnected` on first
|
|
162
|
-
* render.
|
|
163
|
-
*
|
|
164
|
-
* If a call to `setValue` was made while disconnected, flush it to the part
|
|
165
|
-
* before reconnecting.
|
|
166
|
-
*
|
|
167
|
-
* @param isConnected
|
|
168
|
-
* @internal
|
|
169
|
-
*/
|
|
170
|
-
private _setConnected;
|
|
171
|
-
/**
|
|
172
|
-
* Override of the base `_resolve` method to ensure `reconnected` is run
|
|
173
|
-
* prior to the next render.
|
|
174
|
-
*
|
|
175
|
-
* @override
|
|
176
|
-
* @internal
|
|
177
|
-
*/
|
|
178
|
-
_$resolve(part: Part, props: Array<unknown>): unknown;
|
|
179
151
|
/**
|
|
180
152
|
* Sets the value of the directive's Part outside the normal `update`/`render`
|
|
181
153
|
* lifecycle of a directive.
|
|
@@ -183,9 +155,6 @@ export declare abstract class AsyncDirective extends Directive {
|
|
|
183
155
|
* This method should not be called synchronously from a directive's `update`
|
|
184
156
|
* or `render`.
|
|
185
157
|
*
|
|
186
|
-
* If the method is called while the part is disconnected, the value will be
|
|
187
|
-
* queued until directive is reconnected.
|
|
188
|
-
*
|
|
189
158
|
* @param directive The directive to update
|
|
190
159
|
* @param value The value to set
|
|
191
160
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"async-directive.d.ts","sourceRoot":"","sources":["../src/async-directive.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH
|
|
1
|
+
{"version":3,"file":"async-directive.d.ts","sourceRoot":"","sources":["../src/async-directive.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgHG;AAEH,OAAO,EAA2B,cAAc,EAAE,IAAI,EAAC,MAAM,eAAe,CAAC;AAE7E,OAAO,EAAC,SAAS,EAAqB,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AA0JzC;;;;;;;;;;;;;;;;GAgBG;AACH,8BAAsB,cAAe,SAAQ,SAAS;IAMpD;;OAEG;IACH,WAAW,EAAG,OAAO,CAAC;IAItB;;;;;OAKG;IACM,YAAY,CACnB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,cAAc,EACtB,cAAc,EAAE,MAAM,GAAG,SAAS;IAqCpC;;;;;;;;;OASG;IACH,QAAQ,CAAC,KAAK,EAAE,OAAO;IAevB;;;;;OAKG;IACH,SAAS,CAAC,YAAY;IACtB,SAAS,CAAC,WAAW;CACtB"}
|