@activecollab/components 1.0.91 → 1.0.92

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

@@ -0,0 +1,60 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledToastMessageText = exports.StyledToastMessage = exports.StyledCloseSmallIcon = void 0;
+
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _Icons = require("../Icons");
+
+var _BoxSizingStyle = require("../BoxSizingStyle");
+
+var _FontStyle = require("../FontStyle");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var StyledToastMessage = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledToastMessage",
+  componentId: "sc-7wr5ky-0"
+})(["display:flex;flex-direction:row;align-items:center;height:36px;width:fit-content;max-width:100%;padding:10px 8px 10px 16px;border-radius:18px;", " ", " ", " ", " ", " ", ""], _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, function (props) {
+  return props.$type === "error" && (0, _styledComponents.css)(["background-color:#f1a5a5;", ""], props.$dropShadow && (0, _styledComponents.css)(["box-shadow:0px 7px 12px -4px rgba(234,179,179,0.7);"]));
+}, function (props) {
+  return props.$type === "success" && (0, _styledComponents.css)(["background-color:#afdfdb;", ""], props.$dropShadow && (0, _styledComponents.css)(["box-shadow:0px 7px 12px -4px rgba(182,218,215,0.7);"]));
+}, function (props) {
+  return props.$type === "general" && (0, _styledComponents.css)(["background-color:#bddff6;", ""], props.$dropShadow && (0, _styledComponents.css)(["box-shadow:0px 7px 12px -4px rgba(166,199,220,0.7);"]));
+}, function (props) {
+  return props.$type === "warning" && (0, _styledComponents.css)(["background-color:#ffffd1;", ""], props.$dropShadow && (0, _styledComponents.css)(["box-shadow:0px 7px 12px -4px rgba(242,242,208,0.7);"]));
+});
+
+exports.StyledToastMessage = StyledToastMessage;
+
+var StyledToastMessageText = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledToastMessageText",
+  componentId: "sc-7wr5ky-1"
+})(["", " ", " ", " ", " color:rgba(48,48,55,0.65);"], {
+  "fontSize": "0.75rem"
+}, {
+  "fontWeight": "700"
+}, {
+  "overflow": "hidden",
+  "textOverflow": "ellipsis",
+  "whiteSpace": "nowrap"
+}, {
+  "marginRight": "0.5rem"
+});
+
+exports.StyledToastMessageText = StyledToastMessageText;
+var StyledCloseSmallIcon = (0, _styledComponents.default)(_Icons.CloseSmallIcon).withConfig({
+  displayName: "Styles__StyledCloseSmallIcon",
+  componentId: "sc-7wr5ky-2"
+})(["fill:rgba(48,48,55,0.3);flex-shrink:0;cursor:pointer;&:hover{fill:rgba(48,48,55,0.65);}"]);
+exports.StyledCloseSmallIcon = StyledCloseSmallIcon;
+StyledToastMessage.displayName = "StyledToastMessage";
+StyledCloseSmallIcon.displayName = "StyledCloseSmallIcon";
+//# sourceMappingURL=Styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ToastMessage/Styles.ts"],"names":["StyledToastMessage","styled","div","FontStyle","BoxSizingStyle","props","$type","css","$dropShadow","StyledToastMessageText","StyledCloseSmallIcon","CloseSmallIcon","displayName"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;;;;;AAOO,IAAMA,kBAAkB,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,oLAU3BC,oBAV2B,EAW3BC,8BAX2B,EAa3B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,OAAhB,QACAC,qBADA,qCAGIF,KAAK,CAACG,WAAN,QACFD,qBADE,0DAHJ,CADA;AAAA,CAb2B,EAuB3B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,SAAhB,QACAC,qBADA,qCAGIF,KAAK,CAACG,WAAN,QACFD,qBADE,0DAHJ,CADA;AAAA,CAvB2B,EAiC3B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,SAAhB,QACAC,qBADA,qCAGIF,KAAK,CAACG,WAAN,QACFD,qBADE,0DAHJ,CADA;AAAA,CAjC2B,EA2C3B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,SAAhB,QACAC,qBADA,qCAGIF,KAAK,CAACG,WAAN,QACFD,qBADE,0DAHJ,CADA;AAAA,CA3C2B,CAAxB;;;;AAsDA,IAAME,sBAAsB,GAAGR,0BAAOC,GAAV;AAAA;AAAA;AAAA,uDAC7B;AAAA;AAAA,CAD6B,EAE7B;AAAA;AAAA,CAF6B,EAG7B;AAAA;AAAA;AAAA;AAAA,CAH6B,EAI7B;AAAA;AAAA,CAJ6B,CAA5B;;;AAQA,IAAMQ,oBAAoB,GAAG,+BAAOC,qBAAP,CAAH;AAAA;AAAA;AAAA,+FAA1B;;AAUPX,kBAAkB,CAACY,WAAnB,GAAiC,oBAAjC;AACAF,oBAAoB,CAACE,WAArB,GAAmC,sBAAnC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\ninterface StyledToastMessageProps {\n  $type: \"error\" | \"success\" | \"general\" | \"warning\";\n  $dropShadow?: boolean;\n}\n\nexport const StyledToastMessage = styled.div<StyledToastMessageProps>`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  height: 36px;\n  width: fit-content;\n  max-width: 100%;\n  padding: 10px 8px 10px 16px;\n  border-radius: 18px;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  ${(props) =>\n    props.$type === \"error\" &&\n    css`\n      background-color: #f1a5a5;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(234, 179, 179, 0.7);\n      `}\n    `}\n\n  ${(props) =>\n    props.$type === \"success\" &&\n    css`\n      background-color: #afdfdb;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(182, 218, 215, 0.7);\n      `}\n    `}\n\n  ${(props) =>\n    props.$type === \"general\" &&\n    css`\n      background-color: #bddff6;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(166, 199, 220, 0.7);\n      `}\n    `}\n\n  ${(props) =>\n    props.$type === \"warning\" &&\n    css`\n      background-color: #ffffd1;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(242, 242, 208, 0.7);\n      `}\n    `}\n`;\n\nexport const StyledToastMessageText = styled.div`\n  ${tw`tw-text-caption-1`}\n  ${tw`tw-font-bold`}\n  ${tw`tw-truncate`}\n  ${tw`tw-mr-2`}\n  color: rgba(48, 48, 55, 0.65);\n`;\n\nexport const StyledCloseSmallIcon = styled(CloseSmallIcon)`\n  fill: rgba(48, 48, 55, 0.3);\n  flex-shrink: 0;\n  cursor: pointer;\n\n  &:hover {\n    fill: rgba(48, 48, 55, 0.65);\n  }\n`;\n\nStyledToastMessage.displayName = \"StyledToastMessage\";\nStyledCloseSmallIcon.displayName = \"StyledCloseSmallIcon\";\n"],"file":"Styles.js"}

