@sprinklrjs/spaceweb 10.1.0

package/esm/setupTests.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/esm/setupTests.js

@@ -0,0 +1,21 @@
+// used by https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom';
+// used by Switch component
+import { configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+configure({ adapter: new Adapter() });
+// used by useStickyElement hook which calls IntersectionObserver Web API
+var IntersectionObserverMock = /** @class */ (function () {
+    function IntersectionObserverMock() {
+    }
+    // eslint-disable-next-line class-methods-use-this, @typescript-eslint/explicit-function-return-type, @typescript-eslint/no-empty-function
+    IntersectionObserverMock.prototype.observe = function () { };
+    // eslint-disable-next-line class-methods-use-this, @typescript-eslint/explicit-function-return-type, @typescript-eslint/no-empty-function
+    IntersectionObserverMock.prototype.unobserve = function () { };
+    return IntersectionObserverMock;
+}());
+Object.defineProperty(global, 'IntersectionObserver', {
+    writable: true,
+    configurable: true,
+    value: IntersectionObserverMock,
+});

package/esm/slider/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Slider } from './slider';
+export { default as StatefulSliderContainer } from './stateful-slider-container';
+export { default as StatefulSlider } from './stateful-slider';
+export * from './types';

package/esm/slider/index.js

@@ -0,0 +1,4 @@
+export { default as Slider } from './slider';
+export { default as StatefulSliderContainer } from './stateful-slider-container';
+export { default as StatefulSlider } from './stateful-slider';
+export * from './types';

package/esm/slider/mark.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+declare const Mark: React.ForwardRefExoticComponent<import("baseui/slider").SharedProps & {
+    $intent?: boolean | undefined;
+    $step: number;
+} & {
+    $markIndex: number;
+    overrides?: {
+        MarkLabel?: import("../overrides").Override<import("baseui/slider").SharedProps & {
+            $intent?: boolean | undefined;
+            $step: number;
+        } & Record<string, any>> | undefined;
+    } | undefined;
+    getMarkLabel: (props: import("baseui/slider").SharedProps & {
+        $intent?: boolean | undefined;
+        $step: number;
+    } & {
+        $markIndex: number;
+    }) => React.ReactNode;
+    markLabel?: boolean | undefined;
+} & React.RefAttributes<HTMLElement>>;
+export default Mark;

package/esm/slider/mark.js

@@ -0,0 +1,11 @@
+import { __assign, __read, __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { StyledMark, StyledMarkLabel } from './styled-components';
+import { useOverrides } from '../overrides/useOverrides';
+var Mark = React.forwardRef(function (_a, ref) {
+    var markLabel = _a.markLabel, getMarkLabel = _a.getMarkLabel, overrides = _a.overrides, props = __rest(_a, ["markLabel", "getMarkLabel", "overrides"]);
+    var _b = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.MarkLabel, StyledMarkLabel), 2), MarkLabel = _b[0], markLabelProps = _b[1];
+    return (_jsx(StyledMark, __assign({}, props, { ref: ref }, { children: markLabel ? _jsx(MarkLabel, __assign({}, markLabelProps, { children: getMarkLabel(props) }), void 0) : null }), void 0));
+});
+export default Mark;

package/esm/slider/slider.d.ts

@@ -0,0 +1,7 @@
+import { ReactElement } from 'react';
+import { SliderProps } from './types';
+declare const Slider: {
+    ({ overrides, markLabel, intent, getMarkLabel, className, style, ...restProps }: SliderProps): ReactElement;
+    displayName: string;
+};
+export default Slider;

package/esm/slider/slider.js

