@doist/reactist 22.0.3-beta → 22.0.4-beta

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 (47) hide show
  1. package/dist/reactist.cjs.development.js +26 -22
  2. package/dist/reactist.cjs.development.js.map +1 -1
  3. package/dist/reactist.cjs.production.min.js +1 -1
  4. package/dist/reactist.cjs.production.min.js.map +1 -1
  5. package/es/alert/alert.js +4 -3
  6. package/es/alert/alert.js.map +1 -1
  7. package/es/alert/alert.module.css.js +1 -1
  8. package/es/badge/badge.module.css.js +1 -1
  9. package/es/base-field/base-field.module.css.js +1 -1
  10. package/es/icons/alert-icon.js +12 -12
  11. package/es/icons/alert-icon.js.map +1 -1
  12. package/es/prose/prose.module.css.js +1 -1
  13. package/es/select-field/select-field.module.css.js +1 -1
  14. package/es/text-area/text-area.module.css.js +1 -1
  15. package/es/text-field/text-field.module.css.js +1 -1
  16. package/es/tooltip/tooltip.js +3 -0
  17. package/es/tooltip/tooltip.js.map +1 -1
  18. package/lib/alert/alert.js +1 -1
  19. package/lib/alert/alert.js.map +1 -1
  20. package/lib/alert/alert.module.css.js +1 -1
  21. package/lib/badge/badge.module.css.js +1 -1
  22. package/lib/base-field/base-field.module.css.js +1 -1
  23. package/lib/icons/alert-icon.js +1 -1
  24. package/lib/icons/alert-icon.js.map +1 -1
  25. package/lib/prose/prose.module.css.js +1 -1
  26. package/lib/select-field/select-field.module.css.js +1 -1
  27. package/lib/text-area/text-area.module.css.js +1 -1
  28. package/lib/text-field/text-field.module.css.js +1 -1
  29. package/lib/tooltip/tooltip.js.map +1 -1
  30. package/package.json +3 -3
  31. package/styles/alert.css +1 -1
  32. package/styles/alert.module.css.css +1 -1
  33. package/styles/badge.css +1 -1
  34. package/styles/badge.module.css.css +1 -1
  35. package/styles/base-field.css +1 -1
  36. package/styles/base-field.module.css.css +1 -1
  37. package/styles/password-field.css +2 -2
  38. package/styles/prose.css +1 -1
  39. package/styles/prose.module.css.css +1 -1
  40. package/styles/reactist.css +8 -8
  41. package/styles/select-field.css +2 -2
  42. package/styles/select-field.module.css.css +1 -1
  43. package/styles/switch-field.css +1 -1
  44. package/styles/text-area.css +2 -2
  45. package/styles/text-area.module.css.css +1 -1
  46. package/styles/text-field.css +2 -2
  47. package/styles/text-field.module.css.css +1 -1