package/dist/cjs/components/ToastMessage/ToastMessage.js

@@ -0,0 +1,51 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ToastMessage = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Styles = require("./Styles");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var ToastMessage = function ToastMessage(_ref) {
+  var text = _ref.text,
+      type = _ref.type,
+      onClose = _ref.onClose,
+      _ref$dismissable = _ref.dismissable,
+      dismissable = _ref$dismissable === void 0 ? false : _ref$dismissable,
+      _ref$dropShadow = _ref.dropShadow,
+      dropShadow = _ref$dropShadow === void 0 ? false : _ref$dropShadow,
+      _ref$timeout = _ref.timeout,
+      timeout = _ref$timeout === void 0 ? 0 : _ref$timeout;
+  var handleOnClose = (0, _react.useCallback)(function () {
+    if (typeof onClose === "function") {
+      onClose();
+    }
+  }, [onClose]);
+  (0, _react.useEffect)(function () {
+    if (timeout > 0) {
+      var timer = setTimeout(handleOnClose, timeout);
+      return function () {
+        return clearTimeout(timer);
+      };
+    }
+  }, [dismissable, timeout, handleOnClose]);
+  return /*#__PURE__*/_react.default.createElement(_Styles.StyledToastMessage, {
+    $type: type,
+    $dropShadow: dropShadow
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledToastMessageText, null, text), dismissable ? /*#__PURE__*/_react.default.createElement(_Styles.StyledCloseSmallIcon, {
+    onClick: handleOnClose
+  }) : null);
+};
+
+exports.ToastMessage = ToastMessage;
+ToastMessage.displayName = "ToastMessage";
+//# sourceMappingURL=ToastMessage.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ToastMessage/ToastMessage.tsx"],"names":["ToastMessage","text","type","onClose","dismissable","dropShadow","timeout","handleOnClose","timer","setTimeout","clearTimeout","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;;;;;AAeO,IAAMA,YAAY,GAAG,SAAfA,YAAe,OAOH;AAAA,MANvBC,IAMuB,QANvBA,IAMuB;AAAA,MALvBC,IAKuB,QALvBA,IAKuB;AAAA,MAJvBC,OAIuB,QAJvBA,OAIuB;AAAA,8BAHvBC,WAGuB;AAAA,MAHvBA,WAGuB,iCAHT,KAGS;AAAA,6BAFvBC,UAEuB;AAAA,MAFvBA,UAEuB,gCAFV,KAEU;AAAA,0BADvBC,OACuB;AAAA,MADvBA,OACuB,6BADb,CACa;AACvB,MAAMC,aAAa,GAAG,wBAAY,YAAM;AACtC,QAAI,OAAOJ,OAAP,KAAmB,UAAvB,EAAmC;AACjCA,MAAAA,OAAO;AACR;AACF,GAJqB,EAInB,CAACA,OAAD,CAJmB,CAAtB;AAMA,wBAAU,YAAM;AACd,QAAIG,OAAO,GAAG,CAAd,EAAiB;AACf,UAAME,KAAK,GAAGC,UAAU,CAACF,aAAD,EAAgBD,OAAhB,CAAxB;AAEA,aAAO;AAAA,eAAMI,YAAY,CAACF,KAAD,CAAlB;AAAA,OAAP;AACD;AACF,GAND,EAMG,CAACJ,WAAD,EAAcE,OAAd,EAAuBC,aAAvB,CANH;AAQA,sBACE,6BAAC,0BAAD;AAAoB,IAAA,KAAK,EAAEL,IAA3B;AAAiC,IAAA,WAAW,EAAEG;AAA9C,kBACE,6BAAC,8BAAD,QAAyBJ,IAAzB,CADF,EAEGG,WAAW,gBAAG,6BAAC,4BAAD;AAAsB,IAAA,OAAO,EAAEG;AAA/B,IAAH,GAAsD,IAFpE,CADF;AAMD,CA5BM;;;AA8BPP,YAAY,CAACW,WAAb,GAA2B,cAA3B","sourcesContent":["import React, { useEffect, useCallback } from \"react\";\nimport {\n  StyledToastMessage,\n  StyledToastMessageText,\n  StyledCloseSmallIcon,\n} from \"./Styles\";\n\nexport interface ToastMessageProps {\n  text: string;\n  type: \"error\" | \"success\" | \"general\" | \"warning\";\n  onClose?: () => void;\n  dismissable?: boolean;\n  dropShadow?: boolean;\n  timeout?: number;\n}\n\nexport const ToastMessage = ({\n  text,\n  type,\n  onClose,\n  dismissable = false,\n  dropShadow = false,\n  timeout = 0,\n}: ToastMessageProps) => {\n  const handleOnClose = useCallback(() => {\n    if (typeof onClose === \"function\") {\n      onClose();\n    }\n  }, [onClose]);\n\n  useEffect(() => {\n    if (timeout > 0) {\n      const timer = setTimeout(handleOnClose, timeout);\n\n      return () => clearTimeout(timer);\n    }\n  }, [dismissable, timeout, handleOnClose]);\n\n  return (\n    <StyledToastMessage $type={type} $dropShadow={dropShadow}>\n      <StyledToastMessageText>{text}</StyledToastMessageText>\n      {dismissable ? <StyledCloseSmallIcon onClick={handleOnClose} /> : null}\n    </StyledToastMessage>\n  );\n};\n\nToastMessage.displayName = \"ToastMessage\";\n"],"file":"ToastMessage.js"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ToastMessage/index.ts"],"names":[],"mappings":";;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from \"./ToastMessage\";\n"],"file":"index.js"}

