@qaiddev/quests-embed 1.0.0 → 1.0.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/embed.d.ts CHANGED
@@ -38,6 +38,7 @@ export declare class QaidQuests {
38
38
  private mountShell;
39
39
  private renderLoading;
40
40
  private renderError;
41
+ private effectiveProgressPosition;
41
42
  private renderHeader;
42
43
  private renderStep;
43
44
  private renderDone;
@@ -1,9 +1,9 @@
1
- const k = '*{box-sizing:border-box}button{cursor:pointer;font-family:inherit}.qaid-q-root{font-family:var(--qaid-font-family, system-ui, -apple-system, sans-serif);font-size:var(--qaid-font-size, 16px);color:light-dark(#1f2937,#f9fafb)}.qaid-q-backdrop{position:fixed;inset:0;z-index:45;background:rgba(0,0,0,var(--qaid-backdrop-opacity, .4));animation:qaid-q-fade .18s ease-out}@keyframes qaid-q-fade{0%{opacity:0}to{opacity:1}}.qaid-q-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:50;width:var(--qaid-modal-width, 480px);max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);pointer-events:auto;display:flex;flex-direction:column}.qaid-q-card{background:light-dark(#ffffff,#1f2937);color:light-dark(#1f2937,#f9fafb);border-radius:1rem;box-shadow:0 25px 50px -12px light-dark(rgba(0,0,0,.25),rgba(0,0,0,.6));padding:1.5rem;overflow:hidden;display:flex;flex-direction:column;min-height:0}:where(.qaid-q-root.qaid-q-inline) .qaid-q-card{box-shadow:none;border:1px solid light-dark(#e5e7eb,#374151);flex:1;min-height:0}:where(.qaid-q-root.qaid-q-inline){height:100%;display:flex;flex-direction:column;min-height:0}.qaid-q-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.qaid-q-title{font-size:1.125em;font-weight:700;margin:0;color:light-dark(#1f2937,#f9fafb)}.qaid-q-step-counter{font-size:.875em;color:light-dark(#6b7280,#9ca3af);font-variant-numeric:tabular-nums;white-space:nowrap}.qaid-q-close{width:28px;height:28px;padding:0;border:none;border-radius:50%;background:transparent;color:light-dark(#6b7280,#9ca3af);display:inline-flex;align-items:center;justify-content:center;-webkit-appearance:none;appearance:none}.qaid-q-close:hover{background:light-dark(#f3f4f6,#374151);color:light-dark(#1f2937,#f9fafb)}.qaid-q-close:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-progress{position:relative;height:4px;background:light-dark(#e5e7eb,#374151);border-radius:9999px;overflow:hidden;margin-bottom:1.25rem}.qaid-q-progress--inline{flex:1;min-width:60px;margin-bottom:0}.qaid-q-progress-fill{position:absolute;inset:0 auto 0 0;background:var(--qaid-positive, #10b981);border-radius:9999px;transition:width .3s ease;width:0%}.qaid-q-body{flex:1;min-height:0;overflow-y:auto}.qaid-q-step{display:flex;flex-direction:column;gap:.75rem;animation:qaid-q-slide .22s ease-out}@keyframes qaid-q-slide{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.qaid-q-label{font-size:1.125em;font-weight:600;margin:0;color:light-dark(#1f2937,#f9fafb);line-height:1.35}.qaid-q-label .qaid-q-required{color:var(--qaid-negative, #ef4444);margin-left:.25rem}.qaid-q-description{font-size:.875em;color:light-dark(#6b7280,#9ca3af);margin:0;line-height:1.4}.qaid-q-error{font-size:.8125em;color:var(--qaid-negative, #ef4444);margin:0}.qaid-q-error:empty{display:none}.qaid-q-input,.qaid-q-textarea{width:100%;padding:.75rem .875rem;border:1px solid light-dark(#d1d5db,#374151);border-radius:.625rem;font-family:inherit;font-size:1em;background:light-dark(#ffffff,#111827);color:light-dark(#1f2937,#f9fafb);transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}.qaid-q-textarea{min-height:7rem;resize:vertical;font-family:inherit}.qaid-q-input:focus,.qaid-q-textarea:focus{outline:none;border-color:var(--qaid-marker, #6366f1);box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 20%,transparent)}.qaid-q-input::placeholder,.qaid-q-textarea::placeholder{color:light-dark(#9ca3af,#6b7280)}.qaid-q-currency{position:relative}.qaid-q-currency-prefix{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:light-dark(#6b7280,#9ca3af);font-size:1em;font-weight:500;pointer-events:none}.qaid-q-currency .qaid-q-input{padding-left:2.25rem}.qaid-q-range-wrap{display:flex;flex-direction:column;gap:.5rem;padding:.5rem 0}.qaid-q-range-value{font-size:2em;font-weight:700;text-align:center;font-variant-numeric:tabular-nums;color:var(--qaid-positive, #10b981)}.qaid-q-range-value .qaid-q-range-unit{font-size:.5em;font-weight:500;color:light-dark(#6b7280,#9ca3af);margin-left:.25rem}.qaid-q-range{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:9999px;background:light-dark(#e5e7eb,#374151);outline:none}.qaid-q-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:var(--qaid-positive, #10b981);border:3px solid light-dark(#ffffff,#1f2937);box-shadow:0 2px 6px #0003;cursor:pointer;transition:transform .1s}.qaid-q-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--qaid-positive, #10b981);border:3px solid light-dark(#ffffff,#1f2937);box-shadow:0 2px 6px #0003;cursor:pointer}.qaid-q-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 6px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 6px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-range-bounds{display:flex;justify-content:space-between;font-size:.8125em;color:light-dark(#6b7280,#9ca3af);font-variant-numeric:tabular-nums}.qaid-q-options{display:flex;flex-direction:column;gap:.5rem}.qaid-q-option{display:flex;align-items:flex-start;gap:.625rem;padding:.75rem .875rem;border:1px solid light-dark(#e5e7eb,#374151);border-radius:.625rem;background:light-dark(#ffffff,#111827);text-align:left;font-size:1em;color:light-dark(#1f2937,#f9fafb);cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s;-webkit-appearance:none;appearance:none;width:100%}.qaid-q-option:hover{border-color:light-dark(#9ca3af,#4b5563);background:light-dark(#f9fafb,#1f2937)}.qaid-q-option:focus-visible{outline:none;border-color:var(--qaid-marker, #6366f1);box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 25%,transparent)}.qaid-q-option.qaid-q-selected{border-color:var(--qaid-positive, #10b981);background:color-mix(in srgb,var(--qaid-positive, #10b981) 10%,transparent)}.qaid-q-option-marker{flex-shrink:0;width:1.25rem;height:1.25rem;border:2px solid light-dark(#d1d5db,#4b5563);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-top:.125rem;background:light-dark(#ffffff,#111827);transition:border-color .12s,background .12s}.qaid-q-option.qaid-q-multi .qaid-q-option-marker{border-radius:.25rem}.qaid-q-option.qaid-q-selected .qaid-q-option-marker{border-color:var(--qaid-positive, #10b981);background:var(--qaid-positive, #10b981)}.qaid-q-option.qaid-q-selected .qaid-q-option-marker:after{content:"";display:block;width:.5rem;height:.5rem;border-radius:50%;background:light-dark(#ffffff,#1f2937)}.qaid-q-option.qaid-q-multi.qaid-q-selected .qaid-q-option-marker:after{content:"";display:block;width:.625rem;height:.625rem;border-radius:0;background:transparent;border-right:2px solid light-dark(#ffffff,#1f2937);border-bottom:2px solid light-dark(#ffffff,#1f2937);transform:rotate(45deg) translate(-1px,-2px)}.qaid-q-option-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.125rem}.qaid-q-option-image{display:block;width:48px;height:48px;aspect-ratio:1 / 1;object-fit:cover;border-radius:.375rem;background:light-dark(#f3f4f6,#374151);flex-shrink:0}.qaid-q-options--image-horizontal .qaid-q-option-body{flex-direction:row;align-items:center;gap:.75rem}.qaid-q-options--image-horizontal .qaid-q-option-body>:not(.qaid-q-option-image){flex:1;min-width:0;display:flex;flex-direction:column;gap:.125rem}.qaid-q-options--image-vertical{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.5rem}.qaid-q-options--image-vertical .qaid-q-option{flex-direction:column;align-items:stretch;text-align:center;padding:.75rem;gap:.5rem}.qaid-q-options--image-vertical .qaid-q-option-body{align-items:center;text-align:center}.qaid-q-options--image-vertical .qaid-q-option-image{width:100%;height:auto;max-width:100%}.qaid-q-options--image-vertical .qaid-q-option-marker{position:absolute;top:.5rem;right:.5rem;margin-top:0}.qaid-q-options--image-vertical .qaid-q-option{position:relative}.qaid-q-options--image-vertical .qaid-q-option-key{position:absolute;top:.5rem;left:.5rem;align-self:auto}.qaid-q-option-label{font-weight:500;line-height:1.3}.qaid-q-option-desc{font-size:.8125em;color:light-dark(#6b7280,#9ca3af);line-height:1.4}.qaid-q-option-key{flex-shrink:0;align-self:center;font-size:.7em;font-weight:600;padding:.125rem .375rem;border-radius:.25rem;background:light-dark(#f3f4f6,#374151);color:light-dark(#6b7280,#9ca3af);font-variant-numeric:tabular-nums}.qaid-q-footer{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:1.25rem}.qaid-q-footer--inline-progress{justify-content:flex-start;gap:.75rem}.qaid-q-footer-left,.qaid-q-footer-right{display:flex;gap:.5rem}.qaid-q-btn{padding:.625rem 1.125rem;border-radius:.5rem;font-size:.9375em;font-weight:500;border:1px solid transparent;cursor:pointer;transition:filter .15s,background .15s,color .15s;-webkit-appearance:none;appearance:none}.qaid-q-btn:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-btn-secondary{background:transparent;border-color:light-dark(#d1d5db,#4b5563);color:light-dark(#374151,#d1d5db)}.qaid-q-btn-secondary:hover{background:light-dark(#f3f4f6,#374151)}.qaid-q-btn-primary{background:var(--qaid-positive, #10b981);color:var(--qaid-positive-text, #ffffff);border-color:transparent}.qaid-q-btn-primary:hover{filter:brightness(.9)}.qaid-q-btn-primary:disabled{opacity:.5;cursor:not-allowed;filter:none}.qaid-q-hint{font-size:.75em;color:light-dark(#6b7280,#9ca3af)}.qaid-q-hint kbd{display:inline-block;padding:.05rem .35rem;border-radius:.25rem;background:light-dark(#f3f4f6,#374151);border:1px solid light-dark(#e5e7eb,#4b5563);font-family:inherit;font-size:.7em;font-weight:600;color:light-dark(#374151,#e5e7eb)}.qaid-q-done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:1.5rem 0}.qaid-q-done-icon{width:48px;height:48px;border-radius:50%;background:color-mix(in srgb,var(--qaid-positive, #10b981) 18%,transparent);color:var(--qaid-positive, #10b981);display:inline-flex;align-items:center;justify-content:center;margin-bottom:.5rem}.qaid-q-done-title{font-size:1.25em;font-weight:700;margin:0}.qaid-q-done-message{color:light-dark(#6b7280,#9ca3af);margin:0}.qaid-q-saving{display:inline-flex;align-items:center;gap:.375rem;font-size:.75em;color:light-dark(#6b7280,#9ca3af);opacity:0;transition:opacity .2s}.qaid-q-saving.qaid-q-visible{opacity:1}.qaid-q-saving-dot{width:6px;height:6px;border-radius:50%;background:var(--qaid-positive, #10b981);animation:qaid-q-pulse 1.2s ease-in-out infinite}@keyframes qaid-q-pulse{0%,to{opacity:.3}50%{opacity:1}}';
2
- function w(t, e, i) {
1
+ const w = '*{box-sizing:border-box}button{cursor:pointer;font-family:inherit}.qaid-q-root{font-family:var(--qaid-font-family, system-ui, -apple-system, sans-serif);font-size:var(--qaid-font-size, 16px);color:light-dark(#1f2937,#f9fafb)}.qaid-q-backdrop{position:fixed;inset:0;z-index:45;background:rgba(0,0,0,var(--qaid-backdrop-opacity, .4));animation:qaid-q-fade .18s ease-out}@keyframes qaid-q-fade{0%{opacity:0}to{opacity:1}}.qaid-q-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:50;width:var(--qaid-modal-width, 480px);max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);pointer-events:auto;display:flex;flex-direction:column}.qaid-q-card{background:light-dark(#ffffff,#1f2937);color:light-dark(#1f2937,#f9fafb);border-radius:1rem;box-shadow:0 25px 50px -12px light-dark(rgba(0,0,0,.25),rgba(0,0,0,.6));padding:1.5rem;overflow:hidden;display:flex;flex-direction:column;min-height:0}:where(.qaid-q-root.qaid-q-inline) .qaid-q-card{box-shadow:none;border:1px solid light-dark(#e5e7eb,#374151);flex:1;min-height:0}:where(.qaid-q-root.qaid-q-inline){height:100%;display:flex;flex-direction:column;min-height:0}.qaid-q-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.qaid-q-title{font-size:1.125em;font-weight:700;margin:0;color:light-dark(#1f2937,#f9fafb)}.qaid-q-step-counter{font-size:.875em;color:light-dark(#6b7280,#9ca3af);font-variant-numeric:tabular-nums;white-space:nowrap}.qaid-q-close{width:28px;height:28px;padding:0;border:none;border-radius:50%;background:transparent;color:light-dark(#6b7280,#9ca3af);display:inline-flex;align-items:center;justify-content:center;-webkit-appearance:none;appearance:none}.qaid-q-close:hover{background:light-dark(#f3f4f6,#374151);color:light-dark(#1f2937,#f9fafb)}.qaid-q-close:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-progress{position:relative;height:4px;background:light-dark(#e5e7eb,#374151);border-radius:9999px;overflow:hidden;margin-bottom:1.25rem}.qaid-q-progress--inline{flex:1;min-width:60px;margin-bottom:0}.qaid-q-progress-fill{position:absolute;inset:0 auto 0 0;background:var(--qaid-positive, #10b981);border-radius:9999px;transition:width .3s ease;width:0%}.qaid-q-body{flex:1;min-height:0;overflow-y:auto}.qaid-q-step{display:flex;flex-direction:column;gap:.75rem;animation:qaid-q-slide .22s ease-out}@keyframes qaid-q-slide{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.qaid-q-no-motion .qaid-q-step,.qaid-q-no-motion.qaid-q-root{animation:none!important}.qaid-q-label{font-size:1.125em;font-weight:600;margin:0;color:light-dark(#1f2937,#f9fafb);line-height:1.35}.qaid-q-label .qaid-q-required{color:var(--qaid-negative, #ef4444);margin-left:.25rem}.qaid-q-description{font-size:.875em;color:light-dark(#6b7280,#9ca3af);margin:0;line-height:1.4}.qaid-q-error{font-size:.8125em;color:var(--qaid-negative, #ef4444);margin:0}.qaid-q-error:empty{display:none}.qaid-q-input,.qaid-q-textarea{width:100%;padding:.75rem .875rem;border:1px solid light-dark(#d1d5db,#374151);border-radius:.625rem;font-family:inherit;font-size:1em;background:light-dark(#ffffff,#111827);color:light-dark(#1f2937,#f9fafb);transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}.qaid-q-textarea{min-height:7rem;resize:vertical;font-family:inherit}.qaid-q-input:focus,.qaid-q-textarea:focus{outline:none;border-color:var(--qaid-marker, #6366f1);box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 20%,transparent)}.qaid-q-input::placeholder,.qaid-q-textarea::placeholder{color:light-dark(#9ca3af,#6b7280)}.qaid-q-currency{position:relative}.qaid-q-currency-prefix{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:light-dark(#6b7280,#9ca3af);font-size:1em;font-weight:500;pointer-events:none}.qaid-q-currency .qaid-q-input{padding-left:2.25rem}.qaid-q-range-wrap{display:flex;flex-direction:column;gap:.5rem;padding:.5rem 0}.qaid-q-range-value{font-size:2em;font-weight:700;text-align:center;font-variant-numeric:tabular-nums;color:var(--qaid-positive, #10b981)}.qaid-q-range-value .qaid-q-range-unit{font-size:.5em;font-weight:500;color:light-dark(#6b7280,#9ca3af);margin-left:.25rem}.qaid-q-range{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:9999px;background:light-dark(#e5e7eb,#374151);outline:none}.qaid-q-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:var(--qaid-positive, #10b981);border:3px solid light-dark(#ffffff,#1f2937);box-shadow:0 2px 6px #0003;cursor:pointer;transition:transform .1s}.qaid-q-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--qaid-positive, #10b981);border:3px solid light-dark(#ffffff,#1f2937);box-shadow:0 2px 6px #0003;cursor:pointer}.qaid-q-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 6px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 6px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-range-bounds{display:flex;justify-content:space-between;font-size:.8125em;color:light-dark(#6b7280,#9ca3af);font-variant-numeric:tabular-nums}.qaid-q-options{display:flex;flex-direction:column;gap:.5rem}.qaid-q-option{display:flex;align-items:flex-start;gap:.625rem;padding:.75rem .875rem;border:1px solid light-dark(#e5e7eb,#374151);border-radius:.625rem;background:light-dark(#ffffff,#111827);text-align:left;font-size:1em;color:light-dark(#1f2937,#f9fafb);cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s;-webkit-appearance:none;appearance:none;width:100%}.qaid-q-option:hover{border-color:light-dark(#9ca3af,#4b5563);background:light-dark(#f9fafb,#1f2937)}.qaid-q-option:focus-visible{outline:none;border-color:var(--qaid-marker, #6366f1);box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 25%,transparent)}.qaid-q-option.qaid-q-selected{border-color:var(--qaid-positive, #10b981);background:color-mix(in srgb,var(--qaid-positive, #10b981) 10%,transparent)}.qaid-q-option-marker{flex-shrink:0;width:1.25rem;height:1.25rem;border:2px solid light-dark(#d1d5db,#4b5563);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-top:.125rem;background:light-dark(#ffffff,#111827);transition:border-color .12s,background .12s}.qaid-q-option.qaid-q-multi .qaid-q-option-marker{border-radius:.25rem}.qaid-q-option.qaid-q-selected .qaid-q-option-marker{border-color:var(--qaid-positive, #10b981);background:var(--qaid-positive, #10b981)}.qaid-q-option.qaid-q-selected .qaid-q-option-marker:after{content:"";display:block;width:.5rem;height:.5rem;border-radius:50%;background:light-dark(#ffffff,#1f2937)}.qaid-q-option.qaid-q-multi.qaid-q-selected .qaid-q-option-marker:after{content:"";display:block;width:.625rem;height:.625rem;border-radius:0;background:transparent;border-right:2px solid light-dark(#ffffff,#1f2937);border-bottom:2px solid light-dark(#ffffff,#1f2937);transform:rotate(45deg) translate(-1px,-2px)}.qaid-q-option-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.125rem}.qaid-q-option-image{display:block;width:48px;height:48px;aspect-ratio:1 / 1;object-fit:cover;border-radius:.375rem;background:light-dark(#f3f4f6,#374151);flex-shrink:0}.qaid-q-options--image-horizontal .qaid-q-option-body{flex-direction:row;align-items:center;gap:.75rem}.qaid-q-options--image-horizontal .qaid-q-option-body>:not(.qaid-q-option-image){flex:1;min-width:0;display:flex;flex-direction:column;gap:.125rem}.qaid-q-options--image-vertical{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.5rem}.qaid-q-options--image-vertical .qaid-q-option{flex-direction:column;align-items:stretch;text-align:center;padding:.75rem;gap:.5rem}.qaid-q-options--image-vertical .qaid-q-option-body{align-items:center;text-align:center}.qaid-q-options--image-vertical .qaid-q-option-image{width:100%;height:auto;max-width:100%}.qaid-q-options--image-vertical .qaid-q-option-marker{position:absolute;top:.5rem;right:.5rem;margin-top:0}.qaid-q-options--image-vertical .qaid-q-option{position:relative}.qaid-q-options--image-vertical .qaid-q-option-key{position:absolute;top:.5rem;left:.5rem;align-self:auto}.qaid-q-option-label{font-weight:500;line-height:1.3}.qaid-q-option-desc{font-size:.8125em;color:light-dark(#6b7280,#9ca3af);line-height:1.4}.qaid-q-option-key{flex-shrink:0;align-self:center;font-size:.7em;font-weight:600;padding:.125rem .375rem;border-radius:.25rem;background:light-dark(#f3f4f6,#374151);color:light-dark(#6b7280,#9ca3af);font-variant-numeric:tabular-nums}.qaid-q-footer{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:1.25rem}.qaid-q-footer--inline-progress{justify-content:flex-start;gap:.75rem}.qaid-q-footer-left,.qaid-q-footer-right{display:flex;gap:.5rem}.qaid-q-btn{padding:.625rem 1.125rem;border-radius:.5rem;font-size:.9375em;font-weight:500;border:1px solid transparent;cursor:pointer;transition:filter .15s,background .15s,color .15s;-webkit-appearance:none;appearance:none}.qaid-q-btn:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--qaid-marker, #6366f1) 30%,transparent)}.qaid-q-btn-secondary{background:transparent;border-color:light-dark(#d1d5db,#4b5563);color:light-dark(#374151,#d1d5db)}.qaid-q-btn-secondary:hover{background:light-dark(#f3f4f6,#374151)}.qaid-q-btn-primary{background:var(--qaid-positive, #10b981);color:var(--qaid-positive-text, #ffffff);border-color:transparent}.qaid-q-btn-primary:hover{filter:brightness(.9)}.qaid-q-btn-primary:disabled{opacity:.5;cursor:not-allowed;filter:none}.qaid-q-hint{font-size:.75em;color:light-dark(#6b7280,#9ca3af)}.qaid-q-hint kbd{display:inline-block;padding:.05rem .35rem;border-radius:.25rem;background:light-dark(#f3f4f6,#374151);border:1px solid light-dark(#e5e7eb,#4b5563);font-family:inherit;font-size:.7em;font-weight:600;color:light-dark(#374151,#e5e7eb)}.qaid-q-done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:1.5rem 0}.qaid-q-done-icon{width:48px;height:48px;border-radius:50%;background:color-mix(in srgb,var(--qaid-positive, #10b981) 18%,transparent);color:var(--qaid-positive, #10b981);display:inline-flex;align-items:center;justify-content:center;margin-bottom:.5rem}.qaid-q-done-title{font-size:1.25em;font-weight:700;margin:0}.qaid-q-done-message{color:light-dark(#6b7280,#9ca3af);margin:0}.qaid-q-saving{display:inline-flex;align-items:center;gap:.375rem;font-size:.75em;color:light-dark(#6b7280,#9ca3af);opacity:0;transition:opacity .2s}.qaid-q-saving.qaid-q-visible{opacity:1}.qaid-q-saving-dot{width:6px;height:6px;border-radius:50%;background:var(--qaid-positive, #10b981);animation:qaid-q-pulse 1.2s ease-in-out infinite}@keyframes qaid-q-pulse{0%,to{opacity:.3}50%{opacity:1}}';
2
+ function C(t, e, i) {
3
3
  const [a, n, s] = [t, e, i].map((r) => (r = r / 255, r <= 0.03928 ? r / 12.92 : Math.pow((r + 0.055) / 1.055, 2.4)));
4
4
  return 0.2126 * a + 0.7152 * n + 0.0722 * s;
5
5
  }
6
- function C(t) {
6
+ function S(t) {
7
7
  if (t.startsWith("#")) {
8
8
  const i = t.slice(1), a = i.length === 3 ? i.split("").map((s) => s + s).join("") : i, n = parseInt(a, 16);
9
9
  return { r: n >> 16 & 255, g: n >> 8 & 255, b: n & 255 };
@@ -11,11 +11,11 @@ function C(t) {
11
11
  const e = t.match(/rgb\((\d+),\s*(\d+),\s*(\d+)\)/);
12
12
  return e ? { r: parseInt(e[1]), g: parseInt(e[2]), b: parseInt(e[3]) } : null;
13
13
  }
14
- function y(t) {
15
- const e = C(t);
16
- return e && w(e.r, e.g, e.b) > 0.4 ? "black" : "white";
14
+ function x(t) {
15
+ const e = S(t);
16
+ return e && C(e.r, e.g, e.b) > 0.4 ? "black" : "white";
17
17
  }
18
- function S(t = {}) {
18
+ function N(t = {}) {
19
19
  const {
20
20
  positiveColor: e = "#10b981",
21
21
  negativeColor: i = "#ef4444",
@@ -23,42 +23,42 @@ function S(t = {}) {
23
23
  modalWidth: n = 480,
24
24
  backdropOpacity: s = 0.4,
25
25
  fontFamily: r = "system-ui, -apple-system, sans-serif",
26
- fontSize: p = 16
26
+ fontSize: h = 16
27
27
  } = t;
28
28
  return {
29
29
  "--qaid-positive": e,
30
- "--qaid-positive-text": y(e),
30
+ "--qaid-positive-text": x(e),
31
31
  "--qaid-negative": i,
32
32
  "--qaid-marker": a,
33
- "--qaid-marker-text": y(a),
33
+ "--qaid-marker-text": x(a),
34
34
  "--qaid-modal-width": `${n}px`,
35
35
  "--qaid-backdrop-opacity": String(s),
36
36
  "--qaid-font-family": r,
37
- "--qaid-font-size": `${p}px`
37
+ "--qaid-font-size": `${h}px`
38
38
  };
39
39
  }
40
- function N(t, e) {
40
+ function A(t, e) {
41
41
  for (const [i, a] of Object.entries(e))
42
42
  t.style.setProperty(i, a);
43
43
  }
44
- function A() {
45
- return k;
44
+ function I() {
45
+ return w;
46
46
  }
47
- function I(t) {
47
+ function L(t) {
48
48
  switch (t.question.type) {
49
49
  case "text":
50
- return L(t.question, t);
50
+ return z(t.question, t);
51
51
  case "currency":
52
- return V(t.question, t);
52
+ return T(t.question, t);
53
53
  case "range":
54
- return D(t.question, t);
54
+ return P(t.question, t);
55
55
  case "date":
56
56
  return H(t.question, t);
57
57
  case "multiple-choice":
58
58
  return O(t.question, t);
59
59
  }
60
60
  }
61
- function L(t, e) {
61
+ function z(t, e) {
62
62
  const i = typeof e.initialValue == "string" ? e.initialValue : "";
63
63
  let a;
64
64
  if (t.multiline) {
@@ -66,7 +66,7 @@ function L(t, e) {
66
66
  n.className = "qaid-q-textarea", n.value = i, t.placeholder && (n.placeholder = t.placeholder), t.maxLength && (n.maxLength = t.maxLength), a = n;
67
67
  } else {
68
68
  const n = document.createElement("input");
69
- n.className = "qaid-q-input", n.type = t.inputType ?? "text", n.value = i, t.placeholder && (n.placeholder = t.placeholder), t.maxLength && (n.maxLength = t.maxLength), n.setAttribute("autocomplete", z(t.inputType)), a = n;
69
+ n.className = "qaid-q-input", n.type = t.inputType ?? "text", n.value = i, t.placeholder && (n.placeholder = t.placeholder), t.maxLength && (n.maxLength = t.maxLength), n.setAttribute("autocomplete", V(t.inputType)), a = n;
70
70
  }
71
71
  return a.setAttribute("aria-label", t.label), a.addEventListener("input", () => {
72
72
  e.onChange(a.value);
@@ -96,7 +96,7 @@ function L(t, e) {
96
96
  }
97
97
  };
98
98
  }
99
- function z(t) {
99
+ function V(t) {
100
100
  switch (t) {
101
101
  case "email":
102
102
  return "email";
@@ -108,11 +108,11 @@ function z(t) {
108
108
  return "off";
109
109
  }
110
110
  }
111
- function V(t, e) {
111
+ function T(t, e) {
112
112
  const i = document.createElement("div");
113
113
  i.className = "qaid-q-currency";
114
114
  const a = document.createElement("span");
115
- a.className = "qaid-q-currency-prefix", a.textContent = T(t.currency ?? "USD", t.locale), i.appendChild(a);
115
+ a.className = "qaid-q-currency-prefix", a.textContent = D(t.currency ?? "USD", t.locale), i.appendChild(a);
116
116
  const n = document.createElement("input");
117
117
  return n.className = "qaid-q-input", n.type = "number", n.inputMode = "decimal", n.step = "0.01", typeof t.min == "number" && (n.min = String(t.min)), typeof t.max == "number" && (n.max = String(t.max)), t.placeholder && (n.placeholder = t.placeholder), typeof e.initialValue == "number" ? n.value = String(e.initialValue) : typeof e.initialValue == "string" && e.initialValue !== "" && (n.value = e.initialValue), n.setAttribute("aria-label", t.label), n.addEventListener("input", () => {
118
118
  const s = n.value;
@@ -138,7 +138,7 @@ function V(t, e) {
138
138
  }
139
139
  };
140
140
  }
141
- function T(t, e) {
141
+ function D(t, e) {
142
142
  try {
143
143
  return new Intl.NumberFormat(e, {
144
144
  style: "currency",
@@ -150,7 +150,7 @@ function T(t, e) {
150
150
  return t;
151
151
  }
152
152
  }
153
- function D(t, e) {
153
+ function P(t, e) {
154
154
  const i = document.createElement("div");
155
155
  i.className = "qaid-q-range-wrap";
156
156
  const a = document.createElement("div");
@@ -162,20 +162,20 @@ function D(t, e) {
162
162
  }
163
163
  const s = typeof e.initialValue == "number" ? e.initialValue : t.defaultValue ?? t.min, r = document.createElement("input");
164
164
  r.className = "qaid-q-range", r.type = "range", r.min = String(t.min), r.max = String(t.max), r.step = String(t.step ?? 1), r.value = String(s), r.setAttribute("aria-label", t.label), r.setAttribute("aria-valuemin", String(t.min)), r.setAttribute("aria-valuemax", String(t.max));
165
- const p = () => {
165
+ const h = () => {
166
166
  n.textContent = r.value, r.setAttribute("aria-valuenow", r.value);
167
167
  };
168
- p(), r.addEventListener("input", () => {
169
- p(), e.onChange(Number(r.value));
168
+ h(), r.addEventListener("input", () => {
169
+ h(), e.onChange(Number(r.value));
170
170
  }), r.addEventListener("keydown", (o) => {
171
171
  o.key === "Enter" && (o.preventDefault(), e.onSubmit());
172
172
  });
173
- const h = document.createElement("div");
174
- h.className = "qaid-q-range-bounds";
173
+ const p = document.createElement("div");
174
+ p.className = "qaid-q-range-bounds";
175
175
  const f = document.createElement("span");
176
176
  f.textContent = `${t.min}${t.unit ?? ""}`;
177
- const m = document.createElement("span");
178
- return m.textContent = `${t.max}${t.unit ?? ""}`, h.appendChild(f), h.appendChild(m), i.appendChild(a), i.appendChild(r), i.appendChild(h), queueMicrotask(() => e.onChange(Number(r.value))), {
177
+ const g = document.createElement("span");
178
+ return g.textContent = `${t.max}${t.unit ?? ""}`, p.appendChild(f), p.appendChild(g), i.appendChild(a), i.appendChild(r), i.appendChild(p), queueMicrotask(() => e.onChange(Number(r.value))), {
179
179
  element: i,
180
180
  focus: () => r.focus(),
181
181
  getValue: () => Number(r.value),
@@ -202,55 +202,55 @@ function O(t, e) {
202
202
  if (t.multiple && Array.isArray(e.initialValue))
203
203
  for (const o of e.initialValue) r.add(o);
204
204
  else !t.multiple && typeof e.initialValue == "string" && r.add(e.initialValue);
205
- const p = [];
205
+ const h = [];
206
206
  t.options.forEach((o, c) => {
207
- const u = document.createElement("button");
208
- u.type = "button", u.className = `qaid-q-option${t.multiple ? " qaid-q-multi" : ""}`, u.dataset.value = o.value, u.setAttribute("role", t.multiple ? "checkbox" : "radio"), u.setAttribute("aria-checked", r.has(o.value) ? "true" : "false"), r.has(o.value) && u.classList.add("qaid-q-selected");
209
- const g = document.createElement("span");
210
- g.className = "qaid-q-option-marker", g.setAttribute("aria-hidden", "true");
211
- const l = document.createElement("span");
212
- if (l.className = "qaid-q-option-body", o.image) {
207
+ const l = document.createElement("button");
208
+ l.type = "button", l.className = `qaid-q-option${t.multiple ? " qaid-q-multi" : ""}`, l.dataset.value = o.value, l.setAttribute("role", t.multiple ? "checkbox" : "radio"), l.setAttribute("aria-checked", r.has(o.value) ? "true" : "false"), r.has(o.value) && l.classList.add("qaid-q-selected");
209
+ const m = document.createElement("span");
210
+ m.className = "qaid-q-option-marker", m.setAttribute("aria-hidden", "true");
211
+ const q = document.createElement("span");
212
+ if (q.className = "qaid-q-option-body", o.image) {
213
213
  const d = document.createElement("img");
214
- d.className = "qaid-q-option-image", d.src = o.image, d.alt = "", d.loading = "lazy", d.decoding = "async", l.appendChild(d);
214
+ d.className = "qaid-q-option-image", d.src = o.image, d.alt = "", d.loading = "lazy", d.decoding = "async", q.appendChild(d);
215
215
  }
216
- const b = document.createElement("span");
217
- if (b.className = "qaid-q-option-label", b.textContent = o.label, l.appendChild(b), o.description) {
216
+ const u = document.createElement("span");
217
+ if (u.className = "qaid-q-option-label", u.textContent = o.label, q.appendChild(u), o.description) {
218
218
  const d = document.createElement("span");
219
- d.className = "qaid-q-option-desc", d.textContent = o.description, l.appendChild(d);
219
+ d.className = "qaid-q-option-desc", d.textContent = o.description, q.appendChild(d);
220
220
  }
221
- if (u.appendChild(g), u.appendChild(l), c < 9) {
221
+ if (l.appendChild(m), l.appendChild(q), c < 9) {
222
222
  const d = document.createElement("span");
223
- d.className = "qaid-q-option-key", d.textContent = String(c + 1), d.setAttribute("aria-hidden", "true"), u.appendChild(d);
223
+ d.className = "qaid-q-option-key", d.textContent = String(c + 1), d.setAttribute("aria-hidden", "true"), l.appendChild(d);
224
224
  }
225
- u.addEventListener("click", () => f(c)), u.addEventListener("keydown", (d) => {
225
+ l.addEventListener("click", () => f(c)), l.addEventListener("keydown", (d) => {
226
226
  if (d.key === "ArrowDown" || d.key === "ArrowRight") {
227
- d.preventDefault(), h((c + 1) % p.length);
227
+ d.preventDefault(), p((c + 1) % h.length);
228
228
  return;
229
229
  }
230
230
  if (d.key === "ArrowUp" || d.key === "ArrowLeft") {
231
- d.preventDefault(), h((c - 1 + p.length) % p.length);
231
+ d.preventDefault(), p((c - 1 + h.length) % h.length);
232
232
  return;
233
233
  }
234
234
  !t.multiple && d.key === "Enter" && r.size > 0 && (d.preventDefault(), e.onSubmit());
235
- }), p.push(u), i.appendChild(u);
235
+ }), h.push(l), i.appendChild(l);
236
236
  }), i.addEventListener("keydown", (o) => {
237
237
  const c = o.key;
238
238
  if (c.length === 1 && c >= "1" && c <= "9") {
239
- const u = parseInt(c, 10) - 1;
240
- u < p.length && (o.preventDefault(), f(u), h(u));
239
+ const l = parseInt(c, 10) - 1;
240
+ l < h.length && (o.preventDefault(), f(l), p(l));
241
241
  }
242
242
  });
243
- function h(o) {
244
- p[o]?.focus();
243
+ function p(o) {
244
+ h[o]?.focus();
245
245
  }
246
246
  function f(o) {
247
247
  const c = t.options[o].value;
248
- t.multiple ? r.has(c) ? r.delete(c) : r.add(c) : (r.clear(), r.add(c)), p.forEach((u) => {
249
- const g = u.dataset.value, l = r.has(g);
250
- u.classList.toggle("qaid-q-selected", l), u.setAttribute("aria-checked", l ? "true" : "false");
251
- }), e.onChange(m()), !t.multiple && e.autoAdvance && setTimeout(() => e.onAutoAdvance(), 180);
248
+ t.multiple ? r.has(c) ? r.delete(c) : r.add(c) : (r.clear(), r.add(c)), h.forEach((l) => {
249
+ const m = l.dataset.value, q = r.has(m);
250
+ l.classList.toggle("qaid-q-selected", q), l.setAttribute("aria-checked", q ? "true" : "false");
251
+ }), e.onChange(g()), !t.multiple && e.autoAdvance && setTimeout(() => e.onAutoAdvance(), 180);
252
252
  }
253
- function m() {
253
+ function g() {
254
254
  if (t.multiple) return Array.from(r);
255
255
  const o = r.values().next();
256
256
  return o.done ? null : o.value;
@@ -258,45 +258,45 @@ function O(t, e) {
258
258
  return {
259
259
  element: i,
260
260
  focus: () => {
261
- (p.find((c) => c.classList.contains("qaid-q-selected")) ?? p[0])?.focus();
261
+ (h.find((c) => c.classList.contains("qaid-q-selected")) ?? h[0])?.focus();
262
262
  },
263
- getValue: () => m(),
263
+ getValue: () => g(),
264
264
  isValid: () => t.required ? r.size > 0 : !0
265
265
  };
266
266
  }
267
267
  function F(t, e) {
268
268
  return t.questions.filter(
269
- (i) => i.visibleIf ? v(i.visibleIf, e) : !0
269
+ (i) => i.visibleIf ? y(i.visibleIf, e) : !0
270
270
  );
271
271
  }
272
- function v(t, e) {
272
+ function y(t, e) {
273
273
  if ("allOf" in t) {
274
274
  for (const n of t.allOf)
275
- if (!v(n, e)) return !1;
275
+ if (!y(n, e)) return !1;
276
276
  return !0;
277
277
  }
278
278
  if ("anyOf" in t) {
279
279
  for (const n of t.anyOf)
280
- if (v(n, e)) return !0;
280
+ if (y(n, e)) return !0;
281
281
  return !1;
282
282
  }
283
283
  const i = e[t.questionId], a = i != null && !(typeof i == "string" && i.trim() === "") && !(Array.isArray(i) && i.length === 0);
284
- return "answered" in t ? t.answered ? a : !a : a ? "equals" in t ? q(i, t.equals) : "notEquals" in t ? !q(i, t.notEquals) : "in" in t ? t.in.some((n) => q(i, n)) : !1 : !1;
284
+ return "answered" in t ? t.answered ? a : !a : a ? "equals" in t ? v(i, t.equals) : "notEquals" in t ? !v(i, t.notEquals) : "in" in t ? t.in.some((n) => v(i, n)) : !1 : !1;
285
285
  }
286
- function q(t, e) {
286
+ function v(t, e) {
287
287
  return Array.isArray(t) ? t.some((i) => i === e) : t === e;
288
288
  }
289
- const x = "qaid_visitor_id";
290
- function P() {
289
+ const E = "qaid_visitor_id";
290
+ function Q() {
291
291
  try {
292
- let t = localStorage.getItem(x);
293
- return t || (t = crypto.randomUUID(), localStorage.setItem(x, t)), t;
292
+ let t = localStorage.getItem(E);
293
+ return t || (t = crypto.randomUUID(), localStorage.setItem(E, t)), t;
294
294
  } catch {
295
295
  return crypto.randomUUID();
296
296
  }
297
297
  }
298
- const Q = '<svg width="14" height="14" viewBox="0 0 14 14" aria-hidden="true"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" fill="none"/></svg>', U = '<svg width="24" height="24" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12l4 4L19 7" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" fill="none"/></svg>';
299
- class j {
298
+ const U = '<svg width="14" height="14" viewBox="0 0 14 14" aria-hidden="true"><path d="M2 2l10 10M12 2L2 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" fill="none"/></svg>', j = '<svg width="24" height="24" viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12l4 4L19 7" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" fill="none"/></svg>';
299
+ class R {
300
300
  config;
301
301
  questionnaire = null;
302
302
  inlineQuestionnaire;
@@ -361,11 +361,16 @@ class j {
361
361
  autoAdvance: e.autoAdvance ?? !1,
362
362
  saveDebounceMs: e.saveDebounceMs ?? 500,
363
363
  autoFocus: e.autoFocus ?? !0,
364
- progressPosition: e.progressPosition ?? "top"
365
- }, this.inlineQuestionnaire = e.questionnaire, this.configUrl = e.configUrl, this.visitorId = P(), this.boundKeyDown = this.handleKeyDown.bind(this), this.init();
364
+ animate: e.animate ?? !0,
365
+ // Don't default here — we want to fall through to the
366
+ // questionnaire's `progressPosition` when the host didn't
367
+ // explicitly set one. effectiveProgressPosition() handles the
368
+ // final fallback to "top".
369
+ progressPosition: e.progressPosition
370
+ }, this.inlineQuestionnaire = e.questionnaire, this.configUrl = e.configUrl, this.visitorId = Q(), this.boundKeyDown = this.handleKeyDown.bind(this), this.init();
366
371
  }
367
372
  async init() {
368
- this.cssVars = S({
373
+ this.cssVars = N({
369
374
  positiveColor: this.config.colors.positive,
370
375
  negativeColor: this.config.colors.negative,
371
376
  markerColor: this.config.colors.marker,
@@ -411,11 +416,15 @@ class j {
411
416
  const e = this.config.container ? document.querySelector(this.config.container) : null;
412
417
  e ? (this.shadowHost.style.display = "block", this.shadowHost.style.height = "100%", this.shadowHost.style.minHeight = "0", e.appendChild(this.shadowHost), this.isUserContainer = !0) : (this.shadowHost.style.position = "fixed", this.shadowHost.style.inset = "0", this.shadowHost.style.zIndex = String(this.config.zIndex), this.shadowHost.style.pointerEvents = "none", document.body.appendChild(this.shadowHost)), this.shadowRoot = this.shadowHost.attachShadow({ mode: "open" });
413
418
  const i = document.createElement("style");
414
- if (i.textContent = A(), this.shadowRoot.appendChild(i), this.config.css) {
419
+ if (i.textContent = I(), this.shadowRoot.appendChild(i), this.config.css) {
415
420
  const a = document.createElement("style");
416
421
  a.textContent = this.config.css, this.shadowRoot.appendChild(a);
417
422
  }
418
- if (this.rootEl = document.createElement("div"), this.rootEl.className = `qaid-q-root${this.isUserContainer ? " qaid-q-inline" : ""}`, N(this.rootEl, this.cssVars), this.isUserContainer)
423
+ if (this.rootEl = document.createElement("div"), this.rootEl.className = [
424
+ "qaid-q-root",
425
+ this.isUserContainer ? "qaid-q-inline" : "",
426
+ this.config.animate ? "" : "qaid-q-no-motion"
427
+ ].filter(Boolean).join(" "), A(this.rootEl, this.cssVars), this.isUserContainer)
419
428
  this.cardEl = document.createElement("div"), this.cardEl.className = "qaid-q-card", this.rootEl.appendChild(this.cardEl);
420
429
  else {
421
430
  this.backdropEl = document.createElement("div"), this.backdropEl.className = "qaid-q-backdrop", this.backdropEl.addEventListener("click", () => this.close()), this.rootEl.appendChild(this.backdropEl);
@@ -438,33 +447,36 @@ class j {
438
447
  const a = document.createElement("p");
439
448
  a.className = "qaid-q-description", a.textContent = e instanceof Error ? e.message : String(e), this.cardEl.appendChild(i), this.cardEl.appendChild(a);
440
449
  }
450
+ effectiveProgressPosition() {
451
+ return this.config.progressPosition ?? this.questionnaire?.progressPosition ?? "top";
452
+ }
441
453
  renderHeader() {
442
454
  if (!this.cardEl || !this.questionnaire) return;
443
455
  this.cardEl.replaceChildren();
444
- const e = this.config.progressPosition === "bottom", i = !!this.questionnaire.title, a = !!this.questionnaire.description, n = !this.isUserContainer;
456
+ const e = !!this.questionnaire.hideProgress || this.questionnaire.questions.length <= 1, i = !e && this.effectiveProgressPosition() === "bottom", a = !!this.questionnaire.hideTitle, n = !!this.questionnaire.title && !a, s = !!this.questionnaire.description && !a, r = !this.isUserContainer, h = r || !i && !e;
445
457
  this.savingEl = document.createElement("div"), this.savingEl.className = "qaid-q-saving";
446
- const s = document.createElement("span");
447
- s.className = "qaid-q-saving-dot";
448
- const r = document.createElement("span");
449
- r.textContent = "Saving…", this.savingEl.appendChild(s), this.savingEl.appendChild(r), this.stepCounterEl = document.createElement("div"), this.stepCounterEl.className = "qaid-q-step-counter", this.progressEl = document.createElement("div"), this.progressEl.className = e ? "qaid-q-progress qaid-q-progress--inline" : "qaid-q-progress", this.progressFillEl = document.createElement("div"), this.progressFillEl.className = "qaid-q-progress-fill", this.progressEl.appendChild(this.progressFillEl);
450
- const p = i || n || !e;
451
- if (p) {
452
- const h = document.createElement("div");
453
- h.className = "qaid-q-header";
454
- const f = document.createElement("div");
455
- i && (this.titleEl = document.createElement("h2"), this.titleEl.className = "qaid-q-title", this.titleEl.textContent = this.questionnaire.title, f.appendChild(this.titleEl));
456
- const m = document.createElement("div");
457
- if (m.style.display = "flex", m.style.alignItems = "center", m.style.gap = "0.5rem", e || (m.appendChild(this.savingEl), m.appendChild(this.stepCounterEl)), n) {
458
- const o = document.createElement("button");
459
- o.type = "button", o.className = "qaid-q-close", o.setAttribute("aria-label", "Close form"), o.innerHTML = Q, o.addEventListener("click", () => this.close()), m.appendChild(o);
458
+ const p = document.createElement("span");
459
+ p.className = "qaid-q-saving-dot";
460
+ const f = document.createElement("span");
461
+ f.textContent = "Saving…", this.savingEl.appendChild(p), this.savingEl.appendChild(f), this.stepCounterEl = document.createElement("div"), this.stepCounterEl.className = "qaid-q-step-counter", this.progressEl = document.createElement("div"), this.progressEl.className = i ? "qaid-q-progress qaid-q-progress--inline" : "qaid-q-progress", this.progressFillEl = document.createElement("div"), this.progressFillEl.className = "qaid-q-progress-fill", this.progressEl.appendChild(this.progressFillEl);
462
+ const g = n || h;
463
+ if (g) {
464
+ const o = document.createElement("div");
465
+ o.className = "qaid-q-header";
466
+ const c = document.createElement("div");
467
+ n && (this.titleEl = document.createElement("h2"), this.titleEl.className = "qaid-q-title", this.titleEl.textContent = this.questionnaire.title, c.appendChild(this.titleEl));
468
+ const l = document.createElement("div");
469
+ if (l.style.display = "flex", l.style.alignItems = "center", l.style.gap = "0.5rem", i || (l.appendChild(this.savingEl), e || l.appendChild(this.stepCounterEl)), r) {
470
+ const m = document.createElement("button");
471
+ m.type = "button", m.className = "qaid-q-close", m.setAttribute("aria-label", "Close form"), m.innerHTML = U, m.addEventListener("click", () => this.close()), l.appendChild(m);
460
472
  }
461
- h.appendChild(f), h.appendChild(m), this.cardEl.appendChild(h);
473
+ o.appendChild(c), o.appendChild(l), this.cardEl.appendChild(o);
462
474
  }
463
- if (a) {
464
- const h = document.createElement("p");
465
- h.className = "qaid-q-description", h.textContent = this.questionnaire.description, h.style.marginTop = p ? "-0.5rem" : "0", h.style.marginBottom = "0.75rem", this.cardEl.appendChild(h);
475
+ if (s) {
476
+ const o = document.createElement("p");
477
+ o.className = "qaid-q-description", o.textContent = this.questionnaire.description, o.style.marginTop = g ? "-0.5rem" : "0", o.style.marginBottom = "0.75rem", this.cardEl.appendChild(o);
466
478
  }
467
- e || this.cardEl.appendChild(this.progressEl), this.bodyEl = document.createElement("div"), this.bodyEl.className = "qaid-q-body", this.cardEl.appendChild(this.bodyEl), this.footerEl = document.createElement("div"), this.footerEl.className = "qaid-q-footer", this.cardEl.appendChild(this.footerEl);
479
+ !i && !e && this.cardEl.appendChild(this.progressEl), this.bodyEl = document.createElement("div"), this.bodyEl.className = "qaid-q-body", this.cardEl.appendChild(this.bodyEl), this.footerEl = document.createElement("div"), this.footerEl.className = "qaid-q-footer", this.cardEl.appendChild(this.footerEl);
468
480
  }
469
481
  // ------------------------------------------------------------------
470
482
  // Step rendering
@@ -479,50 +491,50 @@ class j {
479
491
  this.stepIndex >= e && (this.stepIndex = e - 1);
480
492
  const i = this.stepIndex, a = this.visibleQuestions[i];
481
493
  if (this.stepCounterEl && (this.stepCounterEl.textContent = `${i + 1} / ${e}`), this.progressFillEl) {
482
- const l = (i + 1) / e * 100;
483
- this.progressFillEl.style.width = `${l}%`;
494
+ const u = (i + 1) / e * 100;
495
+ this.progressFillEl.style.width = `${u}%`;
484
496
  }
485
497
  const n = document.createElement("div");
486
498
  n.className = "qaid-q-step", n.setAttribute("role", "group"), n.setAttribute("aria-labelledby", `qaid-q-label-${i}`);
487
499
  const s = document.createElement("label");
488
500
  if (s.id = `qaid-q-label-${i}`, s.className = "qaid-q-label", s.textContent = a.label, a.required) {
489
- const l = document.createElement("span");
490
- l.className = "qaid-q-required", l.textContent = "*", l.setAttribute("aria-label", "required"), s.appendChild(l);
501
+ const u = document.createElement("span");
502
+ u.className = "qaid-q-required", u.textContent = "*", u.setAttribute("aria-label", "required"), s.appendChild(u);
491
503
  }
492
504
  if (n.appendChild(s), a.description) {
493
- const l = document.createElement("p");
494
- l.className = "qaid-q-description", l.textContent = a.description, n.appendChild(l);
505
+ const u = document.createElement("p");
506
+ u.className = "qaid-q-description", u.textContent = a.description, n.appendChild(u);
495
507
  }
496
508
  const r = document.createElement("p");
497
509
  r.className = "qaid-q-error", r.setAttribute("aria-live", "polite");
498
- const p = this.answers[a.id] ?? null, h = i === e - 1, f = I({
510
+ const h = this.answers[a.id] ?? null, p = i === e - 1, f = L({
499
511
  question: a,
500
- initialValue: p,
501
- onChange: (l) => {
502
- this.handleAnswerChange(a, l), r.textContent && (r.textContent = "");
512
+ initialValue: h,
513
+ onChange: (u) => {
514
+ this.handleAnswerChange(a, u), r.textContent && (r.textContent = "");
503
515
  },
504
516
  onSubmit: () => this.advance(a, r),
505
517
  onAutoAdvance: () => this.advance(a, r),
506
518
  autoAdvance: this.config.autoAdvance
507
519
  });
508
520
  this.currentInput = f, n.appendChild(f.element), n.appendChild(r), this.bodyEl.replaceChildren(n), this.footerEl.replaceChildren();
509
- const m = this.config.progressPosition === "bottom", o = i > 0 ? (() => {
510
- const l = document.createElement("button");
511
- return l.type = "button", l.className = "qaid-q-btn qaid-q-btn-secondary", l.textContent = this.questionnaire.backLabel ?? "Back", l.addEventListener("click", () => this.back()), l;
512
- })() : null, c = document.createElement("button");
513
- if (c.type = "button", c.className = "qaid-q-btn qaid-q-btn-primary", c.textContent = h ? this.questionnaire.submitLabel ?? "Submit" : this.questionnaire.nextLabel ?? "Next", c.addEventListener("click", () => this.advance(a, r)), m)
514
- this.footerEl.classList.add("qaid-q-footer--inline-progress"), o && this.footerEl.appendChild(o), this.progressEl && this.footerEl.appendChild(this.progressEl), this.savingEl && this.footerEl.appendChild(this.savingEl), this.stepCounterEl && this.footerEl.appendChild(this.stepCounterEl), this.footerEl.appendChild(c);
521
+ const o = !(!!this.questionnaire.hideProgress || this.questionnaire.questions.length <= 1) && this.effectiveProgressPosition() === "bottom", c = i > 0 ? (() => {
522
+ const u = document.createElement("button");
523
+ return u.type = "button", u.className = "qaid-q-btn qaid-q-btn-secondary", u.textContent = this.questionnaire.backLabel ?? "Back", u.addEventListener("click", () => this.back()), u;
524
+ })() : null, l = document.createElement("button");
525
+ if (l.type = "button", l.className = "qaid-q-btn qaid-q-btn-primary", l.textContent = p ? this.questionnaire.submitLabel ?? "Submit" : this.questionnaire.nextLabel ?? "Next", l.addEventListener("click", () => this.advance(a, r)), o)
526
+ this.footerEl.classList.add("qaid-q-footer--inline-progress"), c && this.footerEl.appendChild(c), this.progressEl && this.footerEl.appendChild(this.progressEl), this.savingEl && this.footerEl.appendChild(this.savingEl), this.stepCounterEl && this.footerEl.appendChild(this.stepCounterEl), this.footerEl.appendChild(l);
515
527
  else {
516
528
  this.footerEl.classList.remove("qaid-q-footer--inline-progress");
517
- const l = document.createElement("div");
518
- l.className = "qaid-q-footer-left";
519
- const b = document.createElement("div");
520
- b.className = "qaid-q-footer-right", o && l.appendChild(o);
521
- const d = document.createElement("span");
522
- d.className = "qaid-q-hint", d.innerHTML = h ? "<kbd>Enter</kbd> to submit" : "<kbd>Enter</kbd> to continue", b.appendChild(d), b.appendChild(c), this.footerEl.appendChild(l), this.footerEl.appendChild(b);
529
+ const u = document.createElement("div");
530
+ u.className = "qaid-q-footer-left";
531
+ const d = document.createElement("div");
532
+ d.className = "qaid-q-footer-right", c && u.appendChild(c);
533
+ const b = document.createElement("span");
534
+ b.className = "qaid-q-hint", b.innerHTML = p ? "<kbd>Enter</kbd> to submit" : "<kbd>Enter</kbd> to continue", d.appendChild(b), d.appendChild(l), this.footerEl.appendChild(u), this.footerEl.appendChild(d);
523
535
  }
524
- const u = !this.hasRenderedStep;
525
- this.hasRenderedStep = !0, (!u || this.config.autoFocus) && requestAnimationFrame(() => f.focus());
536
+ const m = !this.hasRenderedStep;
537
+ this.hasRenderedStep = !0, (!m || this.config.autoFocus) && requestAnimationFrame(() => f.focus());
526
538
  }
527
539
  renderDone() {
528
540
  if (!this.cardEl || !this.questionnaire) return;
@@ -530,7 +542,7 @@ class j {
530
542
  const e = document.createElement("div");
531
543
  e.className = "qaid-q-done";
532
544
  const i = document.createElement("div");
533
- i.className = "qaid-q-done-icon", i.innerHTML = U, e.appendChild(i);
545
+ i.className = "qaid-q-done-icon", i.innerHTML = j, e.appendChild(i);
534
546
  const a = document.createElement("h3");
535
547
  if (a.className = "qaid-q-done-title", a.textContent = this.questionnaire.thankYouTitle ?? "Thank you!", e.appendChild(a), this.questionnaire.thankYouMessage) {
536
548
  const n = document.createElement("p");
@@ -548,7 +560,7 @@ class j {
548
560
  advance(e, i) {
549
561
  if (!this.currentInput || !this.questionnaire) return;
550
562
  if (!this.currentInput.isValid()) {
551
- i.textContent = R(e), this.currentInput.focus();
563
+ i.textContent = M(e), this.currentInput.focus();
552
564
  return;
553
565
  }
554
566
  if (this.handleAnswerChange(e, this.currentInput.getValue(), { immediate: !0 }), this.stepIndex === this.visibleQuestions.length - 1) {
@@ -682,7 +694,7 @@ class j {
682
694
  return i === -1 ? !1 : (i === this.stepIndex || (this.flushPendingSave(), this.stepIndex = i, this.renderStep()), !0);
683
695
  }
684
696
  }
685
- function R(t) {
697
+ function M(t) {
686
698
  switch (t.type) {
687
699
  case "text":
688
700
  return t.minLength ? `Please enter at least ${t.minLength} characters.` : "This field is required.";
@@ -696,10 +708,10 @@ function R(t) {
696
708
  return "Please choose a value.";
697
709
  }
698
710
  }
699
- function E(t) {
711
+ function k(t) {
700
712
  return document.querySelector(t)?.textContent?.trim() ?? "";
701
713
  }
702
- function M() {
714
+ function K() {
703
715
  const t = document.querySelector(
704
716
  'script[type="application/json"][data-quests-config]'
705
717
  );
@@ -708,7 +720,7 @@ function M() {
708
720
  if (!e) return null;
709
721
  try {
710
722
  const i = JSON.parse(e);
711
- return i.cssSelector && !i.css && (i.css = E(i.cssSelector), delete i.cssSelector), i;
723
+ return i.cssSelector && !i.css && (i.css = k(i.cssSelector), delete i.cssSelector), i;
712
724
  } catch {
713
725
  return null;
714
726
  }
@@ -716,7 +728,7 @@ function M() {
716
728
  function $(t) {
717
729
  const e = t.getAttribute("data-endpoint");
718
730
  if (!e) return null;
719
- const i = t.getAttribute("data-config-url"), a = t.getAttribute("data-api-key"), n = t.getAttribute("data-container"), s = t.getAttribute("data-zindex"), r = t.getAttribute("data-positive-color"), p = t.getAttribute("data-negative-color"), h = t.getAttribute("data-marker-color"), f = t.getAttribute("data-modal-width"), m = t.getAttribute("data-backdrop-opacity"), o = t.getAttribute("data-font-family"), c = t.getAttribute("data-font-size"), u = t.getAttribute("data-css-selector"), g = t.getAttribute("data-auto-advance"), l = t.getAttribute("data-save-debounce-ms");
731
+ const i = t.getAttribute("data-config-url"), a = t.getAttribute("data-api-key"), n = t.getAttribute("data-container"), s = t.getAttribute("data-zindex"), r = t.getAttribute("data-positive-color"), h = t.getAttribute("data-negative-color"), p = t.getAttribute("data-marker-color"), f = t.getAttribute("data-modal-width"), g = t.getAttribute("data-backdrop-opacity"), o = t.getAttribute("data-font-family"), c = t.getAttribute("data-font-size"), l = t.getAttribute("data-css-selector"), m = t.getAttribute("data-auto-advance"), q = t.getAttribute("data-save-debounce-ms");
720
732
  return {
721
733
  endpoint: e,
722
734
  configUrl: i ?? void 0,
@@ -725,28 +737,28 @@ function $(t) {
725
737
  zIndex: s ? parseInt(s, 10) : void 0,
726
738
  colors: {
727
739
  positive: r ?? void 0,
728
- negative: p ?? void 0,
729
- marker: h ?? void 0
740
+ negative: h ?? void 0,
741
+ marker: p ?? void 0
730
742
  },
731
743
  modalWidth: f ? parseInt(f, 10) : void 0,
732
- backdropOpacity: m ? parseFloat(m) : void 0,
744
+ backdropOpacity: g ? parseFloat(g) : void 0,
733
745
  fontFamily: o ?? void 0,
734
746
  fontSize: c ? parseInt(c, 10) : void 0,
735
- css: u ? E(u) : void 0,
736
- autoAdvance: g === "true" ? !0 : void 0,
737
- saveDebounceMs: l ? parseInt(l, 10) : void 0
747
+ css: l ? k(l) : void 0,
748
+ autoAdvance: m === "true" ? !0 : void 0,
749
+ saveDebounceMs: q ? parseInt(q, 10) : void 0
738
750
  };
739
751
  }
740
752
  if (typeof document < "u") {
741
753
  const t = () => {
742
- const e = document.currentScript, i = M(), a = e ? $(e) : null, n = i ?? a;
743
- n?.endpoint && (n.configUrl || n.questionnaire) && new j(n);
754
+ const e = document.currentScript, i = K(), a = e ? $(e) : null, n = i ?? a;
755
+ n?.endpoint && (n.configUrl || n.questionnaire) && new R(n);
744
756
  };
745
757
  document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", t) : t();
746
758
  }
747
759
  export {
748
- j as QaidQuests,
749
- v as evaluateRule,
760
+ R as QaidQuests,
761
+ y as evaluateRule,
750
762
  F as getVisibleQuestions
751
763
  };
752
764
  //# sourceMappingURL=qaid-quests.js.map