@limetech/lime-elements 40.2.5 → 40.4.0

package/dist/collection/components/pagination/pagination.util.js

@@ -0,0 +1,113 @@
+/**
+ * How many positions are rendered at once, counting both page numbers and gap
+ * markers. Constant, so the control keeps its width as the user pages through
+ * a set — a gap and a page number take up the same room, so what matters is
+ * how many positions there are, not how many of them are numbers.
+ */
+export const VISIBLE_SLOTS = 7;
+/** How many pages to keep either side of the current one. */
+const SIBLINGS = 1;
+const FIRST_PAGE = 1;
+/**
+ * Build the list of positions to render for a given page count.
+ *
+ * The first and the last page are always included, so both ends of the set are
+ * always one click away. The rest of the room goes to the pages around the
+ * current one, and whatever is skipped becomes a gap.
+ *
+ * `Number.isSafeInteger` rather than `Number.isInteger`: past 2^53 arithmetic
+ * on page numbers stops being exact. The component validates these too; this
+ * guards them again because the cost of being wrong here is a wrong window
+ * during render.
+ *
+ * @param currentPage - the page the user is on, 1-based
+ * @param totalPages - how many pages there are in total
+ * @returns the positions to render, in order
+ */
+export function getPageSlots(currentPage, totalPages) {
+    if (!Number.isSafeInteger(totalPages) || totalPages < FIRST_PAGE) {
+        return [];
+    }
+    const pages = collectVisiblePages(clampToSet(currentPage, totalPages), totalPages);
+    return withGaps(pages);
+}
+/**
+ * @param page - the page to pull into the set
+ * @param totalPages - how many pages there are in total
+ * @returns a whole page number within `1..totalPages`
+ */
+function clampToSet(page, totalPages) {
+    if (!Number.isSafeInteger(Math.floor(page))) {
+        return FIRST_PAGE;
+    }
+    return Math.min(Math.max(FIRST_PAGE, Math.floor(page)), totalPages);
+}
+/**
+ * Pick which page numbers to render, so that `withGaps` turns them into
+ * exactly `VISIBLE_SLOTS` positions.
+ *
+ * Which of the three shapes applies depends only on whether there is anything
+ * to skip on each side. With one gap there is room for six numbers, with two
+ * there is room for five, and the gaps make up the difference.
+ *
+ * @param currentPage - the page the user is on, 1-based
+ * @param totalPages - how many pages there are in total
+ * @returns the page numbers to render, ascending
+ */
+function collectVisiblePages(currentPage, totalPages) {
+    if (totalPages <= VISIBLE_SLOTS) {
+        return range(FIRST_PAGE, totalPages);
+    }
+    const firstSibling = Math.max(currentPage - SIBLINGS, FIRST_PAGE);
+    const lastSibling = Math.min(currentPage + SIBLINGS, totalPages);
+    if (firstSibling <= FIRST_PAGE + 1) {
+        return [...range(FIRST_PAGE, VISIBLE_SLOTS - 2), totalPages];
+    }
+    if (lastSibling >= totalPages - 1) {
+        return [
+            FIRST_PAGE,
+            ...range(totalPages - (VISIBLE_SLOTS - 3), totalPages),
+        ];
+    }
+    return [FIRST_PAGE, ...range(firstSibling, lastSibling), totalPages];
+}
+/**
+ * @param from - the first number, inclusive
+ * @param to - the last number, inclusive
+ * @returns every whole number between the two
+ */
+function range(from, to) {
+    return Array.from({ length: to - from + 1 }, (_, step) => from + step);
+}
+/**
+ * Insert a gap wherever the rendered page numbers are not consecutive.
+ *
+ * A gap that would hide a single page is rendered as that page instead: the
+ * marker is as wide as a page number, so it would save no room.
+ *
+ * @param pages - the page numbers to render, ascending
+ * @returns the positions to render, in order
+ */
+function withGaps(pages) {
+    return pages.flatMap((page, index) => {
+        const slot = { kind: 'page', page: page };
+        if (index === 0) {
+            return [slot];
+        }
+        const skipped = page - pages[index - 1] - 1;
+        if (skipped === 0) {
+            return [slot];
+        }
+        if (skipped === 1) {
+            return [{ kind: 'page', page: page - 1 }, slot];
+        }
+        return [
+            {
+                kind: 'gap',
+                from: pages[index - 1] + 1,
+                to: page - 1,
+            },
+            slot,
+        ];
+    });
+}

package/dist/collection/components/picker/picker.js

@@ -199,7 +199,7 @@ export class Picker {
             props.maxItems = 1;
         }
         return [
-            h("limel-chip-set", Object.assign({ key: '281a5f2451505c012b72c04610d897cf22717420', type: "input", inputType: "search", label: this.label, helperText: this.helperText, leadingIcon: this.leadingIcon, value: this.chips, disabled: this.disabled, invalid: this.invalid, delimiter: this.renderDelimiter(), readonly: this.readonly, required: this.required, searchLabel: this.searchLabel, language: this.language, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, emptyInputOnChange: false, clearAllButton: this.multiple && !this.chipSetEditMode }, props)),
+            h("limel-chip-set", Object.assign({ key: '3596e789685aa295baf079c38f4cc4cab0fa3317', type: "input", inputType: "search", label: this.label, helperText: this.helperText, leadingIcon: this.leadingIcon, value: this.chips, disabled: this.disabled, invalid: this.invalid, delimiter: this.renderDelimiter(), readonly: this.readonly, required: this.required, searchLabel: this.searchLabel, language: this.language, onInput: this.handleTextInput, onKeyDown: this.handleInputKeyDown, onChange: this.handleChange, onInteract: this.handleInteract, onStartEdit: this.handleInputFieldFocus, onStopEdit: this.handleStopEditAndBlur, emptyInputOnBlur: false, emptyInputOnChange: false, clearAllButton: this.multiple && !this.chipSetEditMode }, props)),
             this.renderDropdown(),
         ];
     }

package/dist/collection/components/popover/popover.js

