@activecollab/components 2.0.498 → 2.0.500

package/dist/cjs/components/MessageBubble/MessageBubble.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ReactionChip = exports.MessageBubble = exports.HoverActions = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _Styles = require("./Styles");
+var _excluded = ["look", "surface", "side", "highlighted", "className", "children"],
+  _excluded2 = ["emoji", "count", "pressed", "readOnly", "className"],
+  _excluded3 = ["open", "className", "children"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+var MessageBubble = exports.MessageBubble = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var _ref$look = _ref.look,
+    look = _ref$look === void 0 ? "other" : _ref$look,
+    _ref$surface = _ref.surface,
+    surface = _ref$surface === void 0 ? "tint" : _ref$surface,
+    side = _ref.side,
+    _ref$highlighted = _ref.highlighted,
+    highlighted = _ref$highlighted === void 0 ? false : _ref$highlighted,
+    className = _ref.className,
+    children = _ref.children,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledMessageBubble, _extends({}, rest, {
+    ref: ref,
+    $look: look,
+    $surface: surface,
+    $side: side !== null && side !== void 0 ? side : look === "own" ? "end" : "start",
+    $highlighted: highlighted,
+    "data-look": look,
+    className: (0, _classnames.default)("c-message-bubble", className)
+  }), children);
+});
+MessageBubble.displayName = "MessageBubble";
+var ReactionChip = exports.ReactionChip = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
+  var emoji = _ref2.emoji,
+    _ref2$count = _ref2.count,
+    count = _ref2$count === void 0 ? 0 : _ref2$count,
+    _ref2$pressed = _ref2.pressed,
+    pressed = _ref2$pressed === void 0 ? false : _ref2$pressed,
+    _ref2$readOnly = _ref2.readOnly,
+    readOnly = _ref2$readOnly === void 0 ? false : _ref2$readOnly,
+    className = _ref2.className,
+    rest = _objectWithoutProperties(_ref2, _excluded2);
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledReactionChip, _extends({
+    type: "button"
+  }, rest, {
+    ref: ref,
+    disabled: readOnly,
+    "aria-pressed": pressed,
+    $pressed: pressed,
+    $readOnly: readOnly,
+    className: (0, _classnames.default)("c-reaction-chip", className)
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    "aria-hidden": "true"
+  }, emoji), count > 0 ? /*#__PURE__*/_react.default.createElement("span", null, count) : null);
+});
+ReactionChip.displayName = "ReactionChip";
+/** Controls that show while the pointer or the focus is in the closest element with `data-hover-scope`. */
+var HoverActions = exports.HoverActions = /*#__PURE__*/(0, _react.forwardRef)(function (_ref3, ref) {
+  var _ref3$open = _ref3.open,
+    open = _ref3$open === void 0 ? false : _ref3$open,
+    className = _ref3.className,
+    children = _ref3.children,
+    rest = _objectWithoutProperties(_ref3, _excluded3);
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledHoverActions, _extends({}, rest, {
+    ref: ref,
+    $open: open,
+    className: (0, _classnames.default)("c-hover-actions", className)
+  }), children);
+});
+HoverActions.displayName = "HoverActions";
+//# sourceMappingURL=MessageBubble.js.map

