@utrecht/web-component-library-stencil 3.7.0 → 4.1.0

package/dist/collection/components/sidenav.js

@@ -11,7 +11,7 @@ export class Sidenav {
     }
     render() {
         const items = JSON.parse(this.json);
-        return (h("nav", { key: 'fb3060387682c7252c26a7061f74b29fa944385a', class: "utrecht-sidenav" }, h("ul", { key: 'ec5ddb2e61c360f5a0119e8abfcc5c6a01d05923', class: "utrecht-sidenav__list" }, items.map(({ href, title, current, focus, children, sibling, haschildren }, index, array) => (h("li", { key: href, class: clsx('utrecht-sidenav__item', index + 1 === array.length && 'utrecht-sidenav__item--last', sibling && 'utrecht-sidenav__item--sibling', haschildren && 'utrecht-sidenav__item--parent') }, h("a", { class: clsx('utrecht-sidenav__link', current && 'utrecht-sidenav__link--current', focus && 'utrecht-sidenav__link--focus', sibling && 'utrecht-sidenav__link--sibling', haschildren && 'utrecht-sidenav__link--parent'), href: href }, h("div", { class: clsx('utrecht-sidenav__marker', current && 'utrecht-sidenav__marker--current') }), h("div", { class: clsx('utrecht-sidenav__connection', haschildren && 'utrecht-sidenav__connection--parent', sibling && 'utrecht-sidenav__connection--sibling', index + 1 === array.length && 'utrecht-sidenav__connection--last') }), title), children ? (h("ul", { class: "utrecht-sidenav__list utrecht-sidenav__list--child" }, children.map(({ href, title, current, focus }) => (h("li", { key: href, class: "utrecht-sidenav__item utrecht-sidenav__item--child" }, h("a", { class: clsx('utrecht-sidenav__link', 'utrecht-sidenav__link--child', current && 'utrecht-sidenav__link--current', current && 'utrecht-sidenav__link--current-child', focus && 'utrecht-sidenav__link--focus'), href: href }, h("div", { class: clsx('utrecht-sidenav__marker', 'utrecht-sidenav__marker--child', current && 'utrecht-sidenav__marker--current', current && 'utrecht-sidenav__marker--current-child') }), title)))))) : (''), h("div", { class: "utrecht-sidenav__item-separator" })))))));
+        return (h("nav", { key: '387a82adf73169f5b827c32f305d1c5c0502721d', class: "utrecht-sidenav" }, h("ul", { key: 'b8fc64039480a835f4149f6a6d0f98d1ea267e81', class: "utrecht-sidenav__list" }, items.map(({ href, title, current, focus, children, sibling, haschildren }, index, array) => (h("li", { key: href, class: clsx('utrecht-sidenav__item', index + 1 === array.length && 'utrecht-sidenav__item--last', sibling && 'utrecht-sidenav__item--sibling', haschildren && 'utrecht-sidenav__item--parent') }, h("a", { class: clsx('utrecht-sidenav__link', current && 'utrecht-sidenav__link--current', focus && 'utrecht-sidenav__link--focus', sibling && 'utrecht-sidenav__link--sibling', haschildren && 'utrecht-sidenav__link--parent'), href: href }, h("div", { class: clsx('utrecht-sidenav__marker', current && 'utrecht-sidenav__marker--current') }), h("div", { class: clsx('utrecht-sidenav__connection', haschildren && 'utrecht-sidenav__connection--parent', sibling && 'utrecht-sidenav__connection--sibling', index + 1 === array.length && 'utrecht-sidenav__connection--last') }), title), children ? (h("ul", { class: "utrecht-sidenav__list utrecht-sidenav__list--child" }, children.map(({ href, title, current, focus }) => (h("li", { key: href, class: "utrecht-sidenav__item utrecht-sidenav__item--child" }, h("a", { class: clsx('utrecht-sidenav__link', 'utrecht-sidenav__link--child', current && 'utrecht-sidenav__link--current', current && 'utrecht-sidenav__link--current-child', focus && 'utrecht-sidenav__link--focus'), href: href }, h("div", { class: clsx('utrecht-sidenav__marker', 'utrecht-sidenav__marker--child', current && 'utrecht-sidenav__marker--current', current && 'utrecht-sidenav__marker--current-child') }), title)))))) : (''), h("div", { class: "utrecht-sidenav__item-separator" })))))));
     }
     static get is() { return "utrecht-sidenav"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/skip-link.css

@@ -3,18 +3,23 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
-/* stylelint-disable-next-line block-no-empty */
 /**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
-/* stylelint-disable-next-line block-no-empty */
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/* stylelint-disable-next-line block-no-empty */
+/* stylelint-disable-next-line block-no-empty */
 .utrecht-skip-link {
   /* Use `ButtonFace` as default `background-color`
    * to ensure the skip link is not transparent and unreadable
@@ -110,11 +115,6 @@
   text-decoration: var(--utrecht-skip-link-focus-visible-text-decoration, var(--utrecht-skip-link-focus-text-decoration));
 }
 
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   display: inline-flex;
 }

package/dist/collection/components/skip-link.js

@@ -9,7 +9,7 @@ export class SkipLink {
         this.href = undefined;
     }
     render() {
-        return (h("a", { key: '717e37fec542fbfc287026da49ba333a64359719', href: typeof this.href === 'string' ? this.href : undefined, class: "utrecht-skip-link utrecht-skip-link--visible-on-focus" }, h("slot", { key: '2bc859029261ce66ee1713db95a2f0e9f4cd6cd9' })));
+        return (h("a", { key: 'b51a15421675dd33b7c96f7da367a0a355ba42c9', href: typeof this.href === 'string' ? this.href : undefined, class: "utrecht-skip-link utrecht-skip-link--visible-on-focus" }, h("slot", { key: 'b116757a22c64dfc335143d0a70bbf55aee5a04e' })));
     }
     static get is() { return "utrecht-skip-link"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spotlight-section.css

@@ -4,10 +4,15 @@
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
 /**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 .utrecht-spotlight-section {
   background-color: var(--_utrecht-spotlight-section-background-color, var(--utrecht-spotlight-section-background-color));
   border-color: var(--_utrecht-spotlight-section-border-color, var(--utrecht-spotlight-section-border-color));
@@ -55,11 +60,6 @@
   --_utrecht-spotlight-section-color: var(--utrecht-spotlight-section-ok-color);
 }
 
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   display: block;
 }

package/dist/collection/components/spotlight-section.js

@@ -10,7 +10,7 @@ export class SpotlightSection {
         this.appearance = undefined;
     }
     render() {
-        return (h("div", { key: 'cb17b14b82d1fac5535e8771de501066a251bbb2', class: clsx('utrecht-spotlight-section', this.appearance === 'error' && 'utrecht-spotlight-section--error', this.appearance === 'info' && 'utrecht-spotlight-section--info', this.appearance === 'ok' && 'utrecht-spotlight-section--ok', this.appearance === 'warning' && 'utrecht-spotlight-section--warning') }, h("slot", { key: 'a3f435fad1bd836f21ae58a59ad0406a9e878c6a' })));
+        return (h("div", { key: '46b69f7b1f1b0baafe953198944d0830edb7584c', class: clsx('utrecht-spotlight-section', this.appearance === 'error' && 'utrecht-spotlight-section--error', this.appearance === 'info' && 'utrecht-spotlight-section--info', this.appearance === 'ok' && 'utrecht-spotlight-section--ok', this.appearance === 'warning' && 'utrecht-spotlight-section--warning') }, h("slot", { key: '20bd45bfbe9a56fe7d4bd0c6ae954722bdbba533' })));
     }
     static get is() { return "utrecht-spotlight-section"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/status-badge.css

@@ -0,0 +1,140 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2020-2024 Frameless B.V.
+ * Copyright (c) 2021-2024 Gemeente Utrecht
+ */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+.utrecht-status-badge {
+  /*
+   * `line-height` has a default value, so `line-height` can be used on a parent element to add vertical space between badges
+   *
+   * Configure maximum size to prevent stretching badges inside a flexbox.
+   * 
+   * Configure minumum size to have space to type in when displaying badges in a WYSIWYG editor.
+   */
+  background-color: var(--utrecht-badge-background-color, hsl(0, 0%, 0%));
+  border-radius: var(--utrecht-badge-border-radius, 0.5ch);
+  color: var(--utrecht-badge-color, hsl(0, 0%, 100%));
+  display: inline-block;
+  font-family: var(--utrecht-document-font-family, sans-serif);
+  font-size: var(--utrecht-badge-font-size, inherit);
+  font-style: var(--utrecht-badge-font-style, normal); /* no inheritance */
+  font-weight: var(--utrecht-badge-font-weight, bold); /* no inheritance */
+  line-height: var(--utrecht-badge-line-height, 1em);
+  max-block-size: max-content;
+  max-inline-size: max-content;
+  min-block-size: 1em;
+  min-inline-size: 1em;
+  padding-block-end: var(--utrecht-badge-padding-block, 0.5ex);
+  padding-block-start: var(--utrecht-badge-padding-block, 0.5ex);
+  padding-inline-end: var(--utrecht-badge-padding-inline, 0.5ch);
+  padding-inline-start: var(--utrecht-badge-padding-inline, 0.5ch);
+  text-decoration: none; /* no inheritance */
+}
+@media screen and (-ms-high-contrast: active), screen and (forced-colors: active) {
+  .utrecht-status-badge {
+    border-color: currentColor;
+    border-style: solid;
+    /* Warning: there layout difference because of the added 1px border */
+    border-width: 1px;
+  }
+}
+.utrecht-status-badge {
+  --utrecht-badge-background-color: var(--utrecht-status-badge-background-color);
+  --utrecht-badge-border-radius: var(--utrecht-status-badge-border-radius);
+  --utrecht-badge-color: var(--utrecht-status-badge-color);
+  --utrecht-badge-font-size: var(--utrecht-status-badge-font-size, inherit);
+  --utrecht-badge-font-style: var(--utrecht-status-badge-font-style);
+  --utrecht-badge-font-weight: var(--utrecht-status-badge-font-weight);
+  --utrecht-badge-line-height: var(--utrecht-status-badge-line-height);
+  --utrecht-badge-padding-block: var(--utrecht-status-badge-padding-block);
+  --utrecht-badge-padding-inline: var(--utrecht-status-badge-padding-inline);
+  border-color: var(--utrecht-status-badge-border-color, transparent);
+  border-width: var(--utrecht-status-badge-border-width);
+  font-family: var(--utrecht-status-badge-font-family, inherit);
+  letter-spacing: var(--utrecht-status-badge-letter-spacing, inherit);
+  min-block-size: var(--utrecht-status-badge-min-block-size, 1em);
+  min-inline-size: var(--utrecht-status-badge-min-inline-size, 1em);
+  text-transform: var(--utrecht-status-badge-text-transform, inherit);
+}
+
+.utrecht-status-badge--danger {
+  background-color: var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 40%));
+  border-color: var(--utrecht-status-badge-danger-border-color);
+  color: var(--utrecht-status-badge-danger-color, white);
+}
+
+.utrecht-status-badge--warning {
+  background-color: var(--utrecht-status-badge-warning-background-color, hsl(48, 100%, 50%));
+  border-color: var(--utrecht-status-badge-warning-border-color);
+  color: var(--utrecht-status-badge-warning-color, white);
+}
+
+.utrecht-status-badge--safe {
+  background-color: var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%));
+  border-color: var(--utrecht-status-badge-safe-border-color);
+  color: var(--utrecht-status-badge-safe-color, white);
+}
+
+.utrecht-status-badge--neutral {
+  background-color: var(--utrecht-status-badge-neutral-background-color, black);
+  border-color: var(--utrecht-status-badge-neutral-border-color);
+  color: var(--utrecht-status-badge-neutral-color, white);
+}
+
+.utrecht-status-badge--valid {
+  background-color: var(--utrecht-status-badge-valid-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
+  border-color: var(--utrecht-status-badge-valid-border-color);
+  color: var(--utrecht-status-badge-valid-color, var(--utrecht-status-badge-safe-color, white));
+}
+
+.utrecht-status-badge--invalid {
+  background-color: var(--utrecht-status-badge-invalid-background-color, var(--utrecht-status-badge-danger-background-color, hsl(39, 100%, 50%)));
+  border-color: var(--utrecht-status-badge-invalid-border-color);
+  color: var(--utrecht-status-badge-invalid-color, var(--utrecht-status-badge-danger-color, white));
+}
+
+.utrecht-status-badge--error {
+  background-color: var(--utrecht-status-badge-error-background-color, var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 30%)));
+  color: var(--utrecht-status-badge-error-color, var(--utrecht-status-badge-danger-color, white));
+}
+
+.utrecht-status-badge--success {
+  background-color: var(--utrecht-status-badge-success-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
+  border-color: var(--utrecht-status-badge-success-border-color);
+  color: var(--utrecht-status-badge-success-color, var(--utrecht-status-badge-safe-color, white));
+}
+
+.utrecht-status-badge--active {
+  background-color: var(--utrecht-status-badge-active-background-color, var(--utrecht-status-badge-safe-background-color, hsl(90, 30%, 50%)));
+  border-color: var(--utrecht-status-badge-active-border-color);
+  color: var(--utrecht-status-badge-active-color, var(--utrecht-status-badge-safe-color, white));
+}
+
+.utrecht-status-badge--inactive {
+  background-color: var(--utrecht-status-badge-inactive-background-color, var(--utrecht-status-badge-danger-background-color, hsl(0, 100%, 40%)));
+  border-color: var(--utrecht-status-badge-inactive-border-color);
+  color: var(--utrecht-status-badge-inactive-color, var(--utrecht-status-badge-danger-color, white));
+}
+
+:host {
+  display: inline-block;
+}
+
+:host([hidden]) {
+  display: none !important;
+}

package/dist/collection/components/status-badge.js

@@ -0,0 +1,48 @@
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2020-2024 Frameless B.V.
+ * Copyright (c) 2021-2024 Gemeente Utrecht
+ */
+import { h } from "@stencil/core";
+export class StatusBadge {
+    constructor() {
+        this.status = undefined;
+    }
+    render() {
+        return (h("div", { key: '1c72d28a3df7a18f75612496eef6ad4b2087dcaf', class: `utrecht-status-badge utrecht-status-badge--${this.status || 'neutral'}` }, h("slot", { key: '51b8e21b70cf352d86d49c445e87655689af44bf' })));
+    }
+    static get is() { return "utrecht-status-badge"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["status-badge.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["status-badge.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "status": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "status",
+                "reflect": false
+            }
+        };
+    }
+}
+//# sourceMappingURL=status-badge.js.map