@@ -0,0 +1,73 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Slider as BaseSlider } from 'baseui/slider';
+import { useConvertOverrides } from '../helpers/baseui/useConvertOverrides';
+import Mark from './mark';
+import { getInnerTrackStyles, getThumbStyles, getInnerThumbStyles, getThumbValueStyles } from './styled-components';
+import { isServer } from '../spacewebProvider/utils';
+BaseSlider.displayName = 'BaseSlider';
+var defaultMarkLabel = function (_a) {
+    var $markIndex = _a.$markIndex, $min = _a.$min, $step = _a.$step;
+    return "".concat($min + $markIndex * $step);
+};
+var Slider = function (_a) {
+    var overrides = _a.overrides, markLabel = _a.markLabel, _b = _a.intent, intent = _b === void 0 ? 'default' : _b, _c = _a.getMarkLabel, getMarkLabel = _c === void 0 ? defaultMarkLabel : _c, className = _a.className, style = _a.style, restProps = __rest(_a, ["overrides", "markLabel", "intent", "getMarkLabel", "className", "style"]);
+    var mergedOverrides = useConvertOverrides({
+        Root: {
+            style: ['p-4', className, style],
+            props: {
+                $intent: intent,
+                'data-spaceweb': 'slider',
+            },
+        },
+        Track: {
+            style: 'p-0',
+        },
+        InnerTrack: {
+            style: getInnerTrackStyles,
+            props: {
+                $intent: intent,
+                'data-testid': 'slider-track',
+            },
+        },
+        Mark: {
+            component: Mark,
+            props: {
+                $intent: intent,
+                'data-testid': 'slider-mark',
+                getMarkLabel: getMarkLabel,
+                markLabel: markLabel,
+                overrides: {
+                    MarkLabel: overrides === null || overrides === void 0 ? void 0 : overrides.MarkLabel,
+                },
+            },
+        },
+        Thumb: {
+            // In SSR, Thumbs are not properly positioned, hence hiding thumbs.
+            // Refer https://github.com/tajo/react-range/issues/67#issuecomment-591703422
+            component: isServer ? function () { return null; } : undefined,
+            style: getThumbStyles,
+            props: {
+                $intent: intent,
+            },
+        },
+        InnerThumb: {
+            style: getInnerThumbStyles,
+            props: {
+                $intent: intent,
+            },
+        },
+        ThumbValue: {
+            style: getThumbValueStyles,
+            props: {
+                $intent: intent,
+            },
+        },
+        TickBar: {
+            component: function () { return null; },
+        },
+    }, overrides);
+    return _jsx(BaseSlider, __assign({ overrides: mergedOverrides }, restProps), void 0);
+};
+Slider.displayName = 'Slider';
+export default Slider;

package/esm/slider/stateful-slider-container.d.ts

@@ -0,0 +1,7 @@
+import { ReactElement } from 'react';
+import { StatefulContainerProps } from './types';
+declare const StatefulContainer: {
+    ({ overrides, ...props }: StatefulContainerProps): ReactElement;
+    displayName: string;
+};
+export default StatefulContainer;

package/esm/slider/stateful-slider-container.js

@@ -0,0 +1,11 @@
+import { __assign, __rest } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StatefulContainer as BaseStatefulContainer } from 'baseui/slider';
+//@ts-ignore
+BaseStatefulContainer.displayName = 'BaseStatefulContainer';
+var StatefulContainer = function (_a) {
+    var overrides = _a.overrides, props = __rest(_a, ["overrides"]);
+    return (_jsx(BaseStatefulContainer, __assign({}, props, { overrides: overrides }), void 0));
+};
+StatefulContainer.displayName = 'StatefulContainer';
+export default StatefulContainer;

package/esm/slider/stateful-slider.d.ts

@@ -0,0 +1,7 @@
+import { ReactElement } from 'react';
+import { StatefulSliderProps } from './types';
+declare const StatefulSlider: {
+    (props: StatefulSliderProps): ReactElement;
+    displayName: string;
+};
+export default StatefulSlider;

package/esm/slider/stateful-slider.js

@@ -0,0 +1,7 @@
+import { __assign } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import StatefulContainer from './stateful-slider-container';
+import Slider from './slider';
+var StatefulSlider = function (props) { return (_jsx(StatefulContainer, __assign({}, props, { children: function (sliderProps) { return _jsx(Slider, __assign({}, sliderProps), void 0); } }), void 0)); };
+StatefulSlider.displayName = 'StatefulSlider';
+export default StatefulSlider;

package/esm/slider/styled-components.d.ts

@@ -0,0 +1,7 @@
+import { Styles } from '../types';
+export declare const getInnerTrackStyles: Styles;
+export declare const getThumbStyles: Styles;
+export declare const getInnerThumbStyles: Styles;
+export declare const getThumbValueStyles: Styles;
+export declare const StyledMark: import("../style/styled").StyledComponent;
+export declare const StyledMarkLabel: import("../style/styled").StyledComponent;

package/esm/slider/styled-components.js

