npm - @drivy/cobalt - Versions diffs - 0.16.1 → 0.18.0 - Mend

@drivy/cobalt 0.16.1 → 0.18.0

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

Files changed (1066) hide show

package/components/Modal/ModalFooter.js CHANGED Viewed

@@ -1,8 +1,7 @@
 import React from 'react';
 import cx from 'classnames';
-var ModalFooter = function (_a) {
-    var children = _a.children, className = _a.className;
+const ModalFooter = ({ children, className }) => {
     return React.createElement("div", { className: cx("cobalt-modal-footer", className) }, children);
 };

package/components/Modal/ModalFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalFooter.js","sources":["../../../src/components/Modal/ModalFooter.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\"\nimport cx from \"classnames\"\n\nexport type ModalFooterPropsType = PropsWithChildren<{ className?: string }>\n\nconst ModalFooter = ({ children, className }: ModalFooterPropsType) => {\n return <div className={cx(\"cobalt-modal-footer\", className)}>{children}</div>\n}\n\nexport default ModalFooter\n"],"names":[],"mappings":";;;AAKM,~~IAAA~~,WAAW,GAAG,~~UAAC~~,~~EAA6C~~,~~EAAA;QAA3C,~~QAAQ,~~GAAA,EAAA,CAAA,QAAA,~~EAAE,SAAS,~~GAAA~~,~~EAAA,CAAA,SAAA,CAAA~~;~~AACxC~~,IAAA,OAAO,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAA,EAAG,QAAQ,CAAO,CAAA;AAC/E;;;;"}
1	+ {"version":3,"file":"ModalFooter.js","sources":["../../../src/components/Modal/ModalFooter.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\"\nimport cx from \"classnames\"\n\nexport type ModalFooterPropsType = PropsWithChildren<{ className?: string }>\n\nconst ModalFooter = ({ children, className }: ModalFooterPropsType) => {\n return <div className={cx(\"cobalt-modal-footer\", className)}>{children}</div>\n}\n\nexport default ModalFooter\n"],"names":[],"mappings":";;;AAKM,MAAA,WAAW,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAwB,KAAI;AACpE,IAAA,OAAO,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,SAAS,CAAC,EAAA,EAAG,QAAQ,CAAO,CAAA;AAC/E;;;;"}

package/components/Modal/ModalHeader.js CHANGED Viewed

@@ -2,15 +2,12 @@ import React from 'react';
 import VisuallyHidden from '@reach/visually-hidden';
 import { Icon } from '../Icon/index.js';
-var ModalHeader = function (_a) {
-    var title = _a.title, close = _a.close;
-    return (React.createElement("div", { className: "cobalt-modal-header" },
-        React.createElement("h2", { className: "cobalt-modal-header__title" }, title),
-        close && (React.createElement("button", { type: "button", className: "cobalt-modal-header__close-button", onClick: close },
-            React.createElement(VisuallyHidden, null, "Close"),
-            React.createElement("span", { "aria-hidden": true },
-                React.createElement(Icon, { source: "close", color: "graphiteLight" }))))));
-};
+const ModalHeader = ({ title, close, }) => (React.createElement("div", { className: "cobalt-modal-header" },
+    React.createElement("h2", { className: "cobalt-modal-header__title" }, title),
+    close && (React.createElement("button", { type: "button", className: "cobalt-modal-header__close-button", onClick: close },
+        React.createElement(VisuallyHidden, null, "Close"),
+        React.createElement("span", { "aria-hidden": true },
+            React.createElement(Icon, { source: "close", color: "graphiteLight" }))))));
 export { ModalHeader as default };
 //# sourceMappingURL=ModalHeader.js.map

package/components/Modal/ModalHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalHeader.js","sources":["../../../src/components/Modal/ModalHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport VisuallyHidden from \"@reach/visually-hidden\"\n\nimport { Icon } from \"../Icon\"\n\nconst ModalHeader = ({\n title,\n close,\n}: {\n title?: string\n close?: () => void\n}) => (\n <div className=\"cobalt-modal-header\">\n <h2 className=\"cobalt-modal-header__title\">{title}</h2>\n {close && (\n <button\n type=\"button\"\n className=\"cobalt-modal-header__close-button\"\n onClick={close}\n >\n <VisuallyHidden>Close</VisuallyHidden>\n <span aria-hidden>\n <Icon source=\"close\" color=\"graphiteLight\" />\n </span>\n </button>\n )}\n </div>\n)\n\nexport default ModalHeader\n"],"names":[],"mappings":";;;;~~AAKM~~,~~IAAA~~,WAAW,GAAG,~~UAAC~~,~~EAMpB~~,~~EAAA;QALC,~~KAAK,~~GAAA,EAAA,CAAA,KAAA,~~EACL,KAAK,~~GAAA~~,~~EAAA~~,~~CAAA~~,~~KAAA,~~CAAA~~;AAID~~,~~IAAA,QACJ,KAAA,CAAA,~~aAAA,CAAA,KAAA,EAAA,~~EAAK~~,SAAS,EAAC,qBAAqB,EAAA;AAClC,~~QAAA~~,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,4BAA4B,EAAA,EAAE,KAAK,CAAM;AACtD,~~QAAA~~,KAAK,KACJ,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,KAAK,EAAA;AAEd,~~YAAA~~,KAAA,CAAA,aAAA,CAAC,cAAc,EAAuB,IAAA,EAAA,OAAA,CAAA;AACtC,~~YAAA~~,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA;AACE,~~gBAAA~~,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAC,eAAe,~~EAAG~~,~~CAAA,~~CACxC,CACA,CACV,CACG~~,EACP;AAhBK~~;;;;"}
1	+ {"version":3,"file":"ModalHeader.js","sources":["../../../src/components/Modal/ModalHeader.tsx"],"sourcesContent":["import React from \"react\"\nimport VisuallyHidden from \"@reach/visually-hidden\"\n\nimport { Icon } from \"../Icon\"\n\nconst ModalHeader = ({\n title,\n close,\n}: {\n title?: string\n close?: () => void\n}) => (\n <div className=\"cobalt-modal-header\">\n <h2 className=\"cobalt-modal-header__title\">{title}</h2>\n {close && (\n <button\n type=\"button\"\n className=\"cobalt-modal-header__close-button\"\n onClick={close}\n >\n <VisuallyHidden>Close</VisuallyHidden>\n <span aria-hidden>\n <Icon source=\"close\" color=\"graphiteLight\" />\n </span>\n </button>\n )}\n </div>\n)\n\nexport default ModalHeader\n"],"names":[],"mappings":";;;;AAKA,MAAM,WAAW,GAAG,CAAC,EACnB,KAAK,EACL,KAAK,GAIN,MACC,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,qBAAqB,EAAA;AAClC,IAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAI,SAAS,EAAC,4BAA4B,EAAA,EAAE,KAAK,CAAM;AACtD,IAAA,KAAK,KACJ,KACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,mCAAmC,EAC7C,OAAO,EAAE,KAAK,EAAA;AAEd,QAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EAAuB,IAAA,EAAA,OAAA,CAAA;AACtC,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA;AACE,YAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAC,eAAe,GAAG,CACxC,CACA,CACV,CACG;;;;"}

package/components/Modal/index.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import { __assign } from '../../_virtual/_tslib.js';
 import React, { forwardRef, useRef, useEffect } from 'react';
 import cx from 'classnames';
 import { DialogOverlay, DialogContent } from '@reach/dialog';
@@ -11,26 +10,23 @@ import 'lodash.throttle';
 import { getScrollbarWidth } from '../utils/dom.js';
 // Only for the API, render nothing, we use ModalFooterInternal internally
