@duetds/components 6.2.3 → 6.2.5

package/lib/cjs/duet-cookie-consent.cjs.entry.js

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1420909f.js');
+const index = require('./index-d2f05eb8.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 
 const duetCookieConsentCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:fixed;right:0;bottom:0;left:0;z-index:950;display:block;width:100%;box-shadow:0 2px 20px 0 rgba(0, 0, 0, 0.2)}@media (min-width: 48em){:host{right:28px;bottom:28px;left:auto;width:25rem}}:host(:focus){outline:0}:host(.user-is-tabbing:focus){border-radius:4px;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing.duet-theme-turva:focus){box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-cookie-consent{padding:20px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:0.875rem;color:white !important;background-color:rgba(0, 21, 39, 0.9)}@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none){.duet-cookie-consent{background:rgba(0, 21, 39, 0.8);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}}.duet-cookie-consent.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background-color:rgba(12, 14, 29, 0.9)}@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none){.duet-cookie-consent.duet-theme-turva{background:rgba(12, 14, 29, 0.8)}}@media (min-width: 48em){.duet-cookie-consent{padding:20px;border-radius:4px}}.duet-cookie-consent-content{display:flex;align-items:center;max-width:1110px;margin:0 auto}.duet-cookie-consent-content .expand{flex:1}::slotted(a){font-weight:600;color:white !important;text-decoration:underline;white-space:nowrap}::slotted(a[target=_blank]){padding-right:16px;background:url(\"data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjZmZmIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTEwLjUgMmExLjUgMS41IDAgMDEuMTQgM0gzLjc1Yy0uMzggMC0uNy4yOC0uNzQuNjVsLS4wMS4xdjE0LjVjMCAuMzguMjguNy42NS43NGwuMS4wMWgxNC41Yy4zOCAwIC43LS4yOC43NC0uNjVsLjAxLS4xdi02Ljg5YTEuNSAxLjUgMCAwMTMgMHY2Ljg5QTMuNzUgMy43NSAwIDAxMTguMjUgMjRIMy43NUEzLjc1IDMuNzUgMCAwMTAgMjAuMjVWNS43NUEzLjc1IDMuNzUgMCAwMTMuNzUgMnptMTItMmMuNzggMCAxLjQyLjYgMS41IDEuMzZWNy41YTEuNSAxLjUgMCAwMS0zIC4xNFY1LjEybC01LjQ0IDUuNDRhMS41IDEuNSAwIDAxLTIuMjItMmwuMS0uMTJMMTguODggM0gxNi41QTEuNSAxLjUgMCAwMTE1IDEuNjRWMS41YzAtLjc4LjYtMS40MiAxLjM2LTEuNWguMTR6Ii8+PC9zdmc+\") no-repeat right 50%;background-size:12px 10px}::slotted(a:focus){outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva ::slotted(a:focus){outline:0;box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}";
@@ -14,18 +14,12 @@ const DuetCookieConsent = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.duetCookieConsent = index.createEvent(this, "duetCookieConsent", 7);
-    /**
-     * Adds accessible label for the cookie consent ok button.
-     */
-    this.accessibleLabel = "Hyväksyn evästeiden käytön";
-    /**
-     * Theme of the cookie consent banner.
-     */
-    this.theme = "";
     this.handleClick = e => {
       e.preventDefault();
       this.duetCookieConsent.emit({ component: "duet-cookie-consent" });
     };
+    this.accessibleLabel = "Hyväksyn evästeiden käytön";
+    this.theme = "";
   }
   /**
    * Component lifecycle events.

package/lib/cjs/duet-date-picker.cjs.entry.js

@@ -5,10 +5,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1420909f.js');
+const index = require('./index-d2f05eb8.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 const createId = require('./create-id-c3b984b1.js');
-const focusUtils = require('./focus-utils-53db3623.js');
+const focusUtils = require('./focus-utils-18ea61a6.js');
 const languageUtils = require('./language-utils-4f62a7db.js');
 require('./string-utils-5cadd058.js');
 
@@ -416,112 +416,6 @@ const DuetDatePicker = class {
     this.initialTouchX = null;
     this.initialTouchY = null;
     this.focusTarget = null;
-    this.open = false;
-    this.focusedDay = new Date();
-    this.inputValue = "";
-    /**
-     * Theme of the component.
-     */
-    this.theme = "";
-    /**
-     * Expands the date picker input to fill 100% of the container width.
-     */
-    this.expand = false;
-    /**
-     * Name of the date picker input.
-     */
-    this.name = "";
-    /**
-     * Adds a unique identifier for the date picker input.
-     */
-    this.identifier = "";
-    /**
-     * Label for the date picker input.
-     */
-    this.label = "";
-    /**
-     * Controls the margin of the component.
-     */
-    this.margin = "auto";
-    /**
-     * The currently active language. This setting changes the month/year/day.
-     * names and button labels as well as all screen reader labels.
-     * @deprecated this is now handled via the html lang tag, and is no longer used - kept to avoid breaking changes and ease unit testing.
-     * @default "fi"
-     */
-    this.language = languageUtils.getLanguage();
-    /**
-     * Placeholder defaults.
-     * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
-     */
-    this.placeholderDefaults = {
-      fi: "pp.kk.vvvv",
-      en: "dd.mm.yyyy",
-      sv: "dd.mm.åååå",
-    };
-    /**
-     * Hint text to display before the user types into the date picker input.
-     * @default { fi: "pp.kk.vvvv", en: "dd.mm.yyyy", sv: "dd.mm.åååå" }
-     */
-    this.placeholder = languageUtils.getLocaleString(this.placeholderDefaults, this.language);
-    /**
-     * If form input field has a placeholder text, and user types anything (causing the text to dissapear),
-     * settings this to true will "echo" it into the caption slot - this option will be false by default for the next few versions, but will eventually be true by default (scheduled for 4.30.0)
-     */
-    this.echoPlaceholder = false;
-    /**
-     * Makes the date picker input component disabled. This prevents users from being able to
-     * interact with the input, and conveys its inactive state to assistive technologies.
-     */
-    this.disabled = false;
-    /**
-     * Display the date picker input in error state along with an error message.
-     */
-    this.error = "";
-    /**
-     * Visually hide the label, but still show it to screen readers.
-     */
-    this.labelHidden = false;
-    /**
-     * Set whether the input is required or not. Please note that this is necessary for
-     * accessible inputs when the user is required to fill them. When using this property
-     * you need to also set “novalidate” attribute to your form element to prevent
-     * browser from displaying its own validation errors.
-     */
-    this.required = false;
-    /**
-     * Forces the opening direction of the calendar modal to be always left or right.
-     * This setting can be useful when the input is smaller than the opening date picker
-     * would be as by default the picker always opens towards right.
-     */
-    this.direction = "right";
-    /**
-     * Tooltip to display next to the label of the date picker input.
-     */
-    this.tooltip = "";
-    /**
-     * With direction setting you can force the tooltip to always open towards left
-     * or right instead of automatically determining the direction.
-     */
-    this.tooltipDirection = "auto";
-    /**
-     * Date value. Must be in IS0-8601 format: YYYY-MM-DD
-     */
-    this.value = "";
-    /**
-     * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
-     * This setting can be used alone or together with the max property.
-     */
-    this.min = "";
-    /**
-     * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
-     * This setting can be used alone or together with the min property.
-     */
-    this.max = "";
-    /**
-     * Increment to add to years, defaults to 10 for simplicity, if you need a larger selectionspace you can set it to 100
-     */
-    this.incrementYears = 10;
     this.enableActiveFocus = () => {
       this.focusTarget = "day-button";
     };
@@ -620,6 +514,41 @@ const DuetDatePicker = class {
         this.setValue(parsed);
       }
     };