@@ -0,0 +1,90 @@
+import { __assign } from "tslib";
+import styled from '../style/styled';
+import { borderRadius, borderColor } from '../helpers/longHandHelpers';
+import { intentColor } from '../helpers/intentHelper';
+import { hex2rgb } from '../helpers';
+var addOpacity = function (token, opacity) {
+    return token.includes('rgb') ? token.split(')')[0] + opacity + ')' : hex2rgb(token, opacity);
+};
+var secondaryIntentColor = function (_a, _b) {
+    var theme = _a.theme;
+    var $intent = _b.$intent;
+    switch ($intent) {
+        case 'error':
+            return theme.spr.supportErrorHighlight;
+        case 'success':
+            return theme.spr.supportSuccessHighlight;
+        case 'warning':
+            return theme.spr.supportWarningHighlight;
+        default:
+            return addOpacity(theme.spr.ui04, '0.1');
+    }
+};
+export var getInnerTrackStyles = [
+    'w-full self-center',
+    function (_a, _b) {
+        var theme = _a.theme, direction = _a.direction, px2rem = _a.px2rem;
+        var $disabled = _b.$disabled, $value = _b.$value, $min = _b.$min, $max = _b.$max, $intent = _b.$intent;
+        var intentPrimary = intentColor({ theme: theme }, { $intent: $intent });
+        var intentSecondary = secondaryIntentColor({ theme: theme }, { $intent: $intent });
+        var scaledValue = $value.map(function (value) { return ((value - $min) / ($max - $min)) * 100; });
+        var gradientDirection = direction === 'rtl' ? 'to left' : 'to right';
+        return __assign({ background: scaledValue.length == 1
+                ? "linear-gradient(".concat(gradientDirection, ", \n          ").concat(intentPrimary, " ").concat(scaledValue[0], "%, \n            ").concat(intentSecondary, " ").concat(scaledValue[0], "%)")
+                : "linear-gradient(".concat(gradientDirection, ", \n          ").concat(intentSecondary, " ").concat(scaledValue[0], "%,\n            ").concat(intentPrimary, " ").concat(scaledValue[0], "% ").concat(scaledValue[1], "%, \n              ").concat(intentSecondary, " ").concat(scaledValue[1], "%)"), opacity: $disabled ? '0.6' : '1', height: px2rem('6px'), cursor: $disabled ? 'not-allowed' : 'inherit' }, borderRadius('6px'));
+    },
+];
+export var getThumbStyles = [
+    'flex items-center justify-center h-4 w-4',
+    function (_a, _b) {
+        var theme = _a.theme;
+        var $disabled = _b.$disabled, $isFocusVisible = _b.$isFocusVisible, $intent = _b.$intent;
+        var intentPrimary = intentColor({ theme: theme }, { $intent: $intent });
+        var intentSecondary = secondaryIntentColor({ theme: theme }, { $intent: $intent });
+        var hoverStyles = {
+            boxShadow: "0px 0px 0px 6px ".concat(intentSecondary),
+        };
+        return __assign(__assign(__assign({ backgroundColor: intentPrimary }, borderRadius('16px')), { cursor: $disabled ? 'not-allowed' : 'inherit' }), (!$disabled && {
+            ':hover': hoverStyles,
+            ':focus': __assign({ outline: 'none' }, ($isFocusVisible && hoverStyles)),
+        }));
+    },
+];
+export var getInnerThumbStyles = [
+    'h-0 w-0 absolute border-l-8 border-t-8 border-b-8 border-r-8 border-solid',
+    function (_a) {
+        var theme = _a.theme, px2rem = _a.px2rem;
+        return (__assign(__assign({}, borderColor('transparent')), { borderTopColor: theme.spr.tooltip01, backgroundColor: 'transparent', top: px2rem('-16px') }));
+    },
+];
+export var getThumbValueStyles = [
+    'py-2 px-3 spr-tooltip-01 typography-l3 spr-text-06 absolute',
+    function (_a) {
+        var px2rem = _a.px2rem;
+        return (__assign(__assign({}, borderRadius('4px')), { top: px2rem('-47px') }));
+    },
+];
+export var StyledMark = styled('div', 'ml-4 spr-ui-01 w-px relative opacity-50', function (_a, _b) {
+    var px2rem = _a.px2rem, theme = _a.theme;
+    var $markIndex = _b.$markIndex, $intent = _b.$intent, $value = _b.$value, $min = _b.$min, $max = _b.$max, $step = _b.$step;
+    var intentPrimary = intentColor({ theme: theme }, { $intent: $intent });
+    var markValue = $min + $markIndex * $step;
+    var backgroundColor;
+    if ($markIndex === 0 || $markIndex === ($max - $min) / $step)
+        backgroundColor = 'transparent';
+    else if ($value.length === 1)
+        backgroundColor = $value[0] > markValue ? theme.spr.ui01 : intentPrimary;
+    else
+        backgroundColor = $value[0] < markValue && markValue < $value[1] ? theme.spr.ui01 : intentPrimary;
+    return {
+        height: px2rem('6px'),
+        backgroundColor: backgroundColor,
+    };
+});
+export var StyledMarkLabel = styled('div', 'absolute typography-l3', function (_a) {
+    var px2rem = _a.px2rem;
+    return ({
+        top: px2rem('15px'),
+        transform: 'translateX(-50%)',
+    });
+});

