@utrecht/component-library-css 1.0.0-alpha.534 → 1.0.0-alpha.536

package/dist/index.css

@@ -2932,6 +2932,20 @@ ol.utrecht-breadcrumb__list {
   color: var(--utrecht-form-toggle-disabled-color, black);
 }
 
+.utrecht-form-toggle__track--focus-visible {
+  /* - The browser default focus ring should apply when these CSS custom properties are not set.
+   * - Make the `box-shadow` value available, so components that have their own `box-shadow`
+   *   can combine it with the focus ring box shadow.
+   */
+  --_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0)
+    var(--utrecht-focus-inverse-outline-color, transparent);
+  box-shadow: var(--_utrecht-focus-ring-box-shadow);
+  outline-color: var(--utrecht-focus-outline-color, revert);
+  outline-offset: var(--utrecht-focus-outline-offset, revert);
+  outline-style: var(--utrecht-focus-outline-style, revert);
+  outline-width: var(--utrecht-focus-outline-width, revert);
+}
+
 .utrecht-form-toggle--html-checkbox .utrecht-form-toggle__checkbox {
   /* Source: https://kittygiraudel.com/snippets/sr-only-class/ */
   block-size: 1px !important;
@@ -2948,6 +2962,19 @@ ol.utrecht-breadcrumb__list {
   position: absolute !important;
   white-space: nowrap !important;
 }
+.utrecht-form-toggle--html-checkbox .utrecht-form-toggle__checkbox:focus-visible ~ .utrecht-form-toggle__track {
+  /* - The browser default focus ring should apply when these CSS custom properties are not set.
+   * - Make the `box-shadow` value available, so components that have their own `box-shadow`
+   *   can combine it with the focus ring box shadow.
+   */
+  --_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0)
+    var(--utrecht-focus-inverse-outline-color, transparent);
+  box-shadow: var(--_utrecht-focus-ring-box-shadow);
+  outline-color: var(--utrecht-focus-outline-color, revert);
+  outline-offset: var(--utrecht-focus-outline-offset, revert);
+  outline-style: var(--utrecht-focus-outline-style, revert);
+  outline-width: var(--utrecht-focus-outline-width, revert);
+}
 /**
  * @license EUPL-1.2
  * Copyright (c) 2021 Gemeente Utrecht
@@ -4562,6 +4589,64 @@ however browsers don't seem to have implemented great looking supixel tweening y
   outline-style: revert;
 }
 
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 The Knights Who Say NIH! B.V.
+ * Copyright (c) 2021 Gemeente Utrecht
+ */
+/**
+ * @license EUPL-1.2
+ * Copyright (c) 2021 Gemeente Utrecht
+ * Copyright (c) 2021 Robbert Broersma
+ */
+.utrecht-data-placeholder {
+  background-color: var(--utrecht-data-placeholder-background-color, currentColor);
+  block-size: 1em;
+  display: inline-block;
+  inline-size: min(100%, var(--utrecht-data-placeholder-max-inline-size));
+  max-inline-size: var(--utrecht-data-placeholder-max-inline-size);
+  min-inline-size: var(--utrecht-data-placeholder-min-inline-size, 10ch);
+  vertical-align: -0.1em;
+}
+@media print {
+  .utrecht-data-placeholder {
+    outline-color: currentColor;
+    outline-style: dashed;
+    outline-width: 0.1em;
+  }
+}
+@media screen and (prefers-contrast: more) {
+  .utrecht-data-placeholder {
+    background-color: var(--utrecht-data-placeholder-high-contrast-background-color, var(--utrecht-data-placeholder-background-color, currentColor));
+  }
+}
+@media screen and (forced-colors: active) {
+  .utrecht-data-placeholder {
+    background-color: GrayText;
+  }
+}
+
+.utrecht-data-placeholder--loading {
+  cursor: var(--utrecht-action-busy-cursor, busy);
+}
+
+/* class name available only for Storybook */
+.utrecht-data-placeholder--print {
+  outline-color: currentColor;
+  outline-style: dashed;
+  outline-width: 0.1em;
+}
+
+/* class name available only for Storybook */
+.utrecht-data-placeholder--forced-colors {
+  background-color: GrayText;
+}
+
+/* class name available only for Storybook */
+.utrecht-data-placeholder--high-contrast {
+  cursor: var(--utrecht-action-busy-cursor, busy);
+}
+
 /**
  * @license EUPL-1.2
  * Copyright (c) 2021 The Knights Who Say NIH! B.V.

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.0.0-alpha.534",
+  "version": "1.0.0-alpha.536",
   "author": "Community for NL Design System",
   "description": "Component library bundle for the Municipality of Utrecht based on the NL Design System architecture",
   "license": "EUPL-1.2",
@@ -26,5 +26,5 @@
     "clean": "rimraf dist/"
   },
   "main": "dist/index.css",
-  "gitHead": "c3bb0bc7cd9fc4dc420dc12f66eb52ac9301c383"
+  "gitHead": "adbf19be0b3de5a03decbfb977e9807fb3616d51"
 }