@warp-ds/elements 1.2.3-next.1 → 1.3.0-next.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +2 -1
- package/dist/index.js +412 -296
- package/dist/index.js.map +4 -4
- package/dist/packages/affix/index.js +72 -58
- package/dist/packages/affix/index.js.map +4 -4
- package/dist/packages/alert/index.js +80 -66
- package/dist/packages/alert/index.js.map +4 -4
- package/dist/packages/attention/index.js +71 -57
- package/dist/packages/attention/index.js.map +4 -4
- package/dist/packages/badge/index.js +3 -3
- package/dist/packages/badge/index.js.map +2 -2
- package/dist/packages/box/index.js +3 -3
- package/dist/packages/box/index.js.map +2 -2
- package/dist/packages/breadcrumbs/index.js +67 -53
- package/dist/packages/breadcrumbs/index.js.map +4 -4
- package/dist/packages/button/index.js +66 -52
- package/dist/packages/button/index.js.map +4 -4
- package/dist/packages/card/index.js +3 -3
- package/dist/packages/card/index.js.map +2 -2
- package/dist/packages/expandable/index.js +72 -58
- package/dist/packages/expandable/index.js.map +4 -4
- package/dist/packages/pill/index.d.ts +34 -0
- package/dist/packages/pill/index.js +1810 -0
- package/dist/packages/pill/index.js.map +7 -0
- package/dist/packages/pill/locales/en/messages.d.mts +1 -0
- package/dist/packages/pill/locales/fi/messages.d.mts +1 -0
- package/dist/packages/pill/locales/nb/messages.d.mts +1 -0
- package/dist/packages/select/index.js +70 -56
- package/dist/packages/select/index.js.map +4 -4
- package/dist/packages/textfield/index.js +3 -3
- package/dist/packages/textfield/index.js.map +2 -2
- package/dist/packages/toast/index.js +83 -69
- package/dist/packages/toast/index.js.map +4 -4
- package/package.json +7 -18
|
@@ -1029,7 +1029,7 @@ import { html as html3 } from "lit";
|
|
|
1029
1029
|
import WarpElement from "@warp-ds/elements-core";
|
|
1030
1030
|
import { ifDefined } from "lit/directives/if-defined.js";
|
|
1031
1031
|
|
|
1032
|
-
// node_modules/.pnpm/@warp-ds+css@1.
|
|
1032
|
+
// node_modules/.pnpm/@warp-ds+css@1.7.0/node_modules/@warp-ds/css/component-classes/index.js
|
|
1033
1033
|
var box = {
|
|
1034
1034
|
box: "group block relative break-words last-child:mb-0 p-16 rounded-8",
|
|
1035
1035
|
// Relative here enables w-clickable
|
|
@@ -1189,9 +1189,9 @@ var modal = {
|
|
|
1189
1189
|
content: "block overflow-y-auto overflow-x-hidden last-child:mb-0 grow shrink px-16 sm:px-32 relative",
|
|
1190
1190
|
footer: "flex justify-end shrink-0 px-16 sm:px-32",
|
|
1191
1191
|
transitionTitle: "transition-all duration-300",
|
|
1192
|
-
transitionTitleCenter: "justify-self-center",
|
|
1192
|
+
transitionTitleCenter: "justify-self-center self-center",
|
|
1193
1193
|
transitionTitleColSpan: "col-span-2",
|
|
1194
|
-
title: "-mt-4 sm:-mt-8 h-40 sm:h-48 grid gap-8 sm:gap-16 grid-cols-[auto_1fr_auto] items-
|
|
1194
|
+
title: "py-8 sm:py-0 -mt-4 sm:-mt-8 min-h-40 sm:min-h-48 grid gap-8 sm:gap-16 grid-cols-[auto_1fr_auto] items-start px-16 sm:px-32 border-b sm:border-b-0 shrink-0",
|
|
1195
1195
|
titleText: "mb-0 h4 sm:h3",
|
|
1196
1196
|
titleButton: `${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonColors.pill} sm:min-h-[44px] sm:min-w-[44px] min-h-[32px] min-w-[32px]`,
|
|
1197
1197
|
titleButtonLeft: "-ml-8 sm:-ml-12 justify-self-start",
|
|
@@ -1243,14 +1243,14 @@ var attention = {
|
|
|
1243
1243
|
closeBtn: `${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonColors.pill} justify-self-end -mr-8 ml-8`
|
|
1244
1244
|
};
|
|
1245
1245
|
|
|
1246
|
-
// node_modules/.pnpm/@warp-ds+icons@1.
|
|
1246
|
+
// node_modules/.pnpm/@warp-ds+icons@1.4.0/node_modules/@warp-ds/icons/dist/elements/search-16.js
|
|
1247
1247
|
import { LitElement } from "lit";
|
|
1248
1248
|
import { unsafeStatic, html } from "lit/static-html.js";
|
|
1249
1249
|
|
|
1250
|
-
// node_modules/.pnpm/@lingui+core@4.
|
|
1250
|
+
// node_modules/.pnpm/@lingui+core@4.7.0/node_modules/@lingui/core/dist/index.mjs
|
|
1251
1251
|
var import_unraw = __toESM(require_dist(), 1);
|
|
1252
1252
|
|
|
1253
|
-
// node_modules/.pnpm/@lingui+message-utils@4.
|
|
1253
|
+
// node_modules/.pnpm/@lingui+message-utils@4.7.0/node_modules/@lingui/message-utils/dist/compileMessage.mjs
|
|
1254
1254
|
var import_parser = __toESM(require_parser(), 1);
|
|
1255
1255
|
function processTokens(tokens, mapText) {
|
|
1256
1256
|
if (!tokens.filter((token) => token.type !== "content").length) {
|
|
@@ -1300,13 +1300,14 @@ Message: ${message}`);
|
|
|
1300
1300
|
}
|
|
1301
1301
|
}
|
|
1302
1302
|
|
|
1303
|
-
// node_modules/.pnpm/@lingui+core@4.
|
|
1303
|
+
// node_modules/.pnpm/@lingui+core@4.7.0/node_modules/@lingui/core/dist/index.mjs
|
|
1304
1304
|
var isString = (s) => typeof s === "string";
|
|
1305
1305
|
var isFunction = (f) => typeof f === "function";
|
|
1306
1306
|
var cache = /* @__PURE__ */ new Map();
|
|
1307
|
+
var defaultLocale = "en";
|
|
1307
1308
|
function normalizeLocales(locales) {
|
|
1308
1309
|
const out = Array.isArray(locales) ? locales : [locales];
|
|
1309
|
-
return [...out,
|
|
1310
|
+
return [...out, defaultLocale];
|
|
1310
1311
|
}
|
|
1311
1312
|
function date(locales, value, format) {
|
|
1312
1313
|
const _locales = normalizeLocales(locales);
|
|
@@ -1351,11 +1352,13 @@ function cacheKey(type, locales, options) {
|
|
|
1351
1352
|
return `${type}-${localeKey}-${JSON.stringify(options)}`;
|
|
1352
1353
|
}
|
|
1353
1354
|
var UNICODE_REGEX = /\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/g;
|
|
1354
|
-
var getDefaultFormats = (locale,
|
|
1355
|
-
locales =
|
|
1356
|
-
const style = (format) =>
|
|
1355
|
+
var getDefaultFormats = (locale, passedLocales, formats = {}) => {
|
|
1356
|
+
const locales = passedLocales || locale;
|
|
1357
|
+
const style = (format) => {
|
|
1358
|
+
return typeof format === "object" ? format : formats[format] || { style: format };
|
|
1359
|
+
};
|
|
1357
1360
|
const replaceOctothorpe = (value, message) => {
|
|
1358
|
-
const numberFormat = Object.keys(formats).length ? style("number") :
|
|
1361
|
+
const numberFormat = Object.keys(formats).length ? style("number") : void 0;
|
|
1359
1362
|
const valueStr = number(locales, value, numberFormat);
|
|
1360
1363
|
return message.replace("#", valueStr);
|
|
1361
1364
|
};
|
|
@@ -1370,17 +1373,19 @@ var getDefaultFormats = (locale, locales, formats = {}) => {
|
|
|
1370
1373
|
const message = plural(locales, true, value, cases);
|
|
1371
1374
|
return replaceOctothorpe(value - offset, message);
|
|
1372
1375
|
},
|
|
1373
|
-
select:
|
|
1374
|
-
var _a;
|
|
1375
|
-
return (_a = rules[value]) != null ? _a : rules.other;
|
|
1376
|
-
},
|
|
1376
|
+
select: selectFormatter,
|
|
1377
1377
|
number: (value, format) => number(locales, value, style(format)),
|
|
1378
1378
|
date: (value, format) => date(locales, value, style(format)),
|
|
1379
|
-
undefined:
|
|
1379
|
+
undefined: undefinedFormatter
|
|
1380
1380
|
};
|
|
1381
1381
|
};
|
|
1382
|
+
var selectFormatter = (value, rules) => {
|
|
1383
|
+
var _a;
|
|
1384
|
+
return (_a = rules[value]) != null ? _a : rules.other;
|
|
1385
|
+
};
|
|
1386
|
+
var undefinedFormatter = (value) => value;
|
|
1382
1387
|
function interpolate(translation, locale, locales) {
|
|
1383
|
-
return (values
|
|
1388
|
+
return (values = {}, formats) => {
|
|
1384
1389
|
const formatters = getDefaultFormats(locale, locales, formats);
|
|
1385
1390
|
const formatMessage = (message) => {
|
|
1386
1391
|
if (!Array.isArray(message))
|
|
@@ -1390,14 +1395,15 @@ function interpolate(translation, locale, locales) {
|
|
|
1390
1395
|
return message2 + token;
|
|
1391
1396
|
const [name, type, format] = token;
|
|
1392
1397
|
let interpolatedFormat = {};
|
|
1393
|
-
if (format != null &&
|
|
1394
|
-
Object.
|
|
1395
|
-
interpolatedFormat[key] = formatMessage(
|
|
1398
|
+
if (format != null && typeof format === "object") {
|
|
1399
|
+
Object.entries(format).forEach(([key, value2]) => {
|
|
1400
|
+
interpolatedFormat[key] = formatMessage(value2);
|
|
1396
1401
|
});
|
|
1397
1402
|
} else {
|
|
1398
1403
|
interpolatedFormat = format;
|
|
1399
1404
|
}
|
|
1400
|
-
const
|
|
1405
|
+
const formatter = formatters[type];
|
|
1406
|
+
const value = formatter(values[name], interpolatedFormat);
|
|
1401
1407
|
if (value == null)
|
|
1402
1408
|
return message2;
|
|
1403
1409
|
return message2 + value;
|
|
@@ -1409,7 +1415,7 @@ function interpolate(translation, locale, locales) {
|
|
|
1409
1415
|
}
|
|
1410
1416
|
if (isString(result))
|
|
1411
1417
|
return result.trim();
|
|
1412
|
-
return result;
|
|
1418
|
+
return result ? String(result) : "";
|
|
1413
1419
|
};
|
|
1414
1420
|
}
|
|
1415
1421
|
var __defProp$1 = Object.defineProperty;
|
|
@@ -1423,25 +1429,29 @@ var EventEmitter = class {
|
|
|
1423
1429
|
__publicField$1(this, "_events", {});
|
|
1424
1430
|
}
|
|
1425
1431
|
on(event, listener) {
|
|
1426
|
-
|
|
1427
|
-
|
|
1432
|
+
var _a2;
|
|
1433
|
+
var _a;
|
|
1434
|
+
(_a2 = (_a = this._events)[event]) != null ? _a2 : _a[event] = [];
|
|
1428
1435
|
this._events[event].push(listener);
|
|
1429
1436
|
return () => this.removeListener(event, listener);
|
|
1430
1437
|
}
|
|
1431
1438
|
removeListener(event, listener) {
|
|
1432
|
-
|
|
1439
|
+
const maybeListeners = this._getListeners(event);
|
|
1440
|
+
if (!maybeListeners)
|
|
1433
1441
|
return;
|
|
1434
|
-
const index =
|
|
1442
|
+
const index = maybeListeners.indexOf(listener);
|
|
1435
1443
|
if (~index)
|
|
1436
|
-
|
|
1444
|
+
maybeListeners.splice(index, 1);
|
|
1437
1445
|
}
|
|
1438
1446
|
emit(event, ...args) {
|
|
1439
|
-
|
|
1447
|
+
const maybeListeners = this._getListeners(event);
|
|
1448
|
+
if (!maybeListeners)
|
|
1440
1449
|
return;
|
|
1441
|
-
|
|
1450
|
+
maybeListeners.map((listener) => listener.apply(this, args));
|
|
1442
1451
|
}
|
|
1443
|
-
|
|
1444
|
-
|
|
1452
|
+
_getListeners(event) {
|
|
1453
|
+
const maybeListeners = this._events[event];
|
|
1454
|
+
return Array.isArray(maybeListeners) ? maybeListeners : false;
|
|
1445
1455
|
}
|
|
1446
1456
|
};
|
|
1447
1457
|
var __defProp2 = Object.defineProperty;
|
|
@@ -1452,23 +1462,22 @@ var __publicField2 = (obj, key, value) => {
|
|
|
1452
1462
|
};
|
|
1453
1463
|
var I18n = class extends EventEmitter {
|
|
1454
1464
|
constructor(params) {
|
|
1465
|
+
var _a;
|
|
1455
1466
|
super();
|
|
1456
|
-
__publicField2(this, "_locale");
|
|
1467
|
+
__publicField2(this, "_locale", "");
|
|
1457
1468
|
__publicField2(this, "_locales");
|
|
1458
|
-
__publicField2(this, "_localeData");
|
|
1459
|
-
__publicField2(this, "_messages");
|
|
1469
|
+
__publicField2(this, "_localeData", {});
|
|
1470
|
+
__publicField2(this, "_messages", {});
|
|
1460
1471
|
__publicField2(this, "_missing");
|
|
1461
1472
|
__publicField2(this, "t", this._.bind(this));
|
|
1462
|
-
this._messages = {};
|
|
1463
|
-
this._localeData = {};
|
|
1464
1473
|
if (params.missing != null)
|
|
1465
1474
|
this._missing = params.missing;
|
|
1466
1475
|
if (params.messages != null)
|
|
1467
1476
|
this.load(params.messages);
|
|
1468
1477
|
if (params.localeData != null)
|
|
1469
1478
|
this.loadLocaleData(params.localeData);
|
|
1470
|
-
if (params.locale
|
|
1471
|
-
this.activate(params.locale, params.locales);
|
|
1479
|
+
if (typeof params.locale === "string" || params.locales) {
|
|
1480
|
+
this.activate((_a = params.locale) != null ? _a : defaultLocale, params.locales);
|
|
1472
1481
|
}
|
|
1473
1482
|
}
|
|
1474
1483
|
get locale() {
|
|
@@ -1489,15 +1498,17 @@ var I18n = class extends EventEmitter {
|
|
|
1489
1498
|
return (_a = this._localeData[this._locale]) != null ? _a : {};
|
|
1490
1499
|
}
|
|
1491
1500
|
_loadLocaleData(locale, localeData) {
|
|
1492
|
-
|
|
1501
|
+
const maybeLocaleData = this._localeData[locale];
|
|
1502
|
+
if (!maybeLocaleData) {
|
|
1493
1503
|
this._localeData[locale] = localeData;
|
|
1494
1504
|
} else {
|
|
1495
|
-
Object.assign(
|
|
1505
|
+
Object.assign(maybeLocaleData, localeData);
|
|
1496
1506
|
}
|
|
1497
1507
|
}
|
|
1498
1508
|
/**
|
|
1499
1509
|
* @deprecated Plurals automatically used from Intl.PluralRules you can safely remove this call. Deprecated in v4
|
|
1500
1510
|
*/
|
|
1511
|
+
// @ts-ignore deprecated, so ignore the reported error
|
|
1501
1512
|
loadLocaleData(localeOrAllData, localeData) {
|
|
1502
1513
|
if (localeData != null) {
|
|
1503
1514
|
this._loadLocaleData(localeOrAllData, localeData);
|
|
@@ -1509,18 +1520,19 @@ var I18n = class extends EventEmitter {
|
|
|
1509
1520
|
this.emit("change");
|
|
1510
1521
|
}
|
|
1511
1522
|
_load(locale, messages5) {
|
|
1512
|
-
|
|
1523
|
+
const maybeMessages = this._messages[locale];
|
|
1524
|
+
if (!maybeMessages) {
|
|
1513
1525
|
this._messages[locale] = messages5;
|
|
1514
1526
|
} else {
|
|
1515
|
-
Object.assign(
|
|
1527
|
+
Object.assign(maybeMessages, messages5);
|
|
1516
1528
|
}
|
|
1517
1529
|
}
|
|
1518
1530
|
load(localeOrMessages, messages5) {
|
|
1519
|
-
if (messages5
|
|
1531
|
+
if (typeof localeOrMessages == "string" && typeof messages5 === "object") {
|
|
1520
1532
|
this._load(localeOrMessages, messages5);
|
|
1521
1533
|
} else {
|
|
1522
|
-
Object.
|
|
1523
|
-
(locale) => this._load(locale,
|
|
1534
|
+
Object.entries(localeOrMessages).forEach(
|
|
1535
|
+
([locale, messages23]) => this._load(locale, messages23)
|
|
1524
1536
|
);
|
|
1525
1537
|
}
|
|
1526
1538
|
this.emit("change");
|
|
@@ -1544,13 +1556,15 @@ var I18n = class extends EventEmitter {
|
|
|
1544
1556
|
this._locales = locales;
|
|
1545
1557
|
this.emit("change");
|
|
1546
1558
|
}
|
|
1547
|
-
_(id, values
|
|
1559
|
+
_(id, values, options) {
|
|
1560
|
+
let message = options == null ? void 0 : options.message;
|
|
1548
1561
|
if (!isString(id)) {
|
|
1549
1562
|
values = id.values || values;
|
|
1550
1563
|
message = id.message;
|
|
1551
1564
|
id = id.id;
|
|
1552
1565
|
}
|
|
1553
|
-
const
|
|
1566
|
+
const messageForId = this.messages[id];
|
|
1567
|
+
const messageMissing = messageForId === void 0;
|
|
1554
1568
|
const missing = this._missing;
|
|
1555
1569
|
if (missing && messageMissing) {
|
|
1556
1570
|
return isFunction(missing) ? missing(this._locale, id) : missing;
|
|
@@ -1558,7 +1572,7 @@ var I18n = class extends EventEmitter {
|
|
|
1558
1572
|
if (messageMissing) {
|
|
1559
1573
|
this.emit("missing", { id, locale: this._locale });
|
|
1560
1574
|
}
|
|
1561
|
-
let translation =
|
|
1575
|
+
let translation = messageForId || message || id;
|
|
1562
1576
|
if (true) {
|
|
1563
1577
|
translation = isString(translation) ? compileMessage(translation) : translation;
|
|
1564
1578
|
}
|
|
@@ -1570,7 +1584,7 @@ var I18n = class extends EventEmitter {
|
|
|
1570
1584
|
translation,
|
|
1571
1585
|
this._locale,
|
|
1572
1586
|
this._locales
|
|
1573
|
-
)(values, formats);
|
|
1587
|
+
)(values, options == null ? void 0 : options.formats);
|
|
1574
1588
|
}
|
|
1575
1589
|
date(value, format) {
|
|
1576
1590
|
return date(this._locales || this._locale, value, format);
|
|
@@ -1584,16 +1598,16 @@ function setupI18n(params = {}) {
|
|
|
1584
1598
|
}
|
|
1585
1599
|
var i18n = setupI18n();
|
|
1586
1600
|
|
|
1587
|
-
// node_modules/.pnpm/@warp-ds+icons@1.
|
|
1601
|
+
// node_modules/.pnpm/@warp-ds+icons@1.4.0/node_modules/@warp-ds/icons/dist/elements/search-16.js
|
|
1588
1602
|
var messages = JSON.parse('{"icon.title.search":"Forst\xF8rrelsesglass"}');
|
|
1589
1603
|
var messages2 = JSON.parse('{"icon.title.search":"Magnifying glass"}');
|
|
1590
1604
|
var messages3 = JSON.parse('{"icon.title.search":"Suurennuslasi"}');
|
|
1591
1605
|
var supportedLocales = ["en", "nb", "fi"];
|
|
1592
|
-
var
|
|
1606
|
+
var defaultLocale2 = "en";
|
|
1593
1607
|
var getSupportedLocale = (usedLocale) => {
|
|
1594
1608
|
return supportedLocales.find(
|
|
1595
1609
|
(locale) => usedLocale === locale || usedLocale.toLowerCase().includes(locale)
|
|
1596
|
-
) ||
|
|
1610
|
+
) || defaultLocale2;
|
|
1597
1611
|
};
|
|
1598
1612
|
function detectLocale() {
|
|
1599
1613
|
if (typeof window === "undefined") {
|
|
@@ -1605,7 +1619,7 @@ function detectLocale() {
|
|
|
1605
1619
|
return getSupportedLocale(htmlLocale);
|
|
1606
1620
|
} catch (e) {
|
|
1607
1621
|
console.warn("could not detect locale, falling back to source locale", e);
|
|
1608
|
-
return
|
|
1622
|
+
return defaultLocale2;
|
|
1609
1623
|
}
|
|
1610
1624
|
}
|
|
1611
1625
|
var getMessages = (locale, enMsg, nbMsg, fiMsg) => {
|
|
@@ -1632,18 +1646,18 @@ if (!customElements.get("w-icon-search-16")) {
|
|
|
1632
1646
|
customElements.define("w-icon-search-16", IconSearch16);
|
|
1633
1647
|
}
|
|
1634
1648
|
|
|
1635
|
-
// node_modules/.pnpm/@warp-ds+icons@1.
|
|
1649
|
+
// node_modules/.pnpm/@warp-ds+icons@1.4.0/node_modules/@warp-ds/icons/dist/elements/close-16.js
|
|
1636
1650
|
import { LitElement as LitElement2 } from "lit";
|
|
1637
1651
|
import { unsafeStatic as unsafeStatic2, html as html2 } from "lit/static-html.js";
|
|
1638
1652
|
var messages4 = JSON.parse('{"icon.title.close":"Kryss"}');
|
|
1639
1653
|
var messages22 = JSON.parse('{"icon.title.close":"Cross"}');
|
|
1640
1654
|
var messages32 = JSON.parse('{"icon.title.close":"Rasti"}');
|
|
1641
1655
|
var supportedLocales2 = ["en", "nb", "fi"];
|
|
1642
|
-
var
|
|
1656
|
+
var defaultLocale3 = "en";
|
|
1643
1657
|
var getSupportedLocale2 = (usedLocale) => {
|
|
1644
1658
|
return supportedLocales2.find(
|
|
1645
1659
|
(locale) => usedLocale === locale || usedLocale.toLowerCase().includes(locale)
|
|
1646
|
-
) ||
|
|
1660
|
+
) || defaultLocale3;
|
|
1647
1661
|
};
|
|
1648
1662
|
function detectLocale2() {
|
|
1649
1663
|
if (typeof window === "undefined") {
|
|
@@ -1655,7 +1669,7 @@ function detectLocale2() {
|
|
|
1655
1669
|
return getSupportedLocale2(htmlLocale);
|
|
1656
1670
|
} catch (e) {
|
|
1657
1671
|
console.warn("could not detect locale, falling back to source locale", e);
|
|
1658
|
-
return
|
|
1672
|
+
return defaultLocale3;
|
|
1659
1673
|
}
|
|
1660
1674
|
}
|
|
1661
1675
|
var getMessages2 = (locale, enMsg, nbMsg, fiMsg) => {
|