package/esm/slider/types.d.ts

@@ -0,0 +1,39 @@
+/// <reference types="react" />
+import { SliderProps as BaseSliderProps, StatefulContainerProps as BaseStatefulContainerProps, StatefulSliderProps as BaseStatefulSliderProps, SharedProps as BaseSharedProps } from 'baseui/slider';
+import { Intent, SpacewebComponentProps } from '../types';
+import { Override } from '../overrides';
+declare type GetMarkLabelFn = (props: SharedProps & {
+    $markIndex: number;
+}) => React.ReactNode;
+declare type CommonSliderProps = {
+    intent?: Intent;
+    markLabel?: boolean;
+    overrides?: {
+        Root?: Override<SharedProps & Record<string, any>>;
+        Track?: Override<SharedProps & Record<string, any>>;
+        InnerTrack?: Override<SharedProps & Record<string, any>>;
+        Thumb?: Override<SharedProps & Record<string, any>>;
+        InnerThumb?: Override<SharedProps & Record<string, any>>;
+        ThumbValue?: Override<SharedProps & Record<string, any>>;
+        Mark?: Override<SharedProps & Record<string, any>>;
+        MarkLabel?: Override<SharedProps & Record<string, any>>;
+    };
+    disabled?: boolean;
+    getMarkLabel?: GetMarkLabelFn;
+};
+export declare type SharedProps = BaseSharedProps & {
+    $intent?: boolean;
+    $step: number;
+};
+export declare type SliderProps = SpacewebComponentProps<Omit<BaseSliderProps, 'overrides'>> & CommonSliderProps;
+export declare type StatefulContainerProps = SpacewebComponentProps<Omit<BaseStatefulContainerProps, 'overrides'>> & CommonSliderProps;
+export declare type StatefulSliderProps = SpacewebComponentProps<Omit<BaseStatefulSliderProps, 'overrides'>> & CommonSliderProps;
+export declare type MarkProps = SharedProps & {
+    $markIndex: number;
+    overrides?: {
+        MarkLabel?: Override<SharedProps & Record<string, any>>;
+    };
+    getMarkLabel: GetMarkLabelFn;
+    markLabel?: boolean;
+};
+export {};

package/esm/slider/types.js

@@ -0,0 +1 @@
+export {};

package/esm/snackbar/Snackbar.d.ts

@@ -0,0 +1,4 @@
+import { ReactElement } from 'react';
+import { SnackbarProps } from './types';
+declare const Snackbar: ({ intent: _intent, message: _message, disableManualClose, placement, autoHide, autoHideDuration, hideOnClickAway, overrides, onClose, }: SnackbarProps) => ReactElement | null;
+export default Snackbar;

package/esm/snackbar/Snackbar.js