package/dist/collection/components/status-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-badge.js","sourceRoot":"","sources":["../../src/components/status-badge.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAOnD,MAAM,OAAO,WAAW;;;;IAGtB,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,8CAA8C,IAAI,CAAC,MAAM,IAAI,SAAS,EAAE;YAClF,8DAAa,CACT,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/**\n * @license EUPL-1.2\n * Copyright (c) 2020-2024 Frameless B.V.\n * Copyright (c) 2021-2024 Gemeente Utrecht\n */\n\nimport { Component, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'utrecht-status-badge',\n  styleUrl: 'status-badge.scss',\n  shadow: true,\n})\nexport class StatusBadge {\n  @Prop() status: string;\n\n  render() {\n    return (\n      <div class={`utrecht-status-badge utrecht-status-badge--${this.status || 'neutral'}`}>\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/surface.css

@@ -4,10 +4,15 @@
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
 /**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 .utrecht-surface {
   background-color: var(--utrecht-surface-background-color, inherit);
   color: var(--utrecht-surface-color, inherit);
@@ -20,11 +25,6 @@
   margin-inline-start: 0;
 }
 
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   display: block;
 }

package/dist/collection/components/table-body.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   --_utrecht-table-header-cell-z-index: 2;
   display: table-row-group;

package/dist/collection/components/table-caption.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   break-inside: avoid;
   color: var(--utrecht-table-caption-color);

package/dist/collection/components/table-cell.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   --utrecht-icon-size: var(--utrecht-table-cell-icon-size);
   /* In tables `block-size` acts as `min-block-size`, but `min-block-size` is a clearer name for the design token */

package/dist/collection/components/table-container.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 utrecht-table-container {
   display: block;
   overflow: auto;
@@ -20,10 +20,6 @@ utrecht-table-container {
   background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%;
 }
 
-utrecht-table-container table {
-  /* stylelint-disable no-descending-specificity */
-  /* stylelint-enable no-descending-specificity */
-}
 utrecht-table-container table > caption {
   break-inside: avoid;
   color: var(--utrecht-table-caption-color);
@@ -89,9 +85,15 @@ utrecht-table-container table > tr > td, utrecht-table-container table > thead >
   border-block-end-width: var(--utrecht-table-row-border-block-end-width, 0);
   vertical-align: top;
 }
+utrecht-table-container table {
+  /* stylelint-disable no-descending-specificity */
+}
 utrecht-table-container table > tr > td:last-child, utrecht-table-container table > thead > tr > td:last-child, utrecht-table-container table > tbody > tr > td:last-child, utrecht-table-container table > tfoot > tr > td:last-child {
   padding-inline-end: var(--utrecht-table-row-padding-inline-end, var(--utrecht-table-cell-padding-inline-end, 0));
 }
 utrecht-table-container table > tr > td:first-child, utrecht-table-container table > thead > tr > td:first-child, utrecht-table-container table > tbody > tr > td:first-child, utrecht-table-container table > tfoot > tr > td:first-child {
   padding-inline-start: var(--utrecht-table-row-padding-inline-start, var(--utrecht-table-cell-padding-inline-start, 0));
+}
+utrecht-table-container table {
+  /* stylelint-enable no-descending-specificity */
 }

package/dist/collection/components/table-footer.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   --_utrecht-table-header-cell-z-index: 5;
   z-index: 3;

package/dist/collection/components/table-header-cell.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   --utrecht-icon-size: var(--utrecht-table-cell-icon-size);
   /* In tables `block-size` acts as `min-block-size`, but `min-block-size` is a clearer name for the design token */

package/dist/collection/components/table-header.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   --_utrecht-table-header-cell-vertical-align: bottom;
   --_utrecht-table-header-cell-z-index: 8;

package/dist/collection/components/table-row.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   break-inside: avoid;
   page-break-inside: avoid;

package/dist/collection/components/table.css

@@ -3,13 +3,13 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /* stylelint-disable-next-line block-no-empty */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   /* `border-collapse: collapse` results in a broken border for sticky header and sticky footer.
    * Therefore we need to use `border-collapse: separate` instead.

package/dist/collection/components/textarea.css

@@ -3,20 +3,30 @@
  * Copyright (c) 2020-2024 Frameless B.V.
  * Copyright (c) 2021-2024 Gemeente Utrecht
  */
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* stylelint-disable-next-line block-no-empty */
 /**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
+/**
+* @license EUPL-1.2
+* Copyright (c) 2020-2024 Frameless B.V.
+* Copyright (c) 2021-2024 Gemeente Utrecht
+*/
 /* TODO: Enable ordering properties when the plugin supports logical CSS properties
  * https://github.com/hudochenkov/stylelint-order/pull/162 */
 /* stylelint-disable order/properties-alphabetical-order */
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 .utrecht-textarea {
   /* Fall back to `resize: vertical` for browsers that don't support `resize: block` */
   background-color: var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color));
@@ -99,14 +109,6 @@
   opacity: 100%;
 }
 
-.utrecht-textarea--html-textarea {
-  /* The `textarea:read-only` pseudo selector applies to both `<textarea readonly>` and `<textarea disabled>` */
-  /*
-   * The `textarea:disabled` pseudo selector applies to `<textarea disabled>`, but not to `<textarea aria-disabled="true">`
-   *
-   * We consider `disabled` more specific than `read-only`, so the `:disabled` selector should come after the `:read-only` selector.
-   */
-}
 .utrecht-textarea--html-textarea:focus {
   background-color: var(--utrecht-textarea-focus-background-color, var(--utrecht-form-control-focus-background-color, var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color))));
   border-color: var(--utrecht-textarea-focus-border-color, var(--utrecht-form-control-focus-border-color, var(--utrecht-textarea-border-color, var(--utrecht-form-control-border-color))));
@@ -140,11 +142,21 @@
   border-color: var(--utrecht-textarea-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-textarea-border-color, var(--utrecht-form-control-border-color))));
   color: var(--utrecht-textarea-invalid-color, var(--utrecht-form-control-invalid-color, var(--utrecht-textarea-color, var(--utrecht-form-control-color))));
 }
