@algolia/satellite 2.3.0-rc.8 → 2.3.0

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 (54) hide show
  1. package/dist/cjs/Actions/Button/PolymorphicButton.js +5 -5
  2. package/dist/cjs/Actions/Button/PolymorphicIconButton.js +2 -2
  3. package/dist/cjs/Actions/Button/styles.d.ts +1 -0
  4. package/dist/cjs/Actions/Button/styles.js +15 -10
  5. package/dist/cjs/Actions/SegmentedControl/SegmentedControl.js +3 -2
  6. package/dist/cjs/Actions/SegmentedControl/SegmentedControlOption.js +6 -3
  7. package/dist/cjs/Actions/ToggleButton/ToggleButtonBase.js +3 -3
  8. package/dist/cjs/Chat/ChatMessages/ChatMessages.js +2 -0
  9. package/dist/cjs/Fields/Field/Field.js +3 -3
  10. package/dist/cjs/Fields/Input/Input.js +10 -13
  11. package/dist/cjs/Fields/RadioGroup/RadioGroupContext.d.ts +2 -0
  12. package/dist/cjs/Fields/Switch/Switch.tailwind.js +9 -9
  13. package/dist/cjs/Helpers/MarkdownContent/MarkdownContent.d.ts +15 -0
  14. package/dist/cjs/Helpers/MarkdownContent/MarkdownContent.js +29 -0
  15. package/dist/cjs/Helpers/MarkdownContent/MarkdownContent.tailwind.d.ts +5 -0
  16. package/dist/cjs/Helpers/MarkdownContent/MarkdownContent.tailwind.js +138 -0
  17. package/dist/cjs/Helpers/MarkdownContent/index.d.ts +1 -0
  18. package/dist/cjs/Helpers/MarkdownContent/index.js +16 -0
  19. package/dist/cjs/Helpers/index.d.ts +1 -0
  20. package/dist/cjs/Helpers/index.js +11 -0
  21. package/dist/cjs/Icons/index.d.ts +1 -1
  22. package/dist/cjs/Icons/index.js +6 -0
  23. package/dist/cjs/Overlay/MenuButton/MenuButton.d.ts +23 -7
  24. package/dist/cjs/Overlay/Modal/Modal.js +8 -8
  25. package/dist/cjs/styles/helpers/prefixTailwindClassName.js +7 -1
  26. package/dist/cjs/styles/tailwind.config.js +1 -1
  27. package/dist/esm/Actions/Button/PolymorphicButton.js +6 -6
  28. package/dist/esm/Actions/Button/PolymorphicIconButton.js +2 -2
  29. package/dist/esm/Actions/Button/styles.d.ts +1 -0
  30. package/dist/esm/Actions/Button/styles.js +14 -9
  31. package/dist/esm/Actions/SegmentedControl/SegmentedControl.js +3 -2
  32. package/dist/esm/Actions/SegmentedControl/SegmentedControlOption.js +6 -3
  33. package/dist/esm/Actions/ToggleButton/ToggleButtonBase.js +4 -4
  34. package/dist/esm/Chat/ChatMessages/ChatMessages.js +2 -0
  35. package/dist/esm/Fields/Field/Field.js +3 -3
  36. package/dist/esm/Fields/Input/Input.js +10 -13
  37. package/dist/esm/Fields/RadioGroup/RadioGroupContext.d.ts +2 -0
  38. package/dist/esm/Fields/Switch/Switch.tailwind.js +9 -9
  39. package/dist/esm/Helpers/MarkdownContent/MarkdownContent.d.ts +15 -0
  40. package/dist/esm/Helpers/MarkdownContent/MarkdownContent.js +22 -0
  41. package/dist/esm/Helpers/MarkdownContent/MarkdownContent.tailwind.d.ts +5 -0
  42. package/dist/esm/Helpers/MarkdownContent/MarkdownContent.tailwind.js +138 -0
  43. package/dist/esm/Helpers/MarkdownContent/index.d.ts +1 -0
  44. package/dist/esm/Helpers/MarkdownContent/index.js +1 -0
  45. package/dist/esm/Helpers/index.d.ts +1 -0
  46. package/dist/esm/Helpers/index.js +2 -1
  47. package/dist/esm/Icons/index.d.ts +1 -1
  48. package/dist/esm/Icons/index.js +1 -1
  49. package/dist/esm/Overlay/MenuButton/MenuButton.d.ts +23 -7
  50. package/dist/esm/Overlay/Modal/Modal.js +8 -8
  51. package/dist/esm/styles/helpers/prefixTailwindClassName.js +7 -1
  52. package/dist/esm/styles/tailwind.config.js +1 -1
  53. package/dist/satellite.min.css +1 -1
  54. package/package.json +2 -1