package/dist/esm/components/ToastMessage/Styles.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+interface StyledToastMessageProps {
+    $type: "error" | "success" | "general" | "warning";
+    $dropShadow?: boolean;
+}
+export declare const StyledToastMessage: import("styled-components").StyledComponent<"div", any, StyledToastMessageProps, never>;
+export declare const StyledToastMessageText: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledCloseSmallIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Pick<import("react").SVGProps<SVGSVGElement>, "string" | "style" | "clipPath" | "filter" | "mask" | "path" | "key" | "name" | "type" | "className" | "id" | "lang" | "tabIndex" | "role" | "color" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tw" | "ideographic" | "alphabetic" | "hanging" | "mathematical" | "height" | "max" | "media" | "method" | "min" | "target" | "width" | "crossOrigin" | "accentHeight" | "accumulate" | "additive" | "alignmentBaseline" | "allowReorder" | "amplitude" | "arabicForm" | "ascent" | "attributeName" | "attributeType" | "autoReverse" | "azimuth" | "baseFrequency" | "baselineShift" | "baseProfile" | "bbox" | "begin" | "bias" | "by" | "calcMode" | "capHeight" | "clip" | "clipPathUnits" | "clipRule" | "colorInterpolation" | "colorInterpolationFilters" | "colorProfile" | "colorRendering" | "contentScriptType" | "contentStyleType" | "cursor" | "cx" | "cy" | "d" | "decelerate" | "descent" | "diffuseConstant" | "direction" | "display" | "divisor" | "dominantBaseline" | "dur" | "dx" | "dy" | "edgeMode" | "elevation" | "enableBackground" | "end" | "exponent" | "externalResourcesRequired" | "fill" | "fillOpacity" | "fillRule" | "filterRes" | "filterUnits" | "floodColor" | "floodOpacity" | "focusable" | "fontFamily" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "format" | "from" | "fx" | "fy" | "g1" | "g2" | "glyphName" | "glyphOrientationHorizontal" | "glyphOrientationVertical" | "glyphRef" | "gradientTransform" | "gradientUnits" | "horizAdvX" | "horizOriginX" | "href" | "imageRendering" | "in2" | "in" | "intercept" | "k1" | "k2" | "k3" | "k4" | "k" | "kernelMatrix" | "kernelUnitLength" | "kerning" | "keyPoints" | "keySplines" | "keyTimes" | "lengthAdjust" | "letterSpacing" | "lightingColor" | "limitingConeAngle" | "local" | "markerEnd" | "markerHeight" | "markerMid" | "markerStart" | "markerUnits" | "markerWidth" | "maskContentUnits" | "maskUnits" | "mode" | "numOctaves" | "offset" | "opacity" | "operator" | "order" | "orient" | "orientation" | "origin" | "overflow" | "overlinePosition" | "overlineThickness" | "paintOrder" | "panose1" | "pathLength" | "patternContentUnits" | "patternTransform" | "patternUnits" | "pointerEvents" | "points" | "pointsAtX" | "pointsAtY" | "pointsAtZ" | "preserveAlpha" | "preserveAspectRatio" | "primitiveUnits" | "r" | "radius" | "refX" | "refY" | "renderingIntent" | "repeatCount" | "repeatDur" | "requiredExtensions" | "requiredFeatures" | "restart" | "result" | "rotate" | "rx" | "ry" | "scale" | "seed" | "shapeRendering" | "slope" | "spacing" | "specularConstant" | "specularExponent" | "speed" | "spreadMethod" | "startOffset" | "stdDeviation" | "stemh" | "stemv" | "stitchTiles" | "stopColor" | "stopOpacity" | "strikethroughPosition" | "strikethroughThickness" | "stroke" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "surfaceScale" | "systemLanguage" | "tableValues" | "targetX" | "targetY" | "textAnchor" | "textDecoration" | "textLength" | "textRendering" | "to" | "transform" | "u1" | "u2" | "underlinePosition" | "underlineThickness" | "unicode" | "unicodeBidi" | "unicodeRange" | "unitsPerEm" | "vAlphabetic" | "values" | "vectorEffect" | "version" | "vertAdvY" | "vertOriginX" | "vertOriginY" | "vHanging" | "vIdeographic" | "viewBox" | "viewTarget" | "visibility" | "vMathematical" | "widths" | "wordSpacing" | "writingMode" | "x1" | "x2" | "x" | "xChannelSelector" | "xHeight" | "xlinkActuate" | "xlinkArcrole" | "xlinkHref" | "xlinkRole" | "xlinkShow" | "xlinkTitle" | "xlinkType" | "xmlBase" | "xmlLang" | "xmlns" | "xmlnsXlink" | "xmlSpace" | "y1" | "y2" | "y" | "yChannelSelector" | "z" | "zoomAndPan"> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
+export {};
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/ToastMessage/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/ToastMessage/Styles.ts"],"names":[],"mappings":";AAMA,UAAU,uBAAuB;IAC/B,KAAK,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;IACnD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,kBAAkB,yFAoD9B,CAAC;AAEF,eAAO,MAAM,sBAAsB,oEAMlC,CAAC;AAEF,eAAO,MAAM,oBAAoB,wqPAQhC,CAAC"}

