react-feedback-surveys 1.7.0 → 1.8.0

package/README.md

@@ -9,28 +9,34 @@
 
 > Lightweight, customizable survey widgets to collect user feedback in React apps.
 
+## Introduction
+
+react-feedback-surveys is a standalone, open-source (MIT) UI library — no backend, no hosting, no
+account required. Render the components, wire `onScoreSubmit`/`onFeedbackSubmit` to your own backend
+(or nowhere at all).
+
+Want AI-generated insights, a hosted dashboard, and response storage without building your own backend?
+Check out [feedback.tools](https://feedback.tools) — built by the same team.
+
 ## Table of Contents
 
+- [Introduction](#introduction)
 - [Features](#features)
 - [Survey Types](#survey-types)
 - [Installation](#installation)
     * [1. Install](#1-install)
     * [2. Styles](#2-styles)
-- [Survey Components](#survey-components)
-    * [CSAT5 (Customer Satisfaction Score, 5-Point Scale)](#csat5-customer-satisfaction-score-5-point-scale)
-    * [CSAT2 (Customer Satisfaction Score, 2-Point Scale)](#csat2-customer-satisfaction-score-2-point-scale)
-    * [NPS10 (Net Promoter Score, 0–10 Scale)](#nps10-net-promoter-score-010-scale)
-    * [CES7 (Customer Effort Score, 7-Point Scale)](#ces7-customer-effort-score-7-point-scale)
+- [Survey Component](#survey-component)
+    * [CSAT (Customer Satisfaction Score)](#csat-customer-satisfaction-score)
+    * [NPS (Net Promoter Score)](#nps-net-promoter-score)
+    * [CES (Customer Effort Score)](#ces-customer-effort-score)
 - [Layout Components](#layout-components)
     * [Popup](#popup)
     * [Surface](#surface)
 - [Props](#props)
     * [Shared Props](#shared-props)
+    * [Format Props](#format-props)
     * [Scale Style Options](#scale-style-options)
-        + [CSAT2Survey](#csat2survey)
-        + [CSAT5Survey](#csat5survey)
-        + [CES7Survey](#ces7survey)
-        + [NPS10Survey](#nps10survey)
 - [Styling](#styling)
     * [CSS Variables](#css-variables)
     * [Custom Classes](#custom-classes)
@@ -47,7 +53,8 @@
 
 ## Features
 
-- **Ready-to-use survey widgets** – CSAT (2 or 5 points), CES (7 points), NPS (0–10)
+- **A single `Survey` component** – the format (methodology, scale length, visual style) is configuration, not a different import
+- **Ready-to-use survey formats** – CSAT (2 or 5 points), CES (7 points), NPS (0–10)
 - **Multiple scale styles** – emoji, stars, numbers, thumbs
 - **Flexible placement** – embed inline or display as popup overlay
 - **Follow-up feedback** – optional text input or multiple choice responses
@@ -58,9 +65,11 @@
 
 ## Survey Types
 
-- **CSAT (Customer Satisfaction Score):** 2-point (`csat2`) or 5-point (`csat5`) scales
-- **NPS (Net Promoter Score):** 0–10 numeric scale (`nps10`)
-- **CES (Customer Effort Score):** 7-point numeric scale (`ces7`)
+`Survey` covers three feedback methodologies, selected with the `type` prop. `CSAT` is the only one with a variable scale length, set via `points`:
+
+- **CSAT (Customer Satisfaction Score):** `type="csat"`, 2-point or 5-point scale (`points={2}` or `points={5}`)
+- **NPS (Net Promoter Score):** `type="nps"`, fixed 0–10 scale
+- **CES (Customer Effort Score):** `type="ces"`, fixed 7-point scale
 
 ## Installation
 
@@ -78,24 +87,28 @@ yarn add react-feedback-surveys
 import 'react-feedback-surveys/index.css';
 ```
 
-## Survey Components
+## Survey Component
+
+Every format is reached through the same `Survey` import — `type` and `points` pick the methodology and scale length, `scaleStyle` picks the visual style. See [Format Props](#format-props) for the full matrix of valid `type`/`points`/`scaleStyle` combinations.
 
-### CSAT5 (Customer Satisfaction Score, 5-Point Scale)
+### CSAT (Customer Satisfaction Score)
 
-Surveys to ask users about their overall satisfaction.
+Surveys to ask users about their overall satisfaction, or about a specific feature or flow.
 
 **Example questions:**
 - "How satisfied are you with our product?"
-- "How would you rate your overall experience?"
-- "How satisfied are you with our customer support?"
+- "Was this search helpful?"
+- "Are you satisfied with the checkout process?"
 
-<img alt="CSAT5" src="docs/assets/csat5.png" width="416" />
+<img alt="CSAT, 5-point scale" src="docs/assets/csat5.png" width="416" />
 
 ```tsx
-import { CSAT5Survey } from 'react-feedback-surveys';
+import { Survey } from 'react-feedback-surveys';
 import 'react-feedback-surveys/index.css';
 
-<CSAT5Survey
+<Survey
+  type="csat"
+  points={5}
   scaleStyle="emoji"
   question="How would you rate your satisfaction with our product?"
   minLabel="Very unsatisfied"
@@ -110,24 +123,12 @@ import 'react-feedback-surveys/index.css';
 />
 ```
 
-`scaleStyle`: `emoji` | `numbers` | `stars`.
-
-### CSAT2 (Customer Satisfaction Score, 2-Point Scale)
-
-Surveys to ask users about specific features or flows.
-
-**Example questions:**
-- "Was this search helpful?"
-- "Did you find what you were looking for?"
-- "Are you satisfied with the checkout process?"
-
-<img alt="CSAT2" src="docs/assets/csat2.png" width="386" />
+<img alt="CSAT, 2-point scale" src="docs/assets/csat2.png" width="386" />
 
 ```tsx
-import { CSAT2Survey } from 'react-feedback-surveys';
-import 'react-feedback-surveys/index.css';
-
-<CSAT2Survey
+<Survey
+  type="csat"
+  points={2}
   scaleStyle="thumbs"
   question="Are you satisfied with the result?"
   responseType="text"
@@ -140,26 +141,27 @@ import 'react-feedback-surveys/index.css';
 />
 ```
 
-`scaleStyle`: `emoji` | `thumbs`.
+`points={5}` → `scaleStyle`: `emoji` | `numbers` | `stars`. `points={2}` → `scaleStyle`: `emoji` | `thumbs`.
 
-### NPS10 (Net Promoter Score, 0–10 Scale)
+### NPS (Net Promoter Score)
 
-Surveys to ask users if they'd recommend your product.
+Surveys to ask users if they'd recommend your product. Fixed 0–10 scale — no `points` prop needed.
 
 **Example questions:**
 - "How likely are you to recommend us to a friend or colleague?"
 - "On a scale of 0-10, would you recommend our service?"
 - "How likely are you to recommend this product to others?"
 
-<img alt="NPS10" src="docs/assets/nps10.png" width="616" />
+<img alt="NPS" src="docs/assets/nps10.png" width="616" />
 
-<img alt="NPS10 mobile" src="docs/assets/nps10-mobile.png" width="340" />
+<img alt="NPS mobile" src="docs/assets/nps10-mobile.png" width="340" />
 
 ```tsx
-import { NPS10Survey } from 'react-feedback-surveys';
+import { Survey } from 'react-feedback-surveys';
 import 'react-feedback-surveys/index.css';
 
-<NPS10Survey
+<Survey
+  type="nps"
   scaleStyle="numbers"
   question="How likely are you to recommend our product/service to a friend or colleague?"
   minLabel="Very unlikely"
@@ -176,22 +178,23 @@ import 'react-feedback-surveys/index.css';
 
 `scaleStyle`: `numbers`.
 
-### CES7 (Customer Effort Score, 7-Point Scale)
+### CES (Customer Effort Score)
 
-Surveys to ask users how easy it is to use your product.
+Surveys to ask users how easy it is to use your product. Fixed 7-point scale — no `points` prop needed.
 
 **Example questions:**
 - "How easy was it to complete your task?"
 - "How much effort did it take to resolve your issue?"
 - "How easy was it to sign up for an account?"
 
-<img alt="CES7" src="docs/assets/ces7.png" width="436" />
+<img alt="CES" src="docs/assets/ces7.png" width="436" />
 
 ```tsx
-import { CES7Survey } from 'react-feedback-surveys';
+import { Survey } from 'react-feedback-surveys';
 import 'react-feedback-surveys/index.css';
 
-<CES7Survey
+<Survey
+  type="ces"
   scaleStyle="numbers"
   question="How easy was it to complete your task?"
   minLabel="Very difficult"
@@ -219,7 +222,7 @@ The `<Popup>` component wraps survey widgets in a fixed overlay that slides in f
 #### Usage
 
 ```tsx
-import { Popup, CSAT5Survey } from 'react-feedback-surveys';
+import { Popup, Survey } from 'react-feedback-surveys';
 import 'react-feedback-surveys/index.css';
 
 <Popup
@@ -232,7 +235,9 @@ import 'react-feedback-surveys/index.css';
   placement="bottomRight"
   onClose={() => console.log('Closed')}
 >
-  <CSAT5Survey
+  <Survey
+    type="csat"
+    points={5}
     scaleStyle="stars"
     question="How would you rate your satisfaction?"
     onScoreSubmit={({ value }) => {/* ... */}}
@@ -251,7 +256,7 @@ import 'react-feedback-surveys/index.css';
 | `children`   | `React.ReactNode`                                          | -        | -               | Content to render inside the popup (typically a survey component). |
 | `onClose`    | `() => void`                                               | -        | -               | Callback fired when the close button is clicked.                   |
 
-For more examples, check out the Storybook stories (e.g., `CSAT5Survey.stories.tsx`, `CSAT2Survey.stories.tsx`).
+For more examples, check out the Storybook stories under `widgets/Survey` (grouped by CSAT/NPS/CES in the sidebar).
 
 ### Surface
 
@@ -265,11 +270,13 @@ The Surface component provides:
 #### Usage
 
 ```tsx
-import { Surface, CSAT5Survey } from 'react-feedback-surveys';
+import { Surface, Survey } from 'react-feedback-surveys';
 import 'react-feedback-surveys/index.css';
 
 <Surface className="custom-surface">
-  <CSAT5Survey
+  <Survey
+    type="csat"
+    points={5}
     scaleStyle="stars"
     question="How would you rate your satisfaction?"
     onScoreSubmit={({ value }) => {/* ... */}}
@@ -288,7 +295,7 @@ The Surface component uses the `--ft-surface-padding`, `--ft-surface-padding-mob
 
 ## Props
 
-Most props are shared across all survey widgets. Each widget differs only in its `scaleStyle` values.
+Most props are shared across every survey format. `type` (and `points`, for CSAT) select the format; `scaleStyle` picks its visual style — see [Format Props](#format-props).
 
 ### Shared Props
 
@@ -399,7 +406,9 @@ When `collectContact` is `true` and no `userId` is provided, an optional email c
 - `email: string` — the email address entered by the respondent.
 
 ```tsx
-<CSAT5Survey
+<Survey
+  type="csat"
+  points={5}
   scaleStyle="numbers"
   question="How would you rate your satisfaction with our product?"
   responseType="text"
@@ -416,35 +425,25 @@ When `collectContact` is `true` and no `userId` is provided, an optional email c
 />
 ```
 
-### Scale Style Options
-
-Each survey type supports specific scale styles for displaying the rating interface:
+### Format Props
 
-#### CSAT2Survey
+| Prop | Type | Required | Description |
+|------|------|----------|--------------|
+| `type` | `'csat'` \| `'nps'` \| `'ces'` | required | Survey methodology. Determines the scale range and which `scaleStyle`/`points` combinations are valid. |
+| `points` | `2` \| `5` | required for `type="csat"`; not used otherwise | Number of points on the scale. `nps` is a fixed 0–10 scale and `ces` a fixed 1–7 scale, so neither takes `points`. |
 
-| Prop                     | Type                    | Required | Description                                                                       |
-|--------------------------|-------------------------|----------|-----------------------------------------------------------------------------------|
-| `scaleStyle` | `'emoji'` \| `'thumbs'` | required | Emoji mood scale style (happy/sad faces) or thumbs up/down emoji scale style. |
-
-#### CSAT5Survey
-
-| Prop                     | Type                                  | Required | Description                                                                                                          |
-|--------------------------|---------------------------------------|----------|----------------------------------------------------------------------------------------------------------------------|
-| `scaleStyle` | `'emoji'` \| `'numbers'` \| `'stars'` | required | Emoji scale style (5 emotion levels), numeric scale style (1–5), or star rating scale style (1–5 stars). |
-
-#### CES7Survey
-
-| Prop                     | Type        | Required | Description                        |
-|--------------------------|-------------|----------|------------------------------------|
-| `scaleStyle` | `'numbers'` | required | Numeric scale style (1–7). |
+### Scale Style Options
 
-#### NPS10Survey
+Valid `scaleStyle` values depend on `type` (and `points`, for CSAT):
 
-| Prop                     | Type        | Required | Description                         |
-|--------------------------|-------------|----------|-------------------------------------|
-| `scaleStyle` | `'numbers'` | required | Numeric scale style (0–10). |
+| `type` | `points` | Scale range | Valid `scaleStyle` |
+|--------|----------|-------------|---------------------|
+| `csat` | `5` | 1–5 | `'emoji'` (5 emotion levels) \| `'numbers'` \| `'stars'` (1–5 stars) |
+| `csat` | `2` | 0–1 | `'emoji'` (happy/sad faces) \| `'thumbs'` (thumbs up/down) |
+| `ces`  | — | 1–7 | `'numbers'` |
+| `nps`  | — | 0–10 | `'numbers'` |
 
-Note: The numeric ranges are defined by the widget (e.g., CSAT5 uses a 1–5 scale, NPS10 uses 0–10).
+Invalid combinations (e.g. `type="ces"` with `scaleStyle="stars"`) are rejected at the type level.
 
 ## Styling
 
@@ -549,7 +548,7 @@ Here's an example of dark theme colors that work well with the survey components
 **Implementation example with React:**
 
 ```tsx
-import { CSAT5Survey } from 'react-feedback-surveys';
+import { Survey } from 'react-feedback-surveys';
 import 'react-feedback-surveys/index.css';
 import { useEffect } from 'react';
 
@@ -573,7 +572,9 @@ function App() {
   }, []);
 
   return (
-    <CSAT5Survey
+    <Survey
+      type="csat"
+      points={5}
       scaleStyle="emoji"
       question="How satisfied are you with our product?"
       onScoreSubmit={({ value }) => console.log('Score:', value)}
@@ -608,7 +609,7 @@ For deeper customization strategies, see the section below.
 
 ### Custom Classes
 
-All widgets accept a `classNames` prop with two optional groups: `base` (outer shell) and `scale` (the interactive
+`Survey` accepts a `classNames` prop with two optional groups: `base` (outer shell) and `scale` (the interactive
 rating UI). Pass your own class names to override styles without relying on internal selectors.
 
 When is this useful?
@@ -637,13 +638,13 @@ Reference: available keys
 | `scale.score`   | Number inside a scale button (for numeric variants)          |
 | `scale.labels`  | Left/Right labels displayed under the scale                  |
 
-Example: customizing a CSAT5Survey widget
+Example: customizing a `Survey` widget
 
 ```tsx
-import { CSAT5Survey } from 'react-feedback-surveys';
+import { Survey } from 'react-feedback-surveys';
 import 'react-feedback-surveys/index.css';
 
-<CSAT5Survey
+<Survey
   classNames={{
     base: {
       base: 'my-survey-base',
@@ -659,6 +660,8 @@ import 'react-feedback-surveys/index.css';
       labels: 'my-scale-labels',
     }
   }}
+  type="csat"
+  points={5}
   scaleStyle="numbers"
   question="How would you rate your satisfaction with our product?"
   minLabel="Very unsatisfied"

package/dist/index.css

@@ -1,2 +1,2 @@
-:root,:host{--_color-text:var(--ft-color-text,30 8% 14%);--_color-bg:var(--ft-color-bg,0 0% 100%);--_color-muted:var(--ft-color-muted,222 11% 46%);--_color-error:var(--ft-color-error,32 95% 44%);--_color-border:var(--ft-color-border,214 14% 83%);--_color-outline:var(--ft-color-outline,218 14% 65%);--_color-shadow:var(--ft-color-shadow,0 0% 0%);--_color-control:var(--ft-color-control,214 20% 96%);--_popup-z-index:var(--ft-popup-z-index,49);--_popup-head-offset:var(--ft-popup-head-offset,0);--_surface-padding:var(--ft-surface-padding,24px);--_surface-padding-mobile:var(--ft-surface-padding-mobile,20px);--_surface-radius:var(--ft-surface-radius,8px)}._base_d5qlz_1{padding:var(--_surface-padding);background-color:hsl(var(--_color-bg)/100%);border-radius:var(--_surface-radius);box-shadow:0 0 10px hsl(var(--_color-shadow)/20%);display:block;position:relative;overflow:auto}@media (width<=399px){._base_d5qlz_1{padding:var(--_surface-padding-mobile)}}._base_1vr2h_1{--_popup-head-offset:32px;z-index:var(--_popup-z-index);box-sizing:border-box;max-width:calc(100vw - var(--_surface-padding) * 2);max-height:calc(100vh - var(--_surface-padding) * 2);transform-origin:50% 100%;margin:0;display:flex;position:fixed}@media (width<=399px){._base_1vr2h_1{max-width:calc(100vw - var(--_surface-padding-mobile) * 2);max-height:calc(100vh - var(--_surface-padding-mobile) * 2)}}._animated_1vr2h_19{opacity:0;animation:.12s ease-in-out forwards _fadeForward_1vr2h_1}@keyframes _fadeForward_1vr2h_1{0%{opacity:0;transform:translateY(8px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}._topLeft_1vr2h_34{top:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._topLeft_1vr2h_34{top:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._topRight_1vr2h_45{top:var(--_surface-padding);right:var(--_surface-padding)}@media (width<=399px){._topRight_1vr2h_45{top:var(--_surface-padding-mobile);right:var(--_surface-padding-mobile)}}._bottomRight_1vr2h_56{right:var(--_surface-padding);bottom:var(--_surface-padding)}@media (width<=399px){._bottomRight_1vr2h_56{right:var(--_surface-padding-mobile);bottom:var(--_surface-padding-mobile)}}._bottomLeft_1vr2h_67{bottom:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._bottomLeft_1vr2h_67{bottom:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._close_1vr2h_78{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._close_1vr2h_78:disabled{cursor:default}._close_1vr2h_78{top:var(--_surface-padding);width:24px;height:24px;color:hsl(var(--_color-outline)/100%);transition:color .15s;position:absolute;inset-inline-end:var(--_surface-padding)}._close_1vr2h_78:hover{color:hsl(var(--_color-text)/100%)}._close_1vr2h_78:before,._close_1vr2h_78:after{content:"";background-color:currentColor;border-radius:1px;position:absolute;top:50%;left:50%;transform:rotate(45deg)}._close_1vr2h_78:before{width:16px;height:2px;margin:-1px 0 0 -8px}._close_1vr2h_78:after{width:2px;height:16px;margin:-8px 0 0 -1px}@media (width<=399px){._close_1vr2h_78{top:var(--_surface-padding-mobile);inset-inline-end:var(--_surface-padding-mobile)}}._sr_clg7k_1{white-space:nowrap;clip-path:inset(50%);border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._subtext_clg7k_13{margin:0 0 16px;line-height:1.25}._input_clg7k_18{box-sizing:border-box;width:100%;color:hsl(var(--_color-text)/100%);background-color:hsl(var(--_color-bg)/100%);border:1px solid hsl(var(--_color-border)/100%);border-radius:var(--_surface-radius);outline:0 solid hsl(var(--_color-outline)/14%);padding:4px 12px;font-family:inherit;font-size:16px;line-height:1.5;transition:background-color .15s,border-color .15s,outline-width .2s}._input_clg7k_18:focus{outline:4px solid hsl(var(--_color-outline)/14%)}._input_clg7k_18._invalid_clg7k_35{border-color:hsl(var(--_color-error)/100%)}._input_clg7k_18._invalid_clg7k_35:focus{outline-color:hsl(var(--_color-error)/14%)}._submit_clg7k_42{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._submit_clg7k_42:disabled{cursor:default}._submit_clg7k_42{text-align:center;color:hsl(var(--_color-bg)/100%);background-color:hsl(var(--_color-text)/100%);border-radius:var(--_surface-radius);padding:8px 32px;font-size:16px;font-weight:400;transition:opacity .2s}._submit_clg7k_42:hover{opacity:.85}._submit_clg7k_42{width:100%;margin-top:16px}._skip_clg7k_74{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._skip_clg7k_74:disabled{cursor:default}._skip_clg7k_74{text-align:center;width:100%;color:hsl(var(--_color-muted)/100%);cursor:pointer;margin-top:8px;padding:4px;font-size:16px;font-weight:500;line-height:1.5;display:block}._skip_clg7k_74:hover{color:hsl(var(--_color-text)/100%)}._choices_nhux3_1{margin:0 0 12px}._choice_nhux3_1{display:flex}._choice_nhux3_1+._choice_nhux3_1{margin-top:12px}._label_nhux3_12{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;gap:8px;display:inline-flex;position:relative}._sr_nhux3_21{white-space:nowrap;clip-path:inset(50%);border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._checkbox_nhux3_33{white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}._check_nhux3_33{border:1px solid hsl(var(--_color-border)/100%);border-radius:4px;min-width:20px;height:20px}._label_nhux3_12:hover ._check_nhux3_33{border-color:hsl(var(--_color-text)/100%)}._checkbox_nhux3_33:focus-visible+._check_nhux3_33{outline:4px solid hsl(var(--_color-outline)/14%)}._checkbox_nhux3_33:checked+._check_nhux3_33{background-color:hsl(var(--_color-text)/100%);border-color:hsl(var(--_color-text)/100%);position:relative}._checkbox_nhux3_33:checked+._check_nhux3_33:after{content:"";border:2px solid;border-color:transparent transparent hsl(var(--_color-bg)/100%) hsl(var(--_color-bg)/100%);pointer-events:none;width:10px;height:4px;position:absolute;top:50%;left:50%;transform:translate(-45%,-75%)rotate(-45deg)}._input_nhux3_74{margin-top:8px;padding:4px 12px}._textarea_nhux3_79{height:120px;padding:8px 12px}._input_nhux3_74,._textarea_nhux3_79{box-sizing:border-box;width:100%;color:hsl(var(--_color-text)/100%);background-color:hsl(var(--_color-bg)/100%);border:1px solid hsl(var(--_color-border)/100%);border-radius:var(--_surface-radius);outline:0 solid hsl(var(--_color-outline)/14%);resize:none;font-family:inherit;font-size:16px;line-height:1.5;transition:background-color .15s,border-color .15s,outline-width .2s}._input_nhux3_74:focus,._textarea_nhux3_79:focus{outline:4px solid hsl(var(--_color-outline)/14%)}._submit_nhux3_104{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._submit_nhux3_104:disabled{cursor:default}._submit_nhux3_104{text-align:center;color:hsl(var(--_color-bg)/100%);background-color:hsl(var(--_color-text)/100%);border-radius:var(--_surface-radius);padding:8px 32px;font-size:16px;font-weight:400;transition:opacity .2s}._submit_nhux3_104:hover{opacity:.85}._submit_nhux3_104{width:100%;margin-top:16px}._skip_nhux3_136{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._skip_nhux3_136:disabled{cursor:default}._skip_nhux3_136{text-align:center;width:100%;color:hsl(var(--_color-muted)/100%);cursor:pointer;margin-top:8px;padding:4px;font-size:16px;font-weight:500;line-height:1.5;display:block}._skip_nhux3_136:hover{color:hsl(var(--_color-text)/100%)}._success_nhux3_166{text-align:center;padding:16px 0 32px;font-size:16px;font-weight:600;line-height:1.5}._base_1ilpx_1{text-align:center;padding:0 24px}._icon_1ilpx_6{display:inline-block}._base_1xpqq_1{color:hsl(var(--_color-text)/100%);padding:0;font-family:Helvetica Neue,Arial Nova,Helvetica,Arial,sans-serif}._head_1xpqq_7{padding-block:0 20px;padding-inline:0 var(--_popup-head-offset);gap:8px;display:flex}._title_1xpqq_14{flex:1 0;font-family:inherit;font-size:16px;font-style:normal;font-weight:500;line-height:1.4}._base_nswpf_1{margin:12px 0 0;display:flex}._label_nswpf_6{box-sizing:border-box;max-width:50%;color:hsl(var(--_color-muted)/100%);flex:0 0 50%;font-size:14px;line-height:1.4286}._between_nswpf_15{justify-content:space-between}._between_nswpf_15 ._label_nswpf_6{flex:0 0 50%;max-width:50%}._between_nswpf_15 ._label_nswpf_6:first-child{text-align:start}._between_nswpf_15 ._label_nswpf_6:last-child{text-align:end}._center_nswpf_29 ._label_nswpf_6{flex:0 0 50%;max-width:50%}._center_nswpf_29 ._label_nswpf_6:first-child{text-align:end;padding-right:8px}._center_nswpf_29 ._label_nswpf_6:last-child{text-align:start;padding-left:8px}._center_nswpf_29 ._text_nswpf_41{text-align:center;min-width:56px;display:inline-block}@media (width<=599px){._center_nswpf_29 ._text_nswpf_41{min-width:48px}}._list_grany_1{justify-content:center;gap:16px;display:flex}._icon_grany_7{transition:transform .12s;transform:scale(1)}._button_grany_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_grany_12:disabled{cursor:default}._button_grany_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_grany_12:hover ._icon_grany_7{transform:scale(1.15)}._button_grany_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_grany_12{width:48px;height:48px}}._list_1yzyr_1{justify-content:center;gap:16px;display:flex}._icon_1yzyr_7{transition:transform .12s;transform:scale(1)}._button_1yzyr_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1yzyr_12:disabled{cursor:default}._button_1yzyr_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1yzyr_12:hover ._icon_1yzyr_7{transform:scale(1.15)}._button_1yzyr_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._base_1nccq_1{max-width:100%}._rating_1nccq_5,._feedback_1nccq_6,._contact_1nccq_7,._success_1nccq_8{width:280px}@media (width<=399px){._rating_1nccq_5,._feedback_1nccq_6,._contact_1nccq_7,._success_1nccq_8{width:100%}}._list_1vfe4_1{justify-content:space-between;display:flex}._icon_1vfe4_6{transition:transform .12s;transform:scale(1)}._button_1vfe4_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1vfe4_11:disabled{cursor:default}._button_1vfe4_11{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1vfe4_11:hover ._icon_1vfe4_6{transform:scale(1.15)}._button_1vfe4_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_1vfe4_11{width:48px;height:48px}}._list_16sag_1{justify-content:space-between;display:flex}._button_16sag_6{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_16sag_6:disabled{cursor:default}._button_16sag_6{width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:flex}._button_16sag_6:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}._button_16sag_6:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._list_1kpxu_1{justify-content:space-between;display:flex}._icon_1kpxu_6{transition:transform .12s;transform:scale(1)}._button_1kpxu_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1kpxu_11:disabled{cursor:default}._button_1kpxu_11{justify-content:center;align-items:center;width:40px;height:40px;display:flex}._button_1kpxu_11:hover ._icon_1kpxu_6{transform:scale(1.1)}._button_1kpxu_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._base_sfbnw_1{max-width:100%}._rating_sfbnw_5,._feedback_sfbnw_6,._contact_sfbnw_7,._success_sfbnw_8{width:320px}@media (width<=399px){._rating_sfbnw_5,._feedback_sfbnw_6,._contact_sfbnw_7,._success_sfbnw_8{width:100%}}._list_whbas_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_whbas_1{flex-direction:column-reverse;gap:4px}}._button_whbas_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_whbas_13:disabled{cursor:default}._button_whbas_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:inline-block}._button_whbas_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_whbas_13:hover{box-shadow:none}}._button_whbas_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_whbas_13 ._score_whbas_52{display:inline}._button_whbas_13 ._label_whbas_55{display:none}@media (width<=599px){._button_whbas_13 ._label_whbas_55{display:inline}._button_whbas_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_whbas_75{display:none}}._base_tj93m_1{max-width:100%}._rating_tj93m_5{width:340px}@media (width<=599px){._rating_tj93m_5{width:280px}}@media (width<=399px){._rating_tj93m_5{width:100%}}._feedback_tj93m_19,._contact_tj93m_20,._success_tj93m_21{width:280px}@media (width<=599px){._feedback_tj93m_19,._contact_tj93m_20,._success_tj93m_21{width:100%}}._list_divjm_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_divjm_1{flex-direction:column-reverse;gap:4px}}._button_divjm_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_divjm_13:disabled{cursor:default}._button_divjm_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:block}._button_divjm_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_divjm_13:hover{box-shadow:none}}._button_divjm_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_divjm_13 ._score_divjm_52{display:inline}._button_divjm_13 ._label_divjm_55{display:none}@media (width<=599px){._button_divjm_13 ._label_divjm_55{display:inline}._button_divjm_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_divjm_75{display:none}}._base_kj5ew_1{max-width:100%}._rating_kj5ew_5{width:520px}@media (width<=599px){._rating_kj5ew_5{width:320px}}@media (width<=399px){._rating_kj5ew_5{width:100%}}._feedback_kj5ew_19,._contact_kj5ew_20,._success_kj5ew_21{width:280px}@media (width<=599px){._feedback_kj5ew_19,._contact_kj5ew_20,._success_kj5ew_21{width:100%}}
+:root,:host{--_color-text:var(--ft-color-text,30 8% 14%);--_color-bg:var(--ft-color-bg,0 0% 100%);--_color-muted:var(--ft-color-muted,222 11% 46%);--_color-error:var(--ft-color-error,32 95% 44%);--_color-border:var(--ft-color-border,214 14% 83%);--_color-outline:var(--ft-color-outline,218 14% 65%);--_color-shadow:var(--ft-color-shadow,0 0% 0%);--_color-control:var(--ft-color-control,214 20% 96%);--_popup-z-index:var(--ft-popup-z-index,49);--_popup-head-offset:var(--ft-popup-head-offset,0);--_surface-padding:var(--ft-surface-padding,24px);--_surface-padding-mobile:var(--ft-surface-padding-mobile,20px);--_surface-radius:var(--ft-surface-radius,8px);--_font-family:var(--ft-font-family,system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);font-family:var(--_font-family)}input,textarea,select{font:inherit}._base_d5qlz_1{padding:var(--_surface-padding);background-color:hsl(var(--_color-bg)/100%);border-radius:var(--_surface-radius);box-shadow:0 0 10px hsl(var(--_color-shadow)/20%);display:block;position:relative;overflow:auto}@media (width<=399px){._base_d5qlz_1{padding:var(--_surface-padding-mobile)}}._base_1vr2h_1{--_popup-head-offset:32px;z-index:var(--_popup-z-index);box-sizing:border-box;max-width:calc(100vw - var(--_surface-padding) * 2);max-height:calc(100vh - var(--_surface-padding) * 2);transform-origin:50% 100%;margin:0;display:flex;position:fixed}@media (width<=399px){._base_1vr2h_1{max-width:calc(100vw - var(--_surface-padding-mobile) * 2);max-height:calc(100vh - var(--_surface-padding-mobile) * 2)}}._animated_1vr2h_19{opacity:0;animation:.12s ease-in-out forwards _fadeForward_1vr2h_1}@keyframes _fadeForward_1vr2h_1{0%{opacity:0;transform:translateY(8px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}._topLeft_1vr2h_34{top:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._topLeft_1vr2h_34{top:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._topRight_1vr2h_45{top:var(--_surface-padding);right:var(--_surface-padding)}@media (width<=399px){._topRight_1vr2h_45{top:var(--_surface-padding-mobile);right:var(--_surface-padding-mobile)}}._bottomRight_1vr2h_56{right:var(--_surface-padding);bottom:var(--_surface-padding)}@media (width<=399px){._bottomRight_1vr2h_56{right:var(--_surface-padding-mobile);bottom:var(--_surface-padding-mobile)}}._bottomLeft_1vr2h_67{bottom:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._bottomLeft_1vr2h_67{bottom:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._close_1vr2h_78{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._close_1vr2h_78:disabled{cursor:default}._close_1vr2h_78{top:var(--_surface-padding);width:24px;height:24px;color:hsl(var(--_color-outline)/100%);transition:color .15s;position:absolute;inset-inline-end:var(--_surface-padding)}._close_1vr2h_78:hover{color:hsl(var(--_color-text)/100%)}._close_1vr2h_78:before,._close_1vr2h_78:after{content:"";background-color:currentColor;border-radius:1px;position:absolute;top:50%;left:50%;transform:rotate(45deg)}._close_1vr2h_78:before{width:16px;height:2px;margin:-1px 0 0 -8px}._close_1vr2h_78:after{width:2px;height:16px;margin:-8px 0 0 -1px}@media (width<=399px){._close_1vr2h_78{top:var(--_surface-padding-mobile);inset-inline-end:var(--_surface-padding-mobile)}}._sr_clg7k_1{white-space:nowrap;clip-path:inset(50%);border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._subtext_clg7k_13{margin:0 0 16px;line-height:1.25}._input_clg7k_18{box-sizing:border-box;width:100%;color:hsl(var(--_color-text)/100%);background-color:hsl(var(--_color-bg)/100%);border:1px solid hsl(var(--_color-border)/100%);border-radius:var(--_surface-radius);outline:0 solid hsl(var(--_color-outline)/14%);padding:4px 12px;font-family:inherit;font-size:16px;line-height:1.5;transition:background-color .15s,border-color .15s,outline-width .2s}._input_clg7k_18:focus{outline:4px solid hsl(var(--_color-outline)/14%)}._input_clg7k_18._invalid_clg7k_35{border-color:hsl(var(--_color-error)/100%)}._input_clg7k_18._invalid_clg7k_35:focus{outline-color:hsl(var(--_color-error)/14%)}._submit_clg7k_42{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._submit_clg7k_42:disabled{cursor:default}._submit_clg7k_42{text-align:center;color:hsl(var(--_color-bg)/100%);background-color:hsl(var(--_color-text)/100%);border-radius:var(--_surface-radius);padding:8px 32px;font-size:16px;font-weight:400;transition:opacity .2s}._submit_clg7k_42:hover{opacity:.85}._submit_clg7k_42{width:100%;margin-top:16px}._skip_clg7k_74{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._skip_clg7k_74:disabled{cursor:default}._skip_clg7k_74{text-align:center;width:100%;color:hsl(var(--_color-muted)/100%);cursor:pointer;margin-top:8px;padding:4px;font-size:16px;font-weight:500;line-height:1.5;display:block}._skip_clg7k_74:hover{color:hsl(var(--_color-text)/100%)}._choices_nhux3_1{margin:0 0 12px}._choice_nhux3_1{display:flex}._choice_nhux3_1+._choice_nhux3_1{margin-top:12px}._label_nhux3_12{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;gap:8px;display:inline-flex;position:relative}._sr_nhux3_21{white-space:nowrap;clip-path:inset(50%);border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._checkbox_nhux3_33{white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}._check_nhux3_33{border:1px solid hsl(var(--_color-border)/100%);border-radius:4px;min-width:20px;height:20px}._label_nhux3_12:hover ._check_nhux3_33{border-color:hsl(var(--_color-text)/100%)}._checkbox_nhux3_33:focus-visible+._check_nhux3_33{outline:4px solid hsl(var(--_color-outline)/14%)}._checkbox_nhux3_33:checked+._check_nhux3_33{background-color:hsl(var(--_color-text)/100%);border-color:hsl(var(--_color-text)/100%);position:relative}._checkbox_nhux3_33:checked+._check_nhux3_33:after{content:"";border:2px solid;border-color:transparent transparent hsl(var(--_color-bg)/100%) hsl(var(--_color-bg)/100%);pointer-events:none;width:10px;height:4px;position:absolute;top:50%;left:50%;transform:translate(-45%,-75%)rotate(-45deg)}._input_nhux3_74{margin-top:8px;padding:4px 12px}._textarea_nhux3_79{height:120px;padding:8px 12px}._input_nhux3_74,._textarea_nhux3_79{box-sizing:border-box;width:100%;color:hsl(var(--_color-text)/100%);background-color:hsl(var(--_color-bg)/100%);border:1px solid hsl(var(--_color-border)/100%);border-radius:var(--_surface-radius);outline:0 solid hsl(var(--_color-outline)/14%);resize:none;font-family:inherit;font-size:16px;line-height:1.5;transition:background-color .15s,border-color .15s,outline-width .2s}._input_nhux3_74:focus,._textarea_nhux3_79:focus{outline:4px solid hsl(var(--_color-outline)/14%)}._submit_nhux3_104{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._submit_nhux3_104:disabled{cursor:default}._submit_nhux3_104{text-align:center;color:hsl(var(--_color-bg)/100%);background-color:hsl(var(--_color-text)/100%);border-radius:var(--_surface-radius);padding:8px 32px;font-size:16px;font-weight:400;transition:opacity .2s}._submit_nhux3_104:hover{opacity:.85}._submit_nhux3_104{width:100%;margin-top:16px}._skip_nhux3_136{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._skip_nhux3_136:disabled{cursor:default}._skip_nhux3_136{text-align:center;width:100%;color:hsl(var(--_color-muted)/100%);cursor:pointer;margin-top:8px;padding:4px;font-size:16px;font-weight:500;line-height:1.5;display:block}._skip_nhux3_136:hover{color:hsl(var(--_color-text)/100%)}._success_nhux3_166{text-align:center;padding:16px 0 32px;font-size:16px;font-weight:600;line-height:1.5}._base_1ilpx_1{text-align:center;padding:0 24px}._icon_1ilpx_6{display:inline-block}._base_1xpqq_1{color:hsl(var(--_color-text)/100%);padding:0;font-family:Helvetica Neue,Arial Nova,Helvetica,Arial,sans-serif}._head_1xpqq_7{padding-block:0 20px;padding-inline:0 var(--_popup-head-offset);gap:8px;display:flex}._title_1xpqq_14{flex:1 0;font-family:inherit;font-size:16px;font-style:normal;font-weight:500;line-height:1.4}._base_nswpf_1{margin:12px 0 0;display:flex}._label_nswpf_6{box-sizing:border-box;max-width:50%;color:hsl(var(--_color-muted)/100%);flex:0 0 50%;font-size:14px;line-height:1.4286}._between_nswpf_15{justify-content:space-between}._between_nswpf_15 ._label_nswpf_6{flex:0 0 50%;max-width:50%}._between_nswpf_15 ._label_nswpf_6:first-child{text-align:start}._between_nswpf_15 ._label_nswpf_6:last-child{text-align:end}._center_nswpf_29 ._label_nswpf_6{flex:0 0 50%;max-width:50%}._center_nswpf_29 ._label_nswpf_6:first-child{text-align:end;padding-right:8px}._center_nswpf_29 ._label_nswpf_6:last-child{text-align:start;padding-left:8px}._center_nswpf_29 ._text_nswpf_41{text-align:center;min-width:56px;display:inline-block}@media (width<=599px){._center_nswpf_29 ._text_nswpf_41{min-width:48px}}._list_1vfe4_1{justify-content:space-between;display:flex}._icon_1vfe4_6{transition:transform .12s;transform:scale(1)}._button_1vfe4_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1vfe4_11:disabled{cursor:default}._button_1vfe4_11{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1vfe4_11:hover ._icon_1vfe4_6{transform:scale(1.15)}._button_1vfe4_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_1vfe4_11{width:48px;height:48px}}._list_16sag_1{justify-content:space-between;display:flex}._button_16sag_6{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_16sag_6:disabled{cursor:default}._button_16sag_6{width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:flex}._button_16sag_6:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}._button_16sag_6:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._list_1kpxu_1{justify-content:space-between;display:flex}._icon_1kpxu_6{transition:transform .12s;transform:scale(1)}._button_1kpxu_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1kpxu_11:disabled{cursor:default}._button_1kpxu_11{justify-content:center;align-items:center;width:40px;height:40px;display:flex}._button_1kpxu_11:hover ._icon_1kpxu_6{transform:scale(1.1)}._button_1kpxu_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._list_grany_1{justify-content:center;gap:16px;display:flex}._icon_grany_7{transition:transform .12s;transform:scale(1)}._button_grany_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_grany_12:disabled{cursor:default}._button_grany_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_grany_12:hover ._icon_grany_7{transform:scale(1.15)}._button_grany_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_grany_12{width:48px;height:48px}}._list_1yzyr_1{justify-content:center;gap:16px;display:flex}._icon_1yzyr_7{transition:transform .12s;transform:scale(1)}._button_1yzyr_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1yzyr_12:disabled{cursor:default}._button_1yzyr_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1yzyr_12:hover ._icon_1yzyr_7{transform:scale(1.15)}._button_1yzyr_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._list_whbas_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_whbas_1{flex-direction:column-reverse;gap:4px}}._button_whbas_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_whbas_13:disabled{cursor:default}._button_whbas_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:inline-block}._button_whbas_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_whbas_13:hover{box-shadow:none}}._button_whbas_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_whbas_13 ._score_whbas_52{display:inline}._button_whbas_13 ._label_whbas_55{display:none}@media (width<=599px){._button_whbas_13 ._label_whbas_55{display:inline}._button_whbas_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_whbas_75{display:none}}._list_divjm_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_divjm_1{flex-direction:column-reverse;gap:4px}}._button_divjm_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_divjm_13:disabled{cursor:default}._button_divjm_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:block}._button_divjm_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_divjm_13:hover{box-shadow:none}}._button_divjm_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_divjm_13 ._score_divjm_52{display:inline}._button_divjm_13 ._label_divjm_55{display:none}@media (width<=599px){._button_divjm_13 ._label_divjm_55{display:inline}._button_divjm_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_divjm_75{display:none}}._base_umzkr_1{max-width:100%}._ratingCsat5_umzkr_5,._feedbackCsat5_umzkr_6,._contactCsat5_umzkr_7,._successCsat5_umzkr_8{width:320px}@media (width<=399px){._ratingCsat5_umzkr_5,._feedbackCsat5_umzkr_6,._contactCsat5_umzkr_7,._successCsat5_umzkr_8{width:100%}}._ratingCsat2_umzkr_20,._feedbackCsat2_umzkr_21,._contactCsat2_umzkr_22,._successCsat2_umzkr_23{width:280px}@media (width<=399px){._ratingCsat2_umzkr_20,._feedbackCsat2_umzkr_21,._contactCsat2_umzkr_22,._successCsat2_umzkr_23{width:100%}}._ratingCes_umzkr_35{width:340px}@media (width<=599px){._ratingCes_umzkr_35{width:280px}}@media (width<=399px){._ratingCes_umzkr_35{width:100%}}._feedbackCes_umzkr_49,._contactCes_umzkr_50,._successCes_umzkr_51{width:280px}@media (width<=599px){._feedbackCes_umzkr_49,._contactCes_umzkr_50,._successCes_umzkr_51{width:100%}}._ratingNps_umzkr_62{width:520px}@media (width<=599px){._ratingNps_umzkr_62{width:320px}}@media (width<=399px){._ratingNps_umzkr_62{width:100%}}._feedbackNps_umzkr_76,._contactNps_umzkr_77,._successNps_umzkr_78{width:280px}@media (width<=599px){._feedbackNps_umzkr_76,._contactNps_umzkr_77,._successNps_umzkr_78{width:100%}}
 /*$vite$:1*/

package/dist/index.d.ts

@@ -1,8 +1,9 @@
 import { default as default_2 } from 'react';
 
-export declare const CES7Survey: default_2.FC<CES7SurveyProps>;
-
-export declare interface CES7SurveyProps extends SharedSurveyProps {
+/** Customer Effort Score survey, rated on a fixed 7-point scale */
+export declare interface CesSurveyProps extends SharedSurveyProps {
+    /** Survey methodology */
+    type: 'ces';
     /** Visual style for the rating scale */
     scaleStyle: 'numbers';
 }
@@ -26,23 +27,30 @@ export declare interface ContactSubmitPayload {
     email: string;
 }
 
-export declare const CSAT2Survey: default_2.FC<CSAT2SurveyProps>;
-
-export declare interface CSAT2SurveyProps extends SharedSurveyProps {
+/** Customer Satisfaction survey, rated on a 2-point scale */
+export declare interface CsatSurveyProps2 extends SharedSurveyProps {
+    /** Survey methodology */
+    type: 'csat';
+    /** Number of points on the rating scale */
+    points: 2;
     /** Visual style for the rating scale */
     scaleStyle: 'emoji' | 'thumbs';
 }
 
-export declare const CSAT5Survey: default_2.FC<CSAT5SurveyProps>;
-
-export declare interface CSAT5SurveyProps extends SharedSurveyProps {
+/** Customer Satisfaction survey, rated on a 5-point scale */
+export declare interface CsatSurveyProps5 extends SharedSurveyProps {
+    /** Survey methodology */
+    type: 'csat';
+    /** Number of points on the rating scale */
+    points: 5;
     /** Visual style for the rating scale */
     scaleStyle: 'emoji' | 'numbers' | 'stars';
 }
 
-export declare const NPS10Survey: default_2.FC<NPS10SurveyProps>;
-
-export declare interface NPS10SurveyProps extends SharedSurveyProps {
+/** Net Promoter Score survey, rated on a fixed 0–10 scale */
+export declare interface NpsSurveyProps extends SharedSurveyProps {
+    /** Survey methodology */
+    type: 'nps';
     /** Visual style for the rating scale */
     scaleStyle: 'numbers';
 }
@@ -155,6 +163,8 @@ export declare const Surface: React.FC<SurfaceProps>;
 
 export declare type SurfaceProps = React.HTMLAttributes<HTMLDivElement>;
 
+export declare const Survey: default_2.FC<SurveyProps>;
+
 /**
  * Callback function for survey submission
  * @param payload - The survey data to submit
@@ -162,6 +172,8 @@ export declare type SurfaceProps = React.HTMLAttributes<HTMLDivElement>;
  */
 export declare type SurveyCallback = (payload: SurveySubmitPayload) => void | Promise<void>;
 
+export declare type SurveyProps = CsatSurveyProps5 | CsatSurveyProps2 | CesSurveyProps | NpsSurveyProps;
+
 /**
  * Available screens in survey flow
  */