@@ -22,7 +22,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
22
22
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
23
23
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
24
24
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
25
- var BASE_CLASSNAMES = (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["btn inline-flex justify-center items-center px-3 typo-display-body focusable-visible"])));
25
+ var BASE_CLASSNAMES = (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["btn inline-flex justify-center items-center typo-display-body focusable-visible"])));
26
26
  var ICON_SIZE = 16;
27
27
  /**
28
28
  * `PolymorphicButton` is intended for internal use.
@@ -46,7 +46,7 @@ var PolymorphicButton = exports.PolymorphicButton = /*#__PURE__*/(0, _react.forw
46
46
  // @ts-expect-error disabled is not present in PolymorphicButtonProps
47
47
  cleanedProps.disabled = true;
48
48
  }
49
- var buttonClassName = (0, _clsx["default"])(BASE_CLASSNAMES, _styles.BUTTON_SIZE_CLASSNAMES[size], _styles.BUTTON_VARIANT_CLASSNAMES[variant], cleanedProps.disabled && (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["btn-disabled"]))), className);
49
+ var buttonClassName = (0, _clsx["default"])(BASE_CLASSNAMES, _styles.BUTTON_SIZE_CLASSNAMES[size], _styles.BUTTON_PADDING_CLASSNAMES[size], _styles.BUTTON_VARIANT_CLASSNAMES[variant], cleanedProps.disabled && (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["btn-disabled"]))), className);
50
50
  var loaderClassNames = (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["absolute ", ""])), (variant === "destructive" || variant === "primary") && "text-white");
51
51
  var iconClassNames = (0, _clsx["default"])((0, _styles.getIconColorClassName)(props), loading && (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["invisible"]))));
52
52
  var textClassNames = (0, _clsx["default"])(loading && (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["invisible"]))));
@@ -64,14 +64,14 @@ var PolymorphicButton = exports.PolymorphicButton = /*#__PURE__*/(0, _react.forw
64
64
  }), StartIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(StartIcon, {
65
65
  width: ICON_SIZE,
66
66
  height: ICON_SIZE,
67
- className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["shrink-0"]))), iconClassNames)
67
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 mr-1"]))), iconClassNames)
68
68
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
69
- className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["whitespace-nowrap px-1"]))), textClassNames),
69
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["whitespace-nowrap"]))), textClassNames),
70
70
  children: children
71
71
  }), EndIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(EndIcon, {
72
72
  width: ICON_SIZE,
73
73
  height: ICON_SIZE,
74
- className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["shrink-0"]))), iconClassNames)
74
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 ml-1"]))), iconClassNames)
75
75
  })]
76
76
  }));
77
77
  });
@@ -22,9 +22,9 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
22
22
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
23
23
  var BASE_CLASSNAMES = (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["btn inline-flex items-center justify-center focusable-visible"])));
24
24
  var SIZE_CLASSNAMES = {
25
- small: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["max-h-6 max-w-6 min-h-6 min-w-6 text-mobile md:text-sm"]))),
25
+ small: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["max-h-6 max-w-6 min-h-6 min-w-6 text-md"]))),
26
26
  medium: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["max-h-8 max-w-8 min-h-8 min-w-8 text-md"]))),
27
- large: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["max-h-10 max-w-10 min-h-10 min-w-10 text-lg"])))
27
+ large: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["max-h-10 max-w-10 min-h-10 min-w-10 text-md"])))
28
28
  };
29
29
  var VARIANT_CLASSNAMES = _objectSpread(_objectSpread({}, _styles.BUTTON_VARIANT_CLASSNAMES), {}, {
30
30
  neutral: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["btn-neutral text-grey-600"]))),
@@ -1,5 +1,6 @@
1
1
  import type { ButtonBaseProps, ButtonSize, ButtonVariant } from "./types";
2
2
  export declare const BUTTON_SIZE_CLASSNAMES: Record<ButtonSize, string>;
3
+ export declare const BUTTON_PADDING_CLASSNAMES: Record<ButtonSize, string>;
3
4
  export declare const BUTTON_LOADER_ICON_SIZES: Record<ButtonSize, number>;
