@kaizen/components 0.0.0-canary-bundler--fix-style-inject-20240522033251 → 0.0.0-canary-bundler--local-style-inject-20240522043016

package/dist/cjs/ProgressBar/ProgressBar.cjs

@@ -0,0 +1,62 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var Heading = require('../Heading/Heading.cjs');
+var Label = require('./subcomponents/Label/Label.cjs');
+var calculatePercentage = require('./utils/calculatePercentage.cjs');
+var ProgressBar_module = require('./ProgressBar.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896891/Progress+Bar Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-progress-bar--docs Storybook}
+ */
+var ProgressBar = function (_a) {
+  var value = _a.value,
+    max = _a.max,
+    isAnimating = _a.isAnimating,
+    mood = _a.mood,
+    subtext = _a.subtext,
+    label = _a.label,
+    classNameOverride = _a.classNameOverride,
+    _b = _a.isReversed,
+    isReversed = _b === void 0 ? false : _b,
+    restProps = tslib.__rest(_a, ["value", "max", "isAnimating", "mood", "subtext", "label", "classNameOverride", "isReversed"]);
+  var percentage = calculatePercentage.calculatePercentage({
+    value: value,
+    max: max
+  });
+  return React__default.default.createElement("div", tslib.__assign({
+    role: "progressbar",
+    "aria-valuenow": percentage,
+    "aria-valuemin": 0,
+    "aria-valuemax": 100,
+    className: classNameOverride
+  }, restProps), label && React__default.default.createElement(Label.Label, {
+    content: label,
+    isReversed: isReversed
+  }), React__default.default.createElement("div", {
+    className: ProgressBar_module.default.progressBackground
+  }, React__default.default.createElement("div", {
+    className: classnames__default.default(ProgressBar_module.default[mood], isAnimating && ProgressBar_module.default.isAnimating),
+    style: {
+      transform: "translateX(-".concat(100 - percentage, "%")
+    }
+  })), subtext && React__default.default.createElement("div", {
+    className: ProgressBar_module.default.subtext
+  }, React__default.default.createElement(Heading.Heading, {
+    variant: "heading-6",
+    tag: "p",
+    color: isReversed ? "white" : "dark"
+  }, subtext)));
+};
+ProgressBar.displayName = "ProgressBar";
+exports.ProgressBar = ProgressBar;

package/dist/cjs/ProgressBar/ProgressBar.module.scss.cjs

@@ -0,0 +1,43 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".ProgressBar-module_subtext__eizyu{color:var(--color-purple-800,#2f2438);opacity:80%;padding-top:var(--spacing-6,.375rem);text-align:center}.ProgressBar-module_progressBackground__5qzp5{background:var(--color-gray-300,#eaeaec);border-radius:10px;height:10px;overflow:hidden;position:relative;width:100%}@keyframes ProgressBar-module_pulse__RGaQm{0%{transform:translateX(-100%)}to{transform:translateX(200%)}}.ProgressBar-module_progress__X1IHw{border-radius:10px;inset:0;overflow:hidden;position:absolute;transition:transform .2s ease}.ProgressBar-module_positive__12oA1{background:var(--color-green-400,#5dcaad)}.ProgressBar-module_positive__12oA1:after{background:linear-gradient(90deg,transparent,var(--color-green-300,#8fdbc7) 75%,transparent)}.ProgressBar-module_informative__lrVDM{background:var(--color-blue-400,#008bd6)}.ProgressBar-module_informative__lrVDM:after{background:linear-gradient(90deg,transparent,var(--color-blue-300,#73c0e8) 75%,transparent)}.ProgressBar-module_cautionary__f56gH{background:var(--color-yellow-400,#ffca4d)}.ProgressBar-module_cautionary__f56gH:after{background:linear-gradient(90deg,transparent,var(--color-yellow-300,#ffe36e) 75%,transparent)}.ProgressBar-module_negative__EVWBt{background:var(--color-red-400,#e0707d)}.ProgressBar-module_isAnimating__F6AxQ:after{animation:ProgressBar-module_pulse__RGaQm 2s infinite;bottom:0;content:\"\";left:0;opacity:100%;position:absolute;top:0;transition:opacity .2s;width:50%}";
+var styles = {
+  "subtext": "ProgressBar-module_subtext__eizyu",
+  "progressBackground": "ProgressBar-module_progressBackground__5qzp5",
+  "progress": "ProgressBar-module_progress__X1IHw",
+  "positive": "ProgressBar-module_positive__12oA1 ProgressBar-module_progress__X1IHw",
+  "informative": "ProgressBar-module_informative__lrVDM ProgressBar-module_progress__X1IHw",
+  "cautionary": "ProgressBar-module_cautionary__f56gH ProgressBar-module_progress__X1IHw",
+  "negative": "ProgressBar-module_negative__EVWBt ProgressBar-module_progress__X1IHw",
+  "isAnimating": "ProgressBar-module_isAnimating__F6AxQ",
+  "pulse": "ProgressBar-module_pulse__RGaQm"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;

package/dist/cjs/ProgressBar/subcomponents/Label/Label.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+var React = require('react');
+var Heading = require('../../../Heading/Heading.cjs');
+var Label_module = require('./Label.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var Label = function (_a) {
+  var content = _a.content,
+    _b = _a.isReversed,
+    isReversed = _b === void 0 ? false : _b;
+  return React__default.default.createElement("div", {
+    className: Label_module.default.label
+  }, React__default.default.createElement(Heading.Heading, {
+    variant: "heading-4",
+    tag: "p",
+    color: isReversed ? "white" : "dark"
+  }, content));
+};
+Label.displayName = "Label";
+exports.Label = Label;

package/dist/cjs/ProgressBar/subcomponents/Label/Label.module.scss.cjs

@@ -0,0 +1,35 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".Label-module_label__zqjpR{color:var(--color-purple-800,#2f2438);padding-bottom:var(--spacing-6,.375rem);text-align:center}";
+var styles = {
+  "label": "Label-module_label__zqjpR"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;

package/dist/cjs/ProgressBar/utils/calculatePercentage.cjs

@@ -0,0 +1,8 @@
+'use strict';
+
+var calculatePercentage = function (_a) {
+  var value = _a.value,
+    max = _a.max;
+  return value / max * 100.0;
+};
+exports.calculatePercentage = calculatePercentage;

package/dist/cjs/Radio/Radio/Radio.cjs

@@ -0,0 +1,48 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var Radio_module = require('./Radio.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var renderSelected = function (selectedStatus, reversed) {
+  if (selectedStatus) {
+    return React__default.default.createElement("div", {
+      className: classnames__default.default(Radio_module.default.icon, reversed && Radio_module.default.reversed)
+    });
+  }
+  return;
+};
+var Radio = function (_a) {
+  var name = _a.name,
+    value = _a.value,
+    _b = _a.selectedStatus,
+    selectedStatus = _b === void 0 ? false : _b,
+    _c = _a.reversed,
+    reversed = _c === void 0 ? false : _c,
+    onChange = _a.onChange,
+    classNameOverride = _a.classNameOverride,
+    restProps = tslib.__rest(_a, ["name", "value", "selectedStatus", "reversed", "onChange", "classNameOverride"]);
+  return (
+    // @todo: Move classNameOverride to span
+    React__default.default.createElement("span", null, React__default.default.createElement("input", tslib.__assign({
+      type: "radio",
+      name: name,
+      value: value,
+      checked: selectedStatus,
+      className: classnames__default.default(Radio_module.default.radioInput, classNameOverride, reversed && Radio_module.default.reversed),
+      onChange: onChange,
+      readOnly: onChange === undefined
+    }, restProps)), React__default.default.createElement("span", {
+      className: classnames__default.default(Radio_module.default.box, reversed && Radio_module.default.reversed)
+    }, renderSelected(selectedStatus, reversed)))
+  );
+};
+Radio.displayName = "Radio";
+exports.Radio = Radio;

package/dist/cjs/Radio/Radio/Radio.module.scss.cjs

@@ -0,0 +1,38 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".Radio-module_radioInput__-zPUZ{opacity:0;position:absolute}.ideal-sans .Radio-module_radioInput__-zPUZ{position:absolute}.Radio-module_icon__ihSP3{background:var(--color-gray-600,#524e56);border-radius:50%;height:10px;left:5px;position:absolute;top:5px;width:10px}.Radio-module_icon__ihSP3.Radio-module_reversed__pfCrF{background:var(--color-white,#fff)}@media (forced-colors:active){.Radio-module_icon__ihSP3{border:5px solid transparent;height:0;width:0}}.Radio-module_box__nEGD7{background:var(--color-white,#fff);border:var(--border-solid-border-width,2px) var(--border-solid-border-style,solid) var(--color-gray-500,#878792);border-radius:50%;box-sizing:border-box;display:block;height:24px;position:relative;top:0;width:24px}.Radio-module_radioInput__-zPUZ:focus:not([disabled])+.Radio-module_box__nEGD7{border-color:var(--color-gray-600,#524e56)}.Radio-module_radioInput__-zPUZ:focus:not([disabled])+.Radio-module_box__nEGD7:after{background:transparent;border-color:var(--color-blue-500,#0168b3);border-radius:26px;border-style:var(--border-focus-ring-border-style,solid);border-width:var(--border-focus-ring-border-width,2px);box-sizing:border-box;content:\"\";height:calc(26px + var(--border-solid-border-width, 2px)*2);left:-5px;pointer-events:none;position:absolute;top:-5px;width:calc(26px + var(--border-solid-border-width, 2px)*2)}.Radio-module_radioInput__-zPUZ:not([disabled])+.Radio-module_box__nEGD7:hover{background-color:var(--color-gray-200,#f4f4f5);border-color:var(--color-gray-600,#524e56)}.Radio-module_box__nEGD7.Radio-module_reversed__pfCrF{background:transparent;border:var(--border-solid-border-width,2px) var(--border-solid-border-style,solid) rgba(var(--color-white-rgb,255,255,255),.65)}.Radio-module_radioInput__-zPUZ:focus:not([disabled])+.Radio-module_box__nEGD7.Radio-module_reversed__pfCrF{border-color:var(--color-white,#fff)}.Radio-module_radioInput__-zPUZ:focus:not([disabled])+.Radio-module_box__nEGD7.Radio-module_reversed__pfCrF:after{border-color:var(--color-blue-300,#73c0e8)}.Radio-module_radioInput__-zPUZ:not([disabled])+.Radio-module_box__nEGD7.Radio-module_reversed__pfCrF:hover{background-color:transparent;border-color:var(--color-white,#fff)}";
+var styles = {
+  "radioInput": "Radio-module_radioInput__-zPUZ",
+  "icon": "Radio-module_icon__ihSP3",
+  "reversed": "Radio-module_reversed__pfCrF",
+  "box": "Radio-module_box__nEGD7"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;

package/dist/cjs/Radio/RadioField/RadioField.cjs

@@ -0,0 +1,55 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var Label = require('../../Label/Label.cjs');
+var Radio = require('../Radio/Radio.cjs');
+var RadioField_module = require('./RadioField.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092822/Radio+Field Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-radio-controls-radio-field--docs Storybook}
+ */
+var RadioField = function (_a) {
+  var propsId = _a.id,
+    labelText = _a.labelText,
+    _b = _a.selectedStatus,
+    selectedStatus = _b === void 0 ? false : _b,
+    _c = _a.disabled,
+    disabled = _c === void 0 ? false : _c,
+    _d = _a.reversed,
+    reversed = _d === void 0 ? false : _d,
+    classNameOverride = _a.classNameOverride,
+    dataTestId = _a["data-testid"],
+    restProps = tslib.__rest(_a, ["id", "labelText", "selectedStatus", "disabled", "reversed", "classNameOverride", "data-testid"]);
+  var id = propsId !== null && propsId !== void 0 ? propsId : React.useId();
+  // @todo: Move restProps to the wrapping div?
+  return React__default.default.createElement("div", {
+    "data-testid": dataTestId,
+    className: classnames__default.default(RadioField_module.default.container, classNameOverride, selectedStatus && RadioField_module.default.selected, reversed && RadioField_module.default.reversed)
+  }, React__default.default.createElement(Label.Label, {
+    "data-testid": "".concat(id, "-field-label"),
+    id: "".concat(id, "-field-label"),
+    htmlFor: id,
+    labelText: labelText,
+    labelType: "radio",
+    disabled: disabled,
+    reversed: reversed
+  }, React__default.default.createElement(Radio.Radio, tslib.__assign({
+    "data-testid": "".concat(id, "-radio-input"),
+    id: id,
+    disabled: disabled,
+    reversed: reversed,
+    selectedStatus: selectedStatus
+  }, restProps))));
+};
+RadioField.displayName = "RadioField";
+exports.RadioField = RadioField;

package/dist/cjs/Radio/RadioField/RadioField.module.scss.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".RadioField-module_container__r6T25{word-wrap:break-word;margin-bottom:var(--spacing-sm,.75rem);overflow-wrap:break-word;position:relative;word-break:break-word}.RadioField-module_container__r6T25 label{-webkit-tap-highlight-color:transparent}.ideal-sans .RadioField-module_container__r6T25 label{font-size:var(--typography-paragraph-body-font-size,1rem);padding-top:0}.RadioField-module_container__r6T25.RadioField-module_selected__kdlz8 label{font-family:var(--typography-paragraph-body-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-paragraph-body-font-size,1rem);font-weight:var(--typography-paragraph-bold-font-weight,600);letter-spacing:var(--typography-paragraph-body-letter-spacing,normal);line-height:var(--typography-paragraph-body-line-height,1.5rem);position:static}.RadioField-module_container__r6T25:not(.RadioField-module_reversed__EX79j) label:hover input:not([disabled])+span{background-color:var(--color-gray-200,#f4f4f5);border-color:var(--color-gray-600,#524e56)}.RadioField-module_container__r6T25.RadioField-module_reversed__EX79j label:hover input:not([disabled])+span{background-color:transparent;border-color:var(--color-white,#fff)}";
+var styles = {
+  "container": "RadioField-module_container__r6T25",
+  "selected": "RadioField-module_selected__kdlz8",
+  "reversed": "RadioField-module_reversed__EX79j"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;

package/dist/cjs/Radio/RadioGroup/RadioGroup.cjs

@@ -0,0 +1,43 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var Label = require('../../Label/Label.cjs');
+var RadioGroup_module = require('./RadioGroup.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var RadioGroup = function (_a) {
+  var children = _a.children,
+    propsLabelId = _a.labelId,
+    labelText = _a.labelText,
+    _b = _a.noBottomMargin,
+    noBottomMargin = _b === void 0 ? false : _b,
+    _c = _a.reversed,
+    reversed = _c === void 0 ? false : _c,
+    classNameOverride = _a.classNameOverride,
+    dataTestId = _a["data-testid"],
+    restProps = tslib.__rest(_a, ["children", "labelId", "labelText", "noBottomMargin", "reversed", "classNameOverride", "data-testid"]);
+  var labelId = propsLabelId !== null && propsLabelId !== void 0 ? propsLabelId : React.useId();
+  return React__default.default.createElement("div", tslib.__assign({
+    "data-testid": dataTestId,
+    className: classnames__default.default(RadioGroup_module.default.radioGroupContainer, classNameOverride, noBottomMargin && RadioGroup_module.default.noBottomMargin, reversed && RadioGroup_module.default.reversed),
+    role: "radiogroup",
+    "aria-labelledby": labelId
+  }, restProps), React__default.default.createElement("div", {
+    className: RadioGroup_module.default.radioGroupLabel
+  }, React__default.default.createElement(Label.Label, {
+    id: labelId,
+    "data-testid": dataTestId && "".concat(dataTestId, "-field-label"),
+    labelText: labelText,
+    labelType: "text",
+    reversed: reversed
+  })), children);
+};
+RadioGroup.displayName = "RadioGroup";
+exports.RadioGroup = RadioGroup;

package/dist/cjs/Radio/RadioGroup/RadioGroup.module.scss.cjs

@@ -0,0 +1,38 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".RadioGroup-module_radioGroupLabel__wIl4z{margin-bottom:var(--spacing-sm,.75rem)}.ideal-sans .RadioGroup-module_radioGroupLabel__wIl4z label{padding-top:0}.RadioGroup-module_radioGroupLabel__wIl4z.RadioGroup-module_reversed__VeBun{color:var(--color-white,#fff)}.RadioGroup-module_radioGroupContainer__NKWpt{display:flex;flex-direction:column;margin-bottom:var(--spacing-sm,.75rem)}.RadioGroup-module_radioGroupContainer__NKWpt.RadioGroup-module_noBottomMargin__VKF2T{margin-bottom:0}";
+var styles = {
+  "radioGroupLabel": "RadioGroup-module_radioGroupLabel__wIl4z",
+  "reversed": "RadioGroup-module_reversed__VeBun",
+  "radioGroupContainer": "RadioGroup-module_radioGroupContainer__NKWpt",
+  "noBottomMargin": "RadioGroup-module_noBottomMargin__VKF2T"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;

package/dist/cjs/RichTextEditor/EditableRichTextContent/EditableRichTextContent.cjs

@@ -0,0 +1,50 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var Label = require('../../Label/Label.cjs');
+var VisuallyHidden = require('../../VisuallyHidden/VisuallyHidden.cjs');
+var RichTextContent = require('../RichTextContent/RichTextContent.cjs');
+var EditableRichTextContent_module = require('./EditableRichTextContent.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var handleEditableClick = function (e, onClick) {
+  if (e.target.hasAttribute("href")) {
+    return;
+  }
+  return onClick(e);
+};
+var EditableRichTextContent = function (_a) {
+  var onClick = _a.onClick,
+    content = _a.content,
+    classNameOverride = _a.classNameOverride,
+    labelText = _a.labelText,
+    _b = _a.isLabelHidden,
+    isLabelHidden = _b === void 0 ? false : _b,
+    contentProps = _a.contentProps,
+    restProps = tslib.__rest(_a, ["onClick", "content", "classNameOverride", "labelText", "isLabelHidden", "contentProps"]);
+  return React__default.default.createElement(React__default.default.Fragment, null, !isLabelHidden && React__default.default.createElement(Label.Label, {
+    labelText: labelText
+  }), React__default.default.createElement("div", tslib.__assign({
+    onClick: function (e) {
+      return handleEditableClick(e, onClick);
+    },
+    className: classnames__default.default(EditableRichTextContent_module.default.editableContainer, classNameOverride)
+  }, restProps), React__default.default.createElement(VisuallyHidden.VisuallyHidden, {
+    classNameOverride: EditableRichTextContent_module.default.hiddenButton
+  }, React__default.default.createElement("button", {
+    type: "button",
+    onClick: onClick,
+    "aria-label": "Edit ".concat(labelText)
+  })), React__default.default.createElement(RichTextContent.RichTextContent, tslib.__assign({
+    content: content
+  }, contentProps))));
+};
+EditableRichTextContent.displayName = "EditableRichTextContent";
+exports.EditableRichTextContent = EditableRichTextContent;

package/dist/cjs/RichTextEditor/EditableRichTextContent/EditableRichTextContent.module.scss.cjs

@@ -0,0 +1,36 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".EditableRichTextContent-module_editableContainer__zZEMC .ProseMirror{background-color:var(--color-gray-200,#f4f4f5);border:var(--border-focus-ring-border-width,2px) var(--border-focus-ring-border-style,solid) transparent;border-radius:var(--border-solid-border-radius,7px);padding:var(--spacing-sm,.75rem);position:relative;transition:background-color var(--animation-duration-immediate,.1s),border-color var(--animation-duration-immediate,.1s)}.EditableRichTextContent-module_editableContainer__zZEMC:hover .ProseMirror{background-color:var(--color-gray-200,#f4f4f5);border-color:var(--color-blue-500,#0168b3)}.EditableRichTextContent-module_editableContainer__zZEMC .EditableRichTextContent-module_hiddenButton__Kq3oB:focus-within+*>.ProseMirror{border:var(--border-focus-ring-border-width,2px) var(--border-focus-ring-border-style,solid) var(--color-blue-500,#0168b3)}";
+var styles = {
+  "editableContainer": "EditableRichTextContent-module_editableContainer__zZEMC",
+  "hiddenButton": "EditableRichTextContent-module_hiddenButton__Kq3oB"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;

package/dist/cjs/RichTextEditor/RichTextContent/RichTextContent.cjs

@@ -0,0 +1,65 @@
+'use strict';
+
+var tslib = require('tslib');
+var React = require('react');
+var classnames = require('classnames');
+var schema = require('../RichTextEditor/schema.cjs');
+var ProseMirrorState = require('prosemirror-state');
+require('prosemirror-view');
+var useRichTextEditor = require('../utils/core/hooks/useRichTextEditor.cjs');
+var ProseMirrorModel = require('prosemirror-model');
+require('prosemirror-inputrules');
+require('prosemirror-commands');
+require('prosemirror-keymap');
+require('prosemirror-history');
+require('prosemirror-schema-list');
+var RichTextContent_module = require('./RichTextContent.module.scss.cjs');
+function _interopDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () {
+            return e[k];
+          }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classnames__default = /*#__PURE__*/_interopDefault(classnames);
+var ProseMirrorState__namespace = /*#__PURE__*/_interopNamespace(ProseMirrorState);
+var ProseMirrorModel__namespace = /*#__PURE__*/_interopNamespace(ProseMirrorModel);
+var RichTextContent = function (props) {
+  var content = props.content,
+    classNameOverride = props.classNameOverride,
+    restProps = tslib.__rest(props, ["content", "classNameOverride"]);
+  var schema$1 = React.useState(schema.createSchemaWithAll())[0];
+  var editorRef = useRichTextEditor.useRichTextEditor(ProseMirrorState__namespace.EditorState.create({
+    doc: ProseMirrorModel__namespace.Node.fromJSON(schema$1, {
+      type: "doc",
+      content: content
+    }),
+    schema: schema$1
+  }), undefined, {
+    editable: false
+  })[0];
+  return React__default.default.createElement("div", tslib.__assign({
+    ref: editorRef,
+    className: classnames__default.default(RichTextContent_module.default.content, classNameOverride)
+  }, restProps));
+};
+RichTextContent.displayName = "RichTextContent";
+exports.RichTextContent = RichTextContent;

package/dist/cjs/RichTextEditor/RichTextContent/RichTextContent.module.scss.cjs

@@ -0,0 +1,35 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var css_248z = ".RichTextContent-module_content__vVcWj>.ProseMirror{box-sizing:content-box;font-family:var(--typography-paragraph-body-font-family,\"Inter\",\"Noto Sans\",Helvetica,Arial,sans-serif);font-size:var(--typography-paragraph-body-font-size,1rem);font-weight:var(--typography-paragraph-body-font-weight,400);letter-spacing:var(--typography-paragraph-body-letter-spacing,normal);line-height:var(--typography-paragraph-body-line-height,1.5rem);position:relative;white-space:pre-wrap}.RichTextContent-module_content__vVcWj>.ProseMirror>p{margin:0 0 var(--spacing-16,1rem)}.RichTextContent-module_content__vVcWj>.ProseMirror>:last-child,.RichTextContent-module_content__vVcWj>.ProseMirror>:last-child>li:last-of-type p{margin-bottom:0}.RichTextContent-module_content__vVcWj>.ProseMirror>:first-child,.RichTextContent-module_content__vVcWj>.ProseMirror>:first-child>li:first-of-type p{margin-top:0}.RichTextContent-module_content__vVcWj>.ProseMirror a{color:var(--color-blue-500,#0168b3)}.RichTextContent-module_content__vVcWj>.ProseMirror a:hover{text-decoration:none}.RichTextContent-module_content__vVcWj>.ProseMirror ol,.RichTextContent-module_content__vVcWj>.ProseMirror ul{padding-inline-start:var(--spacing-40,2.5rem)}.RichTextContent-module_content__vVcWj>.ProseMirror ol{list-style-type:decimal}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol{list-style-type:lower-alpha}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol{list-style-type:lower-roman}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ol,.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ul{padding-inline-start:var(--spacing-40,2.5rem)}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ol{list-style-type:decimal}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ol ol{list-style-type:lower-alpha}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ol ol ol{list-style-type:lower-roman}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ul{list-style-type:disc}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ul ul{list-style-type:circle}.RichTextContent-module_content__vVcWj>.ProseMirror ol ol ol ul ul ul{list-style-type:square}.RichTextContent-module_content__vVcWj>.ProseMirror ul{list-style-type:disc}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul{list-style-type:circle}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul{list-style-type:square}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ol,.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ul{padding-inline-start:var(--spacing-40,2.5rem)}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ol{list-style-type:decimal}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ol ol{list-style-type:lower-alpha}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ol ol ol{list-style-type:lower-roman}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ul{list-style-type:disc}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ul ul{list-style-type:circle}.RichTextContent-module_content__vVcWj>.ProseMirror ul ul ul ul ul ul{list-style-type:square}";
+var styles = {
+  "content": "RichTextContent-module_content__vVcWj"
+};
+// Forked from https://github.com/egoist/style-inject
+function styleInject(css, {
+  insertAt
+} = {}) {
+  if (typeof document === "undefined") return;
+  const head = document.head || document.getElementsByTagName("head")[0];
+  const style = document.createElement("style");
+  style.type = "text/css";
+  if (insertAt === "top") {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+styleInject(css_248z);
+exports.default = styles;
+exports.styleInject = styleInject;