@sprinklrjs/spaceweb 12.14.4 → 12.33.2

package/esm/date-picker/index.js

@@ -1,7 +1,7 @@
 import Calendar from './Calendar';
 import DatePickerInput from './DatePickerInput';
 export { Calendar };
-export { StyledCalendarContainer, StyledCalendarHeader, StyledInputWrapper, StyledMonth, StyledMonthContainer, StyledMonthHeader, StyledMonthYearSelectButton, StyledMonthYearSelectIconContainer, StyledNextButton, StyledPrevButton, StyledRoot, StyledSelectorContainer, StyledWeek, StyledWeekdayHeader, } from 'baseui/datepicker/styled-components';
+export { StyledCalendarContainer, StyledCalendarHeader, StyledInputWrapper, StyledMonth, StyledMonthContainer, StyledMonthHeader, StyledMonthYearSelectButton, StyledMonthYearSelectIconContainer, StyledNextButton, StyledPrevButton, StyledRoot, StyledSelectorContainer, StyledWeek, StyledWeekdayHeader, } from '../baseui/datepicker/styled-components';
 export { DatePicker } from './DatePicker';
 export { DatePickerInput };
 export { StatelessDatePicker } from './StatelessDatePicker';

package/esm/date-picker/stateful-container.d.ts

@@ -3,7 +3,7 @@ import { StatefulContainerProps } from './types';
 declare const StatefulContainer: {
     ({ adapter, onChange, value, startOpen, ...props }: StatefulContainerProps): ReactElement;
     defaultProps: {
-        adapter: import("baseui/datepicker/utils/types").DateIOAdapter<Date>;
+        adapter: import("../baseui/datepicker/utils/types").DateIOAdapter<Date>;
     };
 };
 export default StatefulContainer;

package/esm/date-picker/stateful-container.js

@@ -1,6 +1,6 @@
 import { __assign, __read, __rest } from "tslib";
 import * as React from 'react';
