@licklist/design 0.78.5-dev.57 → 0.78.5-dev.58

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.
Files changed (12) hide show
  1. package/dist/v2/components/Alert/Alert.d.ts.map +1 -1
  2. package/dist/v2/components/Alert/Alert.js +48 -1
  3. package/dist/v2/components/Alert/Alert.scss.js +1 -1
  4. package/dist/v2/components/NPSScore/NPSScore.d.ts +3 -1
  5. package/dist/v2/components/NPSScore/NPSScore.d.ts.map +1 -1
  6. package/dist/v2/components/NPSScore/NPSScore.js +3 -7
  7. package/dist/v2/components/NPSScore/NPSScore.scss.js +1 -1
  8. package/package.json +1 -1
  9. package/src/v2/components/Alert/Alert.scss +8 -19
  10. package/src/v2/components/Alert/Alert.tsx +24 -1
  11. package/src/v2/components/NPSScore/NPSScore.scss +4 -0
  12. package/src/v2/components/NPSScore/NPSScore.tsx +6 -7
package/dist/v2/components/Alert/Alert.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAElE,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA8CtC,CAAC"}
1
+ {"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/Alert/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,cAAc,CAAC;AAEtB,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAyBlE,MAAM,WAAW,UAAU;IACzB,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA8CtC,CAAC"}
package/dist/v2/components/Alert/Alert.js CHANGED
@@ -2,6 +2,52 @@ import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import 'react';
3
3
  import './Alert.scss.js';
4
4
 
