@warp-ds/elements 1.4.0-next.3 → 1.4.1-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.
@@ -1026,85 +1026,446 @@ var require_parser = __commonJS({
1026
1026
 
1027
1027
  // packages/breadcrumbs/index.js
1028
1028
  import { html } from "lit";
1029
- import WarpElement from "@warp-ds/elements-core";
1030
1029
 
1031
- // node_modules/.pnpm/@warp-ds+core@1.1.1_@floating-ui+dom@1.6.3/node_modules/@warp-ds/core/dist/breadcrumbs/index.js
1032
- function interleave(array, separator2) {
1033
- return array.flatMap((el) => [el, separator2]).slice(0, -1);
1030
+ // node_modules/.pnpm/@lingui+core@4.7.1/node_modules/@lingui/core/dist/index.mjs
1031
+ var import_unraw = __toESM(require_dist(), 1);
1032
+
1033
+ // node_modules/.pnpm/@lingui+message-utils@4.7.1/node_modules/@lingui/message-utils/dist/compileMessage.mjs
1034
+ var import_parser = __toESM(require_parser(), 1);
1035
+ function processTokens(tokens, mapText) {
1036
+ if (!tokens.filter((token) => token.type !== "content").length) {
1037
+ return tokens.map((token) => mapText(token.value)).join("");
1038
+ }
1039
+ return tokens.map((token) => {
1040
+ var _a;
1041
+ if (token.type === "content") {
1042
+ return mapText(token.value);
1043
+ } else if (token.type === "octothorpe") {
1044
+ return "#";
1045
+ } else if (token.type === "argument") {
1046
+ return [token.arg];
1047
+ } else if (token.type === "function") {
1048
+ const _param = (_a = token == null ? void 0 : token.param) == null ? void 0 : _a[0];
1049
+ if (_param) {
1050
+ return [token.arg, token.key, _param.value.trim()];
1051
+ } else {
1052
+ return [token.arg, token.key];
1053
+ }
1054
+ }
1055
+ const offset = token.pluralOffset;
1056
+ const formatProps = {};
1057
+ token.cases.forEach((item) => {
1058
+ formatProps[item.key.replace(/^=(.)+/, "$1")] = processTokens(
1059
+ item.tokens,
1060
+ mapText
1061
+ );
1062
+ });
1063
+ return [
1064
+ token.arg,
1065
+ token.type,
1066
+ __spreadValues({
1067
+ offset
1068
+ }, formatProps)
1069
+ ];
1070
+ });
1034
1071
  }
1072
+ function compileMessage(message, mapText = (v) => v) {
1073
+ try {
1074
+ return processTokens((0, import_parser.parse)(message), mapText);
1075
+ } catch (e) {
1076
+ console.error(`${e.message}
1035
1077
 
1036
- // node_modules/.pnpm/@warp-ds+css@1.9.6/node_modules/@warp-ds/css/component-classes/index.js
1037
- var box = {
1038
- box: "group block relative break-words last-child:mb-0 p-16 rounded-8",
1039
- // Relative here enables w-clickable
1040
- bleed: "-mx-16 sm:mx-0 rounded-l-0 rounded-r-0 sm:rounded-8",
1041
- // We target L and R to override the default rounded-8
1042
- info: "s-bg-info-subtle",
1043
- neutral: "s-surface-sunken",
1044
- bordered: "border-2 s-border s-bg",
1045
- infoClickable: "hover:s-bg-info-subtle-hover active:s-bg-info-subtle-active",
1046
- // Deprecated - Remove in v2 (after removing Clickable prop in the Box components)
1047
- neutralClickable: "hover:s-bg-hover active:s-bg-active",
1048
- // Deprecated - Remove in v2 (after removing Clickable prop in the Box components)
1049
- borderedClickable: "hover:s-bg-hover active:s-bg-active hover:s-border-hover active:s-border-active"
1050
- // Deprecated - Remove in v2 (after removing Clickable prop in the Box components)
1051
- };
1052
- var buttonReset = "focus:outline-none appearance-none cursor-pointer bg-transparent border-0 m-0 p-0 inline-block";
1053
- var expandable = {
1054
- expandable: "will-change-height",
1055
- expandableTitle: "font-bold s-text",
1056
- expandableBox: "s-surface-sunken hover:s-bg-hover active:s-bg-active py-0 px-0 " + box.box,
1057
- expandableInfo: "s-bg-info-subtle! hover:s-bg-info-subtle-hover!",
1058
- expandableBleed: box.bleed,
1059
- chevron: "inline-block align-middle s-icon",
1060
- chevronNonBox: "ml-8",
1061
- chevronBox: "",
1062
- chevronTransform: "transform transition-transform transform-gpu ease-in-out",
1063
- chevronExpand: "-rotate-180",
1064
- chevronCollapse: "rotate-180",
1065
- elementsTransformChevronDownPart: "part-[w-icon-chevron-down-16-part]:transform part-[w-icon-chevron-down-16-part]:transition-transform part-[w-icon-chevron-down-16-part]:transform-gpu part-[w-icon-chevron-down-16-part]:ease-in-out",
1066
- elementsChevronDownExpandPart: "part-[w-icon-chevron-down-16-part]:-rotate-180",
1067
- elementsTransformChevronUpPart: "part-[w-icon-chevron-up-16-part]:transform part-[w-icon-chevron-up-16-part]:transition-transform part-[w-icon-chevron-up-16-part]:transform-gpu part-[w-icon-chevron-up-16-part]:ease-in-out",
1068
- elementsChevronUpCollapsePart: "part-[w-icon-chevron-up-16-part]:rotate-180",
1069
- expansion: "overflow-hidden",
1070
- expansionNotExpanded: "h-0 invisible",
1071
- button: buttonReset + " hover:underline focus-visible:underline",
1072
- buttonBox: "w-full text-left relative inline-flex items-center justify-between " + box.box,
1073
- paddingTop: "pt-0",
1074
- title: "flex w-full justify-between items-center",
1075
- titleType: "h4"
1078
+ Message: ${message}`);
1079
+ return message;
1080
+ }
1081
+ }
1082
+
1083
+ // node_modules/.pnpm/@lingui+core@4.7.1/node_modules/@lingui/core/dist/index.mjs
1084
+ var isString = (s) => typeof s === "string";
1085
+ var isFunction = (f) => typeof f === "function";
1086
+ var cache = /* @__PURE__ */ new Map();
1087
+ var defaultLocale = "en";
1088
+ function normalizeLocales(locales) {
1089
+ const out = Array.isArray(locales) ? locales : [locales];
1090
+ return [...out, defaultLocale];
1091
+ }
1092
+ function date(locales, value, format) {
1093
+ const _locales = normalizeLocales(locales);
1094
+ const formatter = getMemoized(
1095
+ () => cacheKey("date", _locales, format),
1096
+ () => new Intl.DateTimeFormat(_locales, format)
1097
+ );
1098
+ return formatter.format(isString(value) ? new Date(value) : value);
1099
+ }
1100
+ function number(locales, value, format) {
1101
+ const _locales = normalizeLocales(locales);
1102
+ const formatter = getMemoized(
1103
+ () => cacheKey("number", _locales, format),
1104
+ () => new Intl.NumberFormat(_locales, format)
1105
+ );
1106
+ return formatter.format(value);
1107
+ }
1108
+ function plural(locales, ordinal, value, _a) {
1109
+ var _b = _a, { offset = 0 } = _b, rules = __objRest(_b, ["offset"]);
1110
+ var _a2, _b2;
1111
+ const _locales = normalizeLocales(locales);
1112
+ const plurals = ordinal ? getMemoized(
1113
+ () => cacheKey("plural-ordinal", _locales),
1114
+ () => new Intl.PluralRules(_locales, { type: "ordinal" })
1115
+ ) : getMemoized(
1116
+ () => cacheKey("plural-cardinal", _locales),
1117
+ () => new Intl.PluralRules(_locales, { type: "cardinal" })
1118
+ );
1119
+ return (_b2 = (_a2 = rules[value]) != null ? _a2 : rules[plurals.select(value - offset)]) != null ? _b2 : rules.other;
1120
+ }
1121
+ function getMemoized(getKey, construct) {
1122
+ const key = getKey();
1123
+ let formatter = cache.get(key);
1124
+ if (!formatter) {
1125
+ formatter = construct();
1126
+ cache.set(key, formatter);
1127
+ }
1128
+ return formatter;
1129
+ }
1130
+ function cacheKey(type, locales, options) {
1131
+ const localeKey = locales.join("-");
1132
+ return `${type}-${localeKey}-${JSON.stringify(options)}`;
1133
+ }
1134
+ var UNICODE_REGEX = /\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/g;
1135
+ var OCTOTHORPE_PH = "%__lingui_octothorpe__%";
1136
+ var getDefaultFormats = (locale, passedLocales, formats = {}) => {
1137
+ const locales = passedLocales || locale;
1138
+ const style = (format) => {
1139
+ return typeof format === "object" ? format : formats[format] || { style: format };
1140
+ };
1141
+ const replaceOctothorpe = (value, message) => {
1142
+ const numberFormat = Object.keys(formats).length ? style("number") : void 0;
1143
+ const valueStr = number(locales, value, numberFormat);
1144
+ return message.replace(new RegExp(OCTOTHORPE_PH, "g"), valueStr);
1145
+ };
1146
+ return {
1147
+ plural: (value, cases) => {
1148
+ const { offset = 0 } = cases;
1149
+ const message = plural(locales, false, value, cases);
1150
+ return replaceOctothorpe(value - offset, message);
1151
+ },
1152
+ selectordinal: (value, cases) => {
1153
+ const { offset = 0 } = cases;
1154
+ const message = plural(locales, true, value, cases);
1155
+ return replaceOctothorpe(value - offset, message);
1156
+ },
1157
+ select: selectFormatter,
1158
+ number: (value, format) => number(locales, value, style(format)),
1159
+ date: (value, format) => date(locales, value, style(format))
1160
+ };
1076
1161
  };
1077
- var buttonDefaultStyling = "font-bold focusable justify-center transition-colors ease-in-out";
1078
- var buttonColors = {
1079
- primary: "s-text-inverted bg-[--w-color-button-primary-background] hover:bg-[--w-color-button-primary-background-hover] active:bg-[--w-color-button-primary-background-active]",
1080
- secondary: "s-text-link s-border s-bg hover:s-bg-hover hover:s-border-hover active:s-bg-active",
1081
- utility: "s-text s-bg hover:s-bg-hover active:s-bg-active s-border hover:s-border-hover active:s-border-active",
1082
- destructive: "s-bg-negative s-text-inverted hover:s-bg-negative-hover active:s-bg-negative-active",
1083
- pill: "s-icon hover:s-icon-hover active:s-icon-active bg-transparent hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]",
1084
- disabled: "s-text-inverted s-bg-disabled",
1085
- quiet: "bg-transparent s-text-link hover:s-bg-hover active:s-bg-active",
1086
- utilityQuiet: "s-text bg-transparent hover:s-bg-hover active:s-bg-active",
1087
- negativeQuiet: "bg-transparent s-text-negative hover:s-bg-negative-subtle-hover active:s-bg-negative-subtle-active",
1088
- loading: "s-text s-bg-subtle",
1089
- link: "s-text-link"
1162
+ var selectFormatter = (value, rules) => {
1163
+ var _a;
1164
+ return (_a = rules[value]) != null ? _a : rules.other;
1090
1165
  };
1091
- var buttonTypes = {
1092
- primary: `border-0 rounded-8 ${buttonDefaultStyling}`,
1093
- secondary: `border-2 rounded-8 ${buttonDefaultStyling}`,
1094
- utility: `border rounded-4 ${buttonDefaultStyling}`,
1095
- negative: `border-0 rounded-8 ${buttonDefaultStyling}`,
1096
- pill: `p-4 rounded-full border-0 inline-flex items-center justify-center hover:bg-clip-padding ${buttonDefaultStyling}`,
1097
- link: `bg-transparent focusable ease-in-out inline active:underline hover:underline focus:underline ${buttonColors.link}`
1166
+ function interpolate(translation, locale, locales) {
1167
+ return (values = {}, formats) => {
1168
+ const formatters = getDefaultFormats(locale, locales, formats);
1169
+ const formatMessage = (tokens) => {
1170
+ if (!Array.isArray(tokens))
1171
+ return tokens;
1172
+ return tokens.reduce((message, token) => {
1173
+ if (token === "#") {
1174
+ return message + OCTOTHORPE_PH;
1175
+ }
1176
+ if (isString(token)) {
1177
+ return message + token;
1178
+ }
1179
+ const [name, type, format] = token;
1180
+ let interpolatedFormat = {};
1181
+ if (type === "plural" || type === "selectordinal" || type === "select") {
1182
+ Object.entries(format).forEach(
1183
+ ([key, value2]) => {
1184
+ interpolatedFormat[key] = formatMessage(value2);
1185
+ }
1186
+ );
1187
+ } else {
1188
+ interpolatedFormat = format;
1189
+ }
1190
+ let value;
1191
+ if (type) {
1192
+ const formatter = formatters[type];
1193
+ value = formatter(values[name], interpolatedFormat);
1194
+ } else {
1195
+ value = values[name];
1196
+ }
1197
+ if (value == null) {
1198
+ return message;
1199
+ }
1200
+ return message + value;
1201
+ }, "");
1202
+ };
1203
+ const result = formatMessage(translation);
1204
+ if (isString(result) && UNICODE_REGEX.test(result)) {
1205
+ return (0, import_unraw.unraw)(result.trim());
1206
+ }
1207
+ if (isString(result))
1208
+ return result.trim();
1209
+ return result ? String(result) : "";
1210
+ };
1211
+ }
1212
+ var __defProp$1 = Object.defineProperty;
1213
+ var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1214
+ var __publicField$1 = (obj, key, value) => {
1215
+ __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
1216
+ return value;
1098
1217
  };
1099
- var buttonSizes = {
1100
- xsmall: "py-6 px-16",
1101
- small: "py-8 px-16",
1102
- medium: "py-10 px-14",
1103
- large: "py-12 px-16",
1104
- utility: "py-[11px] px-[15px]",
1105
- smallUtility: "py-[7px] px-[15px]",
1106
- pill: "min-h-[44px] min-w-[44px]",
1107
- pillSmall: "min-h-32 min-w-32",
1218
+ var EventEmitter = class {
1219
+ constructor() {
1220
+ __publicField$1(this, "_events", {});
1221
+ }
1222
+ on(event, listener) {
1223
+ var _a2;
1224
+ var _a;
1225
+ (_a2 = (_a = this._events)[event]) != null ? _a2 : _a[event] = [];
1226
+ this._events[event].push(listener);
1227
+ return () => this.removeListener(event, listener);
1228
+ }
1229
+ removeListener(event, listener) {
1230
+ const maybeListeners = this._getListeners(event);
1231
+ if (!maybeListeners)
1232
+ return;
1233
+ const index = maybeListeners.indexOf(listener);
1234
+ if (~index)
1235
+ maybeListeners.splice(index, 1);
1236
+ }
1237
+ emit(event, ...args) {
1238
+ const maybeListeners = this._getListeners(event);
1239
+ if (!maybeListeners)
1240
+ return;
1241
+ maybeListeners.map((listener) => listener.apply(this, args));
1242
+ }
1243
+ _getListeners(event) {
1244
+ const maybeListeners = this._events[event];
1245
+ return Array.isArray(maybeListeners) ? maybeListeners : false;
1246
+ }
1247
+ };
1248
+ var __defProp2 = Object.defineProperty;
1249
+ var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1250
+ var __publicField2 = (obj, key, value) => {
1251
+ __defNormalProp2(obj, typeof key !== "symbol" ? key + "" : key, value);
1252
+ return value;
1253
+ };
1254
+ var I18n = class extends EventEmitter {
1255
+ constructor(params) {
1256
+ var _a;
1257
+ super();
1258
+ __publicField2(this, "_locale", "");
1259
+ __publicField2(this, "_locales");
1260
+ __publicField2(this, "_localeData", {});
1261
+ __publicField2(this, "_messages", {});
1262
+ __publicField2(this, "_missing");
1263
+ __publicField2(this, "t", this._.bind(this));
1264
+ if (params.missing != null)
1265
+ this._missing = params.missing;
1266
+ if (params.messages != null)
1267
+ this.load(params.messages);
1268
+ if (params.localeData != null)
1269
+ this.loadLocaleData(params.localeData);
1270
+ if (typeof params.locale === "string" || params.locales) {
1271
+ this.activate((_a = params.locale) != null ? _a : defaultLocale, params.locales);
1272
+ }
1273
+ }
1274
+ get locale() {
1275
+ return this._locale;
1276
+ }
1277
+ get locales() {
1278
+ return this._locales;
1279
+ }
1280
+ get messages() {
1281
+ var _a;
1282
+ return (_a = this._messages[this._locale]) != null ? _a : {};
1283
+ }
1284
+ /**
1285
+ * @deprecated this has no effect. Please remove this from the code. Deprecated in v4
1286
+ */
1287
+ get localeData() {
1288
+ var _a;
1289
+ return (_a = this._localeData[this._locale]) != null ? _a : {};
1290
+ }
1291
+ _loadLocaleData(locale, localeData) {
1292
+ const maybeLocaleData = this._localeData[locale];
1293
+ if (!maybeLocaleData) {
1294
+ this._localeData[locale] = localeData;
1295
+ } else {
1296
+ Object.assign(maybeLocaleData, localeData);
1297
+ }
1298
+ }
1299
+ /**
1300
+ * @deprecated Plurals automatically used from Intl.PluralRules you can safely remove this call. Deprecated in v4
1301
+ */
1302
+ // @ts-ignore deprecated, so ignore the reported error
1303
+ loadLocaleData(localeOrAllData, localeData) {
1304
+ if (localeData != null) {
1305
+ this._loadLocaleData(localeOrAllData, localeData);
1306
+ } else {
1307
+ Object.keys(localeOrAllData).forEach(
1308
+ (locale) => this._loadLocaleData(locale, localeOrAllData[locale])
1309
+ );
1310
+ }
1311
+ this.emit("change");
1312
+ }
1313
+ _load(locale, messages4) {
1314
+ const maybeMessages = this._messages[locale];
1315
+ if (!maybeMessages) {
1316
+ this._messages[locale] = messages4;
1317
+ } else {
1318
+ Object.assign(maybeMessages, messages4);
1319
+ }
1320
+ }
1321
+ load(localeOrMessages, messages4) {
1322
+ if (typeof localeOrMessages == "string" && typeof messages4 === "object") {
1323
+ this._load(localeOrMessages, messages4);
1324
+ } else {
1325
+ Object.entries(localeOrMessages).forEach(
1326
+ ([locale, messages22]) => this._load(locale, messages22)
1327
+ );
1328
+ }
1329
+ this.emit("change");
1330
+ }
1331
+ /**
1332
+ * @param options {@link LoadAndActivateOptions}
1333
+ */
1334
+ loadAndActivate({ locale, locales, messages: messages4 }) {
1335
+ this._locale = locale;
1336
+ this._locales = locales || void 0;
1337
+ this._messages[this._locale] = messages4;
1338
+ this.emit("change");
1339
+ }
1340
+ activate(locale, locales) {
1341
+ if (true) {
1342
+ if (!this._messages[locale]) {
1343
+ console.warn(`Messages for locale "${locale}" not loaded.`);
1344
+ }
1345
+ }
1346
+ this._locale = locale;
1347
+ this._locales = locales;
1348
+ this.emit("change");
1349
+ }
1350
+ _(id, values, options) {
1351
+ let message = options == null ? void 0 : options.message;
1352
+ if (!isString(id)) {
1353
+ values = id.values || values;
1354
+ message = id.message;
1355
+ id = id.id;
1356
+ }
1357
+ const messageForId = this.messages[id];
1358
+ const messageMissing = messageForId === void 0;
1359
+ const missing = this._missing;
1360
+ if (missing && messageMissing) {
1361
+ return isFunction(missing) ? missing(this._locale, id) : missing;
1362
+ }
1363
+ if (messageMissing) {
1364
+ this.emit("missing", { id, locale: this._locale });
1365
+ }
1366
+ let translation = messageForId || message || id;
1367
+ if (true) {
1368
+ translation = isString(translation) ? compileMessage(translation) : translation;
1369
+ }
1370
+ if (isString(translation) && UNICODE_REGEX.test(translation))
1371
+ return JSON.parse(`"${translation}"`);
1372
+ if (isString(translation))
1373
+ return translation;
1374
+ return interpolate(
1375
+ translation,
1376
+ this._locale,
1377
+ this._locales
1378
+ )(values, options == null ? void 0 : options.formats);
1379
+ }
1380
+ date(value, format) {
1381
+ return date(this._locales || this._locale, value, format);
1382
+ }
1383
+ number(value, format) {
1384
+ return number(this._locales || this._locale, value, format);
1385
+ }
1386
+ };
1387
+ function setupI18n(params = {}) {
1388
+ return new I18n(params);
1389
+ }
1390
+ var i18n = setupI18n();
1391
+
1392
+ // node_modules/.pnpm/@warp-ds+core@1.1.1_@floating-ui+dom@1.6.3/node_modules/@warp-ds/core/dist/breadcrumbs/index.js
1393
+ function interleave(array, separator2) {
1394
+ return array.flatMap((el) => [el, separator2]).slice(0, -1);
1395
+ }
1396
+
1397
+ // node_modules/.pnpm/@warp-ds+css@1.9.6/node_modules/@warp-ds/css/component-classes/index.js
1398
+ var box = {
1399
+ box: "group block relative break-words last-child:mb-0 p-16 rounded-8",
1400
+ // Relative here enables w-clickable
1401
+ bleed: "-mx-16 sm:mx-0 rounded-l-0 rounded-r-0 sm:rounded-8",
1402
+ // We target L and R to override the default rounded-8
1403
+ info: "s-bg-info-subtle",
1404
+ neutral: "s-surface-sunken",
1405
+ bordered: "border-2 s-border s-bg",
1406
+ infoClickable: "hover:s-bg-info-subtle-hover active:s-bg-info-subtle-active",
1407
+ // Deprecated - Remove in v2 (after removing Clickable prop in the Box components)
1408
+ neutralClickable: "hover:s-bg-hover active:s-bg-active",
1409
+ // Deprecated - Remove in v2 (after removing Clickable prop in the Box components)
1410
+ borderedClickable: "hover:s-bg-hover active:s-bg-active hover:s-border-hover active:s-border-active"
1411
+ // Deprecated - Remove in v2 (after removing Clickable prop in the Box components)
1412
+ };
1413
+ var buttonReset = "focus:outline-none appearance-none cursor-pointer bg-transparent border-0 m-0 p-0 inline-block";
1414
+ var expandable = {
1415
+ expandable: "will-change-height",
1416
+ expandableTitle: "font-bold s-text",
1417
+ expandableBox: "s-surface-sunken hover:s-bg-hover active:s-bg-active py-0 px-0 " + box.box,
1418
+ expandableInfo: "s-bg-info-subtle! hover:s-bg-info-subtle-hover!",
1419
+ expandableBleed: box.bleed,
1420
+ chevron: "inline-block align-middle s-icon",
1421
+ chevronNonBox: "ml-8",
1422
+ chevronBox: "",
1423
+ chevronTransform: "transform transition-transform transform-gpu ease-in-out",
1424
+ chevronExpand: "-rotate-180",
1425
+ chevronCollapse: "rotate-180",
1426
+ elementsTransformChevronDownPart: "part-[w-icon-chevron-down-16-part]:transform part-[w-icon-chevron-down-16-part]:transition-transform part-[w-icon-chevron-down-16-part]:transform-gpu part-[w-icon-chevron-down-16-part]:ease-in-out",
1427
+ elementsChevronDownExpandPart: "part-[w-icon-chevron-down-16-part]:-rotate-180",
1428
+ elementsTransformChevronUpPart: "part-[w-icon-chevron-up-16-part]:transform part-[w-icon-chevron-up-16-part]:transition-transform part-[w-icon-chevron-up-16-part]:transform-gpu part-[w-icon-chevron-up-16-part]:ease-in-out",
1429
+ elementsChevronUpCollapsePart: "part-[w-icon-chevron-up-16-part]:rotate-180",
1430
+ expansion: "overflow-hidden",
1431
+ expansionNotExpanded: "h-0 invisible",
1432
+ button: buttonReset + " hover:underline focus-visible:underline",
1433
+ buttonBox: "w-full text-left relative inline-flex items-center justify-between " + box.box,
1434
+ paddingTop: "pt-0",
1435
+ title: "flex w-full justify-between items-center",
1436
+ titleType: "h4"
1437
+ };
1438
+ var buttonDefaultStyling = "font-bold focusable justify-center transition-colors ease-in-out";
1439
+ var buttonColors = {
1440
+ primary: "s-text-inverted bg-[--w-color-button-primary-background] hover:bg-[--w-color-button-primary-background-hover] active:bg-[--w-color-button-primary-background-active]",
1441
+ secondary: "s-text-link s-border s-bg hover:s-bg-hover hover:s-border-hover active:s-bg-active",
1442
+ utility: "s-text s-bg hover:s-bg-hover active:s-bg-active s-border hover:s-border-hover active:s-border-active",
1443
+ destructive: "s-bg-negative s-text-inverted hover:s-bg-negative-hover active:s-bg-negative-active",
1444
+ pill: "s-icon hover:s-icon-hover active:s-icon-active bg-transparent hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]",
1445
+ disabled: "s-text-inverted s-bg-disabled",
1446
+ quiet: "bg-transparent s-text-link hover:s-bg-hover active:s-bg-active",
1447
+ utilityQuiet: "s-text bg-transparent hover:s-bg-hover active:s-bg-active",
1448
+ negativeQuiet: "bg-transparent s-text-negative hover:s-bg-negative-subtle-hover active:s-bg-negative-subtle-active",
1449
+ loading: "s-text s-bg-subtle",
1450
+ link: "s-text-link"
1451
+ };
1452
+ var buttonTypes = {
1453
+ primary: `border-0 rounded-8 ${buttonDefaultStyling}`,
1454
+ secondary: `border-2 rounded-8 ${buttonDefaultStyling}`,
1455
+ utility: `border rounded-4 ${buttonDefaultStyling}`,
1456
+ negative: `border-0 rounded-8 ${buttonDefaultStyling}`,
1457
+ pill: `p-4 rounded-full border-0 inline-flex items-center justify-center hover:bg-clip-padding ${buttonDefaultStyling}`,
1458
+ link: `bg-transparent focusable ease-in-out inline active:underline hover:underline focus:underline ${buttonColors.link}`
1459
+ };
1460
+ var buttonSizes = {
1461
+ xsmall: "py-6 px-16",
1462
+ small: "py-8 px-16",
1463
+ medium: "py-10 px-14",
1464
+ large: "py-12 px-16",
1465
+ utility: "py-[11px] px-[15px]",
1466
+ smallUtility: "py-[7px] px-[15px]",
1467
+ pill: "min-h-[44px] min-w-[44px]",
1468
+ pillSmall: "min-h-32 min-w-32",
1108
1469
  link: "p-0"
1109
1470
  };
1110
1471
  var buttonTextSizes = {
@@ -1264,452 +1625,67 @@ var toggle = {
1264
1625
  // isCheckbox && !isIndeterminate && !isInvalid && isDisabled
1265
1626
  indeterminate: 'before:content-["\u2013"] before:rounded-2 before:leading-xs before:text-center before:font-bold before:s-icon-inverted peer-indeterminate:before:s-border-primary peer-indeterminate:before:s-bg-primary peer-indeterminate:hover:before:s-border-primary-hover peer-indeterminate:hover:before:s-bg-primary-hover',
1266
1627
  // isCheckbox && isIndeterminate && !isInvalid && !isDisabled
1267
- indeterminateInvalid: 'before:content-["\u2013"] before:rounded-2 before:leading-xs before:text-center before:font-bold before:s-icon-inverted peer-indeterminate:before:s-border-negative peer-indeterminate:before:s-bg-negative peer-indeterminate:hover:before:s-border-negative-hover peer-indeterminate:hover:before:s-bg-negative-hover',
1268
- // isCheckbox && isIndeterminate && isInvalid && !isDisabled
1269
- indeterminateDisabled: 'before:content-["\u2013"] before:rounded-2 before:leading-xs before:text-center before:font-bold pointer-events-none before:s-icon-inverted peer-indeterminate:before:s-border-disabled peer-indeterminate:before:s-bg-disabled',
1270
- // isCheckbox && isIndeterminate && !isInvalid && isDisabled
1271
- radio: "before:s-bg before:rounded-full peer-checked:before:border-[6] peer-checked:before:s-border-selected peer-checked:peer-hover:before:s-border-selected-hover peer-hover:before:s-border-primary peer-hover:before:s-bg-hover",
1272
- // isRadio && !isDisabled && !isInvalid
1273
- radioInvalid: "before:s-bg before:s-border-negative before:rounded-full peer-checked:before:border-[6] peer-hover:before:s-bg-negative-subtle peer-hover:before:s-border-negative-hover peer-checked:before:s-border-negative peer-checked:peer-hover:before:s-border-negative-hover",
1274
- // isRadio && isInvalid && !isDisabled
1275
- radioDisabled: "before:s-bg-disabled-subtle before:s-border-disabled pointer-events-none before:rounded-full peer-checked:before:border-[6]",
1276
- // isRadio && !isInvalid && isDisabled
1277
- radioButtonsLabel: "peer-hover:peer-not-checked:s-bg-hover peer-checked:s-text-inverted peer-checked:s-bg-primary peer-checked:s-border-primary block relative font-bold cursor-pointer s-text-link text-center s-bg border-2 s-border group-first-of-type:rounded-tl-8 group-first-of-type:rounded-bl-8 group-last-of-type:rounded-tr-8 group-last-of-type:rounded-br-8 group-not-last-of-type:border-r-0 peer-checked:z-10 group-not-first:-ml-2",
1278
- // isRadioButtons
1279
- radioButtonsRegular: "text-s py-8 pl-12 pr-14",
1280
- // isRadioButtons && !isSmall
1281
- radioButtonsSmall: "text-xs py-[5px] px-[8px]"
1282
- // isRadioButtons && isSmall
1283
- };
1284
- var deadToggle = {
1285
- wrapper: `${toggle.wrapper} h-20 w-20 pointer-events-none`,
1286
- input: `${toggle.input} hidden`,
1287
- inputVue: "hidden",
1288
- labelRadio: `${toggle.label} ${toggle.labelBefore} ${toggle.radio}`,
1289
- labelCheckbox: `${toggle.label} ${toggle.labelBefore} ${toggle.checkbox}`,
1290
- labelVue: "-mt-2"
1291
- };
1292
- var clickable = {
1293
- toggle: "absolute inset-0 h-full w-full appearance-none cursor-pointer focusable focusable-inset",
1294
- label: `px-12 ${label.label} py-8! cursor-pointer focusable focusable-inset`,
1295
- buttonOrLink: "bg-transparent focusable",
1296
- buttonOrLinkStretch: "inset-0 absolute"
1297
- };
1298
- var attention = {
1299
- base: "border-2 relative flex items-start",
1300
- tooltip: "s-bg-inverted border-[--w-s-color-background-inverted] shadow-m s-text-inverted-static rounded-4 py-6 px-8",
1301
- callout: "bg-[--w-color-callout-background] border-[--w-color-callout-border] s-text py-8 px-16 rounded-8",
1302
- highlight: "bg-[--w-color-callout-background] border-[--w-color-callout-border] s-text py-8 px-16 rounded-8 drop-shadow-m translate-z-0",
1303
- popover: "bg-[--w-s-color-surface-elevated-300] border-[--w-s-color-surface-elevated-300] s-text rounded-8 p-16 drop-shadow-m translate-z-0",
1304
- arrowBase: "absolute h-[14px] w-[14px] border-2 border-b-0 border-r-0 rounded-tl-4 transform",
1305
- arrowDirectionLeftStart: "-left-[8px]",
1306
- arrowDirectionLeft: "-left-[8px]",
1307
- arrowDirectionLeftEnd: "-left-[8px]",
1308
- arrowDirectionRightStart: "-right-[8px]",
1309
- arrowDirectionRight: "-right-[8px]",
1310
- arrowDirectionRightEnd: "-right-[8px]",
1311
- arrowDirectionBottomStart: "-bottom-[8px]",
1312
- arrowDirectionBottom: "-bottom-[8px]",
1313
- arrowDirectionBottomEnd: "-bottom-[8px]",
1314
- arrowDirectionTopStart: "-top-[8px]",
1315
- arrowDirectionTop: "-top-[8px]",
1316
- arrowDirectionTopEnd: "-top-[8px]",
1317
- arrowTooltip: "s-bg-inverted border-[--w-s-color-background-inverted]",
1318
- arrowCallout: "bg-[--w-color-callout-background] border-[--w-color-callout-border]",
1319
- arrowPopover: "bg-[--w-s-color-surface-elevated-300] border-[--w-s-color-surface-elevated-300]",
1320
- arrowHighlight: "bg-[--w-color-callout-background] border-[--w-color-callout-border]",
1321
- content: "last-child:mb-0",
1322
- notCallout: "absolute z-50",
1323
- closeBtn: `${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonColors.pill} justify-self-end -mr-8 ml-8`
1324
- };
1325
-
1326
- // packages/utils/index.js
1327
- import { classMap } from "lit/directives/class-map.js";
1328
- var camelCaseToKebabCase = (str) => str.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
1329
- function kebabCaseAttributes(constructor) {
1330
- return class extends constructor {
1331
- static createProperty(name, options) {
1332
- let customOptions = options;
1333
- if (typeof (options == null ? void 0 : options.attribute) === "undefined" || (options == null ? void 0 : options.attribute) === true) {
1334
- customOptions = Object.assign({}, options, {
1335
- attribute: camelCaseToKebabCase(name.toString())
1336
- });
1337
- }
1338
- super.createProperty(name, customOptions);
1339
- }
1340
- };
1341
- }
1342
-
1343
- // node_modules/.pnpm/@lingui+core@4.7.1/node_modules/@lingui/core/dist/index.mjs
1344
- var import_unraw = __toESM(require_dist(), 1);
1345
-
1346
- // node_modules/.pnpm/@lingui+message-utils@4.7.1/node_modules/@lingui/message-utils/dist/compileMessage.mjs
1347
- var import_parser = __toESM(require_parser(), 1);
1348
- function processTokens(tokens, mapText) {
1349
- if (!tokens.filter((token) => token.type !== "content").length) {
1350
- return tokens.map((token) => mapText(token.value)).join("");
1351
- }
1352
- return tokens.map((token) => {
1353
- var _a;
1354
- if (token.type === "content") {
1355
- return mapText(token.value);
1356
- } else if (token.type === "octothorpe") {
1357
- return "#";
1358
- } else if (token.type === "argument") {
1359
- return [token.arg];
1360
- } else if (token.type === "function") {
1361
- const _param = (_a = token == null ? void 0 : token.param) == null ? void 0 : _a[0];
1362
- if (_param) {
1363
- return [token.arg, token.key, _param.value.trim()];
1364
- } else {
1365
- return [token.arg, token.key];
1366
- }
1367
- }
1368
- const offset = token.pluralOffset;
1369
- const formatProps = {};
1370
- token.cases.forEach((item) => {
1371
- formatProps[item.key.replace(/^=(.)+/, "$1")] = processTokens(
1372
- item.tokens,
1373
- mapText
1374
- );
1375
- });
1376
- return [
1377
- token.arg,
1378
- token.type,
1379
- __spreadValues({
1380
- offset
1381
- }, formatProps)
1382
- ];
1383
- });
1384
- }
1385
- function compileMessage(message, mapText = (v) => v) {
1386
- try {
1387
- return processTokens((0, import_parser.parse)(message), mapText);
1388
- } catch (e) {
1389
- console.error(`${e.message}
1390
-
1391
- Message: ${message}`);
1392
- return message;
1393
- }
1394
- }
1395
-
1396
- // node_modules/.pnpm/@lingui+core@4.7.1/node_modules/@lingui/core/dist/index.mjs
1397
- var isString = (s) => typeof s === "string";
1398
- var isFunction = (f) => typeof f === "function";
1399
- var cache = /* @__PURE__ */ new Map();
1400
- var defaultLocale = "en";
1401
- function normalizeLocales(locales) {
1402
- const out = Array.isArray(locales) ? locales : [locales];
1403
- return [...out, defaultLocale];
1404
- }
1405
- function date(locales, value, format) {
1406
- const _locales = normalizeLocales(locales);
1407
- const formatter = getMemoized(
1408
- () => cacheKey("date", _locales, format),
1409
- () => new Intl.DateTimeFormat(_locales, format)
1410
- );
1411
- return formatter.format(isString(value) ? new Date(value) : value);
1412
- }
1413
- function number(locales, value, format) {
1414
- const _locales = normalizeLocales(locales);
1415
- const formatter = getMemoized(
1416
- () => cacheKey("number", _locales, format),
1417
- () => new Intl.NumberFormat(_locales, format)
1418
- );
1419
- return formatter.format(value);
1420
- }
1421
- function plural(locales, ordinal, value, _a) {
1422
- var _b = _a, { offset = 0 } = _b, rules = __objRest(_b, ["offset"]);
1423
- var _a2, _b2;
1424
- const _locales = normalizeLocales(locales);
1425
- const plurals = ordinal ? getMemoized(
1426
- () => cacheKey("plural-ordinal", _locales),
1427
- () => new Intl.PluralRules(_locales, { type: "ordinal" })
1428
- ) : getMemoized(
1429
- () => cacheKey("plural-cardinal", _locales),
1430
- () => new Intl.PluralRules(_locales, { type: "cardinal" })
1431
- );
1432
- return (_b2 = (_a2 = rules[value]) != null ? _a2 : rules[plurals.select(value - offset)]) != null ? _b2 : rules.other;
1433
- }
1434
- function getMemoized(getKey, construct) {
1435
- const key = getKey();
1436
- let formatter = cache.get(key);
1437
- if (!formatter) {
1438
- formatter = construct();
1439
- cache.set(key, formatter);
1440
- }
1441
- return formatter;
1442
- }
1443
- function cacheKey(type, locales, options) {
1444
- const localeKey = locales.join("-");
1445
- return `${type}-${localeKey}-${JSON.stringify(options)}`;
1446
- }
1447
- var UNICODE_REGEX = /\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/g;
1448
- var OCTOTHORPE_PH = "%__lingui_octothorpe__%";
1449
- var getDefaultFormats = (locale, passedLocales, formats = {}) => {
1450
- const locales = passedLocales || locale;
1451
- const style = (format) => {
1452
- return typeof format === "object" ? format : formats[format] || { style: format };
1453
- };
1454
- const replaceOctothorpe = (value, message) => {
1455
- const numberFormat = Object.keys(formats).length ? style("number") : void 0;
1456
- const valueStr = number(locales, value, numberFormat);
1457
- return message.replace(new RegExp(OCTOTHORPE_PH, "g"), valueStr);
1458
- };
1459
- return {
1460
- plural: (value, cases) => {
1461
- const { offset = 0 } = cases;
1462
- const message = plural(locales, false, value, cases);
1463
- return replaceOctothorpe(value - offset, message);
1464
- },
1465
- selectordinal: (value, cases) => {
1466
- const { offset = 0 } = cases;
1467
- const message = plural(locales, true, value, cases);
1468
- return replaceOctothorpe(value - offset, message);
1469
- },
1470
- select: selectFormatter,
1471
- number: (value, format) => number(locales, value, style(format)),
1472
- date: (value, format) => date(locales, value, style(format))
1473
- };
1474
- };
1475
- var selectFormatter = (value, rules) => {
1476
- var _a;
1477
- return (_a = rules[value]) != null ? _a : rules.other;
1478
- };
1479
- function interpolate(translation, locale, locales) {
1480
- return (values = {}, formats) => {
1481
- const formatters = getDefaultFormats(locale, locales, formats);
1482
- const formatMessage = (tokens) => {
1483
- if (!Array.isArray(tokens))
1484
- return tokens;
1485
- return tokens.reduce((message, token) => {
1486
- if (token === "#") {
1487
- return message + OCTOTHORPE_PH;
1488
- }
1489
- if (isString(token)) {
1490
- return message + token;
1491
- }
1492
- const [name, type, format] = token;
1493
- let interpolatedFormat = {};
1494
- if (type === "plural" || type === "selectordinal" || type === "select") {
1495
- Object.entries(format).forEach(
1496
- ([key, value2]) => {
1497
- interpolatedFormat[key] = formatMessage(value2);
1498
- }
1499
- );
1500
- } else {
1501
- interpolatedFormat = format;
1502
- }
1503
- let value;
1504
- if (type) {
1505
- const formatter = formatters[type];
1506
- value = formatter(values[name], interpolatedFormat);
1507
- } else {
1508
- value = values[name];
1509
- }
1510
- if (value == null) {
1511
- return message;
1512
- }
1513
- return message + value;
1514
- }, "");
1515
- };
1516
- const result = formatMessage(translation);
1517
- if (isString(result) && UNICODE_REGEX.test(result)) {
1518
- return (0, import_unraw.unraw)(result.trim());
1519
- }
1520
- if (isString(result))
1521
- return result.trim();
1522
- return result ? String(result) : "";
1523
- };
1524
- }
1525
- var __defProp$1 = Object.defineProperty;
1526
- var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1527
- var __publicField$1 = (obj, key, value) => {
1528
- __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
1529
- return value;
1628
+ indeterminateInvalid: 'before:content-["\u2013"] before:rounded-2 before:leading-xs before:text-center before:font-bold before:s-icon-inverted peer-indeterminate:before:s-border-negative peer-indeterminate:before:s-bg-negative peer-indeterminate:hover:before:s-border-negative-hover peer-indeterminate:hover:before:s-bg-negative-hover',
1629
+ // isCheckbox && isIndeterminate && isInvalid && !isDisabled
1630
+ indeterminateDisabled: 'before:content-["\u2013"] before:rounded-2 before:leading-xs before:text-center before:font-bold pointer-events-none before:s-icon-inverted peer-indeterminate:before:s-border-disabled peer-indeterminate:before:s-bg-disabled',
1631
+ // isCheckbox && isIndeterminate && !isInvalid && isDisabled
1632
+ radio: "before:s-bg before:rounded-full peer-checked:before:border-[6] peer-checked:before:s-border-selected peer-checked:peer-hover:before:s-border-selected-hover peer-hover:before:s-border-primary peer-hover:before:s-bg-hover",
1633
+ // isRadio && !isDisabled && !isInvalid
1634
+ radioInvalid: "before:s-bg before:s-border-negative before:rounded-full peer-checked:before:border-[6] peer-hover:before:s-bg-negative-subtle peer-hover:before:s-border-negative-hover peer-checked:before:s-border-negative peer-checked:peer-hover:before:s-border-negative-hover",
1635
+ // isRadio && isInvalid && !isDisabled
1636
+ radioDisabled: "before:s-bg-disabled-subtle before:s-border-disabled pointer-events-none before:rounded-full peer-checked:before:border-[6]",
1637
+ // isRadio && !isInvalid && isDisabled
1638
+ radioButtonsLabel: "peer-hover:peer-not-checked:s-bg-hover peer-checked:s-text-inverted peer-checked:s-bg-primary peer-checked:s-border-primary block relative font-bold cursor-pointer s-text-link text-center s-bg border-2 s-border group-first-of-type:rounded-tl-8 group-first-of-type:rounded-bl-8 group-last-of-type:rounded-tr-8 group-last-of-type:rounded-br-8 group-not-last-of-type:border-r-0 peer-checked:z-10 group-not-first:-ml-2",
1639
+ // isRadioButtons
1640
+ radioButtonsRegular: "text-s py-8 pl-12 pr-14",
1641
+ // isRadioButtons && !isSmall
1642
+ radioButtonsSmall: "text-xs py-[5px] px-[8px]"
1643
+ // isRadioButtons && isSmall
1530
1644
  };
1531
- var EventEmitter = class {
1532
- constructor() {
1533
- __publicField$1(this, "_events", {});
1534
- }
1535
- on(event, listener) {
1536
- var _a2;
1537
- var _a;
1538
- (_a2 = (_a = this._events)[event]) != null ? _a2 : _a[event] = [];
1539
- this._events[event].push(listener);
1540
- return () => this.removeListener(event, listener);
1541
- }
1542
- removeListener(event, listener) {
1543
- const maybeListeners = this._getListeners(event);
1544
- if (!maybeListeners)
1545
- return;
1546
- const index = maybeListeners.indexOf(listener);
1547
- if (~index)
1548
- maybeListeners.splice(index, 1);
1549
- }
1550
- emit(event, ...args) {
1551
- const maybeListeners = this._getListeners(event);
1552
- if (!maybeListeners)
1553
- return;
1554
- maybeListeners.map((listener) => listener.apply(this, args));
1555
- }
1556
- _getListeners(event) {
1557
- const maybeListeners = this._events[event];
1558
- return Array.isArray(maybeListeners) ? maybeListeners : false;
1559
- }
1645
+ var deadToggle = {
1646
+ wrapper: `${toggle.wrapper} h-20 w-20 pointer-events-none`,
1647
+ input: `${toggle.input} hidden`,
1648
+ inputVue: "hidden",
1649
+ labelRadio: `${toggle.label} ${toggle.labelBefore} ${toggle.radio}`,
1650
+ labelCheckbox: `${toggle.label} ${toggle.labelBefore} ${toggle.checkbox}`,
1651
+ labelVue: "-mt-2"
1560
1652
  };
1561
- var __defProp2 = Object.defineProperty;
1562
- var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
1563
- var __publicField2 = (obj, key, value) => {
1564
- __defNormalProp2(obj, typeof key !== "symbol" ? key + "" : key, value);
1565
- return value;
1653
+ var clickable = {
1654
+ toggle: "absolute inset-0 h-full w-full appearance-none cursor-pointer focusable focusable-inset",
1655
+ label: `px-12 ${label.label} py-8! cursor-pointer focusable focusable-inset`,
1656
+ buttonOrLink: "bg-transparent focusable",
1657
+ buttonOrLinkStretch: "inset-0 absolute"
1566
1658
  };
1567
- var I18n = class extends EventEmitter {
1568
- constructor(params) {
1569
- var _a;
1570
- super();
1571
- __publicField2(this, "_locale", "");
1572
- __publicField2(this, "_locales");
1573
- __publicField2(this, "_localeData", {});
1574
- __publicField2(this, "_messages", {});
1575
- __publicField2(this, "_missing");
1576
- __publicField2(this, "t", this._.bind(this));
1577
- if (params.missing != null)
1578
- this._missing = params.missing;
1579
- if (params.messages != null)
1580
- this.load(params.messages);
1581
- if (params.localeData != null)
1582
- this.loadLocaleData(params.localeData);
1583
- if (typeof params.locale === "string" || params.locales) {
1584
- this.activate((_a = params.locale) != null ? _a : defaultLocale, params.locales);
1585
- }
1586
- }
1587
- get locale() {
1588
- return this._locale;
1589
- }
1590
- get locales() {
1591
- return this._locales;
1592
- }
1593
- get messages() {
1594
- var _a;
1595
- return (_a = this._messages[this._locale]) != null ? _a : {};
1596
- }
1597
- /**
1598
- * @deprecated this has no effect. Please remove this from the code. Deprecated in v4
1599
- */
1600
- get localeData() {
1601
- var _a;
1602
- return (_a = this._localeData[this._locale]) != null ? _a : {};
1603
- }
1604
- _loadLocaleData(locale, localeData) {
1605
- const maybeLocaleData = this._localeData[locale];
1606
- if (!maybeLocaleData) {
1607
- this._localeData[locale] = localeData;
1608
- } else {
1609
- Object.assign(maybeLocaleData, localeData);
1610
- }
1611
- }
1612
- /**
1613
- * @deprecated Plurals automatically used from Intl.PluralRules you can safely remove this call. Deprecated in v4
1614
- */
1615
- // @ts-ignore deprecated, so ignore the reported error
1616
- loadLocaleData(localeOrAllData, localeData) {
1617
- if (localeData != null) {
1618
- this._loadLocaleData(localeOrAllData, localeData);
1619
- } else {
1620
- Object.keys(localeOrAllData).forEach(
1621
- (locale) => this._loadLocaleData(locale, localeOrAllData[locale])
1622
- );
1623
- }
1624
- this.emit("change");
1625
- }
1626
- _load(locale, messages4) {
1627
- const maybeMessages = this._messages[locale];
1628
- if (!maybeMessages) {
1629
- this._messages[locale] = messages4;
1630
- } else {
1631
- Object.assign(maybeMessages, messages4);
1632
- }
1633
- }
1634
- load(localeOrMessages, messages4) {
1635
- if (typeof localeOrMessages == "string" && typeof messages4 === "object") {
1636
- this._load(localeOrMessages, messages4);
1637
- } else {
1638
- Object.entries(localeOrMessages).forEach(
1639
- ([locale, messages22]) => this._load(locale, messages22)
1640
- );
1641
- }
1642
- this.emit("change");
1643
- }
1644
- /**
1645
- * @param options {@link LoadAndActivateOptions}
1646
- */
1647
- loadAndActivate({ locale, locales, messages: messages4 }) {
1648
- this._locale = locale;
1649
- this._locales = locales || void 0;
1650
- this._messages[this._locale] = messages4;
1651
- this.emit("change");
1652
- }
1653
- activate(locale, locales) {
1654
- if (true) {
1655
- if (!this._messages[locale]) {
1656
- console.warn(`Messages for locale "${locale}" not loaded.`);
1657
- }
1658
- }
1659
- this._locale = locale;
1660
- this._locales = locales;
1661
- this.emit("change");
1662
- }
1663
- _(id, values, options) {
1664
- let message = options == null ? void 0 : options.message;
1665
- if (!isString(id)) {
1666
- values = id.values || values;
1667
- message = id.message;
1668
- id = id.id;
1669
- }
1670
- const messageForId = this.messages[id];
1671
- const messageMissing = messageForId === void 0;
1672
- const missing = this._missing;
1673
- if (missing && messageMissing) {
1674
- return isFunction(missing) ? missing(this._locale, id) : missing;
1675
- }
1676
- if (messageMissing) {
1677
- this.emit("missing", { id, locale: this._locale });
1678
- }
1679
- let translation = messageForId || message || id;
1680
- if (true) {
1681
- translation = isString(translation) ? compileMessage(translation) : translation;
1682
- }
1683
- if (isString(translation) && UNICODE_REGEX.test(translation))
1684
- return JSON.parse(`"${translation}"`);
1685
- if (isString(translation))
1686
- return translation;
1687
- return interpolate(
1688
- translation,
1689
- this._locale,
1690
- this._locales
1691
- )(values, options == null ? void 0 : options.formats);
1692
- }
1693
- date(value, format) {
1694
- return date(this._locales || this._locale, value, format);
1695
- }
1696
- number(value, format) {
1697
- return number(this._locales || this._locale, value, format);
1698
- }
1659
+ var attention = {
1660
+ base: "border-2 relative flex items-start",
1661
+ tooltip: "s-bg-inverted border-[--w-s-color-background-inverted] shadow-m s-text-inverted-static rounded-4 py-6 px-8",
1662
+ callout: "bg-[--w-color-callout-background] border-[--w-color-callout-border] s-text py-8 px-16 rounded-8",
1663
+ highlight: "bg-[--w-color-callout-background] border-[--w-color-callout-border] s-text py-8 px-16 rounded-8 drop-shadow-m translate-z-0",
1664
+ popover: "bg-[--w-s-color-surface-elevated-300] border-[--w-s-color-surface-elevated-300] s-text rounded-8 p-16 drop-shadow-m translate-z-0",
1665
+ arrowBase: "absolute h-[14px] w-[14px] border-2 border-b-0 border-r-0 rounded-tl-4 transform",
1666
+ arrowDirectionLeftStart: "-left-[8px]",
1667
+ arrowDirectionLeft: "-left-[8px]",
1668
+ arrowDirectionLeftEnd: "-left-[8px]",
1669
+ arrowDirectionRightStart: "-right-[8px]",
1670
+ arrowDirectionRight: "-right-[8px]",
1671
+ arrowDirectionRightEnd: "-right-[8px]",
1672
+ arrowDirectionBottomStart: "-bottom-[8px]",
1673
+ arrowDirectionBottom: "-bottom-[8px]",
1674
+ arrowDirectionBottomEnd: "-bottom-[8px]",
1675
+ arrowDirectionTopStart: "-top-[8px]",
1676
+ arrowDirectionTop: "-top-[8px]",
1677
+ arrowDirectionTopEnd: "-top-[8px]",
1678
+ arrowTooltip: "s-bg-inverted border-[--w-s-color-background-inverted]",
1679
+ arrowCallout: "bg-[--w-color-callout-background] border-[--w-color-callout-border]",
1680
+ arrowPopover: "bg-[--w-s-color-surface-elevated-300] border-[--w-s-color-surface-elevated-300]",
1681
+ arrowHighlight: "bg-[--w-color-callout-background] border-[--w-color-callout-border]",
1682
+ content: "last-child:mb-0",
1683
+ notCallout: "absolute z-50",
1684
+ closeBtn: `${buttonTextSizes.medium} ${buttonTypes.pill} ${buttonColors.pill} justify-self-end -mr-8 ml-8`
1699
1685
  };
1700
- function setupI18n(params = {}) {
1701
- return new I18n(params);
1702
- }
1703
- var i18n = setupI18n();
1704
1686
 
1705
- // packages/breadcrumbs/locales/en/messages.mjs
1706
- var messages = JSON.parse('{"breadcrumbs.ariaLabel":"You are here"}');
1707
-
1708
- // packages/breadcrumbs/locales/nb/messages.mjs
1709
- var messages2 = JSON.parse('{"breadcrumbs.ariaLabel":"Her er du"}');
1710
-
1711
- // packages/breadcrumbs/locales/fi/messages.mjs
1712
- var messages3 = JSON.parse('{"breadcrumbs.ariaLabel":"Olet t\xE4ss\xE4"}');
1687
+ // packages/breadcrumbs/index.js
1688
+ import WarpElement from "@warp-ds/elements-core";
1713
1689
 
1714
1690
  // packages/i18n.ts
1715
1691
  var supportedLocales = ["en", "nb", "fi"];
@@ -1746,12 +1722,38 @@ var activateI18n = (enMessages, nbMessages, fiMessages) => {
1746
1722
  i18n.activate(locale);
1747
1723
  };
1748
1724
 
1725
+ // packages/utils/index.js
1726
+ import { classMap } from "lit/directives/class-map.js";
1727
+ var camelCaseToKebabCase = (str) => str.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
1728
+ function kebabCaseAttributes(constructor) {
1729
+ return class extends constructor {
1730
+ static createProperty(name, options) {
1731
+ let customOptions = options;
1732
+ if (typeof (options == null ? void 0 : options.attribute) === "undefined" || (options == null ? void 0 : options.attribute) === true) {
1733
+ customOptions = Object.assign({}, options, {
1734
+ attribute: camelCaseToKebabCase(name.toString())
1735
+ });
1736
+ }
1737
+ super.createProperty(name, customOptions);
1738
+ }
1739
+ };
1740
+ }
1741
+
1742
+ // packages/breadcrumbs/locales/en/messages.mjs
1743
+ var messages = JSON.parse('{"breadcrumbs.ariaLabel":"You are here"}');
1744
+
1745
+ // packages/breadcrumbs/locales/fi/messages.mjs
1746
+ var messages2 = JSON.parse('{"breadcrumbs.ariaLabel":"Olet t\xE4ss\xE4"}');
1747
+
1748
+ // packages/breadcrumbs/locales/nb/messages.mjs
1749
+ var messages3 = JSON.parse('{"breadcrumbs.ariaLabel":"Her er du"}');
1750
+
1749
1751
  // packages/breadcrumbs/index.js
1750
1752
  var separator = html`<span class=${breadcrumbs.separator}>/</span>`;
1751
1753
  var WarpBreadcrumbs = class extends kebabCaseAttributes(WarpElement) {
1752
1754
  constructor() {
1753
1755
  super();
1754
- activateI18n(messages, messages2, messages3);
1756
+ activateI18n(messages, messages3, messages2);
1755
1757
  this.ariaLabel = i18n._({
1756
1758
  id: "breadcrumbs.ariaLabel",
1757
1759
  message: "You are here",