@@ -0,0 +1,57 @@
+import { __assign, __read } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Layer as DefaultLayer } from 'baseui/layer';
+import { isValidElement, cloneElement } from 'react';
+import _noop from 'lodash/noop';
+import { IconButton } from '../button';
+import { add$props } from '../helpers';
+import CloseIcon from '../icon/components/close';
+import { useOverrides } from '../overrides';
+import { INTENT_TO_ICON, TYPE_TO_HIDE_DURATION } from './constants';
+import { LayersManager, Z_INDEX } from '../layer';
+import { StyledContentContainer, StyledIconsContainer, StyledMessage, StyledPlacementContainer, StyledSnackbarContainer, getIconStyles, } from './styled-component';
+import useSnackbar from './useSnackbar';
+var Snackbar = function (_a) {
+    var _b = _a.intent, _intent = _b === void 0 ? 'success' : _b, _message = _a.message, _c = _a.disableManualClose, disableManualClose = _c === void 0 ? false : _c, _d = _a.placement, placement = _d === void 0 ? 'bottom' : _d, _e = _a.autoHide, autoHide = _e === void 0 ? true : _e, _f = _a.autoHideDuration, autoHideDuration = _f === void 0 ? TYPE_TO_HIDE_DURATION[_intent] : _f, _g = _a.hideOnClickAway, hideOnClickAway = _g === void 0 ? true : _g, overrides = _a.overrides, _h = _a.onClose, onClose = _h === void 0 ? _noop : _h;
+    var _j = useSnackbar({
+        intent: _intent,
+        message: _message,
+        autoHide: autoHide,
+        autoHideDuration: autoHideDuration,
+        hideOnClickAway: hideOnClickAway,
+        onClose: onClose,
+    }), open = _j.open, shouldRender = _j.shouldRender, handleClose = _j.handleClose, snackbarContainerProps = _j.snackbarContainerProps, snackbarContainerRef = _j.snackbarContainerRef, intent = _j.intent, message = _j.message;
+    var IntentIconComponent = INTENT_TO_ICON[intent];
+    var sharedProps = add$props({
+        intent: intent,
+        disableManualClose: disableManualClose,
+        placement: placement,
+        autoHide: autoHide,
+        autoHideDuration: autoHideDuration,
+        hideOnClickAway: hideOnClickAway,
+        open: open,
+    });
+    var _k = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.Layer, DefaultLayer), 2), Layer = _k[0], layerProps = _k[1];
+    var _l = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.PlacementContainer, StyledPlacementContainer), 2), PlacementContainer = _l[0], placementContainerProps = _l[1];
+    var _m = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.SnackbarContainer, StyledSnackbarContainer), 2), SnackbarContainer = _m[0], snackbarContainerOverrideProps = _m[1];
+    var _o = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.ContentContainer, StyledContentContainer), 2), ContentContainer = _o[0], contentContainerProps = _o[1];
+    var _p = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.Message, StyledMessage), 2), Message = _p[0], messageProps = _p[1];
+    var _q = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.IconsContainer, StyledIconsContainer), 2), IconsContainer = _q[0], iconsContainerProps = _q[1];
+    var _r = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.IntentIcon, IntentIconComponent), 2), IntentIcon = _r[0], intentIconProps = _r[1];
+    var _s = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.CloseIcon, CloseIcon), 2), Close = _s[0], closeProps = _s[1];
+    var _t = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.CloseIconButton, IconButton)), CloseIconButton = _t[0], closeIconButtonProps = _t.slice(1);
+    return shouldRender ? (_jsx(LayersManager, __assign({ zIndex: Z_INDEX.SNACKBAR }, { children: _jsx(Layer, __assign({}, sharedProps, layerProps, { children: _jsx(PlacementContainer, __assign({ "data-spaceweb": "snackbar", "data-testid": "snackbar" }, sharedProps, placementContainerProps, { children: _jsxs(SnackbarContainer, __assign({}, snackbarContainerProps, { ref: snackbarContainerRef, role: "alert" }, sharedProps, snackbarContainerOverrideProps, { children: [_jsxs(ContentContainer, __assign({}, sharedProps, contentContainerProps, { children: [_jsx(IconsContainer, __assign({}, sharedProps, iconsContainerProps, { children: _jsx(IntentIcon, __assign({ size: 30, className: getIconStyles }, sharedProps, intentIconProps), void 0) }), void 0), _jsx(Message, __assign({ "aria-atomic": true, "aria-live": "assertive" }, sharedProps, messageProps, { children: isValidElement(message) ? cloneElement(message) : message }), void 0)] }), void 0), !disableManualClose && (_jsx(CloseIconButton, __assign({ shape: "square", className: [
+                                'cursor-pointer absolute h-4 w-4 rounded-2 min-w-0 border-0',
+                                {
+                                    top: '1rem',
+                                    right: '1rem',
+                                    ':focus': {
+                                        backgroundColor: '#48484C',
+                                    },
+                                    ':hover': {
+                                        backgroundColor: '#48484C',
+                                    },
+                                },
+                            ], onClick: function () { return handleClose('manualClose'); } }, sharedProps, closeIconButtonProps, { children: _jsx(Close, __assign({ "data-testid": "snackbar-close", size: 10, className: { fill: '#A0A0A8' } }, sharedProps, closeProps), void 0) }), void 0))] }), void 0) }), void 0) }), void 0) }), void 0)) : null;
+};
+export default Snackbar;

