@sprinklrjs/spaceweb 10.1.0 → 12.14.4

package/hooks/useCombinedRef.js

@@ -1,8 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.combineRefs = void 0;
+exports.useCombineRefObjects = exports.combineRefs = void 0;
 var tslib_1 = require("tslib");
 var react_1 = require("react");
+var React = (0, tslib_1.__importStar)(require("react"));
 function combineRefs() {
     var refs = [];
     for (var _i = 0; _i < arguments.length; _i++) {
@@ -22,6 +23,39 @@ function combineRefs() {
     };
 }
 exports.combineRefs = combineRefs;
+function useCombineRefObjects() {
+    var refs = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        refs[_i] = arguments[_i];
+    }
+    var targetRef = React.useRef(null);
+    React.useEffect(function () {
+        refs.forEach(function (ref) {
+            if (!ref)
+                return;
+            if (typeof ref === 'function') {
+                ref(targetRef.current);
+            }
+            else {
+                ref.current = targetRef.current;
+            }
+        });
+        return function () {
+            refs.forEach(function (ref) {
+                if (!ref)
+                    return;
+                if (typeof ref === 'function') {
+                    ref(targetRef.current);
+                }
+                else {
+                    ref.current = targetRef.current;
+                }
+            });
+        };
+    }, (0, tslib_1.__spreadArray)([], (0, tslib_1.__read)(refs), false)); // eslint-disable-line react-hooks/exhaustive-deps
+    return targetRef;
+}
+exports.useCombineRefObjects = useCombineRefObjects;
 /*
  * combines multiple refs to single MutableRefObject - when one wants to assign same element/instance to multiple refs
  * https://github.com/facebook/react/issues/13029#issue-331682836

package/hooks/useIsMobileDevice.d.ts

@@ -0,0 +1 @@
+export declare const useIsMobileDevice: () => boolean;

package/hooks/useIsMobileDevice.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useIsMobileDevice = void 0;
+var tslib_1 = require("tslib");
+var theme_1 = require("../theme");
+var useMatchMedia_1 = (0, tslib_1.__importDefault)(require("./useMatchMedia"));
+var useIsMobileDevice = function () {
+    var currentTheme = (0, theme_1.useTheme)();
+    return (0, useMatchMedia_1.default)("(max-width: ".concat(currentTheme.theme.screens.md, ")"), false);
+};
+exports.useIsMobileDevice = useIsMobileDevice;

package/hooks/useMatchMedia.d.ts

@@ -0,0 +1,3 @@
+export declare const isBrowser: boolean;
+declare const useMedia: (query: string, defaultState?: boolean | undefined) => boolean;
+export default useMedia;

package/hooks/useMatchMedia.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isBrowser = void 0;
+var tslib_1 = require("tslib");
+var react_1 = require("react");
+exports.isBrowser = typeof window !== 'undefined';
+var getInitialState = function (query, defaultState) {
+    // Prevent a React hydration mismatch when a default value is provided by not defaulting to window.matchMedia(query).matches.
+    if (defaultState !== undefined) {
+        return defaultState;
+    }
+    if (exports.isBrowser) {
+        return window.matchMedia(query).matches;
+    }
+    // A default value has not been provided, and you are rendering on the server, warn of a possible hydration mismatch when defaulting to false.
+    if (process.env.NODE_ENV !== 'production') {
+        console.warn('`useMedia` When server side rendering, defaultState should be defined to prevent a hydration mismatches.');
+    }
+    return false;
+};
+var useMedia = function (query, defaultState) {
+    var _a = (0, tslib_1.__read)((0, react_1.useState)(getInitialState(query, defaultState)), 2), state = _a[0], setState = _a[1];
+    (0, react_1.useEffect)(function () {
+        var mounted = true;
+        var mediaQueryList = window.matchMedia(query);
+        var onChange = function () {
+            if (!mounted) {
+                return;
+            }
+            setState(!!mediaQueryList.matches);
+        };
+        // addListener is deprecated but older version of safari still have not implemented addEventListener so adding check
+        if ('addEventListener' in mediaQueryList) {
+            mediaQueryList.addEventListener('change', onChange);
+        }
+        else {
+            mediaQueryList.addListener(onChange);
+        }
+        setState(mediaQueryList.matches);
+        return function () {
+            mounted = false;
+            if ('removeEventListener' in mediaQueryList) {
+                mediaQueryList.removeEventListener('change', onChange);
+            }
+            else {
+                mediaQueryList.removeListener(onChange);
+            }
+        };
+    }, [query]);
+    return state;
+};
+exports.default = useMedia;

package/icon/components/alert-solid.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function AlertSolid(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "AlertSolid" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M7.063.012a6.994 6.994 0 1 0 6.994 6.994A6.996 6.996 0 0 0 7.063.012zm0 7.693a.701.701 0 0 1-.7-.699V4.21a.701.701 0 0 1 .7-.7.701.701 0 0 1 .7.7v2.797a.701.701 0 0 1-.7.7zm0 2.798a.701.701 0 0 1-.7-.7.701.701 0 0 1 .7-.699.701.701 0 0 1 .7.7.701.701 0 0 1-.7.699z" }, void 0) }), void 0));
 }
 exports.default = AlertSolid;

package/icon/components/alert.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function Alert(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsxs)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 12 12", "data-icon-name": "Alert" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M5.904 6.5a.5.5 0 0 1-.5-.5V3.25a.5.5 0 1 1 1 0V6a.5.5 0 0 1-.5.5z" }, void 0), (0, jsx_runtime_1.jsx)("circle", { cx: "5.904", cy: "8.161", r: ".589" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M6 12c-3.308 0-6-2.69-6-6s2.692-6 6-6 6 2.692 6 6-2.691 6-6 6zM6 1C3.244 1 1 3.243 1 6s2.244 5 5 5 5-2.243 5-5-2.243-5-5-5z" }, void 0)] }), void 0));
 }
 exports.default = Alert;

package/icon/components/calendar-solid.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function CalendarSolid(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 15 15", "data-icon-name": "CalendarSolid" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M12.4 1.6c.9 0 1.7.8 1.7 1.7v1.2H0V3.3c0-.9.8-1.7 1.7-1.7h.9V0h1.6v1.6h5.6V0h1.6v1.6h1zM0 13.4V6.1h14.1v7.3c0 .9-.8 1.6-1.7 1.6H1.7C.8 15 0 14.3 0 13.4z" }, void 0) }), void 0));
 }
 exports.default = CalendarSolid;

package/icon/components/chevron-down.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function ChevronDown(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "ChevronDown" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M7 10.922a.84.84 0 01-.597-.248L.247 4.518a.843.843 0 111.194-1.192L7 8.884l5.56-5.558a.844.844 0 011.193 1.192l-6.156 6.156a.84.84 0 01-.597.248z" }, void 0) }), void 0));
 }
 exports.default = ChevronDown;

package/icon/components/chevron-left.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { IconProps } from '../types';
+export default function ChevronLeft(props: IconProps): React.ReactElement;

package/icon/components/chevron-left.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
+var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
+function ChevronLeft(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
+    return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "ChevronLeft" }, props, { className: isRTL ? [{ transform: 'scaleX(-1)' }, props.className] : props.className }, { children: (0, jsx_runtime_1.jsx)("path", { d: "M10.693 13.728a.931.931 0 00-.001-1.316L5.282 7l5.41-5.41A.93.93 0 009.379.271h-.001l-6.07 6.07a.931.931 0 000 1.316l6.069 6.07a.931.931 0 001.316 0z" }, void 0) }), void 0));
+}
+exports.default = ChevronLeft;

package/icon/components/chevron-right.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { IconProps } from '../types';
+export default function ChevronRight(props: IconProps): React.ReactElement;

package/icon/components/chevron-right.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
+var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
+function ChevronRight(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
+    return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "ChevronRight" }, props, { className: isRTL ? [{ transform: 'scaleX(-1)' }, props.className] : props.className }, { children: (0, jsx_runtime_1.jsx)("path", { d: "M3.307.272a.931.931 0 00.001 1.316L8.718 7l-5.41 5.41a.93.93 0 001.313 1.318h.001l6.07-6.07a.931.931 0 000-1.316L4.623.272a.931.931 0 00-1.316 0z" }, void 0) }), void 0));
+}
+exports.default = ChevronRight;

package/icon/components/close.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function Close(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "Close" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M12.8 12.7c.3-.3.3-.8 0-1L8 7l4.6-4.7c.3-.3.3-.8 0-1.1-.3-.3-.8-.3-1.1 0L6.9 6 2.3 1.3C2 1 1.5 1 1.2 1.3s-.3.7 0 1L5.9 7l-4.7 4.7c-.3.3-.3.8 0 1.1.3.3.8.3 1 0l4.7-4.7 4.7 4.6c.3.3.8.3 1.2 0z" }, void 0) }), void 0));
 }
 exports.default = Close;

package/icon/components/error-clr.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function ErrorClr(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsxs)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "ErrorClr" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { fill: "#FF6060", d: "M6.304 1.636c.385-.63 1.008-.63 1.391-.002l2.147 3.52 3.987 6.541c.385.63.097 1.142-.64 1.142H.81c-.737 0-1.024-.51-.639-1.142l6.133-10.06z" }, void 0), (0, jsx_runtime_1.jsx)("path", { fill: "#FFF", d: "M6.69 9.895h.843v.841H6.69zm0-4.624h.843v3.783H6.69z" }, void 0)] }), void 0));
 }
 exports.default = ErrorClr;

package/icon/components/error-solid.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function ErrorSolid(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 11.77", "data-icon-name": "ErrorSolid" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M13.87 10.4 7.77.42a.9.9 0 0 0-1.54 0L.13 10.4a.9.9 0 0 0 .78 1.38h12.18a.9.9 0 0 0 .78-1.38zM6.49 3.44a.46.46 0 0 1 .51-.4.46.46 0 0 1 .5.4v2.83a.46.46 0 0 1-.5.4.46.46 0 0 1-.5-.4zM7 9.29a.76.76 0 1 1 .76-.76.76.76 0 0 1-.76.76z", fillRule: "evenodd" }, void 0) }), void 0));
 }
 exports.default = ErrorSolid;

package/icon/components/error.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function Error(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsxs)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 11.98", "data-icon-name": "Error" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M13.78 9.73L8.26.7a1.48 1.48 0 00-2.53 0L.22 9.73a1.48 1.48 0 001.26 2.25h11.04a1.48 1.48 0 001.26-2.25zm-1 1.2a.5.5 0 01-.26.06H1.48a.5.5 0 01-.42-.75l5.52-9.02A.5.5 0 017 1a.49.49 0 01.26.07.48.48 0 01.16.16l5.52 9.02a.5.5 0 01-.16.68z" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M7 7.6a.44.44 0 00.48-.37V4.55A.44.44 0 007 4.17a.44.44 0 00-.48.38v2.68A.44.44 0 007 7.6zM7 8.63a.72.72 0 10.72.72.72.72 0 00-.72-.72z" }, void 0)] }), void 0));
 }
 exports.default = Error;

package/icon/components/imagePreview.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function ImagePreview(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsxs)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "ImagePreview" }, props, { children: [(0, jsx_runtime_1.jsx)("circle", { fillRule: "evenodd", clipRule: "evenodd", cx: "12.5", cy: "3.35", r: "1.5" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M9.33 14H0l3.87-5.5c.36-.52 1.29-.51 1.64 0L9.33 14zm1.52-.01l-1.52-2.18 1.2-1.4c.09-.13.25-.22.3-.19.11 0 .22.06.3.17L14 14h-3.15v-.01z" }, void 0)] }), void 0));
 }
 exports.default = ImagePreview;

package/icon/components/info.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function Info(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "Info" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M9.627 11.36a.196.196 0 0 0-.245-.067c-.962.455-2.053.936-2.267.978a.189.189 0 0 1-.025-.029.256.256 0 0 1-.043-.157c0-.544.41-2.198 1.22-4.916.682-2.284.76-2.757.76-2.914a.742.742 0 0 0-.268-.592c-.166-.138-.4-.208-.692-.208-.488 0-1.052.185-1.727.566-.653.369-1.382.993-2.166 1.857a.196.196 0 0 0 .219.312c.275-.112 1.658-.678 1.86-.805.164-.104.307-.156.424-.156a.14.14 0 0 1 .01 0c.002.008.004.02.004.037 0 .119-.025.26-.073.418-1.179 3.819-1.751 6.16-1.751 7.156 0 .352.097.635.29.842.197.211.462.318.788.318.348 0 .77-.145 1.294-.444.506-.29 1.278-.925 2.36-1.944a.195.195 0 0 0 .028-.253zM9.589.297A.985.985 0 0 0 8.857 0c-.366 0-.684.144-.946.429a1.46 1.46 0 0 0-.389 1.021c0 .314.097.575.287.774a.96.96 0 0 0 .722.305c.35 0 .667-.153.94-.453a1.49 1.49 0 0 0 .406-1.033c0-.299-.097-.55-.288-.746z", fillRule: "evenodd", clipRule: "evenodd" }, void 0) }), void 0));
 }
 exports.default = Info;

package/icon/components/play-video.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function PlayVideo(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsxs)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 12 12", "data-icon-name": "PlayVideo" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M6 12c-3.309 0-6-2.691-6-6s2.691-6 6-6 6 2.691 6 6-2.691 6-6 6zM6 .5A5.506 5.506 0 00.5 6c0 3.032 2.467 5.5 5.5 5.5 3.032 0 5.5-2.468 5.5-5.5C11.5 2.967 9.032.5 6 .5z" }, void 0), (0, jsx_runtime_1.jsx)("path", { d: "M4.624 3.906l3.533 2.04c.08.046.08.163 0 .21l-3.533 2.04a.121.121 0 01-.182-.106V4.011c0-.093.101-.152.182-.105z" }, void 0)] }), void 0));
 }
 exports.default = PlayVideo;

package/icon/components/reset-color.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { IconProps } from '../types';
+export default function ResetColor(props: IconProps): React.ReactElement;

package/icon/components/reset-color.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
+var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
+function ResetColor(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
+    return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 12 12", "data-icon-name": "ResetColor" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M4.44444 1.66669L4.69634 1.30338C5.11546 0.698908 6.02178 0.738542 6.38652 1.3773L7.57013 3.45004C8.31387 4.7577 8.83652 6.0973 9.18519 7.22231L4.44444 1.66669ZM3.14308 4.28626L1.10565 1.99387C0.677217 1.51182 1.01942 0.749859 1.66434 0.749859C1.87784 0.749859 2.08116 0.841161 2.223 1.00074L10.8943 10.756C11.3227 11.238 10.9806 12 10.3357 12C10.1222 12 9.91885 11.9087 9.77701 11.7491L8.73097 10.5722C7.94302 11.4637 6.73598 12 5.6 12C3.68 12 1.6 10.5469 1.6 8.33438C1.6 6.89807 2.30094 5.71492 3.14308 4.28626Z" }, void 0) }), void 0));
+}
+exports.default = ResetColor;

package/icon/components/search.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function Search(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 12 12", "data-icon-name": "Search" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M11.854 11.149L7.75 7.037a4.32 4.32 0 00.946-2.68A4.356 4.356 0 004.348 0a4.357 4.357 0 000 8.713 4.299 4.299 0 002.7-.969l4.102 4.11a.496.496 0 00.704 0 .5.5 0 000-.705zM4.348 7.716a3.36 3.36 0 010-6.719 3.36 3.36 0 010 6.719z" }, void 0) }), void 0));
 }
 exports.default = Search;

package/icon/components/tick.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function Tick(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "Tick" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M4.792 12.037a.935.935 0 0 1-.657-.269L.28 7.975A.936.936 0 0 1 1.593 6.64L4.79 9.784l7.615-7.556a.936.936 0 0 1 1.32 1.329l-8.272 8.208a.935.935 0 0 1-.66.272z" }, void 0) }), void 0));
 }
 exports.default = Tick;

package/icon/components/tickCircle-solid.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function TickCircleSolid(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "TickCircleSolid" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "m9.53 4.44-3.64 3.6-1.42-1.4a.72.72 0 1 0-1 1.03l1.92 1.9a.72.72 0 0 0 1.01 0l4.14-4.11a.72.72 0 1 0-1.01-1.02zM7 0a7 7 0 1 1-7 7 7 7 0 0 1 7-7z", fillRule: "evenodd" }, void 0) }), void 0));
 }
 exports.default = TickCircleSolid;

package/icon/components/user.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function User(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsxs)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "User" }, props, { children: [(0, jsx_runtime_1.jsx)("path", { d: "M13.823 13.946c.003-.081.024-.159.024-.24a6.847 6.847 0 10-13.694-.001c0 .082.021.16.024.241z" }, void 0), (0, jsx_runtime_1.jsx)("circle", { cx: "7", cy: "2.889", r: "2.835" }, void 0)] }), void 0));
 }
 exports.default = User;

package/icon/components/video-non-playable.js

@@ -2,8 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
 var jsx_runtime_1 = require("react/jsx-runtime");
+var style_1 = require("../../style");
 var icon_1 = (0, tslib_1.__importDefault)(require("../icon"));
 function VideoNonPlayable(props) {
+    var _a = (0, style_1.useStyle)(), theme = _a.theme, isRTL = _a.isRTL;
     return ((0, jsx_runtime_1.jsx)(icon_1.default, (0, tslib_1.__assign)({ viewBox: "0 0 14 14", "data-icon-name": "VideoNonPlayable" }, props, { children: (0, jsx_runtime_1.jsx)("path", { d: "M1 3.72v6.56a.092.092 0 00.09.1h.75l-.57 1h-.18A1.095 1.095 0 010 10.28V3.72a1.095 1.095 0 011.09-1.1h5.17l-.57 1h-4.6a.092.092 0 00-.09.1zm13 5.55a.734.734 0 01-.73.73.721.721 0 01-.34-.09L10.47 8.8v1.48a1.095 1.095 0 01-1.09 1.1H3.65l-.91 1.63a.59.59 0 01-.52.31.603.603 0 01-.29-.08.578.578 0 01-.21-.2l.94-1.66.57-1 3.84-6.76.57-1L8.62.9a.191.191 0 00.03-.08.67.67 0 01.18.07.595.595 0 01.23.81l-.51.92h.83a1.095 1.095 0 011.09 1.1v1.46l2.45-1.12a.707.707 0 01.34-.08.721.721 0 01.73.73zM9.48 3.72a.1.1 0 00-.1-.1H7.99l-3.78 6.76h5.17a.1.1 0 00.1-.1zM13 5.13l-2.5 1.14v1.45L13 8.85z" }, void 0) }), void 0));
 }
 exports.default = VideoNonPlayable;

package/index.d.ts

@@ -1,3 +1,5 @@
 export * from './classNames';
 export * from './spacewebProvider';
 export * from './types';
+import rtlCSSJS from 'rtl-css-js';
+export { rtlCSSJS };

package/index.js

@@ -1,6 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.rtlCSSJS = void 0;
 var tslib_1 = require("tslib");
 (0, tslib_1.__exportStar)(require("./classNames"), exports);
 (0, tslib_1.__exportStar)(require("./spacewebProvider"), exports);
 (0, tslib_1.__exportStar)(require("./types"), exports);
+var rtl_css_js_1 = (0, tslib_1.__importDefault)(require("rtl-css-js"));
+exports.rtlCSSJS = rtl_css_js_1.default;

package/input/basewebAdapters.d.ts

@@ -2,6 +2,6 @@ import { InputProps, StatefulInputProps } from './types';
 import { BaseInputOverrides } from 'baseui/input';
 declare type AdapterProps = Omit<InputProps | StatefulInputProps, 'autoFocus'>;
 declare const useInputBasewebAdapter: (props: AdapterProps) => Omit<AdapterProps, "size" | "style" | "className" | "overrides" | "variant" | "intent"> & {
-    overrides?: BaseInputOverrides<any> | undefined;
+    overrides?: BaseInputOverrides | undefined;
 };
 export default useInputBasewebAdapter;

package/input/basewebAdapters.js

@@ -9,8 +9,12 @@ var ClearIconButton_1 = (0, tslib_1.__importDefault)(require("../helpers/ClearIc
 var context_1 = require("../form-control/context");
 var useDebouncedEventHandler_1 = require("../hooks/useDebouncedEventHandler");
 var noop_1 = (0, tslib_1.__importDefault)(require("lodash/noop"));
+var style_1 = require("../style");
+var themeHelpers_1 = require("../helpers/themeHelpers");
 var useInputBasewebAdapter = function (props) {
-    var _a = (0, context_1.useContextualFormProps)(props), size = _a.size, variant = _a.variant, className = _a.className, style = _a.style, intent = _a.intent, overrides = _a.overrides, onChange = _a.onChange, debouncedOnChange = _a.debouncedOnChange, debounceInterval = _a.debounceInterval, restProps = (0, tslib_1.__rest)(_a, ["size", "variant", "className", "style", "intent", "overrides", "onChange", "debouncedOnChange", "debounceInterval"]);
+    var _a = (0, context_1.useContextualFormProps)(props), _size = _a.size, variant = _a.variant, className = _a.className, style = _a.style, intent = _a.intent, overrides = _a.overrides, onChange = _a.onChange, debouncedOnChange = _a.debouncedOnChange, debounceInterval = _a.debounceInterval, restProps = (0, tslib_1.__rest)(_a, ["size", "variant", "className", "style", "intent", "overrides", "onChange", "debouncedOnChange", "debounceInterval"]);
+    var theme = (0, style_1.useStyle)().theme;
+    var size = _size !== null && _size !== void 0 ? _size : (0, themeHelpers_1.getDefaultSize)(theme);
     var handleChange = (0, useDebouncedEventHandler_1.useDebouncedEventHandler)(debouncedOnChange !== null && debouncedOnChange !== void 0 ? debouncedOnChange : noop_1.default, onChange, debounceInterval || 200);
     var sharedProps = (0, helpers_1.add$props)({ size: size, variant: variant, intent: intent });
     var convertedOverrides = (0, useConvertOverrides_1.useConvertOverrides)({
@@ -27,8 +31,19 @@ var useInputBasewebAdapter = function (props) {
             props: sharedProps,
         },
         Input: {
-            style: [styled_components_1.getInputStyles, (0, longHandHelpers_1.borderRadius)('inherit')],
-            props: sharedProps,
+            style: [
+                styled_components_1.getInputStyles,
+                (0, longHandHelpers_1.borderRadius)('inherit'),
+                // To remove the spin buttons on input field with type number
+                props.type === 'number'
+                    ? {
+                        '::-webkit-inner-spin-button': { '-webkit-appearance': 'none' },
+                        '::-webkit-outer-spin-button': { '-webkit-appearance': 'none' },
+                        '-moz-appearance': 'textfield',
+                    }
+                    : {},
+            ],
+            props: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, sharedProps), { 'aria-required': restProps['aria-required'] }),
         },
         StartEnhancer: {
             style: styled_components_1.getEnhancerStyles,

package/input/index.d.ts

@@ -1,4 +1,5 @@
 export { StatefulContainer, StyledRoot, StyledInputEnhancer, StyledStartEnhancer, StyledEndEnhancer, StyledInputContainer, StyledInput, STATE_CHANGE_TYPE, ADJOINED, CUSTOM_INPUT_TYPE, } from 'baseui/input';
-export type { BaseInput, ENHANCER_POSITION, BaseInputOverrides, BaseInputProps, State, InternalState, StatefulContainerProps, } from 'baseui/input';
+export type { BaseInput, BaseInputOverrides, BaseInputProps, State, InternalState, StatefulContainerProps, } from 'baseui/input';
+export { ENHANCER_POSITION } from 'baseui/input/constants';
 export { Input, StatefulInput, MaskedInput } from './input';
 export * from './types';

package/input/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MaskedInput = exports.StatefulInput = exports.Input = exports.CUSTOM_INPUT_TYPE = exports.ADJOINED = exports.STATE_CHANGE_TYPE = exports.StyledInput = exports.StyledInputContainer = exports.StyledEndEnhancer = exports.StyledStartEnhancer = exports.StyledInputEnhancer = exports.StyledRoot = exports.StatefulContainer = void 0;
+exports.MaskedInput = exports.StatefulInput = exports.Input = exports.ENHANCER_POSITION = exports.CUSTOM_INPUT_TYPE = exports.ADJOINED = exports.STATE_CHANGE_TYPE = exports.StyledInput = exports.StyledInputContainer = exports.StyledEndEnhancer = exports.StyledStartEnhancer = exports.StyledInputEnhancer = exports.StyledRoot = exports.StatefulContainer = void 0;
 var tslib_1 = require("tslib");
 var input_1 = require("baseui/input");
 Object.defineProperty(exports, "StatefulContainer", { enumerable: true, get: function () { return input_1.StatefulContainer; } });
@@ -13,6 +13,8 @@ Object.defineProperty(exports, "StyledInput", { enumerable: true, get: function
 Object.defineProperty(exports, "STATE_CHANGE_TYPE", { enumerable: true, get: function () { return input_1.STATE_CHANGE_TYPE; } });
 Object.defineProperty(exports, "ADJOINED", { enumerable: true, get: function () { return input_1.ADJOINED; } });
 Object.defineProperty(exports, "CUSTOM_INPUT_TYPE", { enumerable: true, get: function () { return input_1.CUSTOM_INPUT_TYPE; } });
+var constants_1 = require("baseui/input/constants");
+Object.defineProperty(exports, "ENHANCER_POSITION", { enumerable: true, get: function () { return constants_1.ENHANCER_POSITION; } });
 var input_2 = require("./input");
 Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return input_2.Input; } });
 Object.defineProperty(exports, "StatefulInput", { enumerable: true, get: function () { return input_2.StatefulInput; } });

package/input/styled-components.d.ts

@@ -3,4 +3,4 @@ import { SharedProps } from './types';
 export declare const getInputContainerStyles: Styles;
 export declare const getEnhancerStyles: Styles;
 export declare const getPlaceholderTypography: Styles;
-export declare const getInputStyles: StyleFn<SharedProps>;
+export declare const getInputStyles: StyleFn<Partial<Pick<SharedProps, '$size' | '$disabled' | '$variant'>>>;

package/input/styled-components.js

@@ -7,12 +7,13 @@ var themeHelpers_1 = require("../helpers/themeHelpers");
 var longHandHelpers_1 = require("../helpers/longHandHelpers");
 var intentHelper_1 = require("../helpers/intentHelper");
 var inputBorderRadius = function (_a, _b) {
+    var _c;
     var theme = _a.theme;
-    var _c = _b.$variant, $variant = _c === void 0 ? 'default' : _c, $adjoined = _b.$adjoined;
+    var _d = _b.$variant, $variant = _d === void 0 ? 'default' : _d, $adjoined = _b.$adjoined, $size = _b.$size;
     if ($variant === 'line') {
         return (0, longHandHelpers_1.borderRadius)(0);
     }
-    var styles = (0, longHandHelpers_1.borderRadius)(theme.input.borderRadius);
+    var styles = (0, longHandHelpers_1.borderRadius)(((_c = (0, themeHelpers_1.getComponentSizeTheme)(theme, 'input', $size, (0, themeHelpers_1.getDefaultSize)(theme))) === null || _c === void 0 ? void 0 : _c.borderRadius) || theme.input.borderRadius);
     switch ($adjoined) {
         case input_1.ADJOINED.left:
             return (0, tslib_1.__assign)((0, tslib_1.__assign)({}, styles), { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 });
@@ -66,13 +67,14 @@ exports.getInputContainerStyles = [
     },
 ];
 var enhancerBorderRadius = function (utils, _a) {
-    var $isStart = _a.$isStart, $variant = _a.$variant;
+    var _b, _c;
+    var $isStart = _a.$isStart, $variant = _a.$variant, $size = _a.$size;
     var theme = utils.theme;
     if ($variant === 'line') {
         return 'rounded-0';
     }
     return $isStart
-        ? (0, tslib_1.__assign)((0, tslib_1.__assign)({}, (0, longHandHelpers_1.borderRadius)(theme.input.borderRadius)), { borderTopRightRadius: 0, borderBottomRightRadius: 0 }) : (0, tslib_1.__assign)((0, tslib_1.__assign)({}, (0, longHandHelpers_1.borderRadius)(theme.input.borderRadius)), { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 });
+        ? (0, tslib_1.__assign)((0, tslib_1.__assign)({}, (0, longHandHelpers_1.borderRadius)(((_b = (0, themeHelpers_1.getComponentSizeTheme)(theme, 'input', $size, (0, themeHelpers_1.getDefaultSize)(theme))) === null || _b === void 0 ? void 0 : _b.borderRadius) || theme.input.borderRadius)), { borderTopRightRadius: 0, borderBottomRightRadius: 0 }) : (0, tslib_1.__assign)((0, tslib_1.__assign)({}, (0, longHandHelpers_1.borderRadius)(((_c = (0, themeHelpers_1.getComponentSizeTheme)(theme, 'input', $size, (0, themeHelpers_1.getDefaultSize)(theme))) === null || _c === void 0 ? void 0 : _c.borderRadius) || theme.input.borderRadius)), { borderTopLeftRadius: 0, borderBottomLeftRadius: 0 });
 };
 var enhancerBorderWidth = function (_a, _b) {
     var _c;
@@ -121,7 +123,7 @@ var getInputStyles = function (utils, props) {
         // baseweb applies this style in order to support style in safari
         styles['-webkit-text-fill-color'] = theme.spr.text02;
     }
-    var inputSizeTheme = (0, themeHelpers_1.getComponentSizeTheme)(theme, 'input', $size, 'lg');
+    var inputSizeTheme = (0, themeHelpers_1.getComponentSizeTheme)(theme, 'input', $size, (0, themeHelpers_1.getDefaultSize)(theme));
     styles.lineHeight = inputSizeTheme.lineHeight;
     styles.paddingLeft = styles.paddingRight = inputSizeTheme.paddingX;
     styles.paddingTop = styles.paddingBottom = inputSizeTheme.paddingY;

package/input/types.d.ts

@@ -1,7 +1,11 @@
+import { Ref, ChangeEvent } from 'react';
 import { InputProps as BaseInputProps, StatefulInputProps as BaseStatefulInputProps, SharedProps as BaseSharedProps, InputOverrides as BaseUIInputOverrides } from 'baseui/input';
 import { SpacewebComponentProps, Intent } from '../types';
 import { Override } from '../overrides';
-export declare type InputSize = 'sm' | 'md' | 'lg';
+/**
+ * lg size is deprecated. Please use md.
+ */
+export declare type InputSize = 'xxxs' | 'xs' | 'sm' | 'md' | 'lg';
 export declare type InputVariant = 'default' | 'line';
 export declare type InputOverrides = {
     [key in keyof BaseUIInputOverrides]?: Override<SharedProps & Record<string, any>>;
@@ -20,9 +24,11 @@ declare type CommonInputProps = {
     size?: InputSize;
     overrides?: InputOverrides;
     intent?: Intent;
-    debouncedOnChange?: BaseInputProps['onChange'];
+    debouncedOnChange?: (e: ChangeEvent<HTMLInputElement>) => void;
     debounceInterval?: number;
     autoFocus?: FocusPosition;
+    inputRef?: Ref<HTMLInputElement>;
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
 };
 export declare type SharedProps = Omit<BaseSharedProps, '$size' | '$positive' | '$error'> & {
     $isStart: boolean;
@@ -30,8 +36,8 @@ export declare type SharedProps = Omit<BaseSharedProps, '$size' | '$positive' |
     $variant: InputVariant;
     $intent: Intent;
 };
-export declare type InputProps = Omit<SpacewebComponentProps<BaseInputProps>, 'size' | 'overrides' | 'positive' | 'error' | 'autoFocus'> & CommonInputProps;
-export declare type StatefulInputProps = Omit<SpacewebComponentProps<BaseStatefulInputProps>, 'size' | 'overrides' | 'positive' | 'error' | 'autoFocus'> & CommonInputProps;
+export declare type InputProps = Omit<SpacewebComponentProps<BaseInputProps>, 'positive' | 'error' | keyof CommonInputProps> & CommonInputProps;
+export declare type StatefulInputProps = Omit<SpacewebComponentProps<BaseStatefulInputProps>, 'positive' | 'error' | keyof CommonInputProps> & CommonInputProps;
 export interface MaskedInputProps extends InputProps {
     mask?: string;
     maskChar?: string;

package/layer/useLayersContextValue.js

@@ -51,6 +51,7 @@ var useLayersContextValue = function () {
             resetHandlers();
         };
     }, [doc, onDocumentClick, onKeyUp]);
-    return (0, react_1.useMemo)(function () { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, ctxValue), { addEscapeHandler: addEscapeHandler, removeEscapeHandler: removeEscapeHandler, addDocClickHandler: addDocClickHandler, removeDocClickHandler: removeDocClickHandler })); }, [ctxValue]);
+    var contextValues = ctxValue && typeof ctxValue === 'object' ? Object.values(ctxValue) : [];
+    return (0, react_1.useMemo)(function () { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, ctxValue), { addEscapeHandler: addEscapeHandler, removeEscapeHandler: removeEscapeHandler, addDocClickHandler: addDocClickHandler, removeDocClickHandler: removeDocClickHandler })); }, (0, tslib_1.__spreadArray)([], (0, tslib_1.__read)(contextValues), false));
 };
 exports.default = useLayersContextValue;