4
5
  export declare const BUTTON_VARIANT_CLASSNAMES: Record<ButtonVariant, string>;
5
6
  export declare const getIconColorClassName: ({ disabled, variant }: Pick<ButtonBaseProps, "disabled" | "variant">) => string | null;
@@ -4,34 +4,39 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.getIconColorClassName = exports.BUTTON_VARIANT_CLASSNAMES = exports.BUTTON_SIZE_CLASSNAMES = exports.BUTTON_LOADER_ICON_SIZES = void 0;
7
+ exports.getIconColorClassName = exports.BUTTON_VARIANT_CLASSNAMES = exports.BUTTON_SIZE_CLASSNAMES = exports.BUTTON_PADDING_CLASSNAMES = exports.BUTTON_LOADER_ICON_SIZES = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
9
9
  var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
10
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
11
11
  var BUTTON_SIZE_CLASSNAMES = exports.BUTTON_SIZE_CLASSNAMES = {
12
12
  small: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["h-6"]))),
13
13
  medium: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["h-8"]))),
14
14
  large: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["h-10"])))
15
15
  };
16
+ var BUTTON_PADDING_CLASSNAMES = exports.BUTTON_PADDING_CLASSNAMES = {
17
+ small: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["px-2"]))),
18
+ medium: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["px-4"]))),
19
+ large: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["px-4"])))
20
+ };
16
21
  var BUTTON_LOADER_ICON_SIZES = exports.BUTTON_LOADER_ICON_SIZES = {
17
- small: 12,
22
+ small: 16,
18
23
  medium: 16,
19
- large: 20
24
+ large: 16
20
25
  };
21
26
  var BUTTON_VARIANT_CLASSNAMES = exports.BUTTON_VARIANT_CLASSNAMES = {
22
- subtle: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["btn-subtle"]))),
23
- neutral: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["btn-neutral"]))),
24
- primary: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["btn-primary"]))),
25
- destructive: (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["btn-destructive"])))
27
+ subtle: (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["btn-subtle"]))),
28
+ neutral: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["btn-neutral"]))),
29
+ primary: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["btn-primary"]))),
30
+ destructive: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["btn-destructive"])))
26
31
  };
27
32
  var getIconColorClassName = exports.getIconColorClassName = function getIconColorClassName(_ref) {
28
33
  var disabled = _ref.disabled,
29
34
  variant = _ref.variant;
30
35
  if (variant === "destructive" || variant === "primary") {
31
- return (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["text-white"])));
36
+ return (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["text-white"])));
32
37
  }
33
38
  if (variant === "subtle" && !disabled) {
34
39
  return null;
35
40
  }
36
- return disabled ? (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["text-grey-300"]))) : (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["text-grey-600"])));
41
+ return disabled ? (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["text-grey-300"]))) : (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["text-grey-600"])));
37
42
  };
@@ -76,11 +76,12 @@ var SegmentedControl = exports.SegmentedControl = /*#__PURE__*/(0, _react.forwar
76
76
  value: value,
77
77
  name: radioName,
78
78
  onChange: onChange,
79
- disabled: disabled
79
+ disabled: disabled,
80
+ size: size
80
81
  },
81
82
  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
82
83
  ref: (0, _mergeRefs.mergeRefs)([ref, containerRef]),
83
- className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["segmented-control focusable-visible-within\n relative inline-flex typo-display-body rounded bg-grey-100\n ", "\n "])), size === "large" ? "segmented-control-large space-x-1" : "space-x-2px"), _styles.BUTTON_SIZE_CLASSNAMES[size], className),
84
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["segmented-control focusable-visible-within\n relative inline-flex typo-display-body rounded bg-grey-100\n ", "\n "])), size === "large" ? "segmented-control-large space-x-1" : "space-x-0.5"), _styles.BUTTON_SIZE_CLASSNAMES[size], className),
84
85
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
85
86
  ref: valueIndicatorRef,
86
87
  style: valueIndicatorStyle,
@@ -7,12 +7,14 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.SegmentedControlOption = void 0;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
10
+ var _clsx = _interopRequireDefault(require("clsx"));
10
11
  var _utils = require("./utils");
12
+ var _styles = require("./../Button/styles");
11
13
  var _RadioGroupContext = require("./../../Fields/RadioGroup/RadioGroupContext");
