@duetds/components 6.5.1 → 6.5.3

package/lib/types/components/duet-toolbar-dropdown-link/duet-toolbar-dropdown-link.d.ts

@@ -8,10 +8,20 @@ export declare class DuetToolbarDropdownLink implements ThemeableComponent {
    * Reference to host HTML element.
    */
   element: HTMLElement;
+  /**
+   * Adds accessible label for the button that is only shown for screen readers.
+   * Typically, this label text replaces the visible text on the button for
+   * users who use assistive technology.
+   */
+  accessibleLabel: string;
   /**
    * Theme.
    */
   theme: DuetTheme;
+  /**
+   * Language of the link. Use this only for language selection links.
+   */
+  targetLanguage: "en" | "fi" | "sv";
   /**
    * Href
    */

package/lib/types/components.d.ts

@@ -1577,7 +1577,7 @@ export namespace Components {
          */
         "value": string;
         /**
-          * Variation of button.
+          * Variation of button. Use "button" to render a button element next to the input. Use "revealable" to render a button that reveals the password.
          */
         "variation": DuetVariationType;
     }
@@ -1750,6 +1750,50 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetMenuBarButton {
+        /**
+          * Indicates the id of a related component’s visually focused element.
+         */
+        "accessibleActiveDescendant": string;
+        /**
+          * Use this property to add an aria-controls attribute to the button. Use the attribute to point to the unique id of the content that the button manages.
+         */
+        "accessibleControls": string;
+        /**
+          * Indicates the id of a component that describes the button.
+         */
+        "accessibleDescribedBy": string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription": string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails": string;
+        /**
+          * If a button expands or collapses adjacent content, then use the ariaExpanded prop to add the aria-expanded attribute to the button. Set the value to convey the current expanded (true) or collapsed (false) state of the content.
+         */
+        "accessibleExpanded": boolean;
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel": string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy": string;
+        /**
+          * Indicates the id of a component owned by the button.
+         */
+        "accessibleOwns": string;
+        /**
+          * Use this property to add an aria-haspopup attribute to a button, if you are using it as a menu button.
+         */
+        "accessiblePopup": string;
+        /**
+          * Tells screen reader the element is pressed.
+         */
+        "accessiblePressed": boolean;
         /**
           * Icon
          */
@@ -1764,6 +1808,10 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetMenuBarDropdown {
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel": string;
         /**
           * Icon
          */
@@ -1778,10 +1826,6 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetMenuBarDropdownLink {
-        /**
-          * Caret
-         */
-        "caret": boolean;
         /**
           * Href
          */
@@ -2721,9 +2765,9 @@ export namespace Components {
     }
     interface DuetSlideout {
         /**
-          * Icon name from Duet to display.
+          * Custom color to be used for a circular background, as a design token entered in camelCase or kebab-case..
          */
-        "icon": DuetIconName;
+        "background": DuetColor;
         /**
           * Open
          */
@@ -2744,10 +2788,18 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetSlideoutLink {
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel": string;
         /**
           * Active
          */
         "active": boolean;
+        /**
+          * Caret
+         */
+        "caret": boolean;
         /**
           * Href
          */
@@ -2758,9 +2810,13 @@ export namespace Components {
         "icon": string;
         "menuItem": boolean;
         /**
-          * Size. Small, medium or large.
+          * Size. Inherit, small, medium or large. Inherit value inherits styles from the value in the underlying slot.
          */
         "size": "inherit" | "small" | "medium" | "large";
+        /**
+          * Language of the link. Use this only for language selection links.
+         */
+        "targetLanguage": "en" | "fi" | "sv";
         /**
           * Theme.
          */
@@ -3280,6 +3336,10 @@ export namespace Components {
         "theme": DuetTheme;
     }
     interface DuetToolbarDropdownLink {
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel": string;
         /**
           * Active
          */
@@ -3292,6 +3352,10 @@ export namespace Components {
           * Icon
          */
         "icon": string;
+        /**
+          * Language of the link. Use this only for language selection links.
+         */
+        "targetLanguage": "en" | "fi" | "sv";
         /**
           * Theme.
          */
@@ -5987,7 +6051,7 @@ declare namespace LocalJSX {
          */
         "value"?: string;
         /**
-          * Variation of button.
+          * Variation of button. Use "button" to render a button element next to the input. Use "revealable" to render a button that reveals the password.
          */
         "variation"?: DuetVariationType;
     }
@@ -6152,6 +6216,50 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetMenuBarButton {
+        /**
+          * Indicates the id of a related component’s visually focused element.
+         */
+        "accessibleActiveDescendant"?: string;
+        /**
+          * Use this property to add an aria-controls attribute to the button. Use the attribute to point to the unique id of the content that the button manages.
+         */
+        "accessibleControls"?: string;
+        /**
+          * Indicates the id of a component that describes the button.
+         */
+        "accessibleDescribedBy"?: string;
+        /**
+          * Aria description the button
+         */
+        "accessibleDescription"?: string;
+        /**
+          * Details of the component
+         */
+        "accessibleDetails"?: string;
+        /**
+          * If a button expands or collapses adjacent content, then use the ariaExpanded prop to add the aria-expanded attribute to the button. Set the value to convey the current expanded (true) or collapsed (false) state of the content.
+         */
+        "accessibleExpanded"?: boolean;
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel"?: string;
+        /**
+          * String of id's that indicate alternative labels elements
+         */
+        "accessibleLabelledBy"?: string;
+        /**
+          * Indicates the id of a component owned by the button.
+         */
+        "accessibleOwns"?: string;
+        /**
+          * Use this property to add an aria-haspopup attribute to a button, if you are using it as a menu button.
+         */
+        "accessiblePopup"?: string;
+        /**
+          * Tells screen reader the element is pressed.
+         */
+        "accessiblePressed"?: boolean;
         /**
           * Icon
          */
@@ -6162,6 +6270,10 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetMenuBarDropdown {
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel"?: string;
         /**
           * Icon
          */
@@ -6176,10 +6288,6 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetMenuBarDropdownLink {
-        /**
-          * Caret
-         */
-        "caret"?: boolean;
         /**
           * Href
          */
@@ -7149,9 +7257,9 @@ declare namespace LocalJSX {
     }
     interface DuetSlideout {
         /**
-          * Icon name from Duet to display.
+          * Custom color to be used for a circular background, as a design token entered in camelCase or kebab-case..
          */
-        "icon"?: DuetIconName;
+        "background"?: DuetColor;
         /**
           * Event raised when the menu has been opened. You can prevent the default browser functionality by calling **event.detail.originalEvent.preventDefault()** inside your listener. Additionally, the passed data is available via **event.detail.data**.
          */
@@ -7172,10 +7280,18 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetSlideoutLink {
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel"?: string;
         /**
           * Active
          */
         "active"?: boolean;
+        /**
+          * Caret
+         */
+        "caret"?: boolean;
         /**
           * Href
          */
@@ -7185,9 +7301,13 @@ declare namespace LocalJSX {
          */
         "icon"?: string;
         /**
-          * Size. Small, medium or large.
+          * Size. Inherit, small, medium or large. Inherit value inherits styles from the value in the underlying slot.
          */
         "size"?: "inherit" | "small" | "medium" | "large";
+        /**
+          * Language of the link. Use this only for language selection links.
+         */
+        "targetLanguage"?: "en" | "fi" | "sv";
         /**
           * Theme.
          */
@@ -7718,6 +7838,10 @@ declare namespace LocalJSX {
         "theme"?: DuetTheme;
     }
     interface DuetToolbarDropdownLink {
+        /**
+          * Adds accessible label for the button that is only shown for screen readers. Typically, this label text replaces the visible text on the button for users who use assistive technology.
+         */
+        "accessibleLabel"?: string;
         /**
           * Active
          */
@@ -7730,6 +7854,10 @@ declare namespace LocalJSX {
           * Icon
          */
         "icon"?: string;
+        /**
+          * Language of the link. Use this only for language selection links.
+         */
+        "targetLanguage"?: "en" | "fi" | "sv";
         /**
           * Theme.
          */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duetds/components",
-  "version": "6.5.1",
+  "version": "6.5.3",
   "description": "This package includes Duet Design System Web Components and related utilities.",
   "bugs": {
     "email": "duetdesignsystem@lahitapiola.fi"
@@ -50,9 +50,9 @@
     "body-scroll-lock": "3.1.5"
   },
   "devDependencies": {
-    "@duetds/fonts": "2.0.29",
-    "@duetds/icons": "3.0.29",
-    "@duetds/tokens": "3.0.29",
+    "@duetds/fonts": "2.0.31",
+    "@duetds/icons": "3.0.31",
+    "@duetds/tokens": "3.0.31",
     "@koa/cors": "3.3.0",
     "@rollup/plugin-replace": "3.1.0",
     "@stencil/core": "2.19.3",
@@ -83,5 +83,5 @@
   "collection": "lib/collection/collection-manifest.json",
   "es2015": "lib/esm/index.js",
   "es2017": "lib/esm/index.js",
-  "gitHead": "c6a6655cab03058d79bdcab76297f4e981f00b3f"
+  "gitHead": "0e50c6e2904f63d833c73093eedd72df8cf3d834"
 }

package/lib/dist-custom-elements/p-45377b84.js

@@ -1,265 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent, h, b as Host } from './p-0df84707.js';
-import { i as inheritGlobalTheme } from './p-4ebf1618.js';
-import { D as DuetStringsExternalDefaults } from './p-76f00bd5.js';
-import { a as getLanguage, g as getLocaleString } from './p-ede854e1.js';
-import { g as getColorByName } from './p-535ce3ec.js';
-import { d as defineCustomElement$3 } from './p-dd54924c.js';
-import { d as defineCustomElement$2 } from './p-f0803854.js';
-import { d as defineCustomElement$1 } from './p-21cfd55b.js';
-
-const duetButtonCss = "*,*::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;margin-right:8px !important;margin-bottom:12px !important;position:relative;z-index:1;display:inline-flex;width:auto;max-width:100%;vertical-align:bottom;-webkit-tap-highlight-color:transparent}:host:last-child,:host:last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host{width:100%}}:host(.input-button){z-index:250}:host(.duet-small){margin-right:2px !important;margin-bottom:8px !important}:host(.duet-small):last-child,:host(.duet-small):last-of-type{margin-right:0 !important}@media (max-width: 35.9375em){:host(.duet-small){width:auto}}:host(.duet-expand){width:100% !important}:host(.duet-m-0){margin:0 !important}:host(.duet-fixed){width:auto !important}:host(:last-child){margin-right:0 !important}.duet-button-container{position:relative;width:100%}.duet-button{padding:14px 27px 15px !important;-webkit-user-select:none;user-select:none;position:relative;z-index:100;display:block;width:100%;min-width:8rem;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:1rem;font-weight:600;-webkit-hyphens:auto;hyphens:auto;line-height:1.1;color:#0077b3 !important;text-align:center;text-decoration:none;cursor:pointer;background:transparent;border-style:solid;border-width:2px;border-radius:20rem;transition:background-color 300ms ease, color 300ms ease, border 300ms ease, box-shadow 300ms ease}.duet-button.duet-p-0{padding:0 !important}.duet-button.duet-m-0{margin:0 !important}.duet-button:not(.input-button-primary,.input-button-secondary){font-variant-numeric:tabular-nums}.duet-button.duet-button-text-center{text-align:center !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only){padding:9px 19px 10px !important;min-width:5.3333333333rem;font-size:0.875rem}.duet-button.duet-button-is-small:not(.duet-button-icon-only).icon{padding-left:48px !important}.duet-button.duet-button-is-small:not(.duet-button-icon-only).icon-right{padding-right:48px !important;padding-left:20px !important}.duet-theme-turva .duet-button{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";color:#c60c30 !important}.duet-button .duet-button-contents{position:relative;display:inline-block;margin:0 auto;pointer-events:none}.duet-button.duet-no-wrap{white-space:nowrap}.duet-button.icon{padding-left:52px !important}.duet-button.icon-right{padding-right:52px !important;padding-left:28px !important}.duet-button svg{width:100%;min-width:100%;fill:currentColor}.duet-button .duet-button-icon{position:absolute;top:50%;left:-28px;display:flex;align-items:center;justify-content:center;width:16px;height:16px;margin:0 !important;transform:translateY(-50%)}.duet-button .duet-button-icon duet-icon{width:16px;height:16px}.duet-button .duet-button-icon.right{right:-28px;left:auto}.duet-button .duet-button-icon.large{left:-32px;width:20px;height:20px}.duet-button .duet-button-icon.large duet-icon{width:20px;height:20px}.duet-button .duet-button-icon.large.right{right:-32px;left:auto}.duet-button .duet-button-icon.medium-small{left:-16px;width:10px;height:10px;padding-top:1px}.duet-button .duet-button-icon.medium-small duet-icon{width:10px;height:10px}.duet-button .duet-button-icon.medium-small.right{right:-16px;left:auto}.duet-button .duet-button-icon.small{left:-16px;width:7px;height:7px}.duet-button .duet-button-icon.small duet-icon{width:7px;height:7px}.duet-button .duet-button-icon.small.right{right:-16px;left:auto}.duet-button:focus{outline:0;box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}.duet-theme-turva .duet-button:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-button:active:not([disabled]){opacity:0.75;transition:none}.duet-button.default{border-color:#e1e3e6}.duet-theme-turva .duet-button.default{color:#c60c30 !important;border-color:#e4e4e6}.duet-button.default:hover{border-color:#0077b3}.duet-theme-turva .duet-button.default:hover{border-color:#c60c30}.duet-button.default.duet-button-negative{background-color:white}.duet-theme-turva .duet-button.default.duet-button-negative{background-color:#e4e4e6 !important}.duet-button.default.duet-button-negative:hover{color:#0077b3 !important;border-color:#0077b3}.duet-theme-turva .duet-button.default.duet-button-negative:hover{color:#c60c30 !important;border-color:#c60c30}.duet-button.primary,.duet-button.input-button-primary{color:white !important;background:#0077b3;border-color:#0077b3}.duet-theme-turva .duet-button.primary,.duet-theme-turva .duet-button.input-button-primary{color:white !important;background:#c60c30;border-color:#c60c30}.duet-button.primary:hover,.duet-button.input-button-primary:hover{background:#005f8f;border-color:#005f8f;box-shadow:0 4px 20px rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.primary:hover,.duet-theme-turva .duet-button.input-button-primary:hover{background:#940925;border-color:#940925}.duet-button.primary:focus,.duet-button.input-button-primary:focus{outline:0;box-shadow:0 0 0 1px white, 0 0 0 4px rgba(0, 119, 179, 0.75)}.duet-theme-turva .duet-button.primary:focus,.duet-theme-turva .duet-button.input-button-primary:focus{box-shadow:0 0 0 1px white, 0 0 0 4px rgba(23, 28, 58, 0.7)}.duet-button.secondary,.duet-button.input-button-secondary{color:#00294d !important;background:transparent;border-color:#00294d}.duet-theme-turva .duet-button.secondary,.duet-theme-turva .duet-button.input-button-secondary{color:#171c3a !important;border-color:#171c3a}.duet-button.secondary:hover,.duet-button.input-button-secondary:hover{color:#0077b3 !important;border-color:#0077b3}.duet-theme-turva .duet-button.secondary:hover,.duet-theme-turva .duet-button.input-button-secondary:hover{color:#c60c30 !important;border-color:#c60c30}.duet-button.secondary.duet-button-negative,.duet-button.input-button-secondary.duet-button-negative{color:#e1e3e6 !important;border-color:white}.duet-theme-turva .duet-button.secondary.duet-button-negative,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative{color:#e4e4e6 !important}.duet-button.secondary.duet-button-negative:hover,.duet-button.input-button-secondary.duet-button-negative:hover{color:#0077b3 !important;border-color:#0077b3}.duet-theme-turva .duet-button.secondary.duet-button-negative:hover,.duet-theme-turva .duet-button.input-button-secondary.duet-button-negative:hover{color:#c60c30 !important;border-color:#c60c30}.duet-button.negative{color:#00294d !important;background:white;border-color:white}.duet-theme-turva .duet-button.negative{color:#171c3a !important}.duet-button.negative:hover{color:white !important;background:transparent;border-color:white}.duet-button.negative:focus{outline:0;box-shadow:0 0 0 1px #00294d, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-theme-turva .duet-button.negative:focus{box-shadow:0 0 0 1px #171c3a, 0 0 0 4px rgba(255, 255, 255, 0.7)}.duet-button.destructive-primary{color:white !important;background:#de2362;border-color:#de2362}.duet-theme-turva .duet-button.destructive-primary{color:white !important;background:#e02a0d;border-color:#e02a0d}.duet-button.destructive-primary:hover{background:#b21c4e;border-color:#b21c4e;box-shadow:0 4px 20px rgba(34, 34, 34, 0.1)}.duet-theme-turva .duet-button.destructive-primary:hover{background:#b3220a}.duet-button.destructive,.duet-button.destructive-secondary{color:#de2362 !important;background:white;border-color:#de2362}.duet-theme-turva .duet-button.destructive,.duet-theme-turva .duet-button.destructive-secondary{color:#e02a0d !important;background:white;border-color:#e02a0d}.duet-button.destructive:hover,.duet-button.destructive-secondary:hover{color:white !important;background:#b21c4e;border-color:#b21c4e}.duet-theme-turva .duet-button.destructive:hover,.duet-theme-turva .duet-button.destructive-secondary:hover{color:white !important;background:#b3220a;border-color:#b3220a}.duet-button.plain{min-width:48px;padding-right:0 !important;padding-left:0 !important;line-height:1.5;text-align:left;background:transparent;border:0;border-color:transparent;border-radius:4px}.duet-theme-turva .duet-button.plain{color:#c60c30 !important;background:transparent;border-color:transparent}.duet-button.plain.icon{padding-left:20px !important}.duet-button.plain.icon.icon-right{padding-right:20px !important;padding-left:0 !important}.duet-button.plain.icon.medium{padding-left:24px !important}.duet-button.plain.icon.medium.icon-right{padding-right:24px !important;padding-left:0 !important}.duet-button.plain.icon.large{padding-left:30px !important}.duet-button.plain.icon.large.icon-right{padding-right:30px !important;padding-left:0 !important}.duet-button.plain .duet-button-icon.left{left:-16.6666666667px !important}.duet-button.plain .duet-button-icon.left.medium{left:-24px !important}.duet-button.plain .duet-button-icon.left.large{left:-30px !important}.duet-button.plain .duet-button-icon.right{right:-16.6666666667px !important}.duet-button.plain .duet-button-icon.right.medium{right:-24px !important}.duet-button.plain .duet-button-icon.right.large{right:-30px !important}.duet-button.plain[disabled]{color:#657787 !important;cursor:not-allowed;background:transparent !important;border-color:transparent !important}.duet-theme-turva .duet-button.plain[disabled]{color:transparent !important;cursor:not-allowed;background:transparent !important;border-color:#e4e4e6 !important}.duet-button.plain:hover{color:#004d80 !important;background:transparent !important}.duet-theme-turva .duet-button.plain:hover{color:#940925 !important}.duet-button.plain.duet-button-negative{color:white !important}.duet-theme-turva .duet-button.plain.duet-button-negative{color:#e4e4e6 !important}.duet-button.plain.duet-button-negative:hover{color:#0077b3 !important}.duet-theme-turva .duet-button.plain.duet-button-negative:hover{color:#c60c30 !important}.duet-button.duet-button-icon-only{min-width:48px;min-height:48px;padding:0 !important}.duet-button.duet-button-icon-only .duet-button-contents{position:static}.duet-button.duet-button-icon-only .duet-button-icon.left.large,.duet-button.duet-button-icon-only .duet-button-icon.left.medium,.duet-button.duet-button-icon-only .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button.duet-button.input-button-primary,.duet-button.duet-button.input-button-secondary{box-sizing:content-box;min-width:48px;min-height:48px;padding:0 !important;border-width:1px;border-top-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:0}.duet-button.duet-button.input-button-primary .duet-button-contents,.duet-button.duet-button.input-button-secondary .duet-button-contents{position:static}.duet-button.duet-button.input-button-primary .duet-button-icon.left.large,.duet-button.duet-button.input-button-primary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-primary .duet-button-icon.left.small,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.large,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.medium,.duet-button.duet-button.input-button-secondary .duet-button-icon.left.small{position:absolute;top:50% !important;left:50% !important;padding:0;margin:0;transform:translateX(-50%) translateY(-50%)}.duet-button[disabled],.duet-button[disabled]:hover,.duet-button.duet-button-negative[disabled],.duet-button.duet-button-negative[disabled]:hover{color:#657787 !important;cursor:not-allowed;background:#e1e3e6 !important;border-color:#e1e3e6 !important;box-shadow:none !important}.duet-theme-turva .duet-button[disabled],.duet-theme-turva .duet-button[disabled]:hover,.duet-theme-turva .duet-button.duet-button-negative [disabled],.duet-theme-turva .duet-button.duet-button-negative [disabled]:hover{color:#747475 !important;cursor:not-allowed;background:#e4e4e6 !important;border-color:#e4e4e6 !important}.duet-button-is-loading.primary,.duet-button-is-loading.input-button-primary{color:white}.duet-button-is-loading.default{color:#0077b3}.duet-button-is-loading.default.duet-theme-turva{color:#c60c30}.duet-button-is-loading .duet-button-contents{visibility:hidden;opacity:0}";
-
-const DuetButton = /*@__PURE__*/ proxyCustomElement(class extends H {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.duetFocus = createEvent(this, "duetFocus", 7);
-    this.duetBlur = createEvent(this, "duetBlur", 7);
-    /**
-     * Component event handling.
-     */
-    this.handleClick = (ev) => {
-      // If this button wants to specifically submit a form
-      // climb up the dom to see if we're in a <form>
-      // and if so, then use JS to submit it.
-      // To understand better, see: https://www.hjorthhansen.dev/shadow-dom-form-participation/
-      if (!this.url && this.element.closest("form")) {
-        ev.preventDefault();
-        this.proxyButton.click();
-      }
-    };
-    this.onFocus = () => {
-      this.duetFocus.emit();
-    };
-    this.onBlur = () => {
-      this.duetBlur.emit();
-    };
-    this.accessibleLabel = undefined;
-    this.accessibleControls = undefined;
-    this.accessiblePopup = "false";
-    this.accessibleActiveDescendant = undefined;
-    this.accessibleOwns = undefined;
-    this.accessibleDescribedBy = undefined;
-    this.accessibleDetails = undefined;
-    this.accessibleLabelledBy = undefined;
-    this.accessibleDescription = undefined;
-    this.accessibleExpanded = undefined;
-    this.accessiblePressed = undefined;
-    this.loading = false;
-    this.variation = "default";
-    this.negative = false;
-    this.theme = "";
-    this.margin = "auto";
-    this.padding = "auto";
-    this.centerText = false;
-    this.wrapping = "auto";
-    this.expand = false;
-    this.fixed = false;
-    this.disabled = false;
-    this.name = undefined;
-    this.value = undefined;
-    this.identifier = undefined;
-    this.submit = false;
-    this.external = false;
-    this.language = getLanguage();
-    this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
-    this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
-    this.icon = "";
-    this.color = "";
-    this.iconRight = false;
-    this.iconSize = "medium";
-    this.size = "medium";
-    this.iconOnly = false;
-    this.url = undefined;
-  }
-  /**
-   * Component lifecycle events.
-   */
-  componentWillLoad() {
-    inheritGlobalTheme(this);
-    if (this.url && this.external && this.icon) {
-      console.warn("[DUET]: Button used as an external link will override any icon that is set");
-    }
-  }
-  connectedCallback() {
-    this.proxyButton = document.createElement("button");
-    this.proxyButton.style.display = "none";
-    this.syncToProxyButton();
-    if (!this.url && this.element.closest("form")) {
-      this.element.insertAdjacentElement("beforebegin", this.proxyButton);
-    }
-  }
-  disconnectedCallback() {
-    this.proxyButton.remove();
-    this.proxyButton = null;
-  }
-  syncToProxyButton() {
-    this.proxyButton.type = this.getButtonType();
-    this.proxyButton.disabled = this.disabled;
-    // attributes should be removed in cases where name/value is not set
-    if (this.name != null) {
-      this.proxyButton.name = this.name;
-    }
-    else {
-      this.proxyButton.removeAttribute("name");
-    }
-    if (this.value != null) {
-      this.proxyButton.value = this.value;
-    }
-    else {
-      this.proxyButton.removeAttribute("value");
-    }
-  }
-  getButtonType() {
-    return this.submit ? "submit" : "button";
-  }
-  /**
-   * Sets focus on the specified `duet-button`. Use this method instead of the global
-   * `button.focus()`.
-   */
-  async setFocus(options) {
-    if (this.nativeButton) {
-      this.nativeButton.focus(options);
-    }
-  }
-  /**
-   * render() function.
-   * Always the last one in the class.
-   */
-  render() {
-    const isExternalLink = this.external && this.url;
-    // enforce consistency for external links
-    const icon = isExternalLink ? "action-new-window" : this.icon;
-    const iconRight = isExternalLink ? true : this.iconRight;
-    const commonChildren = (h("span", { class: "duet-button-contents", style: { color: getColorByName(this.color) } }, icon && (h("div", { "aria-hidden": "true", class: {
-        "duet-button-icon": true,
-        left: !iconRight,
-        right: iconRight,
-        [this.iconSize]: true,
-      } }, h("duet-icon", { size: "auto", margin: "none", name: icon, color: "currentColor" }))), h("slot", null)));
-    const commonProps = {
-      onFocus: this.onFocus,
-      onBlur: this.onBlur,
-      ref: button => (this.nativeButton = button),
-      id: this.identifier,
-      class: {
-        "duet-m-0": this.margin === "none",
-        "duet-p-0": this.padding === "none",
-        "duet-no-wrap": this.wrapping === "none",
-        "duet-button": true,
-        "duet-button-is-small": this.size === "small",
-        "duet-button-icon-only": this.iconOnly,
-        "duet-button-text-center": this.centerText,
-        "duet-button-negative": this.negative || this.variation === "negative",
-        [this.variation]: true,
-        disabled: this.disabled,
-        icon: !!icon,
-        "icon-right": iconRight,
-        [this.iconSize]: true,
-      },
-      "aria-controls": this.accessibleControls,
-      "aria-label": this.accessibleLabel,
-      "aria-expanded": this.accessibleExpanded != null ? this.accessibleExpanded.toString() : undefined,
-      "aria-activedescendant": this.accessibleActiveDescendant,
-      "aria-owns": this.accessibleOwns,
-      "aria-describedby": this.accessibleDescribedBy,
-      "aria-labelledby": this.accessibleLabelledBy,
-      "aria-details": this.accessibleDetails,
-      "aria-description": this.accessibleDescription,
-    };
-    return (h(Host, { onClick: this.handleClick, class: {
-        "duet-m-0": this.margin === "none",
-        "duet-small": this.size === "small",
-        "duet-fixed": this.fixed,
-        "duet-expand": this.expand,
-        "input-button": this.variation === "input-button-primary" || this.variation === "input-button-secondary",
-      } }, h("div", { class: {
-        "duet-button-container": true,
-        "duet-button-is-loading": this.loading,
-        "duet-theme-turva": this.theme === "turva",
-        "duet-button-negative": this.negative || this.variation === "negative",
-        [this.variation]: true,
-      } }, this.url ? (h("a", Object.assign({}, commonProps, { href: this.url, target: this.external ? "_blank" : "_self", rel: this.external ? "noopener" : undefined }), commonChildren, this.external && h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal))) : (h("button", Object.assign({}, commonProps, { type: this.getButtonType(), disabled: this.disabled, name: this.name, value: this.value, "aria-pressed": this.accessiblePressed != null ? this.accessiblePressed.toString() : undefined, "aria-haspopup": this.accessiblePopup != null ? this.accessiblePopup.toString() : undefined, "aria-disabled": this.disabled }), commonChildren)), this.loading && h("duet-spinner", { color: "currentColor" }))));
-  }
-  get element() { return this; }
-  static get watchers() { return {
-    "disabled": ["syncToProxyButton"],
-    "submit": ["syncToProxyButton"],
-    "value": ["syncToProxyButton"],
-    "name": ["syncToProxyButton"]
-  }; }
-  static get style() { return duetButtonCss; }
-}, [1, "duet-button", {
-    "accessibleLabel": [1, "accessible-label"],
-    "accessibleControls": [1, "accessible-controls"],
-    "accessiblePopup": [1, "accessible-popup"],
-    "accessibleActiveDescendant": [1, "accessible-active-descendant"],
-    "accessibleOwns": [1, "accessible-owns"],
-    "accessibleDescribedBy": [1, "accessible-described-by"],
-    "accessibleDetails": [1, "accessible-details"],
-    "accessibleLabelledBy": [1, "accessible-labelled-by"],
-    "accessibleDescription": [1, "accessible-description"],
-    "accessibleExpanded": [4, "accessible-expanded"],
-    "accessiblePressed": [4, "accessible-pressed"],
-    "loading": [4],
-    "variation": [1],
-    "negative": [4],
-    "theme": [1025],
-    "margin": [1],
-    "padding": [1],
-    "centerText": [4, "center-text"],
-    "wrapping": [1],
-    "expand": [4],
-    "fixed": [4],
-    "disabled": [516],
-    "name": [1],
-    "value": [1],
-    "identifier": [1],
-    "submit": [516],
-    "external": [4],
-    "language": [1],
-    "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
-    "accessibleLabelExternal": [1, "accessible-label-external"],
-    "icon": [1],
-    "color": [1],
-    "iconRight": [4, "icon-right"],
-    "iconSize": [1, "icon-size"],
-    "size": [1],
-    "iconOnly": [4, "icon-only"],
-    "url": [513],
-    "setFocus": [64]
-  }]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["duet-button", "duet-icon", "duet-spinner", "duet-visually-hidden"];
-  components.forEach(tagName => { switch (tagName) {
-    case "duet-button":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, DuetButton);
-      }
-      break;
-    case "duet-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "duet-spinner":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-    case "duet-visually-hidden":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$1();
-      }
-      break;
-  } });
-}
-
-export { DuetButton as D, defineCustomElement as d };

package/lib/duet/p-0112579c.entry.js

@@ -1,4 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import{r as t,c as i,h as e,F as a,H as n,g as s}from"./p-ab11408b.js";import{i as r}from"./p-4ebf1618.js";import{c as o}from"./p-c1325e35.js";import{d as h}from"./p-0b3f675e.js";import{j as p,k as l,d,b as u,a as c,c as g,l as m,m as b}from"./p-54f35a79.js";import{g as v}from"./p-ede854e1.js";import"./p-5a9d75e1.js";const k=class{constructor(e){t(this,e),this.duetPageChange=i(this,"duetPageChange",3),this.listId=o("duet-pagination-list"),this.actionChain=async(t,i)=>{if(0===t)this.current=1;else if(i!==t){const i=Math.ceil(t/this.visibleItems)-1;i!==this.internalSectionIndex&&(this.internalSectionIndex=i,await this.setFocus())}return!0},this.emitPageEvent=h(((t,i)=>{const e=Number(i||this.current);this.duetPageChange.emit({component:"duet-pagination",from:e*this.take,to:e*this.take+this.take,current:e,take:this.take,type:"page",originalEvent:t})}),100),this.getEnteredNumber=h((t=>{this.emitPageEvent(t,this.numbersStore),this.current=Number(this.numbersStore),this.numbersStore="",this.duetPageChange.emit({component:"duet-pagination",from:this.current*this.take,to:this.current*this.take+this.take,current:this.current,take:this.take,type:"jump",originalEvent:t})}),500),this.numbersStore="",this.totalPages=10,this.internalSectionIndex=0,this.theme="",this.jumpString="...",this.variation="default",this.accessibleDescribedBy=void 0,this.accessibleDetails=void 0,this.accessibleLabelledBy=void 0,this.accessibleDescription=void 0,this.accessibleLabelsDefaults={en:{next_page:"Next page",previous_page:"Previous page",first_page:"First page",last_page:"Last page",jump_to:"Jump to page",go_to:"Go to page",description:"You may use arrow keys to select page number, or enter a page number when this element is in focus to jump to a page",pagination_label:"Pagination, choose a number to jump to a page",prev_section:"Show previous {0} page numbers, screen reader user should use arrowkeys to navigate",next_section:"Show next {0} page numbers, screen reader user should use arrowkeys to navigate"},fi:{next_page:"Seuraava sivu",previous_page:"Edellinen sivu",first_page:"Ensimmäinen sivu",last_page:"Viimeinen sivu",jump_to:"Siirry sivulle",go_to:"Siirry sivulle",description:"Voit käyttää nuolinäppäimiä sivunumeron valitsemiseen, tai kirjoittaa sivunumeron, jos tämä elementti on aktiivinen, siirtymään sivulle",pagination_label:"Sivutus, valitse sivunumero siirtyäksesi sivulle",prev_section:"Näytä edelliset {0} sivunumerot, käyttäjän pitää käyttää nuolinäppäimiä navigoidaksesi",next_section:"Näytä seuraavat {0} sivunumerot, käyttäjän pitää käyttää nuolinäppäimiä navigoidaksesi"},sv:{next_page:"Nästa sida",previous_page:"Föregående sida",first_page:"Första sidan",last_page:"Sista sidan",jump_to:"Hoppa till sida",go_to:"Hoppa till sida",description:"Du kan använda piltangenterna för att välja sida, eller skriva in sida när elementet är i fokus för att hoppa till en sida",pagination_label:"Sidutning, välj en siffra för att hoppa till en sida",prev_section:"Visa föregående {0} sidnummer, skrivbordsläsare ska använda piltangenterna för att navigera",next_section:"Visa nästa {0} sidnummer, skrivbordsläsare ska använda piltangenterna för att navigera"}},this.accessibleLabels=v(this.accessibleLabelsDefaults),this.take=5,this.visibleItems=5,this.total=1e3,this.ariaControls="",this.current=1}watchPropTotalHandler(){return this.calculatePageTake(),!0}watchStateHandler(t,i){return this.actionChain(t,i)}componentWillLoad(){this.internalSectionIndex=Math.ceil(this.current/this.visibleItems)-1,this.calculatePageTake(),r(this)}componentWillRender(){0!==this.internalSectionIndex&&this.internalSectionIndex!==this.totalPages&&this.calculatePageTake()}componentDidRender(){this.setFocus()}calculatePageTake(){this.totalPages=Math.ceil(this.total/this.take)}async onMouseHandler(t,i){t.preventDefault(),t.stopPropagation(),this.current=this.current+i,this.emitPageEvent(t)}async onKeyboardDown(t){let i=this.current;(d(t)||u(t))&&i--,(c(t)||g(t))&&i++,p(t)&&i<=this.totalPages&&(this.current=i,this.emitPageEvent(t)),l(t)&&this.shouldDisplayNavigation()&&(this.numbersStore=this.numbersStore+t.key,Number(this.numbersStore)>this.totalPages&&(this.numbersStore=this.totalPages+""),this.getEnteredNumber(t))}async setFocus(){const t=this.nativeNav.querySelector("li.duet-pagination-item-is-active duet-button");t&&await t.setFocus()}pageClickHandler(t){t.preventDefault();const i=Number(t.target.getAttribute("data-id"));this.current=i,this.emitPageEvent({},i)}sectionClickHandler(t,i){t.preventDefault();let e=this.internalSectionIndex+i;e*(this.take*this.visibleItems)>this.total&&(e=this.internalSectionIndex),this.internalSectionIndex=e>=0?e:0}jumpToStart(t){t.preventDefault(),this.internalSectionIndex=0,this.current=1,this.emitPageEvent(t)}jumpToEnd(t){t.preventDefault(),this.internalSectionIndex=Math.ceil(this.totalPages/this.take-1),this.current=this.totalPages,this.emitPageEvent(t)}renderPageNumbers(){const t=[];let i=this.internalSectionIndex*this.visibleItems;do{if(i++,i>this.totalPages)break;t.push(e("li",{class:{"duet-pagination-item":!0,"duet-pagination-item-is-active":i===this.current},role:"menuitem"},e("duet-button",{class:{"duet-pagination-link":!0},color:i!==this.current?"secondary":"primary","data-id":i,"center-text":!0,variation:"plain",margin:"none",accessibleLabel:`${this.accessibleLabels.go_to} ${i}`,onClick:t=>this.pageClickHandler(t)},e("div",{class:"duet-pagination-page-number","aria-hidden":!0},i))))}while(i<this.visibleItems+this.internalSectionIndex*this.visibleItems);return t}shouldDisplayNavigation(){return"compact"!==this.variation&&!(2*this.visibleItems>this.total/this.take)}render(){return e(n,{onKeyDown:t=>this.onKeyboardDown(t)},e("nav",{role:"navigation","aria-labelledby":this.accessibleLabelledBy?`${this.accessibleLabelledBy} ${this.listId}`:this.listId,"aria-describedby":this.accessibleDescribedBy?`${this.accessibleDescribedBy} ${this.listId}`:this.listId,"aria-descriptions":this.accessibleDescription,"aria-details":this.accessibleDetails,ref:t=>this.nativeNav=t,"aria-controls":this.ariaControls,class:{"duet-pagination-nav":!0,[`duet-pagination-variation-${this.variation}`]:!0}},""!==this.numbersStore&&e("div",{"aria-live":"assertive","aria-relevant":"text",class:"duet-pagination-overlay","aria-label":`${this.accessibleLabels.jump_to} ${this.numbersStore}`,part:"navigation-overlay"},e("duet-badge",null,"jump to page : ",this.numbersStore)),e("ol",{id:this.listId,class:{"duet-pagination":!0,"duet-pagination-is-dimmed":""!==this.numbersStore},role:"menubar","aria-label":this.accessibleLabels.pagination_label,"aria-description":this.accessibleLabels.description},e("li",{class:{"duet-pagination-page-button":!0,"duet-pagination-button-first":!0},role:"menuitem",part:"navigation-arrow"},e("duet-action-button",{disabled:0===this.internalSectionIndex&&this.current<=1,"data-direction":"back",onClick:t=>this.onMouseHandler(t,-1),"accessible-label":this.accessibleLabels.previous_page,"icon-name":"action-arrow-left-small"})),0!==this.internalSectionIndex&&this.shouldDisplayNavigation()&&e(a,null,e("li",{class:"duet-pagination-item",role:"menuitem",part:"navigation-jump"},e("duet-button",{class:"duet-pagination-link duet-pagination-link-jump-back","center-text":"true",variation:"plain",color:"secondary",margin:"none",accessibleLabel:this.accessibleLabels.first_page,onClick:t=>this.jumpToStart(t)},e("div",{class:"duet-pagination-page-number"},"1"))),e("li",{class:"duet-pagination-item",role:"menuitem",part:"navigation-section"},e("duet-button",{class:"duet-pagination-link duet-pagination-link-dots-back","center-text":"true",color:"secondary",variation:"plain",margin:"none",accessibleLabel:this.accessibleLabels.prev_section.replace("{0}",`${this.visibleItems}`),onClick:t=>this.sectionClickHandler(t,-1)},e("div",{class:"duet-pagination-page-number","aria-hidden":"true"},"...")))),this.renderPageNumbers(),this.internalSectionIndex*(this.visibleItems+2)<this.totalPages&&this.shouldDisplayNavigation()&&e(a,null,e("li",{class:"duet-pagination-item",role:"menuitem",part:"navigation-section"},e("duet-button",{class:"duet-pagination-link duet-pagination-link-dots-forward","center-text":"true",color:"secondary",variation:"plain",margin:"none",accessibleLabel:this.accessibleLabels.next_section.replace("{0}",`${this.visibleItems}`),onClick:t=>this.sectionClickHandler(t,1)},e("div",{class:"duet-pagination-page-number","aria-hidden":"true"},"..."))),e("li",{class:"duet-pagination-item",role:"menuitem",part:"navigation-jump"},e("duet-button",{class:"duet-pagination-link duet-pagination-link-jump-forward","center-text":"true",color:"secondary",variation:"plain",margin:"none",accessibleLabel:this.accessibleLabels.last_page,onClick:t=>this.jumpToEnd(t)},e("div",{class:"duet-pagination-page-number"},this.totalPages)))),e("li",{class:{"duet-pagination-page-button":!0,"duet-pagination-button-last":!0},role:"menuitem",part:"navigation-arrow"},e("duet-action-button",{disabled:this.current===this.totalPages&&this.internalSectionIndex===Math.ceil(this.totalPages/this.visibleItems)-1,class:"duet-date-dialog-next","accessible-label":this.accessibleLabels.next_page,onClick:t=>this.onMouseHandler(t,1),"icon-name":"action-arrow-right-small"})))))}get element(){return s(this)}static get watchers(){return{total:["watchPropTotalHandler"],current:["watchStateHandler"]}}};k.style="*,*::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:inline-block;margin:0 auto}.duet-pagination-nav{position:relative}.duet-pagination ::part(button){border:0}.duet-pagination,.duet-pagination li{display:flex;flex-wrap:wrap;gap:0.1rem;align-items:center}.duet-pagination-item-is-active .duet-pagination-page-number{border-bottom-color:inherit;border-bottom-style:solid;border-bottom-width:2px}.duet-pagination duet-button{width:30px;min-width:36px;font-weight:600;text-decoration:none;border-left-width:0}.duet-pagination-overlay{position:absolute;top:1rem;z-index:300;width:100%;text-align:center}.duet-pagination.duet-pagination-is-dimmed{opacity:0.5}";const f=class{constructor(e){t(this,e),this.duetRangeStepUpdate=i(this,"duetRangeStepUpdate",7),this.leftBn=o("duetRangeStepper-left"),this.rightBn=o("duetRangeStepper-right"),this.handleClick=(t,i)=>{t.preventDefault(),this.stepIndex+=i,this.clampStepIndex(),this.handleStepClick(t)},this.theme="",this.stepIndex=1,this.stepSize=50,this.total=1e3,this.ariaLabelsDefaults={en:{next_increment:"Next range increment",previous_increment:"Previous range increment",x_of_y:"{0}–{1} of {2}"},fi:{next_increment:"Seuraava välillä",previous_increment:"Edellinen välillä",x_of_y:"{0}–{1} / {2}"},sv:{next_increment:"Nästa intervall",previous_increment:"Föregående intervall",x_of_y:"{0}–{1} av {2}"}},this.ariaLabels=v(this.ariaLabelsDefaults),this.ariaControls=""}watchStepIndexStateHandler(t){this.element.shadowRoot.childElementCount>0&&(t<=1?(this.leftBnRef.setAttribute("disabled",""),this.rightBnRef.focus()):this.leftBnRef.removeAttribute("disabled"),t>=this.total/this.stepSize?(this.rightBnRef.setAttribute("disabled",""),this.leftBnRef.focus()):this.rightBnRef.removeAttribute("disabled"))}watchStepSizeStateHandler(t,i){t!==i&&this.stepIndex*t>this.total&&(this.stepIndex=Math.ceil(this.total/t))}handleStepClick(t){this.duetRangeStepUpdate.emit({originalEvent:t,component:"duet-range-stepper",from:this.getFrom(),to:this.getTo(),index:this.stepIndex})}componentWillLoad(){r(this),this.clampStepIndex()}componentDidLoad(){this.watchStepIndexStateHandler(this.stepIndex)}clampStepIndex(){this.stepIndex<1?this.stepIndex=1:this.stepIndex*this.stepSize>this.total&&(this.stepIndex=Math.ceil(this.total/this.stepSize))}getFrom(){return Math.floor((this.stepIndex-1)*this.stepSize)+1}getTo(){return Math.min(Math.floor(this.stepIndex*this.stepSize),this.total)}generateStepSize(){return this.ariaLabels.x_of_y.replace("{0}",String(this.getFrom())).replace("{1}",String(this.getTo())).replace("{2}",String(this.total))}async onKeyboardDown(t){let i=this.stepIndex,e=1;(d(t)||u(t)||m(t))&&(i--,e=-1,this.leftBnRef.focus()),(c(t)||g(t)||b(t))&&(i++,e=1),p(t)&&i>0&&i*this.stepSize<=this.total&&this.handleClick(t,e)}render(){return e("div",{class:{"duet-range-stepper":!0,"duet-theme-turva":"turva"===this.theme},onKeyDown:t=>this.onKeyboardDown(t),"aria-controls":this.ariaControls},e("span",{class:"duet-range-step-counter",part:"range-numbers"},this.generateStepSize()),e("duet-action-button",{class:"duet-range-step-button duet-range-step-minus",onClick:t=>this.handleClick(t,-1),id:this.leftBn,"accessible-label":this.ariaLabels.previous_increment,ref:t=>this.leftBnRef=t,part:"navigation-arrow",iconName:"action-arrow-left-small"}),e("duet-action-button",{class:"duet-range-step-button duet-range-step-plus",onClick:t=>this.handleClick(t,1),"accessible-label":this.ariaLabels.next_increment,id:this.rightBn,ref:t=>this.rightBnRef=t,part:"navigation-arrow",iconName:"action-arrow-right-small"}))}get element(){return s(this)}static get watchers(){return{stepIndex:["watchStepIndexStateHandler"],stepSize:["watchStepSizeStateHandler"]}}};f.style="*,*::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:inline-block;margin:0 auto}.duet-range-stepper{display:flex;flex-wrap:wrap;gap:0;align-items:baseline;justify-content:center;min-width:30px;min-height:30px;font-weight:600;text-decoration:none;border-left-width:0}.duet-range-stepper{white-space:nowrap}.duet-range-stepper .duet-range-step-counter{font-weight:600;color:#00294d}.duet-range-stepper ::part(button){border:0}";export{k as duet_pagination,f as duet_range_stepper}