@uh-design-system/component-library 1.4.0 → 1.5.0

package/dist/esm/componentFactory-DsTGhar0.js

@@ -0,0 +1,100 @@
+import { b as idGenerator } from './utils-BR594Mvg.js';
+
+const state = new Map();
+const createDefaultStats = () => Object.freeze({
+    mountEventsTotal: 0,
+});
+const getAll = () => state;
+const getOne = (componentName) => state.get(componentName) ?? createDefaultStats();
+const incrementMount = (componentName) => {
+    const prev = getOne(componentName);
+    state.set(componentName, Object.freeze({
+        ...prev,
+        mountEventsTotal: prev.mountEventsTotal + 1,
+    }));
+};
+const clear = () => {
+    state.clear();
+};
+const analyticsState = {
+    getAll,
+    getOne,
+    incrementMount,
+    clear,
+};
+
+const COLLECTION_PROBABILITY = 0.5;
+const COLLECTION_STORAGE_KEY = 'uhds_collect_analytics';
+if (window.sessionStorage && window.sessionStorage.getItem(COLLECTION_STORAGE_KEY) === null) {
+    window.sessionStorage.setItem(COLLECTION_STORAGE_KEY, (Math.random() <= COLLECTION_PROBABILITY).toString());
+}
+const generators = new Map();
+let isFlushing = false;
+let isBatchTrackingInitialized = false;
+function flushState() {
+    if (isFlushing)
+        return;
+    const components = analyticsState.getAll();
+    if (components.size === 0)
+        return;
+    isFlushing = true;
+    try {
+        if (!Array.isArray(window._mtm))
+            return;
+        const tracker = window._mtm;
+        const appHost = window.location.hostname;
+        const appName = window._uhdsMatomoAppName;
+        for (const [name, stats] of components.entries()) {
+            tracker.push({
+                'event': 'uhds.components',
+                'uhds.action': 'mounted',
+                'uhds.component': name,
+                'uhds.app_name': appName,
+                'uhds.app_host': appHost,
+                'uhds.instance_key': `${appHost}::${name}`,
+                'uhds.instances_seen': stats.mountEventsTotal,
+            });
+        }
+        analyticsState.clear();
+    }
+    finally {
+        isFlushing = false;
+    }
+}
+function initBatchTracking() {
+    if (isBatchTrackingInitialized)
+        return;
+    globalThis.addEventListener('visibilitychange', () => {
+        if (document.visibilityState === 'hidden')
+            flushState();
+    });
+    globalThis.addEventListener('pagehide', flushState);
+    globalThis.addEventListener('beforeunload', flushState);
+    isBatchTrackingInitialized = true;
+}
+const componentFactory = (componentName) => (Base) => {
+    class BaseComponent extends Base {
+        static isFlushing = false;
+        getGenerator() {
+            const name = componentName.trim() || 'ds-component';
+            if (!generators.has(name)) {
+                generators.set(name, idGenerator(name));
+            }
+            return generators.get(name);
+        }
+        getUniqueId() {
+            return this.getGenerator().next().value;
+        }
+        componentMounted() {
+            if (!window._uhdsMatomoAppName)
+                return;
+            if (!window.sessionStorage || window.sessionStorage?.getItem(COLLECTION_STORAGE_KEY) === 'false')
+                return;
+            initBatchTracking();
+            analyticsState.incrementMount(componentName);
+        }
+    }
+    return BaseComponent;
+};
+
+export { componentFactory as c };

package/dist/esm/controlUtils-B3bjtllb.js