+    this.open = false;
+    this.focusedDay = new Date();
+    this.inputValue = "";
+    this.theme = "";
+    this.expand = false;
+    this.name = "";
+    this.identifier = "";
+    this.label = "";
+    this.caption = undefined;
+    this.margin = "auto";
+    this.language = languageUtils.getLanguage();
+    this.placeholderDefaults = {
+      fi: "pp.kk.vvvv",
+      en: "dd.mm.yyyy",
+      sv: "dd.mm.åååå",
+    };
+    this.placeholder = languageUtils.getLocaleString(this.placeholderDefaults, this.language);
+    this.echoPlaceholder = false;
+    this.disabled = false;
+    this.error = "";
+    this.labelHidden = false;
+    this.role = undefined;
+    this.accessibleActiveDescendant = undefined;
+    this.accessibleControls = undefined;
+    this.accessibleOwns = undefined;
+    this.accessibleDescribedBy = undefined;
+    this.required = false;
+    this.direction = "right";
+    this.tooltip = "";
+    this.tooltipDirection = "auto";
+    this.value = "";
+    this.min = "";
+    this.max = "";
+    this.incrementYears = 10;
+    this.validity = undefined;
   }
   updateValidity() {
     this.determineValidity(parseISODate(this.value));

package/lib/cjs/duet-divider_2.cjs.entry.js

@@ -5,7 +5,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-1420909f.js');
+const index = require('./index-d2f05eb8.js');
 const themeableComponent = require('./themeable-component-fdeaef9f.js');
 
 const duetDividerCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;width:100%}.duet-divider{-webkit-user-select:none;user-select:none;display:block;width:100%;height:1px;margin-top:36px !important;margin-bottom:28px;background:#e1e3e6}.duet-divider.duet-p-0{padding:0 !important}.duet-divider.duet-m-0{margin:0 !important}.duet-divider.duet-m-s{margin-bottom:16px !important;margin-top:0 !important}.duet-divider.duet-theme-turva{background:#e4e4e6}";
@@ -13,13 +13,7 @@ const duetDividerCss = "*,*::after,*::before{box-sizing:border-box;padding:0;mar
 const DuetDivider = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /**
-     * Theme of the divider.
-     */
     this.theme = "";
-    /**
-     * Controls the margin of the component.
-     */
     this.margin = "auto";
   }
   /**
@@ -49,18 +43,8 @@ const duetSpacerCss = ":host{box-sizing:border-box;padding:0;margin:0;background
 const DuetSpacer = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    /**
-     * Size variation of the spacer. Can be any of the spacing tokens.
-     */
     this.size = "medium";
-    /**
-     * Direction of the space added.
-     */
     this.direction = "vertical";
-    /**
-     * Adjusts the breakpoint where the spacer is shown in. The functionality
-     * follows 1:1 the media queries defined in design tokens.
-     */
     this.breakpoint = "";
   }
   /**