package/dist/cjs/components/MessageBubble/MessageBubble.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageBubble.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Styles","_excluded","_excluded2","_excluded3","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","_objectWithoutProperties","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","MessageBubble","exports","forwardRef","_ref","ref","_ref$look","look","_ref$surface","surface","side","_ref$highlighted","highlighted","className","children","rest","createElement","StyledMessageBubble","$look","$surface","$side","$highlighted","classnames","displayName","ReactionChip","_ref2","emoji","_ref2$count","count","_ref2$pressed","pressed","_ref2$readOnly","readOnly","StyledReactionChip","type","disabled","$pressed","$readOnly","HoverActions","_ref3","_ref3$open","open","StyledHoverActions","$open"],"sources":["../../../../src/components/MessageBubble/MessageBubble.tsx"],"sourcesContent":["import React, {\n  ButtonHTMLAttributes,\n  HTMLAttributes,\n  ReactNode,\n  forwardRef,\n} from \"react\";\n\nimport classnames from \"classnames\";\n\nimport {\n  MessageBubbleLook,\n  MessageBubbleSurface,\n  StyledHoverActions,\n  StyledMessageBubble,\n  StyledReactionChip,\n} from \"./Styles\";\n\nexport interface IMessageBubbleProps extends HTMLAttributes<HTMLDivElement> {\n  /** \"own\" and \"other\" by the author, \"new\" for an unread message, \"pending\" while it sends, \"error\" when it failed. */\n  look?: MessageBubbleLook;\n  /** The surface of another person's message: \"raised\" on a panel in the color of the sheet. */\n  surface?: MessageBubbleSurface;\n  /** The side of the tail corner. An own message has it at the end. */\n  side?: \"start\" | \"end\";\n  /** Draws an outline, for a message that a link points to. */\n  highlighted?: boolean;\n}\n\nexport const MessageBubble = forwardRef<HTMLDivElement, IMessageBubbleProps>(\n  (\n    {\n      look = \"other\",\n      surface = \"tint\",\n      side,\n      highlighted = false,\n      className,\n      children,\n      ...rest\n    },\n    ref\n  ) => (\n    <StyledMessageBubble\n      {...rest}\n      ref={ref}\n      $look={look}\n      $surface={surface}\n      $side={side ?? (look === \"own\" ? \"end\" : \"start\")}\n      $highlighted={highlighted}\n      data-look={look}\n      className={classnames(\"c-message-bubble\", className)}\n    >\n      {children}\n    </StyledMessageBubble>\n  )\n);\n\nMessageBubble.displayName = \"MessageBubble\";\n\nexport interface IReactionChipProps\n  extends ButtonHTMLAttributes<HTMLButtonElement> {\n  emoji: ReactNode;\n  count?: number;\n  /** The viewer gave this reaction. */\n  pressed?: boolean;\n  readOnly?: boolean;\n}\n\nexport const ReactionChip = forwardRef<HTMLButtonElement, IReactionChipProps>(\n  (\n    { emoji, count = 0, pressed = false, readOnly = false, className, ...rest },\n    ref\n  ) => (\n    <StyledReactionChip\n      type=\"button\"\n      {...rest}\n      ref={ref}\n      disabled={readOnly}\n      aria-pressed={pressed}\n      $pressed={pressed}\n      $readOnly={readOnly}\n      className={classnames(\"c-reaction-chip\", className)}\n    >\n      <span aria-hidden=\"true\">{emoji}</span>\n      {count > 0 ? <span>{count}</span> : null}\n    </StyledReactionChip>\n  )\n);\n\nReactionChip.displayName = \"ReactionChip\";\n\nexport interface IHoverActionsProps extends HTMLAttributes<HTMLElement> {\n  /** Keeps the actions visible, for example while their menu is open. */\n  open?: boolean;\n  as?: \"div\" | \"span\";\n}\n\n/** Controls that show while the pointer or the focus is in the closest element with `data-hover-scope`. */\nexport const HoverActions = forwardRef<HTMLDivElement, IHoverActionsProps>(\n  ({ open = false, className, children, ...rest }, ref) => (\n    <StyledHoverActions\n      {...rest}\n      ref={ref}\n      $open={open}\n      className={classnames(\"c-hover-actions\", className)}\n    >\n      {children}\n    </StyledHoverActions>\n  )\n);\n\nHoverActions.displayName = \"HoverActions\";\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAOA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,OAAA,GAAAH,OAAA;AAMkB,IAAAI,SAAA;EAAAC,UAAA;EAAAC,UAAA;AAAA,SAAAJ,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAR,wBAAAQ,CAAA,EAAAG,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAZ,uBAAA,YAAAA,wBAAAQ,CAAA,EAAAG,CAAA,SAAAA,CAAA,IAAAH,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,MAAAO,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAR,OAAA,EAAAF,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAS,CAAA,MAAAF,CAAA,GAAAJ,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAE,CAAA,CAAAI,GAAA,CAAAX,CAAA,UAAAO,CAAA,CAAAK,GAAA,CAAAZ,CAAA,GAAAO,CAAA,CAAAM,GAAA,CAAAb,CAAA,EAAAS,CAAA,cAAAK,EAAA,IAAAd,CAAA,gBAAAc,EAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,EAAA,OAAAN,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAc,EAAA,OAAAN,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAK,EAAA,EAAAN,CAAA,IAAAC,CAAA,CAAAK,EAAA,IAAAd,CAAA,CAAAc,EAAA,WAAAL,CAAA,KAAAT,CAAA,EAAAG,CAAA;AAAA,SAAAiB,SAAA,WAAAA,QAAA,GAAAH,MAAA,CAAAI,MAAA,GAAAJ,MAAA,CAAAI,MAAA,CAAAC,IAAA,eAAAhB,CAAA,aAAAN,CAAA,MAAAA,CAAA,GAAAuB,SAAA,CAAAC,MAAA,EAAAxB,CAAA,UAAAG,CAAA,GAAAoB,SAAA,CAAAvB,CAAA,YAAAK,CAAA,IAAAF,CAAA,OAAAY,cAAA,CAAAC,IAAA,CAAAb,CAAA,EAAAE,CAAA,MAAAC,CAAA,CAAAD,CAAA,IAAAF,CAAA,CAAAE,CAAA,aAAAC,CAAA,KAAAc,QAAA,CAAAK,KAAA,OAAAF,SAAA;AAAA,SAAAG,yBAAA1B,CAAA,EAAAG,CAAA,gBAAAH,CAAA,iBAAAO,CAAA,EAAAF,CAAA,EAAAG,CAAA,GAAAmB,6BAAA,CAAA3B,CAAA,EAAAG,CAAA,OAAAc,MAAA,CAAAW,qBAAA,QAAAtB,CAAA,GAAAW,MAAA,CAAAW,qBAAA,CAAA5B,CAAA,QAAAK,CAAA,MAAAA,CAAA,GAAAC,CAAA,CAAAkB,MAAA,EAAAnB,CAAA,IAAAE,CAAA,GAAAD,CAAA,CAAAD,CAAA,UAAAF,CAAA,CAAA0B,OAAA,CAAAtB,CAAA,QAAAuB,oBAAA,CAAAd,IAAA,CAAAhB,CAAA,EAAAO,CAAA,MAAAC,CAAA,CAAAD,CAAA,IAAAP,CAAA,CAAAO,CAAA,aAAAC,CAAA;AAAA,SAAAmB,8BAAAtB,CAAA,EAAAL,CAAA,gBAAAK,CAAA,iBAAAF,CAAA,gBAAAG,CAAA,IAAAD,CAAA,SAAAU,cAAA,CAAAC,IAAA,CAAAX,CAAA,EAAAC,CAAA,gBAAAN,CAAA,CAAA6B,OAAA,CAAAvB,CAAA,aAAAH,CAAA,CAAAG,CAAA,IAAAD,CAAA,CAAAC,CAAA,YAAAH,CAAA;AAaX,IAAM4B,aAAa,GAAAC,OAAA,CAAAD,aAAA,gBAAG,IAAAE,iBAAU,EACrC,UAAAC,IAAA,EAUEC,GAAG;EAAA,IAAAC,SAAA,GAAAF,IAAA,CARDG,IAAI;IAAJA,IAAI,GAAAD,SAAA,cAAG,OAAO,GAAAA,SAAA;IAAAE,YAAA,GAAAJ,IAAA,CACdK,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,MAAM,GAAAA,YAAA;IAChBE,IAAI,GAAAN,IAAA,CAAJM,IAAI;IAAAC,gBAAA,GAAAP,IAAA,CACJQ,WAAW;IAAXA,WAAW,GAAAD,gBAAA,cAAG,KAAK,GAAAA,gBAAA;IACnBE,SAAS,GAAAT,IAAA,CAATS,SAAS;IACTC,QAAQ,GAAAV,IAAA,CAARU,QAAQ;IACLC,IAAI,GAAAnB,wBAAA,CAAAQ,IAAA,EAAArC,SAAA;EAAA,oBAITN,MAAA,CAAAW,OAAA,CAAA4C,aAAA,CAAClD,OAAA,CAAAmD,mBAAmB,EAAA3B,QAAA,KACdyB,IAAI;IACRV,GAAG,EAAEA,GAAI;IACTa,KAAK,EAAEX,IAAK;IACZY,QAAQ,EAAEV,OAAQ;IAClBW,KAAK,EAAEV,IAAI,aAAJA,IAAI,cAAJA,IAAI,GAAKH,IAAI,KAAK,KAAK,GAAG,KAAK,GAAG,OAAS;IAClDc,YAAY,EAAET,WAAY;IAC1B,aAAWL,IAAK;IAChBM,SAAS,EAAE,IAAAS,mBAAU,EAAC,kBAAkB,EAAET,SAAS;EAAE,IAEpDC,QACkB,CAAC;AAAA,CAE1B,CAAC;AAEDb,aAAa,CAACsB,WAAW,GAAG,eAAe;AAWpC,IAAMC,YAAY,GAAAtB,OAAA,CAAAsB,YAAA,gBAAG,IAAArB,iBAAU,EACpC,UAAAsB,KAAA,EAEEpB,GAAG;EAAA,IADDqB,KAAK,GAAAD,KAAA,CAALC,KAAK;IAAAC,WAAA,GAAAF,KAAA,CAAEG,KAAK;IAALA,KAAK,GAAAD,WAAA,cAAG,CAAC,GAAAA,WAAA;IAAAE,aAAA,GAAAJ,KAAA,CAAEK,OAAO;IAAPA,OAAO,GAAAD,aAAA,cAAG,KAAK,GAAAA,aAAA;IAAAE,cAAA,GAAAN,KAAA,CAAEO,QAAQ;IAARA,QAAQ,GAAAD,cAAA,cAAG,KAAK,GAAAA,cAAA;IAAElB,SAAS,GAAAY,KAAA,CAATZ,SAAS;IAAKE,IAAI,GAAAnB,wBAAA,CAAA6B,KAAA,EAAAzD,UAAA;EAAA,oBAGzEP,MAAA,CAAAW,OAAA,CAAA4C,aAAA,CAAClD,OAAA,CAAAmE,kBAAkB,EAAA3C,QAAA;IACjB4C,IAAI,EAAC;EAAQ,GACTnB,IAAI;IACRV,GAAG,EAAEA,GAAI;IACT8B,QAAQ,EAAEH,QAAS;IACnB,gBAAcF,OAAQ;IACtBM,QAAQ,EAAEN,OAAQ;IAClBO,SAAS,EAAEL,QAAS;IACpBnB,SAAS,EAAE,IAAAS,mBAAU,EAAC,iBAAiB,EAAET,SAAS;EAAE,iBAEpDpD,MAAA,CAAAW,OAAA,CAAA4C,aAAA;IAAM,eAAY;EAAM,GAAEU,KAAY,CAAC,EACtCE,KAAK,GAAG,CAAC,gBAAGnE,MAAA,CAAAW,OAAA,CAAA4C,aAAA,eAAOY,KAAY,CAAC,GAAG,IAClB,CAAC;AAAA,CAEzB,CAAC;AAEDJ,YAAY,CAACD,WAAW,GAAG,cAAc;AAQzC;AACO,IAAMe,YAAY,GAAApC,OAAA,CAAAoC,YAAA,gBAAG,IAAAnC,iBAAU,EACpC,UAAAoC,KAAA,EAAiDlC,GAAG;EAAA,IAAAmC,UAAA,GAAAD,KAAA,CAAjDE,IAAI;IAAJA,IAAI,GAAAD,UAAA,cAAG,KAAK,GAAAA,UAAA;IAAE3B,SAAS,GAAA0B,KAAA,CAAT1B,SAAS;IAAEC,QAAQ,GAAAyB,KAAA,CAARzB,QAAQ;IAAKC,IAAI,GAAAnB,wBAAA,CAAA2C,KAAA,EAAAtE,UAAA;EAAA,oBAC3CR,MAAA,CAAAW,OAAA,CAAA4C,aAAA,CAAClD,OAAA,CAAA4E,kBAAkB,EAAApD,QAAA,KACbyB,IAAI;IACRV,GAAG,EAAEA,GAAI;IACTsC,KAAK,EAAEF,IAAK;IACZ5B,SAAS,EAAE,IAAAS,mBAAU,EAAC,iBAAiB,EAAET,SAAS;EAAE,IAEnDC,QACiB,CAAC;AAAA,CAEzB,CAAC;AAEDwB,YAAY,CAACf,WAAW,GAAG,cAAc","ignoreList":[]}