-import dateFnsAdapter from 'baseui/datepicker/utils/date-fns-adapter';
+import dateFnsAdapter from '../baseui/datepicker/utils/date-fns-adapter';
 import { useDatePickerState } from './useDatePickerState';
 import { getSystemTzName } from '../time-range-picker/utils';
 var StatefulContainer = function (_a) {

package/esm/date-picker/styled-components.js

@@ -1,6 +1,6 @@
 import { __assign } from "tslib";
-import getDayStateCode from 'baseui/datepicker/utils/day-state';
-import dateFnsAdapter from 'baseui/datepicker/utils/date-fns-adapter';
+import getDayStateCode from '../baseui/datepicker/utils/day-state';
+import dateFnsAdapter from '../baseui/datepicker/utils/date-fns-adapter';
 import { styled } from '../style';
 export var StyledInputWrapper = styled('div');
 var getEdgeDayBeforeStyle = function (code, firstChild, peekNextMonth) {
@@ -102,12 +102,13 @@ var getTempRTLAdaptedStyles = function (code) {
     return dayStyles[code] || {};
 };
 export var getDayStyles = function (todaySOD) { return [
-    'text-12 leading-8 w-9',
+    'text-12 leading-8 w-9 flex items-center justify-center',
     function (_a, props) {
         var theme = _a.theme, px2rem = _a.px2rem;
-        var $isHighlighted = props.$isHighlighted, $hasRangeHighlighted = props.$hasRangeHighlighted, $date = props.$date, $selected = props.$selected, $isHovered = props.$isHovered, $range = props.$range, $outsideMonthWithinRange = props.$outsideMonthWithinRange, $startOfMonth = props.$startOfMonth, $endOfMonth = props.$endOfMonth, $hasDateLabel = props.$hasDateLabel, $month = props.$month;
+        var $isHighlighted = props.$isHighlighted, $hasRangeHighlighted = props.$hasRangeHighlighted, $date = props.$date, $selected = props.$selected, $isHovered = props.$isHovered, $range = props.$range, $outsideMonthWithinRange = props.$outsideMonthWithinRange, $startOfMonth = props.$startOfMonth, $endOfMonth = props.$endOfMonth, $month = props.$month;
         var code = getDayStateCode(props);
         var $outsideMonth = new Date($date).getMonth() !== $month;
+        var $isCompact = theme.density === 'COMPACT';
         var backgroundColor = 'transparent';
         if ($selected) {
             backgroundColor = theme.spr.ui04;
@@ -118,12 +119,14 @@ export var getDayStyles = function (todaySOD) { return [
         else if ($isHovered || $isHighlighted || props.$pseudoHighlighted) {
             backgroundColor = theme.spr.ui05;
         }
-        return __assign(__assign({ height: $hasDateLabel ? px2rem('60px') : px2rem('36px'), paddingLeft: px2rem('6px'), paddingRight: px2rem('6px'), ':after': __assign(__assign({ borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($isHighlighted &&
+        return __assign(__assign({ 
+            // Todo:- Need to remove this ternary expression and this $hasDatelable prop
+            height: $isCompact ? px2rem('30px') : px2rem('36px'), width: $isCompact ? px2rem('30px') : px2rem('36px'), paddingLeft: px2rem('6px'), paddingRight: px2rem('6px'), ':after': __assign(__assign({ left: 'unset', height: '100%', width: '100%', borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($isHighlighted &&
                 !$selected &&
                 !$isHovered &&
                 !$hasRangeHighlighted && {
                 backgroundColor: 'transparent',
-            })), { backgroundColor: backgroundColor, height: '100%', top: 0 }), ':before': __assign(__assign(__assign(__assign(__assign({ borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($outsideMonthWithinRange ? { content: '' } : {})), ($startOfMonth
+            })), { backgroundColor: backgroundColor, top: 0 }), ':before': __assign(__assign(__assign(__assign(__assign({ top: '0px', height: '100%', borderTopWidth: '0px', borderBottomWidth: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' }, ($outsideMonthWithinRange ? { content: '' } : {})), ($startOfMonth
                 ? {
                     borderTopLeftRadius: '100%',
                     borderBottomLeftRadius: '100%',

package/esm/date-picker/types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { CalendarProps as BaseCalendarProps, DatepickerProps as BaseDatepickerProps, SharedStylePropsT } from 'baseui/datepicker';
+import { CalendarProps as BaseCalendarProps, DatepickerProps as BaseDatepickerProps, SharedStylePropsT } from '../baseui/datepicker';
 import { TimePickerProps } from '../time-picker';
 import { InputSize, InputVariant } from '../input';
 import { Override } from '../overrides/types';
@@ -19,6 +19,7 @@ export declare type DateTimeSelectSharedProps = {
 export declare type DatepickerOverrides<T = SharedStyleProps> = {
     CalendarContainer?: Override<T>;
     CalendarHeader?: Override<T>;
+    TimezonePicker?: Override<T>;
     Calendar?: Override<CalendarProps & Record<string, any>>;
     Day?: Override<T>;
     Input?: Override<T>;

package/esm/date-picker/utils.d.ts

@@ -1,4 +1,4 @@
-import DateHelpers from 'baseui/datepicker/utils/date-helpers';
+import DateHelpers from '../baseui/datepicker/utils/date-helpers';
 import { Locale } from '../locale';
 interface FormatDateParams {
     date: Date | Date[] | undefined;
@@ -12,7 +12,7 @@ export declare const normalizeDashes: (formatString: string) => string;
 export declare const formatDate: ({ showTimezone, ...params }: FormatDateParams) => string;
 export declare const getAriaLabel: (value: Date | Date[] | undefined, formatDisplayValue: (date?: Date | Date[] | undefined) => string, locale: Locale) => string;
 export declare const prepareLocale: (locale?: globalThis.Locale, options?: {
-    weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+    weekStartsOn?: 0 | 2 | 1 | 3 | 4 | 5 | 6 | undefined;
 } | undefined) => any;
 export declare const isTimeInRange: (date: Date | Array<Date | undefined | null> | null | undefined, { minDate, maxDate, dateHelpers, }: {
     minDate?: Date | null | undefined;

package/esm/date-picker/utils.js

@@ -1,8 +1,8 @@
 import { __assign, __rest } from "tslib";
 import en from 'date-fns/locale/en-US';
-import getInterpolatedString from 'baseui/helpers/i18n-interpolation';
-import DateHelpers from 'baseui/datepicker/utils/date-helpers';
-import dateFnsAdapter from 'baseui/datepicker/utils/date-fns-adapter';
+import getInterpolatedString from '../baseui/helpers/i18n-interpolation';
+import DateHelpers from '../baseui/datepicker/utils/date-helpers';
+import dateFnsAdapter from '../baseui/datepicker/utils/date-fns-adapter';
 import { DEFAULT_FORMAT_STRING } from './constants';
 // replacing both hyphens and em-dashes with en-dashes
 export var normalizeDashes = function (formatString) { return formatString.replace(/-/g, '–').replace(/—/g, '–'); };

package/esm/form-control/form-control.js

@@ -2,7 +2,6 @@ import { __assign, __read } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, forwardRef } from 'react';
 import * as React from 'react';
-import { useUID } from 'react-uid';
 import { add$props } from '../helpers';
 import { Stack, StackItem } from '../stack';
 import InfoIcon from '../icon/components/info';
@@ -11,6 +10,7 @@ import { useOverrides } from '../overrides';
 import { StatefulTooltip } from '../tooltip';
 import { FormControlProvider } from './context';
 import { StyledCaption, StyledControlContainer, StyledInfoIconContainer, StyledLabel, StyledLabelContainer, StyledRequiredDot, StyledRoot, StyledSubText, } from './styled-component';
+import useUniqueId from '../hooks/useUniqueId';
 function chooseRenderedHint(caption, error, positive, sharedProps) {
     if (error && typeof error !== 'boolean') {
         return typeof error === 'function' ? error(sharedProps) : error;
@@ -26,10 +26,10 @@ function chooseRenderedHint(caption, error, positive, sharedProps) {
 var FormControl = forwardRef(function (_a, ref) {
     var overrides = _a.overrides, label = _a.label, caption = _a.caption, disabled = _a.disabled, error = _a.error, positive = _a.positive, htmlFor = _a.htmlFor, children = _a.children, intent = _a.intent, required = _a.required, layout = _a.layout, $as = _a.$as, className = _a.className, subText = _a.subText, subTextAsIcon = _a.subTextAsIcon;
     var onlyChildProps = React.Children.only(children).props;
-    var a11yCaptionId = useUID();
-    var a11LabelId = useUID();
-    var a11SubTextId = useUID();
-    var fieldUniqueId = useUID();
+    var a11yCaptionId = useUniqueId();
+    var a11LabelId = useUniqueId();
+    var a11SubTextId = useUniqueId();
+    var fieldUniqueId = useUniqueId();
     // First try to infer id from props or children. Create new id if needed.
     var a11yFieldId = htmlFor || onlyChildProps.id || fieldUniqueId;
     var sharedProps = __assign(__assign({}, add$props({ required: required, layout: layout, intent: intent, disabled: disabled })), { $error: !!error, $positive: !!positive, $hasSubText: !!subText, $subTextAsIcon: subTextAsIcon });
@@ -38,7 +38,8 @@ var FormControl = forwardRef(function (_a, ref) {
     var _b = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.LabelContainer, StyledLabelContainer), 2), LabelContainer = _b[0], labelContainerProps = _b[1], _c = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.Label, StyledLabel), 2), Label = _c[0], labelProps = _c[1], _d = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.RequiredDot, StyledRequiredDot), 2), RequiredDot = _d[0], requiredDotProps = _d[1], _e = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.Root, StyledRoot), 2), Root = _e[0], rootProps = _e[1], _f = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.SubText, StyledSubText), 2), SubText = _f[0], subTextProps = _f[1], _g = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.InfoIconContainer, StyledInfoIconContainer), 2), InfoIconContainer = _g[0], infoIconContainerProps = _g[1], _h = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.ControlContainer, StyledControlContainer), 2), ControlContainer = _h[0], controlContainerProps = _h[1], _j = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.Caption, StyledCaption), 2), Caption = _j[0], captionProps = _j[1], _k = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.SubTextTooltip, StatefulTooltip), 2), SubTextTooltip = _k[0], subTextTooltipProps = _k[1];
     var formControlProviderValue = useMemo(function () { return ({ intent: intent }); }, [intent]);
     var shouldRenderSubTextInTooltip = layout === 'horizontal' || subTextAsIcon;
-    return (_jsx(FormControlProvider, __assign({ value: formControlProviderValue }, { children: _jsxs(Root, __assign({ ref: ref, "data-testid": "form-control", "data-spaceweb": "form-control", className: className, "$as": $as }, sharedProps, rootProps, { children: [label && (_jsxs(LabelContainer, __assign({ "data-testid": "form-control-label-container" }, sharedProps, labelContainerProps, { children: [_jsx(Label, __assign({ id: a11LabelId, "data-spaceweb": "form-control-label", htmlFor: a11yFieldId }, sharedProps, labelProps, { children: typeof label === 'function' ? label(sharedProps) : label }), void 0), required && _jsx(RequiredDot, __assign({ "data-testid": "form-required" }, requiredDotProps), void 0), subText && shouldRenderSubTextInTooltip ? (_jsx(SubTextTooltip, __assign({ content: subText, size: "md" }, subTextTooltipProps, { children: _jsx(InfoIconContainer, __assign({}, infoIconContainerProps, { children: _jsx(InfoIcon, { className: "h-2 w-2" }, void 0) }), void 0) }), void 0)) : null] }), void 0)), subText && !shouldRenderSubTextInTooltip ? (_jsx(SubText, __assign({ id: a11SubTextId }, subTextProps, { children: typeof subText === 'function' ? subText(sharedProps) : subText }), void 0)) : null, _jsxs(ControlContainer, __assign({ "data-spaceweb": "form-control-container" }, sharedProps, controlContainerProps, { children: [React.Children.map(children, function (child, index) {
+    var subTextToRender = typeof subText === 'function' ? subText(sharedProps) : subText;
+    return (_jsx(FormControlProvider, __assign({ value: formControlProviderValue }, { children: _jsxs(Root, __assign({ ref: ref, "data-testid": "form-control", "data-spaceweb": "form-control", className: className, "$as": $as }, sharedProps, rootProps, { children: [label && (_jsxs(LabelContainer, __assign({ "data-testid": "form-control-label-container" }, sharedProps, labelContainerProps, { children: [_jsx(Label, __assign({ id: a11LabelId, "data-spaceweb": "form-control-label", htmlFor: a11yFieldId }, sharedProps, labelProps, { children: typeof label === 'function' ? label(sharedProps) : label }), void 0), required && _jsx(RequiredDot, __assign({ "data-testid": "form-required" }, requiredDotProps), void 0), subText && shouldRenderSubTextInTooltip ? (_jsx(SubTextTooltip, __assign({ content: subTextToRender, size: "md" }, subTextTooltipProps, { children: _jsx(InfoIconContainer, __assign({}, infoIconContainerProps, { children: _jsx(InfoIcon, { className: "h-2 w-2" }, void 0) }), void 0) }), void 0)) : null] }), void 0)), subText && !shouldRenderSubTextInTooltip ? (_jsx(SubText, __assign({ id: a11SubTextId }, subTextProps, { children: subTextToRender }), void 0)) : null, _jsxs(ControlContainer, __assign({ "data-spaceweb": "form-control-container" }, sharedProps, controlContainerProps, { children: [React.Children.map(children, function (child, index) {
                             if (!child)
                                 return null;
                             var key = child.key || String(index);

package/esm/form-control/types.d.ts

@@ -16,16 +16,16 @@ export declare type FormControlOverrides = {
 export declare type FormControlProps = {
     children: React.ReactElement;
     disabled?: boolean;
-    label?: React.ReactNode;
+    label?: React.ReactNode | ((sharedProps: SharedProps) => React.ReactNode);
     /**
      * Help text to render b/w Label and the form field.
      */
-    subText?: React.ReactNode;
+    subText?: React.ReactNode | ((sharedProps: SharedProps) => React.ReactNode);
     /**
      * If true, render info icon and display subText in Tooltip
      */
     subTextAsIcon?: boolean;
-    caption?: React.ReactNode;
+    caption?: React.ReactNode | ((sharedProps: SharedProps) => React.ReactNode);
     error?: boolean | React.ReactNode;
     positive?: React.ReactNode;
     htmlFor?: string;
@@ -43,4 +43,6 @@ export declare type SharedProps = {
     $required: boolean;
     $layout: layout;
     $intent: Intent;
+    $hasSubText: boolean;
+    $subTextAsIcon?: boolean;
 };

package/esm/grid/Col.js

@@ -1,4 +1,4 @@
-import { __assign, __read, __spreadArray } from "tslib";
+import { __assign } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * @author Ivan Torres
@@ -7,24 +7,34 @@ import { useMemo } from 'react';
 import { Box } from '../box';
 import useStyle from '../style/useStyle';
 import { filterOwnProps } from './utils';
-var getClassList = function (column, breakpoint) {
-    if (column === void 0) { column = {}; }
+var getGridRange = function (column, breakpointMinWidth) {
+    var _a;
     var colSpan = column.colSpan, colStart = column.colStart, colEnd = column.colEnd, rowSpan = column.rowSpan, rowStart = column.rowStart, rowEnd = column.rowEnd;
-    var classList = [];
-    var prefix = breakpoint ? "".concat(breakpoint, ":") : '';
-    if (colEnd)
-        classList.push("".concat(prefix, "col-end-").concat(colEnd));
-    if (colSpan)
-        classList.push("".concat(prefix, "col-span-").concat(colSpan));
-    if (colStart)
-        classList.push("".concat(prefix, "col-start-").concat(colStart));
-    if (rowEnd)
-        classList.push("".concat(prefix, "row-end-").concat(rowEnd));
-    if (rowSpan)
-        classList.push("".concat(prefix, "row-span-").concat(rowSpan));
-    if (rowStart)
-        classList.push("".concat(prefix, "row-start-").concat(rowStart));
-    return classList;
+    var gridRangeStyle = {};
+    if (typeof colSpan === 'number') {
+        gridRangeStyle.gridColumnStart = "span ".concat(colSpan);
+        gridRangeStyle.gridColumnEnd = "span ".concat(colSpan);
+    }
+    if (typeof rowSpan === 'number') {
+        gridRangeStyle.gridRowStart = "span ".concat(rowSpan);
+        gridRangeStyle.gridRowEnd = "span ".concat(rowSpan);
+    }
+    if (typeof colStart === 'number') {
+        gridRangeStyle.gridColumnStart = colStart;
+    }
+    if (typeof colEnd === 'number') {
+        gridRangeStyle.gridColumnEnd = colEnd;
+    }
+    if (typeof rowStart === 'number') {
+        gridRangeStyle.gridRowStart = rowStart;
+    }
+    if (typeof rowEnd === 'number') {
+        gridRangeStyle.gridRowEnd = rowEnd;
+    }
+    return breakpointMinWidth
+        ? (_a = {},
+            _a["@media screen and (min-width: ".concat(breakpointMinWidth, ")")] = gridRangeStyle,
+            _a) : gridRangeStyle;
 };
 export var Col = function (props) {
     var theme = useStyle().theme;
@@ -32,10 +42,10 @@ export var Col = function (props) {
     var className = props.className, style = props.style, children = props.children;
     var classList = [];
     var breakpoints = useMemo(function () { return Object.keys(screens); }, [screens]);
-    classList = classList.concat.apply(classList, __spreadArray([], __read(getClassList(props)), false));
+    classList.push(getGridRange(props));
     breakpoints.forEach(function (breakpoint) {
         if (props[breakpoint]) {
-            classList = classList.concat.apply(classList, __spreadArray([], __read(getClassList(props[breakpoint], breakpoint)), false));
+            classList.push(getGridRange(props[breakpoint], screens[breakpoint]));
         }
     });
     return (_jsx(Box, __assign({ "data-testid": "col" }, filterOwnProps(breakpoints, props), { className: [classList, className, style] }, { children: children }), void 0));

package/esm/helpers/commonStyles.d.ts

@@ -15,3 +15,4 @@ export declare type OutlineProps = {
 };
 export declare const getOutlineStyles: ({ theme }: StyleUtils, props?: OutlineProps | undefined) => StyleObject;
 export declare const getFocusVisibleStyles: (utils: StyleUtils, props?: OutlineProps | undefined) => StyleObject;
+export declare const accessibilityStyles: StyleObject;

package/esm/helpers/commonStyles.js

@@ -43,3 +43,16 @@ export var getFocusVisibleStyles = function (utils, props) {
         ':focus-visible': getOutlineStyles(utils, props),
     });
 };
+export var accessibilityStyles = {
+    position: 'fixed',
+    width: '0px',
+    height: '0px',
+    borderLeftWidth: 0,
+    borderRightWidth: 0,
+    borderTopWidth: 0,
+    borderBottomWidth: 0,
+    padding: 0,
+    overflow: 'hidden',
+    clip: 'rect(0, 0, 0, 0)',
+    clipPath: 'inset(100%)',
+};

package/esm/helpers/styletron.d.ts

@@ -1,23 +0,0 @@
-/// <reference types="react" />
-/**
- * @deprecated use spaceweb/styled
- */
-export declare const styled: {
-    <C extends keyof JSX.IntrinsicElements | import("react").ComponentType<any>, P extends {}, Theme = ThemeT>(component: C, style: import("styletron-standard").StyleObject | ((props: Omit<P, "$theme"> & {
-        $theme: Theme;
-    }) => import("styletron-standard").StyleObject)): import("styletron-react").StyletronComponent<C, P>;
-    <C_1 extends keyof JSX.IntrinsicElements | import("react").ComponentType<any>>(component: C_1, style: import("styletron-standard").StyleObject): import("styletron-react").StyletronComponent<C_1, {}>;
-};
-/**
- * @deprecated
- */
-export declare const withStyle: {
-    <C extends import("styletron-react").StyletronComponent<any, any>, P extends {}, Theme = ThemeT>(component: C, style: import("styletron-standard").StyleObject | ((props: Omit<P, "$theme"> & {
-        $theme: Theme;
-    } & (C extends import("styletron-react").StyletronComponent<infer CC, infer PP> ? PP : never)) => import("styletron-standard").StyleObject)): C extends import("styletron-react").StyletronComponent<infer CC_1, infer PP_1> ? import("styletron-react").StyletronComponent<CC_1, P & PP_1> : never;
-    <C_1 extends import("styletron-react").StyletronComponent<any, any>>(component: C_1, style: import("styletron-standard").StyleObject): C_1;
-};
-/**
- * @deprecated use spaceweb/useStyle
- */
-export declare const useStyletron: () => [(a: import("styletron-standard").StyleObject) => string, ThemeT];

package/esm/helpers/styletron.js

@@ -1,13 +0,0 @@
-import { createThemedStyled, createThemedUseStyletron, createThemedWithStyle } from 'baseui';
-/**
- * @deprecated use spaceweb/styled
- */
-export var styled = createThemedStyled(); // remove once spaceweb/styled provides props to style callback
-/**
- * @deprecated
- */
-export var withStyle = createThemedWithStyle();
-/**
- * @deprecated use spaceweb/useStyle
- */
-export var useStyletron = createThemedUseStyletron();

package/esm/hooks/useFocusVisible.js

@@ -1,6 +1,6 @@
 import { __read } from "tslib";
 import { useState, useCallback } from 'react';
-import { isFocusVisible } from 'baseui/utils/focusVisible';
+import { isFocusVisible } from '../baseui/utils/focusVisible';
 import useCombinedHandler from './useCombinedHandler';
 export var useFocusVisible = function (props) {
     var _a = __read(useState(false), 2), $isFocusVisible = _a[0], setIsFocusVisible = _a[1];

package/esm/hooks/useHasMounted.d.ts

@@ -0,0 +1,2 @@
+declare const useHasMounted: () => boolean;
+export { useHasMounted };

package/esm/hooks/useHasMounted.js

@@ -0,0 +1,11 @@
+import { __read } from "tslib";
+import { useEffect } from 'react';
+import { useTransitionState } from './useTransitionState';
+var useHasMounted = function () {
+    var _a = __read(useTransitionState(false), 2), hasMounted = _a[0], setHasMounted = _a[1];
+    useEffect(function () {
+        setHasMounted(true);
+    }, [setHasMounted]);
+    return hasMounted;
+};
+export { useHasMounted };

package/esm/hooks/usePreferredReducedMotion.d.ts

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

package/esm/hooks/usePreferredReducedMotion.js

@@ -0,0 +1,9 @@
+import { useMemo } from 'react';
+var usePreferredReducedMotion = function () {
+    return useMemo(function () {
+        return typeof window !== 'undefined' &&
+            'matchMedia' in window &&
+            window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+    }, []);
+};
+export default usePreferredReducedMotion;

package/esm/hooks/useTransitionState.d.ts

@@ -0,0 +1,4 @@
+import { useState } from 'react';
+declare type UseTransitionState = typeof useState;
+export declare const useTransitionState: UseTransitionState;
+export {};

package/esm/hooks/useTransitionState.js

@@ -0,0 +1,21 @@
+import { __read, __spreadArray } from "tslib";
+import { useCallback, useState, startTransition } from 'react';
+// eslint-disable-next-line arrow-parens
+export var useTransitionState = function () {
+    var params = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        params[_i] = arguments[_i];
+    }
+    var _a = __read(useState.apply(void 0, __spreadArray([], __read(params), false)), 2), state = _a[0], setState = _a[1];
+    var setTransitionSet = useCallback(function (val) {
+        if (startTransition) {
+            startTransition(function () {
+                setState(val);
+            });
+        }
+        else {
+            setState(val);
+        }
+    }, []);
+    return [state, setTransitionSet];
+};

package/esm/hooks/useUniqueId.d.ts

@@ -1,3 +1,6 @@
+import * as React from 'react';
 declare const useUniqueId: () => string;
-export declare const getUniqueId: () => string;
+export declare const UniqueIdConsumer: ({ children }: {
+    children: (id: string) => React.ReactElement;
+}) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
 export default useUniqueId;

package/esm/hooks/useUniqueId.js

@@ -1,6 +1,8 @@
-import _uniqueId from 'lodash/uniqueId';
-import { useMemo } from 'react';
-var PREFIX = 'sw-id--';
-var useUniqueId = function () { return useMemo(function () { return _uniqueId(PREFIX); }, []); };
-export var getUniqueId = function () { return _uniqueId(PREFIX); };
+import { useUID as useReactUID } from 'react-uid';
+import * as React from 'react';
+var useUniqueId = React.useId ? function () { return React.useId(); } : function () { return useReactUID(); };
+export var UniqueIdConsumer = function (_a) {
+    var children = _a.children;
+    return children(useUniqueId());
+};
 export default useUniqueId;

package/esm/icon/components/noPreview.d.ts

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

package/esm/icon/components/noPreview.js

@@ -0,0 +1,8 @@
+import { __assign } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useStyle } from '../../style';
+import Icon from '../icon';
+export default function NoPreview(props) {
+    var _a = useStyle(), theme = _a.theme, isRTL = _a.isRTL;
+    return (_jsx(Icon, __assign({ viewBox: "0 0 14 14", "data-icon-name": "NoPreview" }, props, { children: _jsx("path", { d: "M7 3.67a3.143 3.143 0 013.03 4.11l1.946 1.947A7.51 7.51 0 0014 6.845 7.533 7.533 0 004.684 2.44l1.38 1.381A3.271 3.271 0 017 3.669zM1.088 1.543a.634.634 0 000 .897l1.254 1.254A7.568 7.568 0 000 6.85a7.509 7.509 0 009.743 4.251l1.73 1.73a.634.634 0 00.898-.896L1.99 1.544a.641.641 0 00-.903 0zM7 10.033A3.183 3.183 0 013.818 6.85a3.125 3.125 0 01.312-1.36l1 1a2.185 2.185 0 00-.04.362A1.907 1.907 0 007 8.761a1.715 1.715 0 00.363-.045l.999.999A3.063 3.063 0 017 10.033zM8.89 6.64a1.89 1.89 0 00-1.68-1.68z" }, void 0) }), void 0));
+}

package/esm/icon/components/overview.d.ts

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

package/esm/icon/components/overview.js

@@ -0,0 +1,8 @@
+import { __assign } from "tslib";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useStyle } from '../../style';
+import Icon from '../icon';
+export default function Overview(props) {
+    var _a = useStyle(), theme = _a.theme, isRTL = _a.isRTL;
+    return (_jsxs(Icon, __assign({ viewBox: "0 0 14 14", "data-icon-name": "Overview" }, props, { children: [_jsx("path", { d: "M7 4.955a1.91 1.91 0 101.91 1.91A1.907 1.907 0 007 4.954z" }, void 0), _jsx("path", { d: "M7 2.092a7.526 7.526 0 00-7 4.772 7.52 7.52 0 0014 0 7.526 7.526 0 00-7-4.772zm0 7.954a3.182 3.182 0 113.182-3.182A3.183 3.183 0 017 10.046z" }, void 0)] }), void 0));
+}

package/esm/icon/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const SVG_ICON_INTENTS: {
+    DEFAULT: string;
+    AI: string;
+};

package/esm/icon/constants.js

@@ -0,0 +1,4 @@
+export var SVG_ICON_INTENTS = {
+    DEFAULT: 'default',
+    AI: 'ai',
+};

package/esm/icon/icon.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { IconProps } from './types';
-declare const Icon: import("react").ForwardRefExoticComponent<Pick<IconProps, string> & import("react").RefAttributes<HTMLElement>>;
+declare const Icon: import("react").ForwardRefExoticComponent<Omit<IconProps, "ref"> & import("react").RefAttributes<HTMLElement>>;
 export default Icon;

package/esm/icon/icon.js

@@ -2,12 +2,13 @@ import { __assign, __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { StyledSvg } from './styled-components';
+import { SVG_ICON_INTENTS } from './constants';
 var Icon = forwardRef(function (props, ref) {
-    var children = props.children, title = props.title, size = props.size, restProps = __rest(props, ["children", "title", "size"]);
+    var children = props.children, intent = props.intent, title = props.title, size = props.size, className = props.className, restProps = __rest(props, ["children", "intent", "title", "size", "className"]);
     var sharedProps = {
         $size: size,
     };
-    return (_jsxs(StyledSvg, __assign({ "data-spaceweb": "icon", ref: ref }, sharedProps, restProps, { children: [title ? _jsx("title", { children: title }, void 0) : null, children] }), void 0));
+    return (_jsxs(StyledSvg, __assign({ className: [intent === SVG_ICON_INTENTS.AI ? { fill: 'url(#aiGradientID)' } : '', className], "data-spaceweb": "icon", ref: ref }, sharedProps, restProps, { children: [title ? _jsx("title", { children: title }, void 0) : null, children] }), void 0));
 });
 Icon.defaultProps = {
     size: 12,

package/esm/icon/types.d.ts

@@ -1,10 +1,13 @@
 import * as React from 'react';
 import { SpacewebComponentProps } from '../types';
+import { SVG_ICON_INTENTS } from './constants';
 export declare type Size = number;
+export declare type IntentType = (typeof SVG_ICON_INTENTS)[keyof typeof SVG_ICON_INTENTS];
 export declare type IconProps = SpacewebComponentProps<React.SVGAttributes<SVGSVGElement>> & {
     /** Size of element, will be passed to the svg width/height style. Can also be a value included in */
     size?: Size;
     /** Allows you to set the SVG `<title>` label, which is used for accessibility */
     title?: string;
+    intent?: IntentType;
     ref?: React.Ref<HTMLElement>;
 } & Record<string, any>;

package/esm/input/InputContainer.d.ts

@@ -0,0 +1,12 @@
+import { ReactElement, ReactNode } from 'react';
+import { ClassName } from '../types';
+import { FocusPosition, SharedProps } from './types';
+import { Override } from '../overrides';
+export declare const InputContainer: ({ autoFocus, children, overrides, className, }: {
+    autoFocus?: FocusPosition | undefined;
+    children: ReactNode;
+    overrides?: {
+        Root: Override<SharedProps>;
+    } | undefined;
+    className?: ClassName;
+} & Partial<SharedProps>) => ReactElement;

package/esm/input/InputContainer.js

@@ -0,0 +1,18 @@
+import { __assign, __read } from "tslib";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useState } from 'react';
+import { Box } from '../box';
+import { useOverrides } from '../overrides';
+import { getInputContainerStyles } from './styled-components';
+export var InputContainer = function (_a) {
+    var autoFocus = _a.autoFocus, children = _a.children, overrides = _a.overrides, className = _a.className;
+    var _b = __read(useState(autoFocus !== null && autoFocus !== void 0 ? autoFocus : false), 2), isFocused = _b[0], setIsFocused = _b[1];
+    var _c = __read(useOverrides(overrides === null || overrides === void 0 ? void 0 : overrides.Root, Box), 2), Root = _c[0], rootProps = _c[1];
+    var handleFocus = useCallback(function () {
+        setIsFocused(true);
+    }, []);
+    var handleBlur = useCallback(function () {
+        setIsFocused(false);
+    }, []);
+    return (_jsx(Root, __assign({ className: [getInputContainerStyles, className], onFocus: handleFocus, onBlur: handleBlur, "$isFocused": isFocused }, rootProps, { children: children }), void 0));
+};

package/esm/input/basewebAdapters.d.ts

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