+.utrecht-textarea--html-textarea {
+  /* The `textarea:read-only` pseudo selector applies to both `<textarea readonly>` and `<textarea disabled>` */
+}
 .utrecht-textarea--html-textarea:read-only {
   background-color: var(--utrecht-textarea-read-only-background-color, var(--utrecht-form-control-read-only-background-color, var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color))));
   border-color: var(--utrecht-textarea-read-only-border-color, var(--utrecht-form-control-read-only-border-color, var(--utrecht-textarea-border-color, var(--utrecht-form-control-border-color))));
   color: var(--utrecht-textarea-read-only-color, var(--utrecht-form-control-read-only-color, var(--utrecht-textarea-color, var(--utrecht-form-control-color))));
 }
+.utrecht-textarea--html-textarea {
+  /*
+   * The `textarea:disabled` pseudo selector applies to `<textarea disabled>`, but not to `<textarea aria-disabled="true">`
+   *
+   * We consider `disabled` more specific than `read-only`, so the `:disabled` selector should come after the `:read-only` selector.
+   */
+}
 .utrecht-textarea--html-textarea:disabled {
   background-color: var(--utrecht-textarea-disabled-background-color, var(--utrecht-form-control-disabled-background-color, var(--utrecht-textarea-background-color, var(--utrecht-form-control-background-color))));
   border-color: var(--utrecht-textarea-disabled-border-color, var(--utrecht-form-control-disabled-border-color, var(--utrecht-textarea-border-color, var(--utrecht-form-control-border-color))));
@@ -157,11 +169,6 @@
   opacity: 100%;
 }
 
-/**
- * @license EUPL-1.2
- * Copyright (c) 2020-2024 Frameless B.V.
- * Copyright (c) 2021-2024 Gemeente Utrecht
- */
 :host {
   display: block;
 }