package/dist/cjs/components/MessageBubble/Styles.js

@@ -0,0 +1,56 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledReactionChip = exports.StyledMessageBubble = exports.StyledHoverActions = void 0;
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var tint = function tint(step, border) {
+  var style = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "solid";
+  return (0, _styledComponents.css)(["background-color:var(--color-primary-opaque-", ");border:1px ", " ", ";"], step, style, border);
+};
+var LOOKS = {
+  own: tint(300, "var(--color-primary-opaque-500)"),
+  new: tint(200, "var(--color-primary-opaque-500)"),
+  pending: tint(300, "var(--color-primary-opaque-500)", "dashed"),
+  error: tint(300, "var(--red-alert)")
+};
+var StyledMessageBubble = exports.StyledMessageBubble = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledMessageBubble",
+  componentId: "sc-sfjofu-0"
+})(["padding:9px 12px 8px;overflow:hidden;border-radius:18px;border-bottom-", "-radius:6px;", " ", ""], function (_ref) {
+  var $side = _ref.$side;
+  return $side === "end" ? "right" : "left";
+}, function (_ref2) {
+  var $look = _ref2.$look,
+    $surface = _ref2.$surface;
+  return $look === "other" ? (0, _styledComponents.css)(["background-color:var( ", " );border:1px solid var(", ");"], $surface === "raised" ? "--surface-raised" : "--pill-background", $surface === "raised" ? "--border-raised" : "--pill-border") : LOOKS[$look];
+}, function (_ref3) {
+  var $highlighted = _ref3.$highlighted;
+  return $highlighted && "outline: 2px solid var(--color-primary);";
+});
+var StyledReactionChip = exports.StyledReactionChip = _styledComponents.default.button.withConfig({
+  displayName: "Styles__StyledReactionChip",
+  componentId: "sc-sfjofu-1"
+})(["display:flex;align-items:center;gap:4px;height:24px;padding:0 8px;border:1px solid var( ", " );border-radius:12px;background-color:var( ", " );box-shadow:var(--shadow-soft);color:var( ", " );font-size:12px;line-height:1;font-weight:600;cursor:", ";"], function (_ref4) {
+  var $pressed = _ref4.$pressed;
+  return $pressed ? "--color-primary-opaque-500" : "--border-raised";
+}, function (_ref5) {
+  var $pressed = _ref5.$pressed;
+  return $pressed ? "--color-primary-opaque-300" : "--surface-raised";
+}, function (_ref6) {
+  var $pressed = _ref6.$pressed;
+  return $pressed ? "--color-primary" : "--color-theme-800";
+}, function (_ref7) {
+  var $readOnly = _ref7.$readOnly;
+  return $readOnly ? "default" : "pointer";
+});
+var StyledHoverActions = exports.StyledHoverActions = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledHoverActions",
+  componentId: "sc-sfjofu-2"
+})(["opacity:", ";transition:opacity 150ms cubic-bezier(0.4,0,0.2,1);[data-hover-scope]:hover &,[data-hover-scope]:focus-within &{opacity:1;}@media (hover:none){opacity:1;}@media print{display:none;}"], function (_ref8) {
+  var $open = _ref8.$open;
+  return $open ? 1 : 0;
+});
+//# sourceMappingURL=Styles.js.map