package/esm/snackbar/constants.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { IconProps } from '../icon';
+import { Intent } from './types';
+export declare const TRANSITION_DURATION = 1000;
+export declare const INTENT_TO_ICON: Record<Intent, React.ComponentType<IconProps>>;
+export declare const TYPE_TO_HIDE_DURATION: Record<Intent, number>;

package/esm/snackbar/constants.js

@@ -0,0 +1,14 @@
+import Alert from '../icon/components/alert-solid';
+import Tick from '../icon/components/tickCircle-solid';
+import Error from '../icon/components/error-solid';
+export var TRANSITION_DURATION = 1000;
+export var INTENT_TO_ICON = {
+    success: Tick,
+    error: Error,
+    warning: Alert,
+};
+export var TYPE_TO_HIDE_DURATION = {
+    success: 3000,
+    error: 5000,
+    warning: 5000,
+};

package/esm/snackbar/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Snackbar } from './Snackbar';
+export * from './types';

package/esm/snackbar/index.js

@@ -0,0 +1,2 @@
+export { default as Snackbar } from './Snackbar';
+export * from './types';

package/esm/snackbar/styled-component.d.ts

@@ -0,0 +1,8 @@
+export declare const StyledPlacementContainer: import("../style/styled").StyledComponent;
+export declare const StyledSnackbarContainer: import("../style/styled").StyledComponent;
+export declare const StyledIconsContainer: import("../style/styled").StyledComponent;
+export declare const StyledContentContainer: import("../style/styled").StyledComponent;
+export declare const StyledMessage: import("../style/styled").StyledComponent;
+export declare const getIconStyles: (utils: any, props: any) => {
+    fill: any;
+};

package/esm/snackbar/styled-component.js

@@ -0,0 +1,80 @@
+import { __assign } from "tslib";
+import { styled } from '../style';
+import { TRANSITION_DURATION } from './constants';
+import { intentColor } from '../helpers/intentHelper';
+function placementRules(placement) {
+    switch (placement) {
+        case 'topLeft':
+            return {
+                alignItems: 'flex-start',
+                justifyContent: 'flex-start',
+                top: 0,
+            };
+        case 'topRight':
+            return {
+                alignItems: 'flex-end',
+                justifyContent: 'flex-start',
+                top: 0,
+            };
+        case 'top':
+            return {
+                alignItems: 'center',
+                justifyContent: 'flex-start',
+                top: 0,
+            };
+        case 'bottomLeft':
+            return {
+                alignItems: 'flex-start',
+                justifyContent: 'flex-end',
+                bottom: 0,
+            };
+        case 'bottomRight':
+            return {
+                alignItems: 'flex-end',
+                justifyContent: 'flex-end',
+                bottom: 0,
+            };
+        default:
+        case 'bottom':
+            return {
+                alignItems: 'center',
+                justifyContent: 'flex-end',
+                bottom: 0,
+            };
+    }
+}
+var topPlacements = ['top', 'topLeft', 'topRight'];
+export var StyledPlacementContainer = styled('div', 'flex flex-col fixed right-0 left-0 mx-4 my-4 pointer-events-none', function (_a, _b) {
+    var theme = _a.theme;
+    var $placement = _b.$placement, $open = _b.$open;
+    var translateY = '0px';
+    if (!$open) {
+        translateY = topPlacements.includes($placement) ? 'calc(-100% - 50px)' : 'calc(100% + 50px)';
+    }
+    return __assign(__assign({}, placementRules($placement)), { transform: "translateY(".concat(translateY, ")"), transitionProperty: 'transform', transitionTimingFunction: 'cubic-bezier(0.23, 1, 0.32, 1)', transitionDuration: "".concat(TRANSITION_DURATION, "ms") });
+});
+export var StyledSnackbarContainer = styled('div', 'pointer-events-auto flex spr-shadow-01 overflow-hidden rounded-8 relative', function (_a) {
+    var px2rem = _a.px2rem;
+    return ({
+        minHeight: px2rem(80),
+        maxWidth: px2rem(432),
+        minWidth: px2rem(250),
+    });
+});
+export var StyledIconsContainer = styled('div', 'flex items-center justify-center rounded-full', function (_a) {
+    var px2rem = _a.px2rem;
+    return ({
+        width: px2rem(30),
+        height: px2rem(30),
+    });
+});
+export var StyledContentContainer = styled('div', 'py-6 px-8 overflow-hidden flex items-center flex-1', function (_a) {
+    var theme = _a.theme;
+    return ({
+        backgroundColor: theme.name.includes('dark') ? theme.spr.ui05 : '#212123',
+    });
+});
+export var StyledMessage = styled('div', 'typography-bs1 ml-3 flex-1 flex items-center spr-text-05');
+export var getIconStyles = function (utils, props) { return ({
+    fill: intentColor(utils, props, utils.theme.supportSuccess),
+}); };