@@ -0,0 +1,384 @@
+import { g as getLanguage } from './store-zG2lF8d6.js';
+
+const valueMissing = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Täytä tämä kenttä.';
+        case 'sv':
+            return 'Fyll i det här fältet.';
+        default:
+            return 'Fill in this field.';
+    }
+};
+const typeMismatch = (opts) => {
+    if (opts?.type === 'email') {
+        return emailMismatch();
+    }
+    if (opts?.type === 'url') {
+        return urlMismatch();
+    }
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Syötä arvo oikeassa muodossa.';
+        case 'sv':
+            return 'Ange värdet i rätt format.';
+        default:
+            return 'Enter a value in the correct format.';
+    }
+};
+const emailMismatch = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Syötä sähköpostiosoite oikeassa muodossa (esim. nimi@helsinki.fi).';
+        case 'sv':
+            return 'Ange e-postadressen i rätt format (t.ex. namn@helsinki.fi).';
+        default:
+            return 'Enter the email address in the correct format (e.g. name@helsinki.fi).';
+    }
+};
+const urlMismatch = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Syötä verkkosivun osoite oikeassa muodossa (esim. https://helsinki.fi).';
+        case 'sv':
+            return 'Ange webbadressen i rätt formatet (t.ex. https://helsinki.fi).';
+        default:
+            return 'Enter the web address in the correct format (e.g. https://helsinki.fi).';
+    }
+};
+const patternMismatch = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Syötä arvo vaaditussa muodossa.';
+        case 'sv':
+            return 'Ange värdet i det angivna formatet.';
+        default:
+            return 'Match the requested format.';
+    }
+};
+const tooLong = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Lyhennä tekstiä.';
+        case 'sv':
+            return 'Förkorta texten.';
+        default:
+            return 'Shorten your text.';
+    }
+};
+const tooShort = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Pidennä tekstiä.';
+        case 'sv':
+            return 'Förläng texten.';
+        default:
+            return 'Lengthen your text.';
+    }
+};
+const rangeUnderflow = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Syötä suurempi arvo.';
+        case 'sv':
+            return 'Ange ett större värde.';
+        default:
+            return 'Enter a larger value.';
+    }
+};
+const rangeOverflow = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Syötä pienempi arvo.';
+        case 'sv':
+            return 'Ange ett mindre värde.';
+        default:
+            return 'Enter a smaller value.';
+    }
+};
+const stepMismatch = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Syötä sallittu arvo.';
+        case 'sv':
+            return 'Ange ett tillåtet värde.';
+        default:
+            return 'Enter an allowed value.';
+    }
+};
+const badInput = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Anna kelvollinen arvo.';
+        case 'sv':
+            return 'Ange ett giltigt värde.';
+        default:
+            return 'Enter a valid value.';
+    }
+};
+const validityMessage = (flag, opts) => {
+    switch (flag) {
+        case 'valueMissing':
+            return valueMissing();
+        case 'typeMismatch':
+            return typeMismatch(opts);
+        case 'patternMismatch':
+            return patternMismatch();
+        case 'tooLong':
+            return tooLong();
+        case 'tooShort':
+            return tooShort();
+        case 'rangeUnderflow':
+            return rangeUnderflow();
+        case 'rangeOverflow':
+            return rangeOverflow();
+        case 'stepMismatch':
+            return stepMismatch();
+        case 'badInput':
+            return badInput();
+        default:
+            return '';
+    }
+};
+const getOptionalText = (text, optionalText) => {
+    let defaultText = '(optional)';
+    switch (getLanguage()) {
+        case 'fi':
+            defaultText = '(valinnainen)';
+            break;
+        case 'sv':
+            defaultText = '(valfritt)';
+            break;
+    }
+    return [text, optionalText || defaultText].join(' ');
+};
+const getRequiredText = (text) => [text, '*'].join(' ');
+const atLeastOneOption = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Valitse vähintään yksi vaihtoehto.';
+        case 'sv':
+            return 'Välj minst ett alternativ.';
+        default:
+            return 'Select at least one option.';
+    }
+};
+const allOptions = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Valitse kaikki vaihtoehdot.';
+        case 'sv':
+            return 'Välj alla alternativ.';
+        default:
+            return 'Select all options.';
+    }
+};
+const removeSelection = (capitalizeFirstLetter = false) => {
+    let text = '';
+    switch (getLanguage()) {
+        case 'fi':
+            text = 'poista valinta';
+            break;
+        case 'sv':
+            text = 'ta bort val';
+            break;
+        default:
+            text = 'remove selection';
+            break;
+    }
+    return capitalizeFirstLetter ? text[0].toUpperCase() + text.substring(1) : text;
+};
+const weCouldNotLoadOptions = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Emme voineet ladata vaihtoehtoja.';
+        case 'sv':
+            return 'Vi kunde inte ladda alternativen.';
+        default:
+            return 'We could not load options.';
+    }
+};
+const tryAgainOrIfTheProblemPersists = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Yritä uudelleen tai jos ongelma jatkuu, ota yhteyttä ylläpitoon.';
+        case 'sv':
+            return 'Försök igen eller om problemet kvarstår, kontakta supporten.';
+        default:
+            return 'Try again or if the problem persists, contact support.';
+    }
+};
+const loadingOptions = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Ladataan vaihtoehtoja...';
+        case 'sv':
+            return 'Laddar alternativ...';
+        default:
+            return 'Loading options...';
+    }
+};
+const searchOrSelectAnOption = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Kirjoita tai valitse...';
+        case 'sv':
+            return 'Sök eller välj...';
+        default:
+            return 'Search or select...';
+    }
+};
+const noResultsFound = (searchTerm) => {
+    switch (getLanguage()) {
+        case 'fi':
+            return searchTerm ? `Ei tuloksia haulle "${searchTerm}".` : `Ei tuloksia.`;
+        case 'sv':
+            return searchTerm ? `Inga resultat för sökningen "${searchTerm}".` : `Inga resultat.`;
+        default:
+            return searchTerm ? `No results found for "${searchTerm}".` : `No results found.`;
+    }
+};
+const tryADifferentSearchTerm = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Kokeile toista hakusanaa.';
+        case 'sv':
+            return 'Prova ett annat sökord.';
+        default:
+            return 'Try a different search term.';
+    }
+};
+const thereAreOptionsToBrowse = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Vaihtoehtoja on selattavissa.';
+        case 'sv':
+            return 'Det finns alternativ att bläddra i.';
+        default:
+            return 'There are options to browse.';
+    }
+};
+const characterOverage = (overage) => {
+    switch (getLanguage()) {
+        case 'fi':
+            return `${overage} merkkiä liian pitkä.`;
+        case 'sv':
+            return `${overage} tecken för mycket.`;
+        default:
+            return `${overage} characters too many.`;
+    }
+};
+const charactersRemaining = (remaining) => {
+    switch (getLanguage()) {
+        case 'fi':
+            return `${remaining} merkkiä jäljellä.`;
+        case 'sv':
+            return `${remaining} tecken kvar.`;
+        default:
+            return `${remaining} characters remaining.`;
+    }
+};
+const itemsShortage = (shortage) => {
+    switch (getLanguage()) {
+        case 'fi':
+            if (shortage === 1) {
+                return `${shortage} valinta liian vähän.`;
+            }
+            return `${shortage} valintaa liian vähän.`;
+        case 'sv':
+            return `${shortage} val för lite.`;
+        default:
+            if (shortage === 1) {
+                return `${shortage} item too few.`;
+            }
+            return `${shortage} items too few.`;
+    }
+};
+const itemsOverage = (overage) => {
+    switch (getLanguage()) {
+        case 'fi':
+            if (overage === 1) {
+                return `${overage} valinta liikaa.`;
+            }
+            return `${overage} valintaa liikaa.`;
+        case 'sv':
+            return `${overage} val för många.`;
+        default:
+            if (overage === 1) {
+                return `${overage} item too many.`;
+            }
+            return `${overage} items too many.`;
+    }
+};
+const clearField = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Tyhjennä kenttä';
+        case 'sv':
+            return 'Rensa fält';
+        default:
+            return 'Clear field';
+    }
+};
+const showPassword = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Näytä salasana';
+        case 'sv':
+            return 'Visa lösenord';
+        default:
+            return 'Show password';
+    }
+};
+const hidePassword = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Piilota salasana';
+        case 'sv':
+            return 'Dölj lösenord';
+        default:
+            return 'Hide password';
+    }
+};
+const selectAnOption = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Valitse vaihtoehto';
+        case 'sv':
+            return 'Välj alternativ';
+        default:
+            return 'Select an option';
+    }
+};
+const selections = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'valintaa';
+        case 'sv':
+            return 'val';
+        default:
+            return 'selections';
+    }
+};
+const multiselectable = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'monivalinta';
+        case 'sv':
+            return 'flerval';
+        default:
+            return 'multiselectable';
+    }
+};
+const ellipsis = () => {
+    switch (getLanguage()) {
+        case 'fi':
+            return 'Kolme pistettä';
+        case 'sv':
+            return 'Tre punkter';
+        default:
+            return 'Ellipsis';
+    }
+};
+
+export { badInput as A, rangeUnderflow as B, rangeOverflow as C, getOptionalText as a, atLeastOneOption as b, allOptions as c, itemsOverage as d, thereAreOptionsToBrowse as e, tryAgainOrIfTheProblemPersists as f, getRequiredText as g, selections as h, itemsShortage as i, hidePassword as j, showPassword as k, loadingOptions as l, multiselectable as m, noResultsFound as n, clearField as o, ellipsis as p, characterOverage as q, removeSelection as r, searchOrSelectAnOption as s, tryADifferentSearchTerm as t, tooLong as u, validityMessage as v, weCouldNotLoadOptions as w, charactersRemaining as x, selectAnOption as y, valueMissing as z };

package/dist/esm/cx-_iBy9YIS.js

@@ -0,0 +1,5 @@
+import { E as Env } from './index-CekDlrI5.js';
+
+const cx = (className) => `${className}__${Env.PACKAGE_VERSION}`;
+
+export { cx as c };