npm - @activecollab/components - Versions diffs - 1.0.205 → 1.0.207 - Mend

@activecollab/components 1.0.205 → 1.0.207

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1562) hide show

package/dist/esm/components/SelectTrigger/SelectTrigger.js CHANGED Viewed

@@ -6,17 +6,16 @@ import { Typography } from "../Typography/Typography";
 import { StyledCaretIcon, StyledSelectTrigger } from "./Styles";
 export var SelectTrigger = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var children = _ref.children,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? "button" : _ref$type,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? "regular" : _ref$size,
-      _ref$invalid = _ref.invalid,
-      invalid = _ref$invalid === void 0 ? false : _ref$invalid,
-      _ref$open = _ref.open,
-      open = _ref$open === void 0 ? false : _ref$open,
-      endAdornment = _ref.endAdornment,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? "button" : _ref$type,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "regular" : _ref$size,
+    _ref$invalid = _ref.invalid,
+    invalid = _ref$invalid === void 0 ? false : _ref$invalid,
+    _ref$open = _ref.open,
+    open = _ref$open === void 0 ? false : _ref$open,
+    endAdornment = _ref.endAdornment,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
   return /*#__PURE__*/React.createElement(StyledSelectTrigger, _extends({
     ref: ref,
     role: "button",

package/dist/esm/components/SelectTrigger/SelectTrigger.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~../../../../src/components/~~SelectTrigger~~/SelectTrigger~~.~~tsx~~"],"names":["React","forwardRef","Typography","StyledCaretIcon","StyledSelectTrigger","SelectTrigger","ref","children","type","size","invalid","open","endAdornment","rest","displayName"],"~~mappings~~":";;;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAA4D,OAA5D;AACA,SAASC,UAAT,QAA2B,0BAA3B;AACA,SAASC,eAAT,EAA0BC,mBAA1B,QAAqD,UAArD;AAWA,OAAO,IAAMC,aAAa,gBAAGJ,UAAU,CACrC,gBAUEK,GAVF,EAWK;AAAA,MATDC,QASC,QATDA,QASC;AAAA,uBARDC,IAQC;AAAA,MARDA,IAQC,0BARM,QAQN;AAAA,uBAPDC,IAOC;AAAA,MAPDA,IAOC,0BAPM,SAON;AAAA,0BANDC,OAMC;AAAA,MANDA,OAMC,6BANS,KAMT;AAAA,uBALDC,IAKC;AAAA,MALDA,IAKC,0BALM,KAKN;AAAA,MAJDC,YAIC,QAJDA,YAIC;AAAA,MAHEC,IAGF;;AACH,sBACE,oBAAC,mBAAD;AACE,IAAA,GAAG,EAAEP,GADP;AAEE,IAAA,IAAI,EAAC,QAFP;AAGE,IAAA,IAAI,EAAEE,IAHR;AAIE,IAAA,KAAK,EAAEC,IAJT;AAKE,IAAA,QAAQ,EAAEC;AALZ,KAMMG,IANN,gBAQE,oBAAC,UAAD;AACE,IAAA,EAAE,EAAC,KADL;AAEE,IAAA,QAAQ,EAAC,UAFX;AAGE,IAAA,UAAU,EAAC,SAHb;AAIE,IAAA,OAAO,EAAEJ,IAAI,KAAK,OAAT,IAAoBA,IAAI,KAAK,SAA7B,GAAyC,QAAzC,GAAoD;AAJ/~~D,KAMGF,QANH,CARF,EAiBGK,YAAY,GAAGA,YAAH,gBAAkB,oBAAC,eAAD;AAAiB,IAAA,KAAK,EAAED;AAAxB,IAjBjC,CADF;AAqBD,CAlCoC,CAAhC;AAqCPN,aAAa,CAACS,WAAd,GAA4B,eAA5B~~","sourcesContent":["import React, { forwardRef, ComponentPropsWithoutRef } from \"react\";\nimport { Typography } from \"../Typography/Typography\";\nimport { StyledCaretIcon, StyledSelectTrigger } from \"./Styles\";\n\nexport type Size = \"regular\" \| \"big\" \| \"small\";\n\nexport interface SelectTriggerProps extends ComponentPropsWithoutRef<\"button\"> {\n size?: Size;\n invalid?: boolean;\n endAdornment?: JSX.Element;\n open?: boolean;\n}\n\nexport const SelectTrigger = forwardRef<HTMLButtonElement, SelectTriggerProps>(\n (\n {\n children,\n type = \"button\",\n size = \"regular\",\n invalid = false,\n open = false,\n endAdornment,\n ...rest\n },\n ref\n ) => {\n return (\n <StyledSelectTrigger\n ref={ref}\n role=\"button\"\n type={type}\n $size={size}\n $invalid={invalid}\n {...rest}\n >\n <Typography\n as=\"div\"\n overflow=\"truncate\"\n whitespace=\"no-wrap\"\n variant={size === \"small\" \|\| size === \"regular\" ? \"Body 2\" : \"Body 1\"}\n >\n {children}\n </Typography>\n\n {endAdornment ? endAdornment : <StyledCaretIcon $open={open} />}\n </StyledSelectTrigger>\n );\n }\n);\n\nSelectTrigger.displayName = \"SelectTrigger\";\n"],"~~file~~":"~~SelectTrigger.js~~"}
1	+ {"version":3,"file":"SelectTrigger.js","names":["React","forwardRef","Typography","StyledCaretIcon","StyledSelectTrigger","SelectTrigger","ref","children","type","size","invalid","open","endAdornment","rest","displayName"],"sources":["../../../../src/components/SelectTrigger/SelectTrigger.tsx"],"sourcesContent":["import React, { forwardRef, ComponentPropsWithoutRef } from \"react\";\nimport { Typography } from \"../Typography/Typography\";\nimport { StyledCaretIcon, StyledSelectTrigger } from \"./Styles\";\n\nexport type Size = \"regular\" \| \"big\" \| \"small\";\n\nexport interface SelectTriggerProps extends ComponentPropsWithoutRef<\"button\"> {\n size?: Size;\n invalid?: boolean;\n endAdornment?: JSX.Element;\n open?: boolean;\n}\n\nexport const SelectTrigger = forwardRef<HTMLButtonElement, SelectTriggerProps>(\n (\n {\n children,\n type = \"button\",\n size = \"regular\",\n invalid = false,\n open = false,\n endAdornment,\n ...rest\n },\n ref\n ) => {\n return (\n <StyledSelectTrigger\n ref={ref}\n role=\"button\"\n type={type}\n $size={size}\n $invalid={invalid}\n {...rest}\n >\n <Typography\n as=\"div\"\n overflow=\"truncate\"\n whitespace=\"no-wrap\"\n variant={size === \"small\" \|\| size === \"regular\" ? \"Body 2\" : \"Body 1\"}\n >\n {children}\n </Typography>\n\n {endAdornment ? endAdornment : <StyledCaretIcon $open={open} />}\n </StyledSelectTrigger>\n );\n }\n);\n\nSelectTrigger.displayName = \"SelectTrigger\";\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAkC,OAAO;AACnE,SAASC,UAAU,QAAQ,0BAA0B;AACrD,SAASC,eAAe,EAAEC,mBAAmB,QAAQ,UAAU;AAW/D,OAAO,IAAMC,aAAa,gBAAGJ,UAAU,CACrC,gBAUEK,GAAG,EACA;EAAA,IATDC,QAAQ,QAARA,QAAQ;IAAA,iBACRC,IAAI;IAAJA,IAAI,0BAAG,QAAQ;IAAA,iBACfC,IAAI;IAAJA,IAAI,0BAAG,SAAS;IAAA,oBAChBC,OAAO;IAAPA,OAAO,6BAAG,KAAK;IAAA,iBACfC,IAAI;IAAJA,IAAI,0BAAG,KAAK;IACZC,YAAY,QAAZA,YAAY;IACTC,IAAI;EAIT,oBACE,oBAAC,mBAAmB;IAClB,GAAG,EAAEP,GAAI;IACT,IAAI,EAAC,QAAQ;IACb,IAAI,EAAEE,IAAK;IACX,KAAK,EAAEC,IAAK;IACZ,QAAQ,EAAEC;EAAQ,GACdG,IAAI,gBAER,oBAAC,UAAU;IACT,EAAE,EAAC,KAAK;IACR,QAAQ,EAAC,UAAU;IACnB,UAAU,EAAC,SAAS;IACpB,OAAO,EAAEJ,IAAI,KAAK,OAAO,IAAIA,IAAI,KAAK,SAAS,GAAG,QAAQ,GAAG;EAAS,GAErEF,QAAQ,CACE,EAEZK,YAAY,GAAGA,YAAY,gBAAG,oBAAC,eAAe;IAAC,KAAK,EAAED;EAAK,EAAG,CAC3C;AAE1B,CAAC,CACF;AAEDN,aAAa,CAACS,WAAW,GAAG,eAAe"}

package/dist/esm/components/SelectTrigger/Styles.js CHANGED Viewed

@@ -4,12 +4,12 @@ import { Trigger } from "../Trigger";
 export var StyledSelectTrigger = styled(Trigger).withConfig({
   displayName: "Styles__StyledSelectTrigger",
   componentId: "sc-9799p2-0"
-})(["display:flex;align-items:center;justify-content:space-between;border:1px solid var(--color-theme-500);padding:0 8px;width:300px;transition:border-color 0.3s ease;background-color:var(--input-background-color);", " ", " ", " ", " ", " ", ";"], function (_ref) {
+})(["display:flex;align-items:center;justify-content:space-between;border:1px solid var(--color-theme-500);padding:0 4px 0 8px;width:300px;transition:border-color 0.3s ease;background-color:var(--input-background-color);", " ", " ", " ", " ", " ", ";"], function (_ref) {
   var disabled = _ref.disabled;
   return disabled && css(["opacity:50%;cursor:default;"]);
 }, function (_ref2) {
   var $invalid = _ref2.$invalid,
-      disabled = _ref2.disabled;
+    disabled = _ref2.disabled;
   return !$invalid && !disabled && css(["&:hover,&:focus{border-color:var(--color-primary-700);}"]);
 }, function (_ref3) {
   var $invalid = _ref3.$invalid;

package/dist/esm/components/SelectTrigger/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~../../../../src/components/SelectTrigger/~~Styles.ts"],"names":["styled","css","CollapseExpandSingleIcon","Trigger","StyledSelectTrigger","disabled","$invalid","$size","displayName","StyledCaretIcon","$open"],"~~mappings~~":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,wBAAT,QAAyC,UAAzC;AACA,SAASC,OAAT,QAAwB,YAAxB;AAGA,OAAO,IAAMC,mBAAmB,GAAGJ,MAAM,CAACG,OAAD,CAAT;AAAA;AAAA;AAAA,wPAa5B;AAAA,MAAGE,QAAH,QAAGA,QAAH;AAAA,SACAA,QAAQ,IACRJ,GADQ,iCADR;AAAA,CAb4B,EAoB5B;AAAA,MAAGK,QAAH,SAAGA,QAAH;AAAA,MAAaD,QAAb,SAAaA,QAAb;AAAA,SACA,CAACC,QAAD,IACA,CAACD,QADD,IAEAJ,GAFA,6DADA;AAAA,CApB4B,EA8B5B;AAAA,MAAGK,QAAH,SAAGA,QAAH;AAAA,SACAA,QAAQ,IACRL,GADQ,yBAEF;AAAA;AAAA,GAFE,EAKA;AAAA;AAAA,GALA,CADR;AAAA,CA9B4B,EAwC5B;AAAA,MAAGM,KAAH,SAAGA,KAAH;AAAA,SACAA,KAAK,KAAK,OAAV,IACAN,GADA,+CADA;AAAA,CAxC4B,EA+C5B;AAAA,MAAGM,KAAH,SAAGA,KAAH;AAAA,SACAA,KAAK,KAAK,SAAV,IACAN,GADA,+CADA;AAAA,CA/C4B,EAsD1B;AAAA,MAAGM,KAAH,SAAGA,KAAH;AAAA,SACFA,KAAK,KAAK,KAAV,IACAN,GADA,+CADE;AAAA,CAtD0B,CAAzB;AA8DPG,mBAAmB,CAACI,WAApB,GAAkC,qBAAlC;AAEA,OAAO,IAAMC,eAAe,GAAGT,MAAM,CAACE,wBAAD,CAAT;AAAA;AAAA;AAAA,2EAOxB;AAAA,MAAGQ,KAAH,SAAGA,KAAH;AAAA,SACA,CAACA,KAAD,IACAT,GADA,+BADA;AAAA,CAPwB,CAArB;AAcPQ,eAAe,CAACD,WAAhB,GAA8B,iBAA9B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CollapseExpandSingleIcon } from \"../Icons\";\nimport { Trigger } from \"../Trigger\";\nimport { Size } from \"./SelectTrigger\";\n\nexport const StyledSelectTrigger = styled(Trigger)<{\n $size?: Size;\n $invalid?: boolean;\n}>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n border: 1px solid var(--color-theme-500);\n padding: 0 8px;\n width: 300px;\n transition: border-color 0.3s ease;\n background-color: var(--input-background-color);\n\n ${({ disabled }) =>\n disabled &&\n css`\n opacity: 50%;\n cursor: default;\n `}\n\n ${({ $invalid, disabled }) =>\n !$invalid &&\n !disabled &&\n css`\n &:hover,\n &:focus {\n border-color: var(--color-primary-700);\n }\n `}\n\n ${({ $invalid }) =>\n $invalid &&\n css`\n ${tw`tw-border-alert`}\n\n &:hover {\n ${tw`tw-border-alert`}\n }\n `}\n\n ${({ $size }) =>\n $size === \"small\" &&\n css`\n height: 24px;\n border-radius: var(--ac-br-6);\n `}\n\n ${({ $size }) =>\n $size === \"regular\" &&\n css`\n height: 32px;\n border-radius: var(--ac-br-8);\n `}\n\n ${({ $size }) =>\n $size === \"big\" &&\n css`\n height: 40px;\n border-radius: var(--ac-br-8);\n `};\n`;\n\nStyledSelectTrigger.displayName = \"StyledSelectTrigger\";\n\nexport const StyledCaretIcon = styled(CollapseExpandSingleIcon)<{\n $open: boolean;\n}>`\n margin-left: 8px;\n flex-shrink: 0;\n transition: transform 200ms ease;\n\n ${({ $open }) =>\n !$open &&\n css`\n transform: rotate(180deg);\n `}\n`;\n\nStyledCaretIcon.displayName = \"StyledCaretIcon\";\n"],"~~file~~":"~~Styles.js~~"}
1	+ {"version":3,"file":"Styles.js","names":["styled","css","CollapseExpandSingleIcon","Trigger","StyledSelectTrigger","disabled","$invalid","$size","displayName","StyledCaretIcon","$open"],"sources":["../../../../src/components/SelectTrigger/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CollapseExpandSingleIcon } from \"../Icons\";\nimport { Trigger } from \"../Trigger\";\nimport { Size } from \"./SelectTrigger\";\n\nexport const StyledSelectTrigger = styled(Trigger)<{\n $size?: Size;\n $invalid?: boolean;\n}>`\n display: flex;\n align-items: center;\n justify-content: space-between;\n border: 1px solid var(--color-theme-500);\n padding: 0 4px 0 8px;\n width: 300px;\n transition: border-color 0.3s ease;\n background-color: var(--input-background-color);\n\n ${({ disabled }) =>\n disabled &&\n css`\n opacity: 50%;\n cursor: default;\n `}\n\n ${({ $invalid, disabled }) =>\n !$invalid &&\n !disabled &&\n css`\n &:hover,\n &:focus {\n border-color: var(--color-primary-700);\n }\n `}\n\n ${({ $invalid }) =>\n $invalid &&\n css`\n ${tw`tw-border-alert`}\n\n &:hover {\n ${tw`tw-border-alert`}\n }\n `}\n\n ${({ $size }) =>\n $size === \"small\" &&\n css`\n height: 24px;\n border-radius: var(--ac-br-6);\n `}\n\n ${({ $size }) =>\n $size === \"regular\" &&\n css`\n height: 32px;\n border-radius: var(--ac-br-8);\n `}\n\n ${({ $size }) =>\n $size === \"big\" &&\n css`\n height: 40px;\n border-radius: var(--ac-br-8);\n `};\n`;\n\nStyledSelectTrigger.displayName = \"StyledSelectTrigger\";\n\nexport const StyledCaretIcon = styled(CollapseExpandSingleIcon)<{\n $open: boolean;\n}>`\n margin-left: 8px;\n flex-shrink: 0;\n transition: transform 200ms ease;\n\n ${({ $open }) =>\n !$open &&\n css`\n transform: rotate(180deg);\n `}\n`;\n\nStyledCaretIcon.displayName = \"StyledCaretIcon\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,wBAAwB,QAAQ,UAAU;AACnD,SAASC,OAAO,QAAQ,YAAY;AAGpC,OAAO,IAAMC,mBAAmB,GAAGJ,MAAM,CAACG,OAAO,CAAC;EAAA;EAAA;AAAA,8PAa9C;EAAA,IAAGE,QAAQ,QAARA,QAAQ;EAAA,OACXA,QAAQ,IACRJ,GAAG,iCAGF;AAAA,GAED;EAAA,IAAGK,QAAQ,SAARA,QAAQ;IAAED,QAAQ,SAARA,QAAQ;EAAA,OACrB,CAACC,QAAQ,IACT,CAACD,QAAQ,IACTJ,GAAG,6DAKF;AAAA,GAED;EAAA,IAAGK,QAAQ,SAARA,QAAQ;EAAA,OACXA,QAAQ,IACRL,GAAG,yBACG;IAAA;EAAgB,CAAC,EAGf;IAAA;EAAgB,CAAC,CAExB;AAAA,GAED;EAAA,IAAGM,KAAK,SAALA,KAAK;EAAA,OACRA,KAAK,KAAK,OAAO,IACjBN,GAAG,+CAGF;AAAA,GAED;EAAA,IAAGM,KAAK,SAALA,KAAK;EAAA,OACRA,KAAK,KAAK,SAAS,IACnBN,GAAG,+CAGF;AAAA,GAEC;EAAA,IAAGM,KAAK,SAALA,KAAK;EAAA,OACVA,KAAK,KAAK,KAAK,IACfN,GAAG,+CAGF;AAAA,EACJ;AAEDG,mBAAmB,CAACI,WAAW,GAAG,qBAAqB;AAEvD,OAAO,IAAMC,eAAe,GAAGT,MAAM,CAACE,wBAAwB,CAAC;EAAA;EAAA;AAAA,2EAO3D;EAAA,IAAGQ,KAAK,SAALA,KAAK;EAAA,OACR,CAACA,KAAK,IACNT,GAAG,+BAEF;AAAA,EACJ;AAEDQ,eAAe,CAACD,WAAW,GAAG,iBAAiB"}

package/dist/esm/components/SelectTrigger/index.js.map CHANGED Viewed

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

package/dist/esm/components/Sheet/Sheet.js CHANGED Viewed

@@ -10,37 +10,34 @@ import { StyledAnimatedSpan, StyledCssTransition, StyledSheetIcons, StyledSheetW
 import { Overlay } from "../Overlay";
 export var Sheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var children = _ref.children,
-      onClose = _ref.onClose,
-      _ref$controls = _ref.controls,
-      controls = _ref$controls === void 0 ? [] : _ref$controls,
-      _ref$open = _ref.open,
-      defaultOpen = _ref$open === void 0 ? false : _ref$open,
-      _ref$animation = _ref.animation,
-      animation = _ref$animation === void 0 ? "top" : _ref$animation,
-      _ref$position = _ref.position,
-      position = _ref$position === void 0 ? "center" : _ref$position,
-      _ref$mode = _ref.mode,
-      mode = _ref$mode === void 0 ? "normal" : _ref$mode,
-      _ref$disableFocusLock = _ref.disableFocusLock,
-      disableFocusLock = _ref$disableFocusLock === void 0 ? false : _ref$disableFocusLock,
-      _ref$disableScrollLoc = _ref.disableScrollLock,
-      disableScrollLock = _ref$disableScrollLoc === void 0 ? false : _ref$disableScrollLoc,
-      _ref$disableBackgroun = _ref.disableBackgroundColor,
-      disableBackgroundColor = _ref$disableBackgroun === void 0 ? false : _ref$disableBackgroun,
-      bodyStyle = _ref.bodyStyle,
-      bodyClassName = _ref.bodyClassName,
-      _ref$disableBackgroun2 = _ref.disableBackgroundClick,
-      disableBackgroundClick = _ref$disableBackgroun2 === void 0 ? false : _ref$disableBackgroun2,
-      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+    onClose = _ref.onClose,
+    _ref$controls = _ref.controls,
+    controls = _ref$controls === void 0 ? [] : _ref$controls,
+    _ref$open = _ref.open,
+    defaultOpen = _ref$open === void 0 ? false : _ref$open,
+    _ref$animation = _ref.animation,
+    animation = _ref$animation === void 0 ? "top" : _ref$animation,
+    _ref$position = _ref.position,
+    position = _ref$position === void 0 ? "center" : _ref$position,
+    _ref$mode = _ref.mode,
+    mode = _ref$mode === void 0 ? "normal" : _ref$mode,
+    _ref$disableFocusLock = _ref.disableFocusLock,
+    disableFocusLock = _ref$disableFocusLock === void 0 ? false : _ref$disableFocusLock,
+    _ref$disableScrollLoc = _ref.disableScrollLock,
+    disableScrollLock = _ref$disableScrollLoc === void 0 ? false : _ref$disableScrollLoc,
+    _ref$disableBackgroun = _ref.disableBackgroundColor,
+    disableBackgroundColor = _ref$disableBackgroun === void 0 ? false : _ref$disableBackgroun,
+    bodyStyle = _ref.bodyStyle,
+    bodyClassName = _ref.bodyClassName,
+    _ref$disableBackgroun2 = _ref.disableBackgroundClick,
+    disableBackgroundClick = _ref$disableBackgroun2 === void 0 ? false : _ref$disableBackgroun2,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
   var _useState = useState(defaultOpen),
-      open = _useState[0],
-      setOpen = _useState[1];
+    open = _useState[0],
+    setOpen = _useState[1];
   var _useState2 = useState(true),
-      exited = _useState2[0],
-      setExited = _useState2[1];
+    exited = _useState2[0],
+    setExited = _useState2[1];
   var innerRef = useRef(null);
   var handleRef = useForkRef(innerRef, ref);
   useEffect(function () {
@@ -62,11 +59,9 @@ export var Sheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
       handleClose();
     }
   }, [disableBackgroundClick, handleClose]);
   if (!open && exited) {
     return null;
   }
   return /*#__PURE__*/React.createElement(Window, _extends({}, rest, {
     ref: handleRef,
     onClose: handleClose,
@@ -82,9 +77,7 @@ export var Sheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
     $mode: mode
   }, controls.length ? /*#__PURE__*/React.createElement(StyledSheetIcons, null, controls.map(function (item, index) {
     var maxDurationIn = 4; // max duration 4 for 400ms, shorten .4s
     var maxDurationOut = 2; // max duration 2 for 200ms, shorten .2s
     var control = index + 1;
     var durationOut = controls.length > maxDurationOut ? maxDurationOut : maxDurationOut - control;
     var durationIn = control >= maxDurationIn ? 1 : control;

package/dist/esm/components/Sheet/Sheet.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~../../../../src/components/~~Sheet~~/Sheet~~.~~tsx~~"],"names":["React","useRef","useCallback","useEffect","forwardRef","useState","Transition","Window","classnames","useForkRef","StyledAnimatedSpan","StyledCssTransition","StyledSheetIcons","StyledSheetWrapper","StyledSheetWrapperPaper","Overlay","Sheet","ref","children","onClose","controls","open","defaultOpen","animation","position","mode","disableFocusLock","disableScrollLock","disableBackgroundColor","bodyStyle","bodyClassName","disableBackgroundClick","rest","setOpen","exited","setExited","innerRef","handleRef","handleEnter","handleExited","handleClose","handleBackgroundClick","event","preventDefault","length","map","item","index","maxDurationIn","maxDurationOut","control","durationOut","durationIn","state","displayName"],"~~mappings~~":"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","sourcesContent":["import React, {\n useRef,\n useCallback,\n useEffect,\n forwardRef,\n HTMLAttributes,\n useState,\n CSSProperties,\n ReactElement,\n MouseEvent,\n} from \"react\";\n\nimport { Transition } from \"react-transition-group\";\nimport { Window } from \"../Window\";\nimport classnames from \"classnames\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport {\n StyledAnimatedSpan,\n StyledCssTransition,\n StyledSheetIcons,\n StyledSheetWrapper,\n StyledSheetWrapperPaper,\n} from \"./Styles\";\nimport { Overlay } from \"../Overlay\";\n\ninterface ISheet {\n onClose?: () => void;\n controls?: JSX.Element[];\n open?: boolean;\n animation?: \"top\" \| \"bottom\" \| \"left\" \| \"right\";\n position?: \"center\" \| \"left\" \| \"right\";\n mode?: \"normal\" \| \"stretch\";\n disableFocusLock?: boolean;\n disableScrollLock?: boolean;\n disableBackgroundColor?: boolean;\n bodyStyle?: CSSProperties;\n bodyClassName?: string;\n disableBackgroundClick?: boolean;\n}\n\nexport const Sheet = forwardRef<\n HTMLDivElement,\n ISheet & HTMLAttributes<HTMLDivElement>\n>(\n (\n {\n children,\n onClose,\n controls = [],\n open: defaultOpen = false,\n animation = \"top\",\n position = \"center\",\n mode = \"normal\",\n disableFocusLock = false,\n disableScrollLock = false,\n disableBackgroundColor = false,\n bodyStyle,\n bodyClassName,\n disableBackgroundClick = false,\n ...rest\n },\n ref\n ) => {\n const [open, setOpen] = useState(defaultOpen);\n const [exited, setExited] = useState(true);\n const innerRef = useRef<HTMLDivElement>(null);\n\n const handleRef = useForkRef(innerRef, ref);\n\n useEffect(() => {\n setOpen(defaultOpen);\n }, [defaultOpen]);\n\n const handleEnter = useCallback(() => {\n setExited(false);\n }, []);\n\n const handleExited = useCallback(() => {\n setExited(true);\n typeof onClose === \"function\" && onClose();\n }, [onClose]);\n\n const handleClose = useCallback(() => {\n setOpen(false);\n }, []);\n\n const handleBackgroundClick = useCallback(\n (event: MouseEvent<HTMLDivElement>) => {\n if (!disableBackgroundClick) {\n event.preventDefault();\n handleClose();\n }\n },\n [disableBackgroundClick, handleClose]\n );\n\n if (!open && exited) {\n return null;\n }\n\n return (\n <Window\n {...rest}\n ref={handleRef}\n onClose={handleClose}\n disableFocusLock={disableFocusLock}\n disableScrollLock={disableScrollLock}\n >\n {open ? (\n <Overlay\n onClick={handleBackgroundClick}\n disableBackgroundColor={disableBackgroundColor}\n />\n ) : null}\n <StyledSheetWrapper\n className={classnames(\"c-sheet__wrapper\", bodyClassName)}\n style={bodyStyle}\n $position={position}\n $mode={mode}\n >\n {controls.length ? (\n <StyledSheetIcons>\n {controls.map((item, index) => {\n const maxDurationIn = 4; // max duration 4 for 400ms, shorten .4s\n const maxDurationOut = 2; // max duration 2 for 200ms, shorten .2s\n const control = index + 1;\n const durationOut =\n controls.length > maxDurationOut\n ? maxDurationOut\n : maxDurationOut - control;\n const durationIn = control >= maxDurationIn ? 1 : control;\n return (\n <Transition\n appear\n in={open}\n timeout={maxDurationIn * 100}\n key={`c-sheet-control-${index}`}\n >\n {(state): ReactElement => (\n <StyledAnimatedSpan\n $state={state}\n $mode={mode}\n $maxDurationIn={maxDurationIn / 10}\n $maxDurationOut={maxDurationOut / 10}\n $durationOut={durationOut / 10}\n $durationIn={durationIn / 10}\n >\n {item}\n </StyledAnimatedSpan>\n )}\n </Transition>\n );\n })}\n </StyledSheetIcons>\n ) : null}\n <StyledCssTransition\n appear\n in={open}\n timeout={400}\n classNames={\"c-sheet__animation\"}\n $direction={animation}\n onEnter={handleEnter}\n onExited={handleExited}\n >\n <StyledSheetWrapperPaper className=\"c-sheet__wrapper__paper\">\n {children}\n </StyledSheetWrapperPaper>\n </StyledCssTransition>\n </StyledSheetWrapper>\n </Window>\n );\n }\n);\n\nSheet.displayName = \"Sheet\";\n"],"~~file~~":"~~Sheet.js~~"}
1	+ {"version":3,"file":"Sheet.js","names":["React","useRef","useCallback","useEffect","forwardRef","useState","Transition","Window","classnames","useForkRef","StyledAnimatedSpan","StyledCssTransition","StyledSheetIcons","StyledSheetWrapper","StyledSheetWrapperPaper","Overlay","Sheet","ref","children","onClose","controls","open","defaultOpen","animation","position","mode","disableFocusLock","disableScrollLock","disableBackgroundColor","bodyStyle","bodyClassName","disableBackgroundClick","rest","setOpen","exited","setExited","innerRef","handleRef","handleEnter","handleExited","handleClose","handleBackgroundClick","event","preventDefault","length","map","item","index","maxDurationIn","maxDurationOut","control","durationOut","durationIn","state","displayName"],"sources":["../../../../src/components/Sheet/Sheet.tsx"],"sourcesContent":["import React, {\n useRef,\n useCallback,\n useEffect,\n forwardRef,\n HTMLAttributes,\n useState,\n CSSProperties,\n ReactElement,\n MouseEvent,\n} from \"react\";\n\nimport { Transition } from \"react-transition-group\";\nimport { Window } from \"../Window\";\nimport classnames from \"classnames\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport {\n StyledAnimatedSpan,\n StyledCssTransition,\n StyledSheetIcons,\n StyledSheetWrapper,\n StyledSheetWrapperPaper,\n} from \"./Styles\";\nimport { Overlay } from \"../Overlay\";\n\ninterface ISheet {\n onClose?: () => void;\n controls?: JSX.Element[];\n open?: boolean;\n animation?: \"top\" \| \"bottom\" \| \"left\" \| \"right\";\n position?: \"center\" \| \"left\" \| \"right\";\n mode?: \"normal\" \| \"stretch\";\n disableFocusLock?: boolean;\n disableScrollLock?: boolean;\n disableBackgroundColor?: boolean;\n bodyStyle?: CSSProperties;\n bodyClassName?: string;\n disableBackgroundClick?: boolean;\n}\n\nexport const Sheet = forwardRef<\n HTMLDivElement,\n ISheet & HTMLAttributes<HTMLDivElement>\n>(\n (\n {\n children,\n onClose,\n controls = [],\n open: defaultOpen = false,\n animation = \"top\",\n position = \"center\",\n mode = \"normal\",\n disableFocusLock = false,\n disableScrollLock = false,\n disableBackgroundColor = false,\n bodyStyle,\n bodyClassName,\n disableBackgroundClick = false,\n ...rest\n },\n ref\n ) => {\n const [open, setOpen] = useState(defaultOpen);\n const [exited, setExited] = useState(true);\n const innerRef = useRef<HTMLDivElement>(null);\n\n const handleRef = useForkRef(innerRef, ref);\n\n useEffect(() => {\n setOpen(defaultOpen);\n }, [defaultOpen]);\n\n const handleEnter = useCallback(() => {\n setExited(false);\n }, []);\n\n const handleExited = useCallback(() => {\n setExited(true);\n typeof onClose === \"function\" && onClose();\n }, [onClose]);\n\n const handleClose = useCallback(() => {\n setOpen(false);\n }, []);\n\n const handleBackgroundClick = useCallback(\n (event: MouseEvent<HTMLDivElement>) => {\n if (!disableBackgroundClick) {\n event.preventDefault();\n handleClose();\n }\n },\n [disableBackgroundClick, handleClose]\n );\n\n if (!open && exited) {\n return null;\n }\n\n return (\n <Window\n {...rest}\n ref={handleRef}\n onClose={handleClose}\n disableFocusLock={disableFocusLock}\n disableScrollLock={disableScrollLock}\n >\n {open ? (\n <Overlay\n onClick={handleBackgroundClick}\n disableBackgroundColor={disableBackgroundColor}\n />\n ) : null}\n <StyledSheetWrapper\n className={classnames(\"c-sheet__wrapper\", bodyClassName)}\n style={bodyStyle}\n $position={position}\n $mode={mode}\n >\n {controls.length ? (\n <StyledSheetIcons>\n {controls.map((item, index) => {\n const maxDurationIn = 4; // max duration 4 for 400ms, shorten .4s\n const maxDurationOut = 2; // max duration 2 for 200ms, shorten .2s\n const control = index + 1;\n const durationOut =\n controls.length > maxDurationOut\n ? maxDurationOut\n : maxDurationOut - control;\n const durationIn = control >= maxDurationIn ? 1 : control;\n return (\n <Transition\n appear\n in={open}\n timeout={maxDurationIn * 100}\n key={`c-sheet-control-${index}`}\n >\n {(state): ReactElement => (\n <StyledAnimatedSpan\n $state={state}\n $mode={mode}\n $maxDurationIn={maxDurationIn / 10}\n $maxDurationOut={maxDurationOut / 10}\n $durationOut={durationOut / 10}\n $durationIn={durationIn / 10}\n >\n {item}\n </StyledAnimatedSpan>\n )}\n </Transition>\n );\n })}\n </StyledSheetIcons>\n ) : null}\n <StyledCssTransition\n appear\n in={open}\n timeout={400}\n classNames={\"c-sheet__animation\"}\n $direction={animation}\n onEnter={handleEnter}\n onExited={handleExited}\n >\n <StyledSheetWrapperPaper className=\"c-sheet__wrapper__paper\">\n {children}\n </StyledSheetWrapperPaper>\n </StyledCssTransition>\n </StyledSheetWrapper>\n </Window>\n );\n }\n);\n\nSheet.displayName = \"Sheet\";\n"],"mappings":"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"}

package/dist/esm/components/Sheet/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Sheet/Styles.ts"],"names":["styled","css","keyframes","BoxSizingStyle","FontStyle","CSSTransition","StyledSheetIcons","div","displayName","StyledSheetWrapper","props","$mode","$position","StyledSheetWrapperPaper","StyledSheetControlsTop","StyledSheetControlsBottom","StyledSheetControlsCenterIn","StyledSheetControlsCenterOut","StyledAnimatedSpan","span","$state","$durationIn","$maxDurationIn","$durationOut","$maxDurationOut","StyledCssTransition","$direction"],"mappings":"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","sourcesContent":["import styled, { css, keyframes } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { CSSTransition } from \"react-transition-group\";\n\nexport const StyledSheetIcons = styled.div`\n display: flex;\n height: 0;\n position: relative;\n\n span {\n position: relative;\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-secondary);\n cursor: pointer;\n border-radius: 100%;\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n & > * {\n height: 40px;\n width: 40px;\n padding: 8px;\n fill: var(--color-theme-600);\n }\n }\n`;\n\nStyledSheetIcons.displayName = \"StyledSheetIcons\";\n\ninterface IStyledSheetWrapper {\n $position?: \"center\" \| \"left\" \| \"right\";\n $mode?: \"normal\" \| \"stretch\";\n}\n\nexport const StyledSheetWrapper = styled.div<IStyledSheetWrapper>`\n ${BoxSizingStyle}\n ${FontStyle}\n\n position: relative;\n max-width: 95vw;\n display: flex;\n flex-direction: row;\n\n ${(props) =>\n props.$mode === \"stretch\"\n ? css`\n margin-top: 8px;\n height: calc(100vh - 16px);\n width: calc(100vw - 100px);\n max-width: 1000px;\n ${StyledSheetIcons} {\n flex-direction: column;\n width: 0;\n height: calc(100vh - 32px);\n & > * {\n margin-bottom: 8px;\n animation-fill-mode: both;\n }\n span {\n top: 8px;\n }\n }\n `\n : css`\n max-height: calc(100vh - 156px);\n margin-top: 126px;\n margin-bottom: 30px;\n width: 540px;\n flex-direction: column;\n\n ${StyledSheetIcons} {\n flex-direction: row-reverse;\n & > * {\n margin-left: 8px;\n animation-fill-mode: both;\n }\n span {\n top: -48px;\n right: 8px;\n }\n }\n `}\n\n ${(props) =>\n props.$position === \"center\" &&\n css`\n ${tw`tw-mx-auto`}\n `}\n\n ${(props) =>\n props.$position === \"left\" &&\n css`\n ${tw`tw-ml-2 tw-mr-auto`}\n `}\n\n ${(props) =>\n props.$position === \"right\" &&\n css`\n ${tw`tw-mr-2 tw-ml-auto`}\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position !== \"left\" &&\n css`\n ${StyledSheetIcons} {\n span {\n right: 48px;\n }\n }\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position === \"left\" &&\n css`\n flex-direction: row-reverse;\n\n ${StyledSheetIcons} {\n span {\n right: -8px;\n }\n }\n `}\n`;\n\nStyledSheetWrapper.displayName = \"StyledSheetWrapper\";\n\nexport const StyledSheetWrapperPaper = styled.div`\n background-color: var(--page-paper-main);\n color: var(--color-theme-900);\n box-shadow: var(--shadow-primary);\n border-radius: 6px;\n overflow: auto;\n animation: 0.3s linear ease-out;\n\n ${tw`tw-flex-auto`}\n`;\n\nStyledSheetWrapperPaper.displayName = \"StyledSheetWrapperPaper\";\n\nexport const StyledSheetControlsTop = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(-200px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n`;\n\nexport const StyledSheetControlsBottom = keyframes`\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 100% {\n opacity: 0;\n transform: translateY(-200px);\n}\n`;\n\nexport const StyledSheetControlsCenterIn = keyframes`\n 0% {\n transform: translateY(-150px);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n`;\n\nexport const StyledSheetControlsCenterOut = keyframes`\n 0% {\n transform: translateY(0);\n opacity: 1;\n }\n 100% {\n transform: translateY(-150px);\n opacity: 0;\n }\n`;\n\ninterface IStyledAnimatedSpan {\n $mode: string;\n $state: string;\n $maxDurationIn: number;\n $maxDurationOut: number;\n $durationOut: number;\n $durationIn: number;\n}\n\nexport const StyledAnimatedSpan = styled.span<IStyledAnimatedSpan>`\n background: red;\n ${(props) =>\n props.$state === \"entering\" &&\n css`\n opacity: 1;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsTop};\n animation-duration: ${`${props.$durationIn}s`};\n animation-delay: ${`${props.$durationIn}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterIn};\n animation-duration: ${`${props.$maxDurationIn}s`};\n animation-delay: 0s;\n `}\n `}\n\n ${(props) =>\n props.$state === \"entered\" &&\n css`\n opacity: 1;\n `}\n\n ${(props) =>\n props.$state === \"exiting\" &&\n css`\n opacity: 0;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsBottom};\n animation-duration: ${`${props.$durationOut}s`};\n animation-delay: ${`${props.$durationOut}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterOut};\n animation-duration: ${`${props.$maxDurationOut}s`};\n animation-delay: 0;\n `}\n `}\n\n ${(props) =>\n props.$state === \"exited\" &&\n css`\n opacity: 0;\n `}\n`;\n\nStyledAnimatedSpan.displayName = \"StyledAnimatedSpan\";\n\nexport const StyledCssTransition = styled(CSSTransition)<{\n $direction: string;\n}>`\n ${(props) =>\n props.$direction === \"top\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"bottom\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"left\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"right\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n`;\n\nStyledCssTransition.displayName = \"StyledCssTransition\";\n"],"file":"Styles.js"}
1	+ {"version":3,"file":"Styles.js","names":["styled","css","keyframes","BoxSizingStyle","FontStyle","CSSTransition","StyledSheetIcons","div","displayName","StyledSheetWrapper","props","$mode","$position","StyledSheetWrapperPaper","StyledSheetControlsTop","StyledSheetControlsBottom","StyledSheetControlsCenterIn","StyledSheetControlsCenterOut","StyledAnimatedSpan","span","$state","$durationIn","$maxDurationIn","$durationOut","$maxDurationOut","StyledCssTransition","$direction"],"sources":["../../../../src/components/Sheet/Styles.ts"],"sourcesContent":["import styled, { css, keyframes } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { CSSTransition } from \"react-transition-group\";\n\nexport const StyledSheetIcons = styled.div`\n display: flex;\n height: 0;\n position: relative;\n\n span {\n position: relative;\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-secondary);\n cursor: pointer;\n border-radius: 100%;\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n & > * {\n height: 40px;\n width: 40px;\n padding: 8px;\n fill: var(--color-theme-600);\n }\n }\n`;\n\nStyledSheetIcons.displayName = \"StyledSheetIcons\";\n\ninterface IStyledSheetWrapper {\n $position?: \"center\" \| \"left\" \| \"right\";\n $mode?: \"normal\" \| \"stretch\";\n}\n\nexport const StyledSheetWrapper = styled.div<IStyledSheetWrapper>`\n ${BoxSizingStyle}\n ${FontStyle}\n\n position: relative;\n max-width: 95vw;\n display: flex;\n flex-direction: row;\n\n ${(props) =>\n props.$mode === \"stretch\"\n ? css`\n margin-top: 8px;\n height: calc(100vh - 16px);\n width: calc(100vw - 100px);\n max-width: 1000px;\n ${StyledSheetIcons} {\n flex-direction: column;\n width: 0;\n height: calc(100vh - 32px);\n & > * {\n margin-bottom: 8px;\n animation-fill-mode: both;\n }\n span {\n top: 8px;\n }\n }\n `\n : css`\n max-height: calc(100vh - 156px);\n margin-top: 126px;\n margin-bottom: 30px;\n width: 540px;\n flex-direction: column;\n\n ${StyledSheetIcons} {\n flex-direction: row-reverse;\n & > * {\n margin-left: 8px;\n animation-fill-mode: both;\n }\n span {\n top: -48px;\n right: 8px;\n }\n }\n `}\n\n ${(props) =>\n props.$position === \"center\" &&\n css`\n ${tw`tw-mx-auto`}\n `}\n\n ${(props) =>\n props.$position === \"left\" &&\n css`\n ${tw`tw-ml-2 tw-mr-auto`}\n `}\n\n ${(props) =>\n props.$position === \"right\" &&\n css`\n ${tw`tw-mr-2 tw-ml-auto`}\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position !== \"left\" &&\n css`\n ${StyledSheetIcons} {\n span {\n right: 48px;\n }\n }\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position === \"left\" &&\n css`\n flex-direction: row-reverse;\n\n ${StyledSheetIcons} {\n span {\n right: -8px;\n }\n }\n `}\n`;\n\nStyledSheetWrapper.displayName = \"StyledSheetWrapper\";\n\nexport const StyledSheetWrapperPaper = styled.div`\n background-color: var(--page-paper-main);\n color: var(--color-theme-900);\n box-shadow: var(--shadow-primary);\n border-radius: 6px;\n overflow: auto;\n animation: 0.3s linear ease-out;\n\n ${tw`tw-flex-auto`}\n`;\n\nStyledSheetWrapperPaper.displayName = \"StyledSheetWrapperPaper\";\n\nexport const StyledSheetControlsTop = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(-200px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n`;\n\nexport const StyledSheetControlsBottom = keyframes`\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 100% {\n opacity: 0;\n transform: translateY(-200px);\n}\n`;\n\nexport const StyledSheetControlsCenterIn = keyframes`\n 0% {\n transform: translateY(-150px);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n`;\n\nexport const StyledSheetControlsCenterOut = keyframes`\n 0% {\n transform: translateY(0);\n opacity: 1;\n }\n 100% {\n transform: translateY(-150px);\n opacity: 0;\n }\n`;\n\ninterface IStyledAnimatedSpan {\n $mode: string;\n $state: string;\n $maxDurationIn: number;\n $maxDurationOut: number;\n $durationOut: number;\n $durationIn: number;\n}\n\nexport const StyledAnimatedSpan = styled.span<IStyledAnimatedSpan>`\n background: red;\n ${(props) =>\n props.$state === \"entering\" &&\n css`\n opacity: 1;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsTop};\n animation-duration: ${`${props.$durationIn}s`};\n animation-delay: ${`${props.$durationIn}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterIn};\n animation-duration: ${`${props.$maxDurationIn}s`};\n animation-delay: 0s;\n `}\n `}\n\n ${(props) =>\n props.$state === \"entered\" &&\n css`\n opacity: 1;\n `}\n\n ${(props) =>\n props.$state === \"exiting\" &&\n css`\n opacity: 0;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsBottom};\n animation-duration: ${`${props.$durationOut}s`};\n animation-delay: ${`${props.$durationOut}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterOut};\n animation-duration: ${`${props.$maxDurationOut}s`};\n animation-delay: 0;\n `}\n `}\n\n ${(props) =>\n props.$state === \"exited\" &&\n css`\n opacity: 0;\n `}\n`;\n\nStyledAnimatedSpan.displayName = \"StyledAnimatedSpan\";\n\nexport const StyledCssTransition = styled(CSSTransition)<{\n $direction: string;\n}>`\n ${(props) =>\n props.$direction === \"top\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"bottom\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"left\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"right\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n`;\n\nStyledCssTransition.displayName = \"StyledCssTransition\";\n"],"mappings":"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"}

package/dist/esm/components/Sheet/index.js.map CHANGED Viewed

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

package/dist/esm/components/Signifier/Signifier.js CHANGED Viewed

@@ -7,32 +7,26 @@ import { StyledIcon, StyledSignifier, StyledSignifierTransition } from "./Styles
 export var signifierTypes = ["EyeIcon", "EyeSmallIcon", "PencilIcon", "PencilSmallIcon", "EyeOffIcon", "EyeOffSmallIcon", "ChecklistIcon", "ChecklistSmallIcon", "WarningTriangleIcon", "WarningTriangleSmallIcon", "DependencyIcon", "DependencySmallIcon", "MessageIcon", "MessageSmallIcon", "ClockStopwatchIcon", "ClockStopwatchSmallIcon", "ClockIcon", "ClockSmallIcon", "DollarOffIcon", "DollarOffSmallIcon", "DollarIcon", "DollarSmallIcon", "DollarCheckmarkIcon", "DollarCheckmarkSmallIcon", "DollarClockIcon", "DollarClockSmallIcon", "BellOffIcon", "BellOffSmallIcon", "LockIcon", "LockSmallIcon", "RecurringCheckmarkIcon", "RecurringCheckmarkSmallIcon"];
 export var Signifier = function Signifier(_ref) {
   var Component = _ref.type,
-      _ref$value = _ref.value,
-      value = _ref$value === void 0 ? null : _ref$value,
-      className = _ref.className,
-      tooltipText = _ref.tooltipText,
-      tooltipClassName = _ref.tooltipClassName;
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? null : _ref$value,
+    className = _ref.className,
+    tooltipText = _ref.tooltipText,
+    tooltipClassName = _ref.tooltipClassName;
   if (signifierTypes.indexOf(Component.displayName) === -1) {
     console.warn("You are using unsupported Signifier icon");
   }
   var _useState = useState("c-signifier--top"),
-      direction = _useState[0],
-      setDirection = _useState[1];
+    direction = _useState[0],
+    setDirection = _useState[1];
   var _useState2 = useState(value),
-      setPrevValue = _useState2[1];
+    setPrevValue = _useState2[1];
   var label = useMemo(function () {
     if (!value || value < 1) return null;
     var max = 1000000000;
     var newValue = value;
     if (newValue > max) {
       newValue = max;
     }
     if (newValue === max) {
       return Math.floor(newValue / 1000000000) + "B+";
     } else if (newValue > 999999) {
@@ -40,7 +34,6 @@ export var Signifier = function Signifier(_ref) {
     } else if (newValue > 999) {
       return Math.floor(newValue / 1000) + "k";
     }
     return "" + newValue;
   }, [value]);
   useEffect(function () {

package/dist/esm/components/Signifier/Signifier.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~../../../../src/components/~~Signifier~~/Signifier~~.~~tsx~~"],"names":["React","useMemo","useState","useEffect","classnames","SwitchTransition","Tooltip","Body1","Caption1","StyledIcon","StyledSignifier","StyledSignifierTransition","signifierTypes","Signifier","Component","type","value","className","tooltipText","tooltipClassName","indexOf","displayName","console","warn","direction","setDirection","setPrevValue","label","max","newValue","Math","floor","v","renderSignifier","includes"],"~~mappings~~":"AAAA,OAAOA,KAAP,IAAoBC,OAApB,EAA0CC,QAA1C,EAAoDC,SAApD,QAAqE,OAArE;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,gBAAT,QAAiC,wBAAjC;AACA,SAASC,OAAT,QAAwB,YAAxB;AACA,SAASC,KAAT,EAAgBC,QAAhB,QAAgC,eAAhC;AACA,SACEC,UADF,EAEEC,eAFF,EAGEC,yBAHF,QAIO,UAJP;AAmBA,OAAO,IAAMC,cAAc,GAAG,CAC5B,SAD4B,EAE5B,cAF4B,EAG5B,YAH4B,EAI5B,iBAJ4B,EAK5B,YAL4B,EAM5B,iBAN4B,EAO5B,eAP4B,EAQ5B,oBAR4B,EAS5B,qBAT4B,EAU5B,0BAV4B,EAW5B,gBAX4B,EAY5B,qBAZ4B,EAa5B,aAb4B,EAc5B,kBAd4B,EAe5B,oBAf4B,EAgB5B,yBAhB4B,EAiB5B,WAjB4B,EAkB5B,gBAlB4B,EAmB5B,eAnB4B,EAoB5B,oBApB4B,EAqB5B,YArB4B,EAsB5B,iBAtB4B,EAuB5B,qBAvB4B,EAwB5B,0BAxB4B,EAyB5B,iBAzB4B,EA0B5B,sBA1B4B,EA2B5B,aA3B4B,EA4B5B,kBA5B4B,EA6B5B,UA7B4B,EA8B5B,eA9B4B,EA+B5B,wBA/B4B,EAgC5B,6BAhC4B,CAAvB;AAmCP,OAAO,IAAMC,SAA8B,GAAG,SAAjCA,SAAiC,OAMxC;AAAA,MALEC,SAKF,QALJC,IAKI;AAAA,wBAJJC,KAII;AAAA,MAJJA,KAII,2BAJI,IAIJ;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,WAEI,QAFJA,WAEI;AAAA,MADJC,gBACI,QADJA,gBACI;;AACJ,MACEP,cAAc,CAACQ,OAAf,CACGN,SAAD,CAAuCO,WADzC,MAEM,CAAC,CAHT,EAIE;AACAC,IAAAA,OAAO,CAACC,IAAR,CAAa,0CAAb;AACD;;AAED,kBAAkCrB,QAAQ,CAAC,kBAAD,CAA1C;AAAA,MAAOsB,SAAP;AAAA,MAAkBC,YAAlB;;AACA,mBAAyBvB,QAAQ,CAACc,KAAD,CAAjC;AAAA,MAASU,YAAT;;AAEA,MAAMC,KAAoB,GAAG1B,OAAO,CAAC,YAAM;AACzC,QAAI,CAACe,KAAD,IAAUA,KAAK,GAAG,CAAtB,EAAyB,OAAO,IAAP;AAEzB,QAAMY,GAAG,GAAG,UAAZ;AACA,QAAIC,QAAQ,GAAGb,KAAf;;AAEA,QAAIa,QAAQ,GAAGD,GAAf,EAAoB;AAClBC,MAAAA,QAAQ,GAAGD,GAAX;AACD;;AAED,QAAIC,QAAQ,KAAKD,GAAjB,EAAsB;AACpB,aAAUE,IAAI,CAACC,KAAL,CAAWF,QAAQ,GAAG,UAAtB,CAAV;AACD,KAFD,MAEO,IAAIA,QAAQ,GAAG,MAAf,EAAwB;AAC7B,aAAUC,IAAI,CAACC,KAAL,CAAWF,QAAQ,GAAG,OAAtB,CAAV;AACD,KAFM,MAEA,IAAIA,QAAQ,GAAG,GAAf,EAAoB;AACzB,aAAUC,IAAI,CAACC,KAAL,CAAWF,QAAQ,GAAG,IAAtB,CAAV;AACD;;AAED,gBAAUA,QAAV;AACD,GAnBmC,EAmBjC,CAACb,KAAD,CAnBiC,CAApC;AAqBAb,EAAAA,SAAS,CAAC,YAAM;AACda,IAAAA,KAAK,IACHU,YAAY,CAAC,UAACM,CAAD,EAAO;AAClBA,MAAAA,CAAC,IACCP,YAAY,CACVO,CAAC,GAAGhB,KAAJ,GAAY,CAAZ,GAAgB,kBAAhB,GAAqC,qBAD3B,CADd;AAIA,aAAOA,KAAP;AACD,KANW,CADd;AAQD,GATQ,EASN,CAACA,KAAD,CATM,CAAT;AAWA,MAAMiB,eAAe,GAAGhC,OAAO,CAC7B;AAAA,wBACE,oBAAC,eAAD;AACE,MAAA,SAAS,EAAEG,UAAU,CAAC,aAAD,EAAgBa,SAAhB,CADvB;AAEE,MAAA,UAAU,EAAEO;AAFd,oBAIE,oBAAC,UAAD;AAAY,MAAA,EAAE,EAAEV;AAAhB,MAJF,EAKGE,KAAK,KAAK,IAAV,iBACC,oBAAC,gBAAD;AAAkB,MAAA,IAAI,EAAE;AAAxB,oBACE,oBAAC,yBAAD;AACE,MAAA,GAAG,EAAEW,KADP;AAEE,MAAA,OAAO,EAAE,GAFX;AAGE,MAAA,UAAU,EAAC;AAHb,OAKIb,SAAD,CAAuCO,WAAvC,CAAmDa,QAAnD,CACC,WADD,iBAGC,oBAAC,QAAD;AAAU,MAAA,KAAK,EAAC;AAAhB,OAA6BP,KAA7B,CAHD,gBAKC,oBAAC,KAAD;AAAO,MAAA,KAAK,EAAC;AAAb,OAA0BA,KAA1B,CAVJ,CADF,CANJ,CADF;AAAA,GAD6B,EA0B7B,CAACV,SAAD,EAAYO,SAAZ,EAAuBV,SAAvB,EAAkCE,KAAlC,EAAyCW,KAAzC,CA1B6B,CAA/~~B;AA6BA,sBACE,oBAAC,OAAD;AACE,IAAA,KAAK,EAAET,WAAF,WAAEA,WAAF,GAAiB,EADxB;AAEE,IAAA,OAAO,EAAE,CAACA,WAFZ;AAGE,IAAA,sBAAsB,EAAEC;AAH1B,KAKGc,eALH,CADF;AASD,CAxFM;AA0FPpB,SAAS,CAACQ,WAAV,GAAwB,WAAxB~~","sourcesContent":["import React, { FC, useMemo, ElementType, useState, useEffect } from \"react\";\nimport classnames from \"classnames\";\nimport { SwitchTransition } from \"react-transition-group\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Body1, Caption1 } from \"../Typography\";\nimport {\n StyledIcon,\n StyledSignifier,\n StyledSignifierTransition,\n} from \"./Styles\";\n\ninterface ISignifierProps {\n /** One of icon types /\n type: ElementType;\n /* Number that represent total value /\n value?: number;\n /* Value that represent class names /\n className?: string;\n /* The text that will be displayed on hover in tooltip /\n tooltipText?: string;\n /* ClassName for tooltip if there is one */\n tooltipClassName?: string;\n}\n\nexport const signifierTypes = [\n \"EyeIcon\",\n \"EyeSmallIcon\",\n \"PencilIcon\",\n \"PencilSmallIcon\",\n \"EyeOffIcon\",\n \"EyeOffSmallIcon\",\n \"ChecklistIcon\",\n \"ChecklistSmallIcon\",\n \"WarningTriangleIcon\",\n \"WarningTriangleSmallIcon\",\n \"DependencyIcon\",\n \"DependencySmallIcon\",\n \"MessageIcon\",\n \"MessageSmallIcon\",\n \"ClockStopwatchIcon\",\n \"ClockStopwatchSmallIcon\",\n \"ClockIcon\",\n \"ClockSmallIcon\",\n \"DollarOffIcon\",\n \"DollarOffSmallIcon\",\n \"DollarIcon\",\n \"DollarSmallIcon\",\n \"DollarCheckmarkIcon\",\n \"DollarCheckmarkSmallIcon\",\n \"DollarClockIcon\",\n \"DollarClockSmallIcon\",\n \"BellOffIcon\",\n \"BellOffSmallIcon\",\n \"LockIcon\",\n \"LockSmallIcon\",\n \"RecurringCheckmarkIcon\",\n \"RecurringCheckmarkSmallIcon\",\n];\n\nexport const Signifier: FC<ISignifierProps> = ({\n type: Component,\n value = null,\n className,\n tooltipText,\n tooltipClassName,\n}) => {\n if (\n signifierTypes.indexOf(\n (Component as { displayName: string }).displayName\n ) === -1\n ) {\n console.warn(\"You are using unsupported Signifier icon\");\n }\n\n const [direction, setDirection] = useState(\"c-signifier--top\");\n const [, setPrevValue] = useState(value);\n\n const label: string \| null = useMemo(() => {\n if (!value \|\| value < 1) return null;\n\n const max = 1_000_000_000;\n let newValue = value;\n\n if (newValue > max) {\n newValue = max;\n }\n\n if (newValue === max) {\n return `${Math.floor(newValue / 1_000_000_000)}B+`;\n } else if (newValue > 999_999) {\n return `${Math.floor(newValue / 1_000_000)}M`;\n } else if (newValue > 999) {\n return `${Math.floor(newValue / 1000)}k`;\n }\n\n return `${newValue}`;\n }, [value]);\n\n useEffect(() => {\n value &&\n setPrevValue((v) => {\n v &&\n setDirection(\n v - value > 0 ? \"c-signifier--top\" : \"c-signifier--bottom\"\n );\n return value;\n });\n }, [value]);\n\n const renderSignifier = useMemo(\n () => (\n <StyledSignifier\n className={classnames(\"c-signifier\", className)}\n $direction={direction}\n >\n <StyledIcon as={Component} />\n {value !== null && (\n <SwitchTransition mode={\"out-in\"}>\n <StyledSignifierTransition\n key={label}\n timeout={300}\n classNames=\"c-signifier--animate\"\n >\n {(Component as { displayName: string }).displayName.includes(\n \"SmallIcon\"\n ) ? (\n <Caption1 color=\"secondary\">{label}</Caption1>\n ) : (\n <Body1 color=\"secondary\">{label}</Body1>\n )}\n </StyledSignifierTransition>\n </SwitchTransition>\n )}\n </StyledSignifier>\n ),\n [className, direction, Component, value, label]\n );\n\n return (\n <Tooltip\n title={tooltipText ?? \"\"}\n disable={!tooltipText}\n popperTooltipClassName={tooltipClassName}\n >\n {renderSignifier}\n </Tooltip>\n );\n};\n\nSignifier.displayName = \"Signifier\";\n"],"~~file~~":"~~Signifier.js~~"}
1	+ {"version":3,"file":"Signifier.js","names":["React","useMemo","useState","useEffect","classnames","SwitchTransition","Tooltip","Body1","Caption1","StyledIcon","StyledSignifier","StyledSignifierTransition","signifierTypes","Signifier","Component","type","value","className","tooltipText","tooltipClassName","indexOf","displayName","console","warn","direction","setDirection","setPrevValue","label","max","newValue","Math","floor","v","renderSignifier","includes"],"sources":["../../../../src/components/Signifier/Signifier.tsx"],"sourcesContent":["import React, { FC, useMemo, ElementType, useState, useEffect } from \"react\";\nimport classnames from \"classnames\";\nimport { SwitchTransition } from \"react-transition-group\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Body1, Caption1 } from \"../Typography\";\nimport {\n StyledIcon,\n StyledSignifier,\n StyledSignifierTransition,\n} from \"./Styles\";\n\ninterface ISignifierProps {\n /** One of icon types /\n type: ElementType;\n /* Number that represent total value /\n value?: number;\n /* Value that represent class names /\n className?: string;\n /* The text that will be displayed on hover in tooltip /\n tooltipText?: string;\n /* ClassName for tooltip if there is one */\n tooltipClassName?: string;\n}\n\nexport const signifierTypes = [\n \"EyeIcon\",\n \"EyeSmallIcon\",\n \"PencilIcon\",\n \"PencilSmallIcon\",\n \"EyeOffIcon\",\n \"EyeOffSmallIcon\",\n \"ChecklistIcon\",\n \"ChecklistSmallIcon\",\n \"WarningTriangleIcon\",\n \"WarningTriangleSmallIcon\",\n \"DependencyIcon\",\n \"DependencySmallIcon\",\n \"MessageIcon\",\n \"MessageSmallIcon\",\n \"ClockStopwatchIcon\",\n \"ClockStopwatchSmallIcon\",\n \"ClockIcon\",\n \"ClockSmallIcon\",\n \"DollarOffIcon\",\n \"DollarOffSmallIcon\",\n \"DollarIcon\",\n \"DollarSmallIcon\",\n \"DollarCheckmarkIcon\",\n \"DollarCheckmarkSmallIcon\",\n \"DollarClockIcon\",\n \"DollarClockSmallIcon\",\n \"BellOffIcon\",\n \"BellOffSmallIcon\",\n \"LockIcon\",\n \"LockSmallIcon\",\n \"RecurringCheckmarkIcon\",\n \"RecurringCheckmarkSmallIcon\",\n];\n\nexport const Signifier: FC<ISignifierProps> = ({\n type: Component,\n value = null,\n className,\n tooltipText,\n tooltipClassName,\n}) => {\n if (\n signifierTypes.indexOf(\n (Component as { displayName: string }).displayName\n ) === -1\n ) {\n console.warn(\"You are using unsupported Signifier icon\");\n }\n\n const [direction, setDirection] = useState(\"c-signifier--top\");\n const [, setPrevValue] = useState(value);\n\n const label: string \| null = useMemo(() => {\n if (!value \|\| value < 1) return null;\n\n const max = 1_000_000_000;\n let newValue = value;\n\n if (newValue > max) {\n newValue = max;\n }\n\n if (newValue === max) {\n return `${Math.floor(newValue / 1_000_000_000)}B+`;\n } else if (newValue > 999_999) {\n return `${Math.floor(newValue / 1_000_000)}M`;\n } else if (newValue > 999) {\n return `${Math.floor(newValue / 1000)}k`;\n }\n\n return `${newValue}`;\n }, [value]);\n\n useEffect(() => {\n value &&\n setPrevValue((v) => {\n v &&\n setDirection(\n v - value > 0 ? \"c-signifier--top\" : \"c-signifier--bottom\"\n );\n return value;\n });\n }, [value]);\n\n const renderSignifier = useMemo(\n () => (\n <StyledSignifier\n className={classnames(\"c-signifier\", className)}\n $direction={direction}\n >\n <StyledIcon as={Component} />\n {value !== null && (\n <SwitchTransition mode={\"out-in\"}>\n <StyledSignifierTransition\n key={label}\n timeout={300}\n classNames=\"c-signifier--animate\"\n >\n {(Component as { displayName: string }).displayName.includes(\n \"SmallIcon\"\n ) ? (\n <Caption1 color=\"secondary\">{label}</Caption1>\n ) : (\n <Body1 color=\"secondary\">{label}</Body1>\n )}\n </StyledSignifierTransition>\n </SwitchTransition>\n )}\n </StyledSignifier>\n ),\n [className, direction, Component, value, label]\n );\n\n return (\n <Tooltip\n title={tooltipText ?? \"\"}\n disable={!tooltipText}\n popperTooltipClassName={tooltipClassName}\n >\n {renderSignifier}\n </Tooltip>\n );\n};\n\nSignifier.displayName = \"Signifier\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,OAAO,EAAeC,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAC5E,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,gBAAgB,QAAQ,wBAAwB;AACzD,SAASC,OAAO,QAAQ,YAAY;AACpC,SAASC,KAAK,EAAEC,QAAQ,QAAQ,eAAe;AAC/C,SACEC,UAAU,EACVC,eAAe,EACfC,yBAAyB,QACpB,UAAU;AAejB,OAAO,IAAMC,cAAc,GAAG,CAC5B,SAAS,EACT,cAAc,EACd,YAAY,EACZ,iBAAiB,EACjB,YAAY,EACZ,iBAAiB,EACjB,eAAe,EACf,oBAAoB,EACpB,qBAAqB,EACrB,0BAA0B,EAC1B,gBAAgB,EAChB,qBAAqB,EACrB,aAAa,EACb,kBAAkB,EAClB,oBAAoB,EACpB,yBAAyB,EACzB,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACpB,YAAY,EACZ,iBAAiB,EACjB,qBAAqB,EACrB,0BAA0B,EAC1B,iBAAiB,EACjB,sBAAsB,EACtB,aAAa,EACb,kBAAkB,EAClB,UAAU,EACV,eAAe,EACf,wBAAwB,EACxB,6BAA6B,CAC9B;AAED,OAAO,IAAMC,SAA8B,GAAG,SAAjCA,SAA8B,OAMrC;EAAA,IALEC,SAAS,QAAfC,IAAI;IAAA,kBACJC,KAAK;IAALA,KAAK,2BAAG,IAAI;IACZC,SAAS,QAATA,SAAS;IACTC,WAAW,QAAXA,WAAW;IACXC,gBAAgB,QAAhBA,gBAAgB;EAEhB,IACEP,cAAc,CAACQ,OAAO,CACnBN,SAAS,CAA6BO,WAAW,CACnD,KAAK,CAAC,CAAC,EACR;IACAC,OAAO,CAACC,IAAI,CAAC,0CAA0C,CAAC;EAC1D;EAEA,gBAAkCrB,QAAQ,CAAC,kBAAkB,CAAC;IAAvDsB,SAAS;IAAEC,YAAY;EAC9B,iBAAyBvB,QAAQ,CAACc,KAAK,CAAC;IAA/BU,YAAY;EAErB,IAAMC,KAAoB,GAAG1B,OAAO,CAAC,YAAM;IACzC,IAAI,CAACe,KAAK,IAAIA,KAAK,GAAG,CAAC,EAAE,OAAO,IAAI;IAEpC,IAAMY,GAAG,GAAG,UAAa;IACzB,IAAIC,QAAQ,GAAGb,KAAK;IAEpB,IAAIa,QAAQ,GAAGD,GAAG,EAAE;MAClBC,QAAQ,GAAGD,GAAG;IAChB;IAEA,IAAIC,QAAQ,KAAKD,GAAG,EAAE;MACpB,OAAUE,IAAI,CAACC,KAAK,CAACF,QAAQ,GAAG,UAAa,CAAC;IAChD,CAAC,MAAM,IAAIA,QAAQ,GAAG,MAAO,EAAE;MAC7B,OAAUC,IAAI,CAACC,KAAK,CAACF,QAAQ,GAAG,OAAS,CAAC;IAC5C,CAAC,MAAM,IAAIA,QAAQ,GAAG,GAAG,EAAE;MACzB,OAAUC,IAAI,CAACC,KAAK,CAACF,QAAQ,GAAG,IAAI,CAAC;IACvC;IAEA,YAAUA,QAAQ;EACpB,CAAC,EAAE,CAACb,KAAK,CAAC,CAAC;EAEXb,SAAS,CAAC,YAAM;IACda,KAAK,IACHU,YAAY,CAAC,UAACM,CAAC,EAAK;MAClBA,CAAC,IACCP,YAAY,CACVO,CAAC,GAAGhB,KAAK,GAAG,CAAC,GAAG,kBAAkB,GAAG,qBAAqB,CAC3D;MACH,OAAOA,KAAK;IACd,CAAC,CAAC;EACN,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,IAAMiB,eAAe,GAAGhC,OAAO,CAC7B;IAAA,oBACE,oBAAC,eAAe;MACd,SAAS,EAAEG,UAAU,CAAC,aAAa,EAAEa,SAAS,CAAE;MAChD,UAAU,EAAEO;IAAU,gBAEtB,oBAAC,UAAU;MAAC,EAAE,EAAEV;IAAU,EAAG,EAC5BE,KAAK,KAAK,IAAI,iBACb,oBAAC,gBAAgB;MAAC,IAAI,EAAE;IAAS,gBAC/B,oBAAC,yBAAyB;MACxB,GAAG,EAAEW,KAAM;MACX,OAAO,EAAE,GAAI;MACb,UAAU,EAAC;IAAsB,GAE/Bb,SAAS,CAA6BO,WAAW,CAACa,QAAQ,CAC1D,WAAW,CACZ,gBACC,oBAAC,QAAQ;MAAC,KAAK,EAAC;IAAW,GAAEP,KAAK,CAAY,gBAE9C,oBAAC,KAAK;MAAC,KAAK,EAAC;IAAW,GAAEA,KAAK,CAChC,CACyB,CAE/B,CACe;EAAA,CACnB,EACD,CAACV,SAAS,EAAEO,SAAS,EAAEV,SAAS,EAAEE,KAAK,EAAEW,KAAK,CAAC,CAChD;EAED,oBACE,oBAAC,OAAO;IACN,KAAK,EAAET,WAAW,WAAXA,WAAW,GAAI,EAAG;IACzB,OAAO,EAAE,CAACA,WAAY;IACtB,sBAAsB,EAAEC;EAAiB,GAExCc,eAAe,CACR;AAEd,CAAC;AAEDpB,SAAS,CAACQ,WAAW,GAAG,WAAW"}

package/dist/esm/components/Signifier/Styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"~~sources~~":["~~../../../../src/components/Signifier/~~Styles.ts"],"names":["styled","css","CSSTransition","BoxSizingStyle","FontStyle","StyledSignifier","div","props","$direction","displayName","StyledSignifierTransition","StyledIcon","svg"],"~~mappings~~":"~~AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,aAAT,QAA8B,wBAA9B;AACA,SAASC,cAAT,QAA+B,mBAA~~/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAEA,OAAO,IAAMC,eAAe,GAAGL,MAAM,CAACM,GAAV;AAAA;AAAA;AAAA,gDACtB;AAAA;AAAA;AAAA;AAAA,CADsB,EAExBF,SAFwB,EAGxBD,cAHwB,EAOxB,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,KAAqB,kBAArB,IACAP,GADA,8CADA;AAAA,CAPwB,EAcxB,UAACM,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,KAAqB,qBAArB,IACAP,GADA,8CADA;AAAA,CAdwB,CAArB;AAqBPI,eAAe,CAACI,WAAhB,GAA8B,iBAA9B;AAEA,OAAO,IAAMC,yBAAyB,GAAGV,MAAM,CAACE,aAAD,CAAT;AAAA;AAAA;AAAA,+WAA/~~B;AAoBPQ,yBAAyB,CAACD,WAA1B,GAAwC,2BAAxC;AAEA,OAAO,IAAME,UAAU,GAAGX,MAAM,CAACY,GAAV;AAAA;AAAA;AAAA,aACjB;AAAA;AAAA;AAAA;AAAA,CADiB,CAAhB;AAGPD,UAAU,CAACF,WAAX,GAAyB,YAAzB~~","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledSignifier = styled.div<{ $direction: string }>`\n ${tw`tw-inline-flex tw-items-center tw-text-theme-800`}\n ${FontStyle}\n ${BoxSizingStyle}\n\n cursor: default;\n\n ${(props) =>\n props.$direction === \"c-signifier--top\" &&\n css`\n --signifier-in: 60%;\n --signifier-out: -60%;\n `}\n\n ${(props) =>\n props.$direction === \"c-signifier--bottom\" &&\n css`\n --signifier-in: -60%;\n --signifier-out: 60%;\n `}\n`;\nStyledSignifier.displayName = \"StyledSignifier\";\n\nexport const StyledSignifierTransition = styled(CSSTransition)`\n &.c-signifier--animate-enter {\n opacity: 0;\n transform: translateY(var(--signifier-in));\n }\n &.c-signifier--animate-enter-active {\n opacity: 1;\n transform: translateY(0%);\n transition-duration: 300ms;\n }\n &.c-signifier--animate-exit {\n transform: translateY(0%);\n opacity: 1;\n }\n &.c-signifier--animate-exit-active {\n transform: translateY(var(--signifier-out));\n opacity: 0;\n transition-duration: 300ms;\n }\n`;\nStyledSignifierTransition.displayName = \"StyledSignifierTransition\";\n\nexport const StyledIcon = styled.svg`\n ${tw`tw-text-xs tw-mr-1`}\n`;\nStyledIcon.displayName = \"StyledIcon\";\n"],"~~file~~":"~~Styles.js~~"}
1	+ {"version":3,"file":"Styles.js","names":["styled","css","CSSTransition","BoxSizingStyle","FontStyle","StyledSignifier","div","props","$direction","displayName","StyledSignifierTransition","StyledIcon","svg"],"sources":["../../../../src/components/Signifier/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CSSTransition } from \"react-transition-group\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledSignifier = styled.div<{ $direction: string }>`\n ${tw`tw-inline-flex tw-items-center tw-text-theme-800`}\n ${FontStyle}\n ${BoxSizingStyle}\n\n cursor: default;\n\n ${(props) =>\n props.$direction === \"c-signifier--top\" &&\n css`\n --signifier-in: 60%;\n --signifier-out: -60%;\n `}\n\n ${(props) =>\n props.$direction === \"c-signifier--bottom\" &&\n css`\n --signifier-in: -60%;\n --signifier-out: 60%;\n `}\n`;\nStyledSignifier.displayName = \"StyledSignifier\";\n\nexport const StyledSignifierTransition = styled(CSSTransition)`\n &.c-signifier--animate-enter {\n opacity: 0;\n transform: translateY(var(--signifier-in));\n }\n &.c-signifier--animate-enter-active {\n opacity: 1;\n transform: translateY(0%);\n transition-duration: 300ms;\n }\n &.c-signifier--animate-exit {\n transform: translateY(0%);\n opacity: 1;\n }\n &.c-signifier--animate-exit-active {\n transform: translateY(var(--signifier-out));\n opacity: 0;\n transition-duration: 300ms;\n }\n`;\nStyledSignifierTransition.displayName = \"StyledSignifierTransition\";\n\nexport const StyledIcon = styled.svg`\n ${tw`tw-text-xs tw-mr-1`}\n`;\nStyledIcon.displayName = \"StyledIcon\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAE/C,SAASC,aAAa,QAAQ,wBAAwB;AACtD,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,SAAS,QAAQ,cAAc;AAExC,OAAO,IAAMC,eAAe,GAAGL,MAAM,CAACM,GAAG;EAAA;EAAA;AAAA,gDACnC;EAAA;EAAA;EAAA;AAAiD,CAAC,EACpDF,SAAS,EACTD,cAAc,EAId,UAACI,KAAK;EAAA,OACNA,KAAK,CAACC,UAAU,KAAK,kBAAkB,IACvCP,GAAG,8CAGF;AAAA,GAED,UAACM,KAAK;EAAA,OACNA,KAAK,CAACC,UAAU,KAAK,qBAAqB,IAC1CP,GAAG,8CAGF;AAAA,EACJ;AACDI,eAAe,CAACI,WAAW,GAAG,iBAAiB;AAE/C,OAAO,IAAMC,yBAAyB,GAAGV,MAAM,CAACE,aAAa,CAAC;EAAA;EAAA;AAAA,+WAmB7D;AACDQ,yBAAyB,CAACD,WAAW,GAAG,2BAA2B;AAEnE,OAAO,IAAME,UAAU,GAAGX,MAAM,CAACY,GAAG;EAAA;EAAA;AAAA,aAC9B;EAAA;EAAA;EAAA;AAAmB,CAAC,CACzB;AACDD,UAAU,CAACF,WAAW,GAAG,YAAY"}

package/dist/esm/components/Signifier/index.js.map CHANGED Viewed

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

package/dist/esm/components/Steppers/DateStepper/DateStepper.js CHANGED Viewed

@@ -8,52 +8,45 @@ import { DatePicker } from "../../DatePicker";
 import { customClassNames } from "../../DatePicker/ClassNames";
 import { StyledButton, StyledButtonGroup, StyledDiv, StyledMenu, StyledSpan } from "./Styles";
 import { ArrowRightIcon } from "../../Icons";
 /**
  * This component allow you to select date range. It accepts two parameters "from" and "to" as valid format
  * onChange and onBack and onForward it will return "from: Date" and "to: Date" as function arguments
  */
 export var DateStepper = function DateStepper(_ref) {
   var step = _ref.step,
-      formatCallback = _ref.formatCallback,
-      onChange = _ref.onChange,
-      from = _ref.from,
-      to = _ref.to,
-      onBack = _ref.onBack,
-      onForward = _ref.onForward,
-      minValue = _ref.minValue,
-      maxValue = _ref.maxValue,
-      className = _ref.className,
-      _ref$period = _ref.period,
-      period = _ref$period === void 0 ? "week" : _ref$period,
-      datePickerClass = _ref.datePickerClass,
-      _ref$withDatePicker = _ref.withDatePicker,
-      withDatePicker = _ref$withDatePicker === void 0 ? true : _ref$withDatePicker,
-      _ref$defaultMonth = _ref.defaultMonth,
-      defaultMonth = _ref$defaultMonth === void 0 ? new Date() : _ref$defaultMonth,
-      popperClassName = _ref.popperClassName,
-      _ref$position = _ref.position,
-      position = _ref$position === void 0 ? "bottom" : _ref$position;
+    formatCallback = _ref.formatCallback,
+    onChange = _ref.onChange,
+    from = _ref.from,
+    to = _ref.to,
+    onBack = _ref.onBack,
+    onForward = _ref.onForward,
+    minValue = _ref.minValue,
+    maxValue = _ref.maxValue,
+    className = _ref.className,
+    _ref$period = _ref.period,
+    period = _ref$period === void 0 ? "week" : _ref$period,
+    datePickerClass = _ref.datePickerClass,
+    _ref$withDatePicker = _ref.withDatePicker,
+    withDatePicker = _ref$withDatePicker === void 0 ? true : _ref$withDatePicker,
+    _ref$defaultMonth = _ref.defaultMonth,
+    defaultMonth = _ref$defaultMonth === void 0 ? new Date() : _ref$defaultMonth,
+    popperClassName = _ref.popperClassName,
+    _ref$position = _ref.position,
+    position = _ref$position === void 0 ? "bottom" : _ref$position;
   var _useState = useState(moment(from)),
-      fromDate = _useState[0],
-      setFromDate = _useState[1];
+    fromDate = _useState[0],
+    setFromDate = _useState[1];
   var _useState2 = useState(moment(to)),
-      toDate = _useState2[0],
-      setToDate = _useState2[1];
+    toDate = _useState2[0],
+    setToDate = _useState2[1];
   var _useState3 = useState(false),
-      showDatePicker = _useState3[0],
-      setShowDatePicker = _useState3[1];
+    showDatePicker = _useState3[0],
+    setShowDatePicker = _useState3[1];
   var _useState4 = useState(defaultMonth),
-      month = _useState4[0],
-      setMonth = _useState4[1];
+    month = _useState4[0],
+    setMonth = _useState4[1];
   var getDatesByPeriod = useCallback(function (interval) {
     var date = fromDate ? fromDate : moment();
     if (step === "daily") {
       date.add(interval, "days");
       return [date, date.clone()];
@@ -70,16 +63,13 @@ export var DateStepper = function DateStepper(_ref) {
       date.add(interval, "years");
       return [date.clone().startOf("year"), date.clone().endOf("year")];
     }
     return [date, date];
   }, [fromDate, period, step]);
   var getDateFormatted = useMemo(function () {
     if (formatCallback) {
       return formatCallback(fromDate.toDate(), toDate.toDate());
     }
     var actualYear = moment().year();
     var showWeekOrCustomDateFormat = function showWeekOrCustomDateFormat(start, end) {
       if (start.year() === actualYear && end.year() === actualYear) {
         return start.format("MMM DD") + " - " + end.format("MMM DD");
@@ -87,12 +77,10 @@ export var DateStepper = function DateStepper(_ref) {
         return start.format("MMM DD YYYY") + " - " + end.format("MMM DD YYYY");
       }
     };
     if (step === "daily") {
       if (fromDate.year() === actualYear) {
         return fromDate.format("MMM DD");
       }
       return fromDate.format("MMM DD YYYY");
     } else if (step === "weekly") {
       var startDate = fromDate.clone().startOf(period);
@@ -107,17 +95,14 @@ export var DateStepper = function DateStepper(_ref) {
     } else if (step === "custom") {
       return showWeekOrCustomDateFormat(fromDate, toDate);
     }
     return "";
   }, [fromDate, step, toDate, formatCallback, period]);
   var onChangeCallback = useCallback(function (amount) {
     var _getDatesByPeriod = getDatesByPeriod(amount),
-        newFrom = _getDatesByPeriod[0],
-        newTo = _getDatesByPeriod[1];
+      newFrom = _getDatesByPeriod[0],
+      newTo = _getDatesByPeriod[1];
     setFromDate(moment(newFrom));
     setToDate(moment(newTo));
     if (onChange) {
       onChange(newFrom.toDate(), newTo.toDate());
     }
@@ -127,7 +112,6 @@ export var DateStepper = function DateStepper(_ref) {
     var toDateTemp = dates == null ? void 0 : dates.to;
     setFromDate(moment(fromDateTemp));
     setToDate(moment(toDateTemp));
     if (onChange && fromDateTemp instanceof Date && toDateTemp instanceof Date) {
       onChange(fromDateTemp, toDateTemp);
     }
@@ -145,7 +129,6 @@ export var DateStepper = function DateStepper(_ref) {
         setToDate(moment(minValue));
       }
     }
     if (isAfterMaxDate) {
       if (step === "daily") {
         setFromDate(moment(maxValue));
@@ -157,9 +140,7 @@ export var DateStepper = function DateStepper(_ref) {
     if (isAfterMaxDate) {
       return;
     }
     onChangeCallback(1);
     if (onForward) {
       onForward(fromDate.toDate(), toDate.toDate());
     }
@@ -168,9 +149,7 @@ export var DateStepper = function DateStepper(_ref) {
     if (isBeforeMinDate) {
       return;
     }
     onChangeCallback(-1);
     if (onBack) {
       onBack(fromDate.toDate(), toDate.toDate());
     }
@@ -180,7 +159,6 @@ export var DateStepper = function DateStepper(_ref) {
   }, [step]);
   var handleShow = useCallback(function () {
     setShowDatePicker(!showDatePicker);
     if (fromDate) {
       setMonth(fromDate.toDate());
     }
@@ -195,7 +173,6 @@ export var DateStepper = function DateStepper(_ref) {
     setFromDate(moment(from));
     setToDate(moment(to));
   }, [from, to]);
   var dateStepperWidth = function dateStepperWidth(fromDay, toDay, range) {
     if (fromDay.year() !== moment().year() || toDay.year() !== moment().year()) {
       switch (range) {
@@ -204,7 +181,6 @@ export var DateStepper = function DateStepper(_ref) {
           return {
             minWidth: "122px"
           };
         case "weekly":
         case "custom":
           return {
@@ -212,25 +188,21 @@ export var DateStepper = function DateStepper(_ref) {
           };
       }
     }
     switch (range) {
       case "monthly":
         return {
           minWidth: "122px"
         };
       case "weekly":
       case "custom":
         return {
           minWidth: "182px"
         };
     }
     return {
       minWidth: "102px"
     };
   };
   var isDisabled = useCallback(function (day) {
     var dayFormat = moment(day).format("YYYY-MM-DD");
     var isBefore = maxValue instanceof Date && moment(moment(maxValue).format("YYYY-MM-DD")).isBefore(dayFormat);
@@ -239,7 +211,6 @@ export var DateStepper = function DateStepper(_ref) {
   }, [maxValue, minValue]);
   var modifiers = useMemo(function () {
     var _ref2;
     return _ref2 = {}, _ref2[customClassNames.disabled] = function (day) {
       return isDisabled(day);
     }, _ref2[customClassNames.nonWorkingDay] = function (day) {