@magicfeedback/popup-sdk 1.6.0 → 1.7.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/README.md CHANGED
@@ -137,7 +137,40 @@ Config fields:
137
137
  segmentation (`segments.lang`) and for the analytics context. If omitted it is
138
138
  auto-detected from `navigator.language`, falling back to the `Intl` locale (which is
139
139
  what makes it work in React Native, where `navigator.language` does not exist). If no
140
- source resolves a language, popups with `segments.lang` cannot be filtered and are shown.
140
+ source resolves a language, popups with `segments.lang` cannot be filtered and are shown. It
141
+ is also the starting language for the popup's own texts (see below).
142
+
143
+ ### Popup texts and language
144
+
145
+ The survey content (questions, placeholders, Yes/No labels) is localized by
146
+ `@magicfeedback/native` using the language configured for the integration. The texts the SDK
147
+ itself renders around it — the footer buttons, the progress counter, the follow-up badge, the
148
+ aria-labels and the error hints — are resolved in this order:
149
+
150
+ 1. `actions.*.label` from the popup definition, whenever the platform configures it.
151
+ 2. The survey's own language (`formData.lang[0]`), applied as soon as the survey loads. A
152
+ Danish survey therefore gets a Danish footer with no extra configuration.
153
+ 3. The `language` passed to `init()` (or auto-detected), used until the survey loads.
154
+ 4. English.
155
+
156
+ Built-in languages — the 11 a survey can be authored in, plus `zh-CN`:
157
+
158
+ | | | |
159
+ |---|---|---|
160
+ | `en` English | `da` Danish | `fi` Finnish |
161
+ | `no` Norwegian (incl. `nb`/`nn`) | `es` Spanish | `sv` Swedish |
162
+ | `ar` Arabic | `bn` Bengali | `de` German |
163
+ | `pt` Portuguese | `fr` French | `zh-CN` Chinese (incl. plain `zh`) |
164
+
165
+ Region and case are ignored, so `da`, `da-DK` and `da_DK` all resolve to Danish, and `pt-BR`
166
+ and `pt-PT` share one set; any other language falls back to English. `SUPPORTED_LANGUAGES` and
167
+ `getLabels()` are exported if you need to inspect them.
168
+
169
+ Right-to-left: for Arabic the SDK stamps `dir="rtl"` on the popup container, so the header,
170
+ footer and progress bar mirror along with the survey content (which `@magicfeedback/native`
171
+ flips on its own since 2.2.22). The direction follows the same resolution chain as the texts,
172
+ and is always set explicitly — `ltr` included — so the popup never inherits the direction of
173
+ the host page.
141
174
 
142
175
  ### `autoLaunch()`
143
176
 
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * NO EDITAR A MANO — generado por scripts/vendor-survey-css.mjs
3
3
  *
4
- * Copia de @magicfeedback/native@2.2.8 → dist/styles/magicfeedback-default.css
4
+ * Copia de @magicfeedback/native@2.2.22 → dist/styles/magicfeedback-default.css
5
5
  * (la hoja canónica del paquete, la que apunta su campo "style"), con estos cambios locales:
6
6
  *
7
7
  * 1. Sin el @import de Google Fonts (Nunito): no queremos una petición externa desde la
@@ -221,7 +221,7 @@
221
221
  font-weight: var(--mf-font-weight-bold);
222
222
  line-height: 1.3;
223
223
  margin: var(--mf-space-lg) 0 var(--mf-space-sm);
224
- text-align: left;
224
+ text-align: start;
225
225
  }
226
226
 
227
227
  .magicfeedback-info-message h1, .magicfeedback-start-message h1 { font-size: var(--mf-font-size-xl); }
@@ -260,7 +260,7 @@
260
260
  .magicfeedback-start-message ul,
261
261
  .magicfeedback-start-message ol {
262
262
  margin: 0 0 var(--mf-space-md);
263
- padding-left: var(--mf-space-xl);
263
+ padding-inline-start: var(--mf-space-xl);
264
264
  color: var(--mf-text-secondary);
265
265
  line-height: var(--mf-line-height);
266
266
  }
@@ -274,7 +274,7 @@
274
274
  .magicfeedback-start-message blockquote {
275
275
  margin: 0 0 var(--mf-space-md);
276
276
  padding: var(--mf-space-sm) var(--mf-space-md);
277
- border-left: 3px solid var(--mf-primary-border);
277
+ border-inline-start: 3px solid var(--mf-primary-border);
278
278
  color: var(--mf-text-secondary);
279
279
  font-style: italic;
280
280
  }