package/esm/snackbar/types.d.ts

@@ -0,0 +1,37 @@
+/// <reference types="react" />
+import { Override } from '../overrides';
+export declare type Intent = 'success' | 'error' | 'warning';
+export declare type HideReason = 'timeout' | 'clickaway' | 'manualClose' | 'messageChange';
+export declare type Placement = 'topLeft' | 'top' | 'topRight' | 'bottomLeft' | 'bottom' | 'bottomRight';
+declare type SharedProps = {
+    $intent: Intent;
+    $hideOnClickAway: boolean;
+    $disableManualClose: boolean;
+    $autoHideDuration: number;
+    $autoHide?: boolean;
+    $placement: Placement;
+    $open: boolean;
+};
+export declare type SnackbarProps = {
+    message?: React.ReactNode;
+    intent?: Intent;
+    hideOnClickAway?: boolean;
+    disableManualClose?: boolean;
+    autoHideDuration?: number;
+    autoHide?: boolean;
+    onClose?: (reason: HideReason) => void;
+    placement?: Placement;
+    overrides?: {
+        Layer?: Override<SharedProps & Record<string, any>>;
+        PlacementContainer?: Override<SharedProps & Record<string, any>>;
+        SnackbarContainer?: Override<SharedProps & Record<string, any>>;
+        ContentContainer?: Override<SharedProps & Record<string, any>>;
+        Message?: Override<SharedProps & Record<string, any>>;
+        CloseIcon?: Override<SharedProps & Record<string, any>>;
+        CloseIconButton?: Override<SharedProps & Record<string, any>>;
+        IconsContainer?: Override<SharedProps & Record<string, any>>;
+        IntentIcon?: Override<SharedProps & Record<string, any>>;
+        SnackbarIcon?: Override<SharedProps & Record<string, any>>;
+    };
+};
+export {};

package/esm/snackbar/types.js

@@ -0,0 +1 @@
+export {};

package/esm/snackbar/useSnackbar.d.ts

@@ -0,0 +1,24 @@
+import { MutableRefObject, ReactNode } from 'react';
+import { HideReason, Intent } from './types';
+declare type UseSnackbarParams = {
+    autoHide: boolean;
+    autoHideDuration: number;
+    hideOnClickAway: boolean;
+    intent: Intent;
+    message?: React.ReactNode;
+    onClose?: (reason: HideReason) => void;
+};
+declare type UseSnackbarReturnValue = {
+    open: boolean;
+    shouldRender: boolean;
+    handleClose: (reason: HideReason) => void;
+    snackbarContainerRef: MutableRefObject<HTMLElement | null>;
+    snackbarContainerProps: {
+        onMouseEnter: () => void;
+        onMouseLeave: () => void;
+    };
+    message: ReactNode;
+    intent: Intent;
+};
+declare const useSnackbar: ({ autoHide, autoHideDuration, hideOnClickAway, intent: nextIntent, message: nextMessage, onClose, }: UseSnackbarParams) => UseSnackbarReturnValue;
+export default useSnackbar;