package/dist/esm/components/ToastMessage/Styles.js

@@ -0,0 +1,37 @@
+import styled, { css } from "styled-components";
+import { CloseSmallIcon } from "../Icons";
+import { BoxSizingStyle } from "../BoxSizingStyle";
+import { FontStyle } from "../FontStyle";
+export var StyledToastMessage = styled.div.withConfig({
+  displayName: "Styles__StyledToastMessage",
+  componentId: "sc-7wr5ky-0"
+})(["display:flex;flex-direction:row;align-items:center;height:36px;width:fit-content;max-width:100%;padding:10px 8px 10px 16px;border-radius:18px;", " ", " ", " ", " ", " ", ""], FontStyle, BoxSizingStyle, function (props) {
+  return props.$type === "error" && css(["background-color:#f1a5a5;", ""], props.$dropShadow && css(["box-shadow:0px 7px 12px -4px rgba(234,179,179,0.7);"]));
+}, function (props) {
+  return props.$type === "success" && css(["background-color:#afdfdb;", ""], props.$dropShadow && css(["box-shadow:0px 7px 12px -4px rgba(182,218,215,0.7);"]));
+}, function (props) {
+  return props.$type === "general" && css(["background-color:#bddff6;", ""], props.$dropShadow && css(["box-shadow:0px 7px 12px -4px rgba(166,199,220,0.7);"]));
+}, function (props) {
+  return props.$type === "warning" && css(["background-color:#ffffd1;", ""], props.$dropShadow && css(["box-shadow:0px 7px 12px -4px rgba(242,242,208,0.7);"]));
+});
+export var StyledToastMessageText = styled.div.withConfig({
+  displayName: "Styles__StyledToastMessageText",
+  componentId: "sc-7wr5ky-1"
+})(["", " ", " ", " ", " color:rgba(48,48,55,0.65);"], {
+  "fontSize": "0.75rem"
+}, {
+  "fontWeight": "700"
+}, {
+  "overflow": "hidden",
+  "textOverflow": "ellipsis",
+  "whiteSpace": "nowrap"
+}, {
+  "marginRight": "0.5rem"
+});
+export var StyledCloseSmallIcon = styled(CloseSmallIcon).withConfig({
+  displayName: "Styles__StyledCloseSmallIcon",
+  componentId: "sc-7wr5ky-2"
+})(["fill:rgba(48,48,55,0.3);flex-shrink:0;cursor:pointer;&:hover{fill:rgba(48,48,55,0.65);}"]);
+StyledToastMessage.displayName = "StyledToastMessage";
+StyledCloseSmallIcon.displayName = "StyledCloseSmallIcon";
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/ToastMessage/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ToastMessage/Styles.ts"],"names":["styled","css","CloseSmallIcon","BoxSizingStyle","FontStyle","StyledToastMessage","div","props","$type","$dropShadow","StyledToastMessageText","StyledCloseSmallIcon","displayName"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,cAAT,QAA+B,UAA/B;AACA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAOA,OAAO,IAAMC,kBAAkB,GAAGL,MAAM,CAACM,GAAV;AAAA;AAAA;AAAA,oLAU3BF,SAV2B,EAW3BD,cAX2B,EAa3B,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,OAAhB,IACAP,GADA,oCAGIM,KAAK,CAACE,WAAN,IACFR,GADE,yDAHJ,CADA;AAAA,CAb2B,EAuB3B,UAACM,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,SAAhB,IACAP,GADA,oCAGIM,KAAK,CAACE,WAAN,IACFR,GADE,yDAHJ,CADA;AAAA,CAvB2B,EAiC3B,UAACM,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,SAAhB,IACAP,GADA,oCAGIM,KAAK,CAACE,WAAN,IACFR,GADE,yDAHJ,CADA;AAAA,CAjC2B,EA2C3B,UAACM,KAAD;AAAA,SACAA,KAAK,CAACC,KAAN,KAAgB,SAAhB,IACAP,GADA,oCAGIM,KAAK,CAACE,WAAN,IACFR,GADE,yDAHJ,CADA;AAAA,CA3C2B,CAAxB;AAsDP,OAAO,IAAMS,sBAAsB,GAAGV,MAAM,CAACM,GAAV;AAAA;AAAA;AAAA,uDAC7B;AAAA;AAAA,CAD6B,EAE7B;AAAA;AAAA,CAF6B,EAG7B;AAAA;AAAA;AAAA;AAAA,CAH6B,EAI7B;AAAA;AAAA,CAJ6B,CAA5B;AAQP,OAAO,IAAMK,oBAAoB,GAAGX,MAAM,CAACE,cAAD,CAAT;AAAA;AAAA;AAAA,+FAA1B;AAUPG,kBAAkB,CAACO,WAAnB,GAAiC,oBAAjC;AACAD,oBAAoB,CAACC,WAArB,GAAmC,sBAAnC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\ninterface StyledToastMessageProps {\n  $type: \"error\" | \"success\" | \"general\" | \"warning\";\n  $dropShadow?: boolean;\n}\n\nexport const StyledToastMessage = styled.div<StyledToastMessageProps>`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  height: 36px;\n  width: fit-content;\n  max-width: 100%;\n  padding: 10px 8px 10px 16px;\n  border-radius: 18px;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  ${(props) =>\n    props.$type === \"error\" &&\n    css`\n      background-color: #f1a5a5;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(234, 179, 179, 0.7);\n      `}\n    `}\n\n  ${(props) =>\n    props.$type === \"success\" &&\n    css`\n      background-color: #afdfdb;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(182, 218, 215, 0.7);\n      `}\n    `}\n\n  ${(props) =>\n    props.$type === \"general\" &&\n    css`\n      background-color: #bddff6;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(166, 199, 220, 0.7);\n      `}\n    `}\n\n  ${(props) =>\n    props.$type === \"warning\" &&\n    css`\n      background-color: #ffffd1;\n      ${props.$dropShadow &&\n      css`\n        box-shadow: 0px 7px 12px -4px rgba(242, 242, 208, 0.7);\n      `}\n    `}\n`;\n\nexport const StyledToastMessageText = styled.div`\n  ${tw`tw-text-caption-1`}\n  ${tw`tw-font-bold`}\n  ${tw`tw-truncate`}\n  ${tw`tw-mr-2`}\n  color: rgba(48, 48, 55, 0.65);\n`;\n\nexport const StyledCloseSmallIcon = styled(CloseSmallIcon)`\n  fill: rgba(48, 48, 55, 0.3);\n  flex-shrink: 0;\n  cursor: pointer;\n\n  &:hover {\n    fill: rgba(48, 48, 55, 0.65);\n  }\n`;\n\nStyledToastMessage.displayName = \"StyledToastMessage\";\nStyledCloseSmallIcon.displayName = \"StyledCloseSmallIcon\";\n"],"file":"Styles.js"}