@@ -363,7 +363,7 @@
363
363
  font-weight: var(--mf-font-weight-bold);
364
364
  color: var(--mf-text-primary);
365
365
  line-height: var(--mf-line-height);
366
- text-align: left;
366
+ text-align: start;
367
367
  letter-spacing: -0.01em;
368
368
  }
369
369
 
@@ -439,7 +439,7 @@
439
439
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
440
440
  background-repeat: no-repeat;
441
441
  background-position: right var(--mf-space-md) center;
442
- padding-right: var(--mf-space-xl);
442
+ padding-inline-end: var(--mf-space-xl);
443
443
  }
444
444
 
445
445
  /* Error State */
@@ -503,7 +503,7 @@ div.magicfeedback-radio {
503
503
  .magicfeedback-checkbox label,
504
504
  .magicfeedback-radio-container label {
505
505
  font-size: var(--mf-font-size-base);
506
- text-align: left;
506
+ text-align: start;
507
507
  color: var(--mf-text-primary);
508
508
  cursor: pointer;
509
509
  margin: 0;
@@ -601,7 +601,7 @@ div.magicfeedback-radio {
601
601
  }
602
602
 
603
603
  .magicfeedback-rating-placeholder-value:last-child {
604
- text-align: right;
604
+ text-align: end;
605
605
  }
606
606
 
607
607
  /* Rating with Images */
@@ -684,7 +684,7 @@ div.magicfeedback-radio {
684
684
  }
685
685
 
686
686
  .magicfeedback-rating-number-scale-label:last-child {
687
- text-align: right;
687
+ text-align: end;
688
688
  }
689
689
 
690
690
  /* Column, no per-option text: each row is its own separated chip, so
@@ -1002,7 +1002,7 @@ div.magicfeedback-radio {
1002
1002
  }
1003
1003
 
1004
1004
  .magicfeedback-multi-question-matrix-label {
1005
- text-align: left;
1005
+ text-align: start;
1006
1006
  font-size: var(--mf-font-size-base);
1007
1007
  color: var(--mf-text-primary);
1008
1008
  }
@@ -1037,7 +1037,7 @@ div.magicfeedback-radio {
1037
1037
  .magicfeedback-priority-list-item-label {
1038
1038
  flex: 1;
1039
1039
  font-size: var(--mf-font-size-base);
1040
- text-align: left;
1040
+ text-align: start;
1041
1041
  color: var(--mf-text-primary);
1042
1042
  margin: 0;
1043
1043
  }
@@ -1129,7 +1129,7 @@ div.magicfeedback-radio {
1129
1129
  .magicfeedback-consent-container label {
1130
1130
  flex: 1;
1131
1131
  font-size: var(--mf-font-size-sm);
1132
- text-align: left;
1132
+ text-align: start;
1133
1133
  color: var(--mf-text-secondary);
1134
1134
  line-height: var(--mf-line-height);
1135
1135
  cursor: pointer;
@@ -1281,7 +1281,7 @@ div.magicfeedback-radio {
1281
1281
  }
1282
1282
 
1283
1283
  .magicfeedback-modal-counter {
1284
- margin-right: auto;
1284
+ margin-inline-end: auto;
1285
1285
  display: flex;
1286
1286
  align-items: center;
1287
1287
  font-size: 14px;
@@ -1526,7 +1526,7 @@ div.magicfeedback-radio {
1526
1526
  .magicfeedback-modal-close {
1527
1527
  position: absolute;
1528
1528
  top: 8px;
1529
- right: 8px;
1529
+ inset-inline-end: 8px;
1530
1530
  background: transparent;
1531
1531
  border: none;
1532
1532
  font-size: 20px;
@@ -1747,6 +1747,55 @@ div.magicfeedback-radio {
1747
1747
  display: block;
1748
1748
  }
1749
1749
 
1750
+ /* ========================================
1751
+ RTL (Arabic)
1752
+ ========================================
1753
+ The SDK stamps dir="rtl" (and .magicfeedback-rtl) on the survey container
1754
+ for right-to-left languages. Everything else in this stylesheet uses logical
1755
+ properties (text-align: start, padding-inline-*, inset-inline-*), so it
1756
+ mirrors on its own; only the handful of rules that cannot be expressed
1757
+ logically live here.
1758
+
1759
+ Rules are scoped to [dir="rtl"] inside our own subtree so a host page that is
1760
+ itself RTL, or one that embeds an Arabic survey in an LTR page, both render
1761
+ correctly. */
1762
+
1763
+ /* background-position has no logical form: move the select caret to the
1764
+ left edge, opposite the padding that inset-inline-end already mirrored. */
1765
+ [dir="rtl"] select {
1766
+ background-position: left var(--mf-space-md) center;
1767
+ }
1768
+
1769
+ /* Emails, URLs, numbers, dates and phone numbers are latin/numeric content
1770
+ even in an Arabic survey: keep their own direction LTR so punctuation
1771
+ (@, ., +, /) lands where the user expects, but align them to the start of
1772
+ the RTL line so they still read as part of the form. */
1773
+ [dir="rtl"] input[type="email"],
1774
+ [dir="rtl"] input[type="url"],
1775
+ [dir="rtl"] input[type="number"],
1776
+ [dir="rtl"] input[type="tel"],
1777
+ [dir="rtl"] input[type="date"],
1778
+ [dir="rtl"] input[type="time"] {
1779
+ direction: ltr;
1780
+ text-align: right;
1781
+ }
1782
+
1783
+ /* Mirror of mf-slide-in: questions enter from the reading edge. */
1784
+ @keyframes mf-slide-in-rtl {
1785
+ from {
1786
+ opacity: 0;
1787
+ transform: translateX(16px);
1788
+ }
1789
+ to {
1790
+ opacity: 1;
1791
+ transform: translateX(0);
1792
+ }
1793
+ }
1794
+
1795
+ [dir="rtl"] .magicfeedback-div {
1796
+ animation-name: mf-slide-in-rtl;
1797
+ }
1798
+
1750
1799
  /* ========================================
1751
1800
  LOCAL — reglas del popup, no vienen del paquete
1752
1801
  ======================================== */
@@ -160,11 +160,290 @@ function buildFontFaceCss(family, url) {
160
160
  return `@font-face{font-family:"${safe}";src:${src};font-display:swap;}`;
161
161
  }
162
162
 
163
+ // src/i18n/labels.ts
164
+ var EN = {
165
+ accept: "Send",
166
+ decline: "Cancel",
167
+ start: "Start survey",
168
+ complete: "Complete survey",
169
+ back: "Back",
170
+ question: "Question",
171
+ of: "of",
172
+ followUp: "Follow-up",
173
+ closeAria: "Close popup",
174
+ loadingAria: "Loading survey",
175
+ errorRequired: "Please answer the required question to continue.",
176
+ errorSubmit: "An error occurred while submitting. Please try again or close the popup."
177
+ };
178
+ var ES = {
179
+ accept: "Enviar",
180
+ decline: "Cancelar",
181
+ start: "Empezar encuesta",
182
+ complete: "Completar encuesta",
183
+ back: "Atr\xE1s",
184
+ question: "Pregunta",
185
+ of: "de",
186
+ followUp: "Seguimiento",
187
+ closeAria: "Cerrar ventana emergente",
188
+ loadingAria: "Cargando encuesta",
189
+ errorRequired: "Responde la pregunta obligatoria para continuar.",
190
+ errorSubmit: "Se produjo un error al enviar. Int\xE9ntalo de nuevo o cierra la ventana."
191
+ };
192
+ var DA = {
193
+ accept: "Send",
194
+ decline: "Annuller",
195
+ start: "Start unders\xF8gelse",
196
+ complete: "Afslut unders\xF8gelse",
197
+ back: "Tilbage",
198
+ question: "Sp\xF8rgsm\xE5l",
199
+ of: "af",
200
+ followUp: "Opf\xF8lgning",
201
+ closeAria: "Luk pop op",
202
+ loadingAria: "Indl\xE6ser unders\xF8gelse",
203
+ errorRequired: "Besvar venligst det obligatoriske sp\xF8rgsm\xE5l for at forts\xE6tte.",
204
+ errorSubmit: "Der opstod en fejl under afsendelsen. Pr\xF8v igen, eller luk pop op-vinduet."
205
+ };
206
+ var NO = {
207
+ accept: "Send",
208
+ decline: "Avbryt",
209
+ start: "Start unders\xF8kelse",
210
+ complete: "Fullf\xF8r unders\xF8kelse",
211
+ back: "Tilbake",
212
+ question: "Sp\xF8rsm\xE5l",
213
+ of: "av",
214
+ followUp: "Oppf\xF8lging",
215
+ closeAria: "Lukk popup",
216
+ loadingAria: "Laster unders\xF8kelse",
217
+ errorRequired: "Svar p\xE5 det obligatoriske sp\xF8rsm\xE5let for \xE5 fortsette.",
218
+ errorSubmit: "Det oppstod en feil under innsendingen. Pr\xF8v igjen, eller lukk popupen."
219
+ };
220
+ var SV = {
221
+ accept: "Skicka",
222
+ decline: "Avbryt",
223
+ start: "Starta unders\xF6kning",
224
+ complete: "Slutf\xF6r unders\xF6kning",
225
+ back: "Tillbaka",
226
+ question: "Fr\xE5ga",
227
+ of: "av",
228
+ followUp: "Uppf\xF6ljning",
229
+ closeAria: "St\xE4ng popup",
230
+ loadingAria: "Laddar unders\xF6kning",
231
+ errorRequired: "Svara p\xE5 den obligatoriska fr\xE5gan f\xF6r att forts\xE4tta.",
232
+ errorSubmit: "Ett fel uppstod vid inskickningen. F\xF6rs\xF6k igen eller st\xE4ng popupen."
233
+ };
234
+ var FI = {
235
+ accept: "L\xE4het\xE4",
236
+ decline: "Peruuta",
237
+ start: "Aloita kysely",
238
+ complete: "Viimeistele kysely",
239
+ back: "Takaisin",
240
+ question: "Kysymys",
241
+ of: "/",
242
+ followUp: "Jatkokysymys",
243
+ closeAria: "Sulje ponnahdusikkuna",
244
+ loadingAria: "Ladataan kysely\xE4",
245
+ errorRequired: "Vastaa pakolliseen kysymykseen jatkaaksesi.",
246
+ errorSubmit: "L\xE4hetyksess\xE4 tapahtui virhe. Yrit\xE4 uudelleen tai sulje ponnahdusikkuna."
247
+ };
248
+ var DE = {
249
+ accept: "Senden",
250
+ decline: "Abbrechen",
251
+ start: "Umfrage starten",
252
+ complete: "Umfrage abschlie\xDFen",
253
+ back: "Zur\xFCck",
254
+ question: "Frage",
255
+ of: "von",
256
+ followUp: "Folgefrage",
257
+ closeAria: "Popup schlie\xDFen",
258
+ loadingAria: "Umfrage wird geladen",
259
+ errorRequired: "Bitte beantworte die Pflichtfrage, um fortzufahren.",
260
+ errorSubmit: "Beim Senden ist ein Fehler aufgetreten. Versuche es erneut oder schlie\xDFe das Popup."
261
+ };
262
+ var FR = {
263
+ accept: "Envoyer",
264
+ decline: "Annuler",
265
+ start: "Commencer l'enqu\xEAte",
266
+ complete: "Terminer l'enqu\xEAte",
267
+ back: "Retour",
268
+ question: "Question",
269
+ of: "sur",
270
+ followUp: "Question compl\xE9mentaire",
271
+ closeAria: "Fermer la fen\xEAtre",
272
+ loadingAria: "Chargement de l'enqu\xEAte",
273
+ errorRequired: "Veuillez r\xE9pondre \xE0 la question obligatoire pour continuer.",
274
+ errorSubmit: "Une erreur s'est produite lors de l'envoi. R\xE9essayez ou fermez la fen\xEAtre."
275
+ };
276
+ var PT = {
277
+ accept: "Enviar",
278
+ decline: "Cancelar",
279
+ start: "Iniciar question\xE1rio",
280
+ complete: "Concluir question\xE1rio",
281
+ back: "Voltar",
282
+ question: "Pergunta",
283
+ of: "de",
284
+ followUp: "Seguimento",
285
+ closeAria: "Fechar janela",
286
+ loadingAria: "A carregar question\xE1rio",
287
+ errorRequired: "Responda \xE0 pergunta obrigat\xF3ria para continuar.",
288
+ errorSubmit: "Ocorreu um erro ao enviar. Tente novamente ou feche a janela."
289
+ };
290
+ var AR = {
291
+ accept: "\u0625\u0631\u0633\u0627\u0644",
292
+ decline: "\u0625\u0644\u063A\u0627\u0621",
293
+ start: "\u0627\u0628\u062F\u0623 \u0627\u0644\u0627\u0633\u062A\u0628\u064A\u0627\u0646",
294
+ complete: "\u0625\u0646\u0647\u0627\u0621 \u0627\u0644\u0627\u0633\u062A\u0628\u064A\u0627\u0646",
295
+ back: "\u0631\u062C\u0648\u0639",
296
+ question: "\u0633\u0624\u0627\u0644",
297
+ of: "\u0645\u0646",
298
+ followUp: "\u0633\u0624\u0627\u0644 \u0645\u062A\u0627\u0628\u0639\u0629",
299
+ closeAria: "\u0625\u063A\u0644\u0627\u0642 \u0627\u0644\u0646\u0627\u0641\u0630\u0629 \u0627\u0644\u0645\u0646\u0628\u062B\u0642\u0629",
300
+ loadingAria: "\u062C\u0627\u0631\u064D \u062A\u062D\u0645\u064A\u0644 \u0627\u0644\u0627\u0633\u062A\u0628\u064A\u0627\u0646",
301
+ errorRequired: "\u064A\u0631\u062C\u0649 \u0627\u0644\u0625\u062C\u0627\u0628\u0629 \u0639\u0644\u0649 \u0627\u0644\u0633\u0624\u0627\u0644 \u0627\u0644\u0645\u0637\u0644\u0648\u0628 \u0644\u0644\u0645\u062A\u0627\u0628\u0639\u0629.",
302
+ errorSubmit: "\u062D\u062F\u062B \u062E\u0637\u0623 \u0623\u062B\u0646\u0627\u0621 \u0627\u0644\u0625\u0631\u0633\u0627\u0644. \u064A\u0631\u062C\u0649 \u0627\u0644\u0645\u062D\u0627\u0648\u0644\u0629 \u0645\u0631\u0629 \u0623\u062E\u0631\u0649 \u0623\u0648 \u0625\u063A\u0644\u0627\u0642 \u0627\u0644\u0646\u0627\u0641\u0630\u0629."
303
+ };
304
+ var BN = {
305
+ accept: "\u09AA\u09BE\u09A0\u09BE\u09A8",
306
+ decline: "\u09AC\u09BE\u09A4\u09BF\u09B2",
307
+ start: "\u099C\u09B0\u09BF\u09AA \u09B6\u09C1\u09B0\u09C1 \u0995\u09B0\u09C1\u09A8",
308
+ complete: "\u099C\u09B0\u09BF\u09AA \u09B8\u09AE\u09CD\u09AA\u09C2\u09B0\u09CD\u09A3 \u0995\u09B0\u09C1\u09A8",
309
+ back: "\u09AA\u09BF\u099B\u09A8\u09C7",
310
+ question: "\u09AA\u09CD\u09B0\u09B6\u09CD\u09A8",
311
+ of: "/",
312
+ followUp: "\u09AB\u09B2\u09CB-\u0986\u09AA",
313
+ closeAria: "\u09AA\u09AA\u0986\u09AA \u09AC\u09A8\u09CD\u09A7 \u0995\u09B0\u09C1\u09A8",
314
+ loadingAria: "\u099C\u09B0\u09BF\u09AA \u09B2\u09CB\u09A1 \u09B9\u099A\u09CD\u099B\u09C7",
315
+ errorRequired: "\u099A\u09BE\u09B2\u09BF\u09AF\u09BC\u09C7 \u09AF\u09C7\u09A4\u09C7 \u0986\u09AC\u09B6\u09CD\u09AF\u0995 \u09AA\u09CD\u09B0\u09B6\u09CD\u09A8\u09C7\u09B0 \u0989\u09A4\u09CD\u09A4\u09B0 \u09A6\u09BF\u09A8\u0964",
316
+ errorSubmit: "\u099C\u09AE\u09BE \u09A6\u09C7\u0993\u09AF\u09BC\u09BE\u09B0 \u09B8\u09AE\u09AF\u09BC \u098F\u0995\u099F\u09BF \u09A4\u09CD\u09B0\u09C1\u099F\u09BF \u0998\u099F\u09C7\u099B\u09C7\u0964 \u0986\u09AC\u09BE\u09B0 \u099A\u09C7\u09B7\u09CD\u099F\u09BE \u0995\u09B0\u09C1\u09A8 \u09AC\u09BE \u09AA\u09AA\u0986\u09AA \u09AC\u09A8\u09CD\u09A7 \u0995\u09B0\u09C1\u09A8\u0964"
317
+ };
318
+ var ZH_CN = {
319
+ accept: "\u53D1\u9001",
320
+ decline: "\u53D6\u6D88",
321
+ start: "\u5F00\u59CB\u95EE\u5377",
322
+ complete: "\u5B8C\u6210\u95EE\u5377",
323
+ back: "\u8FD4\u56DE",
324
+ question: "\u95EE\u9898",
325
+ of: "/",
326
+ followUp: "\u8FFD\u95EE",
327
+ closeAria: "\u5173\u95ED\u5F39\u7A97",
328
+ loadingAria: "\u6B63\u5728\u52A0\u8F7D\u95EE\u5377",
329
+ errorRequired: "\u8BF7\u56DE\u7B54\u5FC5\u7B54\u9898\u540E\u7EE7\u7EED\u3002",
330
+ errorSubmit: "\u63D0\u4EA4\u65F6\u51FA\u9519\u3002\u8BF7\u91CD\u8BD5\u6216\u5173\u95ED\u5F39\u7A97\u3002"
331
+ };
332
+ var LABELS = {
333
+ en: EN,
334
+ es: ES,
335
+ da: DA,
336
+ no: NO,
337
+ sv: SV,
338
+ fi: FI,
339
+ de: DE,
340
+ fr: FR,
341
+ pt: PT,
342
+ ar: AR,
343
+ bn: BN,
344
+ "zh-CN": ZH_CN
345
+ };
346
+ var SUPPORTED_LANGUAGES = [
347
+ // Los 11 idiomas que la plataforma ofrece para un survey, más zh-CN (que el SDK nativo ya
348
+ // traía). Si la plataforma añade uno nuevo, hay que añadirlo aquí o el chrome saldrá en
349
+ // inglés bajo un survey traducido.
350
+ "en",
351
+ "es",
352
+ "da",
353
+ "no",
354
+ "sv",
355
+ "fi",
356
+ "de",
357
+ "fr",
358
+ "pt",
359
+ "ar",
360
+ "bn",
361
+ "zh-CN"
362
+ ];
363
+ function resolveLocale(lang) {
364
+ if (typeof lang !== "string") return "en";
365
+ const normalized = lang.trim().toLowerCase().replace(/_/g, "-");
366
+ if (!normalized) return "en";
367
+ if (normalized === "zh" || normalized.startsWith("zh-")) return "zh-CN";
368
+ const primary = normalized.split("-")[0];
369
+ switch (primary) {
370
+ case "en":
371
+ return "en";
372
+ case "es":
373
+ return "es";
374
+ case "da":
375
+ return "da";
376
+ case "no":
377
+ case "nb":
378
+ case "nn":
379
+ return "no";
380
+ case "sv":
381
+ return "sv";
382
+ case "fi":
383
+ return "fi";
384
+ case "de":
385
+ return "de";
386
+ case "fr":
387
+ return "fr";
388
+ case "pt":
389
+ return "pt";
390
+ case "ar":
391
+ return "ar";
392
+ case "bn":
393
+ return "bn";
394
+ default:
395
+ return "en";
396
+ }
397
+ }
398
+ var RTL_LOCALES = ["ar"];
399
+ function isRtlLanguage(lang) {
400
+ return RTL_LOCALES.includes(resolveLocale(lang));
401
+ }
402
+ function directionFor(lang) {
403
+ return isRtlLanguage(lang) ? "rtl" : "ltr";
404
+ }
405
+ function getLabels(lang) {
406
+ return LABELS[resolveLocale(lang)];
407
+ }
408
+ function resolveActionLabels(actions, lang) {
409
+ const labels = getLabels(lang);
410
+ const pick = (value, fallback) => {
411
+ const trimmed = typeof value === "string" ? value.trim() : "";
412
+ return trimmed ? value : fallback;
413
+ };
414
+ return {
415
+ accept: pick(actions?.accept?.label, labels.accept),
416
+ decline: pick(actions?.decline?.label, labels.decline),
417
+ start: pick(actions?.start?.label, labels.start),
418
+ complete: pick(actions?.complete?.label, labels.complete),
419
+ back: pick(actions?.back?.label, labels.back)
420
+ };
421
+ }
422
+ var RESOLVE_LOCALE_JS = `function ddResolveLocale(lang){
423
+ if(typeof lang!=='string') return 'en';
424
+ var n=lang.trim().toLowerCase().replace(/_/g,'-');
425
+ if(!n) return 'en';
426
+ if(n==='zh'||n.indexOf('zh-')===0) return 'zh-CN';
427
+ var p=n.split('-')[0];
428
+ if(p==='en') return 'en';
429
+ if(p==='es') return 'es';
430
+ if(p==='da') return 'da';
431
+ if(p==='no'||p==='nb'||p==='nn') return 'no';
432
+ if(p==='sv') return 'sv';
433
+ if(p==='fi') return 'fi';
434
+ if(p==='de') return 'de';
435
+ if(p==='fr') return 'fr';
436
+ if(p==='pt') return 'pt';
437
+ if(p==='ar') return 'ar';
438
+ if(p==='bn') return 'bn';
439
+ return 'en';
440
+ }`;
441
+
163
442
  // src/assets/style.css
164
443
  var style_default = `/**
165
444
  * NO EDITAR A MANO \u2014 generado por scripts/vendor-survey-css.mjs
166
445
  *
167
- * Copia de @magicfeedback/native@2.2.8 \u2192 dist/styles/magicfeedback-default.css
446
+ * Copia de @magicfeedback/native@2.2.22 \u2192 dist/styles/magicfeedback-default.css
168
447
  * (la hoja can\xF3nica del paquete, la que apunta su campo "style"), con estos cambios locales:
169
448
  *
170
449
  * 1. Sin el @import de Google Fonts (Nunito): no queremos una petici\xF3n externa desde la
@@ -384,7 +663,7 @@ var style_default = `/**
384
663
  font-weight: var(--mf-font-weight-bold);
385
664
  line-height: 1.3;
386
665
  margin: var(--mf-space-lg) 0 var(--mf-space-sm);
387
- text-align: left;
666
+ text-align: start;
388
667
  }
389
668
 
390
669
  .magicfeedback-info-message h1, .magicfeedback-start-message h1 { font-size: var(--mf-font-size-xl); }
@@ -423,7 +702,7 @@ var style_default = `/**
423
702
  .magicfeedback-start-message ul,
424
703
  .magicfeedback-start-message ol {
425
704
  margin: 0 0 var(--mf-space-md);
426
- padding-left: var(--mf-space-xl);
705
+ padding-inline-start: var(--mf-space-xl);
427
706
  color: var(--mf-text-secondary);
428
707
  line-height: var(--mf-line-height);
429
708
  }
@@ -437,7 +716,7 @@ var style_default = `/**
437
716
  .magicfeedback-start-message blockquote {
438
717
  margin: 0 0 var(--mf-space-md);
439
718
  padding: var(--mf-space-sm) var(--mf-space-md);
440
- border-left: 3px solid var(--mf-primary-border);
719
+ border-inline-start: 3px solid var(--mf-primary-border);
441
720
  color: var(--mf-text-secondary);
442
721
  font-style: italic;
443
722
  }
@@ -526,7 +805,7 @@ var style_default = `/**
526
805
  font-weight: var(--mf-font-weight-bold);
527
806
  color: var(--mf-text-primary);
528
807
  line-height: var(--mf-line-height);
529
- text-align: left;
808
+ text-align: start;
530
809
  letter-spacing: -0.01em;
531
810
  }
532
811
 
@@ -602,7 +881,7 @@ var style_default = `/**
602
881
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
603
882
  background-repeat: no-repeat;
604
883
  background-position: right var(--mf-space-md) center;
605
- padding-right: var(--mf-space-xl);
884
+ padding-inline-end: var(--mf-space-xl);
606
885
  }
607
886
 
608
887
  /* Error State */
@@ -666,7 +945,7 @@ div.magicfeedback-radio {
666
945
  .magicfeedback-checkbox label,
667
946
  .magicfeedback-radio-container label {
668
947
  font-size: var(--mf-font-size-base);
669
- text-align: left;
948
+ text-align: start;
670
949
  color: var(--mf-text-primary);
671
950
  cursor: pointer;
672
951
  margin: 0;
@@ -764,7 +1043,7 @@ div.magicfeedback-radio {
764
1043
  }
765
1044
 
766
1045
  .magicfeedback-rating-placeholder-value:last-child {
767
- text-align: right;
1046
+ text-align: end;
768
1047
  }
769
1048
 
770
1049
  /* Rating with Images */
@@ -847,7 +1126,7 @@ div.magicfeedback-radio {
847
1126
  }
848
1127
 
849
1128
  .magicfeedback-rating-number-scale-label:last-child {
850
- text-align: right;
1129
+ text-align: end;
851
1130
  }
852
1131
 
853
1132
  /* Column, no per-option text: each row is its own separated chip, so
@@ -1165,7 +1444,7 @@ div.magicfeedback-radio {
1165
1444
  }
1166
1445
 
1167
1446
  .magicfeedback-multi-question-matrix-label {
1168
- text-align: left;
1447
+ text-align: start;
1169
1448
  font-size: var(--mf-font-size-base);
1170
1449
  color: var(--mf-text-primary);
1171
1450
  }
@@ -1200,7 +1479,7 @@ div.magicfeedback-radio {
1200
1479
  .magicfeedback-priority-list-item-label {
1201
1480
  flex: 1;
1202
1481
  font-size: var(--mf-font-size-base);
1203
- text-align: left;
1482
+ text-align: start;
1204
1483
  color: var(--mf-text-primary);
1205
1484
  margin: 0;
1206
1485
  }
@@ -1292,7 +1571,7 @@ div.magicfeedback-radio {
1292
1571
  .magicfeedback-consent-container label {
1293
1572
  flex: 1;
1294
1573
  font-size: var(--mf-font-size-sm);
1295
- text-align: left;
1574
+ text-align: start;
1296
1575
  color: var(--mf-text-secondary);
1297
1576
  line-height: var(--mf-line-height);
1298
1577
  cursor: pointer;
@@ -1444,7 +1723,7 @@ div.magicfeedback-radio {
1444
1723
  }
1445
1724
 
1446
1725
  .magicfeedback-modal-counter {
1447
- margin-right: auto;
1726
+ margin-inline-end: auto;
1448
1727
  display: flex;
1449
1728
  align-items: center;
1450
1729
  font-size: 14px;
@@ -1689,7 +1968,7 @@ div.magicfeedback-radio {
1689
1968
  .magicfeedback-modal-close {
1690
1969
  position: absolute;
1691
1970
  top: 8px;
1692
- right: 8px;
1971
+ inset-inline-end: 8px;
1693
1972
  background: transparent;
1694
1973
  border: none;
1695
1974
  font-size: 20px;
@@ -1910,6 +2189,55 @@ div.magicfeedback-radio {
1910
2189
  display: block;
1911
2190
  }
1912
2191
 
2192
+ /* ========================================
2193
+ RTL (Arabic)
2194
+ ========================================
2195
+ The SDK stamps dir="rtl" (and .magicfeedback-rtl) on the survey container
2196
+ for right-to-left languages. Everything else in this stylesheet uses logical
2197
+ properties (text-align: start, padding-inline-*, inset-inline-*), so it
2198
+ mirrors on its own; only the handful of rules that cannot be expressed
2199
+ logically live here.
2200
+
2201
+ Rules are scoped to [dir="rtl"] inside our own subtree so a host page that is
2202
+ itself RTL, or one that embeds an Arabic survey in an LTR page, both render
2203
+ correctly. */
2204
+
2205
+ /* background-position has no logical form: move the select caret to the
2206
+ left edge, opposite the padding that inset-inline-end already mirrored. */
2207
+ [dir="rtl"] select {
2208
+ background-position: left var(--mf-space-md) center;
2209
+ }
2210
+
2211
+ /* Emails, URLs, numbers, dates and phone numbers are latin/numeric content
2212
+ even in an Arabic survey: keep their own direction LTR so punctuation
2213
+ (@, ., +, /) lands where the user expects, but align them to the start of
2214
+ the RTL line so they still read as part of the form. */
2215
+ [dir="rtl"] input[type="email"],
2216
+ [dir="rtl"] input[type="url"],
2217
+ [dir="rtl"] input[type="number"],
2218
+ [dir="rtl"] input[type="tel"],
2219
+ [dir="rtl"] input[type="date"],
2220
+ [dir="rtl"] input[type="time"] {
2221
+ direction: ltr;
2222
+ text-align: right;
2223
+ }
2224
+
2225
+ /* Mirror of mf-slide-in: questions enter from the reading edge. */
2226
+ @keyframes mf-slide-in-rtl {
2227
+ from {
2228
+ opacity: 0;
2229
+ transform: translateX(16px);
2230
+ }
2231
+ to {
2232
+ opacity: 1;
2233
+ transform: translateX(0);
2234
+ }
2235
+ }
2236
+
2237
+ [dir="rtl"] .magicfeedback-div {
2238
+ animation-name: mf-slide-in-rtl;
2239
+ }
2240
+
1913
2241
  /* ========================================
1914
2242
  LOCAL \u2014 reglas del popup, no vienen del paquete
1915
2243
  ======================================== */
@@ -1956,10 +2284,19 @@ export {
1956
2284
  TrackingManager,
1957
2285
  buildFontFamilyValue,
1958
2286
  buildFontFaceCss,
2287
+ LABELS,
2288
+ SUPPORTED_LANGUAGES,
2289
+ resolveLocale,
2290
+ RTL_LOCALES,
2291
+ isRtlLanguage,
2292
+ directionFor,
2293
+ getLabels,
2294
+ resolveActionLabels,
2295
+ RESOLVE_LOCALE_JS,
1959
2296
  style_default,
1960
2297
  setLogger,
1961
2298
  sdkLog,
1962
2299
  sdkWarn,
1963
2300
  sdkError
1964
2301
  };
1965
- //# sourceMappingURL=chunk-AN7JIVWB.mjs.map
2302
+ //# sourceMappingURL=chunk-W6MPSWMS.mjs.map