package/dist/cjs/components/MessageBubble/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","tint","step","border","style","arguments","length","undefined","css","LOOKS","own","new","pending","error","StyledMessageBubble","exports","styled","div","withConfig","displayName","componentId","_ref","$side","_ref2","$look","$surface","_ref3","$highlighted","StyledReactionChip","button","_ref4","$pressed","_ref5","_ref6","_ref7","$readOnly","StyledHoverActions","_ref8","$open"],"sources":["../../../../src/components/MessageBubble/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nexport type MessageBubbleLook = \"own\" | \"other\" | \"new\" | \"pending\" | \"error\";\nexport type MessageBubbleSurface = \"tint\" | \"raised\";\n\nconst tint = (step: number, border: string, style = \"solid\") => css`\n  background-color: var(--color-primary-opaque-${step});\n  border: 1px ${style} ${border};\n`;\n\nconst LOOKS = {\n  own: tint(300, \"var(--color-primary-opaque-500)\"),\n  new: tint(200, \"var(--color-primary-opaque-500)\"),\n  pending: tint(300, \"var(--color-primary-opaque-500)\", \"dashed\"),\n  error: tint(300, \"var(--red-alert)\"),\n};\n\nexport const StyledMessageBubble = styled.div<{\n  $look: MessageBubbleLook;\n  $surface: MessageBubbleSurface;\n  $side: \"start\" | \"end\";\n  $highlighted: boolean;\n}>`\n  padding: 9px 12px 8px;\n  overflow: hidden;\n  border-radius: 18px;\n  border-bottom-${({ $side }) =>\n    $side === \"end\" ? \"right\" : \"left\"}-radius: 6px;\n\n  ${({ $look, $surface }) =>\n    $look === \"other\"\n      ? css`\n          background-color: var(\n            ${$surface === \"raised\" ? \"--surface-raised\" : \"--pill-background\"}\n          );\n          border: 1px solid\n            var(${$surface === \"raised\" ? \"--border-raised\" : \"--pill-border\"});\n        `\n      : LOOKS[$look]}\n\n  ${({ $highlighted }) =>\n    $highlighted && \"outline: 2px solid var(--color-primary);\"}\n`;\n\nexport const StyledReactionChip = styled.button<{\n  $pressed: boolean;\n  $readOnly: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  height: 24px;\n  padding: 0 8px;\n  border: 1px solid\n    var(\n      ${({ $pressed }) =>\n        $pressed ? \"--color-primary-opaque-500\" : \"--border-raised\"}\n    );\n  border-radius: 12px;\n  background-color: var(\n    ${({ $pressed }) =>\n      $pressed ? \"--color-primary-opaque-300\" : \"--surface-raised\"}\n  );\n  box-shadow: var(--shadow-soft);\n  color: var(\n    ${({ $pressed }) => ($pressed ? \"--color-primary\" : \"--color-theme-800\")}\n  );\n  font-size: 12px;\n  line-height: 1;\n  font-weight: 600;\n  cursor: ${({ $readOnly }) => ($readOnly ? \"default\" : \"pointer\")};\n`;\n\nexport const StyledHoverActions = styled.div<{ $open: boolean }>`\n  opacity: ${({ $open }) => ($open ? 1 : 0)};\n  transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);\n\n  [data-hover-scope]:hover &,\n  [data-hover-scope]:focus-within & {\n    opacity: 1;\n  }\n\n  @media (hover: none) {\n    opacity: 1;\n  }\n\n  @media print {\n    display: none;\n  }\n`;\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/MessageBubble/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _MessageBubble = require("./MessageBubble");
+Object.keys(_MessageBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageBubble[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/MessageBubble/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_MessageBubble","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../../../src/components/MessageBubble/index.ts"],"sourcesContent":["export * from \"./MessageBubble\";\n"],"mappings":";;;;;AAAA,IAAAA,cAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,cAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,cAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,cAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/cjs/components/ObjectLayout/ObjectLayout.js

@@ -0,0 +1,189 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ObjectLayout = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _Styles = require("./Styles");
+var _hooks = require("../../hooks");
+var _useContainerCss = require("../../utils/useContainerCss");
+var _excluded = ["topBar", "band", "properties", "main", "rail", "stream", "panel", "panelWidth", "panelMin", "panelMax", "mainMin", "onPanelWidthChange", "resizeLabel", "ownScroll", "resetKey", "className", "data-testid"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+// The height of the rail as the object opens. It stops to follow the rail at the first action of the user.
+var useOpeningRailHeight = function useOpeningRailHeight(resetKey) {
+  var railRef = (0, _react.useRef)(null);
+  var isFrozen = (0, _react.useRef)(false);
+  var _useState = (0, _react.useState)(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    height = _useState2[0],
+    setHeight = _useState2[1];
+  (0, _react.useEffect)(function () {
+    var rail = railRef.current;
+    isFrozen.current = false;
+    var measure = function measure() {
+      if (rail && !isFrozen.current) {
+        setHeight(rail.offsetHeight);
+      }
+    };
+    measure();
+    if (!rail || typeof ResizeObserver === "undefined") {
+      return undefined;
+    }
+
+    // eslint-disable-next-line compat/compat
+    var observer = new ResizeObserver(measure);
+    observer.observe(rail);
+    return function () {
+      return observer.disconnect();
+    };
+  }, [resetKey]);
+  var freeze = (0, _react.useCallback)(function () {
+    isFrozen.current = true;
+  }, []);
+  return {
+    railRef,
+    height,
+    freeze
+  };
+};
+var noChange = function noChange() {
+  return undefined;
+};
+var ObjectLayout = exports.ObjectLayout = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var topBar = _ref.topBar,
+    band = _ref.band,
+    properties = _ref.properties,
+    main = _ref.main,
+    rail = _ref.rail,
+    stream = _ref.stream,
+    panel = _ref.panel,
+    _ref$panelWidth = _ref.panelWidth,
+    panelWidth = _ref$panelWidth === void 0 ? 600 : _ref$panelWidth,
+    _ref$panelMin = _ref.panelMin,
+    panelMin = _ref$panelMin === void 0 ? 300 : _ref$panelMin,
+    _ref$panelMax = _ref.panelMax,
+    panelMax = _ref$panelMax === void 0 ? 750 : _ref$panelMax,
+    _ref$mainMin = _ref.mainMin,
+    mainMin = _ref$mainMin === void 0 ? 550 : _ref$mainMin,
+    onPanelWidthChange = _ref.onPanelWidthChange,
+    _ref$resizeLabel = _ref.resizeLabel,
+    resizeLabel = _ref$resizeLabel === void 0 ? "Resize panel" : _ref$resizeLabel,
+    _ref$ownScroll = _ref.ownScroll,
+    ownScroll = _ref$ownScroll === void 0 ? false : _ref$ownScroll,
+    resetKey = _ref.resetKey,
+    className = _ref.className,
+    testId = _ref["data-testid"],
+    rest = _objectWithoutProperties(_ref, _excluded);
+  (0, _useContainerCss.useContainerCss)("c-object-layout-container", _Styles.CONTAINER_CSS);
+  var hasPanel = panel !== undefined && panel !== null;
+  var hasRail = rail !== undefined && rail !== null;
+  var _useOpeningRailHeight = useOpeningRailHeight(resetKey),
+    railRef = _useOpeningRailHeight.railRef,
+    height = _useOpeningRailHeight.height,
+    freeze = _useOpeningRailHeight.freeze;
+  var _useResizablePanel = (0, _hooks.useResizablePanel)({
+      side: "right",
+      width: (0, _hooks.clampPanelWidth)(panelWidth, panelMin, panelMax),
+      min: panelMin,
+      max: panelMax,
+      onChange: onPanelWidthChange !== null && onPanelWidthChange !== void 0 ? onPanelWidthChange : noChange
+    }),
+    width = _useResizablePanel.width,
+    handleProps = _useResizablePanel.handleProps;
+  var part = function part(name) {
+    return testId ? "".concat(testId, "-").concat(name) : undefined;
+  };
+  var header = topBar ? /*#__PURE__*/_react.default.createElement(_Styles.StyledHeader, {
+    $panel: hasPanel,
+    className: "c-object-layout__header",
+    "data-testid": part("header")
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledTopBar, {
+    "data-testid": part("top-bar")
+  }, topBar)) : null;
+  var bandNode = band ? /*#__PURE__*/_react.default.createElement(_Styles.StyledBand, {
+    className: "c-object-layout__band",
+    "data-testid": part("band")
+  }, band) : null;
+  if (hasPanel) {
+    return /*#__PURE__*/_react.default.createElement(_Styles.StyledObjectLayout, _extends({}, rest, {
+      ref: ref,
+      $fill: ownScroll,
+      "data-testid": testId,
+      className: (0, _classnames.default)("c-object-layout c-object-layout--panel", {
+        "c-object-layout--own-scroll": ownScroll
+      }, className)
+    }), /*#__PURE__*/_react.default.createElement(_Styles.StyledSplit, {
+      $ownScroll: ownScroll,
+      className: "c-object-layout__split",
+      style: {
+        "--panel-width": "".concat(width, "px"),
+        "--main-min": "".concat(mainMin, "px")
+      },
+      "data-testid": part("split")
+    }, /*#__PURE__*/_react.default.createElement(_Styles.StyledPart, {
+      className: "c-object-layout__part",
+      "data-testid": part("part")
+    }, header, bandNode, /*#__PURE__*/_react.default.createElement(_Styles.StyledPartColumns, {
+      className: "c-object-layout__part-columns",
+      "data-testid": part("columns")
+    }, properties ? /*#__PURE__*/_react.default.createElement(_Styles.StyledProperties, {
+      "data-testid": part("properties")
+    }, properties) : null, /*#__PURE__*/_react.default.createElement(_Styles.StyledMain, {
+      $padded: true,
+      className: "c-object-layout__main",
+      "data-testid": part("main")
+    }, main))), /*#__PURE__*/_react.default.createElement(_Styles.StyledPanel, {
+      className: "c-object-layout__panel",
+      "data-testid": part("rail")
+    }, onPanelWidthChange ? /*#__PURE__*/_react.default.createElement(_Styles.StyledPanelHandle, _extends({}, handleProps, {
+      label: resizeLabel,
+      className: "c-object-layout__handle",
+      "data-testid": part("resize")
+    })) : null, panel)));
+  }
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledObjectLayout, _extends({}, rest, {
+    ref: ref,
+    $fill: false,
+    "data-testid": testId,
+    onPointerDownCapture: freeze,
+    onKeyDownCapture: freeze,
+    className: (0, _classnames.default)("c-object-layout", {
+      "c-object-layout--single": !hasRail
+    }, className)
+  }), header, bandNode, /*#__PURE__*/_react.default.createElement(_Styles.StyledColumns, {
+    className: "c-object-layout__columns",
+    "data-testid": part("columns")
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledLeft, {
+    className: "c-object-layout__left",
+    style: {
+      "--opening-rail-height": "".concat(height, "px")
+    },
+    "data-testid": part("left")
+  }, properties ? /*#__PURE__*/_react.default.createElement(_Styles.StyledProperties, {
+    "data-testid": part("properties")
+  }, properties) : null, /*#__PURE__*/_react.default.createElement(_Styles.StyledMain, {
+    $padded: !stream,
+    className: "c-object-layout__main",
+    "data-testid": part("main")
+  }, main), /*#__PURE__*/_react.default.createElement(_Styles.StyledStream, {
+    "data-testid": part("stream")
+  }, stream)), hasRail ? /*#__PURE__*/_react.default.createElement(_Styles.StyledRail, {
+    ref: railRef,
+    className: "c-object-layout__rail",
+    "data-testid": part("rail")
+  }, rail) : null));
+});
+ObjectLayout.displayName = "ObjectLayout";
+//# sourceMappingURL=ObjectLayout.js.map