package/dist/esm/components/ToastMessage/ToastMessage.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+export interface ToastMessageProps {
+    text: string;
+    type: "error" | "success" | "general" | "warning";
+    onClose?: () => void;
+    dismissable?: boolean;
+    dropShadow?: boolean;
+    timeout?: number;
+}
+export declare const ToastMessage: {
+    ({ text, type, onClose, dismissable, dropShadow, timeout, }: ToastMessageProps): JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=ToastMessage.d.ts.map

package/dist/esm/components/ToastMessage/ToastMessage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastMessage.d.ts","sourceRoot":"","sources":["../../../../src/components/ToastMessage/ToastMessage.tsx"],"names":[],"mappings":";AAOA,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;IAClD,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,YAAY;iEAOtB,iBAAiB;;CAqBnB,CAAC"}

package/dist/esm/components/ToastMessage/ToastMessage.js

@@ -0,0 +1,34 @@
+import React, { useEffect, useCallback } from "react";
+import { StyledToastMessage, StyledToastMessageText, StyledCloseSmallIcon } from "./Styles";
+export var ToastMessage = function ToastMessage(_ref) {
+  var text = _ref.text,
+      type = _ref.type,
+      onClose = _ref.onClose,
+      _ref$dismissable = _ref.dismissable,
+      dismissable = _ref$dismissable === void 0 ? false : _ref$dismissable,
+      _ref$dropShadow = _ref.dropShadow,
+      dropShadow = _ref$dropShadow === void 0 ? false : _ref$dropShadow,
+      _ref$timeout = _ref.timeout,
+      timeout = _ref$timeout === void 0 ? 0 : _ref$timeout;
+  var handleOnClose = useCallback(function () {
+    if (typeof onClose === "function") {
+      onClose();
+    }
+  }, [onClose]);
+  useEffect(function () {
+    if (timeout > 0) {
+      var timer = setTimeout(handleOnClose, timeout);
+      return function () {
+        return clearTimeout(timer);
+      };
+    }
+  }, [dismissable, timeout, handleOnClose]);
+  return /*#__PURE__*/React.createElement(StyledToastMessage, {
+    $type: type,
+    $dropShadow: dropShadow
+  }, /*#__PURE__*/React.createElement(StyledToastMessageText, null, text), dismissable ? /*#__PURE__*/React.createElement(StyledCloseSmallIcon, {
+    onClick: handleOnClose
+  }) : null);
+};
+ToastMessage.displayName = "ToastMessage";
+//# sourceMappingURL=ToastMessage.js.map

package/dist/esm/components/ToastMessage/ToastMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ToastMessage/ToastMessage.tsx"],"names":["React","useEffect","useCallback","StyledToastMessage","StyledToastMessageText","StyledCloseSmallIcon","ToastMessage","text","type","onClose","dismissable","dropShadow","timeout","handleOnClose","timer","setTimeout","clearTimeout","displayName"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,SAAhB,EAA2BC,WAA3B,QAA8C,OAA9C;AACA,SACEC,kBADF,EAEEC,sBAFF,EAGEC,oBAHF,QAIO,UAJP;AAeA,OAAO,IAAMC,YAAY,GAAG,SAAfA,YAAe,OAOH;AAAA,MANvBC,IAMuB,QANvBA,IAMuB;AAAA,MALvBC,IAKuB,QALvBA,IAKuB;AAAA,MAJvBC,OAIuB,QAJvBA,OAIuB;AAAA,8BAHvBC,WAGuB;AAAA,MAHvBA,WAGuB,iCAHT,KAGS;AAAA,6BAFvBC,UAEuB;AAAA,MAFvBA,UAEuB,gCAFV,KAEU;AAAA,0BADvBC,OACuB;AAAA,MADvBA,OACuB,6BADb,CACa;AACvB,MAAMC,aAAa,GAAGX,WAAW,CAAC,YAAM;AACtC,QAAI,OAAOO,OAAP,KAAmB,UAAvB,EAAmC;AACjCA,MAAAA,OAAO;AACR;AACF,GAJgC,EAI9B,CAACA,OAAD,CAJ8B,CAAjC;AAMAR,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIW,OAAO,GAAG,CAAd,EAAiB;AACf,UAAME,KAAK,GAAGC,UAAU,CAACF,aAAD,EAAgBD,OAAhB,CAAxB;AAEA,aAAO;AAAA,eAAMI,YAAY,CAACF,KAAD,CAAlB;AAAA,OAAP;AACD;AACF,GANQ,EAMN,CAACJ,WAAD,EAAcE,OAAd,EAAuBC,aAAvB,CANM,CAAT;AAQA,sBACE,oBAAC,kBAAD;AAAoB,IAAA,KAAK,EAAEL,IAA3B;AAAiC,IAAA,WAAW,EAAEG;AAA9C,kBACE,oBAAC,sBAAD,QAAyBJ,IAAzB,CADF,EAEGG,WAAW,gBAAG,oBAAC,oBAAD;AAAsB,IAAA,OAAO,EAAEG;AAA/B,IAAH,GAAsD,IAFpE,CADF;AAMD,CA5BM;AA8BPP,YAAY,CAACW,WAAb,GAA2B,cAA3B","sourcesContent":["import React, { useEffect, useCallback } from \"react\";\nimport {\n  StyledToastMessage,\n  StyledToastMessageText,\n  StyledCloseSmallIcon,\n} from \"./Styles\";\n\nexport interface ToastMessageProps {\n  text: string;\n  type: \"error\" | \"success\" | \"general\" | \"warning\";\n  onClose?: () => void;\n  dismissable?: boolean;\n  dropShadow?: boolean;\n  timeout?: number;\n}\n\nexport const ToastMessage = ({\n  text,\n  type,\n  onClose,\n  dismissable = false,\n  dropShadow = false,\n  timeout = 0,\n}: ToastMessageProps) => {\n  const handleOnClose = useCallback(() => {\n    if (typeof onClose === \"function\") {\n      onClose();\n    }\n  }, [onClose]);\n\n  useEffect(() => {\n    if (timeout > 0) {\n      const timer = setTimeout(handleOnClose, timeout);\n\n      return () => clearTimeout(timer);\n    }\n  }, [dismissable, timeout, handleOnClose]);\n\n  return (\n    <StyledToastMessage $type={type} $dropShadow={dropShadow}>\n      <StyledToastMessageText>{text}</StyledToastMessageText>\n      {dismissable ? <StyledCloseSmallIcon onClick={handleOnClose} /> : null}\n    </StyledToastMessage>\n  );\n};\n\nToastMessage.displayName = \"ToastMessage\";\n"],"file":"ToastMessage.js"}

package/dist/esm/components/ToastMessage/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./ToastMessage";
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/ToastMessage/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ToastMessage/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/dist/esm/components/ToastMessage/index.js

@@ -0,0 +1,2 @@
+export * from "./ToastMessage";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/ToastMessage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/ToastMessage/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAd","sourcesContent":["export * from \"./ToastMessage\";\n"],"file":"index.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@activecollab/components",
-  "version": "1.0.91",
+  "version": "1.0.92",
   "description": "ActiveCollab Components",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",