@slotted/angular 0.1.0-beta.7 → 0.1.0-beta.9

package/fesm2022/slotted-angular-scroll-area.mjs

@@ -220,10 +220,11 @@ class SlScrollArea {
         this.scrollChange.emit({ position: this.edges.position(), source: event });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlScrollArea, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: SlScrollArea, isStandalone: true, selector: "[slScrollArea]", inputs: { axis: { classPropertyName: "axis", publicName: "axis", isSignal: true, isRequired: false, transformFunction: null }, scrollbars: { classPropertyName: "scrollbars", publicName: "scrollbars", isSignal: true, isRequired: false, transformFunction: null }, gutter: { classPropertyName: "gutter", publicName: "gutter", isSignal: true, isRequired: false, transformFunction: null }, fade: { classPropertyName: "fade", publicName: "fade", isSignal: true, isRequired: false, transformFunction: null }, overscroll: { classPropertyName: "overscroll", publicName: "overscroll", isSignal: true, isRequired: false, transformFunction: null }, maxBlockSize: { classPropertyName: "maxBlockSize", publicName: "maxBlockSize", isSignal: true, isRequired: false, transformFunction: null }, maxInlineSize: { classPropertyName: "maxInlineSize", publicName: "maxInlineSize", isSignal: true, isRequired: false, transformFunction: null }, tabbable: { classPropertyName: "tabbable", publicName: "tabbable", isSignal: true, isRequired: false, transformFunction: null }, labelledBy: { classPropertyName: "labelledBy", publicName: "labelledBy", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { scrollChange: "scrollChange", overflowChange: "overflowChange" }, host: { attributes: { "data-ui": "scroll-area", "data-part": "root" }, properties: { "attr.data-axis": "resolvedAxis()", "attr.data-scrollbars": "resolvedScrollbars()", "attr.data-gutter": "resolvedGutter()", "attr.data-fade": "resolvedFade()", "attr.data-overscroll": "resolvedOverscroll()", "attr.data-overflowing": "edgeAttributes()['data-overflowing'] ?? null", "attr.data-at-block-start": "edgeAttributes()['data-at-block-start'] ?? null", "attr.data-at-block-end": "edgeAttributes()['data-at-block-end'] ?? null", "attr.data-at-inline-start": "edgeAttributes()['data-at-inline-start'] ?? null", "attr.data-at-inline-end": "edgeAttributes()['data-at-inline-end'] ?? null", "attr.data-sideways": "sideways() ? '' : null", "style.max-block-size": "maxBlockSize() ?? null", "style.max-inline-size": "maxInlineSize() ?? null" } }, viewQueries: [{ propertyName: "viewportRef", first: true, predicate: ["viewport"], descendants: true, isSignal: true }], exportAs: ["slScrollArea"], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: SlScrollArea, isStandalone: true, selector: "[slScrollArea]", inputs: { axis: { classPropertyName: "axis", publicName: "axis", isSignal: true, isRequired: false, transformFunction: null }, scrollbars: { classPropertyName: "scrollbars", publicName: "scrollbars", isSignal: true, isRequired: false, transformFunction: null }, gutter: { classPropertyName: "gutter", publicName: "gutter", isSignal: true, isRequired: false, transformFunction: null }, fade: { classPropertyName: "fade", publicName: "fade", isSignal: true, isRequired: false, transformFunction: null }, overscroll: { classPropertyName: "overscroll", publicName: "overscroll", isSignal: true, isRequired: false, transformFunction: null }, maxBlockSize: { classPropertyName: "maxBlockSize", publicName: "maxBlockSize", isSignal: true, isRequired: false, transformFunction: null }, maxInlineSize: { classPropertyName: "maxInlineSize", publicName: "maxInlineSize", isSignal: true, isRequired: false, transformFunction: null }, tabbable: { classPropertyName: "tabbable", publicName: "tabbable", isSignal: true, isRequired: false, transformFunction: null }, labelledBy: { classPropertyName: "labelledBy", publicName: "labelledBy", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { scrollChange: "scrollChange", overflowChange: "overflowChange" }, host: { attributes: { "data-ui": "scroll-area", "data-ui-scroll-area": "", "data-part": "root", "data-part-root": "" }, properties: { "attr.data-axis": "resolvedAxis()", "attr.data-scrollbars": "resolvedScrollbars()", "attr.data-gutter": "resolvedGutter()", "attr.data-fade": "resolvedFade()", "attr.data-overscroll": "resolvedOverscroll()", "attr.data-overflowing": "edgeAttributes()['data-overflowing'] ?? null", "attr.data-at-block-start": "edgeAttributes()['data-at-block-start'] ?? null", "attr.data-at-block-end": "edgeAttributes()['data-at-block-end'] ?? null", "attr.data-at-inline-start": "edgeAttributes()['data-at-inline-start'] ?? null", "attr.data-at-inline-end": "edgeAttributes()['data-at-inline-end'] ?? null", "attr.data-sideways": "sideways() ? '' : null", "style.max-block-size": "maxBlockSize() ?? null", "style.max-inline-size": "maxInlineSize() ?? null" } }, viewQueries: [{ propertyName: "viewportRef", first: true, predicate: ["viewport"], descendants: true, isSignal: true }], exportAs: ["slScrollArea"], ngImport: i0, template: `
     <div
       #viewport
       data-part="viewport"
+      data-part-viewport=""
       [attr.role]="wired() ? 'region' : null"
       [attr.tabindex]="wired() ? '0' : null"
       [attr.aria-label]="ariaLabel()"
@@ -232,7 +233,7 @@ class SlScrollArea {
     >
       <ng-content />
     </div>
-  `, isInline: true, styles: ["@layer slotted.components{[data-ui=scroll-area]{--_fade: min(var(--slotted-scroll-area-fade-size, var(--slotted-space-8, 1.5rem)), 20%);--_thumb: var(--slotted-scroll-area-thumb-color, var(--slotted-border-strong, ButtonBorder));--_track: var(--slotted-scroll-area-track-color, var(--slotted-surface-sunken, Canvas));display:grid;box-sizing:border-box;min-block-size:0;min-inline-size:0}[data-ui=scroll-area]>[data-part=viewport]{--_scroll-area-fade-block-start: var(--_fade);--_scroll-area-fade-block-end: var(--_fade);--_scroll-area-fade-inline-start: var(--_fade);--_scroll-area-fade-inline-end: var(--_fade);--_fade-top: var(--_scroll-area-fade-block-start);--_fade-bottom: var(--_scroll-area-fade-block-end);--_fade-left: var(--_scroll-area-fade-inline-start);--_fade-right: var(--_scroll-area-fade-inline-end);box-sizing:border-box;min-block-size:0;min-inline-size:0;border-radius:inherit;scrollbar-gutter:stable;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--_thumb) var(--_track);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect;transition:--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=scroll-area]:dir(rtl)>[data-part=viewport]{--_fade-left: var(--_scroll-area-fade-inline-end);--_fade-right: var(--_scroll-area-fade-inline-start)}[data-ui=scroll-area][data-axis=block]>[data-part=viewport]{overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto}[data-ui=scroll-area][data-axis=inline]>[data-part=viewport]{overflow-x:auto;overflow-y:hidden;overflow-inline:auto;overflow-block:hidden}[data-ui=scroll-area][data-axis=both]>[data-part=viewport]{overflow:auto}[data-ui=scroll-area][data-scrollbars=always][data-axis=block]>[data-part=viewport]{overflow-y:scroll;overflow-block:scroll}[data-ui=scroll-area][data-scrollbars=always][data-axis=inline]>[data-part=viewport]{overflow-x:scroll;overflow-inline:scroll}[data-ui=scroll-area][data-scrollbars=always][data-axis=both]>[data-part=viewport]{overflow:scroll}[data-ui=scroll-area][data-scrollbars=none]>[data-part=viewport]{scrollbar-width:none}[data-ui=scroll-area][data-scrollbars=hover]>[data-part=viewport]{scrollbar-color:transparent transparent;transition:scrollbar-color var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=scroll-area][data-scrollbars=hover]:not([data-disabled]):hover>[data-part=viewport],[data-ui=scroll-area][data-scrollbars=hover]:focus-within>[data-part=viewport]{scrollbar-color:var(--_thumb) var(--_track)}[data-ui=scroll-area][data-gutter=auto]>[data-part=viewport]{scrollbar-gutter:auto}[data-ui=scroll-area][data-gutter=both-edges]>[data-part=viewport]{scrollbar-gutter:stable both-edges}[data-ui=scroll-area][data-overscroll=auto]>[data-part=viewport]{overscroll-behavior:auto}[data-ui=scroll-area][data-overscroll=none]>[data-part=viewport]{overscroll-behavior:none}[data-ui=scroll-area][data-axis=inline]>[data-part=viewport]{overscroll-behavior-y:auto;overscroll-behavior-block:auto}[data-ui=scroll-area][data-axis=block]>[data-part=viewport]{overscroll-behavior-x:auto;overscroll-behavior-inline:auto}[data-ui=scroll-area][data-at-block-start]>[data-part=viewport]{--_scroll-area-fade-block-start: 0px}[data-ui=scroll-area][data-at-block-end]>[data-part=viewport]{--_scroll-area-fade-block-end: 0px}[data-ui=scroll-area][data-at-inline-start]>[data-part=viewport]{--_scroll-area-fade-inline-start: 0px}[data-ui=scroll-area][data-at-inline-end]>[data-part=viewport]{--_scroll-area-fade-inline-end: 0px}[data-ui=scroll-area][data-fade=end]>[data-part=viewport]{--_scroll-area-fade-block-start: 0px;--_scroll-area-fade-inline-start: 0px}[data-ui=scroll-area][data-fade=none]>[data-part=viewport],[data-ui=scroll-area][data-sideways]>[data-part=viewport]{-webkit-mask-image:none;mask-image:none}[data-ui=scroll-area]>[data-part=viewport]>[data-part=content]{box-sizing:border-box;min-inline-size:fit-content;padding:var(--slotted-scroll-area-inset, var(--slotted-space-5, .75rem))}[data-ui=scroll-area]>[data-part=viewport]:focus{outline:none}[data-ui=scroll-area]:has(>[data-part=viewport]:focus-visible[data-focus-origin=keyboard]){outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}@media print{[data-ui=scroll-area],[data-ui=scroll-area]>[data-part=viewport]{max-block-size:none;max-inline-size:none;overflow:visible;-webkit-mask-image:none;mask-image:none}}@media(forced-colors:active){[data-ui=scroll-area]>[data-part=viewport]{-webkit-mask-image:none;mask-image:none;scrollbar-color:auto}}}@property --_scroll-area-fade-block-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-block-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: ["@layer slotted.components{[data-ui-scroll-area]{--_fade: min(var(--slotted-scroll-area-fade-size, var(--slotted-space-8, 1.5rem)), 20%);--_thumb: var(--slotted-scroll-area-thumb-color, var(--slotted-border-strong, ButtonBorder));--_track: var(--slotted-scroll-area-track-color, var(--slotted-surface-sunken, Canvas));display:grid;box-sizing:border-box;min-block-size:0;min-inline-size:0}[data-ui-scroll-area]>[data-part-viewport]{--_scroll-area-fade-block-start: var(--_fade);--_scroll-area-fade-block-end: var(--_fade);--_scroll-area-fade-inline-start: var(--_fade);--_scroll-area-fade-inline-end: var(--_fade);--_fade-top: var(--_scroll-area-fade-block-start);--_fade-bottom: var(--_scroll-area-fade-block-end);--_fade-left: var(--_scroll-area-fade-inline-start);--_fade-right: var(--_scroll-area-fade-inline-end);box-sizing:border-box;min-block-size:0;min-inline-size:0;border-radius:inherit;scrollbar-gutter:stable;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--_thumb) var(--_track);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect;transition:--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui-scroll-area]:dir(rtl)>[data-part-viewport]{--_fade-left: var(--_scroll-area-fade-inline-end);--_fade-right: var(--_scroll-area-fade-inline-start)}[data-ui-scroll-area][data-axis=block]>[data-part-viewport]{overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto}[data-ui-scroll-area][data-axis=inline]>[data-part-viewport]{overflow-x:auto;overflow-y:hidden;overflow-inline:auto;overflow-block:hidden}[data-ui-scroll-area][data-axis=both]>[data-part-viewport]{overflow:auto}[data-ui-scroll-area][data-scrollbars=always][data-axis=block]>[data-part-viewport]{overflow-y:scroll;overflow-block:scroll}[data-ui-scroll-area][data-scrollbars=always][data-axis=inline]>[data-part-viewport]{overflow-x:scroll;overflow-inline:scroll}[data-ui-scroll-area][data-scrollbars=always][data-axis=both]>[data-part-viewport]{overflow:scroll}[data-ui-scroll-area][data-scrollbars=none]>[data-part-viewport]{scrollbar-width:none}[data-ui-scroll-area][data-scrollbars=hover]>[data-part-viewport]{scrollbar-color:transparent transparent;transition:scrollbar-color var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui-scroll-area][data-scrollbars=hover]:not([data-disabled]):hover>[data-part-viewport],[data-ui-scroll-area][data-scrollbars=hover]:focus-within>[data-part-viewport]{scrollbar-color:var(--_thumb) var(--_track)}[data-ui-scroll-area][data-gutter=auto]>[data-part-viewport]{scrollbar-gutter:auto}[data-ui-scroll-area][data-gutter=both-edges]>[data-part-viewport]{scrollbar-gutter:stable both-edges}[data-ui-scroll-area][data-overscroll=auto]>[data-part-viewport]{overscroll-behavior:auto}[data-ui-scroll-area][data-overscroll=none]>[data-part-viewport]{overscroll-behavior:none}[data-ui-scroll-area][data-axis=inline]>[data-part-viewport]{overscroll-behavior-y:auto;overscroll-behavior-block:auto}[data-ui-scroll-area][data-axis=block]>[data-part-viewport]{overscroll-behavior-x:auto;overscroll-behavior-inline:auto}[data-ui-scroll-area][data-at-block-start]>[data-part-viewport]{--_scroll-area-fade-block-start: 0px}[data-ui-scroll-area][data-at-block-end]>[data-part-viewport]{--_scroll-area-fade-block-end: 0px}[data-ui-scroll-area][data-at-inline-start]>[data-part-viewport]{--_scroll-area-fade-inline-start: 0px}[data-ui-scroll-area][data-at-inline-end]>[data-part-viewport]{--_scroll-area-fade-inline-end: 0px}[data-ui-scroll-area][data-fade=end]>[data-part-viewport]{--_scroll-area-fade-block-start: 0px;--_scroll-area-fade-inline-start: 0px}[data-ui-scroll-area][data-fade=none]>[data-part-viewport],[data-ui-scroll-area][data-sideways]>[data-part-viewport]{-webkit-mask-image:none;mask-image:none}[data-ui-scroll-area]>[data-part-viewport]>[data-part-content]{box-sizing:border-box;min-inline-size:fit-content;padding:var(--slotted-scroll-area-inset, var(--slotted-space-5, .75rem))}[data-ui-scroll-area]>[data-part-viewport]:focus{outline:none}[data-ui-scroll-area]:has(>[data-part-viewport]:focus-visible[data-focus-origin=keyboard]){outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}@media print{[data-ui-scroll-area],[data-ui-scroll-area]>[data-part-viewport]{max-block-size:none;max-inline-size:none;overflow:visible;-webkit-mask-image:none;mask-image:none}}@media(forced-colors:active){[data-ui-scroll-area]>[data-part-viewport]{-webkit-mask-image:none;mask-image:none;scrollbar-color:auto}}}@property --_scroll-area-fade-block-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-block-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlScrollArea, decorators: [{
             type: Component,
@@ -240,6 +241,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
     <div
       #viewport
       data-part="viewport"
+      data-part-viewport=""
       [attr.role]="wired() ? 'region' : null"
       [attr.tabindex]="wired() ? '0' : null"
       [attr.aria-label]="ariaLabel()"
@@ -250,7 +252,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
     </div>
   `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         'data-ui': 'scroll-area',
+                        'data-ui-scroll-area': '',
                         'data-part': 'root',
+                        'data-part-root': '',
                         '[attr.data-axis]': 'resolvedAxis()',
                         '[attr.data-scrollbars]': 'resolvedScrollbars()',
                         '[attr.data-gutter]': 'resolvedGutter()',
@@ -264,7 +268,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                         '[attr.data-sideways]': "sideways() ? '' : null",
                         '[style.max-block-size]': 'maxBlockSize() ?? null',
                         '[style.max-inline-size]': 'maxInlineSize() ?? null',
-                    }, styles: ["@layer slotted.components{[data-ui=scroll-area]{--_fade: min(var(--slotted-scroll-area-fade-size, var(--slotted-space-8, 1.5rem)), 20%);--_thumb: var(--slotted-scroll-area-thumb-color, var(--slotted-border-strong, ButtonBorder));--_track: var(--slotted-scroll-area-track-color, var(--slotted-surface-sunken, Canvas));display:grid;box-sizing:border-box;min-block-size:0;min-inline-size:0}[data-ui=scroll-area]>[data-part=viewport]{--_scroll-area-fade-block-start: var(--_fade);--_scroll-area-fade-block-end: var(--_fade);--_scroll-area-fade-inline-start: var(--_fade);--_scroll-area-fade-inline-end: var(--_fade);--_fade-top: var(--_scroll-area-fade-block-start);--_fade-bottom: var(--_scroll-area-fade-block-end);--_fade-left: var(--_scroll-area-fade-inline-start);--_fade-right: var(--_scroll-area-fade-inline-end);box-sizing:border-box;min-block-size:0;min-inline-size:0;border-radius:inherit;scrollbar-gutter:stable;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--_thumb) var(--_track);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect;transition:--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=scroll-area]:dir(rtl)>[data-part=viewport]{--_fade-left: var(--_scroll-area-fade-inline-end);--_fade-right: var(--_scroll-area-fade-inline-start)}[data-ui=scroll-area][data-axis=block]>[data-part=viewport]{overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto}[data-ui=scroll-area][data-axis=inline]>[data-part=viewport]{overflow-x:auto;overflow-y:hidden;overflow-inline:auto;overflow-block:hidden}[data-ui=scroll-area][data-axis=both]>[data-part=viewport]{overflow:auto}[data-ui=scroll-area][data-scrollbars=always][data-axis=block]>[data-part=viewport]{overflow-y:scroll;overflow-block:scroll}[data-ui=scroll-area][data-scrollbars=always][data-axis=inline]>[data-part=viewport]{overflow-x:scroll;overflow-inline:scroll}[data-ui=scroll-area][data-scrollbars=always][data-axis=both]>[data-part=viewport]{overflow:scroll}[data-ui=scroll-area][data-scrollbars=none]>[data-part=viewport]{scrollbar-width:none}[data-ui=scroll-area][data-scrollbars=hover]>[data-part=viewport]{scrollbar-color:transparent transparent;transition:scrollbar-color var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=scroll-area][data-scrollbars=hover]:not([data-disabled]):hover>[data-part=viewport],[data-ui=scroll-area][data-scrollbars=hover]:focus-within>[data-part=viewport]{scrollbar-color:var(--_thumb) var(--_track)}[data-ui=scroll-area][data-gutter=auto]>[data-part=viewport]{scrollbar-gutter:auto}[data-ui=scroll-area][data-gutter=both-edges]>[data-part=viewport]{scrollbar-gutter:stable both-edges}[data-ui=scroll-area][data-overscroll=auto]>[data-part=viewport]{overscroll-behavior:auto}[data-ui=scroll-area][data-overscroll=none]>[data-part=viewport]{overscroll-behavior:none}[data-ui=scroll-area][data-axis=inline]>[data-part=viewport]{overscroll-behavior-y:auto;overscroll-behavior-block:auto}[data-ui=scroll-area][data-axis=block]>[data-part=viewport]{overscroll-behavior-x:auto;overscroll-behavior-inline:auto}[data-ui=scroll-area][data-at-block-start]>[data-part=viewport]{--_scroll-area-fade-block-start: 0px}[data-ui=scroll-area][data-at-block-end]>[data-part=viewport]{--_scroll-area-fade-block-end: 0px}[data-ui=scroll-area][data-at-inline-start]>[data-part=viewport]{--_scroll-area-fade-inline-start: 0px}[data-ui=scroll-area][data-at-inline-end]>[data-part=viewport]{--_scroll-area-fade-inline-end: 0px}[data-ui=scroll-area][data-fade=end]>[data-part=viewport]{--_scroll-area-fade-block-start: 0px;--_scroll-area-fade-inline-start: 0px}[data-ui=scroll-area][data-fade=none]>[data-part=viewport],[data-ui=scroll-area][data-sideways]>[data-part=viewport]{-webkit-mask-image:none;mask-image:none}[data-ui=scroll-area]>[data-part=viewport]>[data-part=content]{box-sizing:border-box;min-inline-size:fit-content;padding:var(--slotted-scroll-area-inset, var(--slotted-space-5, .75rem))}[data-ui=scroll-area]>[data-part=viewport]:focus{outline:none}[data-ui=scroll-area]:has(>[data-part=viewport]:focus-visible[data-focus-origin=keyboard]){outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}@media print{[data-ui=scroll-area],[data-ui=scroll-area]>[data-part=viewport]{max-block-size:none;max-inline-size:none;overflow:visible;-webkit-mask-image:none;mask-image:none}}@media(forced-colors:active){[data-ui=scroll-area]>[data-part=viewport]{-webkit-mask-image:none;mask-image:none;scrollbar-color:auto}}}@property --_scroll-area-fade-block-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-block-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}\n"] }]
+                    }, styles: ["@layer slotted.components{[data-ui-scroll-area]{--_fade: min(var(--slotted-scroll-area-fade-size, var(--slotted-space-8, 1.5rem)), 20%);--_thumb: var(--slotted-scroll-area-thumb-color, var(--slotted-border-strong, ButtonBorder));--_track: var(--slotted-scroll-area-track-color, var(--slotted-surface-sunken, Canvas));display:grid;box-sizing:border-box;min-block-size:0;min-inline-size:0}[data-ui-scroll-area]>[data-part-viewport]{--_scroll-area-fade-block-start: var(--_fade);--_scroll-area-fade-block-end: var(--_fade);--_scroll-area-fade-inline-start: var(--_fade);--_scroll-area-fade-inline-end: var(--_fade);--_fade-top: var(--_scroll-area-fade-block-start);--_fade-bottom: var(--_scroll-area-fade-block-end);--_fade-left: var(--_scroll-area-fade-inline-start);--_fade-right: var(--_scroll-area-fade-inline-end);box-sizing:border-box;min-block-size:0;min-inline-size:0;border-radius:inherit;scrollbar-gutter:stable;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--_thumb) var(--_track);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 var(--_fade-top),#000 calc(100% - var(--_fade-bottom)),transparent 100%),linear-gradient(to right,transparent 0,#000 var(--_fade-left),#000 calc(100% - var(--_fade-right)),transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect;transition:--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui-scroll-area]:dir(rtl)>[data-part-viewport]{--_fade-left: var(--_scroll-area-fade-inline-end);--_fade-right: var(--_scroll-area-fade-inline-start)}[data-ui-scroll-area][data-axis=block]>[data-part-viewport]{overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto}[data-ui-scroll-area][data-axis=inline]>[data-part-viewport]{overflow-x:auto;overflow-y:hidden;overflow-inline:auto;overflow-block:hidden}[data-ui-scroll-area][data-axis=both]>[data-part-viewport]{overflow:auto}[data-ui-scroll-area][data-scrollbars=always][data-axis=block]>[data-part-viewport]{overflow-y:scroll;overflow-block:scroll}[data-ui-scroll-area][data-scrollbars=always][data-axis=inline]>[data-part-viewport]{overflow-x:scroll;overflow-inline:scroll}[data-ui-scroll-area][data-scrollbars=always][data-axis=both]>[data-part-viewport]{overflow:scroll}[data-ui-scroll-area][data-scrollbars=none]>[data-part-viewport]{scrollbar-width:none}[data-ui-scroll-area][data-scrollbars=hover]>[data-part-viewport]{scrollbar-color:transparent transparent;transition:scrollbar-color var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-block-end var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-start var(--slotted-duration-short) var(--slotted-easing-standard),--_scroll-area-fade-inline-end var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui-scroll-area][data-scrollbars=hover]:not([data-disabled]):hover>[data-part-viewport],[data-ui-scroll-area][data-scrollbars=hover]:focus-within>[data-part-viewport]{scrollbar-color:var(--_thumb) var(--_track)}[data-ui-scroll-area][data-gutter=auto]>[data-part-viewport]{scrollbar-gutter:auto}[data-ui-scroll-area][data-gutter=both-edges]>[data-part-viewport]{scrollbar-gutter:stable both-edges}[data-ui-scroll-area][data-overscroll=auto]>[data-part-viewport]{overscroll-behavior:auto}[data-ui-scroll-area][data-overscroll=none]>[data-part-viewport]{overscroll-behavior:none}[data-ui-scroll-area][data-axis=inline]>[data-part-viewport]{overscroll-behavior-y:auto;overscroll-behavior-block:auto}[data-ui-scroll-area][data-axis=block]>[data-part-viewport]{overscroll-behavior-x:auto;overscroll-behavior-inline:auto}[data-ui-scroll-area][data-at-block-start]>[data-part-viewport]{--_scroll-area-fade-block-start: 0px}[data-ui-scroll-area][data-at-block-end]>[data-part-viewport]{--_scroll-area-fade-block-end: 0px}[data-ui-scroll-area][data-at-inline-start]>[data-part-viewport]{--_scroll-area-fade-inline-start: 0px}[data-ui-scroll-area][data-at-inline-end]>[data-part-viewport]{--_scroll-area-fade-inline-end: 0px}[data-ui-scroll-area][data-fade=end]>[data-part-viewport]{--_scroll-area-fade-block-start: 0px;--_scroll-area-fade-inline-start: 0px}[data-ui-scroll-area][data-fade=none]>[data-part-viewport],[data-ui-scroll-area][data-sideways]>[data-part-viewport]{-webkit-mask-image:none;mask-image:none}[data-ui-scroll-area]>[data-part-viewport]>[data-part-content]{box-sizing:border-box;min-inline-size:fit-content;padding:var(--slotted-scroll-area-inset, var(--slotted-space-5, .75rem))}[data-ui-scroll-area]>[data-part-viewport]:focus{outline:none}[data-ui-scroll-area]:has(>[data-part-viewport]:focus-visible[data-focus-origin=keyboard]){outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}@media print{[data-ui-scroll-area],[data-ui-scroll-area]>[data-part-viewport]{max-block-size:none;max-inline-size:none;overflow:visible;-webkit-mask-image:none;mask-image:none}}@media(forced-colors:active){[data-ui-scroll-area]>[data-part-viewport]{-webkit-mask-image:none;mask-image:none;scrollbar-color:auto}}}@property --_scroll-area-fade-block-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-block-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-start{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}@property --_scroll-area-fade-inline-end{syntax: \"<length-percentage>\"; inherits: false; initial-value: 0px;}\n"] }]
         }], ctorParameters: () => [], propDecorators: { axis: [{ type: i0.Input, args: [{ isSignal: true, alias: "axis", required: false }] }], scrollbars: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollbars", required: false }] }], gutter: [{ type: i0.Input, args: [{ isSignal: true, alias: "gutter", required: false }] }], fade: [{ type: i0.Input, args: [{ isSignal: true, alias: "fade", required: false }] }], overscroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "overscroll", required: false }] }], maxBlockSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxBlockSize", required: false }] }], maxInlineSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxInlineSize", required: false }] }], tabbable: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabbable", required: false }] }], labelledBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelledBy", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], scrollChange: [{ type: i0.Output, args: ["scrollChange"] }], overflowChange: [{ type: i0.Output, args: ["overflowChange"] }], viewportRef: [{ type: i0.ViewChild, args: ['viewport', { isSignal: true }] }] } });
 /**
  * The inset that scrolls with the content.
@@ -278,7 +282,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
  */
 class SlScrollAreaContent {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlScrollAreaContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlScrollAreaContent, isStandalone: true, selector: "[slScrollAreaContent]", host: { attributes: { "data-part": "content" } }, exportAs: ["slScrollAreaContent"], ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlScrollAreaContent, isStandalone: true, selector: "[slScrollAreaContent]", host: { attributes: { "data-part": "content", "data-part-content": "" } }, exportAs: ["slScrollAreaContent"], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlScrollAreaContent, decorators: [{
             type: Directive,
@@ -286,7 +290,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                     selector: '[slScrollAreaContent]',
                     standalone: true,
                     exportAs: 'slScrollAreaContent',
-                    host: { 'data-part': 'content' },
+                    host: { 'data-part': 'content', 'data-part-content': '' },
                 }]
         }] });
 

package/fesm2022/slotted-angular-scroll-area.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"slotted-angular-scroll-area.mjs","sources":["../../scroll-area/src/scroll-area-defaults.ts","../../scroll-area/src/scroll-area.ts","../../scroll-area/src/slotted-angular-scroll-area.ts"],"sourcesContent":["import { inject, InjectionToken } from '@angular/core';\n\n/** Which axes scroll. Logical, so a vertical writing mode needs no second vocabulary. */\nexport type ScrollAreaAxis = 'block' | 'inline' | 'both';\n\n/**\n * What the scrollbar does. `auto` is `overflow: auto`; `always` is\n * `overflow: scroll`; `hover` paints the bar transparent until a pointer or the\n * keyboard is inside; `none` removes the bar and leaves the scrolling.\n *\n * `scroll` — visible only while scrolling, which Radix and Mantine both ship —\n * is folded into `hover`, because it is what a platform overlay scrollbar\n * already does on its own.\n */\nexport type ScrollAreaScrollbars = 'auto' | 'always' | 'hover' | 'none';\n\n/** `scrollbar-gutter`, and `stable` is the default because content that shifts is the defect. */\nexport type ScrollAreaGutter = 'auto' | 'stable' | 'both-edges';\n\n/**\n * Where the veil is drawn. `both` dims what the reader has passed as well as\n * what is ahead; `end` only what is ahead; `none` leaves the scrollbar to say\n * there is more.\n */\nexport type ScrollAreaFade = 'both' | 'end' | 'none';\n\n/** `overscroll-behavior`, and `contain` is the default. */\nexport type ScrollAreaOverscroll = 'contain' | 'auto' | 'none';\n\nexport interface ScrollAreaDefaults {\n  axis: ScrollAreaAxis;\n  scrollbars: ScrollAreaScrollbars;\n  gutter: ScrollAreaGutter;\n  fade: ScrollAreaFade;\n  overscroll: ScrollAreaOverscroll;\n}\n\nconst FALLBACK: ScrollAreaDefaults = {\n  axis: 'block',\n  fade: 'both',\n  gutter: 'stable',\n  overscroll: 'contain',\n  scrollbars: 'auto',\n};\n\nexport const SCROLL_AREA_DEFAULTS = new InjectionToken<ScrollAreaDefaults>(\n  'slotted scroll-area defaults',\n  { providedIn: 'root', factory: () => FALLBACK },\n);\n\n/**\n * An application decides once what its scroll areas look like — whether the\n * bar waits for a hand, whether the veil dims both ends — rather than repeating\n * it on fifty of them. A region's name comes from the language in force\n * (`provideSlotted`).\n *\n * None of the five surveyed implementations has an equivalent: each takes its\n * policy per instance, and Mantine's `type` in particular is written on every\n * call site of every product that uses it.\n */\nexport function provideScrollAreaDefaults(defaults: Partial<ScrollAreaDefaults>) {\n  return {\n    provide: SCROLL_AREA_DEFAULTS,\n    useFactory: (): ScrollAreaDefaults => ({ ...FALLBACK, ...defaults }),\n  };\n}\n\n/** What a scroll area is here, before it states anything of its own. */\nexport function injectScrollAreaDefaults(): ScrollAreaDefaults {\n  return inject(SCROLL_AREA_DEFAULTS);\n}\n","import { createFocusOrigin } from '@slotted/core/focus';\nimport {\n  createScrollEdges,\n  NO_SCROLL_EDGES,\n  scrollEdgeAttributes,\n  type LogicalEdge,\n  type ScrollEdgesHandle,\n  type ScrollEdgesState,\n  type ScrollPosition,\n} from '@slotted/core/overflow';\nimport {\n  afterNextRender,\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  DestroyRef,\n  Directive,\n  ElementRef,\n  inject,\n  input,\n  output,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { injectMessages } from '@slotted/angular/i18n';\nimport {\n  scrollAreaMessages,\n  type PartialMessages,\n  type ScrollAreaMessages,\n} from '@slotted/core/i18n';\n\nimport { injectScrollAreaDefaults } from './scroll-area-defaults';\nimport type {\n  ScrollAreaAxis,\n  ScrollAreaFade,\n  ScrollAreaGutter,\n  ScrollAreaOverscroll,\n  ScrollAreaScrollbars,\n} from './scroll-area-defaults';\n\n/** What `scrollChange` carries: where the scroller is, and the event that moved it. */\nexport interface ScrollAreaScrollEvent {\n  readonly position: ScrollPosition;\n  readonly source: Event;\n}\n\n/**\n * A scrollport, and the box that frames it.\n *\n * The scrollbar is the platform's, themed by the stylesheet through\n * `scrollbar-color`; the keyboard is the platform's too. What this component\n * adds is the measurement of whether the content overflows and which of its\n * ends show, published on the frame for CSS and emitted to the consumer, and\n * the tab stop a scrolling region owes a keyboard together with the name that\n * tab stop owes a screen reader — both written only while the content actually\n * overflows, which is the pattern `prose` shipped first for one block inside a\n * document.\n *\n * The frame is the consumer's own element — `<div slScrollArea>` — and the\n * scrollport is the component's, projected into: the frame is where a border,\n * a radius and a ground go, and the scrollport is the element the veil is on.\n * A consumer's own attributes on the host are never written over, because the\n * family writes its role, its tab stop and its name on an element it owns.\n *\n * The scroll position is never held. The browser moves it on a wheel, a\n * fling, a `Tab` into a child, an anchor navigation and a printed page, and a\n * consumer holding the value would have to accept every one of those or fight\n * the platform. It is emitted, and the instance moves it.\n */\n@Component({\n  selector: '[slScrollArea]',\n  standalone: true,\n  exportAs: 'slScrollArea',\n  template: `\n    <div\n      #viewport\n      data-part=\"viewport\"\n      [attr.role]=\"wired() ? 'region' : null\"\n      [attr.tabindex]=\"wired() ? '0' : null\"\n      [attr.aria-label]=\"ariaLabel()\"\n      [attr.aria-labelledby]=\"ariaLabelledBy()\"\n      (scroll)=\"onScroll($event)\"\n    >\n      <ng-content />\n    </div>\n  `,\n  styleUrl: '../../../styles/src/scroll-area/scroll-area.css',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    'data-ui': 'scroll-area',\n    'data-part': 'root',\n    '[attr.data-axis]': 'resolvedAxis()',\n    '[attr.data-scrollbars]': 'resolvedScrollbars()',\n    '[attr.data-gutter]': 'resolvedGutter()',\n    '[attr.data-fade]': 'resolvedFade()',\n    '[attr.data-overscroll]': 'resolvedOverscroll()',\n    '[attr.data-overflowing]': \"edgeAttributes()['data-overflowing'] ?? null\",\n    '[attr.data-at-block-start]': \"edgeAttributes()['data-at-block-start'] ?? null\",\n    '[attr.data-at-block-end]': \"edgeAttributes()['data-at-block-end'] ?? null\",\n    '[attr.data-at-inline-start]': \"edgeAttributes()['data-at-inline-start'] ?? null\",\n    '[attr.data-at-inline-end]': \"edgeAttributes()['data-at-inline-end'] ?? null\",\n    '[attr.data-sideways]': \"sideways() ? '' : null\",\n    '[style.max-block-size]': 'maxBlockSize() ?? null',\n    '[style.max-inline-size]': 'maxInlineSize() ?? null',\n  },\n})\nexport class SlScrollArea {\n  readonly axis = input<ScrollAreaAxis | undefined>(undefined);\n  readonly scrollbars = input<ScrollAreaScrollbars | undefined>(undefined);\n  readonly gutter = input<ScrollAreaGutter | undefined>(undefined);\n  readonly fade = input<ScrollAreaFade | undefined>(undefined);\n  readonly overscroll = input<ScrollAreaOverscroll | undefined>(undefined);\n\n  /**\n   * Scroll only past this size, as any CSS length. It is Mantine's\n   * `ScrollArea.Autosize` as one binding rather than a second component.\n   */\n  readonly maxBlockSize = input<string | undefined>(undefined);\n  readonly maxInlineSize = input<string | undefined>(undefined);\n\n  /**\n   * Whether the scrollport joins the tab sequence while it overflows.\n   *\n   * On by default, because content that scrolls has to be scrollable by\n   * keyboard and a scrollport with no tab stop is not — unless a child of it\n   * already takes focus. A consumer who knows the content is reachable another\n   * way turns it off and carries the reason.\n   */\n  readonly tabbable = input(true, { transform: booleanAttribute });\n\n  /**\n   * The name the region is announced by. Resolved in one order: `labelledBy`,\n   * then `messages.label`, then the catalog of the language in force.\n   */\n  readonly labelledBy = input<string | undefined>(undefined);\n  /** Words laid over the catalog of the language in force: the region's name (`label`). */\n  readonly messages = input<PartialMessages<ScrollAreaMessages> | undefined>(undefined);\n\n  /**\n   * The position, as a distance from each logical start, on every scroll. It\n   * is a report and not a request: the browser moves the position on a wheel,\n   * a fling, a `Tab` into a child and a printed page, and a consumer holding it\n   * would have to accept every one of those.\n   */\n  readonly scrollChange = output<ScrollAreaScrollEvent>();\n\n  /** The measurement, and only a new one: which axes overflow, and which ends show. */\n  readonly overflowChange = output<ScrollEdgesState>();\n\n  private readonly defaults = injectScrollAreaDefaults();\n  /** The family's words in the language in force, with this area's `messages` laid over them. */\n  readonly t = injectMessages(scrollAreaMessages, this.messages);\n  private readonly element = inject(ElementRef<HTMLElement>).nativeElement as HTMLElement;\n  private readonly destroyRef = inject(DestroyRef);\n  private readonly viewportRef = viewChild.required<ElementRef<HTMLElement>>('viewport');\n\n  /**\n   * The measurement, as a signal, so the attributes it becomes are rendered.\n   * Before the first render it is the state of content that fits — four ends\n   * showing and nothing overflowing — which paints no veil and writes no tab\n   * stop, so a server render and its hydration agree and the veil does not\n   * flash on before the browser has said whether there is anything behind it.\n   */\n  private readonly measured = signal<ScrollEdgesState>(NO_SCROLL_EDGES);\n  protected readonly sideways = signal(false);\n  private edges: ScrollEdgesHandle | null = null;\n\n  protected readonly resolvedAxis = computed(() => this.axis() ?? this.defaults.axis);\n  protected readonly resolvedScrollbars = computed(\n    () => this.scrollbars() ?? this.defaults.scrollbars,\n  );\n  protected readonly resolvedGutter = computed(() => this.gutter() ?? this.defaults.gutter);\n  protected readonly resolvedFade = computed(() => this.fade() ?? this.defaults.fade);\n  protected readonly resolvedOverscroll = computed(\n    () => this.overscroll() ?? this.defaults.overscroll,\n  );\n\n  protected readonly edgeAttributes = computed(() => scrollEdgeAttributes(this.measured()));\n\n  protected readonly overflowing = computed(() => {\n    const state = this.measured();\n    return state.block.overflowing || state.inline.overflowing;\n  });\n  protected readonly wired = computed(() => this.overflowing() && this.tabbable());\n  protected readonly ariaLabelledBy = computed(() =>\n    this.wired() ? (this.labelledBy() ?? null) : null,\n  );\n  protected readonly ariaLabel = computed(() => {\n    if (!this.wired() || this.labelledBy() !== undefined) return null;\n    return this.t('label');\n  });\n\n  constructor() {\n    /**\n     * After the first render and only in a browser: Angular builds the\n     * component during a server render too, and there is nothing to measure\n     * there. The wiring appears at the first moment a browser can say whether\n     * the content overflows at all.\n     */\n    afterNextRender(() => {\n      const viewport = this.viewportRef().nativeElement;\n      const handle = createScrollEdges(viewport, {\n        onChange: (next) => {\n          this.measured.set(next);\n          if (this.edges !== null) this.sideways.set(this.edges.sideways());\n          this.overflowChange.emit(next);\n        },\n      });\n      this.edges = handle;\n      this.measured.set(handle.state());\n      this.sideways.set(handle.sideways());\n\n      /** A click on the content focuses the scrollport; its ring is for the keyboard (`createFocusOrigin`). */\n      const origin = createFocusOrigin(viewport);\n      this.destroyRef.onDestroy(origin.destroy);\n    });\n\n    this.destroyRef.onDestroy(() => {\n      this.edges?.destroy();\n      this.edges = null;\n    });\n  }\n\n  /** The frame: the consumer's own element. */\n  get root(): HTMLElement {\n    return this.element;\n  }\n\n  /** The scrollport: the element that scrolls and takes focus. */\n  get viewport(): HTMLElement {\n    return this.viewportRef().nativeElement;\n  }\n\n  /** The last measurement: whether each axis overflows, and which of its ends show. */\n  state(): ScrollEdgesState {\n    return this.edges?.state() ?? NO_SCROLL_EDGES;\n  }\n\n  /** The distance from each logical start, read now. */\n  position(): ScrollPosition {\n    return this.edges?.position() ?? { block: 0, inline: 0 };\n  }\n\n  /** Moves to a logical position. An axis left out is an axis left alone. */\n  scrollTo(target: Partial<ScrollPosition>): void {\n    this.edges?.scrollTo(target);\n  }\n\n  /** Moves to one end of one axis. */\n  scrollToEdge(edge: LogicalEdge): void {\n    this.edges?.scrollToEdge(edge);\n  }\n\n  /** Brings one element into view by the shortest movement that does it, without moving anything else. */\n  reveal(element: Element): void {\n    this.edges?.reveal(element);\n  }\n\n  /** Measures again, after content the observer could not see changed. */\n  refresh(): void {\n    this.edges?.refresh();\n  }\n\n  /** Moves focus to the scrollport. */\n  focus(): void {\n    this.viewport.focus();\n  }\n\n  protected onScroll(event: Event) {\n    if (this.edges === null) return;\n    this.scrollChange.emit({ position: this.edges.position(), source: event });\n  }\n}\n\n/**\n * The inset that scrolls with the content.\n *\n * Padding on a scrollport is not applied at the end edge of its scrollable\n * overflow in every engine, so an inset that has to survive a scroll to the\n * end goes on an element inside it. The family states no inset of its own: the\n * directive exists to give the consumer's one a place to live, on the\n * consumer's own element, and an area whose content already carries its own\n * inset uses no `slScrollAreaContent` at all.\n */\n@Directive({\n  selector: '[slScrollAreaContent]',\n  standalone: true,\n  exportAs: 'slScrollAreaContent',\n  host: { 'data-part': 'content' },\n})\nexport class SlScrollAreaContent {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"slotted-angular-scroll-area.mjs","sources":["../../scroll-area/src/scroll-area-defaults.ts","../../scroll-area/src/scroll-area.ts","../../scroll-area/src/slotted-angular-scroll-area.ts"],"sourcesContent":["import { inject, InjectionToken } from '@angular/core';\n\n/** Which axes scroll. Logical, so a vertical writing mode needs no second vocabulary. */\nexport type ScrollAreaAxis = 'block' | 'inline' | 'both';\n\n/**\n * What the scrollbar does. `auto` is `overflow: auto`; `always` is\n * `overflow: scroll`; `hover` paints the bar transparent until a pointer or the\n * keyboard is inside; `none` removes the bar and leaves the scrolling.\n *\n * `scroll` — visible only while scrolling, which Radix and Mantine both ship —\n * is folded into `hover`, because it is what a platform overlay scrollbar\n * already does on its own.\n */\nexport type ScrollAreaScrollbars = 'auto' | 'always' | 'hover' | 'none';\n\n/** `scrollbar-gutter`, and `stable` is the default because content that shifts is the defect. */\nexport type ScrollAreaGutter = 'auto' | 'stable' | 'both-edges';\n\n/**\n * Where the veil is drawn. `both` dims what the reader has passed as well as\n * what is ahead; `end` only what is ahead; `none` leaves the scrollbar to say\n * there is more.\n */\nexport type ScrollAreaFade = 'both' | 'end' | 'none';\n\n/** `overscroll-behavior`, and `contain` is the default. */\nexport type ScrollAreaOverscroll = 'contain' | 'auto' | 'none';\n\nexport interface ScrollAreaDefaults {\n  axis: ScrollAreaAxis;\n  scrollbars: ScrollAreaScrollbars;\n  gutter: ScrollAreaGutter;\n  fade: ScrollAreaFade;\n  overscroll: ScrollAreaOverscroll;\n}\n\nconst FALLBACK: ScrollAreaDefaults = {\n  axis: 'block',\n  fade: 'both',\n  gutter: 'stable',\n  overscroll: 'contain',\n  scrollbars: 'auto',\n};\n\nexport const SCROLL_AREA_DEFAULTS = new InjectionToken<ScrollAreaDefaults>(\n  'slotted scroll-area defaults',\n  { providedIn: 'root', factory: () => FALLBACK },\n);\n\n/**\n * An application decides once what its scroll areas look like — whether the\n * bar waits for a hand, whether the veil dims both ends — rather than repeating\n * it on fifty of them. A region's name comes from the language in force\n * (`provideSlotted`).\n *\n * None of the five surveyed implementations has an equivalent: each takes its\n * policy per instance, and Mantine's `type` in particular is written on every\n * call site of every product that uses it.\n */\nexport function provideScrollAreaDefaults(defaults: Partial<ScrollAreaDefaults>) {\n  return {\n    provide: SCROLL_AREA_DEFAULTS,\n    useFactory: (): ScrollAreaDefaults => ({ ...FALLBACK, ...defaults }),\n  };\n}\n\n/** What a scroll area is here, before it states anything of its own. */\nexport function injectScrollAreaDefaults(): ScrollAreaDefaults {\n  return inject(SCROLL_AREA_DEFAULTS);\n}\n","import { createFocusOrigin } from '@slotted/core/focus';\nimport {\n  createScrollEdges,\n  NO_SCROLL_EDGES,\n  scrollEdgeAttributes,\n  type LogicalEdge,\n  type ScrollEdgesHandle,\n  type ScrollEdgesState,\n  type ScrollPosition,\n} from '@slotted/core/overflow';\nimport {\n  afterNextRender,\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  DestroyRef,\n  Directive,\n  ElementRef,\n  inject,\n  input,\n  output,\n  signal,\n  viewChild,\n  ViewEncapsulation,\n} from '@angular/core';\nimport { injectMessages } from '@slotted/angular/i18n';\nimport {\n  scrollAreaMessages,\n  type PartialMessages,\n  type ScrollAreaMessages,\n} from '@slotted/core/i18n';\n\nimport { injectScrollAreaDefaults } from './scroll-area-defaults';\nimport type {\n  ScrollAreaAxis,\n  ScrollAreaFade,\n  ScrollAreaGutter,\n  ScrollAreaOverscroll,\n  ScrollAreaScrollbars,\n} from './scroll-area-defaults';\n\n/** What `scrollChange` carries: where the scroller is, and the event that moved it. */\nexport interface ScrollAreaScrollEvent {\n  readonly position: ScrollPosition;\n  readonly source: Event;\n}\n\n/**\n * A scrollport, and the box that frames it.\n *\n * The scrollbar is the platform's, themed by the stylesheet through\n * `scrollbar-color`; the keyboard is the platform's too. What this component\n * adds is the measurement of whether the content overflows and which of its\n * ends show, published on the frame for CSS and emitted to the consumer, and\n * the tab stop a scrolling region owes a keyboard together with the name that\n * tab stop owes a screen reader — both written only while the content actually\n * overflows, which is the pattern `prose` shipped first for one block inside a\n * document.\n *\n * The frame is the consumer's own element — `<div slScrollArea>` — and the\n * scrollport is the component's, projected into: the frame is where a border,\n * a radius and a ground go, and the scrollport is the element the veil is on.\n * A consumer's own attributes on the host are never written over, because the\n * family writes its role, its tab stop and its name on an element it owns.\n *\n * The scroll position is never held. The browser moves it on a wheel, a\n * fling, a `Tab` into a child, an anchor navigation and a printed page, and a\n * consumer holding the value would have to accept every one of those or fight\n * the platform. It is emitted, and the instance moves it.\n */\n@Component({\n  selector: '[slScrollArea]',\n  standalone: true,\n  exportAs: 'slScrollArea',\n  template: `\n    <div\n      #viewport\n      data-part=\"viewport\"\n      data-part-viewport=\"\"\n      [attr.role]=\"wired() ? 'region' : null\"\n      [attr.tabindex]=\"wired() ? '0' : null\"\n      [attr.aria-label]=\"ariaLabel()\"\n      [attr.aria-labelledby]=\"ariaLabelledBy()\"\n      (scroll)=\"onScroll($event)\"\n    >\n      <ng-content />\n    </div>\n  `,\n  styleUrl: '../../../styles/src/scroll-area/scroll-area.css',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    'data-ui': 'scroll-area',\n    'data-ui-scroll-area': '',\n    'data-part': 'root',\n    'data-part-root': '',\n    '[attr.data-axis]': 'resolvedAxis()',\n    '[attr.data-scrollbars]': 'resolvedScrollbars()',\n    '[attr.data-gutter]': 'resolvedGutter()',\n    '[attr.data-fade]': 'resolvedFade()',\n    '[attr.data-overscroll]': 'resolvedOverscroll()',\n    '[attr.data-overflowing]': \"edgeAttributes()['data-overflowing'] ?? null\",\n    '[attr.data-at-block-start]': \"edgeAttributes()['data-at-block-start'] ?? null\",\n    '[attr.data-at-block-end]': \"edgeAttributes()['data-at-block-end'] ?? null\",\n    '[attr.data-at-inline-start]': \"edgeAttributes()['data-at-inline-start'] ?? null\",\n    '[attr.data-at-inline-end]': \"edgeAttributes()['data-at-inline-end'] ?? null\",\n    '[attr.data-sideways]': \"sideways() ? '' : null\",\n    '[style.max-block-size]': 'maxBlockSize() ?? null',\n    '[style.max-inline-size]': 'maxInlineSize() ?? null',\n  },\n})\nexport class SlScrollArea {\n  readonly axis = input<ScrollAreaAxis | undefined>(undefined);\n  readonly scrollbars = input<ScrollAreaScrollbars | undefined>(undefined);\n  readonly gutter = input<ScrollAreaGutter | undefined>(undefined);\n  readonly fade = input<ScrollAreaFade | undefined>(undefined);\n  readonly overscroll = input<ScrollAreaOverscroll | undefined>(undefined);\n\n  /**\n   * Scroll only past this size, as any CSS length. It is Mantine's\n   * `ScrollArea.Autosize` as one binding rather than a second component.\n   */\n  readonly maxBlockSize = input<string | undefined>(undefined);\n  readonly maxInlineSize = input<string | undefined>(undefined);\n\n  /**\n   * Whether the scrollport joins the tab sequence while it overflows.\n   *\n   * On by default, because content that scrolls has to be scrollable by\n   * keyboard and a scrollport with no tab stop is not — unless a child of it\n   * already takes focus. A consumer who knows the content is reachable another\n   * way turns it off and carries the reason.\n   */\n  readonly tabbable = input(true, { transform: booleanAttribute });\n\n  /**\n   * The name the region is announced by. Resolved in one order: `labelledBy`,\n   * then `messages.label`, then the catalog of the language in force.\n   */\n  readonly labelledBy = input<string | undefined>(undefined);\n  /** Words laid over the catalog of the language in force: the region's name (`label`). */\n  readonly messages = input<PartialMessages<ScrollAreaMessages> | undefined>(undefined);\n\n  /**\n   * The position, as a distance from each logical start, on every scroll. It\n   * is a report and not a request: the browser moves the position on a wheel,\n   * a fling, a `Tab` into a child and a printed page, and a consumer holding it\n   * would have to accept every one of those.\n   */\n  readonly scrollChange = output<ScrollAreaScrollEvent>();\n\n  /** The measurement, and only a new one: which axes overflow, and which ends show. */\n  readonly overflowChange = output<ScrollEdgesState>();\n\n  private readonly defaults = injectScrollAreaDefaults();\n  /** The family's words in the language in force, with this area's `messages` laid over them. */\n  readonly t = injectMessages(scrollAreaMessages, this.messages);\n  private readonly element = inject(ElementRef<HTMLElement>).nativeElement as HTMLElement;\n  private readonly destroyRef = inject(DestroyRef);\n  private readonly viewportRef = viewChild.required<ElementRef<HTMLElement>>('viewport');\n\n  /**\n   * The measurement, as a signal, so the attributes it becomes are rendered.\n   * Before the first render it is the state of content that fits — four ends\n   * showing and nothing overflowing — which paints no veil and writes no tab\n   * stop, so a server render and its hydration agree and the veil does not\n   * flash on before the browser has said whether there is anything behind it.\n   */\n  private readonly measured = signal<ScrollEdgesState>(NO_SCROLL_EDGES);\n  protected readonly sideways = signal(false);\n  private edges: ScrollEdgesHandle | null = null;\n\n  protected readonly resolvedAxis = computed(() => this.axis() ?? this.defaults.axis);\n  protected readonly resolvedScrollbars = computed(\n    () => this.scrollbars() ?? this.defaults.scrollbars,\n  );\n  protected readonly resolvedGutter = computed(() => this.gutter() ?? this.defaults.gutter);\n  protected readonly resolvedFade = computed(() => this.fade() ?? this.defaults.fade);\n  protected readonly resolvedOverscroll = computed(\n    () => this.overscroll() ?? this.defaults.overscroll,\n  );\n\n  protected readonly edgeAttributes = computed(() => scrollEdgeAttributes(this.measured()));\n\n  protected readonly overflowing = computed(() => {\n    const state = this.measured();\n    return state.block.overflowing || state.inline.overflowing;\n  });\n  protected readonly wired = computed(() => this.overflowing() && this.tabbable());\n  protected readonly ariaLabelledBy = computed(() =>\n    this.wired() ? (this.labelledBy() ?? null) : null,\n  );\n  protected readonly ariaLabel = computed(() => {\n    if (!this.wired() || this.labelledBy() !== undefined) return null;\n    return this.t('label');\n  });\n\n  constructor() {\n    /**\n     * After the first render and only in a browser: Angular builds the\n     * component during a server render too, and there is nothing to measure\n     * there. The wiring appears at the first moment a browser can say whether\n     * the content overflows at all.\n     */\n    afterNextRender(() => {\n      const viewport = this.viewportRef().nativeElement;\n      const handle = createScrollEdges(viewport, {\n        onChange: (next) => {\n          this.measured.set(next);\n          if (this.edges !== null) this.sideways.set(this.edges.sideways());\n          this.overflowChange.emit(next);\n        },\n      });\n      this.edges = handle;\n      this.measured.set(handle.state());\n      this.sideways.set(handle.sideways());\n\n      /** A click on the content focuses the scrollport; its ring is for the keyboard (`createFocusOrigin`). */\n      const origin = createFocusOrigin(viewport);\n      this.destroyRef.onDestroy(origin.destroy);\n    });\n\n    this.destroyRef.onDestroy(() => {\n      this.edges?.destroy();\n      this.edges = null;\n    });\n  }\n\n  /** The frame: the consumer's own element. */\n  get root(): HTMLElement {\n    return this.element;\n  }\n\n  /** The scrollport: the element that scrolls and takes focus. */\n  get viewport(): HTMLElement {\n    return this.viewportRef().nativeElement;\n  }\n\n  /** The last measurement: whether each axis overflows, and which of its ends show. */\n  state(): ScrollEdgesState {\n    return this.edges?.state() ?? NO_SCROLL_EDGES;\n  }\n\n  /** The distance from each logical start, read now. */\n  position(): ScrollPosition {\n    return this.edges?.position() ?? { block: 0, inline: 0 };\n  }\n\n  /** Moves to a logical position. An axis left out is an axis left alone. */\n  scrollTo(target: Partial<ScrollPosition>): void {\n    this.edges?.scrollTo(target);\n  }\n\n  /** Moves to one end of one axis. */\n  scrollToEdge(edge: LogicalEdge): void {\n    this.edges?.scrollToEdge(edge);\n  }\n\n  /** Brings one element into view by the shortest movement that does it, without moving anything else. */\n  reveal(element: Element): void {\n    this.edges?.reveal(element);\n  }\n\n  /** Measures again, after content the observer could not see changed. */\n  refresh(): void {\n    this.edges?.refresh();\n  }\n\n  /** Moves focus to the scrollport. */\n  focus(): void {\n    this.viewport.focus();\n  }\n\n  protected onScroll(event: Event) {\n    if (this.edges === null) return;\n    this.scrollChange.emit({ position: this.edges.position(), source: event });\n  }\n}\n\n/**\n * The inset that scrolls with the content.\n *\n * Padding on a scrollport is not applied at the end edge of its scrollable\n * overflow in every engine, so an inset that has to survive a scroll to the\n * end goes on an element inside it. The family states no inset of its own: the\n * directive exists to give the consumer's one a place to live, on the\n * consumer's own element, and an area whose content already carries its own\n * inset uses no `slScrollAreaContent` at all.\n */\n@Directive({\n  selector: '[slScrollAreaContent]',\n  standalone: true,\n  exportAs: 'slScrollAreaContent',\n  host: { 'data-part': 'content', 'data-part-content': '' },\n})\nexport class SlScrollAreaContent {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/slotted-angular-section.mjs

@@ -127,13 +127,15 @@ class SlSection {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSection, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlSection, isStandalone: true, selector: "[slSection]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, ground: { classPropertyName: "ground", publicName: "ground", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-ui": "section", "data-part": "root" }, properties: { "attr.id": "id()", "attr.aria-labelledby": "hasHeading() ? headingId() : null", "attr.data-size": "resolvedSize()", "attr.data-level": "resolvedLevel()", "attr.data-ground": "resolvedGround()", "attr.data-divider": "resolvedDivider() ? '' : null", "attr.data-sticky": "resolvedSticky() ? '' : null" } }, exportAs: ["slSection"], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer slotted.components{[data-ui=section]{--_gap: var(--slotted-section-gap, var(--slotted-space-5, .75rem));--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-section-border, var(--slotted-border-subtle, ButtonBorder));--_heading-size: var(--slotted-section-heading-size-md, var(--slotted-font-size-lg, 1rem));--_heading-line-height: var(--slotted-line-height-lg, 1.5);--_ground: var(--slotted-page-ground, var(--slotted-surface, Canvas));color:var(--_text);display:flex;flex-direction:column;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);gap:var(--_gap);min-inline-size:0;scroll-margin-block-start:var(--slotted-page-sticky-top, 0px)}[data-ui=section][data-size=sm]{--_heading-size: var(--slotted-section-heading-size-sm, var(--slotted-font-size-md, .875rem));--_heading-line-height: var(--slotted-line-height-md, 1.5)}[data-ui=section][data-size=lg]{--_heading-size: var(--slotted-section-heading-size-lg, var(--slotted-font-size-xl, 1.125rem));--_heading-line-height: var(--slotted-line-height-xl, 1.45)}[data-ui=section][data-ground=surface]{--_ground: var(--slotted-section-surface, var(--slotted-surface-raised, Canvas));--slotted-ground: var(--_ground);background-color:var(--_ground);border:var(--slotted-border-width-thin, 1px) solid var(--_rule);border-radius:var(--slotted-section-radius, var(--slotted-radius-lg, 8px));padding:var(--slotted-section-inset, var(--slotted-space-6, 1rem))}[data-ui=section]>[data-part=header]{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--slotted-space-3, .375rem) var(--slotted-space-6, 1rem);min-inline-size:0}[data-ui=section][data-divider]>[data-part=header]{border-block-end:var(--slotted-border-width-thin, 1px) solid var(--_rule);padding-block-end:var(--slotted-space-4, .5rem)}[data-ui=section][data-sticky]>[data-part=header]{background-color:var(--_ground);inset-block-start:var(--slotted-page-sticky-top, 0px);margin-block-start:calc(-1 * var(--slotted-space-4, .5rem));padding-block-start:var(--slotted-space-4, .5rem);position:sticky;z-index:var(--slotted-z-index-sticky, 100)}[data-ui=section][data-sticky]{--_above: var(--slotted-page-sticky-top, 0px)}[data-ui=section][data-sticky]>[data-part=body]{--slotted-page-sticky-top: calc(var(--_above) + var(--slotted-section-header-size, 0px));--slotted-table-sticky-offset: var(--slotted-page-sticky-top)}[data-ui=section]>[data-part=header]>[data-part=title]{display:flex;flex:1 1 16rem;flex-direction:column;gap:var(--slotted-space-1, .125rem);min-inline-size:0}[data-ui=section]>[data-part=header]>[data-part=title]>[data-part=eyebrow]{color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:.06em;line-height:var(--slotted-line-height-xs, 1.4);text-transform:uppercase}[data-ui=section]>[data-part=header]>[data-part=title]>[data-part=heading]{color:var(--_text);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_heading-size);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:-.01em;line-height:var(--_heading-line-height);margin:0;min-inline-size:0;overflow-wrap:anywhere;text-wrap:pretty}[data-ui=section]>[data-part=header]>[data-part=title]>[data-part=description]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);line-height:var(--slotted-line-height-sm, 1.45);margin:0;max-inline-size:var(--slotted-section-description-measure, 70ch);text-wrap:pretty}[data-ui=section]>[data-part=header]>[data-part=actions]{align-items:center;display:flex;flex:none;gap:var(--slotted-control-gap-md, 8px);margin-inline-start:auto}[data-ui=section]>[data-part=header]>[data-part=actions]:empty{display:none}[data-ui=section]>[data-part=body]{min-inline-size:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: SlSection, isStandalone: true, selector: "[slSection]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, level: { classPropertyName: "level", publicName: "level", isSignal: true, isRequired: false, transformFunction: null }, ground: { classPropertyName: "ground", publicName: "ground", isSignal: true, isRequired: false, transformFunction: null }, divider: { classPropertyName: "divider", publicName: "divider", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-ui": "section", "data-ui-section": "", "data-part": "root", "data-part-root": "" }, properties: { "attr.id": "id()", "attr.aria-labelledby": "hasHeading() ? headingId() : null", "attr.data-size": "resolvedSize()", "attr.data-level": "resolvedLevel()", "attr.data-ground": "resolvedGround()", "attr.data-divider": "resolvedDivider() ? '' : null", "attr.data-sticky": "resolvedSticky() ? '' : null" } }, exportAs: ["slSection"], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer slotted.components{[data-ui-section]{--_gap: var(--slotted-section-gap, var(--slotted-space-5, .75rem));--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-section-border, var(--slotted-border-subtle, ButtonBorder));--_heading-size: var(--slotted-section-heading-size-md, var(--slotted-font-size-lg, 1rem));--_heading-line-height: var(--slotted-line-height-lg, 1.5);--_ground: var(--slotted-page-ground, var(--slotted-surface, Canvas));color:var(--_text);display:flex;flex-direction:column;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);gap:var(--_gap);min-inline-size:0;scroll-margin-block-start:var(--slotted-page-sticky-top, 0px)}[data-ui-section][data-size=sm]{--_heading-size: var(--slotted-section-heading-size-sm, var(--slotted-font-size-md, .875rem));--_heading-line-height: var(--slotted-line-height-md, 1.5)}[data-ui-section][data-size=lg]{--_heading-size: var(--slotted-section-heading-size-lg, var(--slotted-font-size-xl, 1.125rem));--_heading-line-height: var(--slotted-line-height-xl, 1.45)}[data-ui-section][data-ground=surface]{--_ground: var(--slotted-section-surface, var(--slotted-surface-raised, Canvas));--slotted-ground: var(--_ground);background-color:var(--_ground);border:var(--slotted-border-width-thin, 1px) solid var(--_rule);border-radius:var(--slotted-section-radius, var(--slotted-radius-lg, 8px));padding:var(--slotted-section-inset, var(--slotted-space-6, 1rem))}[data-ui-section]>[data-part-header]{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--slotted-space-3, .375rem) var(--slotted-space-6, 1rem);min-inline-size:0}[data-ui-section][data-divider]>[data-part-header]{border-block-end:var(--slotted-border-width-thin, 1px) solid var(--_rule);padding-block-end:var(--slotted-space-4, .5rem)}[data-ui-section][data-sticky]>[data-part-header]{background-color:var(--_ground);inset-block-start:var(--slotted-page-sticky-top, 0px);margin-block-start:calc(-1 * var(--slotted-space-4, .5rem));padding-block-start:var(--slotted-space-4, .5rem);position:sticky;z-index:var(--slotted-z-index-sticky, 100)}[data-ui-section][data-sticky]{--_above: var(--slotted-page-sticky-top, 0px)}[data-ui-section][data-sticky]>[data-part-body]{--slotted-page-sticky-top: calc(var(--_above) + var(--slotted-section-header-size, 0px));--slotted-table-sticky-offset: var(--slotted-page-sticky-top)}[data-ui-section]>[data-part-header]>[data-part-title]{display:flex;flex:1 1 16rem;flex-direction:column;gap:var(--slotted-space-1, .125rem);min-inline-size:0}[data-ui-section]>[data-part-header]>[data-part-title]>[data-part-eyebrow]{color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:.06em;line-height:var(--slotted-line-height-xs, 1.4);text-transform:uppercase}[data-ui-section]>[data-part-header]>[data-part-title]>[data-part-heading]{color:var(--_text);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_heading-size);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:-.01em;line-height:var(--_heading-line-height);margin:0;min-inline-size:0;overflow-wrap:anywhere;text-wrap:pretty}[data-ui-section]>[data-part-header]>[data-part-title]>[data-part-description]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);line-height:var(--slotted-line-height-sm, 1.45);margin:0;max-inline-size:var(--slotted-section-description-measure, 70ch);text-wrap:pretty}[data-ui-section]>[data-part-header]>[data-part-actions]{align-items:center;display:flex;flex:none;gap:var(--slotted-control-gap-md, 8px);margin-inline-start:auto}[data-ui-section]>[data-part-header]>[data-part-actions]:empty{display:none}[data-ui-section]>[data-part-body]{min-inline-size:0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSection, decorators: [{
             type: Component,
             args: [{ selector: '[slSection]', standalone: true, exportAs: 'slSection', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         'data-ui': 'section',
+                        'data-ui-section': '',
                         'data-part': 'root',
+                        'data-part-root': '',
                         '[attr.id]': 'id()',
                         '[attr.aria-labelledby]': 'hasHeading() ? headingId() : null',
                         '[attr.data-size]': 'resolvedSize()',
@@ -141,7 +143,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                         '[attr.data-ground]': 'resolvedGround()',
                         '[attr.data-divider]': "resolvedDivider() ? '' : null",
                         '[attr.data-sticky]': "resolvedSticky() ? '' : null",
-                    }, styles: ["@layer slotted.components{[data-ui=section]{--_gap: var(--slotted-section-gap, var(--slotted-space-5, .75rem));--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-section-border, var(--slotted-border-subtle, ButtonBorder));--_heading-size: var(--slotted-section-heading-size-md, var(--slotted-font-size-lg, 1rem));--_heading-line-height: var(--slotted-line-height-lg, 1.5);--_ground: var(--slotted-page-ground, var(--slotted-surface, Canvas));color:var(--_text);display:flex;flex-direction:column;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);gap:var(--_gap);min-inline-size:0;scroll-margin-block-start:var(--slotted-page-sticky-top, 0px)}[data-ui=section][data-size=sm]{--_heading-size: var(--slotted-section-heading-size-sm, var(--slotted-font-size-md, .875rem));--_heading-line-height: var(--slotted-line-height-md, 1.5)}[data-ui=section][data-size=lg]{--_heading-size: var(--slotted-section-heading-size-lg, var(--slotted-font-size-xl, 1.125rem));--_heading-line-height: var(--slotted-line-height-xl, 1.45)}[data-ui=section][data-ground=surface]{--_ground: var(--slotted-section-surface, var(--slotted-surface-raised, Canvas));--slotted-ground: var(--_ground);background-color:var(--_ground);border:var(--slotted-border-width-thin, 1px) solid var(--_rule);border-radius:var(--slotted-section-radius, var(--slotted-radius-lg, 8px));padding:var(--slotted-section-inset, var(--slotted-space-6, 1rem))}[data-ui=section]>[data-part=header]{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--slotted-space-3, .375rem) var(--slotted-space-6, 1rem);min-inline-size:0}[data-ui=section][data-divider]>[data-part=header]{border-block-end:var(--slotted-border-width-thin, 1px) solid var(--_rule);padding-block-end:var(--slotted-space-4, .5rem)}[data-ui=section][data-sticky]>[data-part=header]{background-color:var(--_ground);inset-block-start:var(--slotted-page-sticky-top, 0px);margin-block-start:calc(-1 * var(--slotted-space-4, .5rem));padding-block-start:var(--slotted-space-4, .5rem);position:sticky;z-index:var(--slotted-z-index-sticky, 100)}[data-ui=section][data-sticky]{--_above: var(--slotted-page-sticky-top, 0px)}[data-ui=section][data-sticky]>[data-part=body]{--slotted-page-sticky-top: calc(var(--_above) + var(--slotted-section-header-size, 0px));--slotted-table-sticky-offset: var(--slotted-page-sticky-top)}[data-ui=section]>[data-part=header]>[data-part=title]{display:flex;flex:1 1 16rem;flex-direction:column;gap:var(--slotted-space-1, .125rem);min-inline-size:0}[data-ui=section]>[data-part=header]>[data-part=title]>[data-part=eyebrow]{color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:.06em;line-height:var(--slotted-line-height-xs, 1.4);text-transform:uppercase}[data-ui=section]>[data-part=header]>[data-part=title]>[data-part=heading]{color:var(--_text);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_heading-size);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:-.01em;line-height:var(--_heading-line-height);margin:0;min-inline-size:0;overflow-wrap:anywhere;text-wrap:pretty}[data-ui=section]>[data-part=header]>[data-part=title]>[data-part=description]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);line-height:var(--slotted-line-height-sm, 1.45);margin:0;max-inline-size:var(--slotted-section-description-measure, 70ch);text-wrap:pretty}[data-ui=section]>[data-part=header]>[data-part=actions]{align-items:center;display:flex;flex:none;gap:var(--slotted-control-gap-md, 8px);margin-inline-start:auto}[data-ui=section]>[data-part=header]>[data-part=actions]:empty{display:none}[data-ui=section]>[data-part=body]{min-inline-size:0}}\n"] }]
+                    }, styles: ["@layer slotted.components{[data-ui-section]{--_gap: var(--slotted-section-gap, var(--slotted-space-5, .75rem));--_text: var(--slotted-text, CanvasText);--_muted: var(--slotted-text-muted, GrayText);--_rule: var(--slotted-section-border, var(--slotted-border-subtle, ButtonBorder));--_heading-size: var(--slotted-section-heading-size-md, var(--slotted-font-size-lg, 1rem));--_heading-line-height: var(--slotted-line-height-lg, 1.5);--_ground: var(--slotted-page-ground, var(--slotted-surface, Canvas));color:var(--_text);display:flex;flex-direction:column;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);gap:var(--_gap);min-inline-size:0;scroll-margin-block-start:var(--slotted-page-sticky-top, 0px)}[data-ui-section][data-size=sm]{--_heading-size: var(--slotted-section-heading-size-sm, var(--slotted-font-size-md, .875rem));--_heading-line-height: var(--slotted-line-height-md, 1.5)}[data-ui-section][data-size=lg]{--_heading-size: var(--slotted-section-heading-size-lg, var(--slotted-font-size-xl, 1.125rem));--_heading-line-height: var(--slotted-line-height-xl, 1.45)}[data-ui-section][data-ground=surface]{--_ground: var(--slotted-section-surface, var(--slotted-surface-raised, Canvas));--slotted-ground: var(--_ground);background-color:var(--_ground);border:var(--slotted-border-width-thin, 1px) solid var(--_rule);border-radius:var(--slotted-section-radius, var(--slotted-radius-lg, 8px));padding:var(--slotted-section-inset, var(--slotted-space-6, 1rem))}[data-ui-section]>[data-part-header]{align-items:flex-start;display:flex;flex-wrap:wrap;gap:var(--slotted-space-3, .375rem) var(--slotted-space-6, 1rem);min-inline-size:0}[data-ui-section][data-divider]>[data-part-header]{border-block-end:var(--slotted-border-width-thin, 1px) solid var(--_rule);padding-block-end:var(--slotted-space-4, .5rem)}[data-ui-section][data-sticky]>[data-part-header]{background-color:var(--_ground);inset-block-start:var(--slotted-page-sticky-top, 0px);margin-block-start:calc(-1 * var(--slotted-space-4, .5rem));padding-block-start:var(--slotted-space-4, .5rem);position:sticky;z-index:var(--slotted-z-index-sticky, 100)}[data-ui-section][data-sticky]{--_above: var(--slotted-page-sticky-top, 0px)}[data-ui-section][data-sticky]>[data-part-body]{--slotted-page-sticky-top: calc(var(--_above) + var(--slotted-section-header-size, 0px));--slotted-table-sticky-offset: var(--slotted-page-sticky-top)}[data-ui-section]>[data-part-header]>[data-part-title]{display:flex;flex:1 1 16rem;flex-direction:column;gap:var(--slotted-space-1, .125rem);min-inline-size:0}[data-ui-section]>[data-part-header]>[data-part-title]>[data-part-eyebrow]{color:var(--_muted);font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:.06em;line-height:var(--slotted-line-height-xs, 1.4);text-transform:uppercase}[data-ui-section]>[data-part-header]>[data-part-title]>[data-part-heading]{color:var(--_text);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_heading-size);font-weight:var(--slotted-font-weight-semibold, 600);letter-spacing:-.01em;line-height:var(--_heading-line-height);margin:0;min-inline-size:0;overflow-wrap:anywhere;text-wrap:pretty}[data-ui-section]>[data-part-header]>[data-part-title]>[data-part-description]{color:var(--_muted);font-size:var(--slotted-font-size-sm, .8125rem);line-height:var(--slotted-line-height-sm, 1.45);margin:0;max-inline-size:var(--slotted-section-description-measure, 70ch);text-wrap:pretty}[data-ui-section]>[data-part-header]>[data-part-actions]{align-items:center;display:flex;flex:none;gap:var(--slotted-control-gap-md, 8px);margin-inline-start:auto}[data-ui-section]>[data-part-header]>[data-part-actions]:empty{display:none}[data-ui-section]>[data-part-body]{min-inline-size:0}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], level: [{ type: i0.Input, args: [{ isSignal: true, alias: "level", required: false }] }], ground: [{ type: i0.Input, args: [{ isSignal: true, alias: "ground", required: false }] }], divider: [{ type: i0.Input, args: [{ isSignal: true, alias: "divider", required: false }] }], sticky: [{ type: i0.Input, args: [{ isSignal: true, alias: "sticky", required: false }] }] } });
 
 const HEADINGS = new Set(['H1', 'H2', 'H3', 'H4', 'H5', 'H6']);
@@ -160,51 +162,67 @@ class SlSectionHeader {
             this.section.header.set(null);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionHeader, isStandalone: true, selector: "[slSectionHeader]", host: { attributes: { "data-part": "header" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionHeader, isStandalone: true, selector: "[slSectionHeader]", host: { attributes: { "data-part": "header", "data-part-header": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionHeader, decorators: [{
             type: Directive,
-            args: [{ selector: '[slSectionHeader]', standalone: true, host: { 'data-part': 'header' } }]
+            args: [{
+                    selector: '[slSectionHeader]',
+                    standalone: true,
+                    host: { 'data-part': 'header', 'data-part-header': '' },
+                }]
         }] });
 /** Eyebrow, heading, description, in that order. */
 class SlSectionTitle {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionTitle, isStandalone: true, selector: "[slSectionTitle]", host: { attributes: { "data-part": "title" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionTitle, isStandalone: true, selector: "[slSectionTitle]", host: { attributes: { "data-part": "title", "data-part-title": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionTitle, decorators: [{
             type: Directive,
-            args: [{ selector: '[slSectionTitle]', standalone: true, host: { 'data-part': 'title' } }]
+            args: [{
+                    selector: '[slSectionTitle]',
+                    standalone: true,
+                    host: { 'data-part': 'title', 'data-part-title': '' },
+                }]
         }] });
 /** A short overline above the heading — a count, a category. Structural, not status. */
 class SlSectionEyebrow {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionEyebrow, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionEyebrow, isStandalone: true, selector: "[slSectionEyebrow]", host: { attributes: { "data-part": "eyebrow" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionEyebrow, isStandalone: true, selector: "[slSectionEyebrow]", host: { attributes: { "data-part": "eyebrow", "data-part-eyebrow": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionEyebrow, decorators: [{
             type: Directive,
-            args: [{ selector: '[slSectionEyebrow]', standalone: true, host: { 'data-part': 'eyebrow' } }]
+            args: [{
+                    selector: '[slSectionEyebrow]',
+                    standalone: true,
+                    host: { 'data-part': 'eyebrow', 'data-part-eyebrow': '' },
+                }]
         }] });
 /** A paragraph under the heading, in the muted text, with a measure. */
 class SlSectionDescription {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionDescription, isStandalone: true, selector: "[slSectionDescription]", host: { attributes: { "data-part": "description" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionDescription, isStandalone: true, selector: "[slSectionDescription]", host: { attributes: { "data-part": "description", "data-part-description": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionDescription, decorators: [{
             type: Directive,
             args: [{
                     selector: '[slSectionDescription]',
                     standalone: true,
-                    host: { 'data-part': 'description' },
+                    host: { 'data-part': 'description', 'data-part-description': '' },
                 }]
         }] });
 /** The end of the header row: a button, a toolbar, a link. */
 class SlSectionActions {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionActions, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionActions, isStandalone: true, selector: "[slSectionActions]", host: { attributes: { "data-part": "actions" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionActions, isStandalone: true, selector: "[slSectionActions]", host: { attributes: { "data-part": "actions", "data-part-actions": "" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionActions, decorators: [{
             type: Directive,
-            args: [{ selector: '[slSectionActions]', standalone: true, host: { 'data-part': 'actions' } }]
+            args: [{
+                    selector: '[slSectionActions]',
+                    standalone: true,
+                    host: { 'data-part': 'actions', 'data-part-actions': '' },
+                }]
         }] });
 /**
  * The heading, at the rank the section resolved. Rendering it is what makes
@@ -227,7 +245,7 @@ class SlSectionHeading {
         this.section.hasHeading.set(false);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionHeading, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionHeading, isStandalone: true, selector: "[slSectionHeading]", host: { attributes: { "data-part": "heading" }, properties: { "attr.id": "section.headingId()", "attr.role": "ariaRole()", "attr.aria-level": "ariaLevel()" } }, exportAs: ["slSectionHeading"], ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionHeading, isStandalone: true, selector: "[slSectionHeading]", host: { attributes: { "data-part": "heading", "data-part-heading": "" }, properties: { "attr.id": "section.headingId()", "attr.role": "ariaRole()", "attr.aria-level": "ariaLevel()" } }, exportAs: ["slSectionHeading"], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionHeading, decorators: [{
             type: Directive,
@@ -237,6 +255,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                     exportAs: 'slSectionHeading',
                     host: {
                         'data-part': 'heading',
+                        'data-part-heading': '',
                         '[attr.id]': 'section.headingId()',
                         '[attr.role]': 'ariaRole()',
                         '[attr.aria-level]': 'ariaLevel()',
@@ -246,7 +265,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
 /** The content, one outline step deeper: `slHeadingLevel` is a host directive. */
 class SlSectionBody {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionBody, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionBody, isStandalone: true, selector: "[slSectionBody]", host: { attributes: { "data-part": "body" } }, hostDirectives: [{ directive: i1.SlHeadingLevel }], ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlSectionBody, isStandalone: true, selector: "[slSectionBody]", host: { attributes: { "data-part": "body", "data-part-body": "" } }, hostDirectives: [{ directive: i1.SlHeadingLevel }], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlSectionBody, decorators: [{
             type: Directive,
@@ -254,7 +273,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
                     selector: '[slSectionBody]',
                     standalone: true,
                     hostDirectives: [SlHeadingLevel],
-                    host: { 'data-part': 'body' },
+                    host: { 'data-part': 'body', 'data-part-body': '' },
                 }]
         }] });
 

package/fesm2022/slotted-angular-section.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"slotted-angular-section.mjs","sources":["../../section/src/section-defaults.ts","../../section/src/section.ts","../../section/src/section-parts.ts","../../section/src/slotted-angular-section.ts"],"sourcesContent":["import { inject, Injectable, InjectionToken } from '@angular/core';\n\n/** The type step the heading sits at, independent of its rank. */\nexport type SectionSize = 'sm' | 'md' | 'lg';\n\n/** The rank of the heading. `auto` takes the one the outline gives. */\nexport type SectionLevel = 'auto' | '1' | '2' | '3' | '4' | '5' | '6';\n\n/** The ground: nothing, or a surface with an edge and a radius and no shadow. */\nexport type SectionGround = 'none' | 'surface';\n\nexport interface SectionDefaults {\n  divider: boolean;\n  ground: SectionGround;\n  size: SectionSize;\n  sticky: boolean;\n}\n\nconst FALLBACK: SectionDefaults = {\n  divider: false,\n  ground: 'none',\n  size: 'md',\n  sticky: false,\n};\n\nexport const SECTION_DEFAULTS = new InjectionToken<SectionDefaults>('slotted section defaults', {\n  providedIn: 'root',\n  factory: () => FALLBACK,\n});\n\n/**\n * An application decides once how its sections separate — a rule, a surface,\n * the step of their headings — rather than repeating the same inputs on every\n * one. A section that states any of them itself still wins.\n */\nexport function provideSectionDefaults(defaults: Partial<SectionDefaults>) {\n  return {\n    provide: SECTION_DEFAULTS,\n    useFactory: (): SectionDefaults => ({ ...FALLBACK, ...defaults }),\n  };\n}\n\n/** What a section renders as here, before it states anything of its own. */\nexport function injectSectionDefaults(): SectionDefaults {\n  return inject(SECTION_DEFAULTS);\n}\n\n/** Application-scoped, for the reason `field` records: the server and the client sequences must match. */\n@Injectable({ providedIn: 'root' })\nexport class SlSectionIdFactory {\n  private count = 0;\n\n  next() {\n    this.count += 1;\n    return `slotted-section-${this.count}`;\n  }\n}\n","import { SlHeadingLevel } from '@slotted/angular/typography';\nimport type { HeadingLevelValue } from '@slotted/angular/typography';\nimport {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  ElementRef,\n  HostAttributeToken,\n  inject,\n  input,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\n\nimport { injectSectionDefaults, SlSectionIdFactory } from './section-defaults';\nimport type { SectionGround, SectionLevel, SectionSize } from './section-defaults';\n\nexport type { SectionDefaults, SectionGround, SectionLevel, SectionSize } from './section-defaults';\n\n/**\n * One unit of content inside a page: a header — eyebrow, heading,\n * description, actions — and a body one outline step deeper.\n *\n * **The rank is the outline's.** `typography` owns it: the heading takes the\n * rank `slHeadingLevel` gives — `h2` directly in a page body, one deeper\n * inside another section's body — unless `level` says otherwise. The element\n * is the consumer's: `<h2 slSectionHeading>` is a native heading and the\n * directive adds nothing to it; `<div slSectionHeading>` gets `role=\"heading\"`\n * and the level the section resolved.\n *\n * **A region only when it has a name.** The root is `aria-labelledby` its\n * heading once one is rendered, which makes the `section` a region landmark.\n *\n * **The hooks anchor navigation needs.** The root carries an `id`, the\n * consumer's own or a generated one, and a scroll margin the height of the\n * page's fixed chrome, so a hash link lands under the header.\n */\n/** The measured height of a sticky section's header, written on the root. */\nexport const HEADER_SIZE_PROPERTY = '--slotted-section-header-size';\n\n@Component({\n  selector: '[slSection]',\n  standalone: true,\n  exportAs: 'slSection',\n  template: '<ng-content />',\n  styleUrl: '../../../styles/src/section/section.css',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    'data-ui': 'section',\n    'data-part': 'root',\n    '[attr.id]': 'id()',\n    '[attr.aria-labelledby]': 'hasHeading() ? headingId() : null',\n    '[attr.data-size]': 'resolvedSize()',\n    '[attr.data-level]': 'resolvedLevel()',\n    '[attr.data-ground]': 'resolvedGround()',\n    '[attr.data-divider]': \"resolvedDivider() ? '' : null\",\n    '[attr.data-sticky]': \"resolvedSticky() ? '' : null\",\n  },\n})\nexport class SlSection {\n  readonly size = input<SectionSize | undefined>(undefined);\n  /** Defaults to `auto`: the rank the outline gives. */\n  readonly level = input<SectionLevel | undefined>(undefined);\n  readonly ground = input<SectionGround | undefined>(undefined);\n  readonly divider = input<boolean | undefined, boolean | string | undefined>(undefined, {\n    transform: (state) => (state === undefined ? undefined : booleanAttribute(state)),\n  });\n  readonly sticky = input<boolean | undefined, boolean | string | undefined>(undefined, {\n    transform: (state) => (state === undefined ? undefined : booleanAttribute(state)),\n  });\n\n  private readonly defaults = injectSectionDefaults();\n  private readonly outline = inject(SlHeadingLevel, { optional: true });\n  private readonly writtenId = inject(new HostAttributeToken('id'), { optional: true });\n  private readonly generated = inject(SlSectionIdFactory).next();\n\n  /** Whether a heading is rendered, which is what makes the section a region. */\n  readonly hasHeading = signal(false);\n  /** The header element, handed over by `slSectionHeader`, so a sticky header can be measured. */\n  readonly header = signal<HTMLElement | null>(null);\n\n  private readonly native: HTMLElement = inject(ElementRef).nativeElement;\n\n  readonly id = computed(() => this.writtenId ?? this.generated);\n  readonly headingId = computed(() => `${this.id()}-heading`);\n  readonly resolvedSize = computed(() => this.size() ?? this.defaults.size);\n  readonly resolvedGround = computed(() => this.ground() ?? this.defaults.ground);\n  readonly resolvedDivider = computed(() => (this.divider() ?? this.defaults.divider) === true);\n  readonly resolvedSticky = computed(() => (this.sticky() ?? this.defaults.sticky) === true);\n  readonly resolvedLevel = computed<HeadingLevelValue>(() => {\n    const level = this.level();\n    if (level === undefined || level === 'auto') return this.outline?.level ?? 1;\n    return Number(level) as HeadingLevelValue;\n  });\n\n  constructor() {\n    /**\n     * A sticky header is chrome for what is under it: its height, measured,\n     * goes on the root as `--slotted-section-header-size`, and the stylesheet\n     * republishes `--slotted-page-sticky-top` for the body as page plus\n     * header, so a table's column header or a nested section stops under this\n     * header. Written on the element, so a resize costs no change detection.\n     */\n    effect((onCleanup) => {\n      const header = this.header();\n      if (!this.resolvedSticky() || header === null) return;\n      /* Rounded up: a fractional height rounded down leaves a hairline gap the rows show through. */\n      const write = () =>\n        this.native.style.setProperty(\n          HEADER_SIZE_PROPERTY,\n          `${Math.ceil(header.getBoundingClientRect().height || header.offsetHeight)}px`,\n        );\n      write();\n      const sizes = typeof ResizeObserver === 'undefined' ? null : new ResizeObserver(write);\n      sizes?.observe(header);\n      onCleanup(() => {\n        sizes?.disconnect();\n        this.native.style.removeProperty(HEADER_SIZE_PROPERTY);\n      });\n    });\n  }\n}\n","import { SlHeadingLevel } from '@slotted/angular/typography';\nimport { computed, Directive, ElementRef, inject } from '@angular/core';\nimport type { OnDestroy, OnInit } from '@angular/core';\n\nimport { SlSection } from './section';\n\nconst HEADINGS = new Set(['H1', 'H2', 'H3', 'H4', 'H5', 'H6']);\n\n/**\n * The row above the body: the title column and the actions. It hands the\n * root its element, so a sticky header's height reaches the stylesheet.\n */\n@Directive({ selector: '[slSectionHeader]', standalone: true, host: { 'data-part': 'header' } })\nexport class SlSectionHeader implements OnInit, OnDestroy {\n  private readonly section = inject(SlSection);\n  private readonly native: HTMLElement = inject(ElementRef).nativeElement;\n\n  ngOnInit() {\n    this.section.header.set(this.native);\n  }\n\n  ngOnDestroy() {\n    if (this.section.header() === this.native) this.section.header.set(null);\n  }\n}\n\n/** Eyebrow, heading, description, in that order. */\n@Directive({ selector: '[slSectionTitle]', standalone: true, host: { 'data-part': 'title' } })\nexport class SlSectionTitle {}\n\n/** A short overline above the heading — a count, a category. Structural, not status. */\n@Directive({ selector: '[slSectionEyebrow]', standalone: true, host: { 'data-part': 'eyebrow' } })\nexport class SlSectionEyebrow {}\n\n/** A paragraph under the heading, in the muted text, with a measure. */\n@Directive({\n  selector: '[slSectionDescription]',\n  standalone: true,\n  host: { 'data-part': 'description' },\n})\nexport class SlSectionDescription {}\n\n/** The end of the header row: a button, a toolbar, a link. */\n@Directive({ selector: '[slSectionActions]', standalone: true, host: { 'data-part': 'actions' } })\nexport class SlSectionActions {}\n\n/**\n * The heading, at the rank the section resolved. Rendering it is what makes\n * the section a region: the root names it through `aria-labelledby`. The\n * element is the consumer's own — a native heading gets nothing added, and\n * anything else gets `role=\"heading\"` and `aria-level`.\n */\n@Directive({\n  selector: '[slSectionHeading]',\n  standalone: true,\n  exportAs: 'slSectionHeading',\n  host: {\n    'data-part': 'heading',\n    '[attr.id]': 'section.headingId()',\n    '[attr.role]': 'ariaRole()',\n    '[attr.aria-level]': 'ariaLevel()',\n  },\n})\nexport class SlSectionHeading implements OnInit, OnDestroy {\n  protected readonly section = inject(SlSection);\n  private readonly native: HTMLElement = inject(ElementRef).nativeElement;\n  private readonly isNativeHeading = HEADINGS.has(this.native.tagName);\n\n  protected readonly ariaRole = computed(() => (this.isNativeHeading ? null : 'heading'));\n  protected readonly ariaLevel = computed(() =>\n    this.isNativeHeading ? null : this.section.resolvedLevel(),\n  );\n\n  ngOnInit() {\n    this.section.hasHeading.set(true);\n  }\n\n  ngOnDestroy() {\n    this.section.hasHeading.set(false);\n  }\n}\n\n/** The content, one outline step deeper: `slHeadingLevel` is a host directive. */\n@Directive({\n  selector: '[slSectionBody]',\n  standalone: true,\n  hostDirectives: [SlHeadingLevel],\n  host: { 'data-part': 'body' },\n})\nexport class SlSectionBody {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"slotted-angular-section.mjs","sources":["../../section/src/section-defaults.ts","../../section/src/section.ts","../../section/src/section-parts.ts","../../section/src/slotted-angular-section.ts"],"sourcesContent":["import { inject, Injectable, InjectionToken } from '@angular/core';\n\n/** The type step the heading sits at, independent of its rank. */\nexport type SectionSize = 'sm' | 'md' | 'lg';\n\n/** The rank of the heading. `auto` takes the one the outline gives. */\nexport type SectionLevel = 'auto' | '1' | '2' | '3' | '4' | '5' | '6';\n\n/** The ground: nothing, or a surface with an edge and a radius and no shadow. */\nexport type SectionGround = 'none' | 'surface';\n\nexport interface SectionDefaults {\n  divider: boolean;\n  ground: SectionGround;\n  size: SectionSize;\n  sticky: boolean;\n}\n\nconst FALLBACK: SectionDefaults = {\n  divider: false,\n  ground: 'none',\n  size: 'md',\n  sticky: false,\n};\n\nexport const SECTION_DEFAULTS = new InjectionToken<SectionDefaults>('slotted section defaults', {\n  providedIn: 'root',\n  factory: () => FALLBACK,\n});\n\n/**\n * An application decides once how its sections separate — a rule, a surface,\n * the step of their headings — rather than repeating the same inputs on every\n * one. A section that states any of them itself still wins.\n */\nexport function provideSectionDefaults(defaults: Partial<SectionDefaults>) {\n  return {\n    provide: SECTION_DEFAULTS,\n    useFactory: (): SectionDefaults => ({ ...FALLBACK, ...defaults }),\n  };\n}\n\n/** What a section renders as here, before it states anything of its own. */\nexport function injectSectionDefaults(): SectionDefaults {\n  return inject(SECTION_DEFAULTS);\n}\n\n/** Application-scoped, for the reason `field` records: the server and the client sequences must match. */\n@Injectable({ providedIn: 'root' })\nexport class SlSectionIdFactory {\n  private count = 0;\n\n  next() {\n    this.count += 1;\n    return `slotted-section-${this.count}`;\n  }\n}\n","import { SlHeadingLevel } from '@slotted/angular/typography';\nimport type { HeadingLevelValue } from '@slotted/angular/typography';\nimport {\n  booleanAttribute,\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  effect,\n  ElementRef,\n  HostAttributeToken,\n  inject,\n  input,\n  signal,\n  ViewEncapsulation,\n} from '@angular/core';\n\nimport { injectSectionDefaults, SlSectionIdFactory } from './section-defaults';\nimport type { SectionGround, SectionLevel, SectionSize } from './section-defaults';\n\nexport type { SectionDefaults, SectionGround, SectionLevel, SectionSize } from './section-defaults';\n\n/**\n * One unit of content inside a page: a header — eyebrow, heading,\n * description, actions — and a body one outline step deeper.\n *\n * **The rank is the outline's.** `typography` owns it: the heading takes the\n * rank `slHeadingLevel` gives — `h2` directly in a page body, one deeper\n * inside another section's body — unless `level` says otherwise. The element\n * is the consumer's: `<h2 slSectionHeading>` is a native heading and the\n * directive adds nothing to it; `<div slSectionHeading>` gets `role=\"heading\"`\n * and the level the section resolved.\n *\n * **A region only when it has a name.** The root is `aria-labelledby` its\n * heading once one is rendered, which makes the `section` a region landmark.\n *\n * **The hooks anchor navigation needs.** The root carries an `id`, the\n * consumer's own or a generated one, and a scroll margin the height of the\n * page's fixed chrome, so a hash link lands under the header.\n */\n/** The measured height of a sticky section's header, written on the root. */\nexport const HEADER_SIZE_PROPERTY = '--slotted-section-header-size';\n\n@Component({\n  selector: '[slSection]',\n  standalone: true,\n  exportAs: 'slSection',\n  template: '<ng-content />',\n  styleUrl: '../../../styles/src/section/section.css',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  encapsulation: ViewEncapsulation.None,\n  host: {\n    'data-ui': 'section',\n    'data-ui-section': '',\n    'data-part': 'root',\n    'data-part-root': '',\n    '[attr.id]': 'id()',\n    '[attr.aria-labelledby]': 'hasHeading() ? headingId() : null',\n    '[attr.data-size]': 'resolvedSize()',\n    '[attr.data-level]': 'resolvedLevel()',\n    '[attr.data-ground]': 'resolvedGround()',\n    '[attr.data-divider]': \"resolvedDivider() ? '' : null\",\n    '[attr.data-sticky]': \"resolvedSticky() ? '' : null\",\n  },\n})\nexport class SlSection {\n  readonly size = input<SectionSize | undefined>(undefined);\n  /** Defaults to `auto`: the rank the outline gives. */\n  readonly level = input<SectionLevel | undefined>(undefined);\n  readonly ground = input<SectionGround | undefined>(undefined);\n  readonly divider = input<boolean | undefined, boolean | string | undefined>(undefined, {\n    transform: (state) => (state === undefined ? undefined : booleanAttribute(state)),\n  });\n  readonly sticky = input<boolean | undefined, boolean | string | undefined>(undefined, {\n    transform: (state) => (state === undefined ? undefined : booleanAttribute(state)),\n  });\n\n  private readonly defaults = injectSectionDefaults();\n  private readonly outline = inject(SlHeadingLevel, { optional: true });\n  private readonly writtenId = inject(new HostAttributeToken('id'), { optional: true });\n  private readonly generated = inject(SlSectionIdFactory).next();\n\n  /** Whether a heading is rendered, which is what makes the section a region. */\n  readonly hasHeading = signal(false);\n  /** The header element, handed over by `slSectionHeader`, so a sticky header can be measured. */\n  readonly header = signal<HTMLElement | null>(null);\n\n  private readonly native: HTMLElement = inject(ElementRef).nativeElement;\n\n  readonly id = computed(() => this.writtenId ?? this.generated);\n  readonly headingId = computed(() => `${this.id()}-heading`);\n  readonly resolvedSize = computed(() => this.size() ?? this.defaults.size);\n  readonly resolvedGround = computed(() => this.ground() ?? this.defaults.ground);\n  readonly resolvedDivider = computed(() => (this.divider() ?? this.defaults.divider) === true);\n  readonly resolvedSticky = computed(() => (this.sticky() ?? this.defaults.sticky) === true);\n  readonly resolvedLevel = computed<HeadingLevelValue>(() => {\n    const level = this.level();\n    if (level === undefined || level === 'auto') return this.outline?.level ?? 1;\n    return Number(level) as HeadingLevelValue;\n  });\n\n  constructor() {\n    /**\n     * A sticky header is chrome for what is under it: its height, measured,\n     * goes on the root as `--slotted-section-header-size`, and the stylesheet\n     * republishes `--slotted-page-sticky-top` for the body as page plus\n     * header, so a table's column header or a nested section stops under this\n     * header. Written on the element, so a resize costs no change detection.\n     */\n    effect((onCleanup) => {\n      const header = this.header();\n      if (!this.resolvedSticky() || header === null) return;\n      /* Rounded up: a fractional height rounded down leaves a hairline gap the rows show through. */\n      const write = () =>\n        this.native.style.setProperty(\n          HEADER_SIZE_PROPERTY,\n          `${Math.ceil(header.getBoundingClientRect().height || header.offsetHeight)}px`,\n        );\n      write();\n      const sizes = typeof ResizeObserver === 'undefined' ? null : new ResizeObserver(write);\n      sizes?.observe(header);\n      onCleanup(() => {\n        sizes?.disconnect();\n        this.native.style.removeProperty(HEADER_SIZE_PROPERTY);\n      });\n    });\n  }\n}\n","import { SlHeadingLevel } from '@slotted/angular/typography';\nimport { computed, Directive, ElementRef, inject } from '@angular/core';\nimport type { OnDestroy, OnInit } from '@angular/core';\n\nimport { SlSection } from './section';\n\nconst HEADINGS = new Set(['H1', 'H2', 'H3', 'H4', 'H5', 'H6']);\n\n/**\n * The row above the body: the title column and the actions. It hands the\n * root its element, so a sticky header's height reaches the stylesheet.\n */\n@Directive({\n  selector: '[slSectionHeader]',\n  standalone: true,\n  host: { 'data-part': 'header', 'data-part-header': '' },\n})\nexport class SlSectionHeader implements OnInit, OnDestroy {\n  private readonly section = inject(SlSection);\n  private readonly native: HTMLElement = inject(ElementRef).nativeElement;\n\n  ngOnInit() {\n    this.section.header.set(this.native);\n  }\n\n  ngOnDestroy() {\n    if (this.section.header() === this.native) this.section.header.set(null);\n  }\n}\n\n/** Eyebrow, heading, description, in that order. */\n@Directive({\n  selector: '[slSectionTitle]',\n  standalone: true,\n  host: { 'data-part': 'title', 'data-part-title': '' },\n})\nexport class SlSectionTitle {}\n\n/** A short overline above the heading — a count, a category. Structural, not status. */\n@Directive({\n  selector: '[slSectionEyebrow]',\n  standalone: true,\n  host: { 'data-part': 'eyebrow', 'data-part-eyebrow': '' },\n})\nexport class SlSectionEyebrow {}\n\n/** A paragraph under the heading, in the muted text, with a measure. */\n@Directive({\n  selector: '[slSectionDescription]',\n  standalone: true,\n  host: { 'data-part': 'description', 'data-part-description': '' },\n})\nexport class SlSectionDescription {}\n\n/** The end of the header row: a button, a toolbar, a link. */\n@Directive({\n  selector: '[slSectionActions]',\n  standalone: true,\n  host: { 'data-part': 'actions', 'data-part-actions': '' },\n})\nexport class SlSectionActions {}\n\n/**\n * The heading, at the rank the section resolved. Rendering it is what makes\n * the section a region: the root names it through `aria-labelledby`. The\n * element is the consumer's own — a native heading gets nothing added, and\n * anything else gets `role=\"heading\"` and `aria-level`.\n */\n@Directive({\n  selector: '[slSectionHeading]',\n  standalone: true,\n  exportAs: 'slSectionHeading',\n  host: {\n    'data-part': 'heading',\n    'data-part-heading': '',\n    '[attr.id]': 'section.headingId()',\n    '[attr.role]': 'ariaRole()',\n    '[attr.aria-level]': 'ariaLevel()',\n  },\n})\nexport class SlSectionHeading implements OnInit, OnDestroy {\n  protected readonly section = inject(SlSection);\n  private readonly native: HTMLElement = inject(ElementRef).nativeElement;\n  private readonly isNativeHeading = HEADINGS.has(this.native.tagName);\n\n  protected readonly ariaRole = computed(() => (this.isNativeHeading ? null : 'heading'));\n  protected readonly ariaLevel = computed(() =>\n    this.isNativeHeading ? null : this.section.resolvedLevel(),\n  );\n\n  ngOnInit() {\n    this.section.hasHeading.set(true);\n  }\n\n  ngOnDestroy() {\n    this.section.hasHeading.set(false);\n  }\n}\n\n/** The content, one outline step deeper: `slHeadingLevel` is a host directive. */\n@Directive({\n  selector: '[slSectionBody]',\n  standalone: true,\n  hostDirectives: [SlHeadingLevel],\n  host: { 'data-part': 'body', 'data-part-body': '' },\n})\nexport class SlSectionBody {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}