@nldd/design-system 0.8.46 → 0.8.48
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/components.js +83 -78
- package/dist/components/content/{code/code.d.ts → code-viewer/code-viewer.d.ts} +12 -11
- package/dist/components/content/code-viewer/code-viewer.d.ts.map +1 -0
- package/dist/components/content/{code/code.js → code-viewer/code-viewer.js} +32 -25
- package/dist/components/content/code-viewer/code-viewer.js.map +1 -0
- package/dist/components/content/code-viewer/code-viewer.styles.d.ts +2 -0
- package/dist/components/content/code-viewer/code-viewer.styles.d.ts.map +1 -0
- package/dist/components/content/code-viewer/code-viewer.styles.js +89 -0
- package/dist/components/content/code-viewer/code-viewer.styles.js.map +1 -0
- package/dist/components/content/code-viewer/code-viewer.template.d.ts +4 -0
- package/dist/components/content/code-viewer/code-viewer.template.d.ts.map +1 -0
- package/dist/components/content/{code/code.template.js → code-viewer/code-viewer.template.js} +3 -3
- package/dist/components/content/code-viewer/code-viewer.template.js.map +1 -0
- package/dist/components/{index-BvNDgQGM.js → index-CHPElQwp.js} +2981 -1823
- package/dist/components/index.d.ts +3 -1
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +3 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/layout/app-view/app-view.d.ts +2 -2
- package/dist/components/layout/app-view/app-view.d.ts.map +1 -1
- package/dist/components/layout/app-view/app-view.js +2 -2
- package/dist/components/layout/app-view/app-view.js.map +1 -1
- package/dist/components/layout/collection/collection.d.ts +2 -0
- package/dist/components/layout/collection/collection.d.ts.map +1 -1
- package/dist/components/layout/collection/collection.js +8 -0
- package/dist/components/layout/collection/collection.js.map +1 -1
- package/dist/components/layout/collection/collection.styles.d.ts.map +1 -1
- package/dist/components/layout/collection/collection.styles.js +4 -0
- package/dist/components/layout/collection/collection.styles.js.map +1 -1
- package/dist/components/layout/collection/collection.template.d.ts.map +1 -1
- package/dist/components/layout/collection/collection.template.js +5 -2
- package/dist/components/layout/collection/collection.template.js.map +1 -1
- package/dist/components/layout/container/container.d.ts +62 -8
- package/dist/components/layout/container/container.d.ts.map +1 -1
- package/dist/components/layout/container/container.js +113 -11
- package/dist/components/layout/container/container.js.map +1 -1
- package/dist/components/layout/container/container.styles.d.ts.map +1 -1
- package/dist/components/layout/container/container.styles.js +261 -15
- package/dist/components/layout/container/container.styles.js.map +1 -1
- package/dist/components/layout/container/container.template.d.ts.map +1 -1
- package/dist/components/layout/container/container.template.js +5 -1
- package/dist/components/layout/container/container.template.js.map +1 -1
- package/dist/components/layout/page/page.d.ts +2 -2
- package/dist/components/layout/page/page.d.ts.map +1 -1
- package/dist/components/layout/page/page.js +1 -1
- package/dist/components/layout/page/page.js.map +1 -1
- package/dist/components/layout/page/page.styles.js +1 -1
- package/dist/components/layout/page-footer/page-footer.d.ts +84 -0
- package/dist/components/layout/page-footer/page-footer.d.ts.map +1 -0
- package/dist/components/layout/page-footer/page-footer.i18n.d.ts +5 -0
- package/dist/components/layout/page-footer/page-footer.i18n.d.ts.map +1 -0
- package/dist/components/layout/page-footer/page-footer.i18n.js +4 -0
- package/dist/components/layout/page-footer/page-footer.i18n.js.map +1 -0
- package/dist/components/layout/page-footer/page-footer.js +217 -0
- package/dist/components/layout/page-footer/page-footer.js.map +1 -0
- package/dist/components/layout/page-footer/page-footer.styles.d.ts +4 -0
- package/dist/components/layout/page-footer/page-footer.styles.d.ts.map +1 -0
- package/dist/components/layout/page-footer/page-footer.styles.js +198 -0
- package/dist/components/layout/page-footer/page-footer.styles.js.map +1 -0
- package/dist/components/layout/page-footer/page-footer.template.d.ts +6 -0
- package/dist/components/layout/page-footer/page-footer.template.d.ts.map +1 -0
- package/dist/components/layout/page-footer/page-footer.template.js +73 -0
- package/dist/components/layout/page-footer/page-footer.template.js.map +1 -0
- package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.d.ts +26 -1
- package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.d.ts.map +1 -1
- package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.js +10 -1
- package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.js.map +1 -1
- package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.styles.d.ts.map +1 -1
- package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.styles.js +23 -35
- package/dist/components/layout/page-sections/full-bleed-section/full-bleed-section.styles.js.map +1 -1
- package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.d.ts +26 -1
- package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.d.ts.map +1 -1
- package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.js +10 -1
- package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.js.map +1 -1
- package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.styles.d.ts.map +1 -1
- package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.styles.js +26 -53
- package/dist/components/layout/page-sections/one-half-one-half-section/one-half-one-half-section.styles.js.map +1 -1
- package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.d.ts +26 -1
- package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.d.ts.map +1 -1
- package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.js +10 -1
- package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.js.map +1 -1
- package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.styles.d.ts.map +1 -1
- package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.styles.js +33 -51
- package/dist/components/layout/page-sections/one-third-two-thirds-section/one-third-two-thirds-section.styles.js.map +1 -1
- package/dist/components/layout/page-sections/page-section-controls.d.ts +226 -0
- package/dist/components/layout/page-sections/page-section-controls.d.ts.map +1 -0
- package/dist/components/layout/page-sections/page-section-controls.js +104 -0
- package/dist/components/layout/page-sections/page-section-controls.js.map +1 -0
- package/dist/components/layout/page-sections/simple-section/simple-section.d.ts +26 -1
- package/dist/components/layout/page-sections/simple-section/simple-section.d.ts.map +1 -1
- package/dist/components/layout/page-sections/simple-section/simple-section.js +10 -1
- package/dist/components/layout/page-sections/simple-section/simple-section.js.map +1 -1
- package/dist/components/layout/page-sections/simple-section/simple-section.styles.d.ts.map +1 -1
- package/dist/components/layout/page-sections/simple-section/simple-section.styles.js +24 -38
- package/dist/components/layout/page-sections/simple-section/simple-section.styles.js.map +1 -1
- package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.d.ts +26 -1
- package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.d.ts.map +1 -1
- package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.js +10 -1
- package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.js.map +1 -1
- package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.styles.d.ts.map +1 -1
- package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.styles.js +33 -51
- package/dist/components/layout/page-sections/two-thirds-one-third-section/two-thirds-one-third-section.styles.js.map +1 -1
- package/dist/components/layout/split-views/bar-split-view/bar-split-view.d.ts +2 -2
- package/dist/components/layout/split-views/bar-split-view/bar-split-view.d.ts.map +1 -1
- package/dist/components/layout/split-views/bar-split-view/bar-split-view.js +1 -1
- package/dist/components/layout/split-views/bar-split-view/bar-split-view.js.map +1 -1
- package/dist/components/layout/split-views/bar-split-view/bar-split-view.styles.js +1 -1
- package/dist/components/layout/split-views/navigation-split-view/navigation-split-view.styles.js +1 -1
- package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.d.ts +2 -2
- package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.d.ts.map +1 -1
- package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.js +1 -1
- package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.js.map +1 -1
- package/dist/components/layout/split-views/side-by-side-split-view/side-by-side-split-view.styles.js +1 -1
- package/dist/components/layout/split-views/split-view-pane/split-view-pane.d.ts +2 -2
- package/dist/components/layout/split-views/split-view-pane/split-view-pane.d.ts.map +1 -1
- package/dist/components/layout/split-views/split-view-pane/split-view-pane.js +1 -1
- package/dist/components/layout/split-views/split-view-pane/split-view-pane.js.map +1 -1
- package/dist/components/layout/split-views/split-view-pane/split-view-pane.styles.js +1 -1
- package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.d.ts +2 -2
- package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.d.ts.map +1 -1
- package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.js +1 -1
- package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.js.map +1 -1
- package/dist/components/layout/split-views/stacked-split-view/stacked-split-view.styles.js +1 -1
- package/dist/components/layout/window/window.d.ts +5 -0
- package/dist/components/layout/window/window.d.ts.map +1 -1
- package/dist/components/layout/window/window.js +28 -13
- package/dist/components/layout/window/window.js.map +1 -1
- package/dist/components/layout/window/window.styles.d.ts.map +1 -1
- package/dist/components/layout/window/window.styles.js +1 -7
- package/dist/components/layout/window/window.styles.js.map +1 -1
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.d.ts +6 -5
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.d.ts.map +1 -1
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.js +16 -111
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.js.map +1 -1
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.d.ts +2 -0
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.d.ts.map +1 -0
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.js +94 -0
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.js.map +1 -0
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.d.ts +4 -0
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.d.ts.map +1 -0
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.js +20 -0
- package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.js.map +1 -0
- package/dist/components/lists-and-menus/list-item/list-item.styles.d.ts.map +1 -1
- package/dist/components/lists-and-menus/list-item/list-item.styles.js +9 -13
- package/dist/components/lists-and-menus/list-item/list-item.styles.js.map +1 -1
- package/dist/components/navigation/breadcrumbs/breadcrumbs.d.ts +80 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.d.ts.map +1 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.d.ts +6 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.d.ts.map +1 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.js +5 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.i18n.js.map +1 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.js +192 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.js.map +1 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.styles.d.ts +3 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.styles.d.ts.map +1 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.styles.js +124 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.styles.js.map +1 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.template.d.ts +6 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.template.d.ts.map +1 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.template.js +57 -0
- package/dist/components/navigation/breadcrumbs/breadcrumbs.template.js.map +1 -0
- package/dist/components/navigation/document-tab-bar/document-tab-bar.styles.d.ts.map +1 -1
- package/dist/components/navigation/document-tab-bar/document-tab-bar.styles.js +3 -4
- package/dist/components/navigation/document-tab-bar/document-tab-bar.styles.js.map +1 -1
- package/dist/components/navigation/menu-bar-item/menu-bar-item.d.ts +14 -17
- package/dist/components/navigation/menu-bar-item/menu-bar-item.d.ts.map +1 -1
- package/dist/components/navigation/menu-bar-item/menu-bar-item.js +47 -46
- package/dist/components/navigation/menu-bar-item/menu-bar-item.js.map +1 -1
- package/dist/components/navigation/menu-bar-item/menu-bar-item.template.js +2 -2
- package/dist/components/navigation/menu-bar-item/menu-bar-item.template.js.map +1 -1
- package/dist/components/navigation/pagination/pagination.styles.d.ts.map +1 -1
- package/dist/components/navigation/pagination/pagination.styles.js +6 -0
- package/dist/components/navigation/pagination/pagination.styles.js.map +1 -1
- package/dist/components/navigation/tab-bar/tab-bar.styles.d.ts.map +1 -1
- package/dist/components/navigation/tab-bar/tab-bar.styles.js +15 -0
- package/dist/components/navigation/tab-bar/tab-bar.styles.js.map +1 -1
- package/dist/components/navigation/top-navigation-bar/top-navigation-bar.styles.d.ts.map +1 -1
- package/dist/components/navigation/top-navigation-bar/top-navigation-bar.styles.js +28 -26
- package/dist/components/navigation/top-navigation-bar/top-navigation-bar.styles.js.map +1 -1
- package/dist/components/navigation/top-navigation-bar/top-navigation-bar.template.js +1 -1
- package/dist/components/prism-gherkin-CMPYyXOQ.js +82 -0
- package/dist/components/prism-python-ByhwnnUm.js +99 -0
- package/dist/components/prism-rust-BuyNemv0.js +157 -0
- package/dist/components/prism-sql-BGqCBMyJ.js +33 -0
- package/dist/components/prism-toml-Ubdq-a5x.js +45 -0
- package/dist/components/{prism-typescript-BX4tFNFm.js → prism-typescript-DNQwLx9f.js} +1 -1
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.d.ts +3 -0
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.d.ts.map +1 -1
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.js +5 -0
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.js.map +1 -1
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.d.ts.map +1 -1
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.js +20 -4
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.styles.js.map +1 -1
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.template.d.ts.map +1 -1
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.template.js +16 -14
- package/dist/components/status-and-feedback/inline-dialog/inline-dialog.template.js.map +1 -1
- package/dist/css/form.css +4 -5
- package/dist/css/rich-text.css +27 -115
- package/dist/css/settings.css +45 -32
- package/dist/utilities/page-section-mixin.d.ts +53 -0
- package/dist/utilities/page-section-mixin.d.ts.map +1 -0
- package/dist/utilities/page-section-mixin.js +239 -0
- package/dist/utilities/page-section-mixin.js.map +1 -0
- package/package.json +12 -4
- package/dist/components/content/code/code.d.ts.map +0 -1
- package/dist/components/content/code/code.js.map +0 -1
- package/dist/components/content/code/code.styles.d.ts +0 -2
- package/dist/components/content/code/code.styles.d.ts.map +0 -1
- package/dist/components/content/code/code.styles.js +0 -89
- package/dist/components/content/code/code.styles.js.map +0 -1
- package/dist/components/content/code/code.template.d.ts +0 -4
- package/dist/components/content/code/code.template.d.ts.map +0 -1
- package/dist/components/content/code/code.template.js.map +0 -1
|
@@ -3,12 +3,13 @@
|
|
|
3
3
|
*
|
|
4
4
|
* A cell component for displaying timeline track indicators in lists.
|
|
5
5
|
* Shows a vertical line with a dot indicating timeline position and state.
|
|
6
|
+
* The line extends into the surrounding list-item's block padding via the
|
|
7
|
+
* `--context-list-item-padding-block` cascade so consecutive steps connect
|
|
8
|
+
* without gaps.
|
|
6
9
|
*
|
|
7
10
|
* @element nldd-timeline-track-cell
|
|
8
|
-
* @attr {
|
|
9
|
-
* @attr {
|
|
10
|
-
*
|
|
11
|
-
* @csspart track - The timeline track container
|
|
11
|
+
* @attr {'past' | 'future' | 'none'} step - Timeline step state (default: 'past')
|
|
12
|
+
* @attr {'first' | 'between' | 'last'} child - Position in timeline (default: 'between')
|
|
12
13
|
*/
|
|
13
14
|
import { LitElement } from 'lit';
|
|
14
15
|
type Step = 'past' | 'future' | 'none';
|
|
@@ -17,7 +18,7 @@ export declare class NLDDTimelineTrackCell extends LitElement {
|
|
|
17
18
|
static styles: import("lit").CSSResult;
|
|
18
19
|
step: Step;
|
|
19
20
|
child: Child;
|
|
20
|
-
render(): import("lit-html").TemplateResult
|
|
21
|
+
render(): import("lit-html").TemplateResult;
|
|
21
22
|
}
|
|
22
23
|
declare global {
|
|
23
24
|
interface HTMLElementTagNameMap {
|
package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"timeline-track-cell.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"timeline-track-cell.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAKjC,KAAK,IAAI,GAAG,MAAM,GAAG,QAAQ,GAAG,MAAM,CAAC;AACvC,KAAK,KAAK,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAE1C,qBACa,qBAAsB,SAAQ,UAAU;IACpD,OAAgB,MAAM,0BAA2B;IAGjD,IAAI,EAAE,IAAI,CAAU;IAGpB,KAAK,EAAE,KAAK,CAAa;IAEhB,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,0BAA0B,EAAE,qBAAqB,CAAC;KAClD;CACD"}
|
|
@@ -1,23 +1,26 @@
|
|
|
1
|
+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
+
};
|
|
1
7
|
/**
|
|
2
8
|
* Nederlandse Digitale Dienst Timeline Track Cell Component (Lit + TypeScript)
|
|
3
9
|
*
|
|
4
10
|
* A cell component for displaying timeline track indicators in lists.
|
|
5
11
|
* Shows a vertical line with a dot indicating timeline position and state.
|
|
12
|
+
* The line extends into the surrounding list-item's block padding via the
|
|
13
|
+
* `--context-list-item-padding-block` cascade so consecutive steps connect
|
|
14
|
+
* without gaps.
|
|
6
15
|
*
|
|
7
16
|
* @element nldd-timeline-track-cell
|
|
8
|
-
* @attr {
|
|
9
|
-
* @attr {
|
|
10
|
-
*
|
|
11
|
-
* @csspart track - The timeline track container
|
|
17
|
+
* @attr {'past' | 'future' | 'none'} step - Timeline step state (default: 'past')
|
|
18
|
+
* @attr {'first' | 'between' | 'last'} child - Position in timeline (default: 'between')
|
|
12
19
|
*/
|
|
13
|
-
|
|
14
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
15
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
16
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
17
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
18
|
-
};
|
|
19
|
-
import { LitElement, html, css } from 'lit';
|
|
20
|
+
import { LitElement } from 'lit';
|
|
20
21
|
import { customElement, property } from 'lit/decorators.js';
|
|
22
|
+
import { timelineTrackCellStyles } from './timeline-track-cell.styles.js';
|
|
23
|
+
import { timelineTrackCellTemplate } from './timeline-track-cell.template.js';
|
|
21
24
|
let NLDDTimelineTrackCell = class NLDDTimelineTrackCell extends LitElement {
|
|
22
25
|
constructor() {
|
|
23
26
|
super(...arguments);
|
|
@@ -25,108 +28,10 @@ let NLDDTimelineTrackCell = class NLDDTimelineTrackCell extends LitElement {
|
|
|
25
28
|
this.child = 'between';
|
|
26
29
|
}
|
|
27
30
|
render() {
|
|
28
|
-
|
|
29
|
-
return html `
|
|
30
|
-
<div class="timeline-track" part="track">
|
|
31
|
-
<div class="timeline-track__line-full"></div>
|
|
32
|
-
</div>
|
|
33
|
-
`;
|
|
34
|
-
}
|
|
35
|
-
const showTopLine = this.child === 'between' || this.child === 'last';
|
|
36
|
-
const showBottomLine = this.child === 'between' || this.child === 'first';
|
|
37
|
-
return html `
|
|
38
|
-
<div class="timeline-track" part="track">
|
|
39
|
-
${showTopLine ? html `<div class="timeline-track__line-top"></div>` : ''}
|
|
40
|
-
<div class="timeline-track__dot"></div>
|
|
41
|
-
${showBottomLine ? html `<div class="timeline-track__line-bottom"></div>` : ''}
|
|
42
|
-
</div>
|
|
43
|
-
`;
|
|
31
|
+
return timelineTrackCellTemplate(this);
|
|
44
32
|
}
|
|
45
33
|
};
|
|
46
|
-
NLDDTimelineTrackCell.styles =
|
|
47
|
-
:host {
|
|
48
|
-
display: flex;
|
|
49
|
-
flex-direction: column;
|
|
50
|
-
align-items: center;
|
|
51
|
-
width: 18px;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
:host([hidden]) {
|
|
55
|
-
display: none;
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
.timeline-track {
|
|
59
|
-
position: relative;
|
|
60
|
-
width: 18px;
|
|
61
|
-
height: 100%;
|
|
62
|
-
min-height: 50px;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
/* Vertical lines */
|
|
66
|
-
.timeline-track__line-top,
|
|
67
|
-
.timeline-track__line-bottom {
|
|
68
|
-
position: absolute;
|
|
69
|
-
left: 50%;
|
|
70
|
-
width: 2px;
|
|
71
|
-
margin-left: -1px;
|
|
72
|
-
background-color: var(--semantics-buttons-accent-filled-background-color);
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.timeline-track__line-top {
|
|
76
|
-
bottom: 50%;
|
|
77
|
-
height: 59px;
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
.timeline-track__line-bottom {
|
|
81
|
-
top: 50%;
|
|
82
|
-
height: 59px;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
/* Dot indicator */
|
|
86
|
-
.timeline-track__dot {
|
|
87
|
-
position: absolute;
|
|
88
|
-
top: 50%;
|
|
89
|
-
left: 0;
|
|
90
|
-
width: 18px;
|
|
91
|
-
height: 18px;
|
|
92
|
-
margin-top: -9px;
|
|
93
|
-
border-radius: 50%;
|
|
94
|
-
box-sizing: border-box;
|
|
95
|
-
border: 2px solid var(--semantics-buttons-accent-filled-background-color);
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
/* Step: past (filled dot) */
|
|
99
|
-
:host([step="past"]) .timeline-track__dot,
|
|
100
|
-
:host(:not([step])) .timeline-track__dot {
|
|
101
|
-
background-color: var(--semantics-buttons-accent-filled-background-color);
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
/* Step: future (hollow dot with white fill) */
|
|
105
|
-
:host([step="future"]) .timeline-track__dot {
|
|
106
|
-
background-color: var(--semantics-surfaces-background-color);
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
/* Step: none - continuous line, no dot */
|
|
110
|
-
.timeline-track__line-full {
|
|
111
|
-
position: absolute;
|
|
112
|
-
left: 50%;
|
|
113
|
-
width: 2px;
|
|
114
|
-
margin-left: -1px;
|
|
115
|
-
top: -34px;
|
|
116
|
-
bottom: -34px;
|
|
117
|
-
background-color: var(--semantics-buttons-accent-filled-background-color);
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
/* Accessibility: High Contrast Mode */
|
|
121
|
-
@media (forced-colors: active) {
|
|
122
|
-
.timeline-track__dot,
|
|
123
|
-
.timeline-track__line-top,
|
|
124
|
-
.timeline-track__line-bottom,
|
|
125
|
-
.timeline-track__line-full {
|
|
126
|
-
forced-color-adjust: none;
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
`;
|
|
34
|
+
NLDDTimelineTrackCell.styles = timelineTrackCellStyles;
|
|
130
35
|
__decorate([
|
|
131
36
|
property({ type: String, reflect: true })
|
|
132
37
|
], NLDDTimelineTrackCell.prototype, "step", void 0);
|
package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"timeline-track-cell.js","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"timeline-track-cell.js","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.ts"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AAMvE,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,UAAU;IAA9C;;QAIN,SAAI,GAAS,MAAM,CAAC;QAGpB,UAAK,GAAU,SAAS,CAAC;IAK1B,CAAC;IAHS,MAAM;QACd,OAAO,yBAAyB,CAAC,IAAI,CAAC,CAAC;IACxC,CAAC;;AAVe,4BAAM,GAAG,uBAAuB,AAA1B,CAA2B;AAGjD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACtB;AAGpB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oDACjB;AAPb,qBAAqB;IADjC,aAAa,CAAC,0BAA0B,CAAC;GAC7B,qBAAqB,CAYjC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline-track-cell.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,uBAAuB,yBA2FnC,CAAC"}
|
package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.js
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import { css } from 'lit';
|
|
2
|
+
export const timelineTrackCellStyles = css `
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
/* # Host */
|
|
6
|
+
|
|
7
|
+
:host {
|
|
8
|
+
--_size: var(--primitives-space-16);
|
|
9
|
+
--_line-width: var(--primitives-space-2);
|
|
10
|
+
--_z-index-dot: 1;
|
|
11
|
+
--_color: var(--components-timeline-track-cell-color);
|
|
12
|
+
--_future-background-color: var(--components-timeline-track-cell-future-background-color);
|
|
13
|
+
|
|
14
|
+
display: flex;
|
|
15
|
+
width: var(--_size);
|
|
16
|
+
flex-direction: column;
|
|
17
|
+
align-self: stretch;
|
|
18
|
+
align-items: center;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
:host([hidden]) {
|
|
22
|
+
display: none;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
/* # Block */
|
|
27
|
+
|
|
28
|
+
.timeline-track-cell {
|
|
29
|
+
position: relative;
|
|
30
|
+
width: var(--_size);
|
|
31
|
+
height: 100%;
|
|
32
|
+
min-height: var(--primitives-space-48);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
/* # Elements */
|
|
37
|
+
|
|
38
|
+
.timeline-track-cell__line-top,
|
|
39
|
+
.timeline-track-cell__line-bottom,
|
|
40
|
+
.timeline-track-cell__line-full {
|
|
41
|
+
position: absolute;
|
|
42
|
+
left: 50%;
|
|
43
|
+
margin-left: calc(var(--_line-width) / -2);
|
|
44
|
+
background-color: var(--_color);
|
|
45
|
+
width: var(--_line-width);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.timeline-track-cell__line-top {
|
|
49
|
+
bottom: 50%;
|
|
50
|
+
height: calc(50% + var(--context-list-item-padding-block, 0px));
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.timeline-track-cell__line-bottom {
|
|
54
|
+
top: 50%;
|
|
55
|
+
height: calc(50% + var(--context-list-item-padding-block, 0px));
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
.timeline-track-cell__line-full {
|
|
59
|
+
top: calc(-1 * var(--context-list-item-padding-block, 0px));
|
|
60
|
+
bottom: calc(-1 * var(--context-list-item-padding-block, 0px));
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.timeline-track-cell__dot {
|
|
64
|
+
box-sizing: border-box;
|
|
65
|
+
position: absolute;
|
|
66
|
+
top: 50%;
|
|
67
|
+
left: 0;
|
|
68
|
+
z-index: var(--_z-index-dot);
|
|
69
|
+
margin-top: calc(var(--_size) / -2);
|
|
70
|
+
border: var(--_line-width) solid var(--_color);
|
|
71
|
+
border-radius: var(--primitives-corner-radius-full);
|
|
72
|
+
width: var(--_size);
|
|
73
|
+
height: var(--_size);
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
:host([step="past"]) .timeline-track-cell__dot,
|
|
77
|
+
:host(:not([step])) .timeline-track-cell__dot {
|
|
78
|
+
background-color: var(--_color);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
:host([step="future"]) .timeline-track-cell__dot {
|
|
82
|
+
background-color: var(--_future-background-color);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
@media (forced-colors: active) {
|
|
86
|
+
.timeline-track-cell__dot,
|
|
87
|
+
.timeline-track-cell__line-top,
|
|
88
|
+
.timeline-track-cell__line-bottom,
|
|
89
|
+
.timeline-track-cell__line-full {
|
|
90
|
+
forced-color-adjust: none;
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
`;
|
|
94
|
+
//# sourceMappingURL=timeline-track-cell.styles.js.map
|
package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline-track-cell.styles.js","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2FzC,CAAC"}
|
package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.d.ts
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { type TemplateResult } from 'lit';
|
|
2
|
+
import type { NLDDTimelineTrackCell } from './timeline-track-cell.js';
|
|
3
|
+
export declare function timelineTrackCellTemplate(component: NLDDTimelineTrackCell): TemplateResult;
|
|
4
|
+
//# sourceMappingURL=timeline-track-cell.template.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline-track-cell.template.d.ts","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AACzD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,wBAAgB,yBAAyB,CAAC,SAAS,EAAE,qBAAqB,GAAG,cAAc,CAmB1F"}
|
package/dist/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.js
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { html, nothing } from 'lit';
|
|
2
|
+
export function timelineTrackCellTemplate(component) {
|
|
3
|
+
if (component.step === 'none') {
|
|
4
|
+
return html `
|
|
5
|
+
<div class="timeline-track-cell">
|
|
6
|
+
<div class="timeline-track-cell__line-full"></div>
|
|
7
|
+
</div>
|
|
8
|
+
`;
|
|
9
|
+
}
|
|
10
|
+
const showTopLine = component.child === 'between' || component.child === 'last';
|
|
11
|
+
const showBottomLine = component.child === 'between' || component.child === 'first';
|
|
12
|
+
return html `
|
|
13
|
+
<div class="timeline-track-cell">
|
|
14
|
+
${showTopLine ? html `<div class="timeline-track-cell__line-top"></div>` : nothing}
|
|
15
|
+
<div class="timeline-track-cell__dot"></div>
|
|
16
|
+
${showBottomLine ? html `<div class="timeline-track-cell__line-bottom"></div>` : nothing}
|
|
17
|
+
</div>
|
|
18
|
+
`;
|
|
19
|
+
}
|
|
20
|
+
//# sourceMappingURL=timeline-track-cell.template.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timeline-track-cell.template.js","sourceRoot":"","sources":["../../../../../src/components/lists-and-menus/cells/timeline-track-cell/timeline-track-cell.template.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAuB,MAAM,KAAK,CAAC;AAGzD,MAAM,UAAU,yBAAyB,CAAC,SAAgC;IACzE,IAAI,SAAS,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC/B,OAAO,IAAI,CAAA;;;;GAIV,CAAC;IACH,CAAC;IAED,MAAM,WAAW,GAAG,SAAS,CAAC,KAAK,KAAK,SAAS,IAAI,SAAS,CAAC,KAAK,KAAK,MAAM,CAAC;IAChF,MAAM,cAAc,GAAG,SAAS,CAAC,KAAK,KAAK,SAAS,IAAI,SAAS,CAAC,KAAK,KAAK,OAAO,CAAC;IAEpF,OAAO,IAAI,CAAA;;KAEP,WAAW,CAAC,CAAC,CAAC,IAAI,CAAA,mDAAmD,CAAC,CAAC,CAAC,OAAO;;KAE/E,cAAc,CAAC,CAAC,CAAC,IAAI,CAAA,sDAAsD,CAAC,CAAC,CAAC,OAAO;;EAExF,CAAC;AACH,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"list-item.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/lists-and-menus/list-item/list-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,
|
|
1
|
+
{"version":3,"file":"list-item.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/lists-and-menus/list-item/list-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAgQ1B,CAAC"}
|
|
@@ -11,13 +11,18 @@ export const listItemStyles = css `
|
|
|
11
11
|
--_z-index-indicator: calc(var(--_z-index-content) - 1);
|
|
12
12
|
--_focus-outline-offset: 6px;
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
--context-list-item-padding-block: var(--components-list-item-md-padding-block);
|
|
15
|
+
|
|
15
16
|
container-type: inline-size;
|
|
16
|
-
|
|
17
|
+
display: block;
|
|
17
18
|
width: 100%;
|
|
18
19
|
-webkit-tap-highlight-color: transparent;
|
|
19
20
|
}
|
|
20
21
|
|
|
22
|
+
:host([size="sm"]) {
|
|
23
|
+
--context-list-item-padding-block: var(--components-list-item-sm-padding-block);
|
|
24
|
+
}
|
|
25
|
+
|
|
21
26
|
:host([hidden]) {
|
|
22
27
|
display: none;
|
|
23
28
|
}
|
|
@@ -209,7 +214,7 @@ export const listItemStyles = css `
|
|
|
209
214
|
display: none;
|
|
210
215
|
position: relative;
|
|
211
216
|
z-index: var(--_z-index-content);
|
|
212
|
-
padding-block: var(--
|
|
217
|
+
padding-block: var(--context-list-item-padding-block);
|
|
213
218
|
flex-direction: row;
|
|
214
219
|
flex-shrink: 0;
|
|
215
220
|
align-items: center;
|
|
@@ -220,11 +225,6 @@ export const listItemStyles = css `
|
|
|
220
225
|
display: flex;
|
|
221
226
|
}
|
|
222
227
|
|
|
223
|
-
:host([size="sm"]) .list-item__start-area,
|
|
224
|
-
:host([size="sm"]) .list-item__end-area {
|
|
225
|
-
padding-block: var(--components-list-item-sm-padding-block);
|
|
226
|
-
}
|
|
227
|
-
|
|
228
228
|
|
|
229
229
|
/* # Main area */
|
|
230
230
|
|
|
@@ -233,16 +233,12 @@ export const listItemStyles = css `
|
|
|
233
233
|
position: relative;
|
|
234
234
|
z-index: var(--_z-index-content);
|
|
235
235
|
min-width: 0;
|
|
236
|
-
padding-block: var(--
|
|
236
|
+
padding-block: var(--context-list-item-padding-block);
|
|
237
237
|
flex-direction: row;
|
|
238
238
|
flex-grow: 1;
|
|
239
239
|
align-items: center;
|
|
240
240
|
}
|
|
241
241
|
|
|
242
|
-
:host([size="sm"]) .list-item__main-area {
|
|
243
|
-
padding-block: var(--components-list-item-sm-padding-block);
|
|
244
|
-
}
|
|
245
|
-
|
|
246
242
|
|
|
247
243
|
/* # Divider */
|
|
248
244
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"list-item.styles.js","sourceRoot":"","sources":["../../../../src/components/lists-and-menus/list-item/list-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"list-item.styles.js","sourceRoot":"","sources":["../../../../src/components/lists-and-menus/list-item/list-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgQhC,CAAC"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Nederlandse Digitale Dienst Breadcrumbs Component (Lit + TypeScript)
|
|
3
|
+
*
|
|
4
|
+
* A trail of `nldd-breadcrumbs-item`s separated by `›`, rendered as a
|
|
5
|
+
* `<nav>` landmark wrapping a `<div role="list">` (with each item carrying
|
|
6
|
+
* `role="listitem"`). Explicit ARIA roles travel reliably across the slot
|
|
7
|
+
* boundary where the implicit `<ol>`/`<li>` mapping is inconsistent across
|
|
8
|
+
* AT + browser combos. The host itself is its own container-query scope so
|
|
9
|
+
* the sm-viewport "‹ {parent}" fallback reacts to the breadcrumbs' own
|
|
10
|
+
* width, not the viewport.
|
|
11
|
+
*
|
|
12
|
+
* @element nldd-breadcrumbs
|
|
13
|
+
*
|
|
14
|
+
* @attr {string} accessible-label - Override the nav's aria-label.
|
|
15
|
+
* Defaults to the i18n value (NL: "Kruimelpad").
|
|
16
|
+
* @attr {object} translations - Override translation keys; unset keys
|
|
17
|
+
* fall back to the Dutch default.
|
|
18
|
+
*
|
|
19
|
+
* @slot - `nldd-breadcrumbs-item` children.
|
|
20
|
+
*/
|
|
21
|
+
import { LitElement, type PropertyValues } from 'lit';
|
|
22
|
+
import { type NLDDBreadcrumbsTranslations } from './breadcrumbs.i18n.js';
|
|
23
|
+
/**
|
|
24
|
+
* A single entry in an `nldd-breadcrumbs` list. Renders as a link when
|
|
25
|
+
* `href` is set, as plain text marked `aria-current="page"` when `current`
|
|
26
|
+
* is set, and as plain text otherwise. Each item renders its own trailing
|
|
27
|
+
* `›` separator; the last item in the list hides it via `:host(:last-of-type)`.
|
|
28
|
+
*
|
|
29
|
+
* @attr {string} href - Link target. Ignored when `current` is set.
|
|
30
|
+
* @attr {boolean} current - Marks this item as the current page (renders as
|
|
31
|
+
* plain text + `aria-current="page"`). Typical use
|
|
32
|
+
* is on the last item.
|
|
33
|
+
* @attr {string} text - Item label. Falls back to the default slot.
|
|
34
|
+
*
|
|
35
|
+
* @slot - Item label (alternative to `text`).
|
|
36
|
+
*/
|
|
37
|
+
export declare class NLDDBreadcrumbsItem extends LitElement {
|
|
38
|
+
static styles: import("lit").CSSResult;
|
|
39
|
+
href?: string;
|
|
40
|
+
current: boolean;
|
|
41
|
+
text: string;
|
|
42
|
+
connectedCallback(): void;
|
|
43
|
+
updated(changed: PropertyValues): void;
|
|
44
|
+
render(): import("lit-html").TemplateResult;
|
|
45
|
+
}
|
|
46
|
+
export declare class NLDDBreadcrumbs extends LitElement {
|
|
47
|
+
static styles: import("lit").CSSResult;
|
|
48
|
+
accessibleLabel: string;
|
|
49
|
+
translations: Partial<NLDDBreadcrumbsTranslations>;
|
|
50
|
+
private _mergedTranslations;
|
|
51
|
+
willUpdate(changed: PropertyValues): void;
|
|
52
|
+
_t(key: keyof NLDDBreadcrumbsTranslations): string;
|
|
53
|
+
/**
|
|
54
|
+
* All slotted nldd-breadcrumbs-item children, in DOM order. Items MUST
|
|
55
|
+
* be direct children of nldd-breadcrumbs — wrapping them in another
|
|
56
|
+
* element (e.g. `<ul><nldd-breadcrumbs-item>`) is unsupported and will
|
|
57
|
+
* make them invisible to this component (separator handling, sm-viewport
|
|
58
|
+
* fallback, etc. all key off this set).
|
|
59
|
+
*/
|
|
60
|
+
_items(): NLDDBreadcrumbsItem[];
|
|
61
|
+
/**
|
|
62
|
+
* The parent (one-level-up) item: the last non-current item with an
|
|
63
|
+
* `href` — the level-up link needs somewhere to navigate. Returns null
|
|
64
|
+
* when no eligible parent exists; the level-up element is not rendered
|
|
65
|
+
* in that case (so it can't appear in the link list of any AT).
|
|
66
|
+
*/
|
|
67
|
+
_parentItem(): NLDDBreadcrumbsItem | null;
|
|
68
|
+
_onSlotChange: () => void;
|
|
69
|
+
private _itemObserver?;
|
|
70
|
+
private _observeItemAttrs;
|
|
71
|
+
disconnectedCallback(): void;
|
|
72
|
+
render(): import("lit-html").TemplateResult;
|
|
73
|
+
}
|
|
74
|
+
declare global {
|
|
75
|
+
interface HTMLElementTagNameMap {
|
|
76
|
+
'nldd-breadcrumbs': NLDDBreadcrumbs;
|
|
77
|
+
'nldd-breadcrumbs-item': NLDDBreadcrumbsItem;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
//# sourceMappingURL=breadcrumbs.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumbs.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/breadcrumbs/breadcrumbs.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,UAAU,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAItD,OAAO,EAA+B,KAAK,2BAA2B,EAAE,MAAM,uBAAuB,CAAC;AAKtG;;;;;;;;;;;;;GAaG;AACH,qBAAa,mBAAoB,SAAQ,UAAU;IAClD,OAAgB,MAAM,0BAAyB;IAG/C,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,OAAO,UAAS;IAGhB,IAAI,SAAM;IAED,iBAAiB,IAAI,IAAI;IAYzB,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAatC,MAAM;CAGf;AAcD,qBACa,eAAgB,SAAQ,UAAU;IAC9C,OAAgB,MAAM,0BAAqB;IAG3C,eAAe,SAAM;IAGrB,YAAY,EAAE,OAAO,CAAC,2BAA2B,CAAC,CAAM;IAExD,OAAO,CAAC,mBAAmB,CAAmE;IAErF,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAYlD,EAAE,CAAC,GAAG,EAAE,MAAM,2BAA2B,GAAG,MAAM;IAWlD;;;;;;OAMG;IACH,MAAM,IAAI,mBAAmB,EAAE;IAI/B;;;;;OAKG;IACH,WAAW,IAAI,mBAAmB,GAAG,IAAI;IAQzC,aAAa,aAMX;IAMF,OAAO,CAAC,aAAa,CAAC,CAAmB;IAEzC,OAAO,CAAC,iBAAiB;IAchB,oBAAoB,IAAI,IAAI;IAM5B,MAAM;CAGf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,kBAAkB,EAAE,eAAe,CAAC;QACpC,uBAAuB,EAAE,mBAAmB,CAAC;KAC7C;CACD"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export declare const nlddBreadcrumbsTranslations: {
|
|
2
|
+
'components.breadcrumbs.accessible-label': string;
|
|
3
|
+
'components.breadcrumbs.level-up-label': string;
|
|
4
|
+
};
|
|
5
|
+
export type NLDDBreadcrumbsTranslations = typeof nlddBreadcrumbsTranslations;
|
|
6
|
+
//# sourceMappingURL=breadcrumbs.i18n.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumbs.i18n.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/breadcrumbs/breadcrumbs.i18n.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,2BAA2B;;;CAGvC,CAAC;AAEF,MAAM,MAAM,2BAA2B,GAAG,OAAO,2BAA2B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumbs.i18n.js","sourceRoot":"","sources":["../../../../src/components/navigation/breadcrumbs/breadcrumbs.i18n.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,2BAA2B,GAAG;IAC1C,yCAAyC,EAAE,YAAY;IACvD,uCAAuC,EAAE,mBAAmB;CAC5D,CAAC"}
|