package/es/alert/alert.js CHANGED
@@ -18,15 +18,16 @@ function Alert({
18
18
  id: id,
19
19
  role: "alert",
20
20
  "aria-live": "polite",
21
- borderRadius: "standard",
21
+ borderRadius: "full",
22
22
  className: [styles.container, getClassNames(styles, 'tone', tone)]
23
23
  }, /*#__PURE__*/createElement(Columns, {
24
24
  space: "small",
25
- alignY: "top"
25
+ alignY: "center"
26
26
  }, /*#__PURE__*/createElement(Column, {
27
27
  width: "content"
28
28
  }, /*#__PURE__*/createElement(AlertIcon, {
29
- tone: tone
29
+ tone: tone,
30
+ className: styles.icon
30
31
  })), /*#__PURE__*/createElement(Column, null, /*#__PURE__*/createElement(Box, {
31
32
  paddingY: "xsmall",
32
33
  paddingRight: onClose != null && closeLabel != null ? undefined : 'small'
@@ -1 +1 @@
1
- {"version":3,"file":"alert.js","sources":["../../src/alert/alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport { Button } from '../button'\nimport { Columns, Column } from '../columns'\n\nimport { AlertIcon } from '../icons/alert-icon'\nimport { CloseIcon } from '../icons/close-icon'\n\nimport styles from './alert.module.css'\n\nimport type { AlertTone } from '../utils/common-types'\n\ntype AllOrNone<T> = T | { [K in keyof T]?: never }\n\ntype AlertCloseProps = AllOrNone<{\n closeLabel: string\n onClose: () => void\n}>\n\ntype AlertProps = {\n id?: string\n children: React.ReactNode\n tone: AlertTone\n} & AlertCloseProps\n\nfunction Alert({ id, children, tone, closeLabel, onClose }: AlertProps) {\n return (\n <Box\n id={id}\n role=\"alert\"\n aria-live=\"polite\"\n borderRadius=\"standard\"\n className={[styles.container, getClassNames(styles, 'tone', tone)]}\n >\n <Columns space=\"small\" alignY=\"top\">\n <Column width=\"content\">\n <AlertIcon tone={tone} />\n </Column>\n <Column>\n <Box\n paddingY=\"xsmall\"\n paddingRight={onClose != null && closeLabel != null ? undefined : 'small'}\n >\n {children}\n </Box>\n </Column>\n {onClose != null && closeLabel != null ? (\n <Column width=\"content\">\n <Button\n variant=\"quaternary\"\n size=\"small\"\n onClick={onClose}\n aria-label={closeLabel}\n icon={<CloseIcon />}\n style={{\n // @ts-expect-error not sure how to make TypeScript understand custom CSS properties\n '--reactist-btn-hover-fill': 'transparent',\n }}\n />\n </Column>\n ) : null}\n </Columns>\n </Box>\n )\n}\n\nexport { Alert }\nexport type { AlertProps }\n"],"names":["Alert","id","children","tone","closeLabel","onClose","React","Box","role","borderRadius","className","styles","container","getClassNames","Columns","space","alignY","Column","width","AlertIcon","paddingY","paddingRight","undefined","Button","variant","size","onClick","icon","CloseIcon","style"],"mappings":";;;;;;;;;AA0BA,SAASA,KAAT,CAAe;EAAEC,EAAF;EAAMC,QAAN;EAAgBC,IAAhB;EAAsBC,UAAtB;EAAkCC;AAAlC,CAAf;EACI,oBACIC,aAAA,CAACC,GAAD;IACIN,EAAE,EAAEA;IACJO,IAAI,EAAC;iBACK;IACVC,YAAY,EAAC;IACbC,SAAS,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmBC,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBR,IAAjB,CAAhC;GALf,eAOIG,aAAA,CAACQ,OAAD;IAASC,KAAK,EAAC;IAAQC,MAAM,EAAC;GAA9B,eACIV,aAAA,CAACW,MAAD;IAAQC,KAAK,EAAC;GAAd,eACIZ,aAAA,CAACa,SAAD;IAAWhB,IAAI,EAAEA;GAAjB,CADJ,CADJ,eAIIG,aAAA,CAACW,MAAD,MAAA,eACIX,aAAA,CAACC,GAAD;IACIa,QAAQ,EAAC;IACTC,YAAY,EAAEhB,OAAO,IAAI,IAAX,IAAmBD,UAAU,IAAI,IAAjC,GAAwCkB,SAAxC,GAAoD;GAFtE,EAIKpB,QAJL,CADJ,CAJJ,EAYKG,OAAO,IAAI,IAAX,IAAmBD,UAAU,IAAI,IAAjC,gBACGE,aAAA,CAACW,MAAD;IAAQC,KAAK,EAAC;GAAd,eACIZ,aAAA,CAACiB,MAAD;IACIC,OAAO,EAAC;IACRC,IAAI,EAAC;IACLC,OAAO,EAAErB;kBACGD;IACZuB,IAAI,eAAErB,aAAA,CAACsB,SAAD,MAAA;IACNC,KAAK,EAAE;;MAEH,6BAA6B;;GARrC,CADJ,CADH,GAcG,IA1BR,CAPJ,CADJ;AAsCH;;;;"}
1
+ {"version":3,"file":"alert.js","sources":["../../src/alert/alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport { Button } from '../button'\nimport { Columns, Column } from '../columns'\n\nimport { AlertIcon } from '../icons/alert-icon'\nimport { CloseIcon } from '../icons/close-icon'\n\nimport styles from './alert.module.css'\n\nimport type { AlertTone } from '../utils/common-types'\n\ntype AllOrNone<T> = T | { [K in keyof T]?: never }\n\ntype AlertCloseProps = AllOrNone<{\n closeLabel: string\n onClose: () => void\n}>\n\ntype AlertProps = {\n id?: string\n children: React.ReactNode\n tone: AlertTone\n} & AlertCloseProps\n\nfunction Alert({ id, children, tone, closeLabel, onClose }: AlertProps) {\n return (\n <Box\n id={id}\n role=\"alert\"\n aria-live=\"polite\"\n borderRadius=\"full\"\n className={[styles.container, getClassNames(styles, 'tone', tone)]}\n >\n <Columns space=\"small\" alignY=\"center\">\n <Column width=\"content\">\n <AlertIcon tone={tone} className={styles.icon} />\n </Column>\n <Column>\n <Box\n paddingY=\"xsmall\"\n paddingRight={onClose != null && closeLabel != null ? undefined : 'small'}\n >\n {children}\n </Box>\n </Column>\n {onClose != null && closeLabel != null ? (\n <Column width=\"content\">\n <Button\n variant=\"quaternary\"\n size=\"small\"\n onClick={onClose}\n aria-label={closeLabel}\n icon={<CloseIcon />}\n style={{\n // @ts-expect-error not sure how to make TypeScript understand custom CSS properties\n '--reactist-btn-hover-fill': 'transparent',\n }}\n />\n </Column>\n ) : null}\n </Columns>\n </Box>\n )\n}\n\nexport { Alert }\nexport type { AlertProps }\n"],"names":["Alert","id","children","tone","closeLabel","onClose","React","Box","role","borderRadius","className","styles","container","getClassNames","Columns","space","alignY","Column","width","AlertIcon","icon","paddingY","paddingRight","undefined","Button","variant","size","onClick","CloseIcon","style"],"mappings":";;;;;;;;;AA0BA,SAASA,KAAT,CAAe;EAAEC,EAAF;EAAMC,QAAN;EAAgBC,IAAhB;EAAsBC,UAAtB;EAAkCC;AAAlC,CAAf;EACI,oBACIC,aAAA,CAACC,GAAD;IACIN,EAAE,EAAEA;IACJO,IAAI,EAAC;iBACK;IACVC,YAAY,EAAC;IACbC,SAAS,EAAE,CAACC,MAAM,CAACC,SAAR,EAAmBC,aAAa,CAACF,MAAD,EAAS,MAAT,EAAiBR,IAAjB,CAAhC;GALf,eAOIG,aAAA,CAACQ,OAAD;IAASC,KAAK,EAAC;IAAQC,MAAM,EAAC;GAA9B,eACIV,aAAA,CAACW,MAAD;IAAQC,KAAK,EAAC;GAAd,eACIZ,aAAA,CAACa,SAAD;IAAWhB,IAAI,EAAEA;IAAMO,SAAS,EAAEC,MAAM,CAACS;GAAzC,CADJ,CADJ,eAIId,aAAA,CAACW,MAAD,MAAA,eACIX,aAAA,CAACC,GAAD;IACIc,QAAQ,EAAC;IACTC,YAAY,EAAEjB,OAAO,IAAI,IAAX,IAAmBD,UAAU,IAAI,IAAjC,GAAwCmB,SAAxC,GAAoD;GAFtE,EAIKrB,QAJL,CADJ,CAJJ,EAYKG,OAAO,IAAI,IAAX,IAAmBD,UAAU,IAAI,IAAjC,gBACGE,aAAA,CAACW,MAAD;IAAQC,KAAK,EAAC;GAAd,eACIZ,aAAA,CAACkB,MAAD;IACIC,OAAO,EAAC;IACRC,IAAI,EAAC;IACLC,OAAO,EAAEtB;kBACGD;IACZgB,IAAI,eAAEd,aAAA,CAACsB,SAAD,MAAA;IACNC,KAAK,EAAE;;MAEH,6BAA6B;;GARrC,CADJ,CADH,GAcG,IA1BR,CAPJ,CADJ;AAsCH;;;;"}
@@ -1,4 +1,4 @@
1
- var modules_6205a58e = {"container":"eb665121","tone-info":"d0373ff9","tone-positive":"bb18dcab","tone-caution":"_0af02331","tone-critical":"f76146f9"};
1
+ var modules_6205a58e = {"container":"_51a84fb3","tone-info":"_5649104a","icon":"_79fa06e2","tone-positive":"c67632e4","tone-caution":"_654ff216","tone-critical":"b1ee4ff1"};
2
2
 
3
3
  export default modules_6205a58e;
4
4
  //# sourceMappingURL=alert.module.css.js.map
@@ -1,4 +1,4 @@
1
- var modules_33c7c985 = {"badge":"_7957de66","badge-info":"c6106b8c","badge-positive":"_6b06bf87","badge-promote":"a6d2daa2","badge-attention":"bbb036ff"};
1
+ var modules_33c7c985 = {"badge":"_0a7f0497","badge-info":"_0587142f","badge-positive":"_6f5c326e","badge-promote":"_949e0f54","badge-attention":"_36115518"};
2
2
 
3
3
  export default modules_33c7c985;
4
4
  //# sourceMappingURL=badge.module.css.js.map
@@ -1,4 +1,4 @@
1
- var modules_540a88ff = {"container":"_616a033e","auxiliaryLabel":"_0b88d85e","bordered":"c466cda3","error":"_4156d9cb","primaryLabel":"_274ef80a","secondaryLabel":"_2c4a8aed","messageIcon":"cd105f69"};
1
+ var modules_540a88ff = {"container":"_7acdc928","auxiliaryLabel":"_815bad88","bordered":"e35886fe","error":"_6c7b5dc8","primaryLabel":"ec74af87","secondaryLabel":"_6db0ec44","messageIcon":"_05c35af8"};
2
2
 
3
3
  export default modules_540a88ff;
4
4
  //# sourceMappingURL=base-field.module.css.js.map
@@ -21,56 +21,56 @@ function AlertIcon(_ref) {
21
21
 
22
22
  function AlertInfoIcon(props) {
23
23
  return /*#__PURE__*/createElement("svg", _objectSpread2({
24
+ xmlns: "http://www.w3.org/2000/svg",
24
25
  width: "24",
25
26
  height: "24",
26
- fill: "none",
27
- xmlns: "http://www.w3.org/2000/svg"
27
+ viewBox: "0 0 24 24"
28
28
  }, props), /*#__PURE__*/createElement("path", {
29
29
  fillRule: "evenodd",
30
30
  clipRule: "evenodd",
31
- d: "M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm1.18-11.84a.84.84 0 1 1-1.68 0 .84.84 0 0 1 1.68 0zM12.5 10a.5.5 0 0 1 .5.5V15h1a.5.5 0 0 1 0 1h-3a.5.5 0 0 1 0-1h1v-4h-1a.5.5 0 0 1 0-1h1.5z",
31
+ d: "M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-8-3.94a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM10.25 10a.75.75 0 0 0 0 1.5h1.25V15h-1.25a.75.75 0 0 0 0 1.5h3.5a.75.75 0 0 0 0-1.5H13v-4.25a.75.75 0 0 0-.75-.75h-2Z",
32
32
  fill: "currentColor"
33
33
  }));
34
34
  }
35
35
 
36
36
  function AlertPositiveIcon(props) {
37
37
  return /*#__PURE__*/createElement("svg", _objectSpread2({
38
+ xmlns: "http://www.w3.org/2000/svg",
38
39
  width: "24",
39
40
  height: "24",
40
- fill: "none",
41
- xmlns: "http://www.w3.org/2000/svg"
41
+ viewBox: "0 0 24 24"
42
42
  }, props), /*#__PURE__*/createElement("path", {
43
43
  fillRule: "evenodd",
44
44
  clipRule: "evenodd",
45
- d: "M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm-4.354-8.104a.5.5 0 0 1 .708 0l2.146 2.147 5.146-5.147a.5.5 0 0 1 .708.708l-5.5 5.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708z",
45
+ d: "M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-5.555-2.99a.75.75 0 0 1 1.06 1.06l-5.303 5.304a.748.748 0 0 1-1.061 0l-2.475-2.475a.75.75 0 0 1 1.06-1.06l1.945 1.944 4.774-4.773Z",
46
46
  fill: "currentColor"
47
47
  }));
48
48
  }
49
49
 
50
50
  function AlertCautionIcon(props) {
51
51
  return /*#__PURE__*/createElement("svg", _objectSpread2({
52
+ xmlns: "http://www.w3.org/2000/svg",
52
53
  width: "24",
53
54
  height: "24",
54
- fill: "none",
55
- xmlns: "http://www.w3.org/2000/svg"
55
+ viewBox: "0 0 24 24"
56
56
  }, props), /*#__PURE__*/createElement("path", {
57
57
  fillRule: "evenodd",
58
58
  clipRule: "evenodd",
59
- d: "m3.254 16.992 7.018-12.03a2 2 0 0 1 3.455 0l7.018 12.03A2 2 0 0 1 19.018 20H4.982a2 2 0 0 1-1.728-3.008zm8.242-11.887a1 1 0 0 0-.36.36l-7.018 12.03A1 1 0 0 0 4.982 19h14.036a1 1 0 0 0 .864-1.504l-7.018-12.03a1 1 0 0 0-1.368-.36zM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014a.987.987 0 1 0-1.971.055l.236 4.25c.053.945 1.445.945 1.498 0l.236-4.25.001-.027v-.028z",
59
+ d: "m10.272 4.962-7.018 12.03A2 2 0 0 0 4.982 20h14.036a2 2 0 0 0 1.727-3.008l-7.018-12.03a2 2 0 0 0-3.455 0ZM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm-.014-7.013A.987.987 0 0 0 12 8.5h-.028l-.027.002a.987.987 0 0 0-.93 1.04l.236 4.25c.052.944 1.445.944 1.498 0l.236-4.25a1.925 1.925 0 0 0 .001-.055Z",
60
60
  fill: "currentColor"
61
61
  }));
62
62
  }
63
63
 
64
64
  function AlertCriticalIcon(props) {
65
65
  return /*#__PURE__*/createElement("svg", _objectSpread2({
66
+ xmlns: "http://www.w3.org/2000/svg",
66
67
  width: "24",
67
68
  height: "24",
68
- fill: "none",
69
- xmlns: "http://www.w3.org/2000/svg"
69
+ viewBox: "0 0 24 24"
70
70
  }, props), /*#__PURE__*/createElement("path", {
71
71
  fillRule: "evenodd",
72
72
  clipRule: "evenodd",
73
- d: "M12 3.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17zM2.5 12a9.5 9.5 0 1 1 19 0 9.5 9.5 0 0 1-19 0zM13 15.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014A.987.987 0 0 0 12 7.5h-.027l-.028.002a.987.987 0 0 0-.93 1.04l.236 4.25c.053.944 1.445.944 1.498 0l.236-4.25.001-.028v-.027z",
73
+ d: "M12.9866 2.25049C12.3729 1.91683 11.6271 1.91683 11.0134 2.25049L4.04793 6.03744C3.40122 6.38904 2.99999 7.05702 2.99999 7.78208V15.2184C2.99999 15.9435 3.40122 16.6115 4.04793 16.963L11.0134 20.75C11.6271 21.0837 12.3729 21.0837 12.9866 20.75L19.9521 16.963C20.5988 16.6114 21 15.9435 21 15.2184V7.78208C21 7.05701 20.5988 6.38904 19.9521 6.03744L12.9866 2.25049ZM12 7.00024C12.5448 7.00024 12.9865 7.44191 12.9865 7.98674C12.9864 8.00043 12.9863 8.00727 12.9861 8.01411C12.9859 8.02095 12.9856 8.02779 12.985 8.04146L12.7489 12.2918C12.6964 13.2364 11.3036 13.2364 11.2512 12.2918L11.015 8.04146C10.9848 7.49747 11.4013 7.03198 11.9453 7.00176L11.9726 7.00062L12 7.00024ZM13 15.0002C13 15.5525 12.5523 16.0002 12 16.0002C11.4477 16.0002 11 15.5525 11 15.0002C11 14.448 11.4477 14.0002 12 14.0002C12.5523 14.0002 13 14.448 13 15.0002Z",
74
74
  fill: "currentColor"
75
75
  }));
76
76
  }
@@ -1 +1 @@
1
- {"version":3,"file":"alert-icon.js","sources":["../../src/icons/alert-icon.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { AlertTone } from '../utils/common-types'\n\nconst alertIconForTone: Record<AlertTone, typeof AlertInfoIcon> = {\n info: AlertInfoIcon,\n positive: AlertPositiveIcon,\n caution: AlertCautionIcon,\n critical: AlertCriticalIcon,\n}\n\nfunction AlertIcon({ tone, ...props }: JSX.IntrinsicElements['svg'] & { tone: AlertTone }) {\n const Icon = alertIconForTone[tone]\n return Icon ? <Icon {...props} /> : null\n}\n\nfunction AlertInfoIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm1.18-11.84a.84.84 0 1 1-1.68 0 .84.84 0 0 1 1.68 0zM12.5 10a.5.5 0 0 1 .5.5V15h1a.5.5 0 0 1 0 1h-3a.5.5 0 0 1 0-1h1v-4h-1a.5.5 0 0 1 0-1h1.5z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertPositiveIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm-4.354-8.104a.5.5 0 0 1 .708 0l2.146 2.147 5.146-5.147a.5.5 0 0 1 .708.708l-5.5 5.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCautionIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"m3.254 16.992 7.018-12.03a2 2 0 0 1 3.455 0l7.018 12.03A2 2 0 0 1 19.018 20H4.982a2 2 0 0 1-1.728-3.008zm8.242-11.887a1 1 0 0 0-.36.36l-7.018 12.03A1 1 0 0 0 4.982 19h14.036a1 1 0 0 0 .864-1.504l-7.018-12.03a1 1 0 0 0-1.368-.36zM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014a.987.987 0 1 0-1.971.055l.236 4.25c.053.945 1.445.945 1.498 0l.236-4.25.001-.027v-.028z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCriticalIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12 3.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17zM2.5 12a9.5 9.5 0 1 1 19 0 9.5 9.5 0 0 1-19 0zM13 15.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014A.987.987 0 0 0 12 7.5h-.027l-.028.002a.987.987 0 0 0-.93 1.04l.236 4.25c.053.944 1.445.944 1.498 0l.236-4.25.001-.028v-.027z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nexport { AlertIcon }\n"],"names":["alertIconForTone","info","AlertInfoIcon","positive","AlertPositiveIcon","caution","AlertCautionIcon","critical","AlertCriticalIcon","AlertIcon","tone","props","Icon","React","width","height","fill","xmlns","fillRule","clipRule","d"],"mappings":";;;;AAGA,MAAMA,gBAAgB,GAA4C;EAC9DC,IAAI,EAAEC,aADwD;EAE9DC,QAAQ,EAAEC,iBAFoD;EAG9DC,OAAO,EAAEC,gBAHqD;EAI9DC,QAAQ,EAAEC;AAJoD,CAAlE;;AAOA,SAASC,SAAT;MAAmB;IAAEC;;MAASC;;EAC1B,MAAMC,IAAI,GAAGZ,gBAAgB,CAACU,IAAD,CAA7B;EACA,OAAOE,IAAI,gBAAGC,aAAA,CAACD,IAAD,qBAAUD,KAAV,EAAH,GAAyB,IAApC;AACH;;AAED,SAAST,aAAT,CAAuBS,KAAvB;EACI,oBACIE,aAAA,MAAA;IAAKC,KAAK,EAAC,IAAX;IAAgBC,MAAM,EAAC,IAAvB;IAA4BC,IAAI,EAAC,MAAjC;IAAwCC,KAAK,EAAC;KAAiCN,KAA/E,gBACIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFJ,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASZ,iBAAT,CAA2BO,KAA3B;EACI,oBACIE,aAAA,MAAA;IAAKC,KAAK,EAAC,IAAX;IAAgBC,MAAM,EAAC,IAAvB;IAA4BC,IAAI,EAAC,MAAjC;IAAwCC,KAAK,EAAC;KAAiCN,KAA/E,gBACIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFJ,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASV,gBAAT,CAA0BK,KAA1B;EACI,oBACIE,aAAA,MAAA;IAAKC,KAAK,EAAC,IAAX;IAAgBC,MAAM,EAAC,IAAvB;IAA4BC,IAAI,EAAC,MAAjC;IAAwCC,KAAK,EAAC;KAAiCN,KAA/E,gBACIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFJ,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;AAED,SAASR,iBAAT,CAA2BG,KAA3B;EACI,oBACIE,aAAA,MAAA;IAAKC,KAAK,EAAC,IAAX;IAAgBC,MAAM,EAAC,IAAvB;IAA4BC,IAAI,EAAC,MAAjC;IAAwCC,KAAK,EAAC;KAAiCN,KAA/E,gBACIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFJ,IAAI,EAAC;GAJT,CADJ,CADJ;AAUH;;;;"}
1
+ {"version":3,"file":"alert-icon.js","sources":["../../src/icons/alert-icon.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { AlertTone } from '../utils/common-types'\n\nconst alertIconForTone: Record<AlertTone, typeof AlertInfoIcon> = {\n info: AlertInfoIcon,\n positive: AlertPositiveIcon,\n caution: AlertCautionIcon,\n critical: AlertCriticalIcon,\n}\n\nfunction AlertIcon({ tone, ...props }: JSX.IntrinsicElements['svg'] & { tone: AlertTone }) {\n const Icon = alertIconForTone[tone]\n return Icon ? <Icon {...props} /> : null\n}\n\nfunction AlertInfoIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-8-3.94a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM10.25 10a.75.75 0 0 0 0 1.5h1.25V15h-1.25a.75.75 0 0 0 0 1.5h3.5a.75.75 0 0 0 0-1.5H13v-4.25a.75.75 0 0 0-.75-.75h-2Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertPositiveIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-5.555-2.99a.75.75 0 0 1 1.06 1.06l-5.303 5.304a.748.748 0 0 1-1.061 0l-2.475-2.475a.75.75 0 0 1 1.06-1.06l1.945 1.944 4.774-4.773Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCautionIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"m10.272 4.962-7.018 12.03A2 2 0 0 0 4.982 20h14.036a2 2 0 0 0 1.727-3.008l-7.018-12.03a2 2 0 0 0-3.455 0ZM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm-.014-7.013A.987.987 0 0 0 12 8.5h-.028l-.027.002a.987.987 0 0 0-.93 1.04l.236 4.25c.052.944 1.445.944 1.498 0l.236-4.25a1.925 1.925 0 0 0 .001-.055Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCriticalIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.9866 2.25049C12.3729 1.91683 11.6271 1.91683 11.0134 2.25049L4.04793 6.03744C3.40122 6.38904 2.99999 7.05702 2.99999 7.78208V15.2184C2.99999 15.9435 3.40122 16.6115 4.04793 16.963L11.0134 20.75C11.6271 21.0837 12.3729 21.0837 12.9866 20.75L19.9521 16.963C20.5988 16.6114 21 15.9435 21 15.2184V7.78208C21 7.05701 20.5988 6.38904 19.9521 6.03744L12.9866 2.25049ZM12 7.00024C12.5448 7.00024 12.9865 7.44191 12.9865 7.98674C12.9864 8.00043 12.9863 8.00727 12.9861 8.01411C12.9859 8.02095 12.9856 8.02779 12.985 8.04146L12.7489 12.2918C12.6964 13.2364 11.3036 13.2364 11.2512 12.2918L11.015 8.04146C10.9848 7.49747 11.4013 7.03198 11.9453 7.00176L11.9726 7.00062L12 7.00024ZM13 15.0002C13 15.5525 12.5523 16.0002 12 16.0002C11.4477 16.0002 11 15.5525 11 15.0002C11 14.448 11.4477 14.0002 12 14.0002C12.5523 14.0002 13 14.448 13 15.0002Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nexport { AlertIcon }\n"],"names":["alertIconForTone","info","AlertInfoIcon","positive","AlertPositiveIcon","caution","AlertCautionIcon","critical","AlertCriticalIcon","AlertIcon","tone","props","Icon","React","xmlns","width","height","viewBox","fillRule","clipRule","d","fill"],"mappings":";;;;AAGA,MAAMA,gBAAgB,GAA4C;EAC9DC,IAAI,EAAEC,aADwD;EAE9DC,QAAQ,EAAEC,iBAFoD;EAG9DC,OAAO,EAAEC,gBAHqD;EAI9DC,QAAQ,EAAEC;AAJoD,CAAlE;;AAOA,SAASC,SAAT;MAAmB;IAAEC;;MAASC;;EAC1B,MAAMC,IAAI,GAAGZ,gBAAgB,CAACU,IAAD,CAA7B;EACA,OAAOE,IAAI,gBAAGC,aAAA,CAACD,IAAD,qBAAUD,KAAV,EAAH,GAAyB,IAApC;AACH;;AAED,SAAST,aAAT,CAAuBS,KAAvB;EACI,oBACIE,aAAA,MAAA;IACIC,KAAK,EAAC,4BADV;IAEIC,KAAK,EAAC,IAFV;IAGIC,MAAM,EAAC,IAHX;IAIIC,OAAO,EAAC;KACJN,KALR,gBAOIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFC,IAAI,EAAC;GAJT,CAPJ,CADJ;AAgBH;;AAED,SAASjB,iBAAT,CAA2BO,KAA3B;EACI,oBACIE,aAAA,MAAA;IACIC,KAAK,EAAC,4BADV;IAEIC,KAAK,EAAC,IAFV;IAGIC,MAAM,EAAC,IAHX;IAIIC,OAAO,EAAC;KACJN,KALR,gBAOIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFC,IAAI,EAAC;GAJT,CAPJ,CADJ;AAgBH;;AAED,SAASf,gBAAT,CAA0BK,KAA1B;EACI,oBACIE,aAAA,MAAA;IACIC,KAAK,EAAC,4BADV;IAEIC,KAAK,EAAC,IAFV;IAGIC,MAAM,EAAC,IAHX;IAIIC,OAAO,EAAC;KACJN,KALR,gBAOIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFC,IAAI,EAAC;GAJT,CAPJ,CADJ;AAgBH;;AAED,SAASb,iBAAT,CAA2BG,KAA3B;EACI,oBACIE,aAAA,MAAA;IACIC,KAAK,EAAC,4BADV;IAEIC,KAAK,EAAC,IAFV;IAGIC,MAAM,EAAC,IAHX;IAIIC,OAAO,EAAC;KACJN,KALR,gBAOIE,aAAA,OAAA;IACIK,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,CAAC,EAAC;IACFC,IAAI,EAAC;GAJT,CAPJ,CADJ;AAgBH;;;;"}
@@ -1,4 +1,4 @@
1
- var modules_8ebe6db0 = {"prose":"e3d32437","darkModeTypography":"_95ee669d"};
1
+ var modules_8ebe6db0 = {"prose":"_31409006","darkModeTypography":"_500989c8"};
2
2
 
3
3
  export default modules_8ebe6db0;
4
4
  //# sourceMappingURL=prose.module.css.js.map
@@ -1,4 +1,4 @@
1
- var modules_1fa9b208 = {"selectWrapper":"a9cbb3a6","bordered":"f3869290","error":"aefdbdaa"};
1
+ var modules_1fa9b208 = {"selectWrapper":"b930bb07","bordered":"e1f620b6","error":"_7e87474e"};
2
2
 
3
3
  export default modules_1fa9b208;
4
4
  //# sourceMappingURL=select-field.module.css.js.map
@@ -1,4 +1,4 @@
1
- var modules_2728c236 = {"textAreaContainer":"_29503131","innerContainer":"_6ea894ce","bordered":"e1e8b6a7","error":"_1b94ff46","autoExpand":"e82223c4"};
1
+ var modules_2728c236 = {"textAreaContainer":"_55ccf266","innerContainer":"_89bb7098","bordered":"_02a47358","error":"_704ff540","autoExpand":"_145ca8f0"};
2
2
 
3
3
  export default modules_2728c236;
4
4
  //# sourceMappingURL=text-area.module.css.js.map
@@ -1,4 +1,4 @@
1
- var modules_aaf25250 = {"inputWrapper":"_483abe7b","bordered":"fce9399c","error":"_603b8c4b","slot":"_79ca0da5"};
1
+ var modules_aaf25250 = {"inputWrapper":"dea25485","bordered":"_80b6b376","error":"_1a32867a","slot":"dbbd207e"};
2
2
 
3
3
  export default modules_aaf25250;
4
4
  //# sourceMappingURL=text-field.module.css.js.map
@@ -67,6 +67,9 @@ function Tooltip({
67
67
 
68
68
  return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement(TooltipAnchor, {
69
69
  render: anchorProps => {
70
+ // Let child props override anchor props so user can specify attributes like tabIndex
71
+ // Also, do not apply the child's props to TooltipAnchor as props like `as` can create problems
72
+ // by applying the replacement component/element twice
70
73
  return /*#__PURE__*/cloneElement(child, _objectSpread2(_objectSpread2(_objectSpread2({}, child.props), anchorProps), {}, {
71
74
  onFocus: handleFocus,
72
75
  onBlur: handleBlur
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.js","sources":["../../src/tooltip/tooltip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {\n useTooltipStore,\n Tooltip as AriakitTooltip,\n TooltipAnchor,\n TooltipArrow,\n} from '@ariakit/react'\nimport { Box } from '../box'\n\nimport type { TooltipStoreState } from '@ariakit/react'\n\nimport styles from './tooltip.module.css'\n\ntype TooltipProps = {\n /**\n * The element that triggers the tooltip. Generally a button or link.\n *\n * It should be an interactive element accessible both via mouse and keyboard interactions.\n */\n children: React.ReactNode\n\n /**\n * The content to show in the tooltip.\n *\n * It can be rich content provided via React elements, or string content. It should not include\n * interactive elements inside it. This includes links or buttons.\n *\n * You can provide a function instead of the content itself. In this case, the function should\n * return the desired content. This is useful if the content is expensive to generate. It can\n * also be useful if the content dynamically changes often, so every time you trigger the\n * tooltip the content may have changed (e.g. if you show a ticking time clock in the tooltip).\n *\n * The trigger element will be associated to this content via `aria-describedby`. This means\n * that the tooltip content will be read by assistive technologies such as screen readers. It\n * will likely read this content right after reading the trigger element label.\n */\n content: React.ReactNode | (() => React.ReactNode)\n\n /**\n * How to place the tooltip relative to its trigger element.\n *\n * The possible values are \"top\", \"bottom\", \"left\", \"right\". Additionally, any of these values\n * can be combined with `-start` or `-end` for even more control. For instance `top-start` will\n * place the tooltip at the top, but with the start (e.g. left) side of the toolip and the\n * trigger aligned. If neither `-start` or `-end` are provided, the tooltip is centered along\n * the vertical or horizontal axis with the trigger.\n *\n * The position is enforced whenever possible, but tooltips can appear in different positions\n * if the specified one would make the tooltip intersect with the viewport edges.\n *\n * @default 'top'\n */\n position?: TooltipStoreState['placement']\n\n /**\n * The separation (in pixels) between the trigger element and the tooltip.\n * @default 3\n */\n gapSize?: number\n\n /**\n * Whether to show an arrow-like element attached to the tooltip, and pointing towards the\n * trigger element.\n * @default false\n */\n withArrow?: boolean\n\n /**\n * An escape hatch, in case you need to provide a custom class name to the tooltip.\n */\n exceptionallySetClassName?: string\n}\n\nfunction Tooltip({\n children,\n content,\n position = 'top',\n gapSize = 3,\n withArrow = false,\n exceptionallySetClassName,\n}: TooltipProps) {\n const tooltip = useTooltipStore({ placement: position, showTimeout: 500, hideTimeout: 100 })\n const isOpen = tooltip.useState('open')\n\n const child = React.Children.only(\n children as React.FunctionComponentElement<JSX.IntrinsicElements['div']> | null,\n )\n\n if (!child) {\n return child\n }\n\n if (typeof child.ref === 'string') {\n throw new Error('Tooltip: String refs cannot be used as they cannot be forwarded')\n }\n\n /**\n * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n * tooltips from showing when the trigger element is focused back after a popover or dialog that\n * it opened was closed. See link below for more details.\n * @see https://github.com/ariakit/ariakit/discussions/749\n */\n function handleFocus(event: React.FocusEvent<HTMLDivElement>) {\n // If focus is not followed by a key up event, does it mean that it's not an intentional\n // keyboard focus? Not sure but it seems to work.\n // This may be resolved soon in an upcoming version of ariakit:\n // https://github.com/ariakit/ariakit/issues/750\n function handleKeyUp(event: Event) {\n const eventKey = (event as KeyboardEvent).key\n if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n tooltip.show()\n }\n }\n event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n event.preventDefault() // Prevent tooltip.show from being called by TooltipReference\n child?.props?.onFocus?.(event)\n }\n\n function handleBlur(event: React.FocusEvent<HTMLDivElement>) {\n tooltip.hide()\n child?.props?.onBlur?.(event)\n }\n\n return (\n <>\n <TooltipAnchor\n render={(anchorProps) => {\n return React.cloneElement(child, {\n ...child.props,\n ...anchorProps,\n onFocus: handleFocus,\n onBlur: handleBlur,\n })\n }}\n store={tooltip}\n ref={child.ref}\n />\n {isOpen && content ? (\n <Box\n as={AriakitTooltip}\n gutter={gapSize}\n store={tooltip}\n className={[styles.tooltip, exceptionallySetClassName]}\n background=\"toast\"\n borderRadius=\"standard\"\n paddingX=\"small\"\n paddingY=\"xsmall\"\n maxWidth=\"medium\"\n width=\"fitContent\"\n overflow=\"hidden\"\n textAlign=\"center\"\n >\n {withArrow ? <TooltipArrow /> : null}\n {typeof content === 'function' ? content() : content}\n </Box>\n ) : null}\n </>\n )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n"],"names":["Tooltip","children","content","position","gapSize","withArrow","exceptionallySetClassName","tooltip","useTooltipStore","placement","showTimeout","hideTimeout","isOpen","useState","child","React","only","ref","Error","handleFocus","event","handleKeyUp","eventKey","key","show","currentTarget","addEventListener","once","preventDefault","props","onFocus","handleBlur","hide","onBlur","TooltipAnchor","render","anchorProps","store","Box","as","AriakitTooltip","gutter","className","styles","background","borderRadius","paddingX","paddingY","maxWidth","width","overflow","textAlign","TooltipArrow"],"mappings":";;;;;;AA0EA,SAASA,OAAT,CAAiB;EACbC,QADa;EAEbC,OAFa;EAGbC,QAAQ,GAAG,KAHE;EAIbC,OAAO,GAAG,CAJG;EAKbC,SAAS,GAAG,KALC;EAMbC;AANa,CAAjB;EAQI,MAAMC,OAAO,GAAGC,eAAe,CAAC;IAAEC,SAAS,EAAEN,QAAb;IAAuBO,WAAW,EAAE,GAApC;IAAyCC,WAAW,EAAE;GAAvD,CAA/B;EACA,MAAMC,MAAM,GAAGL,OAAO,CAACM,QAAR,CAAiB,MAAjB,CAAf;EAEA,MAAMC,KAAK,GAAGC,QAAA,CAAeC,IAAf,CACVf,QADU,CAAd;;EAIA,IAAI,CAACa,KAAL,EAAY;IACR,OAAOA,KAAP;;;EAGJ,IAAI,OAAOA,KAAK,CAACG,GAAb,KAAqB,QAAzB,EAAmC;IAC/B,MAAM,IAAIC,KAAJ,CAAU,iEAAV,CAAN;;;;;;;;;;EASJ,SAASC,WAAT,CAAqBC,KAArB;;;;;;;IAKI,SAASC,WAAT,CAAqBD,KAArB;MACI,MAAME,QAAQ,GAAIF,KAAuB,CAACG,GAA1C;;MACA,IAAID,QAAQ,KAAK,QAAb,IAAyBA,QAAQ,KAAK,OAAtC,IAAiDA,QAAQ,KAAK,OAAlE,EAA2E;QACvEf,OAAO,CAACiB,IAAR;;;;IAGRJ,KAAK,CAACK,aAAN,CAAoBC,gBAApB,CAAqC,OAArC,EAA8CL,WAA9C,EAA2D;MAAEM,IAAI,EAAE;KAAnE;IACAP,KAAK,CAACQ,cAAN;;IACAd,KAAK,QAAL,4BAAAA,KAAK,CAAEe,KAAP,kCAAcC,OAAd,iCAAcA,OAAd,CAAwBV,KAAxB;;;EAGJ,SAASW,UAAT,CAAoBX,KAApB;;;IACIb,OAAO,CAACyB,IAAR;IACAlB,KAAK,QAAL,6BAAAA,KAAK,CAAEe,KAAP,mCAAcI,MAAd,kCAAcA,MAAd,CAAuBb,KAAvB;;;EAGJ,oBACIL,aAAA,SAAA,MAAA,eACIA,aAAA,CAACmB,aAAD;IACIC,MAAM,EAAGC,WAAD;MACJ,oBAAOrB,YAAA,CAAmBD,KAAnB,mDACAA,KAAK,CAACe,KADN,GAEAO,WAFA;QAGHN,OAAO,EAAEX,WAHN;QAIHc,MAAM,EAAEF;SAJZ;;IAOJM,KAAK,EAAE9B;IACPU,GAAG,EAAEH,KAAK,CAACG;GAVf,CADJ,EAaKL,MAAM,IAAIV,OAAV,gBACGa,aAAA,CAACuB,GAAD;IACIC,EAAE,EAAEC;IACJC,MAAM,EAAErC;IACRiC,KAAK,EAAE9B;IACPmC,SAAS,EAAE,CAACC,MAAM,CAACpC,OAAR,EAAiBD,yBAAjB;IACXsC,UAAU,EAAC;IACXC,YAAY,EAAC;IACbC,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,KAAK,EAAC;IACNC,QAAQ,EAAC;IACTC,SAAS,EAAC;GAZd,EAcK9C,SAAS,gBAAGU,aAAA,CAACqC,YAAD,MAAA,CAAH,GAAsB,IAdpC,EAeK,OAAOlD,OAAP,KAAmB,UAAnB,GAAgCA,OAAO,EAAvC,GAA4CA,OAfjD,CADH,GAkBG,IA/BR,CADJ;AAmCH;;;;"}
1
+ {"version":3,"file":"tooltip.js","sources":["../../src/tooltip/tooltip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {\n useTooltipStore,\n Tooltip as AriakitTooltip,\n TooltipAnchor,\n TooltipArrow,\n} from '@ariakit/react'\nimport { Box } from '../box'\n\nimport type { TooltipStoreState } from '@ariakit/react'\n\nimport styles from './tooltip.module.css'\n\ntype TooltipProps = {\n /**\n * The element that triggers the tooltip. Generally a button or link.\n *\n * It should be an interactive element accessible both via mouse and keyboard interactions.\n */\n children: React.ReactNode\n\n /**\n * The content to show in the tooltip.\n *\n * It can be rich content provided via React elements, or string content. It should not include\n * interactive elements inside it. This includes links or buttons.\n *\n * You can provide a function instead of the content itself. In this case, the function should\n * return the desired content. This is useful if the content is expensive to generate. It can\n * also be useful if the content dynamically changes often, so every time you trigger the\n * tooltip the content may have changed (e.g. if you show a ticking time clock in the tooltip).\n *\n * The trigger element will be associated to this content via `aria-describedby`. This means\n * that the tooltip content will be read by assistive technologies such as screen readers. It\n * will likely read this content right after reading the trigger element label.\n */\n content: React.ReactNode | (() => React.ReactNode)\n\n /**\n * How to place the tooltip relative to its trigger element.\n *\n * The possible values are \"top\", \"bottom\", \"left\", \"right\". Additionally, any of these values\n * can be combined with `-start` or `-end` for even more control. For instance `top-start` will\n * place the tooltip at the top, but with the start (e.g. left) side of the toolip and the\n * trigger aligned. If neither `-start` or `-end` are provided, the tooltip is centered along\n * the vertical or horizontal axis with the trigger.\n *\n * The position is enforced whenever possible, but tooltips can appear in different positions\n * if the specified one would make the tooltip intersect with the viewport edges.\n *\n * @default 'top'\n */\n position?: TooltipStoreState['placement']\n\n /**\n * The separation (in pixels) between the trigger element and the tooltip.\n * @default 3\n */\n gapSize?: number\n\n /**\n * Whether to show an arrow-like element attached to the tooltip, and pointing towards the\n * trigger element.\n * @default false\n */\n withArrow?: boolean\n\n /**\n * An escape hatch, in case you need to provide a custom class name to the tooltip.\n */\n exceptionallySetClassName?: string\n}\n\nfunction Tooltip({\n children,\n content,\n position = 'top',\n gapSize = 3,\n withArrow = false,\n exceptionallySetClassName,\n}: TooltipProps) {\n const tooltip = useTooltipStore({ placement: position, showTimeout: 500, hideTimeout: 100 })\n const isOpen = tooltip.useState('open')\n\n const child = React.Children.only(\n children as React.FunctionComponentElement<JSX.IntrinsicElements['div']> | null,\n )\n\n if (!child) {\n return child\n }\n\n if (typeof child.ref === 'string') {\n throw new Error('Tooltip: String refs cannot be used as they cannot be forwarded')\n }\n\n /**\n * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n * tooltips from showing when the trigger element is focused back after a popover or dialog that\n * it opened was closed. See link below for more details.\n * @see https://github.com/ariakit/ariakit/discussions/749\n */\n function handleFocus(event: React.FocusEvent<HTMLDivElement>) {\n // If focus is not followed by a key up event, does it mean that it's not an intentional\n // keyboard focus? Not sure but it seems to work.\n // This may be resolved soon in an upcoming version of ariakit:\n // https://github.com/ariakit/ariakit/issues/750\n function handleKeyUp(event: Event) {\n const eventKey = (event as KeyboardEvent).key\n if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n tooltip.show()\n }\n }\n event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n event.preventDefault() // Prevent tooltip.show from being called by TooltipReference\n child?.props?.onFocus?.(event)\n }\n\n function handleBlur(event: React.FocusEvent<HTMLDivElement>) {\n tooltip.hide()\n child?.props?.onBlur?.(event)\n }\n\n return (\n <>\n <TooltipAnchor\n render={(anchorProps) => {\n // Let child props override anchor props so user can specify attributes like tabIndex\n // Also, do not apply the child's props to TooltipAnchor as props like `as` can create problems\n // by applying the replacement component/element twice\n return React.cloneElement(child, {\n ...child.props,\n ...anchorProps,\n onFocus: handleFocus,\n onBlur: handleBlur,\n })\n }}\n store={tooltip}\n ref={child.ref}\n />\n {isOpen && content ? (\n <Box\n as={AriakitTooltip}\n gutter={gapSize}\n store={tooltip}\n className={[styles.tooltip, exceptionallySetClassName]}\n background=\"toast\"\n borderRadius=\"standard\"\n paddingX=\"small\"\n paddingY=\"xsmall\"\n maxWidth=\"medium\"\n width=\"fitContent\"\n overflow=\"hidden\"\n textAlign=\"center\"\n >\n {withArrow ? <TooltipArrow /> : null}\n {typeof content === 'function' ? content() : content}\n </Box>\n ) : null}\n </>\n )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n"],"names":["Tooltip","children","content","position","gapSize","withArrow","exceptionallySetClassName","tooltip","useTooltipStore","placement","showTimeout","hideTimeout","isOpen","useState","child","React","only","ref","Error","handleFocus","event","handleKeyUp","eventKey","key","show","currentTarget","addEventListener","once","preventDefault","props","onFocus","handleBlur","hide","onBlur","TooltipAnchor","render","anchorProps","store","Box","as","AriakitTooltip","gutter","className","styles","background","borderRadius","paddingX","paddingY","maxWidth","width","overflow","textAlign","TooltipArrow"],"mappings":";;;;;;AA0EA,SAASA,OAAT,CAAiB;EACbC,QADa;EAEbC,OAFa;EAGbC,QAAQ,GAAG,KAHE;EAIbC,OAAO,GAAG,CAJG;EAKbC,SAAS,GAAG,KALC;EAMbC;AANa,CAAjB;EAQI,MAAMC,OAAO,GAAGC,eAAe,CAAC;IAAEC,SAAS,EAAEN,QAAb;IAAuBO,WAAW,EAAE,GAApC;IAAyCC,WAAW,EAAE;GAAvD,CAA/B;EACA,MAAMC,MAAM,GAAGL,OAAO,CAACM,QAAR,CAAiB,MAAjB,CAAf;EAEA,MAAMC,KAAK,GAAGC,QAAA,CAAeC,IAAf,CACVf,QADU,CAAd;;EAIA,IAAI,CAACa,KAAL,EAAY;IACR,OAAOA,KAAP;;;EAGJ,IAAI,OAAOA,KAAK,CAACG,GAAb,KAAqB,QAAzB,EAAmC;IAC/B,MAAM,IAAIC,KAAJ,CAAU,iEAAV,CAAN;;;;;;;;;;EASJ,SAASC,WAAT,CAAqBC,KAArB;;;;;;;IAKI,SAASC,WAAT,CAAqBD,KAArB;MACI,MAAME,QAAQ,GAAIF,KAAuB,CAACG,GAA1C;;MACA,IAAID,QAAQ,KAAK,QAAb,IAAyBA,QAAQ,KAAK,OAAtC,IAAiDA,QAAQ,KAAK,OAAlE,EAA2E;QACvEf,OAAO,CAACiB,IAAR;;;;IAGRJ,KAAK,CAACK,aAAN,CAAoBC,gBAApB,CAAqC,OAArC,EAA8CL,WAA9C,EAA2D;MAAEM,IAAI,EAAE;KAAnE;IACAP,KAAK,CAACQ,cAAN;;IACAd,KAAK,QAAL,4BAAAA,KAAK,CAAEe,KAAP,kCAAcC,OAAd,iCAAcA,OAAd,CAAwBV,KAAxB;;;EAGJ,SAASW,UAAT,CAAoBX,KAApB;;;IACIb,OAAO,CAACyB,IAAR;IACAlB,KAAK,QAAL,6BAAAA,KAAK,CAAEe,KAAP,mCAAcI,MAAd,kCAAcA,MAAd,CAAuBb,KAAvB;;;EAGJ,oBACIL,aAAA,SAAA,MAAA,eACIA,aAAA,CAACmB,aAAD;IACIC,MAAM,EAAGC,WAAD;;;;MAIJ,oBAAOrB,YAAA,CAAmBD,KAAnB,mDACAA,KAAK,CAACe,KADN,GAEAO,WAFA;QAGHN,OAAO,EAAEX,WAHN;QAIHc,MAAM,EAAEF;SAJZ;;IAOJM,KAAK,EAAE9B;IACPU,GAAG,EAAEH,KAAK,CAACG;GAbf,CADJ,EAgBKL,MAAM,IAAIV,OAAV,gBACGa,aAAA,CAACuB,GAAD;IACIC,EAAE,EAAEC;IACJC,MAAM,EAAErC;IACRiC,KAAK,EAAE9B;IACPmC,SAAS,EAAE,CAACC,MAAM,CAACpC,OAAR,EAAiBD,yBAAjB;IACXsC,UAAU,EAAC;IACXC,YAAY,EAAC;IACbC,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,QAAQ,EAAC;IACTC,KAAK,EAAC;IACNC,QAAQ,EAAC;IACTC,SAAS,EAAC;GAZd,EAcK9C,SAAS,gBAAGU,aAAA,CAACqC,YAAD,MAAA,CAAH,GAAsB,IAdpC,EAeK,OAAOlD,OAAP,KAAmB,UAAnB,GAAgCA,OAAO,EAAvC,GAA4CA,OAfjD,CADH,GAkBG,IAlCR,CADJ;AAsCH;;;;"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),l=require("../utils/responsive-props.js"),t=require("../box/box.js"),n=require("../columns/columns.js"),r=require("../button/button.js"),a=require("../icons/alert-icon.js"),o=require("../icons/close-icon.js"),s=require("./alert.module.css.js");exports.Alert=function({id:i,children:u,tone:c,closeLabel:m,onClose:d}){return e.createElement(t.Box,{id:i,role:"alert","aria-live":"polite",borderRadius:"standard",className:[s.default.container,l.getClassNames(s.default,"tone",c)]},e.createElement(n.Columns,{space:"small",alignY:"top"},e.createElement(n.Column,{width:"content"},e.createElement(a.AlertIcon,{tone:c})),e.createElement(n.Column,null,e.createElement(t.Box,{paddingY:"xsmall",paddingRight:null!=d&&null!=m?void 0:"small"},u)),null!=d&&null!=m?e.createElement(n.Column,{width:"content"},e.createElement(r.Button,{variant:"quaternary",size:"small",onClick:d,"aria-label":m,icon:e.createElement(o.CloseIcon,null),style:{"--reactist-btn-hover-fill":"transparent"}})):null))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),l=require("../utils/responsive-props.js"),t=require("../box/box.js"),n=require("../columns/columns.js"),r=require("../button/button.js"),a=require("../icons/alert-icon.js"),o=require("../icons/close-icon.js"),s=require("./alert.module.css.js");exports.Alert=function({id:i,children:u,tone:c,closeLabel:m,onClose:d}){return e.createElement(t.Box,{id:i,role:"alert","aria-live":"polite",borderRadius:"full",className:[s.default.container,l.getClassNames(s.default,"tone",c)]},e.createElement(n.Columns,{space:"small",alignY:"center"},e.createElement(n.Column,{width:"content"},e.createElement(a.AlertIcon,{tone:c,className:s.default.icon})),e.createElement(n.Column,null,e.createElement(t.Box,{paddingY:"xsmall",paddingRight:null!=d&&null!=m?void 0:"small"},u)),null!=d&&null!=m?e.createElement(n.Column,{width:"content"},e.createElement(r.Button,{variant:"quaternary",size:"small",onClick:d,"aria-label":m,icon:e.createElement(o.CloseIcon,null),style:{"--reactist-btn-hover-fill":"transparent"}})):null))};
2
2
  //# sourceMappingURL=alert.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"alert.js","sources":["../../src/alert/alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport { Button } from '../button'\nimport { Columns, Column } from '../columns'\n\nimport { AlertIcon } from '../icons/alert-icon'\nimport { CloseIcon } from '../icons/close-icon'\n\nimport styles from './alert.module.css'\n\nimport type { AlertTone } from '../utils/common-types'\n\ntype AllOrNone<T> = T | { [K in keyof T]?: never }\n\ntype AlertCloseProps = AllOrNone<{\n closeLabel: string\n onClose: () => void\n}>\n\ntype AlertProps = {\n id?: string\n children: React.ReactNode\n tone: AlertTone\n} & AlertCloseProps\n\nfunction Alert({ id, children, tone, closeLabel, onClose }: AlertProps) {\n return (\n <Box\n id={id}\n role=\"alert\"\n aria-live=\"polite\"\n borderRadius=\"standard\"\n className={[styles.container, getClassNames(styles, 'tone', tone)]}\n >\n <Columns space=\"small\" alignY=\"top\">\n <Column width=\"content\">\n <AlertIcon tone={tone} />\n </Column>\n <Column>\n <Box\n paddingY=\"xsmall\"\n paddingRight={onClose != null && closeLabel != null ? undefined : 'small'}\n >\n {children}\n </Box>\n </Column>\n {onClose != null && closeLabel != null ? (\n <Column width=\"content\">\n <Button\n variant=\"quaternary\"\n size=\"small\"\n onClick={onClose}\n aria-label={closeLabel}\n icon={<CloseIcon />}\n style={{\n // @ts-expect-error not sure how to make TypeScript understand custom CSS properties\n '--reactist-btn-hover-fill': 'transparent',\n }}\n />\n </Column>\n ) : null}\n </Columns>\n </Box>\n )\n}\n\nexport { Alert }\nexport type { AlertProps }\n"],"names":["id","children","tone","closeLabel","onClose","React","Box","role","borderRadius","className","styles","container","getClassNames","Columns","space","alignY","Column","width","AlertIcon","paddingY","paddingRight","undefined","Button","variant","size","onClick","icon","CloseIcon","style","--reactist-btn-hover-fill"],"mappings":"6VA0BA,UAAeA,GAAEA,EAAFC,SAAMA,EAANC,KAAgBA,EAAhBC,WAAsBA,EAAtBC,QAAkCA,IAC7C,OACIC,gBAACC,OACGN,GAAIA,EACJO,KAAK,oBACK,SACVC,aAAa,WACbC,UAAW,CAACC,UAAOC,UAAWC,gBAAcF,UAAQ,OAAQR,KAE5DG,gBAACQ,WAAQC,MAAM,QAAQC,OAAO,OAC1BV,gBAACW,UAAOC,MAAM,WACVZ,gBAACa,aAAUhB,KAAMA,KAErBG,gBAACW,cACGX,gBAACC,OACGa,SAAS,SACTC,aAAyB,MAAXhB,GAAiC,MAAdD,OAAqBkB,EAAY,SAEjEpB,IAGG,MAAXG,GAAiC,MAAdD,EAChBE,gBAACW,UAAOC,MAAM,WACVZ,gBAACiB,UACGC,QAAQ,aACRC,KAAK,QACLC,QAASrB,eACGD,EACZuB,KAAMrB,gBAACsB,kBACPC,MAAO,CAEHC,4BAA6B,kBAIzC"}
1
+ {"version":3,"file":"alert.js","sources":["../../src/alert/alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../utils/responsive-props'\nimport { Box } from '../box'\nimport { Button } from '../button'\nimport { Columns, Column } from '../columns'\n\nimport { AlertIcon } from '../icons/alert-icon'\nimport { CloseIcon } from '../icons/close-icon'\n\nimport styles from './alert.module.css'\n\nimport type { AlertTone } from '../utils/common-types'\n\ntype AllOrNone<T> = T | { [K in keyof T]?: never }\n\ntype AlertCloseProps = AllOrNone<{\n closeLabel: string\n onClose: () => void\n}>\n\ntype AlertProps = {\n id?: string\n children: React.ReactNode\n tone: AlertTone\n} & AlertCloseProps\n\nfunction Alert({ id, children, tone, closeLabel, onClose }: AlertProps) {\n return (\n <Box\n id={id}\n role=\"alert\"\n aria-live=\"polite\"\n borderRadius=\"full\"\n className={[styles.container, getClassNames(styles, 'tone', tone)]}\n >\n <Columns space=\"small\" alignY=\"center\">\n <Column width=\"content\">\n <AlertIcon tone={tone} className={styles.icon} />\n </Column>\n <Column>\n <Box\n paddingY=\"xsmall\"\n paddingRight={onClose != null && closeLabel != null ? undefined : 'small'}\n >\n {children}\n </Box>\n </Column>\n {onClose != null && closeLabel != null ? (\n <Column width=\"content\">\n <Button\n variant=\"quaternary\"\n size=\"small\"\n onClick={onClose}\n aria-label={closeLabel}\n icon={<CloseIcon />}\n style={{\n // @ts-expect-error not sure how to make TypeScript understand custom CSS properties\n '--reactist-btn-hover-fill': 'transparent',\n }}\n />\n </Column>\n ) : null}\n </Columns>\n </Box>\n )\n}\n\nexport { Alert }\nexport type { AlertProps }\n"],"names":["id","children","tone","closeLabel","onClose","React","Box","role","borderRadius","className","styles","container","getClassNames","Columns","space","alignY","Column","width","AlertIcon","icon","paddingY","paddingRight","undefined","Button","variant","size","onClick","CloseIcon","style","--reactist-btn-hover-fill"],"mappings":"6VA0BA,UAAeA,GAAEA,EAAFC,SAAMA,EAANC,KAAgBA,EAAhBC,WAAsBA,EAAtBC,QAAkCA,IAC7C,OACIC,gBAACC,OACGN,GAAIA,EACJO,KAAK,oBACK,SACVC,aAAa,OACbC,UAAW,CAACC,UAAOC,UAAWC,gBAAcF,UAAQ,OAAQR,KAE5DG,gBAACQ,WAAQC,MAAM,QAAQC,OAAO,UAC1BV,gBAACW,UAAOC,MAAM,WACVZ,gBAACa,aAAUhB,KAAMA,EAAMO,UAAWC,UAAOS,QAE7Cd,gBAACW,cACGX,gBAACC,OACGc,SAAS,SACTC,aAAyB,MAAXjB,GAAiC,MAAdD,OAAqBmB,EAAY,SAEjErB,IAGG,MAAXG,GAAiC,MAAdD,EAChBE,gBAACW,UAAOC,MAAM,WACVZ,gBAACkB,UACGC,QAAQ,aACRC,KAAK,QACLC,QAAStB,eACGD,EACZgB,KAAMd,gBAACsB,kBACPC,MAAO,CAEHC,4BAA6B,kBAIzC"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={container:"eb665121","tone-info":"d0373ff9","tone-positive":"bb18dcab","tone-caution":"_0af02331","tone-critical":"f76146f9"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={container:"_51a84fb3","tone-info":"_5649104a",icon:"_79fa06e2","tone-positive":"c67632e4","tone-caution":"_654ff216","tone-critical":"b1ee4ff1"};
2
2
  //# sourceMappingURL=alert.module.css.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={badge:"_7957de66","badge-info":"c6106b8c","badge-positive":"_6b06bf87","badge-promote":"a6d2daa2","badge-attention":"bbb036ff"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={badge:"_0a7f0497","badge-info":"_0587142f","badge-positive":"_6f5c326e","badge-promote":"_949e0f54","badge-attention":"_36115518"};
2
2
  //# sourceMappingURL=badge.module.css.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={container:"_616a033e",auxiliaryLabel:"_0b88d85e",bordered:"c466cda3",error:"_4156d9cb",primaryLabel:"_274ef80a",secondaryLabel:"_2c4a8aed",messageIcon:"cd105f69"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={container:"_7acdc928",auxiliaryLabel:"_815bad88",bordered:"e35886fe",error:"_6c7b5dc8",primaryLabel:"ec74af87",secondaryLabel:"_6db0ec44",messageIcon:"_05c35af8"};
2
2
  //# sourceMappingURL=base-field.module.css.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../_virtual/_rollupPluginBabelHelpers.js"),t=require("react");const l=["tone"],n={info:function(l){return t.createElement("svg",e.objectSpread2({width:"24",height:"24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm1.18-11.84a.84.84 0 1 1-1.68 0 .84.84 0 0 1 1.68 0zM12.5 10a.5.5 0 0 1 .5.5V15h1a.5.5 0 0 1 0 1h-3a.5.5 0 0 1 0-1h1v-4h-1a.5.5 0 0 1 0-1h1.5z",fill:"currentColor"}))},positive:function(l){return t.createElement("svg",e.objectSpread2({width:"24",height:"24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm-4.354-8.104a.5.5 0 0 1 .708 0l2.146 2.147 5.146-5.147a.5.5 0 0 1 .708.708l-5.5 5.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708z",fill:"currentColor"}))},caution:function(l){return t.createElement("svg",e.objectSpread2({width:"24",height:"24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"m3.254 16.992 7.018-12.03a2 2 0 0 1 3.455 0l7.018 12.03A2 2 0 0 1 19.018 20H4.982a2 2 0 0 1-1.728-3.008zm8.242-11.887a1 1 0 0 0-.36.36l-7.018 12.03A1 1 0 0 0 4.982 19h14.036a1 1 0 0 0 .864-1.504l-7.018-12.03a1 1 0 0 0-1.368-.36zM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014a.987.987 0 1 0-1.971.055l.236 4.25c.053.945 1.445.945 1.498 0l.236-4.25.001-.027v-.028z",fill:"currentColor"}))},critical:function(l){return t.createElement("svg",e.objectSpread2({width:"24",height:"24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12 3.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17zM2.5 12a9.5 9.5 0 1 1 19 0 9.5 9.5 0 0 1-19 0zM13 15.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014A.987.987 0 0 0 12 7.5h-.027l-.028.002a.987.987 0 0 0-.93 1.04l.236 4.25c.053.944 1.445.944 1.498 0l.236-4.25.001-.028v-.027z",fill:"currentColor"}))}};exports.AlertIcon=function(r){let{tone:o}=r,a=e.objectWithoutProperties(r,l);const i=n[o];return i?t.createElement(i,e.objectSpread2({},a)):null};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../_virtual/_rollupPluginBabelHelpers.js"),t=require("react");const l=["tone"],r={info:function(l){return t.createElement("svg",e.objectSpread2({xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-8-3.94a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM10.25 10a.75.75 0 0 0 0 1.5h1.25V15h-1.25a.75.75 0 0 0 0 1.5h3.5a.75.75 0 0 0 0-1.5H13v-4.25a.75.75 0 0 0-.75-.75h-2Z",fill:"currentColor"}))},positive:function(l){return t.createElement("svg",e.objectSpread2({xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-5.555-2.99a.75.75 0 0 1 1.06 1.06l-5.303 5.304a.748.748 0 0 1-1.061 0l-2.475-2.475a.75.75 0 0 1 1.06-1.06l1.945 1.944 4.774-4.773Z",fill:"currentColor"}))},caution:function(l){return t.createElement("svg",e.objectSpread2({xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"m10.272 4.962-7.018 12.03A2 2 0 0 0 4.982 20h14.036a2 2 0 0 0 1.727-3.008l-7.018-12.03a2 2 0 0 0-3.455 0ZM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm-.014-7.013A.987.987 0 0 0 12 8.5h-.028l-.027.002a.987.987 0 0 0-.93 1.04l.236 4.25c.052.944 1.445.944 1.498 0l.236-4.25a1.925 1.925 0 0 0 .001-.055Z",fill:"currentColor"}))},critical:function(l){return t.createElement("svg",e.objectSpread2({xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24"},l),t.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M12.9866 2.25049C12.3729 1.91683 11.6271 1.91683 11.0134 2.25049L4.04793 6.03744C3.40122 6.38904 2.99999 7.05702 2.99999 7.78208V15.2184C2.99999 15.9435 3.40122 16.6115 4.04793 16.963L11.0134 20.75C11.6271 21.0837 12.3729 21.0837 12.9866 20.75L19.9521 16.963C20.5988 16.6114 21 15.9435 21 15.2184V7.78208C21 7.05701 20.5988 6.38904 19.9521 6.03744L12.9866 2.25049ZM12 7.00024C12.5448 7.00024 12.9865 7.44191 12.9865 7.98674C12.9864 8.00043 12.9863 8.00727 12.9861 8.01411C12.9859 8.02095 12.9856 8.02779 12.985 8.04146L12.7489 12.2918C12.6964 13.2364 11.3036 13.2364 11.2512 12.2918L11.015 8.04146C10.9848 7.49747 11.4013 7.03198 11.9453 7.00176L11.9726 7.00062L12 7.00024ZM13 15.0002C13 15.5525 12.5523 16.0002 12 16.0002C11.4477 16.0002 11 15.5525 11 15.0002C11 14.448 11.4477 14.0002 12 14.0002C12.5523 14.0002 13 14.448 13 15.0002Z",fill:"currentColor"}))}};exports.AlertIcon=function(n){let{tone:o}=n,i=e.objectWithoutProperties(n,l);const a=r[o];return a?t.createElement(a,e.objectSpread2({},i)):null};
2
2
  //# sourceMappingURL=alert-icon.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"alert-icon.js","sources":["../../src/icons/alert-icon.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { AlertTone } from '../utils/common-types'\n\nconst alertIconForTone: Record<AlertTone, typeof AlertInfoIcon> = {\n info: AlertInfoIcon,\n positive: AlertPositiveIcon,\n caution: AlertCautionIcon,\n critical: AlertCriticalIcon,\n}\n\nfunction AlertIcon({ tone, ...props }: JSX.IntrinsicElements['svg'] & { tone: AlertTone }) {\n const Icon = alertIconForTone[tone]\n return Icon ? <Icon {...props} /> : null\n}\n\nfunction AlertInfoIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm1.18-11.84a.84.84 0 1 1-1.68 0 .84.84 0 0 1 1.68 0zM12.5 10a.5.5 0 0 1 .5.5V15h1a.5.5 0 0 1 0 1h-3a.5.5 0 0 1 0-1h1v-4h-1a.5.5 0 0 1 0-1h1.5z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertPositiveIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18zm0-1a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm-4.354-8.104a.5.5 0 0 1 .708 0l2.146 2.147 5.146-5.147a.5.5 0 0 1 .708.708l-5.5 5.5a.5.5 0 0 1-.708 0l-2.5-2.5a.5.5 0 0 1 0-.708z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCautionIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"m3.254 16.992 7.018-12.03a2 2 0 0 1 3.455 0l7.018 12.03A2 2 0 0 1 19.018 20H4.982a2 2 0 0 1-1.728-3.008zm8.242-11.887a1 1 0 0 0-.36.36l-7.018 12.03A1 1 0 0 0 4.982 19h14.036a1 1 0 0 0 .864-1.504l-7.018-12.03a1 1 0 0 0-1.368-.36zM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014a.987.987 0 1 0-1.971.055l.236 4.25c.053.945 1.445.945 1.498 0l.236-4.25.001-.027v-.028z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCriticalIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg width=\"24\" height=\"24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12 3.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17zM2.5 12a9.5 9.5 0 1 1 19 0 9.5 9.5 0 0 1-19 0zM13 15.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-.014-7.014A.987.987 0 0 0 12 7.5h-.027l-.028.002a.987.987 0 0 0-.93 1.04l.236 4.25c.053.944 1.445.944 1.498 0l.236-4.25.001-.028v-.027z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nexport { AlertIcon }\n"],"names":["alertIconForTone","info","props","React","width","height","fill","xmlns","fillRule","clipRule","d","positive","caution","critical","tone","Icon"],"mappings":"kKAGMA,EAA4D,CAC9DC,KAWJ,SAAuBC,GACnB,OACIC,uCAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAAiCL,GAC3EC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,yNACFJ,KAAK,mBAjBjBK,SAuBJ,SAA2BT,GACvB,OACIC,uCAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAAiCL,GAC3EC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,6MACFJ,KAAK,mBA7BjBM,QAmCJ,SAA0BV,GACtB,OACIC,uCAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAAiCL,GAC3EC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,gXACFJ,KAAK,mBAzCjBO,SA+CJ,SAA2BX,GACvB,OACIC,uCAAKC,MAAM,KAAKC,OAAO,KAAKC,KAAK,OAAOC,MAAM,8BAAiCL,GAC3EC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,6QACFJ,KAAK,sCAnDrB,gBAAmBQ,KAAEA,KAASZ,iCAC1B,MAAMa,EAAOf,EAAiBc,GAC9B,OAAOC,EAAOZ,gBAACY,qBAASb,IAAY"}
1
+ {"version":3,"file":"alert-icon.js","sources":["../../src/icons/alert-icon.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { AlertTone } from '../utils/common-types'\n\nconst alertIconForTone: Record<AlertTone, typeof AlertInfoIcon> = {\n info: AlertInfoIcon,\n positive: AlertPositiveIcon,\n caution: AlertCautionIcon,\n critical: AlertCriticalIcon,\n}\n\nfunction AlertIcon({ tone, ...props }: JSX.IntrinsicElements['svg'] & { tone: AlertTone }) {\n const Icon = alertIconForTone[tone]\n return Icon ? <Icon {...props} /> : null\n}\n\nfunction AlertInfoIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-8-3.94a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM10.25 10a.75.75 0 0 0 0 1.5h1.25V15h-1.25a.75.75 0 0 0 0 1.5h3.5a.75.75 0 0 0 0-1.5H13v-4.25a.75.75 0 0 0-.75-.75h-2Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertPositiveIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-5.555-2.99a.75.75 0 0 1 1.06 1.06l-5.303 5.304a.748.748 0 0 1-1.061 0l-2.475-2.475a.75.75 0 0 1 1.06-1.06l1.945 1.944 4.774-4.773Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCautionIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"m10.272 4.962-7.018 12.03A2 2 0 0 0 4.982 20h14.036a2 2 0 0 0 1.727-3.008l-7.018-12.03a2 2 0 0 0-3.455 0ZM13 16.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Zm-.014-7.013A.987.987 0 0 0 12 8.5h-.028l-.027.002a.987.987 0 0 0-.93 1.04l.236 4.25c.052.944 1.445.944 1.498 0l.236-4.25a1.925 1.925 0 0 0 .001-.055Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nfunction AlertCriticalIcon(props: JSX.IntrinsicElements['svg']) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.9866 2.25049C12.3729 1.91683 11.6271 1.91683 11.0134 2.25049L4.04793 6.03744C3.40122 6.38904 2.99999 7.05702 2.99999 7.78208V15.2184C2.99999 15.9435 3.40122 16.6115 4.04793 16.963L11.0134 20.75C11.6271 21.0837 12.3729 21.0837 12.9866 20.75L19.9521 16.963C20.5988 16.6114 21 15.9435 21 15.2184V7.78208C21 7.05701 20.5988 6.38904 19.9521 6.03744L12.9866 2.25049ZM12 7.00024C12.5448 7.00024 12.9865 7.44191 12.9865 7.98674C12.9864 8.00043 12.9863 8.00727 12.9861 8.01411C12.9859 8.02095 12.9856 8.02779 12.985 8.04146L12.7489 12.2918C12.6964 13.2364 11.3036 13.2364 11.2512 12.2918L11.015 8.04146C10.9848 7.49747 11.4013 7.03198 11.9453 7.00176L11.9726 7.00062L12 7.00024ZM13 15.0002C13 15.5525 12.5523 16.0002 12 16.0002C11.4477 16.0002 11 15.5525 11 15.0002C11 14.448 11.4477 14.0002 12 14.0002C12.5523 14.0002 13 14.448 13 15.0002Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nexport { AlertIcon }\n"],"names":["alertIconForTone","info","props","React","xmlns","width","height","viewBox","fillRule","clipRule","d","fill","positive","caution","critical","tone","Icon"],"mappings":"kKAGMA,EAA4D,CAC9DC,KAWJ,SAAuBC,GACnB,OACIC,uCACIC,MAAM,6BACNC,MAAM,KACNC,OAAO,KACPC,QAAQ,aACJL,GAEJC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,mMACFC,KAAK,mBAvBjBC,SA6BJ,SAA2BV,GACvB,OACIC,uCACIC,MAAM,6BACNC,MAAM,KACNC,OAAO,KACPC,QAAQ,aACJL,GAEJC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,4KACFC,KAAK,mBAzCjBE,QA+CJ,SAA0BX,GACtB,OACIC,uCACIC,MAAM,6BACNC,MAAM,KACNC,OAAO,KACPC,QAAQ,aACJL,GAEJC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,uSACFC,KAAK,mBA3DjBG,SAiEJ,SAA2BZ,GACvB,OACIC,uCACIC,MAAM,6BACNC,MAAM,KACNC,OAAO,KACPC,QAAQ,aACJL,GAEJC,wBACIK,SAAS,UACTC,SAAS,UACTC,EAAE,s0BACFC,KAAK,sCA3ErB,gBAAmBI,KAAEA,KAASb,iCAC1B,MAAMc,EAAOhB,EAAiBe,GAC9B,OAAOC,EAAOb,gBAACa,qBAASd,IAAY"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={prose:"e3d32437",darkModeTypography:"_95ee669d"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={prose:"_31409006",darkModeTypography:"_500989c8"};
2
2
  //# sourceMappingURL=prose.module.css.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={selectWrapper:"a9cbb3a6",bordered:"f3869290",error:"aefdbdaa"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={selectWrapper:"b930bb07",bordered:"e1f620b6",error:"_7e87474e"};
2
2
  //# sourceMappingURL=select-field.module.css.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={textAreaContainer:"_29503131",innerContainer:"_6ea894ce",bordered:"e1e8b6a7",error:"_1b94ff46",autoExpand:"e82223c4"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={textAreaContainer:"_55ccf266",innerContainer:"_89bb7098",bordered:"_02a47358",error:"_704ff540",autoExpand:"_145ca8f0"};
2
2
  //# sourceMappingURL=text-area.module.css.js.map
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={inputWrapper:"_483abe7b",bordered:"fce9399c",error:"_603b8c4b",slot:"_79ca0da5"};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={inputWrapper:"dea25485",bordered:"_80b6b376",error:"_1a32867a",slot:"dbbd207e"};
2
2
  //# sourceMappingURL=text-field.module.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.js","sources":["../../src/tooltip/tooltip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {\n useTooltipStore,\n Tooltip as AriakitTooltip,\n TooltipAnchor,\n TooltipArrow,\n} from '@ariakit/react'\nimport { Box } from '../box'\n\nimport type { TooltipStoreState } from '@ariakit/react'\n\nimport styles from './tooltip.module.css'\n\ntype TooltipProps = {\n /**\n * The element that triggers the tooltip. Generally a button or link.\n *\n * It should be an interactive element accessible both via mouse and keyboard interactions.\n */\n children: React.ReactNode\n\n /**\n * The content to show in the tooltip.\n *\n * It can be rich content provided via React elements, or string content. It should not include\n * interactive elements inside it. This includes links or buttons.\n *\n * You can provide a function instead of the content itself. In this case, the function should\n * return the desired content. This is useful if the content is expensive to generate. It can\n * also be useful if the content dynamically changes often, so every time you trigger the\n * tooltip the content may have changed (e.g. if you show a ticking time clock in the tooltip).\n *\n * The trigger element will be associated to this content via `aria-describedby`. This means\n * that the tooltip content will be read by assistive technologies such as screen readers. It\n * will likely read this content right after reading the trigger element label.\n */\n content: React.ReactNode | (() => React.ReactNode)\n\n /**\n * How to place the tooltip relative to its trigger element.\n *\n * The possible values are \"top\", \"bottom\", \"left\", \"right\". Additionally, any of these values\n * can be combined with `-start` or `-end` for even more control. For instance `top-start` will\n * place the tooltip at the top, but with the start (e.g. left) side of the toolip and the\n * trigger aligned. If neither `-start` or `-end` are provided, the tooltip is centered along\n * the vertical or horizontal axis with the trigger.\n *\n * The position is enforced whenever possible, but tooltips can appear in different positions\n * if the specified one would make the tooltip intersect with the viewport edges.\n *\n * @default 'top'\n */\n position?: TooltipStoreState['placement']\n\n /**\n * The separation (in pixels) between the trigger element and the tooltip.\n * @default 3\n */\n gapSize?: number\n\n /**\n * Whether to show an arrow-like element attached to the tooltip, and pointing towards the\n * trigger element.\n * @default false\n */\n withArrow?: boolean\n\n /**\n * An escape hatch, in case you need to provide a custom class name to the tooltip.\n */\n exceptionallySetClassName?: string\n}\n\nfunction Tooltip({\n children,\n content,\n position = 'top',\n gapSize = 3,\n withArrow = false,\n exceptionallySetClassName,\n}: TooltipProps) {\n const tooltip = useTooltipStore({ placement: position, showTimeout: 500, hideTimeout: 100 })\n const isOpen = tooltip.useState('open')\n\n const child = React.Children.only(\n children as React.FunctionComponentElement<JSX.IntrinsicElements['div']> | null,\n )\n\n if (!child) {\n return child\n }\n\n if (typeof child.ref === 'string') {\n throw new Error('Tooltip: String refs cannot be used as they cannot be forwarded')\n }\n\n /**\n * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n * tooltips from showing when the trigger element is focused back after a popover or dialog that\n * it opened was closed. See link below for more details.\n * @see https://github.com/ariakit/ariakit/discussions/749\n */\n function handleFocus(event: React.FocusEvent<HTMLDivElement>) {\n // If focus is not followed by a key up event, does it mean that it's not an intentional\n // keyboard focus? Not sure but it seems to work.\n // This may be resolved soon in an upcoming version of ariakit:\n // https://github.com/ariakit/ariakit/issues/750\n function handleKeyUp(event: Event) {\n const eventKey = (event as KeyboardEvent).key\n if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n tooltip.show()\n }\n }\n event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n event.preventDefault() // Prevent tooltip.show from being called by TooltipReference\n child?.props?.onFocus?.(event)\n }\n\n function handleBlur(event: React.FocusEvent<HTMLDivElement>) {\n tooltip.hide()\n child?.props?.onBlur?.(event)\n }\n\n return (\n <>\n <TooltipAnchor\n render={(anchorProps) => {\n return React.cloneElement(child, {\n ...child.props,\n ...anchorProps,\n onFocus: handleFocus,\n onBlur: handleBlur,\n })\n }}\n store={tooltip}\n ref={child.ref}\n />\n {isOpen && content ? (\n <Box\n as={AriakitTooltip}\n gutter={gapSize}\n store={tooltip}\n className={[styles.tooltip, exceptionallySetClassName]}\n background=\"toast\"\n borderRadius=\"standard\"\n paddingX=\"small\"\n paddingY=\"xsmall\"\n maxWidth=\"medium\"\n width=\"fitContent\"\n overflow=\"hidden\"\n textAlign=\"center\"\n >\n {withArrow ? <TooltipArrow /> : null}\n {typeof content === 'function' ? content() : content}\n </Box>\n ) : null}\n </>\n )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n"],"names":["children","content","position","gapSize","withArrow","exceptionallySetClassName","tooltip","useTooltipStore","placement","showTimeout","hideTimeout","isOpen","useState","child","React","only","ref","Error","handleFocus","event","currentTarget","addEventListener","eventKey","key","show","once","preventDefault","props","onFocus","handleBlur","hide","onBlur","TooltipAnchor","render","anchorProps","store","Box","as","AriakitTooltip","gutter","className","styles","background","borderRadius","paddingX","paddingY","maxWidth","width","overflow","textAlign","TooltipArrow"],"mappings":"6PA0EA,UAAiBA,SACbA,EADaC,QAEbA,EAFaC,SAGbA,EAAW,MAHEC,QAIbA,EAAU,EAJGC,UAKbA,GAAY,EALCC,0BAMbA,IAEA,MAAMC,EAAUC,kBAAgB,CAAEC,UAAWN,EAAUO,YAAa,IAAKC,YAAa,MAChFC,EAASL,EAAQM,SAAS,QAE1BC,EAAQC,WAAeC,KACzBf,GAGJ,IAAKa,EACD,OAAOA,EAGX,GAAyB,iBAAdA,EAAMG,IACb,MAAM,IAAIC,MAAM,mEASpB,SAASC,EAAYC,SAWjBA,EAAMC,cAAcC,iBAAiB,SANrC,SAAqBF,GACjB,MAAMG,EAAYH,EAAwBI,IACzB,WAAbD,GAAsC,UAAbA,GAAqC,UAAbA,GACjDhB,EAAQkB,SAG2C,CAAEC,MAAM,IACnEN,EAAMO,uBACNb,YAAAA,EAAOc,gBAAOC,WAAAA,QAAUT,GAG5B,SAASU,EAAWV,SAChBb,EAAQwB,aACRjB,YAAAA,EAAOc,gBAAOI,UAAAA,OAASZ,GAG3B,OACIL,gCACIA,gBAACkB,iBACGC,OAASC,GACEpB,eAAmBD,qDACnBA,EAAMc,OACNO,OACHN,QAASV,EACTa,OAAQF,KAGhBM,MAAO7B,EACPU,IAAKH,EAAMG,MAEdL,GAAUV,EACPa,gBAACsB,OACGC,GAAIC,UACJC,OAAQpC,EACRgC,MAAO7B,EACPkC,UAAW,CAACC,UAAOnC,QAASD,GAC5BqC,WAAW,QACXC,aAAa,WACbC,SAAS,QACTC,SAAS,SACTC,SAAS,SACTC,MAAM,aACNC,SAAS,SACTC,UAAU,UAET7C,EAAYU,gBAACoC,qBAAkB,KACZ,mBAAZjD,EAAyBA,IAAYA,GAEjD"}
1
+ {"version":3,"file":"tooltip.js","sources":["../../src/tooltip/tooltip.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {\n useTooltipStore,\n Tooltip as AriakitTooltip,\n TooltipAnchor,\n TooltipArrow,\n} from '@ariakit/react'\nimport { Box } from '../box'\n\nimport type { TooltipStoreState } from '@ariakit/react'\n\nimport styles from './tooltip.module.css'\n\ntype TooltipProps = {\n /**\n * The element that triggers the tooltip. Generally a button or link.\n *\n * It should be an interactive element accessible both via mouse and keyboard interactions.\n */\n children: React.ReactNode\n\n /**\n * The content to show in the tooltip.\n *\n * It can be rich content provided via React elements, or string content. It should not include\n * interactive elements inside it. This includes links or buttons.\n *\n * You can provide a function instead of the content itself. In this case, the function should\n * return the desired content. This is useful if the content is expensive to generate. It can\n * also be useful if the content dynamically changes often, so every time you trigger the\n * tooltip the content may have changed (e.g. if you show a ticking time clock in the tooltip).\n *\n * The trigger element will be associated to this content via `aria-describedby`. This means\n * that the tooltip content will be read by assistive technologies such as screen readers. It\n * will likely read this content right after reading the trigger element label.\n */\n content: React.ReactNode | (() => React.ReactNode)\n\n /**\n * How to place the tooltip relative to its trigger element.\n *\n * The possible values are \"top\", \"bottom\", \"left\", \"right\". Additionally, any of these values\n * can be combined with `-start` or `-end` for even more control. For instance `top-start` will\n * place the tooltip at the top, but with the start (e.g. left) side of the toolip and the\n * trigger aligned. If neither `-start` or `-end` are provided, the tooltip is centered along\n * the vertical or horizontal axis with the trigger.\n *\n * The position is enforced whenever possible, but tooltips can appear in different positions\n * if the specified one would make the tooltip intersect with the viewport edges.\n *\n * @default 'top'\n */\n position?: TooltipStoreState['placement']\n\n /**\n * The separation (in pixels) between the trigger element and the tooltip.\n * @default 3\n */\n gapSize?: number\n\n /**\n * Whether to show an arrow-like element attached to the tooltip, and pointing towards the\n * trigger element.\n * @default false\n */\n withArrow?: boolean\n\n /**\n * An escape hatch, in case you need to provide a custom class name to the tooltip.\n */\n exceptionallySetClassName?: string\n}\n\nfunction Tooltip({\n children,\n content,\n position = 'top',\n gapSize = 3,\n withArrow = false,\n exceptionallySetClassName,\n}: TooltipProps) {\n const tooltip = useTooltipStore({ placement: position, showTimeout: 500, hideTimeout: 100 })\n const isOpen = tooltip.useState('open')\n\n const child = React.Children.only(\n children as React.FunctionComponentElement<JSX.IntrinsicElements['div']> | null,\n )\n\n if (!child) {\n return child\n }\n\n if (typeof child.ref === 'string') {\n throw new Error('Tooltip: String refs cannot be used as they cannot be forwarded')\n }\n\n /**\n * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n * tooltips from showing when the trigger element is focused back after a popover or dialog that\n * it opened was closed. See link below for more details.\n * @see https://github.com/ariakit/ariakit/discussions/749\n */\n function handleFocus(event: React.FocusEvent<HTMLDivElement>) {\n // If focus is not followed by a key up event, does it mean that it's not an intentional\n // keyboard focus? Not sure but it seems to work.\n // This may be resolved soon in an upcoming version of ariakit:\n // https://github.com/ariakit/ariakit/issues/750\n function handleKeyUp(event: Event) {\n const eventKey = (event as KeyboardEvent).key\n if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n tooltip.show()\n }\n }\n event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n event.preventDefault() // Prevent tooltip.show from being called by TooltipReference\n child?.props?.onFocus?.(event)\n }\n\n function handleBlur(event: React.FocusEvent<HTMLDivElement>) {\n tooltip.hide()\n child?.props?.onBlur?.(event)\n }\n\n return (\n <>\n <TooltipAnchor\n render={(anchorProps) => {\n // Let child props override anchor props so user can specify attributes like tabIndex\n // Also, do not apply the child's props to TooltipAnchor as props like `as` can create problems\n // by applying the replacement component/element twice\n return React.cloneElement(child, {\n ...child.props,\n ...anchorProps,\n onFocus: handleFocus,\n onBlur: handleBlur,\n })\n }}\n store={tooltip}\n ref={child.ref}\n />\n {isOpen && content ? (\n <Box\n as={AriakitTooltip}\n gutter={gapSize}\n store={tooltip}\n className={[styles.tooltip, exceptionallySetClassName]}\n background=\"toast\"\n borderRadius=\"standard\"\n paddingX=\"small\"\n paddingY=\"xsmall\"\n maxWidth=\"medium\"\n width=\"fitContent\"\n overflow=\"hidden\"\n textAlign=\"center\"\n >\n {withArrow ? <TooltipArrow /> : null}\n {typeof content === 'function' ? content() : content}\n </Box>\n ) : null}\n </>\n )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n"],"names":["children","content","position","gapSize","withArrow","exceptionallySetClassName","tooltip","useTooltipStore","placement","showTimeout","hideTimeout","isOpen","useState","child","React","only","ref","Error","handleFocus","event","currentTarget","addEventListener","eventKey","key","show","once","preventDefault","props","onFocus","handleBlur","hide","onBlur","TooltipAnchor","render","anchorProps","store","Box","as","AriakitTooltip","gutter","className","styles","background","borderRadius","paddingX","paddingY","maxWidth","width","overflow","textAlign","TooltipArrow"],"mappings":"6PA0EA,UAAiBA,SACbA,EADaC,QAEbA,EAFaC,SAGbA,EAAW,MAHEC,QAIbA,EAAU,EAJGC,UAKbA,GAAY,EALCC,0BAMbA,IAEA,MAAMC,EAAUC,kBAAgB,CAAEC,UAAWN,EAAUO,YAAa,IAAKC,YAAa,MAChFC,EAASL,EAAQM,SAAS,QAE1BC,EAAQC,WAAeC,KACzBf,GAGJ,IAAKa,EACD,OAAOA,EAGX,GAAyB,iBAAdA,EAAMG,IACb,MAAM,IAAIC,MAAM,mEASpB,SAASC,EAAYC,SAWjBA,EAAMC,cAAcC,iBAAiB,SANrC,SAAqBF,GACjB,MAAMG,EAAYH,EAAwBI,IACzB,WAAbD,GAAsC,UAAbA,GAAqC,UAAbA,GACjDhB,EAAQkB,SAG2C,CAAEC,MAAM,IACnEN,EAAMO,uBACNb,YAAAA,EAAOc,gBAAOC,WAAAA,QAAUT,GAG5B,SAASU,EAAWV,SAChBb,EAAQwB,aACRjB,YAAAA,EAAOc,gBAAOI,UAAAA,OAASZ,GAG3B,OACIL,gCACIA,gBAACkB,iBACGC,OAASC,GAIEpB,eAAmBD,qDACnBA,EAAMc,OACNO,OACHN,QAASV,EACTa,OAAQF,KAGhBM,MAAO7B,EACPU,IAAKH,EAAMG,MAEdL,GAAUV,EACPa,gBAACsB,OACGC,GAAIC,UACJC,OAAQpC,EACRgC,MAAO7B,EACPkC,UAAW,CAACC,UAAOnC,QAASD,GAC5BqC,WAAW,QACXC,aAAa,WACbC,SAAS,QACTC,SAAS,SACTC,SAAS,SACTC,MAAM,aACNC,SAAS,SACTC,UAAU,UAET7C,EAAYU,gBAACoC,qBAAkB,KACZ,mBAAZjD,EAAyBA,IAAYA,GAEjD"}
package/package.json CHANGED
@@ -6,7 +6,7 @@
6
6
  "email": "henning@doist.com",
7
7
  "url": "http://doist.com"
8
8
  },
9
- "version": "22.0.3-beta",
9
+ "version": "22.0.4-beta",
10
10
  "license": "MIT",
11
11
  "homepage": "https://github.com/Doist/reactist#readme",
12
12
  "repository": {
@@ -28,7 +28,7 @@
28
28
  "styles"
29
29
  ],
30
30
  "engines": {
31
- "node": "^16.0.0 || ^18.0.0 || ^20.0.0",
31
+ "node": "^16.0.0 || ^18.0.0 || ^20.0.0 || ^21.0.0",
32
32
  "npm": "^8.3.0 || ^9.0.0 || ^10.0.0"
33
33
  },
34
34
  "scripts": {
@@ -143,7 +143,7 @@
143
143
  "webpack": "^4.43.0"
144
144
  },
145
145
  "dependencies": {
146
- "@ariakit/react": "^0.3.7",
146
+ "@ariakit/react": "^0.3.14",
147
147
  "aria-hidden": "^1.2.1",
148
148
  "dayjs": "^1.8.10",
149
149
  "patch-package": "^6.4.6",
package/styles/alert.css CHANGED
@@ -7,4 +7,4 @@
7
7
  :root{--reactist-spinner-tint:var(--reactist-bg-brand);--reactist-spinner-fill:var(--reactist-framework-fill-crest)}@-webkit-keyframes _54fbe2b3{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes _54fbe2b3{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}._51539197{-webkit-animation-name:_54fbe2b3;animation-name:_54fbe2b3;-webkit-animation-duration:1.2s;animation-duration:1.2s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear}.a0c466ed{fill:var(--reactist-spinner-tint)}._745b73d3{fill:var(--reactist-spinner-fill)}
8
8
  :root{--reactist-button-small-font-size:var(--reactist-font-size-caption);--reactist-button-small-spacing:var(--reactist-spacing-small);--reactist-button-small-height:28px;--reactist-button-normal-font-size:var(--reactist-font-size-copy);--reactist-button-normal-spacing:var(--reactist-spacing-medium);--reactist-button-normal-height:32px;--reactist-button-large-font-size:var(--reactist-font-size-body);--reactist-button-large-spacing:var(--reactist-spacing-large);--reactist-button-large-height:36px;--reactist-actionable-primary-idle-tint:#fff;--reactist-actionable-primary-idle-fill:#008aa6;--reactist-actionable-primary-hover-tint:#fff;--reactist-actionable-primary-hover-fill:#007992;--reactist-actionable-primary-disabled-tint:#fff;--reactist-actionable-primary-disabled-fill:#99d0db;--reactist-actionable-secondary-idle-tint:#282f30;--reactist-actionable-secondary-idle-fill:#f2f6f7;--reactist-actionable-secondary-hover-tint:#282f30;--reactist-actionable-secondary-hover-fill:#e3e7e8;--reactist-actionable-secondary-disabled-tint:#a9acac;--reactist-actionable-secondary-disabled-fill:#f2f6f7;--reactist-actionable-tertiary-idle-tint:#006f85;--reactist-actionable-tertiary-hover-tint:#006f85;--reactist-actionable-tertiary-hover-fill:#f2f6f7;--reactist-actionable-tertiary-disabled-tint:#99c5ce;--reactist-actionable-quaternary-idle-tint:#6c777a;--reactist-actionable-quaternary-hover-tint:#282f30;--reactist-actionable-quaternary-hover-fill:#e0e7e8;--reactist-actionable-quaternary-disabled-tint:#c4c9ca;--reactist-actionable-primary-destructive-idle-tint:#fff;--reactist-actionable-primary-destructive-idle-fill:#dc4c3e;--reactist-actionable-primary-destructive-hover-tint:#fff;--reactist-actionable-primary-destructive-hover-fill:#b03d32;--reactist-actionable-primary-destructive-disabled-tint:#fff;--reactist-actionable-primary-destructive-disabled-fill:#f1b7b2;--reactist-actionable-secondary-destructive-idle-tint:#dc4c3e;--reactist-actionable-secondary-destructive-hover-tint:#b03d32;--reactist-actionable-secondary-destructive-hover-fill:transparent;--reactist-actionable-secondary-destructive-disabled-tint:#f1b7b2}._8313bd46{max-width:100%;display:flex;flex-direction:row;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:inherit;background-color:transparent;border-radius:var(--reactist-border-radius-small);white-space:nowrap;font-family:var(--reactist-font-family);font-weight:var(--reactist-font-weight-medium);text-decoration:none;border:1px solid transparent;transition-duration:.3s;transition-property:color,background-color;transition-timing-function:cubic-bezier(.4,0,.2,1)}._0051d171{text-overflow:ellipsis;white-space:nowrap;font-size:inherit}._8313bd46:active:not([aria-disabled=true]){transform:scale(.97);transition:transform .2s cubic-bezier(.02,1.505,.745,1.235)}._8313bd46{padding:0 var(--reactist-btn-spacing);font-size:var(--reactist-btn-font-size);height:var(--reactist-btn-height);line-height:var(--reactist-btn-height);--reactist-spinner-tint:var(--reactist-btn-idle-tint);--reactist-spinner-fill:var(--reactist-btn-idle-fill)}._8313bd46._8eb8f0fa{border-radius:1000px}._8313bd46._8b7f1a82{--reactist-btn-height:var(--reactist-button-small-height);--reactist-btn-spacing:var(--reactist-button-small-spacing);--reactist-btn-font-size:var(--reactist-button-small-font-size)}._8313bd46._5e45d59f{--reactist-btn-height:var(--reactist-button-normal-height);--reactist-btn-spacing:var(--reactist-button-normal-spacing);--reactist-btn-font-size:var(--reactist-button-normal-font-size)}._8313bd46._95951888{--reactist-btn-height:var(--reactist-button-large-height);--reactist-btn-spacing:var(--reactist-button-large-spacing);--reactist-btn-font-size:var(--reactist-button-large-font-size)}._8313bd46:not(._43792df1){color:var(--reactist-btn-idle-tint);background-color:var(--reactist-btn-idle-fill)}._8313bd46:focus-visible:not([aria-disabled=true]),._8313bd46:hover:not([aria-disabled=true]),._8313bd46[aria-expanded=true]{color:var(--reactist-btn-hover-tint);background-color:var(--reactist-btn-hover-fill)}._8313bd46._43792df1{cursor:not-allowed;color:var(--reactist-btn-disabled-tint);background-color:var(--reactist-btn-disabled-fill)}._8313bd46:not(._8644eccb){min-width:68px}._8313bd46._8644eccb{width:var(--reactist-btn-height);height:var(--reactist-btn-height);padding:0}._8313bd46 .a44d4350{margin-right:calc(var(--reactist-btn-spacing) - 6px);margin-left:-6px}._8313bd46 ._073e1aa4{margin-left:calc(var(--reactist-btn-spacing) - 6px);margin-right:-6px}._8313bd46>*{pointer-events:none}._7a4dbd5f{--reactist-btn-idle-tint:var(--reactist-actionable-primary-idle-tint);--reactist-btn-idle-fill:var(--reactist-actionable-primary-idle-fill);--reactist-btn-hover-tint:var(--reactist-actionable-primary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-primary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-primary-disabled-tint);--reactist-btn-disabled-fill:var(--reactist-actionable-primary-disabled-fill)}._54d56775{--reactist-btn-idle-tint:var(--reactist-actionable-secondary-idle-tint);--reactist-btn-idle-fill:var(--reactist-actionable-secondary-idle-fill);--reactist-btn-hover-tint:var(--reactist-actionable-secondary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-secondary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-secondary-disabled-tint);--reactist-btn-disabled-fill:var(--reactist-actionable-secondary-disabled-fill)}._907a61ca{--reactist-btn-idle-tint:var(--reactist-actionable-tertiary-idle-tint);--reactist-btn-hover-tint:var(--reactist-actionable-tertiary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-tertiary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-tertiary-disabled-tint)}.f169a390,._907a61ca{--reactist-btn-idle-fill:transparent;--reactist-btn-disabled-fill:transparent}.f169a390{--reactist-btn-idle-tint:var(--reactist-actionable-quaternary-idle-tint);--reactist-btn-hover-tint:var(--reactist-actionable-quaternary-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-quaternary-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-quaternary-disabled-tint)}._7a4dbd5f.ccb3eb8c{--reactist-btn-idle-tint:var(--reactist-actionable-primary-destructive-idle-tint);--reactist-btn-idle-fill:var(--reactist-actionable-primary-destructive-idle-fill);--reactist-btn-hover-tint:var(--reactist-actionable-primary-destructive-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-primary-destructive-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-primary-destructive-disabled-tint);--reactist-btn-disabled-fill:var(--reactist-actionable-primary-destructive-disabled-fill)}._54d56775.ccb3eb8c{--reactist-btn-idle-tint:var(--reactist-actionable-secondary-destructive-idle-tint);--reactist-btn-idle-fill:transparent;--reactist-btn-hover-tint:var(--reactist-actionable-secondary-destructive-hover-tint);--reactist-btn-hover-fill:var(--reactist-actionable-secondary-destructive-hover-fill);--reactist-btn-disabled-tint:var(--reactist-actionable-secondary-destructive-disabled-tint);--reactist-btn-disabled-fill:transparent;border-color:var(--reactist-btn-idle-tint)}._54d56775.ccb3eb8c:hover{border-color:var(--reactist-btn-hover-tint)}._54d56775.ccb3eb8c._43792df1{border-color:var(--reactist-btn-disabled-tint)}.f169a390.ccb3eb8c,._907a61ca.ccb3eb8c{--reactist-btn-idle-tint:var(--reactist-actionable-secondary-destructive-idle-tint);--reactist-btn-hover-tint:var(--reactist-actionable-secondary-destructive-hover-tint);--reactist-btn-disabled-tint:var(--reactist-actionable-secondary-destructive-disabled-tint)}
9
9
  .eae3d34f,.eae3d34f>:last-child{--reactist-columns-gap:0px}._9b4012c9{--reactist-columns-gap:var(--reactist-spacing-xsmall)}.e35e0320{--reactist-columns-gap:var(--reactist-spacing-small)}._0703e67f{--reactist-columns-gap:var(--reactist-spacing-medium)}._1cf15621{--reactist-columns-gap:var(--reactist-spacing-large)}._1c7dff67{--reactist-columns-gap:var(--reactist-spacing-xlarge)}._25bee9b6{--reactist-columns-gap:var(--reactist-spacing-xxlarge)}._4bb9987d{flex-basis:content}._9dd31975{flex-basis:auto}._38d11c0e{flex-basis:calc(50% - var(--reactist-columns-gap))}._7ac225c6{flex-basis:calc(33.33333% - var(--reactist-columns-gap))}._9c340680{flex-basis:calc(66.66667% - var(--reactist-columns-gap))}._81cb99d2{flex-basis:calc(25% - var(--reactist-columns-gap))}._10fd355f{flex-basis:calc(75% - var(--reactist-columns-gap))}._3ee66520{flex-basis:calc(20% - var(--reactist-columns-gap))}.df1201a5{flex-basis:calc(40% - var(--reactist-columns-gap))}.f772e0b2{flex-basis:calc(60% - var(--reactist-columns-gap))}._880cbbb1{flex-basis:calc(80% - var(--reactist-columns-gap))}
10
- .eb665121{border-style:solid;border-width:1px;color:var(--reactist-content-primary);padding:var(--reactist-spacing-small);min-height:calc(2*var(--reactist-spacing-small) + var(--reactist-button-small-height) + 2px)}.d0373ff9{background-color:var(--reactist-alert-tone-info-background);border-color:var(--reactist-alert-tone-info-border)}.d0373ff9 svg{color:var(--reactist-alert-tone-info-icon)}.bb18dcab{background-color:var(--reactist-alert-tone-positive-background);border-color:var(--reactist-alert-tone-positive-border)}.bb18dcab svg{color:var(--reactist-alert-tone-positive-icon)}._0af02331{background-color:var(--reactist-alert-tone-caution-background);border-color:var(--reactist-alert-tone-caution-border)}._0af02331 svg{color:var(--reactist-alert-tone-caution-icon)}.f76146f9{background-color:var(--reactist-alert-tone-critical-background);border-color:var(--reactist-alert-tone-critical-border)}.f76146f9 svg{color:var(--reactist-alert-tone-critical-icon)}
10
+ ._51a84fb3{border-style:solid;border-width:1px;color:var(--reactist-content-primary);padding:var(--reactist-spacing-small);min-height:calc(2*var(--reactist-spacing-small) + var(--reactist-button-small-height) + 2px)}._5649104a{background-color:var(--reactist-alert-tone-info-background);border-color:var(--reactist-alert-tone-info-border)}._5649104a ._79fa06e2{color:var(--reactist-alert-tone-info-icon)}.c67632e4{background-color:var(--reactist-alert-tone-positive-background);border-color:var(--reactist-alert-tone-positive-border)}.c67632e4 ._79fa06e2{color:var(--reactist-alert-tone-positive-icon)}._654ff216{background-color:var(--reactist-alert-tone-caution-background);border-color:var(--reactist-alert-tone-caution-border)}._654ff216 ._79fa06e2{color:var(--reactist-alert-tone-caution-icon)}.b1ee4ff1{background-color:var(--reactist-alert-tone-critical-background);border-color:var(--reactist-alert-tone-critical-border)}.b1ee4ff1 ._79fa06e2{color:var(--reactist-alert-tone-critical-icon)}
@@ -1 +1 @@
1
- .eb665121{border-style:solid;border-width:1px;color:var(--reactist-content-primary);padding:var(--reactist-spacing-small);min-height:calc(2*var(--reactist-spacing-small) + var(--reactist-button-small-height) + 2px)}.d0373ff9{background-color:var(--reactist-alert-tone-info-background);border-color:var(--reactist-alert-tone-info-border)}.d0373ff9 svg{color:var(--reactist-alert-tone-info-icon)}.bb18dcab{background-color:var(--reactist-alert-tone-positive-background);border-color:var(--reactist-alert-tone-positive-border)}.bb18dcab svg{color:var(--reactist-alert-tone-positive-icon)}._0af02331{background-color:var(--reactist-alert-tone-caution-background);border-color:var(--reactist-alert-tone-caution-border)}._0af02331 svg{color:var(--reactist-alert-tone-caution-icon)}.f76146f9{background-color:var(--reactist-alert-tone-critical-background);border-color:var(--reactist-alert-tone-critical-border)}.f76146f9 svg{color:var(--reactist-alert-tone-critical-icon)}
1
+ ._51a84fb3{border-style:solid;border-width:1px;color:var(--reactist-content-primary);padding:var(--reactist-spacing-small);min-height:calc(2*var(--reactist-spacing-small) + var(--reactist-button-small-height) + 2px)}._5649104a{background-color:var(--reactist-alert-tone-info-background);border-color:var(--reactist-alert-tone-info-border)}._5649104a ._79fa06e2{color:var(--reactist-alert-tone-info-icon)}.c67632e4{background-color:var(--reactist-alert-tone-positive-background);border-color:var(--reactist-alert-tone-positive-border)}.c67632e4 ._79fa06e2{color:var(--reactist-alert-tone-positive-icon)}._654ff216{background-color:var(--reactist-alert-tone-caution-background);border-color:var(--reactist-alert-tone-caution-border)}._654ff216 ._79fa06e2{color:var(--reactist-alert-tone-caution-icon)}.b1ee4ff1{background-color:var(--reactist-alert-tone-critical-background);border-color:var(--reactist-alert-tone-critical-border)}.b1ee4ff1 ._79fa06e2{color:var(--reactist-alert-tone-critical-icon)}
package/styles/badge.css CHANGED
@@ -3,4 +3,4 @@
3
3
  .c7813d79{margin-top:var(--reactist-spacing-xsmall)}.d3449da6{margin-top:var(--reactist-spacing-small)}._4ea254c1{margin-top:var(--reactist-spacing-medium)}.c0844f64{margin-top:var(--reactist-spacing-large)}._213145b4{margin-top:var(--reactist-spacing-xlarge)}.df61c84c{margin-top:var(--reactist-spacing-xxlarge)}.efe72b13{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}._870c2768{margin-top:calc(var(--reactist-spacing-small)*-1)}._0b927c57{margin-top:calc(var(--reactist-spacing-medium)*-1)}._461db014{margin-top:calc(var(--reactist-spacing-large)*-1)}._2a3a8cb8{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}._9bcda921{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._6add01e4{margin-top:var(--reactist-spacing-xsmall)}._735ef86b{margin-top:var(--reactist-spacing-small)}._0477d068{margin-top:var(--reactist-spacing-medium)}._2c90af97{margin-top:var(--reactist-spacing-large)}._63a82db6{margin-top:var(--reactist-spacing-xlarge)}._03cd7726{margin-top:var(--reactist-spacing-xxlarge)}.c986a62a{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}.be2bdcdd{margin-top:calc(var(--reactist-spacing-small)*-1)}._47d2686b{margin-top:calc(var(--reactist-spacing-medium)*-1)}._25e5af9d{margin-top:calc(var(--reactist-spacing-large)*-1)}.ee82f441{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}.a6f9d404{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._4d8d9a36{margin-top:var(--reactist-spacing-xsmall)}.e813cee7{margin-top:var(--reactist-spacing-small)}._56975b7d{margin-top:var(--reactist-spacing-medium)}._53b367f6{margin-top:var(--reactist-spacing-large)}.d69e7311{margin-top:var(--reactist-spacing-xlarge)}._92f57c7e{margin-top:var(--reactist-spacing-xxlarge)}._96880d3e{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}.dc3f3555{margin-top:calc(var(--reactist-spacing-small)*-1)}._86dd06bb{margin-top:calc(var(--reactist-spacing-medium)*-1)}.c93ef12e{margin-top:calc(var(--reactist-spacing-large)*-1)}.bc8fd4a2{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}.b12a9124{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}}._6016f4fb{margin-right:var(--reactist-spacing-xsmall)}.b85e3dfa{margin-right:var(--reactist-spacing-small)}._297575f4{margin-right:var(--reactist-spacing-medium)}.b401ac6c{margin-right:var(--reactist-spacing-large)}.dc3ec387{margin-right:var(--reactist-spacing-xlarge)}._24694604{margin-right:var(--reactist-spacing-xxlarge)}._8e9bf2ee{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}.ae9d1115{margin-right:calc(var(--reactist-spacing-small)*-1)}._14e46fc3{margin-right:calc(var(--reactist-spacing-medium)*-1)}._3370631b{margin-right:calc(var(--reactist-spacing-large)*-1)}._3f0e9b50{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}.bc13e010{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._6fa1aae3{margin-right:var(--reactist-spacing-xsmall)}._2976c5cb{margin-right:var(--reactist-spacing-small)}._38d94802{margin-right:var(--reactist-spacing-medium)}.db9569b5{margin-right:var(--reactist-spacing-large)}._4a52f06d{margin-right:var(--reactist-spacing-xlarge)}._8a0f0410{margin-right:var(--reactist-spacing-xxlarge)}.e7d40e9d{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}._680fde91{margin-right:calc(var(--reactist-spacing-small)*-1)}._021010ca{margin-right:calc(var(--reactist-spacing-medium)*-1)}._9e52c87c{margin-right:calc(var(--reactist-spacing-large)*-1)}._4d602613{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}._21b1b65a{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._7321bc07{margin-right:var(--reactist-spacing-xsmall)}.fa1721f4{margin-right:var(--reactist-spacing-small)}._3fd7b4b8{margin-right:var(--reactist-spacing-medium)}._4fdc2f74{margin-right:var(--reactist-spacing-large)}.c0254761{margin-right:var(--reactist-spacing-xlarge)}._710a5f09{margin-right:var(--reactist-spacing-xxlarge)}.e08bee7f{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}.e5ab73d2{margin-right:calc(var(--reactist-spacing-small)*-1)}._5e731477{margin-right:calc(var(--reactist-spacing-medium)*-1)}._0f57a22e{margin-right:calc(var(--reactist-spacing-large)*-1)}._25f26ed3{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}._11a3b4e0{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}}._6a4f69f7{margin-bottom:var(--reactist-spacing-xsmall)}.db26b033{margin-bottom:var(--reactist-spacing-small)}.c7313022{margin-bottom:var(--reactist-spacing-medium)}.a5885889{margin-bottom:var(--reactist-spacing-large)}._33dfbd8e{margin-bottom:var(--reactist-spacing-xlarge)}._795ad2de{margin-bottom:var(--reactist-spacing-xxlarge)}.a329dbd3{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._85e739fb{margin-bottom:calc(var(--reactist-spacing-small)*-1)}._681f65ff{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}.caf50d8f{margin-bottom:calc(var(--reactist-spacing-large)*-1)}._1e084cbf{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}._3dfb1c7e{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){.ef4735be{margin-bottom:var(--reactist-spacing-xsmall)}.de55afba{margin-bottom:var(--reactist-spacing-small)}._0e33ce88{margin-bottom:var(--reactist-spacing-medium)}._8ca391fc{margin-bottom:var(--reactist-spacing-large)}._3a609d23{margin-bottom:var(--reactist-spacing-xlarge)}._3e1177e4{margin-bottom:var(--reactist-spacing-xxlarge)}.d384884d{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._75254cec{margin-bottom:calc(var(--reactist-spacing-small)*-1)}._5d9f127d{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}._835f1089{margin-bottom:calc(var(--reactist-spacing-large)*-1)}.dad52a72{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}._8703a4bf{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._90fd20e9{margin-bottom:var(--reactist-spacing-xsmall)}.f3769191{margin-bottom:var(--reactist-spacing-small)}._156410f8{margin-bottom:var(--reactist-spacing-medium)}._7fed74d0{margin-bottom:var(--reactist-spacing-large)}._477dc10e{margin-bottom:var(--reactist-spacing-xlarge)}._85c82d89{margin-bottom:var(--reactist-spacing-xxlarge)}._4f09c1e0{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._9523e048{margin-bottom:calc(var(--reactist-spacing-small)*-1)}.efe10240{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}.c43971e6{margin-bottom:calc(var(--reactist-spacing-large)*-1)}.f9b4da15{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}.a10fdf70{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}}.f9be90b4{margin-left:var(--reactist-spacing-xsmall)}.f53218d5{margin-left:var(--reactist-spacing-small)}.c4a9b3ab{margin-left:var(--reactist-spacing-medium)}._5755e2c3{margin-left:var(--reactist-spacing-large)}._33fc9354{margin-left:var(--reactist-spacing-xlarge)}._4749a3bf{margin-left:var(--reactist-spacing-xxlarge)}.c76cb3c7{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}._96003c07{margin-left:calc(var(--reactist-spacing-small)*-1)}._09988d07{margin-left:calc(var(--reactist-spacing-medium)*-1)}.b4a486f6{margin-left:calc(var(--reactist-spacing-large)*-1)}.f396e75e{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}._81d1f26d{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._0a46e8f1{margin-left:var(--reactist-spacing-xsmall)}._57c970af{margin-left:var(--reactist-spacing-small)}._4b6099d3{margin-left:var(--reactist-spacing-medium)}._378fcff5{margin-left:var(--reactist-spacing-large)}.f8785663{margin-left:var(--reactist-spacing-xlarge)}._72f957ee{margin-left:var(--reactist-spacing-xxlarge)}._2288c7e1{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}.b27c1c05{margin-left:calc(var(--reactist-spacing-small)*-1)}._702cbb13{margin-left:calc(var(--reactist-spacing-medium)*-1)}._1a2748b4{margin-left:calc(var(--reactist-spacing-large)*-1)}.b8c043a5{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}._8dc8ff63{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){.c2af646d{margin-left:var(--reactist-spacing-xsmall)}.c03d07be{margin-left:var(--reactist-spacing-small)}._915fb1d3{margin-left:var(--reactist-spacing-medium)}._64214ee1{margin-left:var(--reactist-spacing-large)}._7be4a22c{margin-left:var(--reactist-spacing-xlarge)}._5ec0a401{margin-left:var(--reactist-spacing-xxlarge)}.ea29f1ee{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}.c26652c7{margin-left:calc(var(--reactist-spacing-small)*-1)}.c24f6af9{margin-left:calc(var(--reactist-spacing-medium)*-1)}.c2671f27{margin-left:calc(var(--reactist-spacing-large)*-1)}.cc51a04e{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}.fd581f54{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}}
4
4
  ._68ab48ca{min-width:0}._6fa2b565{min-width:var(--reactist-width-xsmall)}.dd50fabd{min-width:var(--reactist-width-small)}.e7e2c808{min-width:var(--reactist-width-medium)}._6abbe25e{min-width:var(--reactist-width-large)}._54f479ac{min-width:var(--reactist-width-xlarge)}._148492bc{max-width:var(--reactist-width-xsmall)}.bd023b96{max-width:var(--reactist-width-small)}.e102903f{max-width:var(--reactist-width-medium)}._0e8d76d7{max-width:var(--reactist-width-large)}._47a031d0{max-width:var(--reactist-width-xlarge)}.cd4c8183{max-width:100%}._5f5959e8{width:0}._8c75067a{width:100%}._56a651f6{width:auto}._26f87bb8{width:-moz-max-content;width:-webkit-max-content;width:max-content}._07a6ab44{width:-moz-min-content;width:-webkit-min-content;width:min-content}.a87016fa{width:-moz-fit-content;width:-webkit-fit-content;width:fit-content}._1a972e50{width:var(--reactist-width-xsmall)}.c96d8261{width:var(--reactist-width-small)}.f3829d42{width:var(--reactist-width-medium)}._2caef228{width:var(--reactist-width-large)}._069e1491{width:var(--reactist-width-xlarge)}
5
5
  ._64ed24f4{gap:0}._2580a74b{gap:var(--reactist-spacing-xsmall)}.c68f8bf6{gap:var(--reactist-spacing-small)}._43e5f8e9{gap:var(--reactist-spacing-medium)}._966b120f{gap:var(--reactist-spacing-large)}.f957894c{gap:var(--reactist-spacing-xlarge)}._8cca104b{gap:var(--reactist-spacing-xxlarge)}@media (min-width:768px){._5797cee2{gap:0}._9015672f{gap:var(--reactist-spacing-xsmall)}._7ec86eec{gap:var(--reactist-spacing-small)}._714d7179{gap:var(--reactist-spacing-medium)}.ae1deb59{gap:var(--reactist-spacing-large)}.e1cfce55{gap:var(--reactist-spacing-xlarge)}._168a8ff8{gap:var(--reactist-spacing-xxlarge)}}@media (min-width:992px){._43e2b619{gap:0}._0ea9bf88{gap:var(--reactist-spacing-xsmall)}.d451307a{gap:var(--reactist-spacing-small)}.bf93cf66{gap:var(--reactist-spacing-medium)}._1430cddf{gap:var(--reactist-spacing-large)}.fa00c93e{gap:var(--reactist-spacing-xlarge)}._6f3aee54{gap:var(--reactist-spacing-xxlarge)}}
6
- :root{--reactist-badge-font-size:10px;--reactist-badge-info-tint:#666;--reactist-badge-info-fill:#eee;--reactist-badge-positive-tint:#058527;--reactist-badge-positive-fill:#e0f0e3;--reactist-badge-promote-tint:#8f4700;--reactist-badge-promote-fill:#faead1;--reactist-badge-attention-tint:#cf473a;--reactist-badge-attention-fill:#f9e3e2}._7957de66{font-family:var(--reactist-font-family);font-weight:var(--reactist-font-weight-strong);font-size:var(--reactist-badge-font-size);text-transform:uppercase;letter-spacing:.1em;border-radius:3px;padding:1px var(--reactist-spacing-xsmall);color:var(--reactist-badge-tint);background-color:var(--reactist-badge-fill);line-height:calc(var(--reactist-badge-font-size) + 3px)}.c6106b8c{--reactist-badge-tint:var(--reactist-badge-info-tint);--reactist-badge-fill:var(--reactist-badge-info-fill)}._6b06bf87{--reactist-badge-tint:var(--reactist-badge-positive-tint);--reactist-badge-fill:var(--reactist-badge-positive-fill)}.a6d2daa2{--reactist-badge-tint:var(--reactist-badge-promote-tint);--reactist-badge-fill:var(--reactist-badge-promote-fill)}.bbb036ff{--reactist-badge-tint:var(--reactist-badge-attention-tint);--reactist-badge-fill:var(--reactist-badge-attention-fill)}
6
+ :root{--reactist-badge-font-size:10px;--reactist-badge-info-tint:#666;--reactist-badge-info-fill:#eee;--reactist-badge-positive-tint:#058527;--reactist-badge-positive-fill:#e0f0e3;--reactist-badge-promote-tint:#8f4700;--reactist-badge-promote-fill:#faead1;--reactist-badge-attention-tint:#cf473a;--reactist-badge-attention-fill:#f9e3e2}._0a7f0497{font-family:var(--reactist-font-family);font-weight:var(--reactist-font-weight-strong);font-size:var(--reactist-badge-font-size);text-transform:uppercase;letter-spacing:.1em;border-radius:3px;padding:1px var(--reactist-spacing-xsmall);color:var(--reactist-badge-tint);background-color:var(--reactist-badge-fill);line-height:calc(var(--reactist-badge-font-size) + 3px);white-space:nowrap}._0587142f{--reactist-badge-tint:var(--reactist-badge-info-tint);--reactist-badge-fill:var(--reactist-badge-info-fill)}._6f5c326e{--reactist-badge-tint:var(--reactist-badge-positive-tint);--reactist-badge-fill:var(--reactist-badge-positive-fill)}._949e0f54{--reactist-badge-tint:var(--reactist-badge-promote-tint);--reactist-badge-fill:var(--reactist-badge-promote-fill)}._36115518{--reactist-badge-tint:var(--reactist-badge-attention-tint);--reactist-badge-fill:var(--reactist-badge-attention-fill)}
@@ -1 +1 @@
1
- :root{--reactist-badge-font-size:10px;--reactist-badge-info-tint:#666;--reactist-badge-info-fill:#eee;--reactist-badge-positive-tint:#058527;--reactist-badge-positive-fill:#e0f0e3;--reactist-badge-promote-tint:#8f4700;--reactist-badge-promote-fill:#faead1;--reactist-badge-attention-tint:#cf473a;--reactist-badge-attention-fill:#f9e3e2}._7957de66{font-family:var(--reactist-font-family);font-weight:var(--reactist-font-weight-strong);font-size:var(--reactist-badge-font-size);text-transform:uppercase;letter-spacing:.1em;border-radius:3px;padding:1px var(--reactist-spacing-xsmall);color:var(--reactist-badge-tint);background-color:var(--reactist-badge-fill);line-height:calc(var(--reactist-badge-font-size) + 3px)}.c6106b8c{--reactist-badge-tint:var(--reactist-badge-info-tint);--reactist-badge-fill:var(--reactist-badge-info-fill)}._6b06bf87{--reactist-badge-tint:var(--reactist-badge-positive-tint);--reactist-badge-fill:var(--reactist-badge-positive-fill)}.a6d2daa2{--reactist-badge-tint:var(--reactist-badge-promote-tint);--reactist-badge-fill:var(--reactist-badge-promote-fill)}.bbb036ff{--reactist-badge-tint:var(--reactist-badge-attention-tint);--reactist-badge-fill:var(--reactist-badge-attention-fill)}
1
+ :root{--reactist-badge-font-size:10px;--reactist-badge-info-tint:#666;--reactist-badge-info-fill:#eee;--reactist-badge-positive-tint:#058527;--reactist-badge-positive-fill:#e0f0e3;--reactist-badge-promote-tint:#8f4700;--reactist-badge-promote-fill:#faead1;--reactist-badge-attention-tint:#cf473a;--reactist-badge-attention-fill:#f9e3e2}._0a7f0497{font-family:var(--reactist-font-family);font-weight:var(--reactist-font-weight-strong);font-size:var(--reactist-badge-font-size);text-transform:uppercase;letter-spacing:.1em;border-radius:3px;padding:1px var(--reactist-spacing-xsmall);color:var(--reactist-badge-tint);background-color:var(--reactist-badge-fill);line-height:calc(var(--reactist-badge-font-size) + 3px);white-space:nowrap}._0587142f{--reactist-badge-tint:var(--reactist-badge-info-tint);--reactist-badge-fill:var(--reactist-badge-info-fill)}._6f5c326e{--reactist-badge-tint:var(--reactist-badge-positive-tint);--reactist-badge-fill:var(--reactist-badge-positive-fill)}._949e0f54{--reactist-badge-tint:var(--reactist-badge-promote-tint);--reactist-badge-fill:var(--reactist-badge-promote-fill)}._36115518{--reactist-badge-tint:var(--reactist-badge-attention-tint);--reactist-badge-fill:var(--reactist-badge-attention-fill)}