package/dist/cjs/components/ObjectLayout/ObjectLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ObjectLayout.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Styles","_hooks","_useContainerCss","_excluded","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","_objectWithoutProperties","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","_slicedToArray","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","a","_arrayLikeToArray","toString","slice","constructor","name","Array","from","test","l","Symbol","iterator","u","next","done","push","value","return","isArray","useOpeningRailHeight","resetKey","railRef","useRef","isFrozen","_useState","useState","_useState2","height","setHeight","useEffect","rail","current","measure","offsetHeight","ResizeObserver","undefined","observer","observe","disconnect","freeze","useCallback","noChange","ObjectLayout","exports","forwardRef","_ref","ref","topBar","band","properties","main","stream","panel","_ref$panelWidth","panelWidth","_ref$panelMin","panelMin","_ref$panelMax","panelMax","_ref$mainMin","mainMin","onPanelWidthChange","_ref$resizeLabel","resizeLabel","_ref$ownScroll","ownScroll","className","testId","rest","useContainerCss","CONTAINER_CSS","hasPanel","hasRail","_useOpeningRailHeight","_useResizablePanel","useResizablePanel","side","width","clampPanelWidth","min","max","onChange","handleProps","part","concat","header","createElement","StyledHeader","$panel","StyledTopBar","bandNode","StyledBand","StyledObjectLayout","$fill","classnames","StyledSplit","$ownScroll","style","StyledPart","StyledPartColumns","StyledProperties","StyledMain","$padded","StyledPanel","StyledPanelHandle","label","onPointerDownCapture","onKeyDownCapture","StyledColumns","StyledLeft","StyledStream","StyledRail","displayName"],"sources":["../../../../src/components/ObjectLayout/ObjectLayout.tsx"],"sourcesContent":["import React, {\n  CSSProperties,\n  HTMLAttributes,\n  ReactNode,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\n\nimport classnames from \"classnames\";\n\nimport {\n  CONTAINER_CSS,\n  StyledBand,\n  StyledColumns,\n  StyledHeader,\n  StyledLeft,\n  StyledMain,\n  StyledObjectLayout,\n  StyledPanel,\n  StyledPanelHandle,\n  StyledPart,\n  StyledPartColumns,\n  StyledProperties,\n  StyledRail,\n  StyledSplit,\n  StyledStream,\n  StyledTopBar,\n} from \"./Styles\";\nimport { clampPanelWidth, useResizablePanel } from \"../../hooks\";\nimport { useContainerCss } from \"../../utils/useContainerCss\";\n\nexport interface IObjectLayoutProps extends HTMLAttributes<HTMLDivElement> {\n  /** Sticky bar at the top edge. */\n  topBar?: ReactNode;\n  /** Sticky band under the top bar, for the title. */\n  band?: ReactNode;\n  /** A block above the main content. */\n  properties?: ReactNode;\n  main?: ReactNode;\n  /** The 300px right column. Without a rail and a panel the layout has one column. */\n  rail?: ReactNode;\n  /** Rail mode: content after the main column that can hold a part on the bottom edge. */\n  stream?: ReactNode;\n  /** Replaces the rail with a panel at the full height of the layout. */\n  panel?: ReactNode;\n  panelWidth?: number;\n  panelMin?: number;\n  panelMax?: number;\n  /** The width the main part keeps beside the panel. */\n  mainMin?: number;\n  /** With it the panel has a resize handle. Called with a whole pixel. */\n  onPanelWidthChange?: (width: number) => void;\n  /** The accessible name of the resize handle. */\n  resizeLabel?: string;\n  /** Panel mode: the layout has the height of its parent and the main part scrolls by itself. */\n  ownScroll?: boolean;\n  /** Rail mode: a new value measures the opening height of the rail again. */\n  resetKey?: string | number;\n  \"data-testid\"?: string;\n}\n\n// The height of the rail as the object opens. It stops to follow the rail at the first action of the user.\nconst useOpeningRailHeight = (resetKey?: string | number) => {\n  const railRef = useRef<HTMLDivElement>(null);\n  const isFrozen = useRef(false);\n  const [height, setHeight] = useState(0);\n\n  useEffect(() => {\n    const rail = railRef.current;\n\n    isFrozen.current = false;\n\n    const measure = () => {\n      if (rail && !isFrozen.current) {\n        setHeight(rail.offsetHeight);\n      }\n    };\n\n    measure();\n\n    if (!rail || typeof ResizeObserver === \"undefined\") {\n      return undefined;\n    }\n\n    // eslint-disable-next-line compat/compat\n    const observer = new ResizeObserver(measure);\n\n    observer.observe(rail);\n\n    return () => observer.disconnect();\n  }, [resetKey]);\n\n  const freeze = useCallback(() => {\n    isFrozen.current = true;\n  }, []);\n\n  return { railRef, height, freeze };\n};\n\nconst noChange = () => undefined;\n\nexport const ObjectLayout = forwardRef<HTMLDivElement, IObjectLayoutProps>(\n  (\n    {\n      topBar,\n      band,\n      properties,\n      main,\n      rail,\n      stream,\n      panel,\n      panelWidth = 600,\n      panelMin = 300,\n      panelMax = 750,\n      mainMin = 550,\n      onPanelWidthChange,\n      resizeLabel = \"Resize panel\",\n      ownScroll = false,\n      resetKey,\n      className,\n      \"data-testid\": testId,\n      ...rest\n    },\n    ref\n  ) => {\n    useContainerCss(\"c-object-layout-container\", CONTAINER_CSS);\n\n    const hasPanel = panel !== undefined && panel !== null;\n    const hasRail = rail !== undefined && rail !== null;\n    const { railRef, height, freeze } = useOpeningRailHeight(resetKey);\n    const { width, handleProps } = useResizablePanel({\n      side: \"right\",\n      width: clampPanelWidth(panelWidth, panelMin, panelMax),\n      min: panelMin,\n      max: panelMax,\n      onChange: onPanelWidthChange ?? noChange,\n    });\n    const part = (name: string) => (testId ? `${testId}-${name}` : undefined);\n\n    const header = topBar ? (\n      <StyledHeader\n        $panel={hasPanel}\n        className=\"c-object-layout__header\"\n        data-testid={part(\"header\")}\n      >\n        <StyledTopBar data-testid={part(\"top-bar\")}>{topBar}</StyledTopBar>\n      </StyledHeader>\n    ) : null;\n\n    const bandNode = band ? (\n      <StyledBand className=\"c-object-layout__band\" data-testid={part(\"band\")}>\n        {band}\n      </StyledBand>\n    ) : null;\n\n    if (hasPanel) {\n      return (\n        <StyledObjectLayout\n          {...rest}\n          ref={ref}\n          $fill={ownScroll}\n          data-testid={testId}\n          className={classnames(\n            \"c-object-layout c-object-layout--panel\",\n            { \"c-object-layout--own-scroll\": ownScroll },\n            className\n          )}\n        >\n          <StyledSplit\n            $ownScroll={ownScroll}\n            className=\"c-object-layout__split\"\n            style={\n              {\n                \"--panel-width\": `${width}px`,\n                \"--main-min\": `${mainMin}px`,\n              } as CSSProperties\n            }\n            data-testid={part(\"split\")}\n          >\n            <StyledPart\n              className=\"c-object-layout__part\"\n              data-testid={part(\"part\")}\n            >\n              {header}\n              {bandNode}\n              <StyledPartColumns\n                className=\"c-object-layout__part-columns\"\n                data-testid={part(\"columns\")}\n              >\n                {properties ? (\n                  <StyledProperties data-testid={part(\"properties\")}>\n                    {properties}\n                  </StyledProperties>\n                ) : null}\n                <StyledMain\n                  $padded\n                  className=\"c-object-layout__main\"\n                  data-testid={part(\"main\")}\n                >\n                  {main}\n                </StyledMain>\n              </StyledPartColumns>\n            </StyledPart>\n            <StyledPanel\n              className=\"c-object-layout__panel\"\n              data-testid={part(\"rail\")}\n            >\n              {onPanelWidthChange ? (\n                <StyledPanelHandle\n                  {...handleProps}\n                  label={resizeLabel}\n                  className=\"c-object-layout__handle\"\n                  data-testid={part(\"resize\")}\n                />\n              ) : null}\n              {panel}\n            </StyledPanel>\n          </StyledSplit>\n        </StyledObjectLayout>\n      );\n    }\n\n    return (\n      <StyledObjectLayout\n        {...rest}\n        ref={ref}\n        $fill={false}\n        data-testid={testId}\n        onPointerDownCapture={freeze}\n        onKeyDownCapture={freeze}\n        className={classnames(\n          \"c-object-layout\",\n          { \"c-object-layout--single\": !hasRail },\n          className\n        )}\n      >\n        {header}\n        {bandNode}\n        <StyledColumns\n          className=\"c-object-layout__columns\"\n          data-testid={part(\"columns\")}\n        >\n          <StyledLeft\n            className=\"c-object-layout__left\"\n            style={{ \"--opening-rail-height\": `${height}px` } as CSSProperties}\n            data-testid={part(\"left\")}\n          >\n            {properties ? (\n              <StyledProperties data-testid={part(\"properties\")}>\n                {properties}\n              </StyledProperties>\n            ) : null}\n            <StyledMain\n              $padded={!stream}\n              className=\"c-object-layout__main\"\n              data-testid={part(\"main\")}\n            >\n              {main}\n            </StyledMain>\n            <StyledStream data-testid={part(\"stream\")}>{stream}</StyledStream>\n          </StyledLeft>\n          {hasRail ? (\n            <StyledRail\n              ref={railRef}\n              className=\"c-object-layout__rail\"\n              data-testid={part(\"rail\")}\n            >\n              {rail}\n            </StyledRail>\n          ) : null}\n        </StyledColumns>\n      </StyledObjectLayout>\n    );\n  }\n);\n\nObjectLayout.displayName = \"ObjectLayout\";\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ObjectLayout/Styles.js

@@ -0,0 +1,83 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledTopBar = exports.StyledStream = exports.StyledSplit = exports.StyledRail = exports.StyledProperties = exports.StyledPartColumns = exports.StyledPart = exports.StyledPanelHandle = exports.StyledPanel = exports.StyledObjectLayout = exports.StyledMain = exports.StyledLeft = exports.StyledHeader = exports.StyledColumns = exports.StyledBand = exports.CONTAINER_CSS = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _ResizeHandle = require("../ResizeHandle");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var CONTAINER_CSS = exports.CONTAINER_CSS = "\n@container (min-width: 900px) {\n  .c-object-layout .c-object-layout__header,\n  .c-object-layout .c-object-layout__band {\n    position: sticky;\n    z-index: 6;\n    background-color: var(--surface-sheet);\n  }\n  .c-object-layout .c-object-layout__header { top: 0; }\n  .c-object-layout .c-object-layout__band { top: 41px; padding: 8px 32px 16px; }\n  .c-object-layout .c-object-layout__columns {\n    grid-template-columns: minmax(0, 1fr) 300px;\n    column-gap: 32px;\n    padding-top: 0;\n    padding-left: 32px;\n  }\n  .c-object-layout--single .c-object-layout__columns {\n    grid-template-columns: minmax(0, 1fr);\n    padding-right: 32px;\n  }\n  .c-object-layout .c-object-layout__left {\n    display: flex;\n    flex-direction: column;\n    align-self: stretch;\n    gap: 16px;\n    min-width: 0;\n    min-height: var(--opening-rail-height);\n  }\n  .c-object-layout .c-object-layout__rail { padding-bottom: 24px; }\n  .c-object-layout .c-object-layout__split {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) min(var(--panel-width), calc(100% - var(--main-min)));\n  }\n  .c-object-layout--own-scroll .c-object-layout__split { grid-template-rows: minmax(0, 1fr); }\n  .c-object-layout--own-scroll .c-object-layout__part { min-height: 0; overflow-y: auto; }\n  .c-object-layout .c-object-layout__part-columns { padding: 0 32px; }\n  .c-object-layout .c-object-layout__panel { padding: 0; }\n  .c-object-layout .c-object-layout__handle { display: block; }\n}\n@container (max-width: 899px) {\n  .c-object-layout .c-object-layout__columns { align-content: start; }\n  .c-object-layout--panel .c-object-layout__header { border-top-right-radius: inherit; }\n  .c-object-layout--own-scroll .c-object-layout__split { overflow-y: auto; }\n}\n";
+var StyledObjectLayout = exports.StyledObjectLayout = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledObjectLayout",
+  componentId: "sc-hmqt3m-0"
+})(["container-type:inline-size;display:flex;flex-direction:column;width:100%;", " border-radius:inherit;color:var(--color-theme-900);background-color:var(--surface-sheet);"], function (_ref) {
+  var $fill = _ref.$fill;
+  return $fill ? "height: 100%;" : "min-height: 100%;";
+});
+var StyledHeader = exports.StyledHeader = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledHeader",
+  componentId: "sc-hmqt3m-1"
+})(["border-top-left-radius:inherit;", ""], function (_ref2) {
+  var $panel = _ref2.$panel;
+  return !$panel && "border-top-right-radius: inherit;";
+});
+var StyledTopBar = exports.StyledTopBar = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledTopBar",
+  componentId: "sc-hmqt3m-2"
+})(["padding:9px 12px 0;"]);
+var StyledBand = exports.StyledBand = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledBand",
+  componentId: "sc-hmqt3m-3"
+})(["min-width:0;padding:16px 16px 0;"]);
+var StyledColumns = exports.StyledColumns = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledColumns",
+  componentId: "sc-hmqt3m-4"
+})(["display:grid;flex:1 1 0%;grid-template-columns:repeat(1,minmax(0,1fr));align-items:start;row-gap:24px;padding:16px 16px 0;"]);
+var StyledLeft = exports.StyledLeft = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledLeft",
+  componentId: "sc-hmqt3m-5"
+})(["display:contents;"]);
+var StyledMain = exports.StyledMain = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledMain",
+  componentId: "sc-hmqt3m-6"
+})(["order:1;display:flex;flex-direction:column;gap:24px;min-width:0;", ""], function (_ref3) {
+  var $padded = _ref3.$padded;
+  return $padded && "padding-bottom: 24px;";
+});
+var StyledStream = exports.StyledStream = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledStream",
+  componentId: "sc-hmqt3m-7"
+})(["display:contents;"]);
+var StyledRail = exports.StyledRail = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledRail",
+  componentId: "sc-hmqt3m-8"
+})(["order:2;display:flex;flex-direction:column;gap:16px;min-width:0;"]);
+var StyledSplit = exports.StyledSplit = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledSplit",
+  componentId: "sc-hmqt3m-9"
+})(["display:flex;flex:1 1 0%;flex-direction:column;", ""], function (_ref4) {
+  var $ownScroll = _ref4.$ownScroll;
+  return $ownScroll && "min-height: 0;";
+});
+var StyledPart = exports.StyledPart = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledPart",
+  componentId: "sc-hmqt3m-10"
+})(["display:flex;flex-direction:column;min-width:0;"]);
+var StyledPartColumns = exports.StyledPartColumns = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledPartColumns",
+  componentId: "sc-hmqt3m-11"
+})(["display:flex;flex-direction:column;gap:16px;min-width:0;padding:16px 16px 0;"]);
+var StyledProperties = exports.StyledProperties = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledProperties",
+  componentId: "sc-hmqt3m-12"
+})(["min-width:0;"]);
+var StyledPanel = exports.StyledPanel = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledPanel",
+  componentId: "sc-hmqt3m-13"
+})(["position:relative;min-width:0;padding:0 16px;"]);
+var StyledPanelHandle = exports.StyledPanelHandle = (0, _styledComponents.default)(_ResizeHandle.ResizeHandle).withConfig({
+  displayName: "Styles__StyledPanelHandle",
+  componentId: "sc-hmqt3m-14"
+})(["display:none;z-index:7;"]);
+//# sourceMappingURL=Styles.js.map