5
+ var variantIcons = {
6
+ success: /*#__PURE__*/ jsx("svg", {
7
+ width: "18",
8
+ height: "18",
9
+ viewBox: "0 0 18 18",
10
+ fill: "none",
11
+ xmlns: "http://www.w3.org/2000/svg",
12
+ children: /*#__PURE__*/ jsx("path", {
13
+ d: "M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM7.44629 10.6055L5.72168 8.80762L4.27832 10.1924L7.35254 13.3945L14.6729 6.74023L13.3271 5.25977L7.44629 10.6055Z",
14
+ fill: "var(--fills-status-fill-success, #2D6B18)"
15
+ })
16
+ }),
17
+ error: /*#__PURE__*/ jsx("svg", {
18
+ width: "18",
19
+ height: "18",
20
+ viewBox: "0 0 18 18",
21
+ fill: "none",
22
+ xmlns: "http://www.w3.org/2000/svg",
23
+ children: /*#__PURE__*/ jsx("path", {
24
+ d: "M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM9 12.5C8.44772 12.5 8 12.9477 8 13.5C8 14.0523 8.44772 14.5 9 14.5C9.55228 14.5 10 14.0523 10 13.5C10 12.9477 9.55228 12.5 9 12.5ZM9 3.5C8.44772 3.5 8 3.94772 8 4.5V10.5C8 11.0523 8.44772 11.5 9 11.5C9.55228 11.5 10 11.0523 10 10.5V4.5C10 3.94772 9.55228 3.5 9 3.5Z",
25
+ fill: "var(--fills-status-fill-error, #CC3C35)"
26
+ })
27
+ }),
28
+ alert: /*#__PURE__*/ jsx("svg", {
29
+ width: "18",
30
+ height: "18",
31
+ viewBox: "0 0 18 18",
32
+ fill: "none",
33
+ xmlns: "http://www.w3.org/2000/svg",
34
+ children: /*#__PURE__*/ jsx("path", {
35
+ d: "M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM9 12.5C8.44772 12.5 8 12.9477 8 13.5C8 14.0523 8.44772 14.5 9 14.5C9.55228 14.5 10 14.0523 10 13.5C10 12.9477 9.55228 12.5 9 12.5ZM9 3.5C8.44772 3.5 8 3.94772 8 4.5V10.5C8 11.0523 8.44772 11.5 9 11.5C9.55228 11.5 10 11.0523 10 10.5V4.5C10 3.94772 9.55228 3.5 9 3.5Z",
36
+ fill: "var(--fills-status-fill-alert, #FD7E14)"
37
+ })
38
+ }),
39
+ info: /*#__PURE__*/ jsx("svg", {
40
+ width: "18",
41
+ height: "18",
42
+ viewBox: "0 0 18 18",
43
+ fill: "none",
44
+ xmlns: "http://www.w3.org/2000/svg",
45
+ children: /*#__PURE__*/ jsx("path", {
46
+ d: "M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM9 7.5C8.44772 7.5 8 7.94772 8 8.5V13.5C8 14.0523 8.44772 14.5 9 14.5C9.55228 14.5 10 14.0523 10 13.5V8.5C10 7.94772 9.55228 7.5 9 7.5ZM9 3.5C8.44772 3.5 8 3.94772 8 4.5C8 5.05228 8.44772 5.5 9 5.5C9.55228 5.5 10 5.05228 10 4.5C10 3.94772 9.55228 3.5 9 3.5Z",
47
+ fill: "var(--fills-status-fill-info, #0E8CE2)"
48
+ })
49
+ })
50
+ };
5
51
  var Alert = function(param) {
6
52
  var variant = param.variant, title = param.title, message = param.message, linkText = param.linkText, onLinkClick = param.onLinkClick, onDismiss = param.onDismiss, className = param.className;
7
53
  var handleDismiss = function() {
@@ -14,7 +60,8 @@ var Alert = function(param) {
14
60
  className: "alert__content",
15
61
  children: [
16
62
  /*#__PURE__*/ jsx("div", {
17
- className: "alert__icon"
63
+ className: "alert__icon",
64
+ children: variantIcons[variant]
18
65
  }),
19
66
  /*#__PURE__*/ jsxs("div", {
20
67
  className: "alert__details",
package/dist/v2/components/Alert/Alert.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ":root{--blue-50:#e7f4fc;--blue-100:#b4dbf6;--blue-200:#90caf2;--blue-300:#5eb2ec;--blue-400:#3ea3e8;--blue-500:#0e8ce2;--blue-600:#0d7fce;--blue-700:#0a63a0;--blue-800:#084d7c;--blue-900:#063b5f;--cyan-50:#eafbff;--cyan-75:#bdf3ff;--cyan-100:#aff1ff;--cyan-200:#9deeff;--cyan-300:#71e6ff;--cyan-400:#55e1ff;--cyan-500:#2bd9ff;--cyan-600:#27c5e8;--cyan-700:#1f9ab5;--cyan-800:#18778c;--cyan-900:#125b6b;--indigo-50:#efeffe;--indigo-100:#cdccfc;--indigo-200:#b4b4fa;--indigo-300:#9291f8;--indigo-400:#7c74ff;--indigo-500:#5d5bf4;--indigo-600:#5553de;--indigo-700:#4241ad;--indigo-800:#333286;--indigo-900:#272666;--green-50:#eef9ea;--green-100:#c9ecbd;--green-200:#afe39d;--green-300:#8bd671;--green-400:#75ce55;--green-500:#52c22b;--green-600:#4bb127;--green-700:#3a8a1f;--green-800:#2d6b18;--green-900:#225112;--red-50:#fceceb;--red-100:#f5c4c2;--red-200:#f1a8a4;--red-300:#ea807b;--red-400:#e66861;--red-500:#e0423a;--red-600:#cc3c35;--red-700:#9f2f29;--red-800:#7b2420;--red-900:#5e1c18;--purple-50:#efe6fd;--purple-100:#ceb0fa;--purple-200:#b78af7;--purple-300:#965ff4;--purple-400:#8133f1;--purple-500:#6200ee;--purple-600:#5900d9;--purple-700:#4600a9;--purple-800:#360083;--purple-900:#290064;--orange-50:#fff2e8;--orange-100:#fed7b6;--orange-200:#fec493;--orange-300:#fea962;--orange-400:#fd9843;--orange-500:#fd7e14;--orange-600:#e67312;--orange-700:#b4590e;--orange-800:#8b450b;--orange-900:#6a3508;--yellow-50:#fcf6e7;--yellow-100:#f6e3b4;--yellow-200:#f2d68f;--yellow-300:#ecc35c;--yellow-400:#fcc741;--yellow-500:#fbb912;--yellow-600:#e4a810;--yellow-700:#a07509;--yellow-800:#7c5b07;--yellow-900:#5f4505;--pink-50:#fdecf4;--pink-100:#f8c3db;--pink-200:#f4a6ca;--pink-300:#f07eb2;--pink-400:#ed65a3;--pink-500:#e83e8c;--pink-600:#d33874;--pink-700:#a52c63;--pink-800:#80224d;--pink-900:#611a3b;--teal-50:#e9faf7;--teal-100:#baf0e7;--teal-200:#99e8db;--teal-300:#6bdecb;--teal-400:#4ed8c1;--teal-500:#22ceb1;--teal-600:#1fbba1;--teal-700:#18927e;--teal-800:#137161;--teal-900:#0e574a;--neutral-white:#fff;--neutral-25:#f8f8fa;--neutral-50:#e8e9ef;--neutral-75:#d2d5e3;--neutral-100:#b6bacc;--neutral-200:#9399b3;--neutral-300:#626a90;--neutral-400:#433d7b;--neutral-500:#14215a;--neutral-600:#121e52;--neutral-700:#0e1740;--neutral-800:#0b1232;--neutral-900:#080e26;--neutral-black:#000;--purple-lightest:var(--purple-50);--purple-lighter:var(--purple-100);--purple-light:var(--purple-300);--purple-regular:var(--purple-500);--purple-dark:var(--purple-600);--purple-darker:var(--purple-800);--purple-darkest:var(--purple-900);--blue-lightest:var(--blue-50);--blue-lighter:var(--blue-100);--blue-light:var(--blue-300);--blue-regular:var(--blue-500);--blue-dark:var(--blue-600);--blue-darker:var(--blue-800);--blue-darkest:var(--blue-900);--indigo-lightest:var(--indigo-50);--indigo-lighter:var(--indigo-100);--indigo-light:var(--indigo-300);--indigo-regular:var(--indigo-500);--indigo-dark:var(--indigo-600);--indigo-darker:var(--indigo-800);--indigo-darkest:var(--indigo-900);--cyan-lightest:var(--cyan-50);--cyan-lighter:var(--cyan-100);--cyan-light:var(--cyan-300);--cyan-regular:var(--cyan-500);--cyan-dark:var(--cyan-700);--cyan-darker:var(--cyan-800);--cyan-darkest:var(--cyan-900);--red-lightest:var(--red-50);--red-lighter:var(--red-100);--red-light:var(--red-400);--red-regular:var(--red-500);--red-dark:var(--red-600);--red-darker:var(--red-800);--red-darkest:var(--red-900);--orange-lightest:var(--orange-50);--orange-lighter:var(--orange-100);--orange-light:var(--orange-300);--orange-regular:var(--orange-500);--orange-dark:var(--orange-600);--orange-darker:var(--orange-700);--orange-darkest:var(--orange-800);--yellow-lightest:var(--yellow-50);--yellow-lighter:var(--yellow-100);--yellow-light:var(--yellow-300);--yellow-regular:var(--yellow-500);--yellow-dark:var(--yellow-600);--yellow-darker:var(--yellow-800);--yellow-darkest:var(--yellow-900);--pink-lightest:var(--pink-50);--pink-lighter:var(--pink-100);--pink-light:var(--pink-300);--pink-regular:var(--pink-500);--pink-dark:var(--pink-600);--pink-darker:var(--pink-700);--pink-darkest:var(--pink-800);--green-lightest:var(--green-50);--green-lighter:var(--green-100);--green-light:var(--green-300);--green-regular:var(--green-500);--green-dark:var(--green-600);--green-darker:var(--green-800);--green-darkest:var(--green-900);--teal-lightest:var(--teal-50);--teal-lighter:var(--teal-100);--teal-light:var(--teal-300);--teal-regular:var(--teal-500);--teal-dark:var(--teal-600);--teal-darker:var(--teal-700);--teal-darkest:var(--teal-800);--tone-lightest:var(--neutral-white);--tone-lighter:var(--neutral-25);--tone-light:var(--neutral-50);--tone-regular:var(--neutral-75);--tone-dark:var(--neutral-100);--tone-darker:var(--neutral-200);--tone-darkest:var(--neutral-300);--shade-lightest:var(--neutral-400);--shade-lighter:var(--neutral-500);--shade-light:var(--neutral-600);--shade-regular:var(--neutral-700);--shade-dark:var(--neutral-800);--shade-darker:var(--neutral-900);--shade-darkest:var(--neutral-black);--highlight-lightest:var(--cyan-lightest);--highlight-lighter:var(--cyan-lighter);--highlight-light:var(--cyan-light);--highlight-regular:var(--blue-regular);--highlight-dark:var(--blue-dark);--highlight-darker:var(--blue-darker);--highlight-darkest:var(--blue-darkest);--success-lightest:var(--green-lightest);--success-lighter:var(--green-lighter);--success-light:var(--green-light);--success-regular:var(--green-regular);--success-dark:var(--green-dark);--success-darker:var(--green-darker);--success-darkest:var(--green-darkest);--errors-lightest:var(--red-lightest);--errors-lighter:var(--red-lighter);--errors-light:var(--red-light);--errors-regular:var(--red-regular);--errors-dark:var(--red-dark);--errors-darker:var(--red-darker);--errors-darkest:var(--red-darkest);--actions-lightest:var(--purple-50);--actions-lighter:var(--purple-lighter);--actions-light:var(--purple-light);--actions-regular:var(--purple-regular);--actions-dark:var(--purple-dark);--actions-darker:var(--purple-darker);--actions-darkest:var(--purple-darkest);--information-lightest:var(--blue-lightest);--information-lighter:var(--blue-lighter);--information-light:var(--blue-light);--information-regular:var(--blue-regular);--information-dark:var(--blue-dark);--information-darker:var(--blue-darker);--information-darkest:var(--blue-darkest);--alert-lightest:var(--yellow-lightest);--alert-lighter:var(--yellow-lighter);--alert-light:var(--orange-light);--alert-regular:var(--orange-regular);--alert-darker:var(--yellow-darker);--alert-darkest:var(--yellow-darkest);--danger-lightest:var(--red-lightest);--danger-lighter:var(--red-lighter);--danger-light:var(--red-light);--danger-regular:var(--red-regular);--danger-dark:var(--red-dark);--danger-darker:var(--red-darker);--danger-darkest:var(--red-darkest);--disabled-lightest:var(--tone-light);--disabled-lighter:var(--tone-regular);--disabled-light:var(--tone-dark);--disabled-regular:var(--tone-darker);--disabled-dark:var(--shade-lighter);--disabled-darker:var(--shade-light);--disabled-darkest:var(--shade-regular);--label-primary:var(--shade-light);--label-primary-alt:var(--tone-lighter);--label-secondary:var(--tone-darkest);--label-secondary-hover:var(--shade-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-dark);--label-action:var(--actions-regular);--label-danger:var(--danger-dark);--label-status-error:var(--errors-dark);--label-status-success:var(--success-darker);--label-status-info:var(--information-dark);--label-status-alert:var(--alert-regular);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--tone-lightest);--surface-primary-hover:var(--tone-lighter);--surface-primary-pressed:var(--tone-light);--surface-secondary:var(--neutral-25);--surface-secondary-hover:var(--tone-light);--surface-secondary-pressed:var(--tone-regular);--surface-tertiary:var(--tone-light);--surface-tertiary-hover:var(--tone-lighter);--surface-tertiary-pressed:var(--tone-lightest);--surface-status-success:var(--success-lightest);--surface-status-error:var(--errors-lightest);--surface-status-alert:var(--alert-lightest);--surface-status-info:var(--information-lightest);--surface-status-disabled:var(--disabled-lighter);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-dark);--surface-action-soft:var(--actions-lightest);--surface-action-soft-hover:var(--actions-lighter);--surface-action-soft-pressed:var(--actions-light);--surface-danger-soft:var(--danger-lightest);--surface-danger-soft-hover:var(--danger-lighter);--surface-danger-soft-pressed:var(--danger-light);--surface-highlight-soft:var(--highlight-lightest);--surface-colour-red-soft:var(--red-lightest);--surface-colour-green-soft:var(--green-lightest);--surface-colour-blue-soft:var(--blue-lightest);--surface-colour-orange-soft:var(--orange-lightest);--surface-colour-yellow-soft:var(--yellow-lightest);--surface-colour-purple-soft:var(--purple-lightest);--surface-colour-indigo-soft:var(--indigo-lightest);--surface-colour-cyan-soft:var(--cyan-lightest);--surface-colour-pink-soft:var(--pink-lightest);--surface-colour-teal-soft:var(--teal-lightest);--border-primary:var(--tone-light);--border-secondary:var(--tone-regular);--border-selected:var(--neutral-600);--border-action:var(--actions-regular);--border-status-error:var(--errors-lighter);--border-status-success:var(--success-lighter);--border-status-alert:var(--alert-lighter);--border-status-info:var(--information-lighter);--border-status-disabled:var(--disabled-lightest);--border-colour-overlay:#121e521a;--fill-primary:var(--shade-lighter);--fill-secondary:var(--tone-darkest);--fill-white:var(--tone-lightest);--fill-action:var(--actions-regular);--fill-highlight:var(--highlight-dark);--fill-danger:var(--danger-dark);--fill-status-success:var(--success-darker);--fill-status-error:var(--errors-dark);--fill-status-alert:var(--alert-regular);--fill-status-info:var(--information-regular);--fill-status-disabled:var(--disabled-light);--gradient-stop1:var(--purple-500);--gradient-stop2:var(--indigo-500);--gradient-stop3:var(--blue-500)}[data-theme=dark]{--label-primary:var(--tone-lighter);--label-primary-alt:var(--shade-light);--label-secondary:var(--tone-darker);--label-secondary-hover:var(--tone-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-light);--label-action:var(--actions-lighter);--label-danger:var(--danger-light);--label-status-error:var(--errors-light);--label-status-success:var(--success-light);--label-status-info:var(--information-light);--label-status-alert:var(--alert-light);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--shade-darker);--surface-primary-hover:var(--shade-dark);--surface-primary-pressed:var(--shade-regular);--surface-secondary:var(--shade-dark);--surface-secondary-hover:var(--shade-darker);--surface-secondary-pressed:var(--shade-darkest);--surface-tertiary:var(--shade-regular);--surface-tertiary-hover:var(--shade-dark);--surface-tertiary-pressed:var(--shade-darker);--surface-status-success:var(--success-darkest);--surface-status-error:var(--errors-darkest);--surface-status-alert:var(--alert-darkest);--surface-status-info:var(--information-darkest);--surface-status-disabled:var(--disabled-darkest);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-light);--surface-action-soft:var(--actions-darkest);--surface-action-soft-hover:var(--actions-darker);--surface-action-soft-pressed:var(--actions-dark);--surface-danger-soft:var(--danger-darkest);--surface-danger-soft-hover:var(--danger-darker);--surface-danger-soft-pressed:var(--danger-dark);--surface-highlight-soft:var(--highlight-darkest);--surface-colour-red-soft:var(--red-darkest);--surface-colour-green-soft:var(--green-darkest);--surface-colour-blue-soft:var(--blue-darkest);--surface-colour-orange-soft:var(--orange-darkest);--surface-colour-yellow-soft:var(--yellow-darkest);--surface-colour-purple-soft:var(--purple-darkest);--surface-colour-indigo-soft:var(--indigo-darkest);--surface-colour-cyan-soft:var(--cyan-darkest);--surface-colour-pink-soft:var(--pink-darkest);--surface-colour-teal-soft:var(--teal-darkest);--border-primary:var(--shade-light);--border-secondary:var(--shade-dark);--border-selected:var(--tone-light);--border-action:var(--actions-light);--border-status-error:var(--errors-darker);--border-status-success:var(--success-darker);--border-status-alert:var(--alert-darker);--border-status-info:var(--information-darker);--border-status-disabled:var(--disabled-dark);--border-colour-overlay:#ffffff1a;--fill-primary:var(--tone-lighter);--fill-secondary:var(--tone-darker);--fill-white:var(--tone-lightest);--fill-action:var(--actions-lighter);--fill-highlight:var(--highlight-light);--fill-danger:var(--danger-light);--fill-status-success:var(--success-light);--fill-status-error:var(--errors-light);--fill-status-alert:var(--alert-light);--fill-status-info:var(--information-light);--fill-status-disabled:var(--disabled-dark);--gradient-stop1:var(--indigo-400);--gradient-stop2:var(--cyan-500);--gradient-stop3:var(--cyan-100)}.text-primary{color:var(--label-primary)}.text-secondary{color:var(--label-secondary)}.text-white{color:var(--label-white)}.text-action{color:var(--label-action)}.text-danger{color:var(--label-danger)}.text-success{color:var(--label-status-success)}.text-error{color:var(--label-status-error)}.text-info{color:var(--label-status-info)}.text-warning{color:var(--label-status-alert)}.text-disabled{color:var(--label-status-disabled)}.bg-primary{background-color:var(--surface-primary)}.bg-secondary{background-color:var(--surface-secondary)}.bg-tertiary{background-color:var(--surface-tertiary)}.bg-success{background-color:var(--surface-status-success)}.bg-error{background-color:var(--surface-status-error)}.bg-warning{background-color:var(--surface-status-alert)}.bg-info{background-color:var(--surface-status-info)}.bg-action-soft{background-color:var(--surface-action-soft)}.bg-danger-soft{background-color:var(--surface-danger-soft)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.border-selected{border-color:var(--border-selected)}.border-action{border-color:var(--border-action)}.border-success{border-color:var(--border-status-success)}.border-error{border-color:var(--border-status-error)}.border-warning{border-color:var(--border-status-alert)}.border-info{border-color:var(--border-status-info)}:root{--radius-zero:0px;--radius-xs:1px;--radius-sm:2px;--radius-md:4px;--radius-reg:8px;--radius-lg:16px;--radius-xl:24px;--spacing-zero:0px;--spacing-xxs:1px;--spacing-xs:2px;--spacing-sm:4px;--spacing-md:8px;--spacing-reg:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-xxl:64px;--spacing-super:128px;--container-padding-mobile:16px;--opacity-0:0;--opacity-10:0.1;--opacity-20:0.2;--opacity-30:0.3;--opacity-40:0.4;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--color-success-fill:#2d6b18;--color-success-background:#eef9ea;--color-success-border:#c9ecbd;--color-error-fill:#cc3c35;--color-error-background:#fceceb;--color-error-border:#f5c4c2;--color-alert-fill:#fd7e14;--color-alert-background:#fcf6e7;--color-alert-border:#f6e3b4;--color-info-fill:#0e8ce2;--color-info-background:#e7f4fc;--color-info-border:#b4dbf6;--surfaces-status-background-success:var(--color-success-background);--surfaces-status-background-error:var(--color-error-background);--surfaces-status-background-alert:var(--color-alert-background);--surfaces-status-background-info:var(--color-info-background);--borders-status-border-success:var(--color-success-border);--borders-status-border-error:var(--color-error-border);--borders-status-border-alert:var(--color-alert-border);--borders-status-border-info:var(--color-info-border);--fills-status-fill-success:var(--color-success-fill);--fills-status-fill-error:var(--color-error-fill);--fills-status-fill-alert:var(--color-alert-fill);--fills-status-fill-info:var(--color-info-fill);--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.waiver-template-form-section{gap:var(--padding-reg,16px)}.waiver-template-form-group,.waiver-template-form-section{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column}.waiver-template-form-group{gap:var(--padding-lg,24px)}.text-description{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:16px;font-style:normal;line-height:24px}.alert{align-items:center;border:2px solid var(--borders-status-border-success,#c9ecbd);border-radius:var(--radius-reg,8px);box-sizing:border-box;display:flex;justify-content:space-between;padding:var(--padding-reg,16px);width:100%}.alert,.alert--success{background:var(--surfaces-status-background-success,#eef9ea)}.alert--success{border-color:var(--borders-status-border-success,#c9ecbd)}.alert--success .alert__icon{background-image:url(assets/success-icon.svg)}.alert--success .alert__dismiss svg path{stroke:var(--fills-status-fill-success,#2d6b18)}.alert--error{background:var(--surfaces-status-background-error,#fceceb);border-color:var(--borders-status-border-error,#f5c4c2)}.alert--error .alert__icon{background-image:url(assets/error-icon.svg)}.alert--error .alert__dismiss svg path{stroke:var(--fills-status-fill-error,#cc3c35)}.alert--alert{background:var(--surfaces-status-background-alert,#fcf6e7);border-color:var(--borders-status-border-alert,#f6e3b4)}.alert--alert .alert__icon{background-image:url(assets/alert-icon.svg)}.alert--alert .alert__dismiss svg path{stroke:var(--fills-status-fill-alert,#fd7e14)}.alert--info{background:var(--surfaces-status-background-info,#e7f4fc);border-color:var(--borders-status-border-info,#b4dbf6)}.alert--info .alert__icon{background-image:url(assets/info-icon.svg)}.alert--info .alert__dismiss svg path{stroke:var(--fills-status-fill-info,#0e8ce2)}.alert__content{align-items:center;display:flex;flex:1 0 0;gap:16px;min-height:0;min-width:0}.alert__icon{background-position:50%;background-repeat:no-repeat;background-size:contain;flex-shrink:0;height:32px;overflow:hidden;position:relative;width:32px}.alert__details{flex:1 0 0;justify-content:center;min-height:0;min-width:0}.alert__details,.alert__information{align-items:flex-start;display:flex;flex-direction:column;gap:4px}.alert__information{color:var(--labels-main-label-primary,#121e52);font-size:15px;line-height:normal;position:relative;text-align:left;white-space:pre-wrap;width:100%}.alert__title{font-weight:600;line-height:18px}.alert__message,.alert__title{color:var(--labels-main-label-primary,#121e52);font-family:Geist,sans-serif;font-size:15px;margin:0}.alert__message{font-weight:400;line-height:20px;max-width:720px}.alert__link{align-items:center;cursor:pointer;display:flex;gap:8px}.alert__link:hover{opacity:.8}.alert__link-text{color:var(--labels-main-label-primary,#121e52);font-family:Geist,sans-serif;font-size:15px;font-weight:500;line-height:20px;margin:0}.alert__link-icon{flex-shrink:0;height:24px;overflow:hidden;position:relative;width:24px}.alert__link-icon svg{display:block;height:100%;width:100%}.alert__dismiss{align-items:center;cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;overflow:hidden;transition:opacity .2s ease;width:32px}.alert__dismiss:hover{opacity:.7}.alert__dismiss svg{display:block;height:100%;width:100%}";
3
+ var css_248z = ":root{--blue-50:#e7f4fc;--blue-100:#b4dbf6;--blue-200:#90caf2;--blue-300:#5eb2ec;--blue-400:#3ea3e8;--blue-500:#0e8ce2;--blue-600:#0d7fce;--blue-700:#0a63a0;--blue-800:#084d7c;--blue-900:#063b5f;--cyan-50:#eafbff;--cyan-75:#bdf3ff;--cyan-100:#aff1ff;--cyan-200:#9deeff;--cyan-300:#71e6ff;--cyan-400:#55e1ff;--cyan-500:#2bd9ff;--cyan-600:#27c5e8;--cyan-700:#1f9ab5;--cyan-800:#18778c;--cyan-900:#125b6b;--indigo-50:#efeffe;--indigo-100:#cdccfc;--indigo-200:#b4b4fa;--indigo-300:#9291f8;--indigo-400:#7c74ff;--indigo-500:#5d5bf4;--indigo-600:#5553de;--indigo-700:#4241ad;--indigo-800:#333286;--indigo-900:#272666;--green-50:#eef9ea;--green-100:#c9ecbd;--green-200:#afe39d;--green-300:#8bd671;--green-400:#75ce55;--green-500:#52c22b;--green-600:#4bb127;--green-700:#3a8a1f;--green-800:#2d6b18;--green-900:#225112;--red-50:#fceceb;--red-100:#f5c4c2;--red-200:#f1a8a4;--red-300:#ea807b;--red-400:#e66861;--red-500:#e0423a;--red-600:#cc3c35;--red-700:#9f2f29;--red-800:#7b2420;--red-900:#5e1c18;--purple-50:#efe6fd;--purple-100:#ceb0fa;--purple-200:#b78af7;--purple-300:#965ff4;--purple-400:#8133f1;--purple-500:#6200ee;--purple-600:#5900d9;--purple-700:#4600a9;--purple-800:#360083;--purple-900:#290064;--orange-50:#fff2e8;--orange-100:#fed7b6;--orange-200:#fec493;--orange-300:#fea962;--orange-400:#fd9843;--orange-500:#fd7e14;--orange-600:#e67312;--orange-700:#b4590e;--orange-800:#8b450b;--orange-900:#6a3508;--yellow-50:#fcf6e7;--yellow-100:#f6e3b4;--yellow-200:#f2d68f;--yellow-300:#ecc35c;--yellow-400:#fcc741;--yellow-500:#fbb912;--yellow-600:#e4a810;--yellow-700:#a07509;--yellow-800:#7c5b07;--yellow-900:#5f4505;--pink-50:#fdecf4;--pink-100:#f8c3db;--pink-200:#f4a6ca;--pink-300:#f07eb2;--pink-400:#ed65a3;--pink-500:#e83e8c;--pink-600:#d33874;--pink-700:#a52c63;--pink-800:#80224d;--pink-900:#611a3b;--teal-50:#e9faf7;--teal-100:#baf0e7;--teal-200:#99e8db;--teal-300:#6bdecb;--teal-400:#4ed8c1;--teal-500:#22ceb1;--teal-600:#1fbba1;--teal-700:#18927e;--teal-800:#137161;--teal-900:#0e574a;--neutral-white:#fff;--neutral-25:#f8f8fa;--neutral-50:#e8e9ef;--neutral-75:#d2d5e3;--neutral-100:#b6bacc;--neutral-200:#9399b3;--neutral-300:#626a90;--neutral-400:#433d7b;--neutral-500:#14215a;--neutral-600:#121e52;--neutral-700:#0e1740;--neutral-800:#0b1232;--neutral-900:#080e26;--neutral-black:#000;--purple-lightest:var(--purple-50);--purple-lighter:var(--purple-100);--purple-light:var(--purple-300);--purple-regular:var(--purple-500);--purple-dark:var(--purple-600);--purple-darker:var(--purple-800);--purple-darkest:var(--purple-900);--blue-lightest:var(--blue-50);--blue-lighter:var(--blue-100);--blue-light:var(--blue-300);--blue-regular:var(--blue-500);--blue-dark:var(--blue-600);--blue-darker:var(--blue-800);--blue-darkest:var(--blue-900);--indigo-lightest:var(--indigo-50);--indigo-lighter:var(--indigo-100);--indigo-light:var(--indigo-300);--indigo-regular:var(--indigo-500);--indigo-dark:var(--indigo-600);--indigo-darker:var(--indigo-800);--indigo-darkest:var(--indigo-900);--cyan-lightest:var(--cyan-50);--cyan-lighter:var(--cyan-100);--cyan-light:var(--cyan-300);--cyan-regular:var(--cyan-500);--cyan-dark:var(--cyan-700);--cyan-darker:var(--cyan-800);--cyan-darkest:var(--cyan-900);--red-lightest:var(--red-50);--red-lighter:var(--red-100);--red-light:var(--red-400);--red-regular:var(--red-500);--red-dark:var(--red-600);--red-darker:var(--red-800);--red-darkest:var(--red-900);--orange-lightest:var(--orange-50);--orange-lighter:var(--orange-100);--orange-light:var(--orange-300);--orange-regular:var(--orange-500);--orange-dark:var(--orange-600);--orange-darker:var(--orange-700);--orange-darkest:var(--orange-800);--yellow-lightest:var(--yellow-50);--yellow-lighter:var(--yellow-100);--yellow-light:var(--yellow-300);--yellow-regular:var(--yellow-500);--yellow-dark:var(--yellow-600);--yellow-darker:var(--yellow-800);--yellow-darkest:var(--yellow-900);--pink-lightest:var(--pink-50);--pink-lighter:var(--pink-100);--pink-light:var(--pink-300);--pink-regular:var(--pink-500);--pink-dark:var(--pink-600);--pink-darker:var(--pink-700);--pink-darkest:var(--pink-800);--green-lightest:var(--green-50);--green-lighter:var(--green-100);--green-light:var(--green-300);--green-regular:var(--green-500);--green-dark:var(--green-600);--green-darker:var(--green-800);--green-darkest:var(--green-900);--teal-lightest:var(--teal-50);--teal-lighter:var(--teal-100);--teal-light:var(--teal-300);--teal-regular:var(--teal-500);--teal-dark:var(--teal-600);--teal-darker:var(--teal-700);--teal-darkest:var(--teal-800);--tone-lightest:var(--neutral-white);--tone-lighter:var(--neutral-25);--tone-light:var(--neutral-50);--tone-regular:var(--neutral-75);--tone-dark:var(--neutral-100);--tone-darker:var(--neutral-200);--tone-darkest:var(--neutral-300);--shade-lightest:var(--neutral-400);--shade-lighter:var(--neutral-500);--shade-light:var(--neutral-600);--shade-regular:var(--neutral-700);--shade-dark:var(--neutral-800);--shade-darker:var(--neutral-900);--shade-darkest:var(--neutral-black);--highlight-lightest:var(--cyan-lightest);--highlight-lighter:var(--cyan-lighter);--highlight-light:var(--cyan-light);--highlight-regular:var(--blue-regular);--highlight-dark:var(--blue-dark);--highlight-darker:var(--blue-darker);--highlight-darkest:var(--blue-darkest);--success-lightest:var(--green-lightest);--success-lighter:var(--green-lighter);--success-light:var(--green-light);--success-regular:var(--green-regular);--success-dark:var(--green-dark);--success-darker:var(--green-darker);--success-darkest:var(--green-darkest);--errors-lightest:var(--red-lightest);--errors-lighter:var(--red-lighter);--errors-light:var(--red-light);--errors-regular:var(--red-regular);--errors-dark:var(--red-dark);--errors-darker:var(--red-darker);--errors-darkest:var(--red-darkest);--actions-lightest:var(--purple-50);--actions-lighter:var(--purple-lighter);--actions-light:var(--purple-light);--actions-regular:var(--purple-regular);--actions-dark:var(--purple-dark);--actions-darker:var(--purple-darker);--actions-darkest:var(--purple-darkest);--information-lightest:var(--blue-lightest);--information-lighter:var(--blue-lighter);--information-light:var(--blue-light);--information-regular:var(--blue-regular);--information-dark:var(--blue-dark);--information-darker:var(--blue-darker);--information-darkest:var(--blue-darkest);--alert-lightest:var(--yellow-lightest);--alert-lighter:var(--yellow-lighter);--alert-light:var(--orange-light);--alert-regular:var(--orange-regular);--alert-darker:var(--yellow-darker);--alert-darkest:var(--yellow-darkest);--danger-lightest:var(--red-lightest);--danger-lighter:var(--red-lighter);--danger-light:var(--red-light);--danger-regular:var(--red-regular);--danger-dark:var(--red-dark);--danger-darker:var(--red-darker);--danger-darkest:var(--red-darkest);--disabled-lightest:var(--tone-light);--disabled-lighter:var(--tone-regular);--disabled-light:var(--tone-dark);--disabled-regular:var(--tone-darker);--disabled-dark:var(--shade-lighter);--disabled-darker:var(--shade-light);--disabled-darkest:var(--shade-regular);--label-primary:var(--shade-light);--label-primary-alt:var(--tone-lighter);--label-secondary:var(--tone-darkest);--label-secondary-hover:var(--shade-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-dark);--label-action:var(--actions-regular);--label-danger:var(--danger-dark);--label-status-error:var(--errors-dark);--label-status-success:var(--success-darker);--label-status-info:var(--information-dark);--label-status-alert:var(--alert-regular);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--tone-lightest);--surface-primary-hover:var(--tone-lighter);--surface-primary-pressed:var(--tone-light);--surface-secondary:var(--neutral-25);--surface-secondary-hover:var(--tone-light);--surface-secondary-pressed:var(--tone-regular);--surface-tertiary:var(--tone-light);--surface-tertiary-hover:var(--tone-lighter);--surface-tertiary-pressed:var(--tone-lightest);--surface-status-success:var(--success-lightest);--surface-status-error:var(--errors-lightest);--surface-status-alert:var(--alert-lightest);--surface-status-info:var(--information-lightest);--surface-status-disabled:var(--disabled-lighter);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-dark);--surface-action-soft:var(--actions-lightest);--surface-action-soft-hover:var(--actions-lighter);--surface-action-soft-pressed:var(--actions-light);--surface-danger-soft:var(--danger-lightest);--surface-danger-soft-hover:var(--danger-lighter);--surface-danger-soft-pressed:var(--danger-light);--surface-highlight-soft:var(--highlight-lightest);--surface-colour-red-soft:var(--red-lightest);--surface-colour-green-soft:var(--green-lightest);--surface-colour-blue-soft:var(--blue-lightest);--surface-colour-orange-soft:var(--orange-lightest);--surface-colour-yellow-soft:var(--yellow-lightest);--surface-colour-purple-soft:var(--purple-lightest);--surface-colour-indigo-soft:var(--indigo-lightest);--surface-colour-cyan-soft:var(--cyan-lightest);--surface-colour-pink-soft:var(--pink-lightest);--surface-colour-teal-soft:var(--teal-lightest);--border-primary:var(--tone-light);--border-secondary:var(--tone-regular);--border-selected:var(--neutral-600);--border-action:var(--actions-regular);--border-status-error:var(--errors-lighter);--border-status-success:var(--success-lighter);--border-status-alert:var(--alert-lighter);--border-status-info:var(--information-lighter);--border-status-disabled:var(--disabled-lightest);--border-colour-overlay:#121e521a;--fill-primary:var(--shade-lighter);--fill-secondary:var(--tone-darkest);--fill-white:var(--tone-lightest);--fill-action:var(--actions-regular);--fill-highlight:var(--highlight-dark);--fill-danger:var(--danger-dark);--fill-status-success:var(--success-darker);--fill-status-error:var(--errors-dark);--fill-status-alert:var(--alert-regular);--fill-status-info:var(--information-regular);--fill-status-disabled:var(--disabled-light);--gradient-stop1:var(--purple-500);--gradient-stop2:var(--indigo-500);--gradient-stop3:var(--blue-500)}[data-theme=dark]{--label-primary:var(--tone-lighter);--label-primary-alt:var(--shade-light);--label-secondary:var(--tone-darker);--label-secondary-hover:var(--tone-lighter);--label-white:var(--tone-lightest);--label-highlight:var(--highlight-light);--label-action:var(--actions-lighter);--label-danger:var(--danger-light);--label-status-error:var(--errors-light);--label-status-success:var(--success-light);--label-status-info:var(--information-light);--label-status-alert:var(--alert-light);--label-status-disabled:var(--disabled-regular);--surface-primary:var(--shade-darker);--surface-primary-hover:var(--shade-dark);--surface-primary-pressed:var(--shade-regular);--surface-secondary:var(--shade-dark);--surface-secondary-hover:var(--shade-darker);--surface-secondary-pressed:var(--shade-darkest);--surface-tertiary:var(--shade-regular);--surface-tertiary-hover:var(--shade-dark);--surface-tertiary-pressed:var(--shade-darker);--surface-status-success:var(--success-darkest);--surface-status-error:var(--errors-darkest);--surface-status-alert:var(--alert-darkest);--surface-status-info:var(--information-darkest);--surface-status-disabled:var(--disabled-darkest);--surface-action:var(--actions-regular);--surface-action-hover:var(--actions-light);--surface-action-soft:var(--actions-darkest);--surface-action-soft-hover:var(--actions-darker);--surface-action-soft-pressed:var(--actions-dark);--surface-danger-soft:var(--danger-darkest);--surface-danger-soft-hover:var(--danger-darker);--surface-danger-soft-pressed:var(--danger-dark);--surface-highlight-soft:var(--highlight-darkest);--surface-colour-red-soft:var(--red-darkest);--surface-colour-green-soft:var(--green-darkest);--surface-colour-blue-soft:var(--blue-darkest);--surface-colour-orange-soft:var(--orange-darkest);--surface-colour-yellow-soft:var(--yellow-darkest);--surface-colour-purple-soft:var(--purple-darkest);--surface-colour-indigo-soft:var(--indigo-darkest);--surface-colour-cyan-soft:var(--cyan-darkest);--surface-colour-pink-soft:var(--pink-darkest);--surface-colour-teal-soft:var(--teal-darkest);--border-primary:var(--shade-light);--border-secondary:var(--shade-dark);--border-selected:var(--tone-light);--border-action:var(--actions-light);--border-status-error:var(--errors-darker);--border-status-success:var(--success-darker);--border-status-alert:var(--alert-darker);--border-status-info:var(--information-darker);--border-status-disabled:var(--disabled-dark);--border-colour-overlay:#ffffff1a;--fill-primary:var(--tone-lighter);--fill-secondary:var(--tone-darker);--fill-white:var(--tone-lightest);--fill-action:var(--actions-lighter);--fill-highlight:var(--highlight-light);--fill-danger:var(--danger-light);--fill-status-success:var(--success-light);--fill-status-error:var(--errors-light);--fill-status-alert:var(--alert-light);--fill-status-info:var(--information-light);--fill-status-disabled:var(--disabled-dark);--gradient-stop1:var(--indigo-400);--gradient-stop2:var(--cyan-500);--gradient-stop3:var(--cyan-100)}.text-primary{color:var(--label-primary)}.text-secondary{color:var(--label-secondary)}.text-white{color:var(--label-white)}.text-action{color:var(--label-action)}.text-danger{color:var(--label-danger)}.text-success{color:var(--label-status-success)}.text-error{color:var(--label-status-error)}.text-info{color:var(--label-status-info)}.text-warning{color:var(--label-status-alert)}.text-disabled{color:var(--label-status-disabled)}.bg-primary{background-color:var(--surface-primary)}.bg-secondary{background-color:var(--surface-secondary)}.bg-tertiary{background-color:var(--surface-tertiary)}.bg-success{background-color:var(--surface-status-success)}.bg-error{background-color:var(--surface-status-error)}.bg-warning{background-color:var(--surface-status-alert)}.bg-info{background-color:var(--surface-status-info)}.bg-action-soft{background-color:var(--surface-action-soft)}.bg-danger-soft{background-color:var(--surface-danger-soft)}.border-primary{border-color:var(--border-primary)}.border-secondary{border-color:var(--border-secondary)}.border-selected{border-color:var(--border-selected)}.border-action{border-color:var(--border-action)}.border-success{border-color:var(--border-status-success)}.border-error{border-color:var(--border-status-error)}.border-warning{border-color:var(--border-status-alert)}.border-info{border-color:var(--border-status-info)}:root{--radius-zero:0px;--radius-xs:1px;--radius-sm:2px;--radius-md:4px;--radius-reg:8px;--radius-lg:16px;--radius-xl:24px;--spacing-zero:0px;--spacing-xxs:1px;--spacing-xs:2px;--spacing-sm:4px;--spacing-md:8px;--spacing-reg:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-xxl:64px;--spacing-super:128px;--container-padding-mobile:16px;--opacity-0:0;--opacity-10:0.1;--opacity-20:0.2;--opacity-30:0.3;--opacity-40:0.4;--opacity-50:0.5;--opacity-60:0.6;--opacity-70:0.7;--opacity-80:0.8;--opacity-90:0.9;--opacity-100:1;--color-success-fill:#2d6b18;--color-success-background:#eef9ea;--color-success-border:#c9ecbd;--color-error-fill:#cc3c35;--color-error-background:#fceceb;--color-error-border:#f5c4c2;--color-alert-fill:#fd7e14;--color-alert-background:#fcf6e7;--color-alert-border:#f6e3b4;--color-info-fill:#0e8ce2;--color-info-background:#e7f4fc;--color-info-border:#b4dbf6;--surfaces-status-background-success:var(--color-success-background);--surfaces-status-background-error:var(--color-error-background);--surfaces-status-background-alert:var(--color-alert-background);--surfaces-status-background-info:var(--color-info-background);--borders-status-border-success:var(--color-success-border);--borders-status-border-error:var(--color-error-border);--borders-status-border-alert:var(--color-alert-border);--borders-status-border-info:var(--color-info-border);--fills-status-fill-success:var(--color-success-fill);--fills-status-fill-error:var(--color-error-fill);--fills-status-fill-alert:var(--color-alert-fill);--fills-status-fill-info:var(--color-info-fill);--font-family-sans:\"Geist\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",\"Roboto\",\"Helvetica Neue\",Arial,sans-serif;--font-family-mono:\"Geist Mono\",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--heading-xxl-size:44px;--heading-xxl-line:48px;--heading-xxl-weight:600;--heading-xl-size:32px;--heading-xl-line:36px;--heading-xl-weight:700;--heading-h1-size:24px;--heading-h1-line:28px;--heading-h1-weight:600;--heading-h2-size:20px;--heading-h2-line:24px;--heading-h2-weight:600;--heading-h3-size:17px;--heading-h3-line:20px;--heading-h3-weight:600;--heading-h4-size:15px;--heading-h4-line:18px;--heading-h4-weight:600;--heading-h5-size:13px;--heading-h5-line:16px;--heading-h5-weight:500;--heading-h6-size:11px;--heading-h6-line:14px;--heading-h6-weight:500;--heading-xxl-mobile-size:32px;--heading-xxl-mobile-line:36px;--heading-xxl-mobile-weight:600;--heading-xl-mobile-size:26px;--heading-xl-mobile-line:30px;--heading-xl-mobile-weight:700;--heading-h1-mobile-size:20px;--heading-h1-mobile-line:23px;--heading-h1-mobile-weight:600;--heading-h2-mobile-size:18px;--heading-h2-mobile-line:22px;--heading-h2-mobile-weight:600;--heading-h3-mobile-size:16px;--heading-h3-mobile-line:18px;--heading-h3-mobile-weight:600;--heading-h4-mobile-size:14px;--heading-h4-mobile-line:16px;--heading-h4-mobile-weight:600;--heading-h5-mobile-size:13px;--heading-h5-mobile-line:16px;--heading-h5-mobile-weight:500;--heading-h6-mobile-size:11px;--heading-h6-mobile-line:14px;--heading-h6-mobile-weight:500;--text-xl-size:20px;--text-xl-line:26px;--text-xl-weight:400;--text-large-size:18px;--text-large-line:24px;--text-large-weight:400;--text-regular-size:15px;--text-regular-line:20px;--text-regular-weight:400;--text-small-size:13px;--text-small-line:16px;--text-small-weight:400;--text-small-emphasis-weight:500;--text-small-bold-weight:600;--text-xs-size:10px;--text-xs-line:13px;--text-xs-weight:500;--text-xs-bold-weight:600}.waiver-template-form-section{gap:var(--padding-reg,16px)}.waiver-template-form-group,.waiver-template-form-section{align-items:flex-start;align-self:stretch;display:flex;flex-direction:column}.waiver-template-form-group{gap:var(--padding-lg,24px)}.text-description{color:var(--label-secondary,#626a90);font-family:var(--font-family-sans,\"Geist\",sans-serif);font-size:16px;font-style:normal;line-height:24px}.alert{align-items:center;border:2px solid var(--borders-status-border-success,#c9ecbd);border-radius:var(--radius-reg,8px);box-sizing:border-box;display:flex;justify-content:space-between;padding:var(--padding-reg,16px);width:100%}.alert,.alert--success{background:var(--surfaces-status-background-success,#eef9ea)}.alert--success{border-color:var(--borders-status-border-success,#c9ecbd)}.alert--success .alert__dismiss svg path{stroke:var(--fills-status-fill-success,#2d6b18)}.alert--error{background:var(--surfaces-status-background-error,#fceceb);border-color:var(--borders-status-border-error,#f5c4c2)}.alert--error .alert__dismiss svg path{stroke:var(--fills-status-fill-error,#cc3c35)}.alert--alert{background:var(--surfaces-status-background-alert,#fcf6e7);border-color:var(--borders-status-border-alert,#f6e3b4)}.alert--alert .alert__dismiss svg path{stroke:var(--fills-status-fill-alert,#fd7e14)}.alert--info{background:var(--surfaces-status-background-info,#e7f4fc);border-color:var(--borders-status-border-info,#b4dbf6)}.alert--info .alert__dismiss svg path{stroke:var(--fills-status-fill-info,#0e8ce2)}.alert__content{flex:1 0 0;gap:16px;min-height:0;min-width:0}.alert__content,.alert__icon{align-items:center;display:flex}.alert__icon{flex-shrink:0;height:32px;justify-content:center;overflow:hidden;position:relative;width:32px}.alert__icon svg{height:18px;width:18px}.alert__details{flex:1 0 0;justify-content:center;min-height:0;min-width:0}.alert__details,.alert__information{align-items:flex-start;display:flex;flex-direction:column;gap:4px}.alert__information{color:var(--labels-main-label-primary,#121e52);font-size:15px;line-height:normal;position:relative;text-align:left;white-space:pre-wrap;width:100%}.alert__title{font-weight:600;line-height:18px}.alert__message,.alert__title{color:var(--labels-main-label-primary,#121e52);font-family:Geist,sans-serif;font-size:15px;margin:0}.alert__message{font-weight:400;line-height:20px;max-width:720px}.alert__link{align-items:center;cursor:pointer;display:flex;gap:8px}.alert__link:hover{opacity:.8}.alert__link-text{color:var(--labels-main-label-primary,#121e52);font-family:Geist,sans-serif;font-size:15px;font-weight:500;line-height:20px;margin:0}.alert__link-icon{flex-shrink:0;height:24px;overflow:hidden;position:relative;width:24px}.alert__link-icon svg{display:block;height:100%;width:100%}.alert__dismiss{align-items:center;cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;overflow:hidden;transition:opacity .2s ease;width:32px}.alert__dismiss:hover{opacity:.7}.alert__dismiss svg{display:block;height:100%;width:100%}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/dist/v2/components/NPSScore/NPSScore.d.ts CHANGED
@@ -5,8 +5,10 @@ export interface NPSScoreProps {
5
5
  firstName?: string;
6
6
  /** Callback when NPS is submitted */
7
7
  onSubmit?: (data: NPSSubmitData) => void;
8
- /** Callback when dismissed */
8
+ /** Callback when dismissed without submitting */
9
9
  onDismiss?: () => void;
10
+ /** Callback when success alert is dismissed after submission */
11
+ onSubmitDismiss?: () => void;
10
12
  }
11
13
  export interface NPSSubmitData {
12
14
  score: number;
package/dist/v2/components/NPSScore/NPSScore.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"NPSScore.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/NPSScore/NPSScore.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,iBAAiB,CAAA;AAIxB,MAAM,WAAW,aAAa;IAC1B,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAA;IACxC,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACzB;AAED,MAAM,WAAW,aAAa;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;CAClB;AAwBD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoK5C,CAAA;AAED,eAAe,QAAQ,CAAA"}
1
+ {"version":3,"file":"NPSScore.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/NPSScore/NPSScore.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,iBAAiB,CAAA;AAIxB,MAAM,WAAW,aAAa;IAC1B,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAA;IACxC,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,gEAAgE;IAChE,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;CAC/B;AAED,MAAM,WAAW,aAAa;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;CAClB;AAwBD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAiK5C,CAAA;AAED,eAAe,QAAQ,CAAA"}
package/dist/v2/components/NPSScore/NPSScore.js CHANGED
@@ -282,7 +282,7 @@ var IconBigSmile = function(param) {
282
282
  });
283
283
  };
284
284
  var NPSScore = function(param) {
285
- var firstName = param.firstName, onSubmit = param.onSubmit, onDismiss = param.onDismiss;
285
+ var firstName = param.firstName, onSubmit = param.onSubmit; param.onDismiss; var onSubmitDismiss = param.onSubmitDismiss;
286
286
  var _useState = _sliced_to_array(useState(null), 2), selectedScore = _useState[0], setSelectedScore = _useState[1];
287
287
  var _useState1 = _sliced_to_array(useState(''), 2), reason = _useState1[0], setReason = _useState1[1];
288
288
  var _useState2 = _sliced_to_array(useState(''), 2), role = _useState2[0], setRole = _useState2[1];
@@ -299,11 +299,7 @@ var NPSScore = function(param) {
299
299
  if (!selectedScore) return [
300
300
  2
301
301
  ];
302
- // Validate required fields - reason required for all scores
303
302
  newErrors = {};
304
- if (!reason.trim()) {
305
- newErrors.reason = 'Please provide a reason for your score';
306
- }
307
303
  if (!role) {
308
304
  newErrors.role = 'Please select your role';
309
305
  }
@@ -361,7 +357,7 @@ var NPSScore = function(param) {
361
357
  variant: "success",
362
358
  title: "Thank you!",
363
359
  message: "Your feedback has been submitted successfully.",
364
- onDismiss: onDismiss
360
+ onDismiss: onSubmitDismiss
365
361
  })
366
362
  });
367
363
  }
@@ -449,7 +445,7 @@ var NPSScore = function(param) {
449
445
  children: [
450
446
  /*#__PURE__*/ jsx("label", {
451
447
  className: "nps-score__field-label",
452
- children: "Reason for this score?"
448
+ children: "Reason for this score? (Optional)"
453
449
  }),
454
450
  /*#__PURE__*/ jsx("textarea", {
455
451
  value: reason,
package/dist/v2/components/NPSScore/NPSScore.scss.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".nps-score{box-sizing:border-box;margin-top:24px;padding:0 1rem;width:100%}.nps-score__container{background:var(--surface-secondary);border:1px solid var(--border-primary);border-radius:16px;padding:24px}.nps-score__question{color:var(--label-primary);font-family:var(--font-family-sans);font-size:18px;font-weight:600;line-height:24px;margin:0 0 16px}.nps-score__labels{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px}.nps-score__label{align-items:center;display:flex;gap:8px}.nps-score__label span{color:var(--label-secondary);font-family:var(--font-family-sans);font-size:14px;font-weight:500}.nps-score__label--desktop{display:none}@media (min-width:768px){.nps-score__label--desktop{display:flex}}.nps-score__label--mobile{display:flex;justify-content:flex-end;margin-top:12px}@media (min-width:768px){.nps-score__label--mobile{display:none}}.nps-score__label-icon{color:var(--fill-secondary);flex-shrink:0}.nps-score__buttons{display:grid;gap:8px;grid-template-columns:repeat(5,1fr)}@media (min-width:768px){.nps-score__buttons{grid-template-columns:repeat(10,1fr)}}.nps-score__button{background:var(--surface-primary);border:1px solid var(--border-primary);border-radius:12px;color:var(--label-primary);cursor:pointer;font-family:var(--font-family-sans);font-size:18px;font-weight:600;height:48px;transition:all .2s ease}.nps-score__button:hover:not(.nps-score__button--selected){background:var(--surface-primary-hover)}.nps-score__button--selected{background:var(--fill-primary);border-color:#0000;color:var(--label-primary-alt)}.nps-score__expanded{animation:nps-fade-in .2s ease;display:flex;flex-direction:column;gap:16px;margin-top:16px}.nps-score__field--roles{padding-top:16px}.nps-score__field-label{color:var(--label-primary);display:block;font-family:var(--font-family-sans);font-size:14px;font-weight:500;margin-bottom:8px}.nps-score__field-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:8px}.nps-score__optional{color:var(--label-secondary)}.nps-score__optional,.nps-score__textarea{font-family:var(--font-family-sans);font-size:14px}.nps-score__textarea{background:var(--surface-primary);border:1px solid var(--border-primary);border-radius:8px;box-sizing:border-box;color:var(--label-primary);min-height:100px;padding:12px;resize:vertical;width:100%}.nps-score__textarea::placeholder{color:var(--label-secondary)}.nps-score__textarea:focus{border-color:var(--fill-primary);outline:none}.nps-score__textarea--error{border-color:var(--fill-danger)}.nps-score__hint{color:var(--label-secondary)}.nps-score__error,.nps-score__hint{font-family:var(--font-family-sans);font-size:14px;margin:4px 0 0}.nps-score__error{color:var(--fill-danger)}.nps-score__add-comment{background:none;border:none;cursor:pointer;font-family:var(--font-family-sans);font-size:14px;font-weight:500;padding:0;text-decoration:underline;transition:color .2s ease}.nps-score__add-comment,.nps-score__add-comment:hover{color:var(--label-action)}.nps-score__roles{display:grid;gap:8px;grid-template-columns:1fr}@media (min-width:640px){.nps-score__roles{gap:4px;grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.nps-score__roles{grid-template-columns:repeat(3,1fr)}}.nps-score__role{align-items:center;cursor:pointer;display:flex;gap:8px;position:relative}.nps-score__role-input{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:var(--surface-primary);border:2px solid var(--border-primary);border-radius:50%;cursor:pointer;flex-shrink:0;height:20px;margin:0;position:relative;transition:border-color .2s ease;width:20px}.nps-score__role-input:before{background:var(--fill-primary);border-radius:50%;content:\"\";height:10px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0);transition:transform .2s ease;width:10px}.nps-score__role-input:checked{border-color:var(--fill-primary)}.nps-score__role-input:checked:before{transform:translate(-50%,-50%) scale(1)}.nps-score__role-input:focus{box-shadow:0 0 0 2px var(--border-action);outline:none}.nps-score__role-radio{display:none}.nps-score__role-label{color:var(--label-primary);font-family:var(--font-family-sans);font-size:14px}.nps-score__success{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:32px;text-align:center}.nps-score__success-icon{color:var(--fill-status-success);margin-bottom:16px}.nps-score__success-title{color:var(--label-primary);font-family:var(--font-family-sans);font-size:24px;font-weight:600;margin:0 0 8px}.nps-score__success-message{color:var(--label-secondary);font-family:var(--font-family-sans);font-size:14px;margin:0}@keyframes nps-fade-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}";
3
+ var css_248z = ".nps-score{box-sizing:border-box;margin-top:24px;padding:0 1rem;width:100%}@media (max-width:576px){.nps-score{padding:0 16px}}.nps-score__container{background:var(--surface-secondary);border:1px solid var(--border-primary);border-radius:16px;padding:24px}.nps-score__question{color:var(--label-primary);font-family:var(--font-family-sans);font-size:18px;font-weight:600;line-height:24px;margin:0 0 16px}.nps-score__labels{align-items:center;display:flex;justify-content:space-between;margin-bottom:12px}.nps-score__label{align-items:center;display:flex;gap:8px}.nps-score__label span{color:var(--label-secondary);font-family:var(--font-family-sans);font-size:14px;font-weight:500}.nps-score__label--desktop{display:none}@media (min-width:768px){.nps-score__label--desktop{display:flex}}.nps-score__label--mobile{display:flex;justify-content:flex-end;margin-top:12px}@media (min-width:768px){.nps-score__label--mobile{display:none}}.nps-score__label-icon{color:var(--fill-secondary);flex-shrink:0}.nps-score__buttons{display:grid;gap:8px;grid-template-columns:repeat(5,1fr)}@media (min-width:768px){.nps-score__buttons{grid-template-columns:repeat(10,1fr)}}.nps-score__button{background:var(--surface-primary);border:1px solid var(--border-primary);border-radius:12px;color:var(--label-primary);cursor:pointer;font-family:var(--font-family-sans);font-size:18px;font-weight:600;height:48px;transition:all .2s ease}.nps-score__button:hover:not(.nps-score__button--selected){background:var(--surface-primary-hover)}.nps-score__button--selected{background:var(--fill-primary);border-color:#0000;color:var(--label-primary-alt)}.nps-score__expanded{animation:nps-fade-in .2s ease;display:flex;flex-direction:column;gap:16px;margin-top:16px}.nps-score__field--roles{padding-top:16px}.nps-score__field-label{color:var(--label-primary);display:block;font-family:var(--font-family-sans);font-size:14px;font-weight:500;margin-bottom:8px}.nps-score__field-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:8px}.nps-score__optional{color:var(--label-secondary)}.nps-score__optional,.nps-score__textarea{font-family:var(--font-family-sans);font-size:14px}.nps-score__textarea{background:var(--surface-primary);border:1px solid var(--border-primary);border-radius:8px;box-sizing:border-box;color:var(--label-primary);min-height:100px;padding:12px;resize:vertical;width:100%}.nps-score__textarea::placeholder{color:var(--label-secondary)}.nps-score__textarea:focus{border-color:var(--fill-primary);outline:none}.nps-score__textarea--error{border-color:var(--fill-danger)}.nps-score__hint{color:var(--label-secondary)}.nps-score__error,.nps-score__hint{font-family:var(--font-family-sans);font-size:14px;margin:4px 0 0}.nps-score__error{color:var(--fill-danger)}.nps-score__add-comment{background:none;border:none;cursor:pointer;font-family:var(--font-family-sans);font-size:14px;font-weight:500;padding:0;text-decoration:underline;transition:color .2s ease}.nps-score__add-comment,.nps-score__add-comment:hover{color:var(--label-action)}.nps-score__roles{display:grid;gap:8px;grid-template-columns:1fr}@media (min-width:640px){.nps-score__roles{gap:4px;grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.nps-score__roles{grid-template-columns:repeat(3,1fr)}}.nps-score__role{align-items:center;cursor:pointer;display:flex;gap:8px;position:relative}.nps-score__role-input{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:var(--surface-primary);border:2px solid var(--border-primary);border-radius:50%;cursor:pointer;flex-shrink:0;height:20px;margin:0;position:relative;transition:border-color .2s ease;width:20px}.nps-score__role-input:before{background:var(--fill-primary);border-radius:50%;content:\"\";height:10px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0);transition:transform .2s ease;width:10px}.nps-score__role-input:checked{border-color:var(--fill-primary)}.nps-score__role-input:checked:before{transform:translate(-50%,-50%) scale(1)}.nps-score__role-input:focus{box-shadow:0 0 0 2px var(--border-action);outline:none}.nps-score__role-radio{display:none}.nps-score__role-label{color:var(--label-primary);font-family:var(--font-family-sans);font-size:14px}.nps-score__success{align-items:center;display:flex;flex-direction:column;justify-content:center;padding:32px;text-align:center}.nps-score__success-icon{color:var(--fill-status-success);margin-bottom:16px}.nps-score__success-title{color:var(--label-primary);font-family:var(--font-family-sans);font-size:24px;font-weight:600;margin:0 0 8px}.nps-score__success-message{color:var(--label-secondary);font-family:var(--font-family-sans);font-size:14px;margin:0}@keyframes nps-fade-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@licklist/design",
3
- "version": "0.78.5-dev.57",
3
+ "version": "0.78.5-dev.58",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+ssh://git@bitbucket.org/bookedit-licklist/licklist_design.git"
package/src/v2/components/Alert/Alert.scss CHANGED
@@ -16,10 +16,6 @@
16
16
  background: var(--surfaces-status-background-success, #eef9ea);
17
17
  border-color: var(--borders-status-border-success, #c9ecbd);
18
18
 
19
- .alert__icon {
20
- background-image: url("./assets/success-icon.svg");
21
- }
22
-
23
19
  .alert__dismiss svg path {
24
20
  stroke: var(--fills-status-fill-success, #2d6b18);
25
21
  }
@@ -29,10 +25,6 @@
29
25
  background: var(--surfaces-status-background-error, #fceceb);
30
26
  border-color: var(--borders-status-border-error, #f5c4c2);
31
27
 
32
- .alert__icon {
33
- background-image: url("./assets/error-icon.svg");
34
- }
35
-
36
28
  .alert__dismiss svg path {
37
29
  stroke: var(--fills-status-fill-error, #cc3c35);
38
30
  }
@@ -42,10 +34,6 @@
42
34
  background: var(--surfaces-status-background-alert, #fcf6e7);
43
35
  border-color: var(--borders-status-border-alert, #f6e3b4);
44
36
 
45
- .alert__icon {
46
- background-image: url("./assets/alert-icon.svg");
47
- }
48
-
49
37
  .alert__dismiss svg path {
50
38
  stroke: var(--fills-status-fill-alert, #fd7e14);
51
39
  }
@@ -55,10 +43,6 @@
55
43
  background: var(--surfaces-status-background-info, #e7f4fc);
56
44
  border-color: var(--borders-status-border-info, #b4dbf6);
57
45
 
58
- .alert__icon {
59
- background-image: url("./assets/info-icon.svg");
60
- }
61
-
62
46
  .alert__dismiss svg path {
63
47
  stroke: var(--fills-status-fill-info, #0e8ce2);
64
48
  }
@@ -78,10 +62,15 @@
78
62
  flex-shrink: 0;
79
63
  width: 32px;
80
64
  height: 32px;
81
- background-size: contain;
82
- background-position: center;
83
- background-repeat: no-repeat;
65
+ display: flex;
66
+ align-items: center;
67
+ justify-content: center;
84
68
  position: relative;
69
+
70
+ svg {
71
+ width: 18px;
72
+ height: 18px;
73
+ }
85
74
  }
86
75
 
87
76
  &__details {
package/src/v2/components/Alert/Alert.tsx CHANGED
@@ -3,6 +3,29 @@ import './Alert.scss';
3
3
 
4
4
  export type AlertVariant = 'success' | 'error' | 'alert' | 'info';
5
5
 
6
+ const variantIcons: Record<AlertVariant, React.ReactNode> = {
7
+ success: (
8
+ <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
9
+ <path d="M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM7.44629 10.6055L5.72168 8.80762L4.27832 10.1924L7.35254 13.3945L14.6729 6.74023L13.3271 5.25977L7.44629 10.6055Z" fill="var(--fills-status-fill-success, #2D6B18)"/>
10
+ </svg>
11
+ ),
12
+ error: (
13
+ <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
14
+ <path d="M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM9 12.5C8.44772 12.5 8 12.9477 8 13.5C8 14.0523 8.44772 14.5 9 14.5C9.55228 14.5 10 14.0523 10 13.5C10 12.9477 9.55228 12.5 9 12.5ZM9 3.5C8.44772 3.5 8 3.94772 8 4.5V10.5C8 11.0523 8.44772 11.5 9 11.5C9.55228 11.5 10 11.0523 10 10.5V4.5C10 3.94772 9.55228 3.5 9 3.5Z" fill="var(--fills-status-fill-error, #CC3C35)"/>
15
+ </svg>
16
+ ),
17
+ alert: (
18
+ <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
19
+ <path d="M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM9 12.5C8.44772 12.5 8 12.9477 8 13.5C8 14.0523 8.44772 14.5 9 14.5C9.55228 14.5 10 14.0523 10 13.5C10 12.9477 9.55228 12.5 9 12.5ZM9 3.5C8.44772 3.5 8 3.94772 8 4.5V10.5C8 11.0523 8.44772 11.5 9 11.5C9.55228 11.5 10 11.0523 10 10.5V4.5C10 3.94772 9.55228 3.5 9 3.5Z" fill="var(--fills-status-fill-alert, #FD7E14)"/>
20
+ </svg>
21
+ ),
22
+ info: (
23
+ <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
24
+ <path d="M9 0C13.9706 0 18 4.02944 18 9C18 13.9706 13.9706 18 9 18C4.02944 18 0 13.9706 0 9C0 4.02944 4.02944 0 9 0ZM9 7.5C8.44772 7.5 8 7.94772 8 8.5V13.5C8 14.0523 8.44772 14.5 9 14.5C9.55228 14.5 10 14.0523 10 13.5V8.5C10 7.94772 9.55228 7.5 9 7.5ZM9 3.5C8.44772 3.5 8 3.94772 8 4.5C8 5.05228 8.44772 5.5 9 5.5C9.55228 5.5 10 5.05228 10 4.5C10 3.94772 9.55228 3.5 9 3.5Z" fill="var(--fills-status-fill-info, #0E8CE2)"/>
25
+ </svg>
26
+ ),
27
+ };
28
+
6
29
  export interface AlertProps {
7
30
  variant: AlertVariant;
8
31
  title: string;
@@ -30,7 +53,7 @@ export const Alert: React.FC<AlertProps> = ({
30
53
  <div className={`alert alert--${variant} ${className || ''}`}>
31
54
  <div className="alert__content">
32
55
  <div className="alert__icon">
33
- {/* Icon SVG will be handled by background images in SCSS */}
56
+ {variantIcons[variant]}
34
57
  </div>
35
58
  <div className="alert__details">
36
59
  <div className="alert__information">
package/src/v2/components/NPSScore/NPSScore.scss CHANGED
@@ -4,6 +4,10 @@
4
4
  padding: 0 1rem;
5
5
  box-sizing: border-box;
6
6
 
7
+ @media (max-width: 576px) {
8
+ padding: 0 16px;
9
+ }
10
+
7
11
  &__container {
8
12
  background: var(--surface-secondary);
9
13
  border-radius: 16px;
package/src/v2/components/NPSScore/NPSScore.tsx CHANGED
@@ -8,8 +8,10 @@ export interface NPSScoreProps {
8
8
  firstName?: string
9
9
  /** Callback when NPS is submitted */
10
10
  onSubmit?: (data: NPSSubmitData) => void
11
- /** Callback when dismissed */
11
+ /** Callback when dismissed without submitting */
12
12
  onDismiss?: () => void
13
+ /** Callback when success alert is dismissed after submission */
14
+ onSubmitDismiss?: () => void
13
15
  }
14
16
 
15
17
  export interface NPSSubmitData {
@@ -44,6 +46,7 @@ export const NPSScore: React.FC<NPSScoreProps> = ({
44
46
  firstName,
45
47
  onSubmit,
46
48
  onDismiss,
49
+ onSubmitDismiss,
47
50
  }) => {
48
51
  const [selectedScore, setSelectedScore] = useState<number | null>(null)
49
52
  const [reason, setReason] = useState('')
@@ -56,11 +59,7 @@ export const NPSScore: React.FC<NPSScoreProps> = ({
56
59
  const handleSubmit = async () => {
57
60
  if (!selectedScore) return
58
61
 
59
- // Validate required fields - reason required for all scores
60
62
  const newErrors: { reason?: string; role?: string } = {}
61
- if (!reason.trim()) {
62
- newErrors.reason = 'Please provide a reason for your score'
63
- }
64
63
  if (!role) {
65
64
  newErrors.role = 'Please select your role'
66
65
  }
@@ -92,7 +91,7 @@ export const NPSScore: React.FC<NPSScoreProps> = ({
92
91
  variant="success"
93
92
  title="Thank you!"
94
93
  message="Your feedback has been submitted successfully."
95
- onDismiss={onDismiss}
94
+ onDismiss={onSubmitDismiss}
96
95
  />
97
96
  </div>
98
97
  )
@@ -143,7 +142,7 @@ export const NPSScore: React.FC<NPSScoreProps> = ({
143
142
  {/* Reason textarea - always visible */}
144
143
  <div className="nps-score__field">
145
144
  <label className="nps-score__field-label">
146
- Reason for this score?
145
+ Reason for this score? (Optional)
147
146
  </label>
148
147
  <textarea
149
148
  value={reason}