@@ -127,7 +127,7 @@ export class Popover {
     render() {
         const cssProperties = this.getCssProperties();
         const popoverZIndex = getComputedStyle(this.host).getPropertyValue('--popover-z-index');
-        return (h("div", { key: 'bdb63d668ef7856ae53484f7a02641fc225e69ab', class: "trigger-anchor" }, h("slot", { key: '6b200f4bf9f5f975db877147d4901ba5855464e6', name: "trigger", ref: this.setTriggerRef }), h("limel-portal", { key: '6a5ceafebe0ea7646d8ad399c1f53b8260a506a0', visible: this.open, containerId: this.portalId, containerStyle: { 'z-index': popoverZIndex }, openDirection: this.openDirection }, h("limel-popover-surface", { key: '9bbc131fc2c8e104f9911a19667fad6c187c4872', contentCollection: this.host.children, style: cssProperties }))));
+        return (h("div", { key: '096e54a6fdc88f6571884bf0a642c67f144d3bbf', class: "trigger-anchor" }, h("slot", { key: 'ddc46b8755f6463dc2320198aefc50ef759f9de4', name: "trigger", ref: this.setTriggerRef }), h("limel-portal", { key: '89cce45b2218a2a5087f30f4d524d2c1b2041de2', visible: this.open, containerId: this.portalId, containerStyle: { 'z-index': popoverZIndex }, openDirection: this.openDirection }, h("limel-popover-surface", { key: 'a1d1edfb24fdbef9109adef03f8d77e6cced87c7', contentCollection: this.host.children, style: cssProperties }))));
     }
     globalClickListener(event) {
         const element = event.target;

package/dist/collection/components/popover-surface/popover-surface.js

@@ -8,7 +8,7 @@ export class PopoverSurface {
         this.appendElement();
     }
     render() {
-        return h("div", { key: 'fe1d368dcbeefe4672a0b74fea9277988e3dbd0a', class: "limel-popover-surface", tabindex: "0" });
+        return h("div", { key: 'c3f7cda21c76bdd39eba1e8e4e28503561d28a7e', class: "limel-popover-surface", tabindex: "0" });
     }
     appendElement() {
         const portalContainer = this.host.shadowRoot.querySelector('.limel-popover-surface');

package/dist/collection/components/portal/portal.js

@@ -113,7 +113,7 @@ export class Portal {
         }
     }
     render() {
-        return h("slot", { key: '18852003d1bf5f0aeb7c18f73eb26f37e8c75294' });
+        return h("slot", { key: '32f6da268363dd30db38fb8189ee2d6414890959' });
     }
     onVisible() {
         if (!this.container && this.visible) {

package/dist/collection/components/radio-button-group/radio-button-group.js

@@ -37,7 +37,7 @@ export class RadioButtonGroup {
         };
     }
     render() {
-        return (h("limel-list", { key: '7aad9c5fb6779ed5f4f4fcc58d8d341158150292', items: this.createItems(), type: "radio", badgeIcons: this.badgeIcons, maxLinesSecondaryText: this.maxLinesSecondaryText, onChange: this.handleChange }));
+        return (h("limel-list", { key: '467b17f3d721555c52d871ab3f7b6a36cd70d6a6', items: this.createItems(), type: "radio", badgeIcons: this.badgeIcons, maxLinesSecondaryText: this.maxLinesSecondaryText, onChange: this.handleChange }));
     }
     createItems() {
         return this.items.map((option) => {

package/dist/collection/components/radio-button-group/radio-button.js

@@ -31,12 +31,12 @@ import { Host, h } from "@stencil/core";
  */
 export class RadioButtonComponent {
     render() {
-        return (h(Host, { key: '2dee92bedc030e8d810aa0a0a9afdb89c1dedd7f', class: {
+        return (h(Host, { key: '01f0b56a991bc0a54e4ba09e7dd4a394d87d800a', class: {
                 'boolean-input': true,
                 'radio-button': true,
                 checked: this.checked,
                 disabled: this.disabled,
-            } }, h("input", { key: 'c3f3ea9d32c5d0c14bc4c2eb03414989a265eec0', type: "radio", id: this.id, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), h("div", { key: '91f088c8a201dac964e6b2e2427da21eeafedfd2', class: "box" }), h("label", { key: '678910b84830e2d60373d3845e377c31bdbecc68', class: "boolean-input-label", htmlFor: this.id }, this.label)));
+            } }, h("input", { key: '89371d4f79105022dc13ed8d50b9bf2004f4059a', type: "radio", id: this.id, checked: this.checked, disabled: this.disabled, onChange: this.onChange }), h("div", { key: '7e7e210a4c703f69bfca2a3c8a5487be4221f0b4', class: "box" }), h("label", { key: 'b00bd3ac42a5b8e3691d9b5e698b59752ab795f1', class: "boolean-input-label", htmlFor: this.id }, this.label)));
     }
     static get is() { return "limel-radio-button"; }
     static get originalStyleUrls() {

package/dist/collection/components/select/select.js

@@ -7,6 +7,7 @@ import { isMultiple } from "../../util/multiple";
 import { createRandomString } from "../../util/random-string";
 import { findTypeaheadMatch, isTypeaheadKey, NO_TYPEAHEAD_MATCH, TypeaheadBuffer, } from "../../util/typeahead";
 import { createMenuItems, SelectTemplate, triggerIconColorWarning, } from "./select.template";
+import { getIconName } from "../icon/get-icon-props";
 /**
  * ## Keyboard
  *
@@ -35,8 +36,8 @@ export class Select {
     resetHasChanged() {
         this.hasChanged = false;
     }
-    updateHasPrimaryComponent() {
-        this.hasPrimaryComponentMemo = this.computeHasPrimaryComponent();
+    updateHasRichOptions() {
+        this.hasRichOptions = this.computeHasRichOptions();
     }
     /**
      * `options` and `required` are the inputs that decide which rows the
@@ -76,7 +77,7 @@ export class Select {
         this.multiple = false;
         this.menuOpen = false;
         this.hasChanged = false;
-        this.hasPrimaryComponentMemo = false;
+        this.hasRichOptions = false;
         this.checkValid = false;
         this.typeaheadBuffer = new TypeaheadBuffer();
         this.handleMenuTriggerKeyDown = (event) => {
@@ -137,7 +138,7 @@ export class Select {
         if (Object.hasOwn(this.host.dataset, 'native')) {
             this.isMobileDevice = true;
         }
-        this.hasPrimaryComponentMemo = this.computeHasPrimaryComponent();
+        this.hasRichOptions = this.computeHasRichOptions();
     }
     componentDidLoad() {
         this.initialize();
@@ -173,7 +174,7 @@ export class Select {
     }
     render() {
         const dropdownZIndex = getComputedStyle(this.host).getPropertyValue('--dropdown-z-index');
-        return (h(SelectTemplate, { key: '97e6b0b033a487e26ab7e4abe7165837ebe08911', id: this.portalId, disabled: this.disabled || this.readonly, readonly: this.readonly, required: this.required, invalid: this.invalid, label: this.label, helperText: this.helperText, value: this.value, options: this.options, onMenuChange: this.handleMenuChange, onNativeChange: this.handleNativeChange, onTriggerKeyDown: this.handleMenuTriggerKeyDown, listRef: this.setListElement, multiple: this.multiple, isOpen: this.menuOpen, open: this.openMenu, close: this.closeMenu, checkValid: this.checkValid, native: this.shouldRenderNative(), dropdownZIndex: dropdownZIndex, anchor: this.getAnchorElement() }));
+        return (h(SelectTemplate, { key: '0def26ad84ac6317b6f5fa0c18bd4b66f320dff1', id: this.portalId, disabled: this.disabled || this.readonly, readonly: this.readonly, required: this.required, invalid: this.invalid, label: this.label, helperText: this.helperText, value: this.value, options: this.options, onMenuChange: this.handleMenuChange, onNativeChange: this.handleNativeChange, onTriggerKeyDown: this.handleMenuTriggerKeyDown, listRef: this.setListElement, multiple: this.multiple, isOpen: this.menuOpen, open: this.openMenu, close: this.closeMenu, checkValid: this.checkValid, native: this.shouldRenderNative(), dropdownZIndex: dropdownZIndex, anchor: this.getAnchorElement() }));
     }
     watchOpen(newValue, oldValue) {
         if (this.checkValid) {
@@ -185,7 +186,9 @@ export class Select {
         }
     }
     setMenuFocus() {
-        if (this.isMobileDevice) {
+        // A native `<select>` brings its own focus handling. The custom
+        // dropdown does not, so it needs this even on a mobile device.
+        if (this.shouldRenderNative()) {
             return;
         }
         this.cancelPendingFocus();
@@ -332,7 +335,7 @@ export class Select {
         this.menuOpen = true;
     }
     getFirstNativeAutoSelectOption() {
-        if (this.hasChanged || !this.isMobileDevice || this.multiple) {
+        if (this.hasChanged || !this.shouldRenderNative()) {
             return undefined;
         }
         const options = this.getOptionsExcludingSeparators();
@@ -367,10 +370,10 @@ export class Select {
      * @returns whether the key was handled as typeahead
      */
     handleTypeaheadKey(event, focusedIndex) {
-        // The native dropdown on mobile devices does its own typeahead. Note
-        // that `setMenuFocus` bails out on mobile too, so a pending index
-        // would never be consumed there.
-        if (this.isMobileDevice || !isTypeaheadKey(event)) {
+        // The native dropdown does its own typeahead. Note that
+        // `setMenuFocus` bails out there too, so a pending index would never
+        // be consumed anyway.
+        if (this.shouldRenderNative() || !isTypeaheadKey(event)) {
             return false;
         }
         // A space only continues an ongoing typeahead. On its own it keeps its
@@ -480,12 +483,21 @@ export class Select {
         return this.options.filter((option) => !('separator' in option));
     }
     shouldRenderNative() {
-        return (this.isMobileDevice &&
-            !this.multiple &&
-            !this.hasPrimaryComponentMemo);
+        return this.isMobileDevice && !this.multiple && !this.hasRichOptions;
     }
-    computeHasPrimaryComponent() {
-        return this.getOptionsExcludingSeparators().some((option) => { var _a; return !!((_a = option.primaryComponent) === null || _a === void 0 ? void 0 : _a.name); });
+    /**
+     * A native `<select>` can only render an option's text. Any option that
+     * carries more than that forces the custom dropdown, even on mobile.
+     *
+     * @returns `true` when at least one option cannot be rendered natively
+     */
+    computeHasRichOptions() {
+        return this.getOptionsExcludingSeparators().some((option) => {
+            var _a;
+            return !!((_a = option.primaryComponent) === null || _a === void 0 ? void 0 : _a.name) ||
+                !!option.secondaryText ||
+                !!getIconName(option.icon);
+        });
     }
     static get is() { return "limel-select"; }
     static get encapsulation() { return "shadow"; }
@@ -739,7 +751,7 @@ export class Select {
                 "methodName": "resetHasChanged"
             }, {
                 "propName": "options",
-                "methodName": "updateHasPrimaryComponent"
+                "methodName": "updateHasRichOptions"
             }, {
                 "propName": "options",
                 "methodName": "resetTypeaheadOnItemsChange"

package/dist/collection/components/shortcut/shortcut.js

@@ -61,7 +61,7 @@ export class Shortcut {
     render() {
         var _a, _b, _c, _d, _e;
         const rel = getRel((_a = this.link) === null || _a === void 0 ? void 0 : _a.target, (_b = this.link) === null || _b === void 0 ? void 0 : _b.rel);
-        return (h(Host, { key: '5182738d7d2e8c2df2aa019631af021260b6b506', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("a", { key: 'ed8ae8d341aca2d64376c0b154b41b03d1d08073', "aria-disabled": this.disabled, href: (_c = this.link) === null || _c === void 0 ? void 0 : _c.href, target: (_d = this.link) === null || _d === void 0 ? void 0 : _d.target, rel: rel, tabindex: "0", "aria-label": this.getAriaLabel(), title: (_e = this.link) === null || _e === void 0 ? void 0 : _e.title }, h("limel-icon", { key: '0bc411ed33a695dbd2dc25689895ed2fc10d15b7', name: this.icon }), h("limel-3d-hover-effect-glow", { key: 'e57726bde3911492fbab47219fd0b36db2d1a122' })), this.renderLabel(), this.renderNotification()));
+        return (h(Host, { key: '69f27974df1fd3fea7b9822714c0a3d59b6a7fab', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("a", { key: '9f8c7b9dc8e2f27007cb46687cb7bf10314e2a8a', "aria-disabled": this.disabled, href: (_c = this.link) === null || _c === void 0 ? void 0 : _c.href, target: (_d = this.link) === null || _d === void 0 ? void 0 : _d.target, rel: rel, tabindex: "0", "aria-label": this.getAriaLabel(), title: (_e = this.link) === null || _e === void 0 ? void 0 : _e.title }, h("limel-icon", { key: '3c10a0091ad0e1549b2765ad429ed2966220246e', name: this.icon }), h("limel-3d-hover-effect-glow", { key: '17011ca6b7d73130b73b85fd30d54921bd07ec54' })), this.renderLabel(), this.renderNotification()));
     }
     static get is() { return "limel-shortcut"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/slider/slider.js

@@ -270,15 +270,15 @@ export class Slider {
         if (this.disabled || this.readonly) {
             inputProps.disabled = true;
         }
-        return (h(Host, { key: 'eecd22982d9180f24f947fd2ab9af9a25e64647e', class: this.getContainerClassList() }, h("limel-notched-outline", { key: '848578a10d64a4af81e296c9f961e9be788484a7', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !this.isUnset, hasFloatingLabel: true }, h("div", { key: '7ad977107b79fc9ca416562d5c7905b4a962053c', slot: "content" }, h("div", { key: 'dcb137a44b5244e63a4c8a95341d3918dc65445c', class: "slider", style: { '--slider-fraction': `${fraction}` } }, h("input", Object.assign({ key: '73af46f062991f3c715d13c0f44b0fb9478dc37c', type: "range", min: min, max: max, value: this.displayValue, "aria-labelledby": this.labelId, "aria-describedby": this.helperText
+        return (h(Host, { key: '47fedc34458f09ec0a67a6fc81efcd0d5aaba74e', class: this.getContainerClassList() }, h("limel-notched-outline", { key: '89c319c35f59d8dbd72a40e894fb01a8b12dc88d', labelId: this.labelId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !this.isUnset, hasFloatingLabel: true }, h("div", { key: 'f4c7c2475650c2c3be4b33271fc1f23aa8d40ee5', slot: "content" }, h("div", { key: 'c3c085ead113928e85bc9ab3cbadd7e8350b4a12', class: "slider", style: { '--slider-fraction': `${fraction}` } }, h("input", Object.assign({ key: 'c1e255d94086cc3c77cec32d34a52fc06ffe77b4', type: "range", min: min, max: max, value: this.displayValue, "aria-labelledby": this.labelId, "aria-describedby": this.helperText
                 ? this.helperTextId
                 : undefined, "aria-valuetext": this.isUnset
                 ? translate.get('value-not-set', this.language)
                 : undefined, ref: (el) => {
                 this.inputElement = el;
-            }, onInput: this.handleInput, onChange: this.handleChange, onClick: this.handleClick }, inputProps)), h("div", { key: 'e9fb2af7f43cc040c382930d336c8eb903bc0162', class: "track" }, h("div", { key: '2cec88a4b8c99296473bbd9b064bccd0a6450b8f', class: "active" }), this.renderStepDots(min, max)), h("div", { key: '5a090fb0528478450510ff0240e6b5499a177238', class: "thumb" }, h("div", { key: 'fde6792041312183af0328d9fc75d19d2553bf46', class: "knob" }), h("div", { key: 'de717ffa20723870bb27aa22e99fe9fe5ebdd563', class: "indicator", "aria-hidden": "true" }, this.isUnset
+            }, onInput: this.handleInput, onChange: this.handleChange, onClick: this.handleClick }, inputProps)), h("div", { key: 'c287ade5d57268fbf3d0a203f4f94363709dcb74', class: "track" }, h("div", { key: 'd65e20a0bd2da417a797be2501f70860cae04857', class: "active" }), this.renderStepDots(min, max)), h("div", { key: '72e6bf77fddaf64fcde86455bfddd1122a8f174c', class: "thumb" }, h("div", { key: '2066f97938cff1b20ffa0aad2e3c4803a5a2f6f9', class: "knob" }), h("div", { key: 'abd8845bf4d52faeffd1a4f25ca2068a8062bc09', class: "indicator", "aria-hidden": "true" }, this.isUnset
             ? '\u2194\uFE0E'
-            : this.displayValue))), h("div", { key: 'd0c38d092fecc4bf9690680d8541c8d658056f08', class: "range-labels" }, h("span", { key: '581387615da0cdaf105a568e02212f8bdd22eeb6', class: "min" }, this.multiplyByFactor(this.valuemin), this.unit), h("span", { key: '33c5673d8e56995bffdc35340381f2e87ae0918c', class: "max" }, this.multiplyByFactor(this.valuemax), this.unit)))), this.renderClearButton(), this.renderHelperLine()));
+            : this.displayValue))), h("div", { key: '7107d522eb4732ca8e4ae6d901a3981853f9e97b', class: "range-labels" }, h("span", { key: 'babaa35149ef70070141f5f4e49be8fc55e367a4', class: "min" }, this.multiplyByFactor(this.valuemin), this.unit), h("span", { key: '92caa840cc1ac72681f7ee3b18754a912d1d0829', class: "max" }, this.multiplyByFactor(this.valuemax), this.unit)))), this.renderClearButton(), this.renderHelperLine()));
     }
     watchValue() {
         this.syncStateFromValue();

package/dist/collection/components/snackbar/snackbar.js

@@ -122,14 +122,14 @@ export class Snackbar {
         }
     }
     render() {
-        return (h("aside", { key: 'b169aea71907531a18ac9e2144aba07858d7fd60', popover: "manual", style: {
+        return (h("aside", { key: '5612185e67dfea963fc9df340a288540f63db94e', popover: "manual", style: {
                 '--snackbar-timeout': `${Math.max(this.timeout || 0, 0)}ms`,
                 '--snackbar-distance-to-top-edge': `${this.offset}px`,
             }, class: {
                 open: this.open,
                 'is-closing': this.closing,
                 'limel-portal--parent': true,
-            }, id: this.snackbarId, role: this.setAriaRoles(), "aria-atomic": this.open ? 'true' : undefined, "aria-relevant": this.open ? 'additions' : undefined }, h("div", { key: '5751e58d37e6a01b57e26c7fe91d0f95176fad8f', class: "surface" }, h("limel-markdown", { key: '571fa1cd75f16b9e78c964ab089f7cdff27aa00c', class: "label", value: this.message }), this.renderActions(this.actionText), this.renderDismissButton(this.dismissible))));
+            }, id: this.snackbarId, role: this.setAriaRoles(), "aria-atomic": this.open ? 'true' : undefined, "aria-relevant": this.open ? 'additions' : undefined }, h("div", { key: 'a6221f26df374bac45ee3e5cd4a7f6c966340a06', class: "surface" }, h("limel-markdown", { key: '2da6a24cc92319fea7dde9a79a77f9719735a669', class: "label", value: this.message }), this.renderActions(this.actionText), this.renderDismissButton(this.dismissible))));
     }
     setAriaRoles() {
         if (!this.open) {

package/dist/collection/components/spinner/spinner.js

@@ -16,7 +16,7 @@ export class Spinner {
         this.limeBranded = false;
     }
     render() {
-        return (h(Host, { key: '3f6ed172a6341f4e1edc77ad52437edf7ed3965b' }, h("svg", { key: '293405b8a1f5e3cebdece4029093b18b4d7cd5b9', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, this.renderSpinner())));
+        return (h(Host, { key: '43fdff921a3dd6637a6f452c2acc344e54cb759a' }, h("svg", { key: '7566bc8a39a74543cfbec9030220c84b5509b310', viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, this.renderSpinner())));
     }
     renderSpinner() {
         if (!this.limeBranded) {

package/dist/collection/components/split-button/split-button.js

@@ -55,9 +55,9 @@ export class SplitButton {
         };
     }
     render() {
-        return (h(Host, { key: '2aae915bea71851e4f146e960d20bfff043f0acf', class: {
+        return (h(Host, { key: '2b103843490284b194de5dbf2c6030973889aa64', class: {
                 'has-menu': this.items.length > 0,
-            }, onClick: this.filterClickWhenDisabled }, h("limel-button", { key: 'a4256e39e894e97ad834d7dc5fffa488d12f50e4', label: this.label, primary: this.primary, icon: this.icon, disabled: this.disabled, loading: this.loading, loadingFailed: this.loadingFailed }), this.renderMenu()));
+            }, onClick: this.filterClickWhenDisabled }, h("limel-button", { key: '3badf574bf892cb26198166405739ef3a45fac49', label: this.label, primary: this.primary, icon: this.icon, disabled: this.disabled, loading: this.loading, loadingFailed: this.loadingFailed }), this.renderMenu()));
     }
     static get is() { return "limel-split-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/switch/switch.js

@@ -78,7 +78,7 @@ export class Switch {
         removeEnterClickable(this.host);
     }
     render() {
-        return (h(Host, { key: '2ce9ffed334574c874ef12126b0fa3b0399fbca6' }, this.readonly
+        return (h(Host, { key: 'ad0cfa0f9b495ba197ca27f8975d8499cfdace52' }, this.readonly
             ? this.renderReadonly()
             : this.renderInteractive(), this.renderHelperLine()));
     }

package/dist/collection/components/tab-bar/tab-bar.js

@@ -62,11 +62,11 @@ export class TabBar {
         this.tearDown();
     }
     render() {
-        return (h("div", { key: 'd5ea81cea22148ff182dbf6cce579630dd51226e', class: "mdc-tab-bar", role: "tablist" }, h("div", { key: '7fb95e7e4ecef78c08af267b232ea00a8c37a01f', class: {
+        return (h("div", { key: 'b0a62a521861357770e12bc6183b9590c49760e0', class: "mdc-tab-bar", role: "tablist" }, h("div", { key: '97750d5ded531aee2fca5cd1f129fee4194b8f09', class: {
                 'mdc-tab-scroller': true,
                 'can-scroll-left': this.canScrollLeft,
                 'can-scroll-right': this.canScrollRight,
-            } }, h("div", { key: 'ff8d5293a8ad9ce4f599ad3dc6fc1d00e29e44c7', class: "mdc-tab-scroller__scroll-area lime-hide-scrollbars" }, h("div", { key: '69f2827ecf3499bb46601e32770cef710906498a', class: "mdc-tab-scroller__scroll-content" }, this.tabs.map(this.renderTab))), h("div", { key: '5575ea05e1fca6b517f2d3b4e08de3025521983a', class: "scroll-fade left" }), h("div", { key: 'ab096896559ad951b26d44d6374b95684bebb0e9', class: "scroll-button left" }, h("button", { key: '8eb654939c4bf22a1fa9ef1439c8895d349ebc1c', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollLeft, onClick: this.handleLeftScrollClick }, h("limel-icon", { key: 'dcd1160cf48a28cff62dab2ebc8a895392d28bd8', name: "angle_left" }))), h("div", { key: 'd6aef83022ef2329eb6acba6c7310557cd841e38', class: "scroll-fade right" }), h("div", { key: 'd415ce73978bc76c1e4c9877dc520ea48dde70bb', class: "scroll-button right" }, h("button", { key: '871d2d9a464b43eda231177783926ce3fad9cde2', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollRight, onClick: this.handleRightScrollClick }, h("limel-icon", { key: '75ce8b5c5f94418695fb7a42599d5d7b1c059686', name: "angle_right" }))))));
+            } }, h("div", { key: '6547764cdcfc4f2f60e510863ede4d58d48b1b0e', class: "mdc-tab-scroller__scroll-area lime-hide-scrollbars" }, h("div", { key: 'b95453f5a1fe8b4aae7ebad439cfb795198623a8', class: "mdc-tab-scroller__scroll-content" }, this.tabs.map(this.renderTab))), h("div", { key: 'a4703fa681f371d69ab7a6994aa3457c803563bf', class: "scroll-fade left" }), h("div", { key: '6599c7035550249f81b5488deda63900363be953', class: "scroll-button left" }, h("button", { key: '09a0a7f41a8f0dfe458af7bb719aef0fb0e1b9d7', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollLeft, onClick: this.handleLeftScrollClick }, h("limel-icon", { key: 'dd5f4cf8562fd74148778d5414f98d4c1c949bd0', name: "angle_left" }))), h("div", { key: 'b380cf4e3679d35270453b6a8671e7de8d9a92a7', class: "scroll-fade right" }), h("div", { key: '3589c3bec4d29eee61da6bc0b293201412bd343f', class: "scroll-button right" }, h("button", { key: '8af680e4abefcf6920a602c269f9a937270d70f2', type: "button", tabindex: "-1", "aria-hidden": "true", disabled: !this.canScrollRight, onClick: this.handleRightScrollClick }, h("limel-icon", { key: 'be2dcc0f1ba494cce96eab05450ce8c9619981e0', name: "angle_right" }))))));
     }
     tabsChanged(newTabs = [], oldTabs = []) {
         const newIds = newTabs.map((tab) => tab.id);

package/dist/collection/components/tab-panel/tab-panel.js

@@ -56,7 +56,7 @@ export class TabPanel {
         this.tabs.forEach(this.setTabStatus);
     }
     render() {
-        return (h(Host, { key: '95c69caf5807a724fd01336e0889e84de7b90901', onChangeTab: this.handleChangeTabs }, h("div", { key: 'fa7101cafc75c1864c27ea722b6e4d9bbddaa413', class: "tab-panel" }, h("limel-tab-bar", { key: '74ec8e8bf54d721b2340d37e5dfdb4df527ee7c6', tabs: this.tabs }), h("div", { key: '9dd0602c7ccbd28c1a779a2028f2ac97a36ba0e1', class: "tab-content" }, h("slot", { key: 'fa46249bfca240ff030cb23878ec744ab0fa9456' })))));
+        return (h(Host, { key: 'e81003e7cb21f7d348368393b6ac6c8039510f26', onChangeTab: this.handleChangeTabs }, h("div", { key: '591a3cd5176b359ce6ce9eef69355d5084656be7', class: "tab-panel" }, h("limel-tab-bar", { key: '1097440df6c6e01693a39efe3647e9511a664887', tabs: this.tabs }), h("div", { key: 'a6c49f26996ecc40f4a5d3d70de52777438adb13', class: "tab-content" }, h("slot", { key: '192808544a1534a3799ab5a438f08cbbe1d6bd40' })))));
     }
     setSlotElements() {
         const slot = this.getSlot();

package/dist/collection/components/table/table.js

@@ -748,13 +748,13 @@ export class Table {
     render() {
         var _a, _b;
         const totalRows = (_a = this.totalRows) !== null && _a !== void 0 ? _a : this.data.length;
-        return (h(Host, { key: 'bdf212a18d552e674b125bc7211720a4c12017c9', class: {
+        return (h(Host, { key: 'e357333d980fd5fc18fc129c2c348014b28dc918', class: {
                 'has-low-density': this.layout === 'lowDensity',
                 'has-pagination-on-top': this.paginationLocation === 'top',
                 'has-aggregation': this.hasAggregation(this.columns),
                 'has-pagination': totalRows > this.pageSize,
                 'has-selection': (_b = this.tableSelection) === null || _b === void 0 ? void 0 : _b.hasSelection,
-            } }, h("div", { key: '7e2255cc81d1df9ec44b0b10de49ef1dff6c6119', id: "tabulator-container" }, h("div", { key: 'c413d5abefd874be1d7da0764ff6c8b41c096ec0', id: "tabulator-loader", style: { display: this.loading ? 'flex' : 'none' } }, h("limel-spinner", { key: 'f2018824ceef425f572839540a543d71d19b77b3', size: "large" })), this.renderEmptyMessage(), this.renderSelectAll(), h("div", { key: '27dcea556552419f9c904320192c847b94742d2c', id: "tabulator-table" }))));
+            } }, h("div", { key: 'ea52cca80b066fba0d94fd154f4dd2774d52e4a8', id: "tabulator-container" }, h("div", { key: '022cceaa6e0876a60f7a9304e9be5e9bf9187cb9', id: "tabulator-loader", style: { display: this.loading ? 'flex' : 'none' } }, h("limel-spinner", { key: '5ce0bb25943d34b433570c41177c78f02295f7ac', size: "large" })), this.renderEmptyMessage(), this.renderSelectAll(), h("div", { key: 'dfea37cefcf69f8b45fe1ad4dbf4686771d68d49', id: "tabulator-table" }))));
     }
     renderSelectAll() {
         var _a, _b, _c;

package/dist/collection/components/text-editor/link-menu/editor-link-menu.js

@@ -106,9 +106,9 @@ export class TextEditorLinkMenu {
         var _a, _b;
         const isValid = this.isValid(this.link.href);
         return [
-            h("limel-input-field", { key: '8da44ef5f8141c0b7e4cadf75babd07a62614674', label: this.getTranslation('editor-link-menu.text'), value: ((_a = this.link) === null || _a === void 0 ? void 0 : _a.text) || '', leadingIcon: "text_cursor", onChange: this.handleLinkTitleChange, onKeyDown: this.handleKeyDown }),
-            h("limel-input-field", { key: 'a16f2a13564809011551bf96e34e100b0683493c', label: this.getTranslation('editor-link-menu.link'), value: ((_b = this.link) === null || _b === void 0 ? void 0 : _b.href) || '', type: "text", leadingIcon: "-lime-text-link", trailingIcon: "external_link", invalid: !isValid, onChange: this.handleLinkValueChange, onAction: this.handleLinkInputAction, onKeyDown: this.handleKeyDown, ref: (el) => (this.linkInput = el) }),
-            h("div", { key: 'ee392b700a4293eb2b2121d08bfef852f8b4404e', class: "actions" }, h("limel-button", { key: 'be9f4711edf45a69f8087341e61fc4183c59ba2d', label: this.getTranslation('cancel'), onClick: this.handleCancel }), h("limel-button", { key: 'b958cae7915cc42133e5143589d4f454f8bb2ffa', primary: true, label: this.getTranslation('save'), disabled: !isValid, onClick: this.handleSave, ref: (el) => (this.saveButton = el), slot: "button" })),
+            h("limel-input-field", { key: 'e11551d49c6d2f566326f45726c68e1bc32fdc67', label: this.getTranslation('editor-link-menu.text'), value: ((_a = this.link) === null || _a === void 0 ? void 0 : _a.text) || '', leadingIcon: "text_cursor", onChange: this.handleLinkTitleChange, onKeyDown: this.handleKeyDown }),
+            h("limel-input-field", { key: 'cd8cfa28e4413a3fb24080e017cbc4e11b044c90', label: this.getTranslation('editor-link-menu.link'), value: ((_b = this.link) === null || _b === void 0 ? void 0 : _b.href) || '', type: "text", leadingIcon: "-lime-text-link", trailingIcon: "external_link", invalid: !isValid, onChange: this.handleLinkValueChange, onAction: this.handleLinkInputAction, onKeyDown: this.handleKeyDown, ref: (el) => (this.linkInput = el) }),
+            h("div", { key: 'a0f50540649a40e82665cbea9447c9d63a7dc2ea', class: "actions" }, h("limel-button", { key: '21c01520d4cba2dada241daa01dc7d8588294548', label: this.getTranslation('cancel'), onClick: this.handleCancel }), h("limel-button", { key: 'c63cb6eb73cda6da0c2ff6a08c6bed7584fb6bab', primary: true, label: this.getTranslation('save'), disabled: !isValid, onClick: this.handleSave, ref: (el) => (this.saveButton = el), slot: "button" })),
         ];
     }
     static get is() { return "limel-text-editor-link-menu"; }

package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.js

@@ -303,7 +303,7 @@ export class ProsemirrorAdapter {
         (_e = this.view) === null || _e === void 0 ? void 0 : _e.destroy();
     }
     render() {
-        return (h(Host, { key: '66da30fb04c3dc303f58153a8ca6c1b185aae681', onFocus: this.handleFocus }, h("div", { key: 'fbd8f2810334973488603dd19db7ba2402a14a13', id: "editor" }), this.renderToolbar(), this.renderLinkMenu()));
+        return (h(Host, { key: '19a2071a0e50b4c9e95006ae12e44ec14df7460b', onFocus: this.handleFocus }, h("div", { key: 'f1215347c7eaf79cd16c9219c124ace3ebb22fc7', id: "editor" }), this.renderToolbar(), this.renderLinkMenu()));
     }
     renderToolbar() {
         if (this.actionBarItems.length === 0 || this.ui === 'no-toolbar') {

package/dist/collection/components/text-editor/text-editor.js

@@ -176,7 +176,7 @@ export class TextEditor {
         await ((_a = this.adapterElement) === null || _a === void 0 ? void 0 : _a.clear());
     }
     render() {
-        return (h(Host, { key: '060e262b03280205725ffba75e4263a578b6291f' }, h("limel-notched-outline", { key: 'ca981b1571058bc82fe47f3b2b03cb2f618f7b3d', labelId: this.editorId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasFloatingLabel: true }, this.renderEditor(), this.renderPlaceholder()), this.renderHelperLine()));
+        return (h(Host, { key: '2e0b7080b8d75fc35a24a5da3bc6838da2637fc1' }, h("limel-notched-outline", { key: '2918c3a68d3ebc228ee1bbf7cced3df5278fa5cb', labelId: this.editorId, label: this.label, required: this.required, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, hasValue: !!this.value, hasFloatingLabel: true }, this.renderEditor(), this.renderPlaceholder()), this.renderHelperLine()));
     }
     renderEditor() {
         if (this.readonly) {

package/dist/collection/components/tooltip/tooltip-content.js

@@ -15,7 +15,7 @@ export class TooltipContent {
         const style = this.maxlength
             ? { '--tooltip-max-width-of-text': `${this.maxlength}ch` }
             : undefined;
-        return (h(Host, { key: '9ac57eb00bc9049d153665957e0c4a0470ccc968', class: { 'has-column-layout': isLabelsTextLong }, style: style }, h("div", { key: 'f214a19a12b89d1ebb7d9e1129a1b6df81d3b7d2', class: "label" }, this.label), this.renderHelperLabel(), this.renderHotkey()));
+        return (h(Host, { key: '2761aea2a0cc3ccc7796b7dab93f2375656603f4', class: { 'has-column-layout': isLabelsTextLong }, style: style }, h("div", { key: '2bfe8a9766ff7ab2b9a5211b08107b7f2f28ef7b', class: "label" }, this.label), this.renderHelperLabel(), this.renderHotkey()));
     }
     renderHelperLabel() {
         if (!this.helperLabel) {

package/dist/collection/components/tooltip/tooltip.js

@@ -68,10 +68,10 @@ export class Tooltip {
     }
     render() {
         const tooltipZIndex = getComputedStyle(this.host).getPropertyValue('--tooltip-z-index');
-        return (h("div", { key: '3c18e4c3286f2294fe5cbcfcca1900a67caab96c', class: "trigger-anchor" }, h("limel-portal", { key: '8a594f3725fbd8f4bdc49dc9da3517b7b0f2e74c', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
+        return (h("div", { key: 'cdc5602abcc2911c6429e386f37c6dc1e2100cd8', class: "trigger-anchor" }, h("limel-portal", { key: 'f61db13bb5bc3657e330c7475f0c7bd2e7eb9b2f', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
                 'z-index': tooltipZIndex,
                 'pointer-events': 'none',
-            }, anchor: this.ownerElement }, h("limel-tooltip-content", { key: 'eb383024b0f31fc9527320c900006b71ca510fc9', label: this.label, helperLabel: this.helperLabel, hotkey: this.hotkey, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open, id: this.tooltipId }))));
+            }, anchor: this.ownerElement }, h("limel-tooltip-content", { key: 'f9acf5955b68639c3b56fba75977ddd783e97cd0', label: this.label, helperLabel: this.helperLabel, hotkey: this.hotkey, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open, id: this.tooltipId }))));
     }
     setOwnerAriaDescribedby() {
         var _a;

package/dist/collection/interface.js

@@ -27,6 +27,7 @@ export * from './components/input-field/input-field.types';
 export * from './components/dynamic-label/label.types';
 export * from './components/list/list.types';
 export * from './components/menu/menu.types';
+export * from './components/pagination/pagination.types';
 export * from './components/picker/actions.types';
 export * from './components/picker/picker-item.types';
 export * from './components/picker/searcher.types';

package/dist/collection/translations/da.js

@@ -118,4 +118,13 @@ Du kan fortsætte med at blokere billeder (e-mailen kan se ufuldstændig ud) ell
     'profile-picture.unsupported-preview.description': 'Vi kan ikke vise det valgte billede i denne browser. Vælg venligst en anden billedfil.',
     'picker.results-matching': 'Resultater der matcher "{ query }"',
     'picker.no-matching-results': 'Ingen resultater der matcher "{ query }"',
+    'pagination.label': 'Paginering',
+    'pagination.previous-page': 'Forrige side',
+    'pagination.next-page': 'Næste side',
+    'pagination.go-to-previous-page': 'Gå til forrige side',
+    'pagination.go-to-next-page': 'Gå til næste side',
+    'pagination.page': 'Side { page }',
+    'pagination.go-to-page': 'Gå til side { page }',
+    'pagination.current-page': 'Side { page }, nuværende side',
+    'pagination.items-range': '{ from }–{ to } (af { total })',
 };

package/dist/collection/translations/de.js

@@ -118,4 +118,13 @@ Sie können Bilder weiterhin blockieren (die E-Mail kann unvollständig aussehen
     'profile-picture.unsupported-preview.description': 'Wir können das ausgewählte Bild in diesem Browser nicht anzeigen. Bitte wählen Sie eine andere Bilddatei.',
     'picker.results-matching': 'Ergebnisse passend zu "{ query }"',
     'picker.no-matching-results': 'Keine Ergebnisse passend zu "{ query }"',
+    'pagination.label': 'Seitennummerierung',
+    'pagination.previous-page': 'Vorherige Seite',
+    'pagination.next-page': 'Nächste Seite',
+    'pagination.go-to-previous-page': 'Zur vorherigen Seite wechseln',
+    'pagination.go-to-next-page': 'Zur nächsten Seite wechseln',
+    'pagination.page': 'Seite { page }',
+    'pagination.go-to-page': 'Zu Seite { page } wechseln',
+    'pagination.current-page': 'Seite { page }, aktuelle Seite',
+    'pagination.items-range': '{ from }–{ to } (von { total })',
 };

package/dist/collection/translations/en.js

@@ -118,4 +118,13 @@ You can keep images blocked (the email may look incomplete), or load them if you
     'profile-picture.unsupported-preview.description': 'We cannot display the selected image in this browser. Please select a different image file.',
     'picker.results-matching': 'Results matching "{ query }"',
     'picker.no-matching-results': 'No results matching "{ query }"',
+    'pagination.label': 'Pagination',
+    'pagination.previous-page': 'Previous page',
+    'pagination.next-page': 'Next page',
+    'pagination.go-to-previous-page': 'Go to previous page',
+    'pagination.go-to-next-page': 'Go to next page',
+    'pagination.page': 'Page { page }',
+    'pagination.go-to-page': 'Go to page { page }',
+    'pagination.current-page': 'Page { page }, current page',
+    'pagination.items-range': '{ from }–{ to } (of { total })',
 };

package/dist/collection/translations/fi.js

@@ -118,4 +118,13 @@ Voit pitää kuvat estettyinä (sähköposti voi näyttää puutteelliselta) tai
     'profile-picture.unsupported-preview.description': 'Emme voi näyttää valittua kuvaa tässä selaimessa. Valitse jokin toinen kuvatiedosto.',
     'picker.results-matching': 'Hakua "{ query }" vastaavat tulokset',
     'picker.no-matching-results': 'Ei hakua "{ query }" vastaavia tuloksia',
+    'pagination.label': 'Sivutus',
+    'pagination.previous-page': 'Edellinen sivu',
+    'pagination.next-page': 'Seuraava sivu',
+    'pagination.go-to-previous-page': 'Siirry edelliselle sivulle',
+    'pagination.go-to-next-page': 'Siirry seuraavalle sivulle',
+    'pagination.page': 'Sivu { page }',
+    'pagination.go-to-page': 'Siirry sivulle { page }',
+    'pagination.current-page': 'Sivu { page }, nykyinen sivu',
+    'pagination.items-range': '{ from }–{ to } (yhteensä { total })',
 };

package/dist/collection/translations/fr.js

@@ -118,4 +118,13 @@ Vous pouvez laisser les images bloquées (l'e-mail peut sembler incomplet) ou le
     'profile-picture.unsupported-preview.description': "Nous ne pouvons pas afficher l'image sélectionnée dans ce navigateur. Veuillez sélectionner un autre fichier image.",
     'picker.results-matching': 'Résultats correspondant à « { query } »',
     'picker.no-matching-results': 'Aucun résultat correspondant à « { query } »',
+    'pagination.label': 'Pagination',
+    'pagination.previous-page': 'Page précédente',
+    'pagination.next-page': 'Page suivante',
+    'pagination.go-to-previous-page': 'Aller à la page précédente',
+    'pagination.go-to-next-page': 'Aller à la page suivante',
+    'pagination.page': 'Page { page }',
+    'pagination.go-to-page': 'Aller à la page { page }',
+    'pagination.current-page': 'Page { page }, page actuelle',
+    'pagination.items-range': '{ from }–{ to } (sur { total })',
 };

package/dist/collection/translations/nl.js

@@ -118,4 +118,13 @@ Je kunt afbeeldingen geblokkeerd houden (de e-mail kan er onvolledig uitzien) of
     'profile-picture.unsupported-preview.description': 'We kunnen de geselecteerde afbeelding niet weergeven in deze browser. Selecteer een ander afbeeldingsbestand.',
     'picker.results-matching': 'Resultaten die overeenkomen met "{ query }"',
     'picker.no-matching-results': 'Geen resultaten die overeenkomen met "{ query }"',
+    'pagination.label': 'Paginering',
+    'pagination.previous-page': 'Vorige pagina',
+    'pagination.next-page': 'Volgende pagina',
+    'pagination.go-to-previous-page': 'Ga naar vorige pagina',
+    'pagination.go-to-next-page': 'Ga naar volgende pagina',
+    'pagination.page': 'Pagina { page }',
+    'pagination.go-to-page': 'Ga naar pagina { page }',
+    'pagination.current-page': 'Pagina { page }, huidige pagina',
+    'pagination.items-range': '{ from }–{ to } (van { total })',
 };