package/dist/cjs/components/ObjectLayout/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireDefault","require","_ResizeHandle","e","__esModule","default","CONTAINER_CSS","exports","StyledObjectLayout","styled","div","withConfig","displayName","componentId","_ref","$fill","StyledHeader","_ref2","$panel","StyledTopBar","StyledBand","StyledColumns","StyledLeft","StyledMain","_ref3","$padded","StyledStream","StyledRail","StyledSplit","_ref4","$ownScroll","StyledPart","StyledPartColumns","StyledProperties","StyledPanel","StyledPanelHandle","ResizeHandle"],"sources":["../../../../src/components/ObjectLayout/Styles.ts"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { ResizeHandle } from \"../ResizeHandle\";\n\nexport const CONTAINER_CSS = `\n@container (min-width: 900px) {\n  .c-object-layout .c-object-layout__header,\n  .c-object-layout .c-object-layout__band {\n    position: sticky;\n    z-index: 6;\n    background-color: var(--surface-sheet);\n  }\n  .c-object-layout .c-object-layout__header { top: 0; }\n  .c-object-layout .c-object-layout__band { top: 41px; padding: 8px 32px 16px; }\n  .c-object-layout .c-object-layout__columns {\n    grid-template-columns: minmax(0, 1fr) 300px;\n    column-gap: 32px;\n    padding-top: 0;\n    padding-left: 32px;\n  }\n  .c-object-layout--single .c-object-layout__columns {\n    grid-template-columns: minmax(0, 1fr);\n    padding-right: 32px;\n  }\n  .c-object-layout .c-object-layout__left {\n    display: flex;\n    flex-direction: column;\n    align-self: stretch;\n    gap: 16px;\n    min-width: 0;\n    min-height: var(--opening-rail-height);\n  }\n  .c-object-layout .c-object-layout__rail { padding-bottom: 24px; }\n  .c-object-layout .c-object-layout__split {\n    display: grid;\n    grid-template-columns: minmax(0, 1fr) min(var(--panel-width), calc(100% - var(--main-min)));\n  }\n  .c-object-layout--own-scroll .c-object-layout__split { grid-template-rows: minmax(0, 1fr); }\n  .c-object-layout--own-scroll .c-object-layout__part { min-height: 0; overflow-y: auto; }\n  .c-object-layout .c-object-layout__part-columns { padding: 0 32px; }\n  .c-object-layout .c-object-layout__panel { padding: 0; }\n  .c-object-layout .c-object-layout__handle { display: block; }\n}\n@container (max-width: 899px) {\n  .c-object-layout .c-object-layout__columns { align-content: start; }\n  .c-object-layout--panel .c-object-layout__header { border-top-right-radius: inherit; }\n  .c-object-layout--own-scroll .c-object-layout__split { overflow-y: auto; }\n}\n`;\n\nexport const StyledObjectLayout = styled.div<{ $fill: boolean }>`\n  container-type: inline-size;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  ${({ $fill }) => ($fill ? \"height: 100%;\" : \"min-height: 100%;\")}\n  border-radius: inherit;\n  color: var(--color-theme-900);\n  background-color: var(--surface-sheet);\n`;\n\nexport const StyledHeader = styled.div<{ $panel: boolean }>`\n  border-top-left-radius: inherit;\n  ${({ $panel }) => !$panel && \"border-top-right-radius: inherit;\"}\n`;\n\nexport const StyledTopBar = styled.div`\n  padding: 9px 12px 0;\n`;\n\nexport const StyledBand = styled.div`\n  min-width: 0;\n  padding: 16px 16px 0;\n`;\n\nexport const StyledColumns = styled.div`\n  display: grid;\n  flex: 1 1 0%;\n  grid-template-columns: repeat(1, minmax(0, 1fr));\n  align-items: start;\n  row-gap: 24px;\n  padding: 16px 16px 0;\n`;\n\nexport const StyledLeft = styled.div`\n  display: contents;\n`;\n\nexport const StyledMain = styled.div<{ $padded: boolean }>`\n  order: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  min-width: 0;\n  ${({ $padded }) => $padded && \"padding-bottom: 24px;\"}\n`;\n\nexport const StyledStream = styled.div`\n  display: contents;\n`;\n\nexport const StyledRail = styled.div`\n  order: 2;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  min-width: 0;\n`;\n\nexport const StyledSplit = styled.div<{ $ownScroll: boolean }>`\n  display: flex;\n  flex: 1 1 0%;\n  flex-direction: column;\n  ${({ $ownScroll }) => $ownScroll && \"min-height: 0;\"}\n`;\n\nexport const StyledPart = styled.div`\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n`;\n\nexport const StyledPartColumns = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  min-width: 0;\n  padding: 16px 16px 0;\n`;\n\nexport const StyledProperties = styled.div`\n  min-width: 0;\n`;\n\nexport const StyledPanel = styled.div`\n  position: relative;\n  min-width: 0;\n  padding: 0 16px;\n`;\n\nexport const StyledPanelHandle = styled(ResizeHandle)`\n  display: none;\n  z-index: 7;\n`;\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/ObjectLayout/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _ObjectLayout = require("./ObjectLayout");
+Object.keys(_ObjectLayout).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ObjectLayout[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ObjectLayout[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/ObjectLayout/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_ObjectLayout","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../../../src/components/ObjectLayout/index.ts"],"sourcesContent":["export * from \"./ObjectLayout\";\n"],"mappings":";;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,aAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,aAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,aAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/dist/cjs/components/ProgressBar/ProgressBar.js

@@ -11,7 +11,12 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var ProgressBar = exports.ProgressBar = function ProgressBar(_ref) {
   var _ref$progress = _ref.progress,
-    progress = _ref$progress === void 0 ? 0 : _ref$progress,
+    progressProp = _ref$progress === void 0 ? 0 : _ref$progress,
+    value = _ref.value,
+    limit = _ref.limit,
+    length = _ref.length,
+    _ref$rounded = _ref.rounded,
+    rounded = _ref$rounded === void 0 ? false : _ref$rounded,
     backgroundColor = _ref.backgroundColor,
     progressColor = _ref.progressColor,
     _ref$stroke = _ref.stroke,
@@ -19,6 +24,9 @@ var ProgressBar = exports.ProgressBar = function ProgressBar(_ref) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? 100 : _ref$width,
     className = _ref.className;
+  var hasLimit = typeof value === "number" && typeof limit === "number";
+  var isOver = hasLimit && value > limit;
+  var progress = hasLimit && limit > 0 ? value / limit * 100 : progressProp;
   var progressNumber = (0, _react.useMemo)(function () {
     var width = progress;
     if (progress > 100) {
@@ -49,14 +57,17 @@ var ProgressBar = exports.ProgressBar = function ProgressBar(_ref) {
   return /*#__PURE__*/_react.default.createElement(_Styles.StyledProgressBar, {
     className: (0, _classnames.default)("c-progress-bar", className),
     $color: backgroundColor,
-    $width: widthPercent
+    $width: widthPercent,
+    $length: length,
+    $rounded: rounded
   }, /*#__PURE__*/_react.default.createElement(_Styles.StyledProgressBarProgress, {
     className: "c-progress-bar__progress",
     style: {
       width: "".concat(progressNumber, "%")
     },
     $height: height,
-    $color: progressColor
+    $color: isOver ? "var(--red-alert)" : progressColor,
+    $rounded: rounded
   }));
 };
 ProgressBar.displayName = "ProgressBar";