12
14
  var _Overlay = require("./../../Overlay");
13
15
  var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
14
16
  var _jsxRuntime = require("react/jsx-runtime");
15
- var _templateObject, _templateObject2;
17
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
16
18
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
17
19
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
18
20
  var SegmentedControlOption = exports.SegmentedControlOption = function SegmentedControlOption(_ref) {
@@ -22,11 +24,12 @@ var SegmentedControlOption = exports.SegmentedControlOption = function Segmented
22
24
  var context = (0, _RadioGroupContext.useRadioGroupContext)();
23
25
  var checked = context.value === value;
24
26
  var inputDisabled = context.disabled || disabled;
27
+ var size = context.size || "medium";
25
28
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", _objectSpread(_objectSpread({
26
- className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n inline-flex grow shrink justify-center items-center min-w-16 max-w-48 px-4 z-10 text-grey-600\n ", "\n ", "\n "])), inputDisabled ? "cursor-not-allowed opacity-60 rounded bg-grey-100" : "cursor-pointer hover:text-grey-900", !checked && !inputDisabled && "rounded active:bg-accent-200/20")
29
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["inline-flex grow shrink justify-center items-center min-w-16 max-w-48 z-10 text-grey-600"]))), _styles.BUTTON_PADDING_CLASSNAMES[size], inputDisabled ? (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["cursor-not-allowed opacity-60 rounded bg-grey-100"]))) : (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["cursor-pointer hover:text-grey-900"]))), !checked && !inputDisabled && (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["rounded active:bg-accent-200/20"]))))
27
30
  }, (0, _utils.buildAnimationProps)(context.name, value)), {}, {
28
31
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
29
- className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["w-0 h-0 opacity-0"]))),
32
+ className: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["w-0 h-0 opacity-0"]))),
30
33
  type: "radio",
31
34
  value: value,
32
35
  name: context.name,
@@ -15,7 +15,7 @@ var _Overlay = require("./../../Overlay");
15
15
  var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
16
16
  var _jsxRuntime = require("react/jsx-runtime");
17
17
  var _excluded = ["className", "size", "icon", "children", "label"];
18
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
18
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
19
19
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
20
20
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
21
21
  var ICON_ONLY_CLASSNAMES = {
@@ -44,11 +44,11 @@ var ToggleButtonBase = exports.ToggleButtonBase = /*#__PURE__*/(0, _react.forwar
44
44
  ref: ref,
45
45
  type: "button",
46
46
  "aria-label": label,
47
- className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["inline-flex items-center justify-center gap-1 min-w-min whitespace-nowrap typo-display-body"]))), (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["group/toggle-button rounded focusable-visible focus-visible:border-transparent disabled:cursor-not-allowed"]))), (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["data-[state=on]:text-accent-600 disabled:!text-grey-300"]))), (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["bg-white data-[state=off]:hover:bg-grey-100 data-[state=on]:bg-accent-100 disabled:!bg-grey-50"]))), (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["border border-grey-200 data-[state=on]:border-accent-600 disabled:!border-grey-200"]))), !isIconOnly && (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["px-3"]))), isIconOnly ? ICON_ONLY_CLASSNAMES[size] : _styles.BUTTON_SIZE_CLASSNAMES[size], className)
47
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["inline-flex items-center justify-center gap-1 min-w-min whitespace-nowrap typo-display-body"]))), (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["group/toggle-button rounded focusable-visible focus-visible:border-transparent disabled:cursor-not-allowed"]))), (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["data-[state=on]:text-accent-600 disabled:!text-grey-300"]))), (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["bg-white data-[state=off]:hover:bg-grey-100 data-[state=on]:bg-accent-100 disabled:!bg-grey-50"]))), (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["border border-grey-200 data-[state=on]:border-accent-600 disabled:!border-grey-200"]))), !isIconOnly && _styles.BUTTON_PADDING_CLASSNAMES[size], isIconOnly ? ICON_ONLY_CLASSNAMES[size] : _styles.BUTTON_SIZE_CLASSNAMES[size], className)
48
48
  }, rest), {}, {
49
49
  children: [!!Icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
50
50
  "aria-hidden": "true",
51
- className: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 h-4 w-4 text-grey-600 group-data-[state=on]/toggle-button:text-inherit group-disabled/toggle-button:text-inherit"])))
51
+ className: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 h-4 w-4 text-grey-600 group-data-[state=on]/toggle-button:text-inherit group-disabled/toggle-button:text-inherit"])))
52
52
  }), !!children && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