-var ModalFooterAPI = function (_props) { return null; };
-var isModalFooterAPIComponent = function (component) {
-    return React.isValidElement(component) && component.type === ModalFooterAPI;
-};
-var _Modal = forwardRef(function (_a, ref) {
-    var ariaLabel = _a["aria-label"], children = _a.children, isOpen = _a.isOpen, close = _a.close, _b = _a.overflowHidden, overflowHidden = _b === void 0 ? true : _b, initialFocusRef = _a.initialFocusRef, bodySpacing = _a.bodySpacing, onDismissAttempt = _a.onDismissAttempt, onHidden = _a.onHidden, onShow = _a.onShow, title = _a.title, _c = _a.skipAnimation, skipAnimation = _c === void 0 ? { enter: false, leave: false } : _c;
-    var defaultBodyStyle = useRef({
+const ModalFooterAPI = (_props) => null;
+const isModalFooterAPIComponent = (component) => React.isValidElement(component) && component.type === ModalFooterAPI;
+const _Modal = forwardRef(({ ["aria-label"]: ariaLabel, children, isOpen, close, overflowHidden = true, initialFocusRef, bodySpacing, onDismissAttempt, onHidden, onShow, title, skipAnimation = { enter: false, leave: false }, }, ref) => {
+    const defaultBodyStyle = useRef({
         paddingRight: document.body.style.paddingRight,
         overflow: document.body.style.overflow,
         isRestored: false,
     });
-    var restoreDefaultBodyStyle = function () {
+    const restoreDefaultBodyStyle = () => {
         if (defaultBodyStyle.current && !defaultBodyStyle.current.isRestored) {
-            var _a = defaultBodyStyle.current, overflow = _a.overflow, paddingRight = _a.paddingRight;
+            const { overflow, paddingRight } = defaultBodyStyle.current;
             document.body.style.overflow = overflow;
             document.body.style.paddingRight = paddingRight;
             defaultBodyStyle.current.isRestored = true;
         }
     };
-    useEffect(function () {
+    useEffect(() => {
         // disable / enable body scroll
         // default reach ui solution to lock body scroll is broken with range inputs on mobile (no drag)
         // https://github.com/reach/reach-ui/issues/678
@@ -38,18 +34,18 @@ var _Modal = forwardRef(function (_a, ref) {
         // + fake scrollbar width to avoid visual layout shift
         if (isOpen) {
             defaultBodyStyle.current.isRestored = false;
-            document.body.style.paddingRight = "".concat(getScrollbarWidth() +
-                parseInt(window.getComputedStyle(document.body).paddingRight, 10), "px"); // to avoid visual shift due to removing an existing scrollbar
+            document.body.style.paddingRight = `${getScrollbarWidth() +
+                parseInt(window.getComputedStyle(document.body).paddingRight, 10)}px`; // to avoid visual shift due to removing an existing scrollbar
             document.body.style.overflow = "hidden";
         }
-        return function () {
+        return () => {
             isOpen && restoreDefaultBodyStyle();
         };
     }, [isOpen]);
-    var isMobile = useBreakpoint().isMobile;
-    var transformTransitionOut = isMobile ? 500 : -20;
-    var springConfig = { tension: 300, friction: 30, clamp: true };
-    var transition = useTransition(isOpen, {
+    const { isMobile } = useBreakpoint();
+    const transformTransitionOut = isMobile ? 500 : -20;
+    const springConfig = { tension: 300, friction: 30, clamp: true };
+    const transition = useTransition(isOpen, {
         from: {
             overlayOpacity: 0,
             modalTransform: transformTransitionOut,
@@ -66,51 +62,46 @@ var _Modal = forwardRef(function (_a, ref) {
             modalTransform: transformTransitionOut,
             config: springConfig,
         },
-        onStart: function () {
-            if (onShow)
-                onShow();
+        onStart: (_a, _b, isReady) => {
+            isReady && isOpen && onShow && onShow();
         },
-        onDestroyed: function (isTransitioned) {
+        onDestroyed: (isTransitioned) => {
             !isOpen && restoreDefaultBodyStyle();
             if (onHidden && isTransitioned)
                 onHidden();
         },
     });
-    var AnimatedDialogOverlay = animated(DialogOverlay);
-    var AnimatedDialogContent = animated(DialogContent);
-    var modalFooter = React.Children.toArray(children).find(function (c) {
-        return isModalFooterAPIComponent(c);
-    });
-    var header = null;
+    const AnimatedDialogOverlay = animated(DialogOverlay);
+    const AnimatedDialogContent = animated(DialogContent);
+    const modalFooter = React.Children.toArray(children).find((c) => isModalFooterAPIComponent(c));
+    let header = null;
     if (title || close) {
-        header = React.createElement(ModalHeader, __assign({ title: title }, (close ? { close: close } : {})));
+        header = React.createElement(ModalHeader, { title: title, ...(close ? { close } : {}) });
     }
-    var hasHeader = !!title || !!close;
-    var footer = null;
+    const hasHeader = !!title || !!close;
+    let footer = null;
     if (React.isValidElement(modalFooter)) {
-        footer = React.createElement(ModalFooter, __assign({}, modalFooter.props));
+        footer = React.createElement(ModalFooter, { ...modalFooter.props });
     }
-    var getDismissHandler = function (onClose) {
+    const getDismissHandler = (onClose) => {
         if (onClose)
             return onClose;
         if (onDismissAttempt)
             return onDismissAttempt;
         return;
     };
-    return (React.createElement(React.Fragment, null, transition(function (styles, isOpenState) {
-        return isOpenState && (React.createElement(AnimatedDialogOverlay, { initialFocusRef: initialFocusRef, onDismiss: getDismissHandler(close), className: "cobalt-modal__overlay", style: { opacity: styles.overlayOpacity }, onTouchEnd: function (e) { return e.stopPropagation(); }, onMouseUp: function (e) { return e.stopPropagation(); }, dangerouslyBypassScrollLock: true },
-            React.createElement(AnimatedDialogContent, { className: cx("cobalt-modal", {
-                    "cobalt-modal--desktop": !isMobile,
-                    "cobalt-modal--mobile": isMobile,
-                    "cobalt-modal--overflowHidden": overflowHidden,
-                }), "aria-label": ariaLabel, style: { translateY: styles.modalTransform }, ref: ref },
-                header,
-                React.createElement(ModalBody, { bodySpacing: bodySpacing, hasHeader: hasHeader, hasFooter: !!footer }, children),
-                footer)));
-    })));
+    return (React.createElement(React.Fragment, null, transition((styles, isOpenState) => isOpenState && (React.createElement(AnimatedDialogOverlay, { initialFocusRef: initialFocusRef, onDismiss: getDismissHandler(close), className: "cobalt-modal__overlay", style: { opacity: styles.overlayOpacity }, onTouchEnd: (e) => e.stopPropagation(), onMouseUp: (e) => e.stopPropagation(), dangerouslyBypassScrollLock: true },
+        React.createElement(AnimatedDialogContent, { className: cx("cobalt-modal", {
+                "cobalt-modal--desktop": !isMobile,
+                "cobalt-modal--mobile": isMobile,
+                "cobalt-modal--overflowHidden": overflowHidden,
+            }), "aria-label": ariaLabel, style: { translateY: styles.modalTransform }, ref: ref },
+            header,
+            React.createElement(ModalBody, { bodySpacing: bodySpacing, hasHeader: hasHeader, hasFooter: !!footer }, children),
+            footer))))));
 });
 _Modal.displayName = "Modal";
-var Modal = Object.assign(_Modal, { Footer: ModalFooterAPI });
+const Modal = Object.assign(_Modal, { Footer: ModalFooterAPI });
 export { ModalFooterAPI, Modal as default, isModalFooterAPIComponent };
 //# sourceMappingURL=index.js.map

package/components/Modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useRef } from \"react\"\nimport cx from \"classnames\"\nimport { DialogOverlay, DialogContent } from \"@reach/dialog\"\nimport { useTransition, animated } from \"@react-spring/web\"\n\nimport useBreakpoint from \"../../hooks/useBreakpoint\"\nimport ModalHeader from \"./ModalHeader\"\nimport ModalBody from \"./ModalBody\"\nimport ModalFooter, { ModalFooterPropsType } from \"./ModalFooter\"\nimport { getScrollbarWidth } from \"../utils/\"\n\nexport type ModalPropsType = {\n /*\n mandatory for A11y\n /\n [\"aria-label\"]: string\n /\n Function called to close the modal, providing it make the modal closeable\n /\n close?: () => void\n /\n React.ref of the element to focus first when the modal opens\n /\n initialFocusRef?: React.RefObject<HTMLElement>\n /\n State to show or hide the modal/dialog\n /\n isOpen: boolean\n /\n Action to fire if the user try to dismiss when the modal is not closeable\n /\n onDismissAttempt?: () => void\n /\n Listener called when the modal has been fully hidden\n /\n onHidden?: () => void\n /\n Listener called when the modal begins to show\n /\n onShow?: () => void\n /\n Modal title\n /\n title?: string\n /\n Disable/Enable body paddings (enabled by default)\n /\n bodySpacing?: boolean\n /\n Disable/Enable hidding overflowing absolute elements (enabled by default)\n /\n overflowHidden?: boolean\n /\n Disable enter/leave animation (animation enabled by default)\n /\n skipAnimation?: {\n enter: boolean\n leave: boolean\n }\n /\n Modal body content\n */\n children: React.ReactNode\n}\n\n// Only for the API, render nothing, we use ModalFooterInternal internally\nexport const ModalFooterAPI = (_props: ModalFooterPropsType) => null\n\nexport const isModalFooterAPIComponent = (\n component: React.ReactNode\n): component is React.ReactElement<ModalFooterPropsType> =>\n React.isValidElement(component) && component.type === ModalFooterAPI\n\nconst _Modal = forwardRef<HTMLDivElement, ModalPropsType>(\n (\n {\n [\"aria-label\"]: ariaLabel,\n children,\n isOpen,\n close,\n overflowHidden = true,\n initialFocusRef,\n bodySpacing,\n onDismissAttempt,\n onHidden,\n onShow,\n title,\n skipAnimation = { enter: false, leave: false },\n }: ModalPropsType,\n ref\n ) => {\n const defaultBodyStyle = useRef({\n paddingRight: document.body.style.paddingRight,\n overflow: document.body.style.overflow,\n isRestored: false,\n })\n\n const restoreDefaultBodyStyle = () => {\n if (defaultBodyStyle.current && !defaultBodyStyle.current.isRestored) {\n const { overflow, paddingRight } = defaultBodyStyle.current\n\n document.body.style.overflow = overflow\n document.body.style.paddingRight = paddingRight\n\n defaultBodyStyle.current.isRestored = true\n }\n }\n\n useEffect(() => {\n // disable / enable body scroll\n // default reach ui solution to lock body scroll is broken with range inputs on mobile (no drag)\n // https://github.com/reach/reach-ui/issues/678\n // dangerouslyBypassScrollLock is used to disabled it\n // + fake scrollbar width to avoid visual layout shift\n if (isOpen) {\n defaultBodyStyle.current.isRestored = false\n\n document.body.style.paddingRight = `${\n getScrollbarWidth() +\n parseInt(window.getComputedStyle(document.body).paddingRight, 10)\n }px` // to avoid visual shift due to removing an existing scrollbar\n\n document.body.style.overflow = \"hidden\"\n }\n return () => {\n isOpen && restoreDefaultBodyStyle()\n }\n }, [isOpen])\n\n const { isMobile } = useBreakpoint()\n\n const transformTransitionOut = isMobile ? 500 : -20\n\n const springConfig = { tension: 300, friction: 30, clamp: true }\n\n const transition = useTransition(isOpen, {\n from: {\n overlayOpacity: 0,\n modalTransform: transformTransitionOut,\n },\n enter: {\n immediate: skipAnimation.enter,\n overlayOpacity: 1,\n modalTransform: 0,\n config: springConfig,\n },\n leave: {\n immediate: skipAnimation.leave,\n overlayOpacity: 0,\n modalTransform: transformTransitionOut,\n config: springConfig,\n },\n onStart: () => {\n if (onShow) onShow()\n },\n onDestroyed: (isTransitioned) => {\n !isOpen && restoreDefaultBodyStyle()\n if (onHidden && isTransitioned) onHidden()\n },\n })\n\n const AnimatedDialogOverlay = animated(DialogOverlay)\n const AnimatedDialogContent = animated(DialogContent)\n\n const modalFooter = React.Children.toArray(children).find((c) =>\n isModalFooterAPIComponent(c)\n )\n\n let header: React.ReactNode = null\n if (title \|\| close) {\n header = <ModalHeader title={title} {...(close ? { close } : {})} />\n }\n const hasHeader = !!title \|\| !!close\n\n let footer: React.ReactNode = null\n if (React.isValidElement(modalFooter)) {\n footer = <ModalFooter {...modalFooter.props} />\n }\n\n const getDismissHandler = (onClose?: ModalPropsType[\"close\"]) => {\n if (onClose) return onClose\n if (onDismissAttempt) return onDismissAttempt\n return\n }\n\n return (\n <>\n {transition(\n (styles, isOpenState) =>\n isOpenState && (\n <AnimatedDialogOverlay\n initialFocusRef={initialFocusRef}\n onDismiss={getDismissHandler(close)}\n className=\"cobalt-modal__overlay\"\n style={{ opacity: styles.overlayOpacity }}\n onTouchEnd={(e) => e.stopPropagation()}\n onMouseUp={(e) => e.stopPropagation()}\n dangerouslyBypassScrollLock\n >\n <AnimatedDialogContent\n className={cx(\"cobalt-modal\", {\n \"cobalt-modal--desktop\": !isMobile,\n \"cobalt-modal--mobile\": isMobile,\n \"cobalt-modal--overflowHidden\": overflowHidden,\n })}\n aria-label={ariaLabel}\n style={{ translateY: styles.modalTransform }}\n ref={ref}\n >\n {header}\n <ModalBody\n bodySpacing={bodySpacing}\n hasHeader={hasHeader}\n hasFooter={!!footer}\n >\n {children}\n </ModalBody>\n {footer}\n </AnimatedDialogContent>\n </AnimatedDialogOverlay>\n )\n )}\n </>\n )\n }\n)\n\n_Modal.displayName = \"Modal\"\n\nconst Modal = Object.assign(_Modal, { Footer: ModalFooterAPI })\n\nexport default Modal\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useRef } from \"react\"\nimport cx from \"classnames\"\nimport { DialogOverlay, DialogContent } from \"@reach/dialog\"\nimport { useTransition, animated } from \"@react-spring/web\"\n\nimport useBreakpoint from \"../../hooks/useBreakpoint\"\nimport ModalHeader from \"./ModalHeader\"\nimport ModalBody from \"./ModalBody\"\nimport ModalFooter, { ModalFooterPropsType } from \"./ModalFooter\"\nimport { getScrollbarWidth } from \"../utils/\"\n\nexport type ModalPropsType = {\n /*\n mandatory for A11y\n /\n [\"aria-label\"]: string\n /\n Function called to close the modal, providing it make the modal closeable\n /\n close?: () => void\n /\n React.ref of the element to focus first when the modal opens\n /\n initialFocusRef?: React.RefObject<HTMLElement>\n /\n State to show or hide the modal/dialog\n /\n isOpen: boolean\n /\n Action to fire if the user try to dismiss when the modal is not closeable\n /\n onDismissAttempt?: () => void\n /\n Listener called when the modal has been fully hidden\n /\n onHidden?: () => void\n /\n Listener called when the modal begins to show\n /\n onShow?: () => void\n /\n Modal title\n /\n title?: string\n /\n Disable/Enable body paddings (enabled by default)\n /\n bodySpacing?: boolean\n /\n Disable/Enable hidding overflowing absolute elements (enabled by default)\n /\n overflowHidden?: boolean\n /\n Disable enter/leave animation (animation enabled by default)\n /\n skipAnimation?: {\n enter: boolean\n leave: boolean\n }\n /\n Modal body content\n */\n children: React.ReactNode\n}\n\n// Only for the API, render nothing, we use ModalFooterInternal internally\nexport const ModalFooterAPI = (_props: ModalFooterPropsType) => null\n\nexport const isModalFooterAPIComponent = (\n component: React.ReactNode\n): component is React.ReactElement<ModalFooterPropsType> =>\n React.isValidElement(component) && component.type === ModalFooterAPI\n\nconst _Modal = forwardRef<HTMLDivElement, ModalPropsType>(\n (\n {\n [\"aria-label\"]: ariaLabel,\n children,\n isOpen,\n close,\n overflowHidden = true,\n initialFocusRef,\n bodySpacing,\n onDismissAttempt,\n onHidden,\n onShow,\n title,\n skipAnimation = { enter: false, leave: false },\n }: ModalPropsType,\n ref\n ) => {\n const defaultBodyStyle = useRef({\n paddingRight: document.body.style.paddingRight,\n overflow: document.body.style.overflow,\n isRestored: false,\n })\n\n const restoreDefaultBodyStyle = () => {\n if (defaultBodyStyle.current && !defaultBodyStyle.current.isRestored) {\n const { overflow, paddingRight } = defaultBodyStyle.current\n\n document.body.style.overflow = overflow\n document.body.style.paddingRight = paddingRight\n\n defaultBodyStyle.current.isRestored = true\n }\n }\n\n useEffect(() => {\n // disable / enable body scroll\n // default reach ui solution to lock body scroll is broken with range inputs on mobile (no drag)\n // https://github.com/reach/reach-ui/issues/678\n // dangerouslyBypassScrollLock is used to disabled it\n // + fake scrollbar width to avoid visual layout shift\n if (isOpen) {\n defaultBodyStyle.current.isRestored = false\n\n document.body.style.paddingRight = `${\n getScrollbarWidth() +\n parseInt(window.getComputedStyle(document.body).paddingRight, 10)\n }px` // to avoid visual shift due to removing an existing scrollbar\n\n document.body.style.overflow = \"hidden\"\n }\n return () => {\n isOpen && restoreDefaultBodyStyle()\n }\n }, [isOpen])\n\n const { isMobile } = useBreakpoint()\n\n const transformTransitionOut = isMobile ? 500 : -20\n\n const springConfig = { tension: 300, friction: 30, clamp: true }\n\n const transition = useTransition(isOpen, {\n from: {\n overlayOpacity: 0,\n modalTransform: transformTransitionOut,\n },\n enter: {\n immediate: skipAnimation.enter,\n overlayOpacity: 1,\n modalTransform: 0,\n config: springConfig,\n },\n leave: {\n immediate: skipAnimation.leave,\n overlayOpacity: 0,\n modalTransform: transformTransitionOut,\n config: springConfig,\n },\n onStart: (_a: unknown, _b: unknown, isReady: boolean) => {\n isReady && isOpen && onShow && onShow()\n },\n onDestroyed: (isTransitioned) => {\n !isOpen && restoreDefaultBodyStyle()\n if (onHidden && isTransitioned) onHidden()\n },\n })\n\n const AnimatedDialogOverlay = animated(DialogOverlay)\n const AnimatedDialogContent = animated(DialogContent)\n\n const modalFooter = React.Children.toArray(children).find((c) =>\n isModalFooterAPIComponent(c)\n )\n\n let header: React.ReactNode = null\n if (title \|\| close) {\n header = <ModalHeader title={title} {...(close ? { close } : {})} />\n }\n const hasHeader = !!title \|\| !!close\n\n let footer: React.ReactNode = null\n if (React.isValidElement(modalFooter)) {\n footer = <ModalFooter {...modalFooter.props} />\n }\n\n const getDismissHandler = (onClose?: ModalPropsType[\"close\"]) => {\n if (onClose) return onClose\n if (onDismissAttempt) return onDismissAttempt\n return\n }\n\n return (\n <>\n {transition(\n (styles, isOpenState) =>\n isOpenState && (\n <AnimatedDialogOverlay\n initialFocusRef={initialFocusRef}\n onDismiss={getDismissHandler(close)}\n className=\"cobalt-modal__overlay\"\n style={{ opacity: styles.overlayOpacity }}\n onTouchEnd={(e) => e.stopPropagation()}\n onMouseUp={(e) => e.stopPropagation()}\n dangerouslyBypassScrollLock\n >\n <AnimatedDialogContent\n className={cx(\"cobalt-modal\", {\n \"cobalt-modal--desktop\": !isMobile,\n \"cobalt-modal--mobile\": isMobile,\n \"cobalt-modal--overflowHidden\": overflowHidden,\n })}\n aria-label={ariaLabel}\n style={{ translateY: styles.modalTransform }}\n ref={ref}\n >\n {header}\n <ModalBody\n bodySpacing={bodySpacing}\n hasHeader={hasHeader}\n hasFooter={!!footer}\n >\n {children}\n </ModalBody>\n {footer}\n </AnimatedDialogContent>\n </AnimatedDialogOverlay>\n )\n )}\n </>\n )\n }\n)\n\n_Modal.displayName = \"Modal\"\n\nconst Modal = Object.assign(_Modal, { Footer: ModalFooterAPI })\n\nexport default Modal\n"],"names":[],"mappings":"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"}

package/components/Note/index.js CHANGED Viewed

@@ -1,12 +1,9 @@
 import React from 'react';
 import cx from 'classnames';
-var Note = function (_a) {
-    var children = _a.children, _b = _a.fullWidth, fullWidth = _b === void 0 ? false : _b, className = _a.className;
-    return (React.createElement("div", { className: cx("cobalt-Note", className, {
-            "cobalt-Note--fullWidth": fullWidth,
-        }) }, children));
-};
+const Note = ({ children, fullWidth = false, className }) => (React.createElement("div", { className: cx("cobalt-Note", className, {
+        "cobalt-Note--fullWidth": fullWidth,
+    }) }, children));
 export { Note, Note as default };
 //# sourceMappingURL=index.js.map

package/components/Note/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/Note/index.tsx"],"sourcesContent":["import React from \"react\"\nimport cx from \"classnames\"\n\nexport interface NoteProps {\n children: React.ReactNode\n /*\n will fill available width\n * @default false\n */\n fullWidth?: boolean\n className?: string\n}\n\nexport const Note = ({ children, fullWidth = false, className }: NoteProps) => (\n <div\n className={cx(\"cobalt-Note\", className, {\n \"cobalt-Note--fullWidth\": fullWidth,\n })}\n >\n {children}\n </div>\n)\n\nexport default Note\n"],"names":[],"mappings":";;;~~AAaO~~,~~IAAM~~,IAAI,GAAG,~~UAAC~~,~~EAAqD~~,~~EAAA;QAAnD,~~QAAQ,~~GAAA,EAAA,CAAA,QAAA,~~EAAE,~~EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,~~SAAS,~~mBAAG~~,KAAK,~~GAAA,EAAA,~~EAAE,SAAS,~~GAAA~~,~~EAAA~~,CAAA,~~SAAA~~,CAAA~~;IAAkB~~,~~QAC7E~~,~~6BACE~~,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE;AACtC,~~YAAA~~,wBAAwB,EAAE,SAAS;~~SACpC~~,CAAC,EAAA,~~EAED,~~QAAQ,CACL~~,EACP;AAR8E~~;;;;"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/Note/index.tsx"],"sourcesContent":["import React from \"react\"\nimport cx from \"classnames\"\n\nexport interface NoteProps {\n children: React.ReactNode\n /*\n will fill available width\n * @default false\n */\n fullWidth?: boolean\n className?: string\n}\n\nexport const Note = ({ children, fullWidth = false, className }: NoteProps) => (\n <div\n className={cx(\"cobalt-Note\", className, {\n \"cobalt-Note--fullWidth\": fullWidth,\n })}\n >\n {children}\n </div>\n)\n\nexport default Note\n"],"names":[],"mappings":";;;AAaa,MAAA,IAAI,GAAG,CAAC,EAAE,QAAQ,EAAE,SAAS,GAAG,KAAK,EAAE,SAAS,EAAa,MACxE,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,SAAS,EAAE;AACtC,QAAA,wBAAwB,EAAE,SAAS;AACpC,KAAA,CAAC,EAED,EAAA,QAAQ,CACL;;;;"}

package/components/PhotoDropzone/index.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import { __read, __awaiter, __generator } from '../../_virtual/_tslib.js';
 import VisuallyHidden from '@reach/visually-hidden';
 import React, { useRef, useState } from 'react';
 import cx from 'classnames';
@@ -10,46 +9,43 @@ import BinIcon from '../Icon/__generated__/BinIcon.js';
 import PlusIcon from '../Icon/__generated__/PlusIcon.js';
 import LoadingIcon from '../Icon/__generated__/LoadingIcon.js';
-var ACCEPTED_MAX_SIZE_MB = 10;
-var ACCEPTED_PHOTOS_TYPES = ["jpg", "jpeg", "png", "gif"];
-var ERROR_DISPLAY_TIME = 6000;
-var ACCEPTED_TYPES_LOCALE_STRING = ACCEPTED_PHOTOS_TYPES.join(", ");
-var preventEventDefaults = function (e) {
+const ACCEPTED_MAX_SIZE_MB = 10;
+const ACCEPTED_PHOTOS_TYPES = ["jpg", "jpeg", "png", "gif"];
+const ERROR_DISPLAY_TIME = 6000;
+const ACCEPTED_TYPES_LOCALE_STRING = ACCEPTED_PHOTOS_TYPES.join(", ");
+const preventEventDefaults = (e) => {
     e.preventDefault && e.preventDefault();
     e.stopPropagation && e.stopPropagation();
 };
-var isEnterOrSpaceKey = function (event) {
-    return event.key === "Enter" || event.key === " ";
-};
-var PhotoDropzone = function (_a) {
-    var className = _a.className, description = _a.description, deletePopoverContent = _a.deletePopoverContent, errorContent = _a.errorContent, onDropped = _a.onDropped, onPhotoDelete = _a.onPhotoDelete, _b = _a.initialImageUrl, initialImageUrl = _b === void 0 ? "" : _b;
-    var fileInputRef = useRef(null);
-    var deleteButtonRef = useRef(null);
-    var _c = __read(useState(false), 2), isDragging = _c[0], setIsDragging = _c[1];
-    var _d = __read(useState(false), 2), isLoading = _d[0], setIsLoading = _d[1];
-    var _e = __read(useState(false), 2), isErrored = _e[0], setIsErrored = _e[1];
-    var _f = __read(useState(initialImageUrl), 2), imagePreviewUrl = _f[0], setImagePreviewUrl = _f[1];
-    var _g = __read(useState(false), 2), displayDeletion = _g[0], setDisplayDeletion = _g[1];
-    var _h = __read(useState(false), 2), showDeletePopover = _h[0], setShowDeletePopover = _h[1];
-    var openDeletePopover = function (event) {
+const isEnterOrSpaceKey = (event) => event.key === "Enter" || event.key === " ";
+const PhotoDropzone = ({ className, description, deletePopoverContent, errorContent, onDropped, onPhotoDelete, initialImageUrl = "", }) => {
+    const fileInputRef = useRef(null);
+    const deleteButtonRef = useRef(null);
+    const [isDragging, setIsDragging] = useState(false);
+    const [isLoading, setIsLoading] = useState(false);
+    const [isErrored, setIsErrored] = useState(false);
+    const [imagePreviewUrl, setImagePreviewUrl] = useState(initialImageUrl);
+    const [displayDeletion, setDisplayDeletion] = useState(false);
+    const [showDeletePopover, setShowDeletePopover] = useState(false);
+    const openDeletePopover = (event) => {
         event && preventEventDefaults(event);
         setShowDeletePopover(true);
     };
-    var closeDeletePopover = function (event) {
+    const closeDeletePopover = (event) => {
         event && preventEventDefaults(event);
         setShowDeletePopover(false);
     };
-    var onDropzoneMouseEnter = function (event) {
+    const onDropzoneMouseEnter = (event) => {
         event && preventEventDefaults(event);
         if (imagePreviewUrl)
             setDisplayDeletion(true);
     };
-    var onDropzoneMouseLeave = function (event) {
+    const onDropzoneMouseLeave = (event) => {
         event && preventEventDefaults(event);
         if (displayDeletion && !showDeletePopover)
             setDisplayDeletion(false);
     };
-    var onDropzoneClick = function (event) {
+    const onDropzoneClick = (event) => {
         var _a;
         event && preventEventDefaults(event);
         if (isLoading)
@@ -63,91 +59,80 @@ var PhotoDropzone = function (_a) {
         }
         (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
     };
-    var onDropzoneKey = function (event) {
+    const onDropzoneKey = (event) => {
         if (showDeletePopover)
             return;
         if (isEnterOrSpaceKey(event)) {
             onDropzoneClick();
         }
     };
-    var onDeleteKey = function (event) {
+    const onDeleteKey = (event) => {
         if (isEnterOrSpaceKey(event)) {
             openDeletePopover(event);
         }
     };
-    var onDelete = function () {
+    const onDelete = () => {
         if (fileInputRef.current)
             fileInputRef.current.value = "";
         closeDeletePopover();
         setImagePreviewUrl("");
         onPhotoDelete && onPhotoDelete();
     };
-    var onDragEnter = function (event) {
+    const onDragEnter = (event) => {
         preventEventDefaults(event);
         if (isErrored)
             setIsErrored(false);
         !imagePreviewUrl && setIsDragging(true);
     };
-    var onDragLeave = function (event) {
+    const onDragLeave = (event) => {
         preventEventDefaults(event);
         setIsDragging(false);
     };
-    var processFile = function (fileToProcess) { return __awaiter(void 0, void 0, void 0, function () {
-        var isValidFile, imageSrc;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    setIsDragging(false);
-                    setIsErrored(false);
-                    setIsLoading(true);
-                    return [4 /*yield*/, validateFile(fileToProcess, function (fileToValidate, extension) {
-                            var maxFileSize = ACCEPTED_MAX_SIZE_MB * 1000 * 1000;
-                            var acceptedFileTypes = ACCEPTED_PHOTOS_TYPES;
-                            if (fileToValidate.size > maxFileSize) {
-                                return false;
-                            }
-                            else if (!extension || !acceptedFileTypes.includes(extension)) {
-                                return false;
-                            }
-                            else {
-                                return true;
-                            }
-                        })];
-                case 1:
-                    isValidFile = _a.sent();
-                    if (!isValidFile) return [3 /*break*/, 3];
-                    imageSrc = URL.createObjectURL(fileToProcess);
-                    setImagePreviewUrl(imageSrc);
-                    return [4 /*yield*/, onDropped(fileToProcess)];
-                case 2:
-                    _a.sent();
-                    setIsLoading(false);
-                    return [3 /*break*/, 4];
-                case 3:
-                    setIsLoading(false);
-                    setIsErrored(true);
-                    setTimeout(function () {
-                        setIsErrored(false);
-                    }, ERROR_DISPLAY_TIME);
-                    _a.label = 4;
-                case 4: return [2 /*return*/];
+    const processFile = async (fileToProcess) => {
+        setIsDragging(false);
+        setIsErrored(false);
+        setIsLoading(true);
+        const isValidFile = await validateFile(fileToProcess, (fileToValidate, extension) => {
+            const maxFileSize = ACCEPTED_MAX_SIZE_MB * 1000 * 1000;
+            const acceptedFileTypes = ACCEPTED_PHOTOS_TYPES;
+            if (fileToValidate.size > maxFileSize) {
+                return false;
+            }
+            else if (!extension || !acceptedFileTypes.includes(extension)) {
+                return false;
+            }
+            else {
+                return true;
             }
         });
-    }); };
-    var onFileInputChanged = function (event) {
+        if (isValidFile) {
+            const imageSrc = URL.createObjectURL(fileToProcess);
+            setImagePreviewUrl(imageSrc);
+            await onDropped(fileToProcess);
+            setIsLoading(false);
+        }
+        else {
+            setIsLoading(false);
+            setIsErrored(true);
+            setTimeout(() => {
+                setIsErrored(false);
+            }, ERROR_DISPLAY_TIME);
+        }
+    };
+    const onFileInputChanged = (event) => {
         var _a;
         if ((_a = event.target.files) === null || _a === void 0 ? void 0 : _a.length) {
             processFile(event.target.files[0]);
         }
     };
-    var onDrop = function (event) {
+    const onDrop = (event) => {
         var _a, _b;
         preventEventDefaults(event);
         if (((_b = (_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b.length) && !imagePreviewUrl) {
             processFile(event.dataTransfer.files[0]);
         }
     };
-    var onDeleteButtonClick = showDeletePopover
+    const onDeleteButtonClick = showDeletePopover
         ? closeDeletePopover
         : openDeletePopover;
     return (React.createElement("div", { tabIndex: 0, className: cx("cobalt-photo-dropzone", className, {
@@ -182,7 +167,7 @@ var PhotoDropzone = function (_a) {
                 React.createElement("p", null, description),
                 React.createElement(PlusIcon, null)))),
         React.createElement(VisuallyHidden, null,
-            React.createElement("input", { ref: fileInputRef, type: "file", onChange: onFileInputChanged, accept: ACCEPTED_PHOTOS_TYPES.map(function (ext) { return ".".concat(ext); }).join(","), multiple: false }))));
+            React.createElement("input", { ref: fileInputRef, type: "file", onChange: onFileInputChanged, accept: ACCEPTED_PHOTOS_TYPES.map((ext) => `.${ext}`).join(","), multiple: false }))));
 };
 export { PhotoDropzone as default };

package/components/PhotoDropzone/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/PhotoDropzone/index.tsx"],"sourcesContent":["import VisuallyHidden from \"@reach/visually-hidden\"\nimport React, {\n useState,\n DragEvent as ReactDragEvent,\n useRef,\n TouchEvent as ReactTouchEvent,\n ChangeEvent as ReactChangeEvent,\n MouseEvent as ReactMouseEvent,\n KeyboardEvent as ReactKeyboardEvent,\n ReactNode,\n} from \"react\"\nimport cx from \"classnames\"\nimport {\n PlusIcon,\n BinIcon,\n LoadingIcon,\n ContextualWarningCircleFilledIcon,\n} from \"../Icon\"\nimport { validateFile } from \"../utils/validateFile\"\nimport Popover from \"../Popover\"\n\nconst ACCEPTED_MAX_SIZE_MB = 10\nconst ACCEPTED_PHOTOS_TYPES = [\"jpg\", \"jpeg\", \"png\", \"gif\"]\nconst ERROR_DISPLAY_TIME = 6000\nconst ACCEPTED_TYPES_LOCALE_STRING = ACCEPTED_PHOTOS_TYPES.join(\", \")\n\nexport type PhotoDropzonePropsType = {\n className?: string\n description: string\n deletePopoverContent: (onDelete: () => void, close: () => void) => ReactNode\n errorContent: (acceptedTypes: string, maxFileSize: number) => ReactNode\n onDropped: (file: File) => Promise<void> \| void\n onPhotoDelete?: () => void\n initialImageUrl?: string\n}\n\nconst preventEventDefaults = (\n e: ReactDragEvent \| ReactMouseEvent \| ReactKeyboardEvent \| ReactTouchEvent\n) => {\n e.preventDefault && e.preventDefault()\n e.stopPropagation && e.stopPropagation()\n}\n\nconst isEnterOrSpaceKey = (event: ReactKeyboardEvent) =>\n event.key === \"Enter\" \|\| event.key === \" \"\n\nconst PhotoDropzone = ({\n className,\n description,\n deletePopoverContent,\n errorContent,\n onDropped,\n onPhotoDelete,\n initialImageUrl = \"\",\n}: PhotoDropzonePropsType) => {\n const fileInputRef = useRef<HTMLInputElement>(null)\n const deleteButtonRef = useRef<HTMLButtonElement>(null)\n const [isDragging, setIsDragging] = useState(false)\n const [isLoading, setIsLoading] = useState(false)\n const [isErrored, setIsErrored] = useState(false)\n const [imagePreviewUrl, setImagePreviewUrl] = useState(initialImageUrl)\n const [displayDeletion, setDisplayDeletion] = useState(false)\n const [showDeletePopover, setShowDeletePopover] = useState(false)\n\n const openDeletePopover = (\n event?: ReactMouseEvent \| ReactKeyboardEvent \| ReactTouchEvent\n ) => {\n event && preventEventDefaults(event)\n setShowDeletePopover(true)\n }\n const closeDeletePopover = (event?: ReactMouseEvent \| ReactTouchEvent) => {\n event && preventEventDefaults(event)\n setShowDeletePopover(false)\n }\n\n const onDropzoneMouseEnter = (event?: ReactMouseEvent) => {\n event && preventEventDefaults(event)\n if (imagePreviewUrl) setDisplayDeletion(true)\n }\n\n const onDropzoneMouseLeave = (event?: ReactMouseEvent) => {\n event && preventEventDefaults(event)\n if (displayDeletion && !showDeletePopover) setDisplayDeletion(false)\n }\n\n const onDropzoneClick = (event?: ReactMouseEvent \| ReactTouchEvent) => {\n event && preventEventDefaults(event)\n if (isLoading) return\n if (isErrored) setIsErrored(false)\n if (imagePreviewUrl) {\n if (showDeletePopover) closeDeletePopover()\n return setDisplayDeletion(!displayDeletion)\n }\n fileInputRef.current?.click()\n }\n\n const onDropzoneKey = (event: ReactKeyboardEvent) => {\n if (showDeletePopover) return\n if (isEnterOrSpaceKey(event)) {\n onDropzoneClick()\n }\n }\n\n const onDeleteKey = (event: ReactKeyboardEvent) => {\n if (isEnterOrSpaceKey(event)) {\n openDeletePopover(event)\n }\n }\n\n const onDelete = () => {\n if (fileInputRef.current) fileInputRef.current.value = \"\"\n closeDeletePopover()\n setImagePreviewUrl(\"\")\n onPhotoDelete && onPhotoDelete()\n }\n\n const onDragEnter = (event: ReactDragEvent) => {\n preventEventDefaults(event)\n if (isErrored) setIsErrored(false)\n !imagePreviewUrl && setIsDragging(true)\n }\n\n const onDragLeave = (event: ReactDragEvent) => {\n preventEventDefaults(event)\n setIsDragging(false)\n }\n\n const processFile = async (fileToProcess: File) => {\n setIsDragging(false)\n setIsErrored(false)\n setIsLoading(true)\n\n const isValidFile = await validateFile(\n fileToProcess,\n (fileToValidate, extension) => {\n const maxFileSize = ACCEPTED_MAX_SIZE_MB * 1000 * 1000\n const acceptedFileTypes = ACCEPTED_PHOTOS_TYPES\n\n if (fileToValidate.size > maxFileSize) {\n return false\n } else if (!extension \|\| !acceptedFileTypes.includes(extension)) {\n return false\n } else {\n return true\n }\n }\n )\n\n if (isValidFile) {\n const imageSrc = URL.createObjectURL(fileToProcess)\n setImagePreviewUrl(imageSrc)\n await onDropped(fileToProcess)\n setIsLoading(false)\n } else {\n setIsLoading(false)\n setIsErrored(true)\n setTimeout(() => {\n setIsErrored(false)\n }, ERROR_DISPLAY_TIME)\n }\n }\n\n const onFileInputChanged = (event: ReactChangeEvent<HTMLInputElement>) => {\n if (event.target.files?.length) {\n processFile(event.target.files[0])\n }\n }\n\n const onDrop = (event: ReactDragEvent<HTMLDivElement>) => {\n preventEventDefaults(event)\n if (event.dataTransfer?.files?.length && !imagePreviewUrl) {\n processFile(event.dataTransfer.files[0])\n }\n }\n\n const onDeleteButtonClick = showDeletePopover\n ? closeDeletePopover\n : openDeletePopover\n\n return (\n <div\n tabIndex={0}\n className={cx(\"cobalt-photo-dropzone\", className, {\n \"cobalt-photo-dropzone--filled\": imagePreviewUrl,\n \"cobalt-photo-dropzone--dragging\": isDragging,\n \"cobalt-photo-dropzone--loading\": isLoading,\n \"cobalt-photo-dropzone--errored\": isErrored,\n })}\n onMouseEnter={onDropzoneMouseEnter}\n onMouseLeave={onDropzoneMouseLeave}\n onDragEnter={onDragEnter}\n onDragLeave={onDragLeave}\n // Not on click because we also use mouseEnter listener\n onMouseUp={onDropzoneClick}\n onTouchEnd={onDropzoneClick}\n onKeyUp={onDropzoneKey}\n onDrop={onDrop}\n // Need to reset those listeners to avoid default browser behaviour\n onDragStart={preventEventDefaults}\n onDragEnd={preventEventDefaults}\n onDragOver={preventEventDefaults}\n >\n {isErrored && (\n <div className=\"cobalt-photo-dropzone__description\">\n <ContextualWarningCircleFilledIcon color=\"red\" />\n {errorContent(ACCEPTED_TYPES_LOCALE_STRING, ACCEPTED_MAX_SIZE_MB)}\n </div>\n )}\n {isLoading && (\n <div className=\"cobalt-photo-dropzone__description\">\n <LoadingIcon />\n </div>\n )}\n {!isLoading &&\n !isErrored &&\n (imagePreviewUrl ? (\n <>\n <img\n className=\"cobalt-photo-dropzone__preview\"\n src={imagePreviewUrl}\n />\n <div>\n <button\n className={cx(\"cobalt-photo-dropzone__delete-button\", {\n \"cobalt-photo-dropzone__delete-button--triggered\":\n displayDeletion,\n })}\n ref={deleteButtonRef}\n // Must follow the click listeners on the dropzone,\n // in order to have the correct events bubbling\n onTouchEnd={onDeleteButtonClick}\n onMouseUp={onDeleteButtonClick}\n onKeyUp={onDeleteKey}\n >\n <VisuallyHidden>Delete</VisuallyHidden>\n <BinIcon color=\"indigo\" />\n </button>\n <Popover\n targetRef={deleteButtonRef}\n isOpen={showDeletePopover}\n close={closeDeletePopover}\n placement=\"left-start\"\n distance={12}\n bodySpacing={false}\n arrow\n >\n {deletePopoverContent(onDelete, closeDeletePopover)}\n </Popover>\n </div>\n </>\n ) : (\n <div className=\"cobalt-photo-dropzone__description cobalt-photo-dropzone__description--strong\">\n <p>{description}</p>\n <PlusIcon />\n </div>\n ))}\n <VisuallyHidden>\n <input\n ref={fileInputRef}\n type=\"file\"\n onChange={onFileInputChanged}\n accept={ACCEPTED_PHOTOS_TYPES.map((ext) => `.${ext}`).join(\",\")}\n multiple={false}\n />\n </VisuallyHidden>\n </div>\n )\n}\n\nexport default PhotoDropzone\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/PhotoDropzone/index.tsx"],"sourcesContent":["import VisuallyHidden from \"@reach/visually-hidden\"\nimport React, {\n useState,\n DragEvent as ReactDragEvent,\n useRef,\n TouchEvent as ReactTouchEvent,\n ChangeEvent as ReactChangeEvent,\n MouseEvent as ReactMouseEvent,\n KeyboardEvent as ReactKeyboardEvent,\n ReactNode,\n} from \"react\"\nimport cx from \"classnames\"\nimport {\n PlusIcon,\n BinIcon,\n LoadingIcon,\n ContextualWarningCircleFilledIcon,\n} from \"../Icon\"\nimport { validateFile } from \"../utils/validateFile\"\nimport Popover from \"../Popover\"\n\nconst ACCEPTED_MAX_SIZE_MB = 10\nconst ACCEPTED_PHOTOS_TYPES = [\"jpg\", \"jpeg\", \"png\", \"gif\"]\nconst ERROR_DISPLAY_TIME = 6000\nconst ACCEPTED_TYPES_LOCALE_STRING = ACCEPTED_PHOTOS_TYPES.join(\", \")\n\nexport type PhotoDropzonePropsType = {\n className?: string\n description: string\n deletePopoverContent: (onDelete: () => void, close: () => void) => ReactNode\n errorContent: (acceptedTypes: string, maxFileSize: number) => ReactNode\n onDropped: (file: File) => Promise<void> \| void\n onPhotoDelete?: () => void\n initialImageUrl?: string\n}\n\nconst preventEventDefaults = (\n e: ReactDragEvent \| ReactMouseEvent \| ReactKeyboardEvent \| ReactTouchEvent\n) => {\n e.preventDefault && e.preventDefault()\n e.stopPropagation && e.stopPropagation()\n}\n\nconst isEnterOrSpaceKey = (event: ReactKeyboardEvent) =>\n event.key === \"Enter\" \|\| event.key === \" \"\n\nconst PhotoDropzone = ({\n className,\n description,\n deletePopoverContent,\n errorContent,\n onDropped,\n onPhotoDelete,\n initialImageUrl = \"\",\n}: PhotoDropzonePropsType) => {\n const fileInputRef = useRef<HTMLInputElement>(null)\n const deleteButtonRef = useRef<HTMLButtonElement>(null)\n const [isDragging, setIsDragging] = useState(false)\n const [isLoading, setIsLoading] = useState(false)\n const [isErrored, setIsErrored] = useState(false)\n const [imagePreviewUrl, setImagePreviewUrl] = useState(initialImageUrl)\n const [displayDeletion, setDisplayDeletion] = useState(false)\n const [showDeletePopover, setShowDeletePopover] = useState(false)\n\n const openDeletePopover = (\n event?: ReactMouseEvent \| ReactKeyboardEvent \| ReactTouchEvent\n ) => {\n event && preventEventDefaults(event)\n setShowDeletePopover(true)\n }\n const closeDeletePopover = (event?: ReactMouseEvent \| ReactTouchEvent) => {\n event && preventEventDefaults(event)\n setShowDeletePopover(false)\n }\n\n const onDropzoneMouseEnter = (event?: ReactMouseEvent) => {\n event && preventEventDefaults(event)\n if (imagePreviewUrl) setDisplayDeletion(true)\n }\n\n const onDropzoneMouseLeave = (event?: ReactMouseEvent) => {\n event && preventEventDefaults(event)\n if (displayDeletion && !showDeletePopover) setDisplayDeletion(false)\n }\n\n const onDropzoneClick = (event?: ReactMouseEvent \| ReactTouchEvent) => {\n event && preventEventDefaults(event)\n if (isLoading) return\n if (isErrored) setIsErrored(false)\n if (imagePreviewUrl) {\n if (showDeletePopover) closeDeletePopover()\n return setDisplayDeletion(!displayDeletion)\n }\n fileInputRef.current?.click()\n }\n\n const onDropzoneKey = (event: ReactKeyboardEvent) => {\n if (showDeletePopover) return\n if (isEnterOrSpaceKey(event)) {\n onDropzoneClick()\n }\n }\n\n const onDeleteKey = (event: ReactKeyboardEvent) => {\n if (isEnterOrSpaceKey(event)) {\n openDeletePopover(event)\n }\n }\n\n const onDelete = () => {\n if (fileInputRef.current) fileInputRef.current.value = \"\"\n closeDeletePopover()\n setImagePreviewUrl(\"\")\n onPhotoDelete && onPhotoDelete()\n }\n\n const onDragEnter = (event: ReactDragEvent) => {\n preventEventDefaults(event)\n if (isErrored) setIsErrored(false)\n !imagePreviewUrl && setIsDragging(true)\n }\n\n const onDragLeave = (event: ReactDragEvent) => {\n preventEventDefaults(event)\n setIsDragging(false)\n }\n\n const processFile = async (fileToProcess: File) => {\n setIsDragging(false)\n setIsErrored(false)\n setIsLoading(true)\n\n const isValidFile = await validateFile(\n fileToProcess,\n (fileToValidate, extension) => {\n const maxFileSize = ACCEPTED_MAX_SIZE_MB * 1000 * 1000\n const acceptedFileTypes = ACCEPTED_PHOTOS_TYPES\n\n if (fileToValidate.size > maxFileSize) {\n return false\n } else if (!extension \|\| !acceptedFileTypes.includes(extension)) {\n return false\n } else {\n return true\n }\n }\n )\n\n if (isValidFile) {\n const imageSrc = URL.createObjectURL(fileToProcess)\n setImagePreviewUrl(imageSrc)\n await onDropped(fileToProcess)\n setIsLoading(false)\n } else {\n setIsLoading(false)\n setIsErrored(true)\n setTimeout(() => {\n setIsErrored(false)\n }, ERROR_DISPLAY_TIME)\n }\n }\n\n const onFileInputChanged = (event: ReactChangeEvent<HTMLInputElement>) => {\n if (event.target.files?.length) {\n processFile(event.target.files[0])\n }\n }\n\n const onDrop = (event: ReactDragEvent<HTMLDivElement>) => {\n preventEventDefaults(event)\n if (event.dataTransfer?.files?.length && !imagePreviewUrl) {\n processFile(event.dataTransfer.files[0])\n }\n }\n\n const onDeleteButtonClick = showDeletePopover\n ? closeDeletePopover\n : openDeletePopover\n\n return (\n <div\n tabIndex={0}\n className={cx(\"cobalt-photo-dropzone\", className, {\n \"cobalt-photo-dropzone--filled\": imagePreviewUrl,\n \"cobalt-photo-dropzone--dragging\": isDragging,\n \"cobalt-photo-dropzone--loading\": isLoading,\n \"cobalt-photo-dropzone--errored\": isErrored,\n })}\n onMouseEnter={onDropzoneMouseEnter}\n onMouseLeave={onDropzoneMouseLeave}\n onDragEnter={onDragEnter}\n onDragLeave={onDragLeave}\n // Not on click because we also use mouseEnter listener\n onMouseUp={onDropzoneClick}\n onTouchEnd={onDropzoneClick}\n onKeyUp={onDropzoneKey}\n onDrop={onDrop}\n // Need to reset those listeners to avoid default browser behaviour\n onDragStart={preventEventDefaults}\n onDragEnd={preventEventDefaults}\n onDragOver={preventEventDefaults}\n >\n {isErrored && (\n <div className=\"cobalt-photo-dropzone__description\">\n <ContextualWarningCircleFilledIcon color=\"red\" />\n {errorContent(ACCEPTED_TYPES_LOCALE_STRING, ACCEPTED_MAX_SIZE_MB)}\n </div>\n )}\n {isLoading && (\n <div className=\"cobalt-photo-dropzone__description\">\n <LoadingIcon />\n </div>\n )}\n {!isLoading &&\n !isErrored &&\n (imagePreviewUrl ? (\n <>\n <img\n className=\"cobalt-photo-dropzone__preview\"\n src={imagePreviewUrl}\n />\n <div>\n <button\n className={cx(\"cobalt-photo-dropzone__delete-button\", {\n \"cobalt-photo-dropzone__delete-button--triggered\":\n displayDeletion,\n })}\n ref={deleteButtonRef}\n // Must follow the click listeners on the dropzone,\n // in order to have the correct events bubbling\n onTouchEnd={onDeleteButtonClick}\n onMouseUp={onDeleteButtonClick}\n onKeyUp={onDeleteKey}\n >\n <VisuallyHidden>Delete</VisuallyHidden>\n <BinIcon color=\"indigo\" />\n </button>\n <Popover\n targetRef={deleteButtonRef}\n isOpen={showDeletePopover}\n close={closeDeletePopover}\n placement=\"left-start\"\n distance={12}\n bodySpacing={false}\n arrow\n >\n {deletePopoverContent(onDelete, closeDeletePopover)}\n </Popover>\n </div>\n </>\n ) : (\n <div className=\"cobalt-photo-dropzone__description cobalt-photo-dropzone__description--strong\">\n <p>{description}</p>\n <PlusIcon />\n </div>\n ))}\n <VisuallyHidden>\n <input\n ref={fileInputRef}\n type=\"file\"\n onChange={onFileInputChanged}\n accept={ACCEPTED_PHOTOS_TYPES.map((ext) => `.${ext}`).join(\",\")}\n multiple={false}\n />\n </VisuallyHidden>\n </div>\n )\n}\n\nexport default PhotoDropzone\n"],"names":[],"mappings":";;;;;;;;;;;AAqBA,MAAM,oBAAoB,GAAG,EAAE,CAAA;AAC/B,MAAM,qBAAqB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,CAAA;AAC3D,MAAM,kBAAkB,GAAG,IAAI,CAAA;AAC/B,MAAM,4BAA4B,GAAG,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;AAYrE,MAAM,oBAAoB,GAAG,CAC3B,CAA0E,KACxE;AACF,IAAA,CAAC,CAAC,cAAc,IAAI,CAAC,CAAC,cAAc,EAAE,CAAA;AACtC,IAAA,CAAC,CAAC,eAAe,IAAI,CAAC,CAAC,eAAe,EAAE,CAAA;AAC1C,CAAC,CAAA;AAED,MAAM,iBAAiB,GAAG,CAAC,KAAyB,KAClD,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,CAAA;AAEtC,MAAA,aAAa,GAAG,CAAC,EACrB,SAAS,EACT,WAAW,EACX,oBAAoB,EACpB,YAAY,EACZ,SAAS,EACT,aAAa,EACb,eAAe,GAAG,EAAE,GACG,KAAI;AAC3B,IAAA,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;AACnD,IAAA,MAAM,eAAe,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IACvD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACnD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IACjD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAA;IACvE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC7D,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;AAEjE,IAAA,MAAM,iBAAiB,GAAG,CACxB,KAA8D,KAC5D;AACF,QAAA,KAAK,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAA;QACpC,oBAAoB,CAAC,IAAI,CAAC,CAAA;AAC5B,KAAC,CAAA;AACD,IAAA,MAAM,kBAAkB,GAAG,CAAC,KAAyC,KAAI;AACvE,QAAA,KAAK,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAA;QACpC,oBAAoB,CAAC,KAAK,CAAC,CAAA;AAC7B,KAAC,CAAA;AAED,IAAA,MAAM,oBAAoB,GAAG,CAAC,KAAuB,KAAI;AACvD,QAAA,KAAK,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAA;AACpC,QAAA,IAAI,eAAe;YAAE,kBAAkB,CAAC,IAAI,CAAC,CAAA;AAC/C,KAAC,CAAA;AAED,IAAA,MAAM,oBAAoB,GAAG,CAAC,KAAuB,KAAI;AACvD,QAAA,KAAK,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAA;QACpC,IAAI,eAAe,IAAI,CAAC,iBAAiB;YAAE,kBAAkB,CAAC,KAAK,CAAC,CAAA;AACtE,KAAC,CAAA;AAED,IAAA,MAAM,eAAe,GAAG,CAAC,KAAyC,KAAI;;AACpE,QAAA,KAAK,IAAI,oBAAoB,CAAC,KAAK,CAAC,CAAA;AACpC,QAAA,IAAI,SAAS;YAAE,OAAM;AACrB,QAAA,IAAI,SAAS;YAAE,YAAY,CAAC,KAAK,CAAC,CAAA;AAClC,QAAA,IAAI,eAAe,EAAE;AACnB,YAAA,IAAI,iBAAiB;AAAE,gBAAA,kBAAkB,EAAE,CAAA;AAC3C,YAAA,OAAO,kBAAkB,CAAC,CAAC,eAAe,CAAC,CAAA;AAC5C,SAAA;AACD,QAAA,CAAA,EAAA,GAAA,YAAY,CAAC,OAAO,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,EAAE,CAAA;AAC/B,KAAC,CAAA;AAED,IAAA,MAAM,aAAa,GAAG,CAAC,KAAyB,KAAI;AAClD,QAAA,IAAI,iBAAiB;YAAE,OAAM;AAC7B,QAAA,IAAI,iBAAiB,CAAC,KAAK,CAAC,EAAE;AAC5B,YAAA,eAAe,EAAE,CAAA;AAClB,SAAA;AACH,KAAC,CAAA;AAED,IAAA,MAAM,WAAW,GAAG,CAAC,KAAyB,KAAI;AAChD,QAAA,IAAI,iBAAiB,CAAC,KAAK,CAAC,EAAE;YAC5B,iBAAiB,CAAC,KAAK,CAAC,CAAA;AACzB,SAAA;AACH,KAAC,CAAA;IAED,MAAM,QAAQ,GAAG,MAAK;QACpB,IAAI,YAAY,CAAC,OAAO;AAAE,YAAA,YAAY,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAA;AACzD,QAAA,kBAAkB,EAAE,CAAA;QACpB,kBAAkB,CAAC,EAAE,CAAC,CAAA;QACtB,aAAa,IAAI,aAAa,EAAE,CAAA;AAClC,KAAC,CAAA;AAED,IAAA,MAAM,WAAW,GAAG,CAAC,KAAqB,KAAI;QAC5C,oBAAoB,CAAC,KAAK,CAAC,CAAA;AAC3B,QAAA,IAAI,SAAS;YAAE,YAAY,CAAC,KAAK,CAAC,CAAA;AAClC,QAAA,CAAC,eAAe,IAAI,aAAa,CAAC,IAAI,CAAC,CAAA;AACzC,KAAC,CAAA;AAED,IAAA,MAAM,WAAW,GAAG,CAAC,KAAqB,KAAI;QAC5C,oBAAoB,CAAC,KAAK,CAAC,CAAA;QAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;AACtB,KAAC,CAAA;AAED,IAAA,MAAM,WAAW,GAAG,OAAO,aAAmB,KAAI;QAChD,aAAa,CAAC,KAAK,CAAC,CAAA;QACpB,YAAY,CAAC,KAAK,CAAC,CAAA;QACnB,YAAY,CAAC,IAAI,CAAC,CAAA;AAElB,QAAA,MAAM,WAAW,GAAG,MAAM,YAAY,CACpC,aAAa,EACb,CAAC,cAAc,EAAE,SAAS,KAAI;AAC5B,YAAA,MAAM,WAAW,GAAG,oBAAoB,GAAG,IAAI,GAAG,IAAI,CAAA;YACtD,MAAM,iBAAiB,GAAG,qBAAqB,CAAA;AAE/C,YAAA,IAAI,cAAc,CAAC,IAAI,GAAG,WAAW,EAAE;AACrC,gBAAA,OAAO,KAAK,CAAA;AACb,aAAA;iBAAM,IAAI,CAAC,SAAS,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE;AAC/D,gBAAA,OAAO,KAAK,CAAA;AACb,aAAA;AAAM,iBAAA;AACL,gBAAA,OAAO,IAAI,CAAA;AACZ,aAAA;AACH,SAAC,CACF,CAAA;AAED,QAAA,IAAI,WAAW,EAAE;YACf,MAAM,QAAQ,GAAG,GAAG,CAAC,eAAe,CAAC,aAAa,CAAC,CAAA;YACnD,kBAAkB,CAAC,QAAQ,CAAC,CAAA;AAC5B,YAAA,MAAM,SAAS,CAAC,aAAa,CAAC,CAAA;YAC9B,YAAY,CAAC,KAAK,CAAC,CAAA;AACpB,SAAA;AAAM,aAAA;YACL,YAAY,CAAC,KAAK,CAAC,CAAA;YACnB,YAAY,CAAC,IAAI,CAAC,CAAA;YAClB,UAAU,CAAC,MAAK;gBACd,YAAY,CAAC,KAAK,CAAC,CAAA;aACpB,EAAE,kBAAkB,CAAC,CAAA;AACvB,SAAA;AACH,KAAC,CAAA;AAED,IAAA,MAAM,kBAAkB,GAAG,CAAC,KAAyC,KAAI;;QACvE,IAAI,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAE,MAAM,EAAE;YAC9B,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;AACnC,SAAA;AACH,KAAC,CAAA;AAED,IAAA,MAAM,MAAM,GAAG,CAAC,KAAqC,KAAI;;QACvD,oBAAoB,CAAC,KAAK,CAAC,CAAA;AAC3B,QAAA,IAAI,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,KAAK,CAAC,YAAY,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,MAAM,KAAI,CAAC,eAAe,EAAE;YACzD,WAAW,CAAC,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;AACzC,SAAA;AACH,KAAC,CAAA;IAED,MAAM,mBAAmB,GAAG,iBAAiB;AAC3C,UAAE,kBAAkB;UAClB,iBAAiB,CAAA;AAErB,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,EAAE;AAChD,YAAA,+BAA+B,EAAE,eAAe;AAChD,YAAA,iCAAiC,EAAE,UAAU;AAC7C,YAAA,gCAAgC,EAAE,SAAS;AAC3C,YAAA,gCAAgC,EAAE,SAAS;AAC5C,SAAA,CAAC,EACF,YAAY,EAAE,oBAAoB,EAClC,YAAY,EAAE,oBAAoB,EAClC,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,WAAW;;AAExB,QAAA,SAAS,EAAE,eAAe,EAC1B,UAAU,EAAE,eAAe,EAC3B,OAAO,EAAE,aAAa,EACtB,MAAM,EAAE,MAAM;;QAEd,WAAW,EAAE,oBAAoB,EACjC,SAAS,EAAE,oBAAoB,EAC/B,UAAU,EAAE,oBAAoB,EAAA;AAE/B,QAAA,SAAS,KACR,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,oCAAoC,EAAA;AACjD,YAAA,KAAA,CAAA,aAAA,CAAC,iCAAiC,EAAA,EAAC,KAAK,EAAC,KAAK,EAAG,CAAA;AAChD,YAAA,YAAY,CAAC,4BAA4B,EAAE,oBAAoB,CAAC,CAC7D,CACP;AACA,QAAA,SAAS,KACR,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,oCAAoC,EAAA;YACjD,KAAC,CAAA,aAAA,CAAA,WAAW,EAAG,IAAA,CAAA,CACX,CACP;AACA,QAAA,CAAC,SAAS;AACT,YAAA,CAAC,SAAS;AACV,aAAC,eAAe,IACd,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;AACE,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAC,gCAAgC,EAC1C,GAAG,EAAE,eAAe,EACpB,CAAA;AACF,gBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;AACE,oBAAA,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAE,EAAE,CAAC,sCAAsC,EAAE;AACpD,4BAAA,iDAAiD,EAC/C,eAAe;yBAClB,CAAC,EACF,GAAG,EAAE,eAAe;;;wBAGpB,UAAU,EAAE,mBAAmB,EAC/B,SAAS,EAAE,mBAAmB,EAC9B,OAAO,EAAE,WAAW,EAAA;AAEpB,wBAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EAAwB,IAAA,EAAA,QAAA,CAAA;AACvC,wBAAA,KAAA,CAAA,aAAA,CAAC,OAAO,EAAC,EAAA,KAAK,EAAC,QAAQ,GAAG,CACnB;oBACT,KAAC,CAAA,aAAA,CAAA,OAAO,IACN,SAAS,EAAE,eAAe,EAC1B,MAAM,EAAE,iBAAiB,EACzB,KAAK,EAAE,kBAAkB,EACzB,SAAS,EAAC,YAAY,EACtB,QAAQ,EAAE,EAAE,EACZ,WAAW,EAAE,KAAK,EAClB,KAAK,EAAA,IAAA,EAAA,EAEJ,oBAAoB,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAC3C,CACN,CACL,KAEH,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,+EAA+E,EAAA;AAC5F,gBAAA,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,IAAA,EAAI,WAAW,CAAK;AACpB,gBAAA,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA,CAAG,CACR,CACP,CAAC;AACJ,QAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EAAA,IAAA;AACb,YAAA,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,GAAG,EAAE,YAAY,EACjB,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,kBAAkB,EAC5B,MAAM,EAAE,qBAAqB,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,CAAI,CAAA,EAAA,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAC/D,QAAQ,EAAE,KAAK,GACf,CACa,CACb,EACP;AACH;;;;"}

package/components/Pill/index.js CHANGED Viewed

@@ -2,10 +2,9 @@ import React, { Children } from 'react';
 import cx from 'classnames';
 import { Icon } from '../Icon/index.js';
-var ICON_SIZE = 20;
-var Pill = function (_a) {
-    var icon = _a.icon, _b = _a.color, color = _b === void 0 ? "indigo" : _b, children = _a.children, overlayed = _a.overlayed, className = _a.className, size = _a.size;
-    var iconMarkup = icon ? (React.createElement("span", { className: "cobalt-Pill__Icon" },
+const ICON_SIZE = 20;
+const Pill = ({ icon, color = "indigo", children, overlayed, className, size, }) => {
+    const iconMarkup = icon ? (React.createElement("span", { className: "cobalt-Pill__Icon" },
         React.createElement(Icon, { source: icon, size: ICON_SIZE, color: overlayed ? "white" : color }))) : null;
     return (React.createElement("div", { className: cx(className, "cobalt-Pill", {
             "cobalt-Pill--colorAller": color === "aller",
@@ -16,9 +15,8 @@ var Pill = function (_a) {
         " ",
         children));
 };
-var PillGroup = function (_a) {
-    var children = _a.children;
-    return (React.createElement("div", { className: "cobalt-PillGroup" }, Children.toArray(children).map(function (child, index) { return (React.createElement("div", { className: "cobalt-PillGroup__Item", key: index }, child)); })));
+const PillGroup = ({ children }) => {
+    return (React.createElement("div", { className: "cobalt-PillGroup" }, Children.toArray(children).map((child, index) => (React.createElement("div", { className: "cobalt-PillGroup__Item", key: index }, child)))));
 };
 export { Pill, PillGroup, Pill as default };

package/components/Pill/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/Pill/index.tsx"],"sourcesContent":["import React, { Children } from \"react\"\nimport cx from \"classnames\"\nimport { Icon, ~~IconColors~~, IconSources } from \"../Icon\"\n\nconst ICON_SIZE = 20\nexport interface PillPropsType {\n children: React.ReactNode\n icon?: IconSources\n color?: ~~IconColors~~\n size?: \"large\"\n overlayed?: boolean\n className?: string\n}\n\nexport const Pill = ({\n icon,\n color = \"indigo\",\n children,\n overlayed,\n className,\n size,\n}: PillPropsType) => {\n const iconMarkup = icon ? (\n <span className=\"cobalt-Pill__Icon\">\n <Icon\n source={icon}\n size={ICON_SIZE}\n color={overlayed ? \"white\" : color}\n />\n </span>\n ) : null\n\n return (\n <div\n className={cx(className, \"cobalt-Pill\", {\n \"cobalt-Pill--colorAller\": color === \"aller\",\n \"cobalt-Pill--overlayed\": overlayed,\n \"cobalt-Pill--large\": size === \"large\",\n })}\n >\n {iconMarkup} {children}\n </div>\n )\n}\n\nexport interface PillGroupPropsType {\n children: React.ReactNode\n}\n\nexport const PillGroup = ({ children }: PillGroupPropsType) => {\n return (\n <div className=\"cobalt-PillGroup\">\n {Children.toArray(children).map((child, index) => (\n <div className=\"cobalt-PillGroup__Item\" key={index}>\n {child}\n </div>\n ))}\n </div>\n )\n}\n\nexport default Pill\n"],"names":[],"mappings":";;;;AAIA,~~IAAM~~,SAAS,GAAG,EAAE,CAAA;~~AAUb~~,~~IAAM,~~IAAI,GAAG,~~UAAC~~,~~EAOL~~,~~EAAA;AANd,IAAA,IAAA,~~IAAI,~~UAAA,~~EACJ,~~EAAA,GAAA,EAAA,CAAA,KAAgB,EAAhB,~~KAAK,~~GAAA,EAAA,KAAA,KAAA,CAAA,~~GAAG,QAAQ,~~GAAA,EAAA,~~EAChB,QAAQ,~~GAAA,EAAA,CAAA,QAAA,~~EACR,SAAS,~~GAAA,EAAA,CAAA,SAAA,~~EACT,SAAS,~~GAAA,EAAA,CAAA,SAAA,~~EACT,IAAI,~~GAAA~~,~~EAAA,CAAA,IAAA,CAAA~~;~~IAEJ~~,~~IAAM~~,UAAU,GAAG,IAAI,IACrB,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,mBAAmB,EAAA;AACjC,QAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EACH,MAAM,EAAE,IAAI,EACZ,IAAI,EAAE,SAAS,EACf,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,KAAK,EAAA,CAClC,CACG,IACL,IAAI,CAAA;IAER,QACE,6BACE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,aAAa,EAAE;YACtC,yBAAyB,EAAE,KAAK,KAAK,OAAO;AAC5C,YAAA,wBAAwB,EAAE,SAAS;YACnC,oBAAoB,EAAE,IAAI,KAAK,OAAO;SACvC,CAAC,EAAA;QAED,UAAU;;QAAG,QAAQ,CAClB,EACP;AACH,EAAC;~~AAMM~~,~~IAAM,~~SAAS,GAAG,~~UAAC~~,~~EAAgC~~,~~EAAA;AAA9B,IAAA,IAAA,~~QAAQ,~~GAAA~~,~~EAAA,CAAA,QAAA,CAAA~~;~~AAClC~~,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,kBAAkB,IAC9B,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,~~UAAC~~,KAAK,EAAE,KAAK,~~EAAK~~,~~EAAA~~,~~QAChD,KAAK,~~CAAA,aAAA,CAAA,KAAA,EAAA,~~EAAA~~,SAAS,EAAC,wBAAwB,EAAC,GAAG,EAAE,KAAK,~~EAC~~/C,~~EAAA,~~KAAK,CACF,~~EACP~~,~~EAAA,~~CAAC,CACE,EACP;AACH;;;;"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/Pill/index.tsx"],"sourcesContent":["import React, { Children } from \"react\"\nimport cx from \"classnames\"\nimport { Icon, IconColorsType, IconSources } from \"../Icon\"\n\nconst ICON_SIZE = 20\nexport interface PillPropsType {\n children: React.ReactNode\n icon?: IconSources\n color?: IconColorsType\n size?: \"large\"\n overlayed?: boolean\n className?: string\n}\n\nexport const Pill = ({\n icon,\n color = \"indigo\",\n children,\n overlayed,\n className,\n size,\n}: PillPropsType) => {\n const iconMarkup = icon ? (\n <span className=\"cobalt-Pill__Icon\">\n <Icon\n source={icon}\n size={ICON_SIZE}\n color={overlayed ? \"white\" : color}\n />\n </span>\n ) : null\n\n return (\n <div\n className={cx(className, \"cobalt-Pill\", {\n \"cobalt-Pill--colorAller\": color === \"aller\",\n \"cobalt-Pill--overlayed\": overlayed,\n \"cobalt-Pill--large\": size === \"large\",\n })}\n >\n {iconMarkup} {children}\n </div>\n )\n}\n\nexport interface PillGroupPropsType {\n children: React.ReactNode\n}\n\nexport const PillGroup = ({ children }: PillGroupPropsType) => {\n return (\n <div className=\"cobalt-PillGroup\">\n {Children.toArray(children).map((child, index) => (\n <div className=\"cobalt-PillGroup__Item\" key={index}>\n {child}\n </div>\n ))}\n </div>\n )\n}\n\nexport default Pill\n"],"names":[],"mappings":";;;;AAIA,MAAM,SAAS,GAAG,EAAE,CAAA;MAUP,IAAI,GAAG,CAAC,EACnB,IAAI,EACJ,KAAK,GAAG,QAAQ,EAChB,QAAQ,EACR,SAAS,EACT,SAAS,EACT,IAAI,GACU,KAAI;IAClB,MAAM,UAAU,GAAG,IAAI,IACrB,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,mBAAmB,EAAA;AACjC,QAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EACH,MAAM,EAAE,IAAI,EACZ,IAAI,EAAE,SAAS,EACf,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,KAAK,EAAA,CAClC,CACG,IACL,IAAI,CAAA;IAER,QACE,6BACE,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,aAAa,EAAE;YACtC,yBAAyB,EAAE,KAAK,KAAK,OAAO;AAC5C,YAAA,wBAAwB,EAAE,SAAS;YACnC,oBAAoB,EAAE,IAAI,KAAK,OAAO;SACvC,CAAC,EAAA;QAED,UAAU;;QAAG,QAAQ,CAClB,EACP;AACH,EAAC;MAMY,SAAS,GAAG,CAAC,EAAE,QAAQ,EAAsB,KAAI;AAC5D,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,kBAAkB,IAC9B,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,MAC3C,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,wBAAwB,EAAC,GAAG,EAAE,KAAK,IAC/C,KAAK,CACF,CACP,CAAC,CACE,EACP;AACH;;;;"}