@dso-toolkit/core 66.0.0 → 66.1.0
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/cjs/dso-alert_6.cjs.entry.js +3 -3
- package/dist/cjs/dso-alert_6.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-autosuggest.cjs.entry.js +1 -1
- package/dist/cjs/dso-card.cjs.entry.js +1 -1
- package/dist/cjs/dso-card.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-document-card.cjs.entry.js +1 -1
- package/dist/cjs/dso-document-card.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-header.cjs.entry.js +1 -1
- package/dist/cjs/dso-label_2.cjs.entry.js +1 -1
- package/dist/cjs/dso-modal.cjs.entry.js +1 -1
- package/dist/cjs/dso-modal.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-plekinfo-card.cjs.entry.js +1 -1
- package/dist/cjs/dso-plekinfo-card.cjs.entry.js.map +1 -1
- package/dist/cjs/dso-scrollable.cjs.entry.js +1 -1
- package/dist/cjs/dso-viewer-grid.cjs.entry.js +1 -1
- package/dist/cjs/{index-7244933f.js → index-a49786b9.js} +7 -1
- package/dist/cjs/index-a49786b9.js.map +1 -0
- package/dist/collection/components/card/card.css +1 -1
- package/dist/collection/components/document-card/document-card.css +1 -1
- package/dist/collection/components/modal/modal.css +2 -2
- package/dist/collection/components/ozon-content/ozon-content.css +2 -2
- package/dist/collection/components/plekinfo-card/plekinfo-card.css +10 -2
- package/dist/collection/components/table/table.css +2 -2
- package/dist/components/dso-card.js +1 -1
- package/dist/components/dso-card.js.map +1 -1
- package/dist/components/dso-document-card.js +1 -1
- package/dist/components/dso-document-card.js.map +1 -1
- package/dist/components/dso-modal.js +1 -1
- package/dist/components/dso-modal.js.map +1 -1
- package/dist/components/dso-plekinfo-card.js +1 -1
- package/dist/components/dso-plekinfo-card.js.map +1 -1
- package/dist/components/index2.js +6 -0
- package/dist/components/index2.js.map +1 -1
- package/dist/components/ozon-content.js +1 -1
- package/dist/components/ozon-content.js.map +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/table.js.map +1 -1
- package/dist/dso-toolkit/dso-toolkit.esm.js +1 -1
- package/dist/dso-toolkit/p-16e112f1.js +2 -0
- package/dist/dso-toolkit/p-16e112f1.js.map +1 -0
- package/dist/dso-toolkit/p-2d9b7138.entry.js +2 -0
- package/dist/dso-toolkit/p-2d9b7138.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-8d57cfcf.entry.js → p-46e446b0.entry.js} +2 -2
- package/dist/dso-toolkit/p-587779a5.entry.js +2 -0
- package/dist/dso-toolkit/{p-65f73444.entry.js.map → p-587779a5.entry.js.map} +1 -1
- package/dist/dso-toolkit/{p-1f8b5c49.entry.js → p-608835d8.entry.js} +2 -2
- package/dist/dso-toolkit/p-778c0381.entry.js +2 -0
- package/dist/dso-toolkit/p-778c0381.entry.js.map +1 -0
- package/dist/dso-toolkit/p-8e699eb2.entry.js +2 -0
- package/dist/dso-toolkit/p-8e699eb2.entry.js.map +1 -0
- package/dist/dso-toolkit/{p-8dbf4868.entry.js → p-cc6c428b.entry.js} +2 -2
- package/dist/dso-toolkit/p-dcea90be.entry.js +2 -0
- package/dist/dso-toolkit/{p-6ff3146e.entry.js.map → p-dcea90be.entry.js.map} +1 -1
- package/dist/dso-toolkit/{p-c7b2a5ef.entry.js → p-e8322c5b.entry.js} +2 -2
- package/dist/dso-toolkit/{p-c228d56a.entry.js → p-fc82b0d0.entry.js} +2 -2
- package/dist/esm/dso-alert_6.entry.js +3 -3
- package/dist/esm/dso-alert_6.entry.js.map +1 -1
- package/dist/esm/dso-autosuggest.entry.js +1 -1
- package/dist/esm/dso-card.entry.js +1 -1
- package/dist/esm/dso-card.entry.js.map +1 -1
- package/dist/esm/dso-document-card.entry.js +1 -1
- package/dist/esm/dso-document-card.entry.js.map +1 -1
- package/dist/esm/dso-header.entry.js +1 -1
- package/dist/esm/dso-label_2.entry.js +1 -1
- package/dist/esm/dso-modal.entry.js +1 -1
- package/dist/esm/dso-modal.entry.js.map +1 -1
- package/dist/esm/dso-plekinfo-card.entry.js +1 -1
- package/dist/esm/dso-plekinfo-card.entry.js.map +1 -1
- package/dist/esm/dso-scrollable.entry.js +1 -1
- package/dist/esm/dso-viewer-grid.entry.js +1 -1
- package/dist/esm/{index-f62149d1.js → index-e112e225.js} +7 -1
- package/dist/esm/index-e112e225.js.map +1 -0
- package/package.json +5 -5
- package/dist/cjs/index-7244933f.js.map +0 -1
- package/dist/dso-toolkit/p-462d045d.entry.js +0 -2
- package/dist/dso-toolkit/p-462d045d.entry.js.map +0 -1
- package/dist/dso-toolkit/p-65f73444.entry.js +0 -2
- package/dist/dso-toolkit/p-6ff3146e.entry.js +0 -2
- package/dist/dso-toolkit/p-709ff0a5.js +0 -2
- package/dist/dso-toolkit/p-709ff0a5.js.map +0 -1
- package/dist/dso-toolkit/p-9a3879d8.entry.js +0 -2
- package/dist/dso-toolkit/p-9a3879d8.entry.js.map +0 -1
- package/dist/dso-toolkit/p-d67efa9d.entry.js +0 -2
- package/dist/dso-toolkit/p-d67efa9d.entry.js.map +0 -1
- package/dist/esm/index-f62149d1.js.map +0 -1
- /package/dist/dso-toolkit/{p-8d57cfcf.entry.js.map → p-46e446b0.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-1f8b5c49.entry.js.map → p-608835d8.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-8dbf4868.entry.js.map → p-cc6c428b.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-c7b2a5ef.entry.js.map → p-e8322c5b.entry.js.map} +0 -0
- /package/dist/dso-toolkit/{p-c228d56a.entry.js.map → p-fc82b0d0.entry.js.map} +0 -0
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-848434f1.js');
|
|
6
|
-
const index$1 = require('./index-
|
|
6
|
+
const index$1 = require('./index-a49786b9.js');
|
|
7
7
|
const v4 = require('./v4-7014b8b0.js');
|
|
8
8
|
|
|
9
9
|
function escapeStringRegexp(string) {
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-848434f1.js');
|
|
6
6
|
const isModifiedEvent = require('./is-modified-event-f643edb2.js');
|
|
7
7
|
|
|
8
|
-
const cardCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:url(\"./dso-icons.svg#img-download\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:url(\"./dso-icons.svg#img-download-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:url(\"./dso-icons.svg#img-external-link\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:url(\"./dso-icons.svg#img-external-link-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:url(\"./dso-icons.svg#img-call-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-call-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:url(\"./dso-icons.svg#img-email-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-email-scampi\")}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([is-selectable]:not([is-selectable=false])) .dso-card-container{display:grid;grid-template-columns:1fr minmax(0, 100%)}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-heading,:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-content{grid-column:2/-1}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-selectable{grid-row:span 2}:host([active]:not([active=false])) .dso-card-container{background-color:#e5e5e5}.dso-card-container{padding-block:16px
|
|
8
|
+
const cardCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:url(\"./dso-icons.svg#img-download\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:url(\"./dso-icons.svg#img-download-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:url(\"./dso-icons.svg#img-external-link\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:url(\"./dso-icons.svg#img-external-link-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:url(\"./dso-icons.svg#img-call-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-call-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:url(\"./dso-icons.svg#img-email-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-email-scampi\")}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([is-selectable]:not([is-selectable=false])) .dso-card-container{display:grid;grid-template-columns:1fr minmax(0, 100%)}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-heading,:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-content{grid-column:2/-1}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-selectable{grid-row:span 2}:host([active]:not([active=false])) .dso-card-container{background-color:#e5e5e5}.dso-card-container{padding-block:16px;padding-inline:16px;inline-size:100%;block-size:100%}.dso-card-container:has(.dso-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}.dso-card-container .dso-card-heading{align-items:center;display:flex;margin-block-end:8px}@media screen and (max-width: 480px){.dso-card-container .dso-card-heading{flex-wrap:wrap}}.heading-anchor{display:flex;gap:4px;color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor dso-icon{flex-shrink:0}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
|
|
9
9
|
const DsoCardStyle0 = cardCss;
|
|
10
10
|
|
|
11
11
|
const Card = class {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"dso-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,OAAO,GAAG,
|
|
1
|
+
{"file":"dso-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,OAAO,GAAG,0mHAA0mH,CAAC;AAC3nH,sBAAe,OAAO;;MCgBT,IAAI;;;;;;;;IAgCf,iBAAiB;QACf,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,MAAMA,iBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAE3E,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;KACjF;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,gBAAgB,0CAAE,UAAU,EAAE,CAAC;QAEpC,OAAO,IAAI,CAAC,gBAAgB,CAAC;KAC9B;IAEO,iBAAiB,CAAC,CAAa;QACrC,IAAI,EAAE,CAAC,CAAC,MAAM,YAAY,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACpD,OAAO;SACR;QAED,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,eAAe,EAAEC,+BAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;KAC1F;IAED,IAAI,wBAAwB;QAC1B,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;KACvD;IAED,IAAI,0BAA0B;QAC5B,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACzD;IAED,MAAM;QACJ,MAAM,YAAY,GAAG,IAAI,CAAC,wBAAwB,KAAK,IAAI,CAAC;QAE5D,QACEC,QAACC,UAAI,sEAAgB,YAAY,IAC/BD,kEAAK,KAAK,EAAC,oBAAoB,IAC7BA,kEAAK,KAAK,EAAC,qBAAqB,EAAC,MAAM,EAAE,CAAC,YAAY,IACpDA,mEAAM,IAAI,EAAC,YAAY,GAAG,CACtB,EACNA,kEAAK,KAAK,EAAC,kBAAkB,IAC1B,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,KACtBA,gEACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAC,gBAAgB,EACtB,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAEzCA,mEAAM,IAAI,EAAC,SAAS,GAAG,EACvBA,uEAAU,IAAI,EAAC,eAAe,GAAY,EAC1CA,mEAAM,KAAK,EAAC,SAAS,8CAA+C,CAClE,CACL;aACE,IAAI,CAAC,IAAI,KAAK,UAAU,KACvBA,gEAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAClFA,mEAAM,IAAI,EAAC,SAAS,GAAG,EACvBA,uEAAU,IAAI,EAAC,UAAU,GAAY,CACnC,CACL,CAAC,KACAA,gEAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAClFA,mEAAM,IAAI,EAAC,SAAS,GAAG,EACvBA,uEAAU,IAAI,EAAC,eAAe,GAAY,CACxC,CACL,EACF,IAAI,CAAC,0BAA0B,KAAK,IAAI,IAAIA,mEAAM,IAAI,EAAC,cAAc,GAAG,CACrE,EACNA,kEAAK,KAAK,EAAC,kBAAkB,IAC3BA,mEAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACF,CACD,EACP;KACH;;;;;;;","names":["forceUpdate","isModifiedEvent","h","Host"],"sources":["src/components/card/card.scss?tag=dso-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/components/card\";\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n:host([is-selectable]:not([is-selectable=\"false\"])) {\r\n .dso-card-container {\r\n display: grid;\r\n grid-template-columns: 1fr minmax(0, 100%);\r\n\r\n .dso-card-heading,\r\n .dso-card-content {\r\n grid-column: 2 /-1;\r\n }\r\n\r\n .dso-card-selectable {\r\n grid-row: span 2;\r\n }\r\n }\r\n}\r\n\r\n:host([active]:not([active=\"false\"])) {\r\n .dso-card-container {\r\n background-color: card.$background-color-active;\r\n }\r\n}\r\n\r\n.dso-card-container {\r\n padding-block: units.$u2;\r\n padding-inline: units.$u2;\r\n inline-size: 100%;\r\n block-size: 100%;\r\n\r\n &:has(.dso-card-heading a:is(:hover, :focus-visible)) {\r\n background-color: card.$background-color-hover;\r\n }\r\n\r\n .dso-card-heading {\r\n align-items: center;\r\n display: flex;\r\n margin-block-end: units.$u1;\r\n\r\n @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n flex-wrap: wrap;\r\n }\r\n }\r\n}\r\n\r\n.heading-anchor {\r\n display: flex;\r\n gap: units.$u1 * 0.5;\r\n\r\n color: card.$heading-anchor-color;\r\n text-decoration: none;\r\n\r\n &:hover {\r\n color: card.$heading-anchor-hover-color;\r\n text-decoration: underline;\r\n }\r\n\r\n &:visited {\r\n color: card.$heading-anchor-color;\r\n }\r\n\r\n dso-icon {\r\n flex-shrink: 0;\r\n }\r\n\r\n .sr-only {\r\n @include utilities.sr-only();\r\n }\r\n}\r\n","import { h, Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, forceUpdate } from \"@stencil/core\";\r\n\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\nimport { CardClickEvent } from \"./card.interfaces\";\r\n\r\n/**\r\n * @slot selectable - An optional slot to place a `Selectable` in.\r\n * @slot heading - A slot to place the title of the card in.\r\n * @slot interactions - An optional slot for one or more `Button`s, `Label`s, `Toggletip`s or `SlideToggle`s.\r\n * @slot content - An optional slot to place `Rich Content` in.\r\n */\r\n@Component({\r\n tag: \"dso-card\",\r\n styleUrl: \"card.scss\",\r\n shadow: true,\r\n})\r\nexport class Card implements ComponentInterface {\r\n @Element()\r\n host!: HTMLDsoCardElement;\r\n\r\n /**\r\n * The URL to which the Card heading links.\r\n */\r\n @Prop({ reflect: true })\r\n href!: string | undefined;\r\n\r\n /**\r\n * Display the link as an external link or a download link\r\n * - \"download\"\r\n * - \"extern\"\r\n */\r\n @Prop({ reflect: true })\r\n mode?: string;\r\n\r\n /**\r\n * Makes the Card active.\r\n */\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /**\r\n * Emitted when the Card heading is clicked.\r\n */\r\n @Event()\r\n dsoCardClick!: EventEmitter<CardClickEvent>;\r\n\r\n private mutationObserver?: MutationObserver;\r\n\r\n connectedCallback(): void {\r\n this.mutationObserver = new MutationObserver(() => forceUpdate(this.host));\r\n\r\n this.mutationObserver.observe(this.host, { attributes: true, childList: true });\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.mutationObserver?.disconnect();\r\n\r\n delete this.mutationObserver;\r\n }\r\n\r\n private clickEventHandler(e: MouseEvent) {\r\n if (!(e.target instanceof HTMLElement) || !this.href) {\r\n return;\r\n }\r\n\r\n return this.dsoCardClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n }\r\n\r\n get selectableSlottedElement() {\r\n return this.host.querySelector(\"[slot='selectable']\");\r\n }\r\n\r\n get interactionsSlottedElement() {\r\n return this.host.querySelector(\"[slot='interactions']\");\r\n }\r\n\r\n render() {\r\n const isSelectable = this.selectableSlottedElement !== null;\r\n\r\n return (\r\n <Host is-selectable={isSelectable}>\r\n <div class=\"dso-card-container\">\r\n <div class=\"dso-card-selectable\" hidden={!isSelectable}>\r\n <slot name=\"selectable\" />\r\n </div>\r\n <div class=\"dso-card-heading\">\r\n {(this.mode === \"extern\" && (\r\n <a\r\n href={this.href}\r\n class=\"heading-anchor\"\r\n target=\"_blank\"\r\n rel=\"noopener noreferrer\"\r\n onClick={(e) => this.clickEventHandler(e)}\r\n >\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"external-link\"></dso-icon>\r\n <span class=\"sr-only\">(Opent andere website in nieuw tabblad)</span>\r\n </a>\r\n )) ||\r\n (this.mode === \"download\" && (\r\n <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"download\"></dso-icon>\r\n </a>\r\n )) || (\r\n <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"chevron-right\"></dso-icon>\r\n </a>\r\n )}\r\n {this.interactionsSlottedElement !== null && <slot name=\"interactions\" />}\r\n </div>\r\n <div class=\"dso-card-content\">\r\n <slot name=\"content\" />\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-848434f1.js');
|
|
6
6
|
const isModifiedEvent = require('./is-modified-event-f643edb2.js');
|
|
7
7
|
|
|
8
|
-
const documentCardCss = "*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px
|
|
8
|
+
const documentCardCss = "*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-document-card-container .dso-document-card-heading{align-items:center;display:flex}@media screen and (max-width: 480px){.dso-document-card-container .dso-document-card-heading{flex-wrap:wrap}}.dso-document-card-container:has(.dso-document-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}:host([active]:not([active=false])) .dso-document-card-container{background-color:#e5e5e5}::slotted([slot=meta]){display:flex !important;justify-content:space-between !important;margin-inline-start:auto !important}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:16px !important}}::slotted([slot=heading]){align-items:center !important;display:flex !important;font-size:1.125em !important;margin-block-end:0 !important;margin-block-start:0 !important}.heading-anchor{display:flex;gap:4px;color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor dso-icon{flex-shrink:0}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}::slotted([slot=type]){--_dt-info-button-margin-inline-start:0;display:flex !important;gap:8px !important}.dso-document-card-heading+.dso-document-card-type,.dso-document-card-heading+.dso-document-card-status,.dso-document-card-type+.dso-document-card-status{margin-block-start:8px}";
|
|
9
9
|
const DsoDocumentCardStyle0 = documentCardCss;
|
|
10
10
|
|
|
11
11
|
const DocumentCard = class {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"dso-document-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,
|
|
1
|
+
{"file":"dso-document-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,skDAAskD,CAAC;AAC/lD,8BAAe,eAAe;;MCgBjB,YAAY;;;;;;;IAwBvB,iBAAiB;QACf,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,MAAMA,iBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAE3E,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;KACjF;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,gBAAgB,0CAAE,UAAU,EAAE,CAAC;QAEpC,OAAO,IAAI,CAAC,gBAAgB,CAAC;KAC9B;IAEO,iBAAiB,CAAC,CAAa;QACrC,IAAI,EAAE,CAAC,CAAC,MAAM,YAAY,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACpD,OAAO;SACR;QAED,OAAO,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,eAAe,EAAEC,+BAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;KAClG;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;KACjD;IAED,MAAM;QACJ,QACEC,kEAAK,KAAK,EAAC,6BAA6B,IACtCA,kEAAK,KAAK,EAAC,2BAA2B,IACpCA,gEAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAClFA,mEAAM,IAAI,EAAC,SAAS,GAAG,EACvBA,uEAAU,IAAI,EAAC,eAAe,GAAY,CACxC,EACH,IAAI,CAAC,kBAAkB,KAAK,IAAI,IAAIA,mEAAM,IAAI,EAAC,MAAM,GAAG,CACrD,EACNA,kEAAK,KAAK,EAAC,wBAAwB,IACjCA,mEAAM,IAAI,EAAC,MAAM,GAAG,CAChB,EACNA,kEAAK,KAAK,EAAC,0BAA0B,IACnCA,mEAAM,IAAI,EAAC,QAAQ,GAAG,CAClB,CACF,EACN;KACH;;;;;;;","names":["forceUpdate","isModifiedEvent","h"],"sources":["src/components/document-card/document-card.scss?tag=dso-document-card&encapsulation=shadow","src/components/document-card/document-card.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/document-card\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n.dso-document-card-container {\r\n padding-block: units.$u2;\r\n padding-inline: units.$u2;\r\n inline-size: 100%;\r\n\r\n .dso-document-card-heading {\r\n align-items: center;\r\n display: flex;\r\n\r\n @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n flex-wrap: wrap;\r\n }\r\n }\r\n\r\n &:has(.dso-document-card-heading a:is(:hover, :focus-visible)) {\r\n background-color: document-card.$background-color-hover;\r\n }\r\n}\r\n\r\n:host([active]:not([active=\"false\"])) {\r\n .dso-document-card-container {\r\n background-color: document-card.$background-color-active;\r\n }\r\n}\r\n\r\n::slotted([slot=\"meta\"]) {\r\n display: flex !important;\r\n justify-content: space-between !important;\r\n margin-inline-start: auto !important;\r\n\r\n @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n flex-basis: 100% !important;\r\n margin-block-start: units.$u2 !important;\r\n }\r\n}\r\n\r\n::slotted([slot=\"heading\"]) {\r\n align-items: center !important;\r\n display: flex !important;\r\n font-size: 1.125em !important;\r\n margin-block-end: 0 !important;\r\n margin-block-start: 0 !important;\r\n}\r\n\r\n.heading-anchor {\r\n display: flex;\r\n gap: units.$u1 * 0.5;\r\n\r\n color: document-card.$heading-anchor-color;\r\n text-decoration: none;\r\n\r\n &:hover {\r\n color: document-card.$heading-anchor-hover-color;\r\n text-decoration: underline;\r\n }\r\n\r\n &:visited {\r\n color: document-card.$heading-anchor-color;\r\n }\r\n\r\n dso-icon {\r\n flex-shrink: 0;\r\n }\r\n\r\n .sr-only {\r\n @include utilities.sr-only();\r\n }\r\n}\r\n\r\n::slotted([slot=\"type\"]) {\r\n --_dt-info-button-margin-inline-start: 0;\r\n\r\n display: flex !important;\r\n gap: units.$u1 !important;\r\n}\r\n\r\n.dso-document-card-heading + .dso-document-card-type,\r\n.dso-document-card-heading + .dso-document-card-status,\r\n.dso-document-card-type + .dso-document-card-status {\r\n margin-block-start: units.$u1;\r\n}\r\n","import { h, Component, ComponentInterface, Element, Event, EventEmitter, Prop, forceUpdate } from \"@stencil/core\";\r\n\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\nimport { DocumentCardClickEvent } from \"./document-card.interfaces\";\r\n\r\n/**\r\n * @slot heading - A slot to place the title of the card in.\r\n * @slot meta - An optional slot to place a `Label` in.\r\n * @slot type - A slot to hold type of document with an optional `Toggletip`.\r\n * @slot status - A slot to hold some status information on the document.\r\n */\r\n@Component({\r\n tag: \"dso-document-card\",\r\n styleUrl: \"document-card.scss\",\r\n shadow: true,\r\n})\r\nexport class DocumentCard implements ComponentInterface {\r\n @Element()\r\n host!: HTMLDsoDocumentCardElement;\r\n\r\n /**\r\n * The URL to which the DocumentCard heading links.\r\n */\r\n @Prop({ reflect: true })\r\n href!: string | undefined;\r\n\r\n /**\r\n * Makes the DocumentCard active.\r\n */\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /**\r\n * Emitted when the DocumentCard heading is clicked.\r\n */\r\n @Event()\r\n dsoDocumentCardClick!: EventEmitter<DocumentCardClickEvent>;\r\n\r\n private mutationObserver?: MutationObserver;\r\n\r\n connectedCallback(): void {\r\n this.mutationObserver = new MutationObserver(() => forceUpdate(this.host));\r\n\r\n this.mutationObserver.observe(this.host, { attributes: true, childList: true });\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.mutationObserver?.disconnect();\r\n\r\n delete this.mutationObserver;\r\n }\r\n\r\n private clickEventHandler(e: MouseEvent) {\r\n if (!(e.target instanceof HTMLElement) || !this.href) {\r\n return;\r\n }\r\n\r\n return this.dsoDocumentCardClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n }\r\n\r\n get metaSlottedElement() {\r\n return this.host.querySelector(\"[slot='meta']\");\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"dso-document-card-container\">\r\n <div class=\"dso-document-card-heading\">\r\n <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"chevron-right\"></dso-icon>\r\n </a>\r\n {this.metaSlottedElement !== null && <slot name=\"meta\" />}\r\n </div>\r\n <div class=\"dso-document-card-type\">\r\n <slot name=\"type\" />\r\n </div>\r\n <div class=\"dso-document-card-status\">\r\n <slot name=\"status\" />\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-848434f1.js');
|
|
6
6
|
const clsx = require('./clsx-fc789adc.js');
|
|
7
|
-
const index$1 = require('./index-
|
|
7
|
+
const index$1 = require('./index-a49786b9.js');
|
|
8
8
|
const isModifiedEvent = require('./is-modified-event-f643edb2.js');
|
|
9
9
|
|
|
10
10
|
const headerCss = ".sc-dso-header-h{display:block}.dso-header.sc-dso-header{border-block-end:1px solid #ccc;display:flex;flex-wrap:wrap;position:relative}@media screen and (min-width: 768px){.dso-header.sc-dso-header{align-items:center}}@media screen and (max-width: 991px){.dso-header.use-drop-down.sc-dso-header{flex-wrap:nowrap}}.dso-header.sc-dso-header .dso-nav.sc-dso-header{border:0}.logo-container.sc-dso-header{flex:1 1 12.5rem;margin-inline-end:24px;padding-block-end:16px;padding-block-start:16px}.dso-header-session.sc-dso-header{display:flex;align-items:center;margin-inline-start:auto}.dso-header-session.sc-dso-header .profile.sc-dso-header .dso-tertiary.sc-dso-header,.dso-header-session.sc-dso-header .login.sc-dso-header .dso-tertiary.sc-dso-header,.dso-header-session.sc-dso-header .logout.sc-dso-header .dso-tertiary.sc-dso-header,.dso-header-session.sc-dso-header .help.sc-dso-header .dso-tertiary.sc-dso-header{cursor:pointer;font-family:Asap, sans-serif;font-weight:600;line-height:1.5}.dso-header-session.sc-dso-header .profile.sc-dso-header{margin-inline-start:8px}.dso-header-session.sc-dso-header .profile.sc-dso-header+.logout.sc-dso-header,.dso-header-session.sc-dso-header .profile.sc-dso-header~.help.sc-dso-header{border-inline-start:3px solid #ccc;margin-inline-start:8px;padding-inline-start:8px}.dso-header-session.sc-dso-header .help.sc-dso-header a.sc-dso-header,.dso-header-session.sc-dso-header .help.sc-dso-header button.sc-dso-header{display:flex}.dso-navbar.sc-dso-header{flex-basis:100%}.dso-navbar.sc-dso-header .dso-dropdown-options.sc-dso-header{border-block-start:1px solid #ccc}dso-dropdown-menu.sc-dso-header button.sc-dso-header{align-items:center;background-color:transparent;border:0;display:flex;font-family:Asap, sans-serif;padding-inline-end:32px}dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header{border:0;border-radius:0}@media screen and (min-width: 768px){dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header{inline-size:375px}}@media screen and (max-width: 767px){dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header{inline-size:100%}}dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.sc-dso-header a.sc-dso-header,dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.sc-dso-header button.sc-dso-header{color:#275937;font-size:1.25rem;padding:16px;white-space:pre-wrap}dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.sc-dso-header a.sc-dso-header:focus,dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.sc-dso-header button.sc-dso-header:focus{color:#fff}dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.sc-dso-header a.sc-dso-header:hover,dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.sc-dso-header button.sc-dso-header:hover{background-color:#fff;color:#275937;text-decoration:underline}dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.dso-active.sc-dso-header a.sc-dso-header{font-weight:600}dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header ul.sc-dso-header li.sc-dso-header+li.sc-dso-header{border-block-start:1px solid #ccc}.dropdown.sc-dso-header{margin-inline-start:auto;display:flex;align-items:center}.dropdown.sc-dso-header dso-dropdown-menu.sc-dso-header{position:static}.dropdown.sc-dso-header dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header{inset-inline-end:0;inset-block-start:100%}.dropdown.sc-dso-header dso-dropdown-menu.sc-dso-header>button.sc-dso-header{color:#39870c;font-size:16px;font-weight:600;line-height:normal;position:relative}.dropdown.sc-dso-header dso-dropdown-menu.sc-dso-header>button.sc-dso-header::after{margin-inline-start:8px;position:absolute;inset-inline-end:0px;inset-block-start:50%;transform:translateY(-50%)}.dropdown.sc-dso-header dso-dropdown-menu.sc-dso-header>button.sc-dso-header:hover,.dropdown.sc-dso-header dso-dropdown-menu.sc-dso-header>button.sc-dso-header:active{cursor:pointer;text-decoration:underline}.dso-nav.sc-dso-header{align-items:end;column-gap:32px;display:flex;list-style:none;margin-block-end:0;margin-block-start:0;padding-inline-start:0}.dso-nav.sc-dso-header>li.sc-dso-header{margin-block-end:4px}.dso-nav.sc-dso-header>li.sc-dso-header>a.sc-dso-header{display:block}.dso-nav.sc-dso-header>li.sc-dso-header>a.sc-dso-header,.dso-nav.sc-dso-header>li.sc-dso-header>a.sc-dso-header:hover,.dso-nav.sc-dso-header>li.sc-dso-header>a.sc-dso-header:focus,.dso-nav.sc-dso-header>li.sc-dso-header>a.sc-dso-header:visited{color:#275937}.dso-nav.sc-dso-header>li.dso-active.sc-dso-header,.dso-nav.sc-dso-header>li.is-active.sc-dso-header{margin-block-end:0}.dso-nav.sc-dso-header>li.dso-active.sc-dso-header>a.sc-dso-header,.dso-nav.sc-dso-header>li.is-active.sc-dso-header>a.sc-dso-header{border-block-end:4px solid #8b4a6a;font-weight:bold}.dso-nav.dso-nav-main.sc-dso-header{display:flex !important}.dso-nav.dso-nav-main.sc-dso-header>li.sc-dso-header>a.sc-dso-header{text-decoration:none;font-size:1.25em;line-height:1;margin-block-start:8px;padding-block:16px;padding-inline:0;white-space:nowrap}.dso-nav.dso-nav-main.sc-dso-header>li.sc-dso-header>a.sc-dso-header:hover,.dso-nav.dso-nav-main.sc-dso-header>li.sc-dso-header>a.sc-dso-header:focus-visible,.dso-nav.dso-nav-main.sc-dso-header>li.sc-dso-header>a.sc-dso-header:active{text-decoration:underline}.dso-nav.dso-nav-main.sc-dso-header dso-dropdown-menu.sc-dso-header .dso-dropdown-options.sc-dso-header{inset-inline-start:-1rem !important;inset-block-start:3px !important}.dso-nav.dso-nav-main.sc-dso-header dso-dropdown-menu.sc-dso-header button.sc-dso-header{font-size:1.25em;line-height:1;margin-block-start:8px;padding-block:16px;padding-inline:0;align-items:center;color:#275937;padding-inline-end:32px}.dso-nav.dso-nav-main.sc-dso-header dso-dropdown-menu.sc-dso-header button.sc-dso-header:hover,.dso-nav.dso-nav-main.sc-dso-header dso-dropdown-menu.sc-dso-header button.sc-dso-header:active{cursor:pointer;text-decoration:underline}.dso-nav.dso-nav-main.sc-dso-header dso-dropdown-menu.sc-dso-header button.sc-dso-header::after{margin-inline-start:8px;position:absolute;inset-inline-end:0px;inset-block-start:auto;transform:none}.dso-nav.sc-dso-header .menu-user-home.sc-dso-header{margin-inline-start:auto}.dso-nav.sc-dso-header .menu-user-home.sc-dso-header dso-icon.sc-dso-header{block-size:1em;margin-inline-end:8px;position:relative;inset-block-start:-2px;inline-size:1.2em}";
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index$1 = require('./index-848434f1.js');
|
|
6
6
|
const clsx = require('./clsx-fc789adc.js');
|
|
7
|
-
const index = require('./index-
|
|
7
|
+
const index = require('./index-a49786b9.js');
|
|
8
8
|
const hasOverflow = require('./has-overflow-2fb1d618.js');
|
|
9
9
|
|
|
10
10
|
const labelCss = ":host{display:inline-block;max-inline-size:100%}*,*::after,*::before{box-sizing:border-box}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.dso-label{border-radius:4px;display:inline-block;line-height:1.5;max-inline-size:100%;padding-block:4px;padding-inline:8px}.dso-label:focus-within,.dso-label.dso-hover{text-decoration:line-through}.dso-label button{background:none;border:0;border-radius:0 4px 4px 0;color:inherit;float:inline-end;font-size:1rem;margin-block-end:-4px;margin-inline-start:8px;margin-inline-end:-4px;margin-block-start:0;padding:0}.dso-label button:hover{cursor:pointer}.dso-label button>dso-icon,.dso-label button>svg.di{display:block}.dso-label{background-color:#f2f2f2;border-color:#f2f2f2;color:#191919}.dso-label.dso-label-info{background-color:#6ca4d9;border-color:#6ca4d9;color:#191919}.dso-label.dso-label-primary{background-color:#275937;border-color:#275937;color:#fff}.dso-label.dso-label-success{background-color:#39870c;border-color:#39870c;color:#fff}.dso-label.dso-label-warning{background-color:#dcd400;border-color:#dcd400;color:#191919}.dso-label.dso-label-danger{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-label.dso-label-error{background-color:#ce3f51;border-color:#ce3f51;color:#fff}.dso-label.dso-label-bright{background-color:#fff;border-color:#fff;color:#191919}.dso-label.dso-label-bright{outline:1px solid #ccc;outline-offset:-1px}.dso-label.dso-label-attention{background-color:#8b4a6a;border-color:#8b4a6a;color:#fff}.dso-label.dso-compact{padding-block:0;padding-inline:8px}.dso-label.dso-hover .dso-label-content{text-decoration:line-through}.dso-truncate.dso-label-content{display:inline-block;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap}:host([removable]) .dso-truncate.dso-label-content{max-inline-size:calc(100% - 28px)}";
|
|
@@ -6,7 +6,7 @@ const index = require('./index-848434f1.js');
|
|
|
6
6
|
const getActiveElement = require('./get-active-element-05f06ef1.js');
|
|
7
7
|
const v4 = require('./v4-7014b8b0.js');
|
|
8
8
|
|
|
9
|
-
const modalCss = "@keyframes ModalFadeIn{0%{opacity:0}100%{opacity:1}}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([fullscreen]) dialog{inline-size:100dvi;block-size:100dvb}:host([fullscreen]) dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host([fullscreen]) dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host([fullscreen]) dialog .dso-footer{flex-shrink:0}@media screen and (max-width: 480px){:host dialog{inline-size:100dvi;block-size:100dvb}:host dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host dialog .dso-footer{flex-shrink:0}}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}button{-webkit-appearance:button;color:inherit;cursor:pointer;font:inherit;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;overflow:visible;text-transform:none}button[disabled]{cursor:default}button::-moz-focus-inner{border:0;padding:0}.dso-modal{overflow:visible;padding:0;border:0}.dso-modal::backdrop{background-color:rgba(255, 255, 255, 0.8)}.dso-modal .dso-dialog{inline-size:640px;background-color:#fff;opacity:1;box-shadow:0 8px 24px 0 rgba(25, 25, 25, 0.4);animation:200ms ease-out 0s 1 ModalFadeIn}.dso-modal .dso-header{position:relative;padding:16px;border-block-end:1px solid #ccc}.dso-modal .dso-header h2{max-inline-size:calc(100% - 24px);margin:0;color:#275937}.dso-modal .dso-header .dso-close{position:absolute;inset-block-start:16px;inset-inline-end:13px;block-size:32px;inline-size:32px;padding:0;background-color:transparent;border:0;text-align:center}.dso-modal>.dso-dialog>.dso-body p{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>.dso-body ul,.dso-modal>.dso-dialog>.dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>.dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>.dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>.dso-body ul ul,.dso-modal>.dso-dialog>.dso-body ul ol,.dso-modal>.dso-dialog>.dso-body ol ul,.dso-modal>.dso-dialog>.dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>.dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>.dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>.dso-body dso-highlight-box,.dso-modal>.dso-dialog>.dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>.dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>.dso-body{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:1.5rem;overflow-x:auto;padding:32px}.dso-modal>.dso-dialog>dso-scrollable{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:6.5rem}.dso-modal>.dso-dialog>dso-scrollable .dso-body p{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>dso-scrollable .dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ol,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body dso-highlight-box,.dso-modal>.dso-dialog>dso-scrollable .dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>dso-scrollable .dso-body{padding:32px}.dso-modal .dso-body:focus-visible{outline:none}@media screen and (max-width: 767px){.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}.dso-modal .dso-footer{min-block-size:80px;padding-block:16px;padding-inline:32px;text-align:end}@media screen and (min-width: 768px){.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary{margin-inline-start:16px}.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}}@media screen and (max-width: 767px){.dso-modal .dso-dialog{max-inline-size:100%;margin-block-start:0}.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}@media screen and (max-height: 380px){.dso-modal .dso-dialog{min-block-size:216px;margin-block-start:8px;margin-block-end:8px}.dso-modal .dso-header{padding-block:8px;padding-inline:16px}.dso-modal .dso-header .dso-close{inset-block-start:8px}.dso-modal .dso-body{padding-block:16px;padding-inline:24px}.dso-modal .dso-footer{min-block-size:auto;overflow:auto;padding-block:8px;padding-inline:32px}}.dso-close dso-icon{color:#39870c}";
|
|
9
|
+
const modalCss = "@keyframes ModalFadeIn{0%{opacity:0}100%{opacity:1}}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([fullscreen]) dialog{inline-size:100dvi;block-size:100dvb}:host([fullscreen]) dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host([fullscreen]) dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host([fullscreen]) dialog .dso-footer{flex-shrink:0}@media screen and (max-width: 480px){:host dialog{inline-size:100dvi;block-size:100dvb}:host dialog .dso-dialog{display:flex;flex-direction:column;inline-size:100%;block-size:100%}:host dialog .dso-dialog>dso-scrollable{flex-grow:1;max-block-size:unset}:host dialog .dso-footer{flex-shrink:0}}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}button{-webkit-appearance:button;color:inherit;cursor:pointer;font:inherit;font-family:inherit;font-size:inherit;line-height:inherit;margin:0;overflow:visible;text-transform:none}button[disabled]{cursor:default}button::-moz-focus-inner{border:0;padding:0}.dso-modal{overflow:visible;padding:0;border:0}.dso-modal::backdrop{background-color:rgba(255, 255, 255, 0.8)}.dso-modal .dso-dialog{inline-size:640px;background-color:#fff;opacity:1;box-shadow:0 8px 24px 0 rgba(25, 25, 25, 0.4);animation:200ms ease-out 0s 1 ModalFadeIn}.dso-modal .dso-header{position:relative;padding:16px;border-block-end:1px solid #ccc}.dso-modal .dso-header h2{max-inline-size:calc(100% - 24px);margin:0;color:#275937}.dso-modal .dso-header .dso-close{position:absolute;inset-block-start:16px;inset-inline-end:13px;block-size:32px;inline-size:32px;padding:0;background-color:transparent;border:0;text-align:center}.dso-modal>.dso-dialog>.dso-body p{margin-block:0 var(--_dt-rich-content-margin-block, 16px);margin-inline:0}.dso-modal>.dso-dialog>.dso-body ul,.dso-modal>.dso-dialog>.dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>.dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>.dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>.dso-body ul ul,.dso-modal>.dso-dialog>.dso-body ul ol,.dso-modal>.dso-dialog>.dso-body ol ul,.dso-modal>.dso-dialog>.dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>.dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>.dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>.dso-body dso-highlight-box,.dso-modal>.dso-dialog>.dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>.dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>.dso-body{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:1.5rem;overflow-x:auto;padding:32px}.dso-modal>.dso-dialog>dso-scrollable{block-size:calc(100% - 96px - 1.5rem);max-block-size:calc(70vh - 144px - 1.5em);min-block-size:6.5rem}.dso-modal>.dso-dialog>dso-scrollable .dso-body p{margin-block:0 var(--_dt-rich-content-margin-block, 16px);margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol{margin-block-end:16px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul:not(.list-group):not(.dso-link-list):not(.dso-columns-list),.dso-modal>.dso-dialog>dso-scrollable .dso-body ol:not(.list-group):not(.dso-link-list):not(.dso-columns-list){padding-inline-start:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ul ol,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ul,.dso-modal>.dso-dialog>dso-scrollable .dso-body ol ol{margin-block-end:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body pre{margin-block:0 16px;margin-inline:0}.dso-modal>.dso-dialog>dso-scrollable .dso-body blockquote{padding-block:16px;padding-inline:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body dso-highlight-box,.dso-modal>.dso-dialog>dso-scrollable .dso-body .dso-highlight-box{margin-block-end:24px}.dso-modal>.dso-dialog>dso-scrollable .dso-body img{block-size:auto;max-inline-size:100%}.dso-modal>.dso-dialog>dso-scrollable .dso-body{padding:32px}.dso-modal .dso-body:focus-visible{outline:none}@media screen and (max-width: 767px){.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}.dso-modal .dso-footer{min-block-size:80px;padding-block:16px;padding-inline:32px;text-align:end}@media screen and (min-width: 768px){.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary{margin-inline-start:16px}.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}}@media screen and (max-width: 767px){.dso-modal .dso-dialog{max-inline-size:100%;margin-block-start:0}.dso-modal .dso-footer .dso-primary+.dso-primary,.dso-modal .dso-footer .dso-primary+.dso-secondary,.dso-modal .dso-footer .dso-primary+.dso-tertiary,.dso-modal .dso-footer .dso-secondary+.dso-primary,.dso-modal .dso-footer .dso-secondary+.dso-secondary,.dso-modal .dso-footer .dso-secondary+.dso-tertiary,.dso-modal .dso-footer .dso-tertiary+.dso-primary,.dso-modal .dso-footer .dso-tertiary+.dso-secondary,.dso-modal .dso-footer .dso-tertiary+.dso-tertiary{margin-inline-start:0}.dso-modal .dso-footer button{inline-size:100%;text-align:center}.dso-modal .dso-footer button+button{margin-block-start:8px}.dso-modal .dso-footer button.dso-tertiary,.dso-modal .dso-footer button.dso-tertiary span{float:none}}@media screen and (max-height: 380px){.dso-modal .dso-dialog{min-block-size:216px;margin-block-start:8px;margin-block-end:8px}.dso-modal .dso-header{padding-block:8px;padding-inline:16px}.dso-modal .dso-header .dso-close{inset-block-start:8px}.dso-modal .dso-body{padding-block:16px;padding-inline:24px}.dso-modal .dso-footer{min-block-size:auto;overflow:auto;padding-block:8px;padding-inline:32px}}.dso-close dso-icon{color:#39870c}";
|
|
10
10
|
const DsoModalStyle0 = modalCss;
|
|
11
11
|
|
|
12
12
|
const Modal = class {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"dso-modal.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,QAAQ,GAAG,
|
|
1
|
+
{"file":"dso-modal.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,QAAQ,GAAG,ylNAAylN,CAAC;AAC3mN,uBAAe,QAAQ;;MCUV,KAAK;;;;sBAOPA,KAAE,EAAE;;;oBAmBS,QAAQ;2BAUiB,SAAS;+BAQtC,IAAI;;IAUtB,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;KAC5D;IAED,gBAAgB;;QACd,IAAI,MAAA,IAAI,CAAC,iBAAiB,0CAAE,WAAW,EAAE;YACvC,MAAM,aAAa,GAAGC,iCAAgB,EAAE,CAAC;YACzC,IAAI,aAAa,YAAY,WAAW,EAAE;gBACxC,IAAI,CAAC,kBAAkB,GAAG,aAAa,CAAC;aACzC;YAED,IAAI,CAAC,iBAAiB,CAAC,SAAS,EAAE,CAAC;SACpC;KACF;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,iBAAiB,0CAAE,KAAK,EAAE,CAAC;QAEhC,IAAI,IAAI,CAAC,WAAW,KAAK,KAAK,EAAE;YAC9B,OAAO;SACR;QAED,OAAC,MAAA,IAAI,CAAC,WAAW,mCAAI,IAAI,CAAC,kBAAkB,CAAC,0CAAE,KAAK,EAAE,CAAC;KACxD;IAED,MAAM;;QACJ,QACEC,qEACE,KAAK,EAAC,WAAW,EACjB,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,mCAAI,SAAS,gBACjB,MAAM,qBACA,IAAI,CAAC,MAAM,EAC5B,GAAG,EAAE,CAAC,OAAO,MAAM,IAAI,CAAC,iBAAiB,GAAG,OAAO,CAAC,EACpD,QAAQ,EAAE,CAAC,CAAC;gBACV,CAAC,CAAC,cAAc,EAAE,CAAC;gBAEnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,CAAC;aAC1C,IAEDA,kEAAK,KAAK,EAAC,YAAY,EAAC,IAAI,EAAC,UAAU,IACpC,IAAI,CAAC,UAAU,IACdA,iBAAK,KAAK,EAAC,YAAY,IACrBA,gBAAI,EAAE,EAAE,IAAI,CAAC,MAAM,IAAG,IAAI,CAAC,UAAU,CAAM,EAC1C,IAAI,CAAC,eAAe,KACnBA,oBAAQ,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,WAAW,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,CAAC,IAC9FA,sBAAU,IAAI,EAAC,OAAO,GAAY,EAClCA,kBAAM,KAAK,EAAC,SAAS,cAAe,CAC7B,CACV,CACG,KAENA,kBAAM,KAAK,EAAC,SAAS,EAAC,EAAE,EAAE,IAAI,CAAC,MAAM,cAE9B,CACR,EAEDA,+EACEA,kEAAK,KAAK,EAAC,UAAU,EAAC,QAAQ,EAAE,CAAC,IAC/BA,mEAAM,IAAI,EAAC,MAAM,GAAG,CAChB,CACS,EAEhB,IAAI,CAAC,SAAS,KACbA,kEAAK,KAAK,EAAC,YAAY,IACrBA,mEAAM,IAAI,EAAC,QAAQ,GAAG,CAClB,CACP,CACG,CACC,EACT;KACH;;;;;;;","names":["v4","getActiveElement","h"],"sources":["src/components/modal/modal.scss?tag=dso-modal&encapsulation=shadow","src/components/modal/modal.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/components/button\";\r\n@use \"~dso-toolkit/src/components/modal\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n// fullscreen option\r\n:host([fullscreen]) dialog {\r\n @include modal.fullscreen();\r\n}\r\n\r\n// Go to fullscreen on =< 480px viewport\r\n@media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n :host dialog {\r\n @include modal.fullscreen();\r\n }\r\n}\r\n\r\n.sr-only {\r\n @include utilities.sr-only();\r\n}\r\n\r\nbutton {\r\n @include button.element();\r\n}\r\n\r\n.dso-modal {\r\n @include modal.root();\r\n}\r\n\r\n.dso-close {\r\n dso-icon {\r\n color: modal.$close-icon-color;\r\n }\r\n}\r\n","import { h, Component, ComponentInterface, Element, Event, EventEmitter, Prop, State } from \"@stencil/core\";\r\nimport { v4 } from \"uuid\";\r\n\r\nimport { ModalCloseEvent } from \"./modal.interfaces\";\r\nimport { getActiveElement } from \"../../utils/get-active-element\";\r\n\r\n@Component({\r\n tag: \"dso-modal\",\r\n styleUrl: \"modal.scss\",\r\n shadow: true,\r\n})\r\nexport class Modal implements ComponentInterface {\r\n private htmlDialogElement?: HTMLDialogElement;\r\n\r\n @Element()\r\n host!: HTMLDsoModalElement;\r\n\r\n @State()\r\n ariaId = v4();\r\n\r\n /**\r\n * when set the modal will be shown in fullscreen.\r\n */\r\n @Prop({ reflect: true })\r\n fullscreen?: boolean;\r\n\r\n /**\r\n * The title of the Modal.\r\n */\r\n @Prop()\r\n modalTitle?: string;\r\n\r\n /**\r\n * the role for the modal `dialog` | `alert` | `alertdialog`.\r\n */\r\n @Prop()\r\n // eslint-disable-next-line @stencil-community/reserved-member-names\r\n role: string | null = \"dialog\";\r\n\r\n /**\r\n * The element to return focus to after the modal is closed.\r\n *\r\n * * `undefined` will return focus to the previously focused element (default).\r\n * * `false` will not return focus to any element.\r\n * * or, provide your own `HTMLElement` that will receive focus upon closing.\r\n */\r\n @Prop()\r\n returnFocus: false | HTMLElement | undefined = undefined;\r\n\r\n /**\r\n * when `false` the close button in the header will not be rendered. Defaults to `true`.\r\n *\r\n * Needs `modalTitle` to be set.\r\n */\r\n @Prop()\r\n showCloseButton = true;\r\n\r\n private returnFocusElement: HTMLElement | undefined;\r\n\r\n /**\r\n * Emitted when the user wants to close the Modal.\r\n */\r\n @Event()\r\n dsoClose!: EventEmitter<ModalCloseEvent>;\r\n\r\n get hasFooter() {\r\n return this.host.querySelector(\"[slot='footer']\") !== null;\r\n }\r\n\r\n componentDidLoad(): void {\r\n if (this.htmlDialogElement?.isConnected) {\r\n const activeElement = getActiveElement();\r\n if (activeElement instanceof HTMLElement) {\r\n this.returnFocusElement = activeElement;\r\n }\r\n\r\n this.htmlDialogElement.showModal();\r\n }\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.htmlDialogElement?.close();\r\n\r\n if (this.returnFocus === false) {\r\n return;\r\n }\r\n\r\n (this.returnFocus ?? this.returnFocusElement)?.focus();\r\n }\r\n\r\n render() {\r\n return (\r\n <dialog\r\n class=\"dso-modal\"\r\n role={this.role ?? undefined}\r\n aria-modal=\"true\"\r\n aria-labelledby={this.ariaId}\r\n ref={(element) => (this.htmlDialogElement = element)}\r\n onCancel={(e) => {\r\n e.preventDefault();\r\n\r\n this.dsoClose.emit({ originalEvent: e });\r\n }}\r\n >\r\n <div class=\"dso-dialog\" role=\"document\">\r\n {this.modalTitle ? (\r\n <div class=\"dso-header\">\r\n <h2 id={this.ariaId}>{this.modalTitle}</h2>\r\n {this.showCloseButton && (\r\n <button type=\"button\" class=\"dso-close\" onClick={(e) => this.dsoClose.emit({ originalEvent: e })}>\r\n <dso-icon icon=\"times\"></dso-icon>\r\n <span class=\"sr-only\">Sluiten</span>\r\n </button>\r\n )}\r\n </div>\r\n ) : (\r\n <span class=\"sr-only\" id={this.ariaId}>\r\n Dialoog\r\n </span>\r\n )}\r\n\r\n <dso-scrollable>\r\n <div class=\"dso-body\" tabIndex={0}>\r\n <slot name=\"body\" />\r\n </div>\r\n </dso-scrollable>\r\n\r\n {this.hasFooter && (\r\n <div class=\"dso-footer\">\r\n <slot name=\"footer\" />\r\n </div>\r\n )}\r\n </div>\r\n </dialog>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-848434f1.js');
|
|
6
6
|
const isModifiedEvent = require('./is-modified-event-f643edb2.js');
|
|
7
7
|
|
|
8
|
-
const plekinfoCardCss = "ins{text-decoration:none}ins{--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919}ins a:is(.download,.download:hover,.download:focus-visible){background-image:url(\"./dso-icons.svg#img-download-zwart\")}ins a:is(.extern,.extern:hover,.extern:focus-visible){background-image:url(\"./dso-icons.svg#img-external-link-zwart\")}ins a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-call-zwart\")}ins a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-email-zwart\")}ins{box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}del{--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919}del a:is(.download,.download:hover,.download:focus-visible){background-image:url(\"./dso-icons.svg#img-download-zwart\")}del a:is(.extern,.extern:hover,.extern:focus-visible){background-image:url(\"./dso-icons.svg#img-external-link-zwart\")}del a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-call-zwart\")}del a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-email-zwart\")}del{text-decoration:line-through}*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-plekinfo-card-container{padding-block:16px
|
|
8
|
+
const plekinfoCardCss = "ins{text-decoration:none}ins{--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#e4f1d4;border-color:#e4f1d4;color:#191919}ins a:is(.download,.download:hover,.download:focus-visible){background-image:url(\"./dso-icons.svg#img-download-zwart\")}ins a:is(.extern,.extern:hover,.extern:focus-visible){background-image:url(\"./dso-icons.svg#img-external-link-zwart\")}ins a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-call-zwart\")}ins a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-email-zwart\")}ins{box-shadow:0 1px 3px 1px rgba(0, 0, 0, 0.25)}del{--link-color:currentColor;--link-hover-color:currentColor;--link-visited-color:currentColor;background-color:#f5d8dc;border-color:#f5d8dc;color:#191919}del a:is(.download,.download:hover,.download:focus-visible){background-image:url(\"./dso-icons.svg#img-download-zwart\")}del a:is(.extern,.extern:hover,.extern:focus-visible){background-image:url(\"./dso-icons.svg#img-external-link-zwart\")}del a:is([href^=\"tel:\"],[href^=\"tel:\"]:hover,[href^=\"tel:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-call-zwart\")}del a:is([href^=\"mailto:\"],[href^=\"mailto:\"]:hover,[href^=\"mailto:\"]:focus-visible){background-image:url(\"./dso-icons.svg#img-email-zwart\")}del{text-decoration:line-through}*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-plekinfo-card-container{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-plekinfo-card-container .dso-plekinfo-card-heading{align-items:center;display:flex}@media screen and (max-width: 480px){.dso-plekinfo-card-container .dso-plekinfo-card-heading{flex-wrap:wrap}}.dso-plekinfo-card-container .dso-plekinfo-card-heading+.dso-plekinfo-card-content{margin-block-start:8px}.dso-plekinfo-card-container .dso-plekinfo-card-symbol{grid-row:span 2;margin-inline-end:8px}.dso-plekinfo-card-container:has(.dso-plekinfo-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}ins.dso-plekinfo-card-container:has(.dso-plekinfo-card-heading a:is(:hover,:focus-visible)){background-color:#d8e5c9}del.dso-plekinfo-card-container:has(.dso-plekinfo-card-heading a:is(:hover,:focus-visible)){background-color:#e9cdd1}:host([active]:not([active=false])) .dso-plekinfo-card-container{background-color:#e5e5e5}:host([active]:not([active=false])) ins.dso-plekinfo-card-container{background-color:#ced9bf}:host([active]:not([active=false])) del.dso-plekinfo-card-container{background-color:#ddc3c6}:host([has-symbol]) .dso-plekinfo-card-container{display:grid;grid-template-columns:1fr minmax(0, 100%)}:host([has-symbol]) .dso-plekinfo-card-container .dso-plekinfo-card-heading,:host([has-symbol]) .dso-plekinfo-card-container .dso-plekinfo-card-content{grid-column:2/-1}::slotted([slot=meta]){display:flex !important;justify-content:space-between !important;margin-inline-start:auto !important}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:16px !important}}::slotted([slot=heading]){align-items:center !important;display:flex !important;font-size:1.125em !important;margin-block-end:0 !important;margin-block-start:0 !important}::slotted([slot=content]){--_dt-rich-content-margin-block:8px;--_dt-rich-content-margin-block-end:0;--_dt-rich-content-margin-block-start:0}.heading-anchor{display:flex;gap:4px;color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor dso-icon{flex-shrink:0}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
|
|
9
9
|
const DsoPlekinfoCardStyle0 = plekinfoCardCss;
|
|
10
10
|
|
|
11
11
|
const WrapWijzigactie = ({ wijzigactie }, children) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"dso-plekinfo-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,
|
|
1
|
+
{"file":"dso-plekinfo-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,ovHAAovH,CAAC;AAC7wH,8BAAe,eAAe;;ACoB9B,MAAM,eAAe,GAA8C,CAAC,EAAE,WAAW,EAAE,EAAE,QAAQ;IAC3F,IAAI,WAAW,KAAK,SAAS,EAAE;QAC7B,OAAOA,iBAAK,KAAK,EAAC,6BAA6B,IAAE,QAAQ,CAAO,CAAC;KAClE;IAED,IAAI,WAAW,KAAK,WAAW,EAAE;QAC/B,OAAOA,iBAAK,KAAK,EAAC,6BAA6B,IAAE,QAAQ,CAAO,CAAC;KAClE;IAED,OAAOA,iBAAK,KAAK,EAAC,6BAA6B,IAAE,QAAQ,CAAO,CAAC;AACnE,CAAC,CAAC;MAaW,YAAY;;;;;;;;IA8BvB,iBAAiB;QACf,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,MAAMC,iBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAE3E,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;KACjF;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,gBAAgB,0CAAE,UAAU,EAAE,CAAC;QAEpC,OAAO,IAAI,CAAC,gBAAgB,CAAC;KAC9B;IAEO,iBAAiB,CAAC,CAAa;QACrC,IAAI,EAAE,CAAC,CAAC,MAAM,YAAY,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACpD,OAAO;SACR;QAED,OAAO,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,eAAe,EAAEC,+BAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;KAClG;IAED,IAAI,oBAAoB;QACtB,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;KACnD;IAED,IAAI,kBAAkB;QACpB,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;KACjD;IAED,MAAM;QACJ,MAAM,SAAS,GAAG,IAAI,CAAC,oBAAoB,KAAK,IAAI,CAAC;QAErD,QACEF,QAACG,UAAI,mEAAa,SAAS,IACzBH,QAAC,eAAe,qDAAC,WAAW,EAAE,IAAI,CAAC,WAAW,IAC5CA,kEAAK,KAAK,EAAC,0BAA0B,EAAC,MAAM,EAAE,CAAC,SAAS,IACtDA,mEAAM,IAAI,EAAC,QAAQ,GAAG,CAClB,EACNA,kEAAK,KAAK,EAAC,2BAA2B,IACpCA,gEAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAClFA,mEAAM,IAAI,EAAC,SAAS,GAAG,EACvBA,uEAAU,IAAI,EAAC,eAAe,GAAY,CACxC,EACH,IAAI,CAAC,kBAAkB,KAAK,IAAI,IAAIA,mEAAM,IAAI,EAAC,MAAM,GAAG,CACrD,EACNA,kEAAK,KAAK,EAAC,2BAA2B,IACpCA,mEAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACU,CACb,EACP;KACH;;;;;;;","names":["h","forceUpdate","isModifiedEvent","Host"],"sources":["src/components/plekinfo-card/plekinfo-card.scss?tag=dso-plekinfo-card&encapsulation=shadow","src/components/plekinfo-card/plekinfo-card.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/components/plekinfo-card\";\r\n\r\n@use \"~dso-toolkit/src/components/insert/insert\";\r\n@use \"~dso-toolkit/src/components/delete/delete\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n.dso-plekinfo-card-container {\r\n padding-block: units.$u2;\r\n padding-inline: units.$u2;\r\n inline-size: 100%;\r\n\r\n .dso-plekinfo-card-heading {\r\n align-items: center;\r\n display: flex;\r\n\r\n @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n flex-wrap: wrap;\r\n }\r\n }\r\n\r\n .dso-plekinfo-card-heading + .dso-plekinfo-card-content {\r\n margin-block-start: units.$u1;\r\n }\r\n\r\n .dso-plekinfo-card-symbol {\r\n grid-row: span 2;\r\n\r\n margin-inline-end: units.$u1;\r\n }\r\n\r\n &:has(.dso-plekinfo-card-heading a:is(:hover, :focus-visible)) {\r\n background-color: plekinfo-card.$background-color-hover;\r\n }\r\n}\r\n\r\nins.dso-plekinfo-card-container {\r\n &:has(.dso-plekinfo-card-heading a:is(:hover, :focus-visible)) {\r\n background-color: plekinfo-card.$background-color-hover-voegtoe;\r\n }\r\n}\r\n\r\ndel.dso-plekinfo-card-container {\r\n &:has(.dso-plekinfo-card-heading a:is(:hover, :focus-visible)) {\r\n background-color: plekinfo-card.$background-color-hover-verwijder;\r\n }\r\n}\r\n\r\n:host([active]:not([active=\"false\"])) {\r\n .dso-plekinfo-card-container {\r\n background-color: plekinfo-card.$background-color-active;\r\n }\r\n\r\n ins.dso-plekinfo-card-container {\r\n background-color: plekinfo-card.$background-color-active-voegtoe;\r\n }\r\n\r\n del.dso-plekinfo-card-container {\r\n background-color: plekinfo-card.$background-color-active-verwijder;\r\n }\r\n}\r\n\r\n:host([has-symbol]) {\r\n .dso-plekinfo-card-container {\r\n display: grid;\r\n grid-template-columns: 1fr minmax(0, 100%);\r\n\r\n .dso-plekinfo-card-heading,\r\n .dso-plekinfo-card-content {\r\n grid-column: 2 /-1;\r\n }\r\n }\r\n}\r\n\r\n::slotted([slot=\"meta\"]) {\r\n display: flex !important;\r\n justify-content: space-between !important;\r\n margin-inline-start: auto !important;\r\n\r\n @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n flex-basis: 100% !important;\r\n margin-block-start: units.$u2 !important;\r\n }\r\n}\r\n\r\n::slotted([slot=\"heading\"]) {\r\n align-items: center !important;\r\n display: flex !important;\r\n font-size: 1.125em !important;\r\n margin-block-end: 0 !important;\r\n margin-block-start: 0 !important;\r\n}\r\n\r\n::slotted([slot=\"content\"]) {\r\n --_dt-rich-content-margin-block: #{units.$u1};\r\n --_dt-rich-content-margin-block-end: 0;\r\n --_dt-rich-content-margin-block-start: 0;\r\n}\r\n\r\n.heading-anchor {\r\n display: flex;\r\n gap: units.$u1 * 0.5;\r\n\r\n color: plekinfo-card.$heading-anchor-color;\r\n text-decoration: none;\r\n\r\n &:hover {\r\n color: plekinfo-card.$heading-anchor-hover-color;\r\n text-decoration: underline;\r\n }\r\n\r\n &:visited {\r\n color: plekinfo-card.$heading-anchor-color;\r\n }\r\n\r\n dso-icon {\r\n flex-shrink: 0;\r\n }\r\n\r\n .sr-only {\r\n @include utilities.sr-only();\r\n }\r\n}\r\n","import {\r\n h,\r\n Component,\r\n ComponentInterface,\r\n Element,\r\n Event,\r\n EventEmitter,\r\n Host,\r\n Prop,\r\n forceUpdate,\r\n FunctionalComponent,\r\n} from \"@stencil/core\";\r\n\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\nimport { PlekinfoCardClickEvent, PlekinfoWijzigactie } from \"./plekinfo-card.interfaces\";\r\n\r\ninterface WrapWijzigactieProps {\r\n wijzigactie: PlekinfoWijzigactie | undefined;\r\n}\r\n\r\nconst WrapWijzigactie: FunctionalComponent<WrapWijzigactieProps> = ({ wijzigactie }, children) => {\r\n if (wijzigactie === \"voegtoe\") {\r\n return <ins class=\"dso-plekinfo-card-container\">{children}</ins>;\r\n }\r\n\r\n if (wijzigactie === \"verwijder\") {\r\n return <del class=\"dso-plekinfo-card-container\">{children}</del>;\r\n }\r\n\r\n return <div class=\"dso-plekinfo-card-container\">{children}</div>;\r\n};\r\n\r\n/**\r\n * @slot symbol - An optional slot to place a symbol, representing the plekinfo item, in.\r\n * @slot heading - A slot to place the title of the card in.\r\n * @slot meta - An optional slot to place a `Label` in.\r\n * @slot content - An optional slot to place `Rich Content` in.\r\n */\r\n@Component({\r\n tag: \"dso-plekinfo-card\",\r\n styleUrl: \"plekinfo-card.scss\",\r\n shadow: true,\r\n})\r\nexport class PlekinfoCard implements ComponentInterface {\r\n @Element()\r\n host!: HTMLDsoPlekinfoCardElement;\r\n\r\n /**\r\n * An optional 'wijzigactie' that signals if the plekinfo on the card is added or removed.\r\n */\r\n @Prop({ reflect: true })\r\n wijzigactie?: PlekinfoWijzigactie;\r\n\r\n /**\r\n * The URL to which the PlekinfoCard heading links.\r\n */\r\n @Prop({ reflect: true })\r\n href!: string | undefined;\r\n\r\n /**\r\n * Makes the PlekinfoCard active.\r\n */\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /**\r\n * Emitted when the PlekinfoCard heading is clicked.\r\n */\r\n @Event()\r\n dsoPlekinfoCardClick!: EventEmitter<PlekinfoCardClickEvent>;\r\n\r\n private mutationObserver?: MutationObserver;\r\n\r\n connectedCallback(): void {\r\n this.mutationObserver = new MutationObserver(() => forceUpdate(this.host));\r\n\r\n this.mutationObserver.observe(this.host, { attributes: true, childList: true });\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.mutationObserver?.disconnect();\r\n\r\n delete this.mutationObserver;\r\n }\r\n\r\n private clickEventHandler(e: MouseEvent) {\r\n if (!(e.target instanceof HTMLElement) || !this.href) {\r\n return;\r\n }\r\n\r\n return this.dsoPlekinfoCardClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n }\r\n\r\n get symbolSlottedElement() {\r\n return this.host.querySelector(\"[slot='symbol']\");\r\n }\r\n\r\n get metaSlottedElement() {\r\n return this.host.querySelector(\"[slot='meta']\");\r\n }\r\n\r\n render() {\r\n const hasSymbol = this.symbolSlottedElement !== null;\r\n\r\n return (\r\n <Host has-symbol={hasSymbol}>\r\n <WrapWijzigactie wijzigactie={this.wijzigactie}>\r\n <div class=\"dso-plekinfo-card-symbol\" hidden={!hasSymbol}>\r\n <slot name=\"symbol\" />\r\n </div>\r\n <div class=\"dso-plekinfo-card-heading\">\r\n <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"chevron-right\"></dso-icon>\r\n </a>\r\n {this.metaSlottedElement !== null && <slot name=\"meta\" />}\r\n </div>\r\n <div class=\"dso-plekinfo-card-content\">\r\n <slot name=\"content\" />\r\n </div>\r\n </WrapWijzigactie>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index$1 = require('./index-848434f1.js');
|
|
6
6
|
const clsx = require('./clsx-fc789adc.js');
|
|
7
|
-
const index = require('./index-
|
|
7
|
+
const index = require('./index-a49786b9.js');
|
|
8
8
|
|
|
9
9
|
const scrollableCss = ":host{display:block;block-size:100%;overflow-y:hidden}*,*::after,*::before{box-sizing:border-box}.dso-shadow-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;position:relative}.dso-shadow-container .dso-scroll-container{block-size:100%;max-block-size:inherit;min-block-size:inherit;overflow-y:auto}.dso-shadow-container .dso-scroll-container::before,.dso-shadow-container .dso-scroll-container::after{background-repeat:no-repeat;background-size:100% 24px;content:\"\";display:block;block-size:24px;inset-inline-start:0;opacity:0;overflow:visible;position:absolute;transition:opacity 150ms ease-in-out;inline-size:100%;pointer-events:none;z-index:1}.dso-shadow-container .dso-scroll-container::before{background-image:linear-gradient(to top, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-start:0}.dso-shadow-container .dso-scroll-container::after{background-image:linear-gradient(to bottom, rgba(183, 183, 183, 0), rgba(183, 183, 183, 0.7));inset-block-end:0}.dso-shadow-container .dso-scroll-container.dso-scroll-bottom::before{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-top::after{opacity:1}.dso-shadow-container .dso-scroll-container.dso-scroll-middle::before,.dso-shadow-container .dso-scroll-container.dso-scroll-middle::after{opacity:1}";
|
|
10
10
|
const DsoScrollableStyle0 = scrollableCss;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-848434f1.js');
|
|
6
6
|
const clsx = require('./clsx-fc789adc.js');
|
|
7
|
-
const index$1 = require('./index-
|
|
7
|
+
const index$1 = require('./index-a49786b9.js');
|
|
8
8
|
|
|
9
9
|
const viewerGridVrkTabs = ["main", "map"];
|
|
10
10
|
const viewerGridVdkTabs = ["search", "map", "document"];
|
|
@@ -69,6 +69,12 @@ function debounce(function_, wait = 100, options = {}) {
|
|
|
69
69
|
return result;
|
|
70
70
|
};
|
|
71
71
|
|
|
72
|
+
Object.defineProperty(debounced, 'isPending', {
|
|
73
|
+
get() {
|
|
74
|
+
return timeoutId !== undefined;
|
|
75
|
+
},
|
|
76
|
+
});
|
|
77
|
+
|
|
72
78
|
debounced.clear = () => {
|
|
73
79
|
if (!timeoutId) {
|
|
74
80
|
return;
|
|
@@ -104,4 +110,4 @@ const debounce$1 = debounce$2.exports;
|
|
|
104
110
|
|
|
105
111
|
exports.debounce = debounce$1;
|
|
106
112
|
|
|
107
|
-
//# sourceMappingURL=index-
|
|
113
|
+
//# sourceMappingURL=index-a49786b9.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"index-a49786b9.js","mappings":";;;;AAAA,SAAS,QAAQ,CAAC,SAAS,EAAE,IAAI,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE;AACvD,CAAC,IAAI,OAAO,SAAS,KAAK,UAAU,EAAE;AACtC,EAAE,MAAM,IAAI,SAAS,CAAC,CAAC,qDAAqD,EAAE,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC;AACrG,EAAE;AACF;AACA,CAAC,IAAI,IAAI,GAAG,CAAC,EAAE;AACf,EAAE,MAAM,IAAI,UAAU,CAAC,8BAA8B,CAAC,CAAC;AACvD,EAAE;AACF;AACA;AACA,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,OAAO,OAAO,KAAK,SAAS,GAAG,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,OAAO,CAAC;AACnF;AACA,CAAC,IAAI,aAAa,CAAC;AACnB,CAAC,IAAI,eAAe,CAAC;AACrB,CAAC,IAAI,SAAS,CAAC;AACf,CAAC,IAAI,SAAS,CAAC;AACf,CAAC,IAAI,MAAM,CAAC;AACZ;AACA,CAAC,SAAS,GAAG,GAAG;AAChB,EAAE,MAAM,WAAW,GAAG,aAAa,CAAC;AACpC,EAAE,MAAM,aAAa,GAAG,eAAe,CAAC;AACxC,EAAE,aAAa,GAAG,SAAS,CAAC;AAC5B,EAAE,eAAe,GAAG,SAAS,CAAC;AAC9B,EAAE,MAAM,GAAG,SAAS,CAAC,KAAK,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;AACvD,EAAE,OAAO,MAAM,CAAC;AAChB,EAAE;AACF;AACA,CAAC,SAAS,KAAK,GAAG;AAClB,EAAE,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,SAAS,CAAC;AACtC;AACA,EAAE,IAAI,IAAI,GAAG,IAAI,IAAI,IAAI,IAAI,CAAC,EAAE;AAChC,GAAG,SAAS,GAAG,UAAU,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAC9C,GAAG,MAAM;AACT,GAAG,SAAS,GAAG,SAAS,CAAC;AACzB;AACA,GAAG,IAAI,CAAC,SAAS,EAAE;AACnB,IAAI,MAAM,GAAG,GAAG,EAAE,CAAC;AACnB,IAAI;AACJ,GAAG;AACH,EAAE;AACF;AACA,CAAC,MAAM,SAAS,GAAG,UAAU,GAAG,UAAU,EAAE;AAC5C,EAAE;AACF,GAAG,aAAa;AAChB,MAAM,IAAI,KAAK,aAAa;AAC5B,MAAM,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,MAAM,CAAC,cAAc,CAAC,aAAa,CAAC;AAC1E,IAAI;AACJ,GAAG,MAAM,IAAI,KAAK,CAAC,wEAAwE,CAAC,CAAC;AAC7F,GAAG;AACH;AACA,EAAE,aAAa,GAAG,IAAI,CAAC;AACvB,EAAE,eAAe,GAAG,UAAU,CAAC;AAC/B,EAAE,SAAS,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;AACzB;AACA,EAAE,MAAM,OAAO,GAAG,SAAS,IAAI,CAAC,SAAS,CAAC;AAC1C;AACA,EAAE,IAAI,CAAC,SAAS,EAAE;AAClB,GAAG,SAAS,GAAG,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;AACvC,GAAG;AACH;AACA,EAAE,IAAI,OAAO,EAAE;AACf,GAAG,MAAM,GAAG,GAAG,EAAE,CAAC;AAClB,GAAG;AACH;AACA,EAAE,OAAO,MAAM,CAAC;AAChB,EAAE,CAAC;AACH;AACA,CAAC,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,WAAW,EAAE;AAC/C,EAAE,GAAG,GAAG;AACR,GAAG,OAAO,SAAS,KAAK,SAAS,CAAC;AAClC,GAAG;AACH,EAAE,CAAC,CAAC;AACJ;AACA,CAAC,SAAS,CAAC,KAAK,GAAG,MAAM;AACzB,EAAE,IAAI,CAAC,SAAS,EAAE;AAClB,GAAG,OAAO;AACV,GAAG;AACH;AACA,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;AAC1B,EAAE,SAAS,GAAG,SAAS,CAAC;AACxB,EAAE,CAAC;AACH;AACA,CAAC,SAAS,CAAC,KAAK,GAAG,MAAM;AACzB,EAAE,IAAI,CAAC,SAAS,EAAE;AAClB,GAAG,OAAO;AACV,GAAG;AACH;AACA,EAAE,SAAS,CAAC,OAAO,EAAE,CAAC;AACtB,EAAE,CAAC;AACH;AACA,CAAC,SAAS,CAAC,OAAO,GAAG,MAAM;AAC3B,EAAE,MAAM,GAAG,GAAG,EAAE,CAAC;AACjB;AACA,EAAE,SAAS,CAAC,KAAK,EAAE,CAAC;AACpB,EAAE,CAAC;AACH;AACA,CAAC,OAAO,SAAS,CAAC;AAClB,CAAC;AACD;AACA;2BACuB,GAAG,SAAS;AACnC;AACAA,kBAAc,GAAG,QAAQ;;;;;;","names":["debounceModule"],"sources":["../../node_modules/debounce/index.js"],"sourcesContent":["function debounce(function_, wait = 100, options = {}) {\n\tif (typeof function_ !== 'function') {\n\t\tthrow new TypeError(`Expected the first parameter to be a function, got \\`${typeof function_}\\`.`);\n\t}\n\n\tif (wait < 0) {\n\t\tthrow new RangeError('`wait` must not be negative.');\n\t}\n\n\t// TODO: Deprecate the boolean parameter at some point.\n\tconst {immediate} = typeof options === 'boolean' ? {immediate: options} : options;\n\n\tlet storedContext;\n\tlet storedArguments;\n\tlet timeoutId;\n\tlet timestamp;\n\tlet result;\n\n\tfunction run() {\n\t\tconst callContext = storedContext;\n\t\tconst callArguments = storedArguments;\n\t\tstoredContext = undefined;\n\t\tstoredArguments = undefined;\n\t\tresult = function_.apply(callContext, callArguments);\n\t\treturn result;\n\t}\n\n\tfunction later() {\n\t\tconst last = Date.now() - timestamp;\n\n\t\tif (last < wait && last >= 0) {\n\t\t\ttimeoutId = setTimeout(later, wait - last);\n\t\t} else {\n\t\t\ttimeoutId = undefined;\n\n\t\t\tif (!immediate) {\n\t\t\t\tresult = run();\n\t\t\t}\n\t\t}\n\t}\n\n\tconst debounced = function (...arguments_) {\n\t\tif (\n\t\t\tstoredContext\n\t\t\t&& this !== storedContext\n\t\t\t&& Object.getPrototypeOf(this) === Object.getPrototypeOf(storedContext)\n\t\t) {\n\t\t\tthrow new Error('Debounced method called with different contexts of the same prototype.');\n\t\t}\n\n\t\tstoredContext = this; // eslint-disable-line unicorn/no-this-assignment\n\t\tstoredArguments = arguments_;\n\t\ttimestamp = Date.now();\n\n\t\tconst callNow = immediate && !timeoutId;\n\n\t\tif (!timeoutId) {\n\t\t\ttimeoutId = setTimeout(later, wait);\n\t\t}\n\n\t\tif (callNow) {\n\t\t\tresult = run();\n\t\t}\n\n\t\treturn result;\n\t};\n\n\tObject.defineProperty(debounced, 'isPending', {\n\t\tget() {\n\t\t\treturn timeoutId !== undefined;\n\t\t},\n\t});\n\n\tdebounced.clear = () => {\n\t\tif (!timeoutId) {\n\t\t\treturn;\n\t\t}\n\n\t\tclearTimeout(timeoutId);\n\t\ttimeoutId = undefined;\n\t};\n\n\tdebounced.flush = () => {\n\t\tif (!timeoutId) {\n\t\t\treturn;\n\t\t}\n\n\t\tdebounced.trigger();\n\t};\n\n\tdebounced.trigger = () => {\n\t\tresult = run();\n\n\t\tdebounced.clear();\n\t};\n\n\treturn debounced;\n}\n\n// Adds compatibility for ES modules\nmodule.exports.debounce = debounce;\n\nmodule.exports = debounce;\n"],"version":3}
|
|
@@ -121,7 +121,7 @@ button::-moz-focus-inner {
|
|
|
121
121
|
text-align: center;
|
|
122
122
|
}
|
|
123
123
|
.dso-modal > .dso-dialog > .dso-body p {
|
|
124
|
-
margin-block: 0 16px;
|
|
124
|
+
margin-block: 0 var(--_dt-rich-content-margin-block, 16px);
|
|
125
125
|
margin-inline: 0;
|
|
126
126
|
}
|
|
127
127
|
.dso-modal > .dso-dialog > .dso-body ul,
|
|
@@ -167,7 +167,7 @@ button::-moz-focus-inner {
|
|
|
167
167
|
min-block-size: 6.5rem;
|
|
168
168
|
}
|
|
169
169
|
.dso-modal > .dso-dialog > dso-scrollable .dso-body p {
|
|
170
|
-
margin-block: 0 16px;
|
|
170
|
+
margin-block: 0 var(--_dt-rich-content-margin-block, 16px);
|
|
171
171
|
margin-inline: 0;
|
|
172
172
|
}
|
|
173
173
|
.dso-modal > .dso-dialog > dso-scrollable .dso-body ul,
|
|
@@ -746,7 +746,7 @@ th {
|
|
|
746
746
|
|
|
747
747
|
table.table td:not(.plain-content) p,
|
|
748
748
|
table.table th p {
|
|
749
|
-
margin-block: 0 16px;
|
|
749
|
+
margin-block: 0 var(--_dt-rich-content-margin-block, 16px);
|
|
750
750
|
margin-inline: 0;
|
|
751
751
|
}
|
|
752
752
|
table.table td:not(.plain-content) ul,
|
|
@@ -1633,7 +1633,7 @@ del.editaction-remove p:last-child {
|
|
|
1633
1633
|
}
|
|
1634
1634
|
|
|
1635
1635
|
.dso-rich-content p {
|
|
1636
|
-
margin-block: 0 16px;
|
|
1636
|
+
margin-block: 0 var(--_dt-rich-content-margin-block, 16px);
|
|
1637
1637
|
margin-inline: 0;
|
|
1638
1638
|
}
|
|
1639
1639
|
.dso-rich-content ul,
|
|
@@ -60,20 +60,22 @@ del {
|
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
.dso-plekinfo-card-container {
|
|
63
|
-
padding-block: 16px
|
|
63
|
+
padding-block: 16px;
|
|
64
64
|
padding-inline: 16px;
|
|
65
65
|
inline-size: 100%;
|
|
66
66
|
}
|
|
67
67
|
.dso-plekinfo-card-container .dso-plekinfo-card-heading {
|
|
68
68
|
align-items: center;
|
|
69
69
|
display: flex;
|
|
70
|
-
margin-block-end: 8px;
|
|
71
70
|
}
|
|
72
71
|
@media screen and (max-width: 480px) {
|
|
73
72
|
.dso-plekinfo-card-container .dso-plekinfo-card-heading {
|
|
74
73
|
flex-wrap: wrap;
|
|
75
74
|
}
|
|
76
75
|
}
|
|
76
|
+
.dso-plekinfo-card-container .dso-plekinfo-card-heading + .dso-plekinfo-card-content {
|
|
77
|
+
margin-block-start: 8px;
|
|
78
|
+
}
|
|
77
79
|
.dso-plekinfo-card-container .dso-plekinfo-card-symbol {
|
|
78
80
|
grid-row: span 2;
|
|
79
81
|
margin-inline-end: 8px;
|
|
@@ -129,6 +131,12 @@ del.dso-plekinfo-card-container:has(.dso-plekinfo-card-heading a:is(:hover, :foc
|
|
|
129
131
|
margin-block-start: 0 !important;
|
|
130
132
|
}
|
|
131
133
|
|
|
134
|
+
::slotted([slot=content]) {
|
|
135
|
+
--_dt-rich-content-margin-block: 8px;
|
|
136
|
+
--_dt-rich-content-margin-block-end: 0;
|
|
137
|
+
--_dt-rich-content-margin-block-start: 0;
|
|
138
|
+
}
|
|
139
|
+
|
|
132
140
|
.heading-anchor {
|
|
133
141
|
display: flex;
|
|
134
142
|
gap: 4px;
|
|
@@ -755,7 +755,7 @@ a.dso-tertiary, a.dso-tertiary:visited {
|
|
|
755
755
|
text-align: center;
|
|
756
756
|
}
|
|
757
757
|
:host .dso-modal > .dso-dialog > .dso-body p {
|
|
758
|
-
margin-block: 0 16px;
|
|
758
|
+
margin-block: 0 var(--_dt-rich-content-margin-block, 16px);
|
|
759
759
|
margin-inline: 0;
|
|
760
760
|
}
|
|
761
761
|
:host .dso-modal > .dso-dialog > .dso-body ul,
|
|
@@ -801,7 +801,7 @@ a.dso-tertiary, a.dso-tertiary:visited {
|
|
|
801
801
|
min-block-size: 6.5rem;
|
|
802
802
|
}
|
|
803
803
|
:host .dso-modal > .dso-dialog > dso-scrollable .dso-body p {
|
|
804
|
-
margin-block: 0 16px;
|
|
804
|
+
margin-block: 0 var(--_dt-rich-content-margin-block, 16px);
|
|
805
805
|
margin-inline: 0;
|
|
806
806
|
}
|
|
807
807
|
:host .dso-modal > .dso-dialog > dso-scrollable .dso-body ul,
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h, Host } fr
|
|
|
2
2
|
import { i as isModifiedEvent } from './is-modified-event.js';
|
|
3
3
|
import { d as defineCustomElement$2 } from './icon.js';
|
|
4
4
|
|
|
5
|
-
const cardCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:url(\"./dso-icons.svg#img-download\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:url(\"./dso-icons.svg#img-download-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:url(\"./dso-icons.svg#img-external-link\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:url(\"./dso-icons.svg#img-external-link-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:url(\"./dso-icons.svg#img-call-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-call-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:url(\"./dso-icons.svg#img-email-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-email-scampi\")}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([is-selectable]:not([is-selectable=false])) .dso-card-container{display:grid;grid-template-columns:1fr minmax(0, 100%)}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-heading,:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-content{grid-column:2/-1}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-selectable{grid-row:span 2}:host([active]:not([active=false])) .dso-card-container{background-color:#e5e5e5}.dso-card-container{padding-block:16px
|
|
5
|
+
const cardCss = "a{background-color:transparent;color:var(--link-color);text-decoration:underline}a:hover,a:focus-visible{color:var(--link-hover-color);text-decoration:underline}a:active{text-decoration:none}a:visited{color:var(--link-visited-color)}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download{background-image:url(\"./dso-icons.svg#img-download\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).download:focus-visible{background-image:url(\"./dso-icons.svg#img-download-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-end:1.5em;background-position:bottom 0 right 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern{background-image:url(\"./dso-icons.svg#img-external-link\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary)).extern:focus-visible{background-image:url(\"./dso-icons.svg#img-external-link-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]{background-image:url(\"./dso-icons.svg#img-call-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"tel:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-call-scampi\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-repeat:no-repeat;background-size:1.25em 1.25em;padding-inline-start:1.5em;background-position:bottom 0 left 0}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]{background-image:url(\"./dso-icons.svg#img-email-grasgroen\")}a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:hover,a:where(:not(.dso-primary,.dso-secondary,.dso-tertiary))[href^=\"mailto:\"]:focus-visible{background-image:url(\"./dso-icons.svg#img-email-scampi\")}*,*::after,*::before{box-sizing:border-box}:host{display:block}:host([is-selectable]:not([is-selectable=false])) .dso-card-container{display:grid;grid-template-columns:1fr minmax(0, 100%)}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-heading,:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-content{grid-column:2/-1}:host([is-selectable]:not([is-selectable=false])) .dso-card-container .dso-card-selectable{grid-row:span 2}:host([active]:not([active=false])) .dso-card-container{background-color:#e5e5e5}.dso-card-container{padding-block:16px;padding-inline:16px;inline-size:100%;block-size:100%}.dso-card-container:has(.dso-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}.dso-card-container .dso-card-heading{align-items:center;display:flex;margin-block-end:8px}@media screen and (max-width: 480px){.dso-card-container .dso-card-heading{flex-wrap:wrap}}.heading-anchor{display:flex;gap:4px;color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor dso-icon{flex-shrink:0}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}";
|
|
6
6
|
const DsoCardStyle0 = cardCss;
|
|
7
7
|
|
|
8
8
|
const Card = /*@__PURE__*/ proxyCustomElement(class Card extends HTMLElement {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"dso-card.js","mappings":";;;;AAAA,MAAM,OAAO,GAAG,
|
|
1
|
+
{"file":"dso-card.js","mappings":";;;;AAAA,MAAM,OAAO,GAAG,0mHAA0mH,CAAC;AAC3nH,sBAAe,OAAO;;MCgBT,IAAI;;;;;;;;;;IAgCf,iBAAiB;QACf,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,MAAM,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAE3E,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;KACjF;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,gBAAgB,0CAAE,UAAU,EAAE,CAAC;QAEpC,OAAO,IAAI,CAAC,gBAAgB,CAAC;KAC9B;IAEO,iBAAiB,CAAC,CAAa;QACrC,IAAI,EAAE,CAAC,CAAC,MAAM,YAAY,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACpD,OAAO;SACR;QAED,OAAO,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,eAAe,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;KAC1F;IAED,IAAI,wBAAwB;QAC1B,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;KACvD;IAED,IAAI,0BAA0B;QAC5B,OAAO,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACzD;IAED,MAAM;QACJ,MAAM,YAAY,GAAG,IAAI,CAAC,wBAAwB,KAAK,IAAI,CAAC;QAE5D,QACE,EAAC,IAAI,sEAAgB,YAAY,IAC/B,4DAAK,KAAK,EAAC,oBAAoB,IAC7B,4DAAK,KAAK,EAAC,qBAAqB,EAAC,MAAM,EAAE,CAAC,YAAY,IACpD,6DAAM,IAAI,EAAC,YAAY,GAAG,CACtB,EACN,4DAAK,KAAK,EAAC,kBAAkB,IAC1B,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ,KACtB,0DACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAC,gBAAgB,EACtB,MAAM,EAAC,QAAQ,EACf,GAAG,EAAC,qBAAqB,EACzB,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAEzC,6DAAM,IAAI,EAAC,SAAS,GAAG,EACvB,iEAAU,IAAI,EAAC,eAAe,GAAY,EAC1C,6DAAM,KAAK,EAAC,SAAS,8CAA+C,CAClE,CACL;aACE,IAAI,CAAC,IAAI,KAAK,UAAU,KACvB,0DAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAClF,6DAAM,IAAI,EAAC,SAAS,GAAG,EACvB,iEAAU,IAAI,EAAC,UAAU,GAAY,CACnC,CACL,CAAC,KACA,0DAAG,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAC,gBAAgB,EAAC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAClF,6DAAM,IAAI,EAAC,SAAS,GAAG,EACvB,iEAAU,IAAI,EAAC,eAAe,GAAY,CACxC,CACL,EACF,IAAI,CAAC,0BAA0B,KAAK,IAAI,IAAI,6DAAM,IAAI,EAAC,cAAc,GAAG,CACrE,EACN,4DAAK,KAAK,EAAC,kBAAkB,IAC3B,6DAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/card/card.scss?tag=dso-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["@use \"~dso-toolkit/src/utilities\";\r\n@use \"~dso-toolkit/src/variables/units\";\r\n@use \"~dso-toolkit/src/variables/colors\";\r\n@use \"~dso-toolkit/src/components/card\";\r\n@use \"~dso-toolkit/src/components/anchor/anchor\";\r\n@use \"~dso-toolkit/src/variables/media-query-breakpoints\";\r\n\r\n@include utilities.box-sizing();\r\n\r\n:host {\r\n display: block;\r\n}\r\n\r\n:host([is-selectable]:not([is-selectable=\"false\"])) {\r\n .dso-card-container {\r\n display: grid;\r\n grid-template-columns: 1fr minmax(0, 100%);\r\n\r\n .dso-card-heading,\r\n .dso-card-content {\r\n grid-column: 2 /-1;\r\n }\r\n\r\n .dso-card-selectable {\r\n grid-row: span 2;\r\n }\r\n }\r\n}\r\n\r\n:host([active]:not([active=\"false\"])) {\r\n .dso-card-container {\r\n background-color: card.$background-color-active;\r\n }\r\n}\r\n\r\n.dso-card-container {\r\n padding-block: units.$u2;\r\n padding-inline: units.$u2;\r\n inline-size: 100%;\r\n block-size: 100%;\r\n\r\n &:has(.dso-card-heading a:is(:hover, :focus-visible)) {\r\n background-color: card.$background-color-hover;\r\n }\r\n\r\n .dso-card-heading {\r\n align-items: center;\r\n display: flex;\r\n margin-block-end: units.$u1;\r\n\r\n @media screen and (max-width: media-query-breakpoints.$screen-xs-min) {\r\n flex-wrap: wrap;\r\n }\r\n }\r\n}\r\n\r\n.heading-anchor {\r\n display: flex;\r\n gap: units.$u1 * 0.5;\r\n\r\n color: card.$heading-anchor-color;\r\n text-decoration: none;\r\n\r\n &:hover {\r\n color: card.$heading-anchor-hover-color;\r\n text-decoration: underline;\r\n }\r\n\r\n &:visited {\r\n color: card.$heading-anchor-color;\r\n }\r\n\r\n dso-icon {\r\n flex-shrink: 0;\r\n }\r\n\r\n .sr-only {\r\n @include utilities.sr-only();\r\n }\r\n}\r\n","import { h, Component, ComponentInterface, Element, Event, EventEmitter, Host, Prop, forceUpdate } from \"@stencil/core\";\r\n\r\nimport { isModifiedEvent } from \"../../utils/is-modified-event\";\r\n\r\nimport { CardClickEvent } from \"./card.interfaces\";\r\n\r\n/**\r\n * @slot selectable - An optional slot to place a `Selectable` in.\r\n * @slot heading - A slot to place the title of the card in.\r\n * @slot interactions - An optional slot for one or more `Button`s, `Label`s, `Toggletip`s or `SlideToggle`s.\r\n * @slot content - An optional slot to place `Rich Content` in.\r\n */\r\n@Component({\r\n tag: \"dso-card\",\r\n styleUrl: \"card.scss\",\r\n shadow: true,\r\n})\r\nexport class Card implements ComponentInterface {\r\n @Element()\r\n host!: HTMLDsoCardElement;\r\n\r\n /**\r\n * The URL to which the Card heading links.\r\n */\r\n @Prop({ reflect: true })\r\n href!: string | undefined;\r\n\r\n /**\r\n * Display the link as an external link or a download link\r\n * - \"download\"\r\n * - \"extern\"\r\n */\r\n @Prop({ reflect: true })\r\n mode?: string;\r\n\r\n /**\r\n * Makes the Card active.\r\n */\r\n @Prop({ reflect: true })\r\n active?: boolean;\r\n\r\n /**\r\n * Emitted when the Card heading is clicked.\r\n */\r\n @Event()\r\n dsoCardClick!: EventEmitter<CardClickEvent>;\r\n\r\n private mutationObserver?: MutationObserver;\r\n\r\n connectedCallback(): void {\r\n this.mutationObserver = new MutationObserver(() => forceUpdate(this.host));\r\n\r\n this.mutationObserver.observe(this.host, { attributes: true, childList: true });\r\n }\r\n\r\n disconnectedCallback(): void {\r\n this.mutationObserver?.disconnect();\r\n\r\n delete this.mutationObserver;\r\n }\r\n\r\n private clickEventHandler(e: MouseEvent) {\r\n if (!(e.target instanceof HTMLElement) || !this.href) {\r\n return;\r\n }\r\n\r\n return this.dsoCardClick.emit({ originalEvent: e, isModifiedEvent: isModifiedEvent(e) });\r\n }\r\n\r\n get selectableSlottedElement() {\r\n return this.host.querySelector(\"[slot='selectable']\");\r\n }\r\n\r\n get interactionsSlottedElement() {\r\n return this.host.querySelector(\"[slot='interactions']\");\r\n }\r\n\r\n render() {\r\n const isSelectable = this.selectableSlottedElement !== null;\r\n\r\n return (\r\n <Host is-selectable={isSelectable}>\r\n <div class=\"dso-card-container\">\r\n <div class=\"dso-card-selectable\" hidden={!isSelectable}>\r\n <slot name=\"selectable\" />\r\n </div>\r\n <div class=\"dso-card-heading\">\r\n {(this.mode === \"extern\" && (\r\n <a\r\n href={this.href}\r\n class=\"heading-anchor\"\r\n target=\"_blank\"\r\n rel=\"noopener noreferrer\"\r\n onClick={(e) => this.clickEventHandler(e)}\r\n >\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"external-link\"></dso-icon>\r\n <span class=\"sr-only\">(Opent andere website in nieuw tabblad)</span>\r\n </a>\r\n )) ||\r\n (this.mode === \"download\" && (\r\n <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"download\"></dso-icon>\r\n </a>\r\n )) || (\r\n <a href={this.href} class=\"heading-anchor\" onClick={(e) => this.clickEventHandler(e)}>\r\n <slot name=\"heading\" />\r\n <dso-icon icon=\"chevron-right\"></dso-icon>\r\n </a>\r\n )}\r\n {this.interactionsSlottedElement !== null && <slot name=\"interactions\" />}\r\n </div>\r\n <div class=\"dso-card-content\">\r\n <slot name=\"content\" />\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, forceUpdate, h } from '@s
|
|
|
2
2
|
import { i as isModifiedEvent } from './is-modified-event.js';
|
|
3
3
|
import { d as defineCustomElement$2 } from './icon.js';
|
|
4
4
|
|
|
5
|
-
const documentCardCss = "*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px
|
|
5
|
+
const documentCardCss = "*,*::after,*::before{box-sizing:border-box}:host{display:block}.dso-document-card-container{padding-block:16px;padding-inline:16px;inline-size:100%}.dso-document-card-container .dso-document-card-heading{align-items:center;display:flex}@media screen and (max-width: 480px){.dso-document-card-container .dso-document-card-heading{flex-wrap:wrap}}.dso-document-card-container:has(.dso-document-card-heading a:is(:hover,:focus-visible)){background-color:#f2f2f2}:host([active]:not([active=false])) .dso-document-card-container{background-color:#e5e5e5}::slotted([slot=meta]){display:flex !important;justify-content:space-between !important;margin-inline-start:auto !important}@media screen and (max-width: 480px){::slotted([slot=meta]){flex-basis:100% !important;margin-block-start:16px !important}}::slotted([slot=heading]){align-items:center !important;display:flex !important;font-size:1.125em !important;margin-block-end:0 !important;margin-block-start:0 !important}.heading-anchor{display:flex;gap:4px;color:#275937;text-decoration:none}.heading-anchor:hover{color:#275937;text-decoration:underline}.heading-anchor:visited{color:#275937}.heading-anchor dso-icon{flex-shrink:0}.heading-anchor .sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}::slotted([slot=type]){--_dt-info-button-margin-inline-start:0;display:flex !important;gap:8px !important}.dso-document-card-heading+.dso-document-card-type,.dso-document-card-heading+.dso-document-card-status,.dso-document-card-type+.dso-document-card-status{margin-block-start:8px}";
|
|
6
6
|
const DsoDocumentCardStyle0 = documentCardCss;
|
|
7
7
|
|
|
8
8
|
const DocumentCard = /*@__PURE__*/ proxyCustomElement(class DocumentCard extends HTMLElement {
|