53
53
  children: children
54
54
  })]
@@ -98,7 +98,9 @@ var ChatMessagesBase = function ChatMessagesBase(_ref, forwardedRef) {
98
98
  (0, _react.useEffect)(function () {
99
99
  if (status === "submitted" && lastUserMessage) {
100
100
  setLastMessageSubmitted(true);
101
+ void scrollToBottom();
101
102
  }
103
+ // eslint-disable-next-line react-hooks/exhaustive-deps
102
104
  }, [status, lastUserMessage]);
103
105
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, props), {}, {
104
106
  ref: forwardedRef,
@@ -16,7 +16,7 @@ var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/
16
16
  var _utils = require("./../../utils");
17
17
  var _getTextFromReactNode = require("./../../utils/getTextFromReactNode");
18
18
  var _jsxRuntime = require("react/jsx-runtime");
19
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
19
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
20
20
  /**
21
21
  * The `Field` component is a helper that wraps inputs to streamline labeling, validation, integration into a form.
22
22
  *
@@ -111,7 +111,7 @@ var Field = exports.Field = function Field(_ref) {
111
111
  children: "*"
112
112
  })]
113
113
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
114
- className: (0, _clsx["default"])(inline && (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["ml-auto mt-1"])))),
114
+ className: (0, _clsx["default"])(inline && (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["ml-auto flex items-center"])))),
115
115
  children: children
116
116
  })]
117
117
  }), state.status === "invalid" && state.errors.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
@@ -130,7 +130,7 @@ var Field = exports.Field = function Field(_ref) {
130
130
  })
131
131
  }) : description ? /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
132
132
  id: descriptionId,
133
- className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["display-caption text-grey-600"]))), inline ? (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["mt-1"]))) : (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["mt-2"])))),
133
+ className: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["display-caption text-grey-600 mt-1"]))),
134
134
  children: description
135
135
  }) : null]
136
136
  })
@@ -21,7 +21,7 @@ var _useForwardedRef3 = require("./../../utils/useForwardedRef");
21
21
  var _useTriggerInputChange = require("./../../utils/useTriggerInputChange");
22
22
  var _jsxRuntime = require("react/jsx-runtime");
23
23
  var _excluded = ["className", "style", "startIcon", "endItem", "disabled", "readOnly", "clearable", "type", "variant", "locale", "required"];
24
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
24
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
25
25
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
26
26
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
27
27
  var DEFAULT_INPUT_LOCALE = {
@@ -109,7 +109,6 @@ var Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
109
109
  }
110
110
  }, [inputProps.value, isControlled]);
111
111
  var Icon = startIcon ? startIcon : type === "search" ? SearchIcon : undefined;
112
- var iconSize = variant === "small" ? "1rem" : "1.5rem";
113
112
  var isInvalid = status === "invalid";
114
113
  var StatusIcon = isInvalid ? InvalidIcon : status === "validated" ? ValidatedIcon : _react.Fragment;
115
114
  var clearable = typeof clearableProp === "boolean" ? clearableProp : type === "search";
@@ -123,11 +122,9 @@ var Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
123
122
  }
124
123
  },
125
124
  children: [Icon && /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
126
- className: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["ml-4 shrink-0 ", ""])), disabled ? "text-grey-300" : focused ? "text-accent-600" : "text-grey-500"),
127
- width: iconSize,
128
- height: iconSize
125
+ className: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["ml-4 shrink-0 size-4 ", ""])), disabled ? "text-grey-300" : focused ? "text-accent-600" : "text-grey-500")
129
126
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", _objectSpread(_objectSpread({
130
- className: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["mx-4 no-search-input-decoration"]))),
127
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["no-search-input-decoration"]))), Icon ? (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["mx-2"]))) : (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["mx-4"])))),
131
128
  ref: inputRefCallback,
132
129
  type: type,
133
130
  "aria-labelledby": labelId,
@@ -156,7 +153,7 @@ var Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
156
153
  (_inputProps$onBlur = inputProps.onBlur) === null || _inputProps$onBlur === void 0 || _inputProps$onBlur.call(inputProps, evt);
157
154
  }
158
155
  })), clearable && !disabled && !readOnly && !isValueEmpty ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Actions.IconButton, {
159
- className: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["mr-2 ", ""])), focused ? "visible" : "invisible group-hover:visible"),
156
+ className: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["mr-2 ", ""])), focused ? "visible" : "invisible group-hover:visible"),
160
157
  title: locale.clearInput,
161
158
  icon: _Icons.XIcon,
162
159
  variant: "subtle",
@@ -168,15 +165,15 @@ var Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
168
165
  triggerInputChange("");
169
166
  }
170
167
  }) : null, !!endItem && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
171
- className: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["mr-4"]))),
168
+ className: (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["mr-4"]))),
172
169
  children: endItem
173
170
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(StatusIcon, {}), type === "number" && !disabled && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
174
- className: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["input-spinner"]))),
171
+ className: (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["input-spinner"]))),
175
172
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
176
173
  tabIndex: -1,
177
174
  type: "button",
178
175
  disabled: readOnly,
179
- className: (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["input-spinner-button ", ""])), readOnly && "cursor-not-allowed"),
176
+ className: (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["input-spinner-button ", ""])), readOnly && "cursor-not-allowed"),
180
177
  "aria-label": locale.increment,
181
178
  onClick: function onClick() {
182
179
  var _inputRef$current$val, _inputRef$current2;
@@ -194,13 +191,13 @@ var Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
194
191
  },
195
192
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.ChevronUpIcon, {
196
193
  size: 12,
197
- className: (0, _clsx["default"])(isInvalid && (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["text-red-700"]))))
194
+ className: (0, _clsx["default"])(isInvalid && (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["text-red-700"]))))
198
195
  })
199
196
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
200
197
  tabIndex: -1,
201
198
  type: "button",
202
199
  disabled: readOnly,
203
- className: (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["input-spinner-button ", ""])), readOnly && "cursor-not-allowed"),
200
+ className: (0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["input-spinner-button ", ""])), readOnly && "cursor-not-allowed"),
204
201
  "aria-label": locale.decrement,
205
202
  onClick: function onClick() {
206
203
  var _inputRef$current$val2, _inputRef$current3;
@@ -218,7 +215,7 @@ var Input = exports.Input = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
218
215
  },
219
216
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.ChevronDownIcon, {
220
217
  size: 12,
221
- className: (0, _clsx["default"])(isInvalid && (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["text-red-700"]))))
218
+ className: (0, _clsx["default"])(isInvalid && (0, _satellitePrefixer["default"])(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["text-red-700"]))))
222
219
  })
223
220
  })]
224
221
  })]
@@ -1,4 +1,5 @@
1
1
  import type { ForwardedRef } from "react";
2
+ import type { ButtonSize } from "../../Actions/Button/types";
2
3
  import type { FieldState } from "../../Fields/Field";
3
4
  export interface RadioGroupContextType {
4
5
  id?: string;
@@ -13,6 +14,7 @@ export interface RadioGroupContextType {
13
14
  descriptionId?: string;
14
15
  state?: FieldState;
15
16
  ref?: ForwardedRef<HTMLInputElement>;
17
+ size?: ButtonSize;
16
18
  }
17
19
  export declare const RadioGroupContext: import("react").Context<RadioGroupContextType | null>;
18
20
  export declare const useRadioGroupContext: () => RadioGroupContextType;
@@ -11,8 +11,8 @@ var switchPlugin = plugin(function (_ref) {
11
11
  ".switch-container": {
12
12
  position: "relative",
13
13
  display: "block",
14
- height: "18px",
15
- width: "32px",
14
+ height: "24px",
15
+ width: "43px",
16
16
  ".switch-handle": {
17
17
  position: "absolute",
18
18
  top: "0px",
@@ -29,13 +29,13 @@ var switchPlugin = plugin(function (_ref) {
29
29
  transform: "translateX(2px)"
30
30
  },
31
31
  "&:hover .switch-handle.switch-checked ~ .switch:after": {
32
- transform: "translateX(12px)"
32
+ transform: "translateX(17px)"
33
33
  },
34
34
  "&:hover .switch-handle.switch-disabled ~ .switch:after": {
35
35
  transform: "translateX(0px)"
36
36
  },
37
37
  "&:hover .switch-handle.switch-checked.switch-disabled ~ .switch:after": {
38
- transform: "translateX(14px)"
38
+ transform: "translateX(19px)"
39
39
  }
40
40
  },
41
41
  ".switch": {
@@ -51,10 +51,10 @@ var switchPlugin = plugin(function (_ref) {
51
51
  transition: transition,
52
52
  "&::after": {
53
53
  position: "absolute",
54
- top: "1px",
55
- left: "1px",
56
- width: "16px",
57
- height: "16px",
54
+ top: "2px",
55
+ left: "2px",
56
+ width: "20px",
57
+ height: "20px",
58
58
  content: '" "',
59
59
  borderRadius: "9999px",
60
60
  background: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.50"), " 100%)"),
@@ -65,7 +65,7 @@ var switchPlugin = plugin(function (_ref) {
65
65
  background: theme("colors.accent.600"),
66
66
  boxShadow: "inset 0px 1px 4px 0px ".concat(rgba(theme("colors.grey.900"), 0.1)),
67
67
  "&:after": {
68
- transform: "translateX(14px)"
68
+ transform: "translateX(19px)"
69
69
  }
70
70
  },
71
71
  ".switch-handle.switch-disabled ~ &": {
@@ -0,0 +1,15 @@
1
+ import type { FC } from "react";
2
+ export interface MarkdownContentProps {
3
+ /**
4
+ * Additional classes to apply to the `MarkdownContent`.
5
+ */
6
+ className?: string;
7
+ /**
8
+ * The content of the `MarkdownContent`.
9
+ */
10
+ content?: string;
11
+ }
12
+ /**
13
+ * The `MarkdownContent` component is used to style user generated content that comes as Markdown.
14
+ */
15
+ export declare const MarkdownContent: FC<MarkdownContentProps>;
@@ -0,0 +1,29 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.MarkdownContent = void 0;
8
+ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
9
+ var _clsx = _interopRequireDefault(require("clsx"));
10
+ var _marked = require("marked");
11
+ var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
12
+ var _jsxRuntime = require("react/jsx-runtime");
13
+ var _templateObject;
14
+ /**
15
+ * The `MarkdownContent` component is used to style user generated content that comes as Markdown.
16
+ */
17
+ var MarkdownContent = exports.MarkdownContent = function MarkdownContent(_ref) {
18
+ var className = _ref.className,
19
+ content = _ref.content;
20
+ if (!content) {
21
+ return null;
22
+ }
23
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
24
+ className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["markdown-content"]))), className),
25
+ dangerouslySetInnerHTML: {
26
+ __html: _marked.marked.parse(content)
27
+ }
28
+ });
29
+ };
@@ -0,0 +1,5 @@
1
+ declare const _exports: {
2
+ handler: import("tailwindcss/types/config").PluginCreator;
3
+ config?: Partial<import("tailwindcss/types/config").Config> | undefined;
4
+ };
5
+ export = _exports;
@@ -0,0 +1,138 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
5
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
6
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
7
+ // @ts-check
8
+ var plugin = require("tailwindcss/plugin");
9
+ var _require = require("../../styles/helpers/icons"),
10
+ toBG = _require.toBG;
11
+ var rgba = require("../../styles/rgba");
12
+ module.exports = plugin(function (_ref) {
13
+ var addComponents = _ref.addComponents,
14
+ theme = _ref.theme;
15
+ /** @type {any} */
16
+ var desktop = theme("stlTypography.desktop", {});
17
+ /** @type {any} */
18
+ var mobile = theme("stlTypography.mobile", {});
19
+ addComponents({
20
+ ".markdown-content": {
21
+ "h1, h2, h3, h4, h5, h6, p, ul, ol, blockquote, table": {
22
+ "&:not(:first-child)": {
23
+ marginTop: theme("spacing.3")
24
+ },
25
+ "&:not(:last-child)": {
26
+ marginBottom: theme("spacing.2")
27
+ }
28
+ },
29
+ h1: desktop["display-medium"],
30
+ h2: desktop["display-small"],
31
+ h3: _objectSpread(_objectSpread({}, desktop["display-body"]), {}, {
32
+ fontWeight: theme("fontWeight.semibold")
33
+ }),
34
+ "h4, h5, h6": _objectSpread(_objectSpread({}, desktop["display-body"]), {}, {
35
+ fontWeight: theme("fontWeight.medium")
36
+ }),
37
+ "p, ul, ol, blockquote, table": _objectSpread(_objectSpread({}, mobile["display-body"]), {}, {
38
+ fontSize: theme("fontSize.base")
39
+ }),
40
+ code: {
41
+ display: "inline-block",
42
+ padding: "0 ".concat(theme("spacing.1")),
43
+ backgroundColor: theme("colors.grey.100"),
44
+ color: theme("colors.grey.700"),
45
+ fontFamily: theme("fontFamily.mono"),
46
+ fontSize: theme("fontSize.base")
47
+ },
48
+ ul: {
49
+ paddingLeft: theme("spacing.5"),
50
+ listStyleType: "disc"
51
+ },
52
+ ol: {
53
+ paddingLeft: theme("spacing.5"),
54
+ listStyleType: "decimal"
55
+ },
56
+ a: {
57
+ color: theme("colors.accent.600"),
58
+ "&:hover": {
59
+ textDecoration: "underline"
60
+ },
61
+ '&[target="_blank"], &[href^="http"]': {
62
+ position: "relative",
63
+ display: "inline-flex",
64
+ alignItems: "center",
65
+ whiteSpace: "nowrap",
66
+ "&:after": {
67
+ content: "''",
68
+ background: toBG("ExternalLink", {
69
+ stroke: theme("colors.accent.600"),
70
+ viewBox: "0 0 24 24",
71
+ width: "100%",
72
+ height: "100%"
73
+ }),
74
+ backgroundRepeat: "no-repeat",
75
+ width: "1em",
76
+ height: "1em",
77
+ marginLeft: theme("spacing.1")
78
+ }
79
+ }
80
+ },
81
+ blockquote: {
82
+ paddingLeft: theme("spacing.4"),
83
+ borderLeft: "2px solid ".concat(theme("colors.grey.200")),
84
+ color: theme("colors.grey.600")
85
+ },
86
+ pre: _objectSpread(_objectSpread({}, mobile["display-code"]), {}, {
87
+ overflow: "auto",
88
+ maxWidth: "100%",
89
+ maxHeight: theme("spacing.64"),
90
+ margin: "".concat(theme("spacing.2"), " 0"),
91
+ padding: "".concat(theme("spacing.2"), " ").concat(theme("spacing.4")),
92
+ borderRadius: theme("borderRadius.DEFAULT"),
93
+ backgroundColor: theme("colors.grey.100"),
94
+ color: theme("colors.grey.700"),
95
+ code: {
96
+ display: "inline",
97
+ backgroundColor: "transparent",
98
+ color: "inherit"
99
+ }
100
+ }),
101
+ img: {
102
+ display: "block",
103
+ maxWidth: "100%",
104
+ height: "auto",
105
+ margin: "auto"
106
+ },
107
+ hr: {
108
+ borderWidth: "0 0 1px 0",
109
+ borderStyle: "solid",
110
+ borderColor: theme("colors.grey.200"),
111
+ marginTop: theme("spacing.6"),
112
+ marginBottom: theme("spacing.6")
113
+ },
114
+ "b, strong, th": {
115
+ fontWeight: "600"
116
+ },
117
+ table: {
118
+ width: "100%",
119
+ borderCollapse: "collapse",
120
+ textAlign: "left",
121
+ "th, td": {
122
+ padding: "8px 12px",
123
+ fontSize: theme("fontSize.base")
124
+ },
125
+ th: {
126
+ borderBottom: "1px solid ".concat(theme("colors.grey.200")),
127
+ fontWeight: "normal"
128
+ },
129
+ "tr:not(:last-child) td": {
130
+ borderBottom: "1px solid ".concat(theme("colors.grey.100"))
131
+ },
132
+ "tr:hover td": {
133
+ backgroundColor: rgba(theme("colors.grey.100"), 0.6)
134
+ }
135
+ }
136
+ }
137
+ });
138
+ });
@@ -0,0 +1 @@
1
+ export * from "./MarkdownContent";
@@ -0,0 +1,16 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ var _MarkdownContent = require("./MarkdownContent");
7
+ Object.keys(_MarkdownContent).forEach(function (key) {
8
+ if (key === "default" || key === "__esModule") return;
9
+ if (key in exports && exports[key] === _MarkdownContent[key]) return;
10
+ Object.defineProperty(exports, key, {
11
+ enumerable: true,
12
+ get: function get() {
13
+ return _MarkdownContent[key];
14
+ }
15
+ });
16
+ });
@@ -4,3 +4,4 @@ export * from "./HelpUnderline";
4
4
  export * from "./TextWrap";
5
5
  export * from "./UserContent";
6
6
  export * from "./ShimmerText";
7
+ export * from "./MarkdownContent";