rsuite 6.0.0-canary-20250507 → 6.0.0-canary-2025062016

package/cjs/ProgressCircle/hooks/useProgressCirclePath.js

@@ -0,0 +1,66 @@
+'use client';
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+var _react = require("react");
+/**
+ * Custom hook to calculate path string and styles for ProgressCircle
+ */
+const useProgressCirclePath = options => {
+  const {
+    gapDegree,
+    gapPosition,
+    totalPercent,
+    strokeColor,
+    strokeWidth,
+    trailColor
+  } = options;
+  return (0, _react.useMemo)(() => {
+    const radius = 50 - strokeWidth / 2;
+    let x1 = 0;
+    let y1 = -radius;
+    let x2 = 0;
+    let y2 = -2 * radius;
+    switch (gapPosition) {
+      case 'left':
+        x1 = -radius;
+        y1 = 0;
+        x2 = 2 * radius;
+        y2 = 0;
+        break;
+      case 'right':
+        x1 = radius;
+        y1 = 0;
+        x2 = -2 * radius;
+        y2 = 0;
+        break;
+      case 'bottom':
+        y1 = radius;
+        y2 = 2 * radius;
+        break;
+      default:
+      // 'top' is the default, values are already set
+    }
+    const pathString = `M 50,50 m ${x1},${y1} a ${radius},${radius} 0 1 1 ${x2},${-y2} a ${radius},${radius} 0 1 1 ${-x2},${y2}`;
+    const len = Math.PI * 2 * radius;
+    // Convert gapDegree from degrees to a proportion of the circumference
+    const gapLength = gapDegree / 360 * len;
+    const trailPathStyle = {
+      stroke: trailColor,
+      strokeDasharray: `${len - gapLength}px ${len}px`,
+      strokeDashoffset: `-${gapLength / 2}px`
+    };
+    const strokePathStyle = {
+      stroke: strokeColor,
+      strokeDasharray: `${totalPercent / 100 * (len - gapLength)}px ${len}px`,
+      strokeDashoffset: `-${gapLength / 2}px`
+    };
+    return {
+      pathString,
+      trailPathStyle,
+      strokePathStyle
+    };
+  }, [gapDegree, gapPosition, totalPercent, strokeColor, strokeWidth, trailColor]);
+};
+var _default = exports.default = useProgressCirclePath;

package/cjs/ProgressCircle/index.d.ts

@@ -0,0 +1,4 @@
+import ProgressCircle from './ProgressCircle';
+export type { ProgressCircleProps } from './ProgressCircle';
+export { ProgressCircle };
+export default ProgressCircle;

package/cjs/ProgressCircle/index.js

@@ -0,0 +1,11 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _ProgressCircle = _interopRequireDefault(require("./ProgressCircle"));
+exports.ProgressCircle = _ProgressCircle.default;
+// export types
+// export components
+var _default = exports.default = _ProgressCircle.default;

package/cjs/Radio/Radio.js

@@ -10,8 +10,7 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _RadioGroup = require("../RadioGroup/RadioGroup");
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
  * The `Radio` component is a simple radio button.
  * @see https://rsuitejs.com/components/radio

package/cjs/RadioGroup/RadioGroup.d.ts

@@ -14,7 +14,10 @@ export interface RadioContextProps {
     ]>;
 }
 export interface RadioGroupProps<T = string | number> extends BoxProps, FormControlBaseProps<T> {
-    /** A radio group can have different appearances */
+    /**
+     * A radio group can have different appearances
+     * @deprecated Use `<SegmentedControl indicator="underline" />` instead
+     */
     appearance?: 'default' | 'picker';
     /** Name to use for form */
     name?: string;

package/cjs/RadioGroup/RadioGroup.js

@@ -10,8 +10,7 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _Plaintext = _interopRequireDefault(require("../internals/Plaintext"));
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const RadioContext = exports.RadioContext = /*#__PURE__*/_react.default.createContext(void 0);
 
 /**

package/cjs/RadioTile/RadioTile.js

@@ -11,8 +11,7 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _RadioTileGroup = require("../RadioTileGroup/RadioTileGroup");
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
  * A series of selectable tile components that behave like Radio.
  * @version 5.35.0

package/cjs/RadioTileGroup/RadioTileGroup.js

@@ -10,8 +10,7 @@ var _Stack = _interopRequireDefault(require("../Stack"));
 var _Box = _interopRequireDefault(require("../internals/Box"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const RadioTileContext = exports.RadioTileContext = /*#__PURE__*/_react.default.createContext({});
 
 /**

package/cjs/RangeSlider/RangeSlider.js

@@ -17,8 +17,7 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
 var _utils2 = require("../Slider/utils");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const defaultDefaultValue = [0, 0];
 
 /**
@@ -307,7 +306,6 @@ const RangeSlider = (0, _utils.forwardRef)((props, ref) => {
     ref: barRef,
     onClick: handleBarClick
   }, progress && /*#__PURE__*/_react.default.createElement(_ProgressBar.default, {
-    rtl: rtl,
     vertical: vertical,
     start: (value[0] - min) / (max - min) * 100,
     end: (value[1] - min) / (max - min) * 100

package/cjs/Rate/Character.js

@@ -11,8 +11,7 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _utils = require("../internals/utils");
 var _utils2 = require("./utils");
 var _hooks = require("../internals/hooks");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const getKey = (element, target) => {
   return element && target && (0, _contains.default)(element, target) ? 'before' : 'after';
 };

package/cjs/Rate/useRatingStates.js

@@ -8,13 +8,12 @@ var _utils = require("./utils");
 /**
  * Custom hook to manage rating star states for Rate component
  */
-const useRatingStates = _ref => {
-  let {
-    value,
-    max,
-    allowHalf,
-    valueProp
-  } = _ref;
+const useRatingStates = ({
+  value,
+  max,
+  allowHalf,
+  valueProp
+}) => {
   // Create a function to generate star states based on value
   const getStarStates = (0, _react.useCallback)(v => {
     return (0, _utils.transformValueToStarStatus)(typeof v !== 'undefined' ? v : value, max, allowHalf);

package/cjs/SegmentedControl/Indicator.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface IndicatorProps {
+    style: React.CSSProperties;
+    classPrefix: string;
+}
+declare const Indicator: {
+    ({ style, classPrefix }: IndicatorProps): React.JSX.Element;
+    displayName: string;
+};
+export default Indicator;

package/cjs/SegmentedControl/Indicator.js

@@ -0,0 +1,22 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _hooks = require("../internals/hooks");
+const Indicator = ({
+  style,
+  classPrefix
+}) => {
+  const {
+    prefix
+  } = (0, _hooks.useStyles)(classPrefix);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: prefix('indicator'),
+    style: style
+  });
+};
+Indicator.displayName = 'Indicator';
+var _default = exports.default = Indicator;

package/cjs/SegmentedControl/SegmentedControl.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { BoxProps } from '../internals/Box';
+import type { FormControlBaseProps, Size } from '../internals/types';
+export interface SegmentedItemDataType {
+    /** The label of the item */
+    label: React.ReactNode;
+    /** The value of the item */
+    value: string | number;
+}
+export interface SegmentedControlProps<T = string | number | null> extends BoxProps, Omit<FormControlBaseProps<T>, 'readOnly' | 'plaintext'> {
+    /** The indicator style of the segmented control */
+    indicator?: 'pill' | 'underline';
+    /** Name to use for form */
+    name?: string;
+    /** Data of segmented items */
+    data?: SegmentedItemDataType[];
+    /** Display block style, fit the width of the container */
+    block?: boolean;
+    /** A segmented control can have different sizes */
+    size?: Size;
+}
+/**
+ * The `SegmentedControl` component is used to offer multiple exclusive options.
+ * @see https://rsuitejs.com/components/segmented-control
+ */
+declare const SegmentedControl: import("../internals/types").InternalRefForwardingComponent<"div", SegmentedControlProps<string | number | null>, never> & Record<string, never>;
+export default SegmentedControl;

package/cjs/SegmentedControl/SegmentedControl.js

@@ -0,0 +1,87 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _react = _interopRequireWildcard(require("react"));
+var _Box = _interopRequireDefault(require("../internals/Box"));
+var _SegmentedItem = _interopRequireDefault(require("./SegmentedItem"));
+var _Indicator = _interopRequireDefault(require("./Indicator"));
+var _utils = require("../internals/utils");
+var _hooks = require("../internals/hooks");
+var _useIndicatorPosition = _interopRequireDefault(require("./hooks/useIndicatorPosition"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
+ * The `SegmentedControl` component is used to offer multiple exclusive options.
+ * @see https://rsuitejs.com/components/segmented-control
+ */
+const SegmentedControl = (0, _utils.forwardRef)((props, ref) => {
+  const {
+    propsWithDefaults
+  } = (0, _hooks.useCustom)('SegmentedControl', props);
+  const {
+    as,
+    className,
+    classPrefix = 'segmented-control',
+    value: valueProp,
+    defaultValue,
+    indicator = 'pill',
+    size = 'md',
+    block = false,
+    name,
+    disabled,
+    data,
+    onChange,
+    ...rest
+  } = propsWithDefaults;
+  const {
+    merge,
+    withPrefix
+  } = (0, _hooks.useStyles)(classPrefix);
+  const classes = merge(className, withPrefix());
+  const [value, setValue] = (0, _hooks.useControlled)(valueProp, defaultValue);
+  const id = (0, _hooks.useUniqueId)('segmented', name);
+
+  // Ref for container element
+  const containerRef = (0, _react.useRef)(null);
+
+  // Get the active item index
+  const activeIndex = data === null || data === void 0 ? void 0 : data.findIndex(item => item.value === value);
+  const {
+    style: indicatorStyle
+  } = (0, _useIndicatorPosition.default)({
+    containerRef,
+    activeIndex,
+    indicator,
+    data
+  });
+  const handleChange = (0, _hooks.useEventCallback)((nextValue, event) => {
+    setValue(nextValue);
+    onChange === null || onChange === void 0 || onChange(nextValue !== null && nextValue !== void 0 ? nextValue : '', event);
+  });
+  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({
+    as: as,
+    role: "radiogroup",
+    ref: (0, _utils.mergeRefs)(ref, containerRef),
+    className: classes,
+    "data-size": size,
+    "data-block": block || undefined,
+    "data-indicator": indicator
+  }, rest), data === null || data === void 0 ? void 0 : data.map((item, index) => /*#__PURE__*/_react.default.createElement(_SegmentedItem.default, {
+    key: index,
+    item: item,
+    index: index,
+    name: id,
+    active: value === item.value,
+    disabled: disabled,
+    classPrefix: classPrefix,
+    onChange: handleChange
+  })), activeIndex !== -1 && /*#__PURE__*/_react.default.createElement(_Indicator.default, {
+    style: indicatorStyle,
+    classPrefix: classPrefix
+  }));
+});
+SegmentedControl.displayName = 'SegmentedControl';
+var _default = exports.default = SegmentedControl;

package/cjs/SegmentedControl/SegmentedItem.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { SegmentedItemDataType } from './SegmentedControl';
+export interface SegmentedItemProps {
+    item: SegmentedItemDataType;
+    index: number;
+    name?: string;
+    active: boolean;
+    disabled?: boolean;
+    classPrefix: string;
+    onChange: (value: string | number, event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+declare const SegmentedItem: {
+    ({ item, index, name, active, disabled, classPrefix, onChange }: SegmentedItemProps): React.JSX.Element;
+    displayName: string;
+};
+export default SegmentedItem;

package/cjs/SegmentedControl/SegmentedItem.js

@@ -0,0 +1,44 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _hooks = require("../internals/hooks");
+const SegmentedItem = ({
+  item,
+  index,
+  name,
+  active,
+  disabled,
+  classPrefix,
+  onChange
+}) => {
+  const {
+    prefix
+  } = (0, _hooks.useStyles)(classPrefix);
+  const handleChange = event => {
+    if (disabled) return;
+    onChange(item.value, event);
+  };
+  return /*#__PURE__*/_react.default.createElement("label", {
+    className: prefix('item'),
+    "data-value": item.value,
+    "data-index": index,
+    "data-active": active || undefined,
+    "data-disabled": disabled || undefined
+  }, /*#__PURE__*/_react.default.createElement("input", {
+    type: "radio",
+    name: name,
+    value: String(item.value),
+    checked: active,
+    disabled: disabled,
+    onChange: handleChange,
+    className: prefix('radio')
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: prefix('label')
+  }, item.label));
+};
+SegmentedItem.displayName = 'SegmentedItem';
+var _default = exports.default = SegmentedItem;

package/cjs/SegmentedControl/hooks/useIndicatorPosition.d.ts

@@ -0,0 +1,17 @@
+import { RefObject } from 'react';
+interface UseIndicatorPositionProps {
+    containerRef: RefObject<HTMLDivElement | null>;
+    activeIndex?: number;
+    indicator: 'pill' | 'underline';
+    data?: Array<{
+        value: string | number;
+    }>;
+    block?: boolean;
+}
+/**
+ * Custom hook to calculate and update the indicator position
+ */
+declare const useIndicatorPosition: ({ containerRef, activeIndex, indicator, data }: UseIndicatorPositionProps) => {
+    style: import("react").CSSProperties;
+};
+export default useIndicatorPosition;

package/cjs/SegmentedControl/hooks/useIndicatorPosition.js

@@ -0,0 +1,55 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _react = require("react");
+var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
+var _hooks = require("../../internals/hooks");
+/**
+ * Updates the indicator position based on the active item
+ */
+const updateIndicatorPosition = (container, activeIndex, indicator) => {
+  if (activeIndex === -1) return {};
+  const activeItem = container.querySelector(`[data-index="${activeIndex}"]`);
+  if (!activeItem) return {};
+  const containerStyle = window.getComputedStyle(container);
+  const paddingLeft = parseFloat(containerStyle.paddingLeft) || 0;
+  return {
+    transform: `translateX(${activeItem.offsetLeft - paddingLeft}px)`,
+    width: activeItem.offsetWidth,
+    height: indicator === 'underline' ? 2 : activeItem.offsetHeight
+  };
+};
+
+/**
+ * Custom hook to calculate and update the indicator position
+ */
+const useIndicatorPosition = ({
+  containerRef,
+  activeIndex,
+  indicator,
+  data
+}) => {
+  const [indicatorStyle, setIndicatorStyle] = (0, _react.useState)({});
+  const updatePosition = (0, _react.useCallback)(() => {
+    if (!(containerRef !== null && containerRef !== void 0 && containerRef.current)) {
+      return;
+    }
+    const newStyle = updateIndicatorPosition(containerRef.current, activeIndex, indicator);
+    setIndicatorStyle(prev => (0, _isEqual.default)(prev, newStyle) ? prev : newStyle);
+  }, [containerRef, activeIndex, indicator]);
+
+  // Update position when active item or data changes
+  (0, _react.useEffect)(() => {
+    updatePosition();
+  }, [updatePosition, data]);
+
+  // Set up resize observer
+  (0, _hooks.useElementResize)(containerRef, updatePosition);
+  return {
+    style: indicatorStyle
+  };
+};
+var _default = exports.default = useIndicatorPosition;

package/cjs/SegmentedControl/index.d.ts

@@ -0,0 +1,4 @@
+import SegmentedControl from './SegmentedControl';
+export type { SegmentedControlProps, SegmentedItemDataType } from './SegmentedControl';
+export { SegmentedControl };
+export default SegmentedControl;

package/cjs/SegmentedControl/index.js

@@ -0,0 +1,11 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _SegmentedControl = _interopRequireDefault(require("./SegmentedControl"));
+exports.SegmentedControl = _SegmentedControl.default;
+// export types
+// export components
+var _default = exports.default = _SegmentedControl.default;

package/cjs/SelectPicker/SelectPicker.js

@@ -13,8 +13,7 @@ var _SearchBox = _interopRequireDefault(require("../internals/SearchBox"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
 var _Picker = require("../internals/Picker");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const emptyArray = [];
 /**
  * The `SelectPicker` component is used to select an item from a list of data.

package/cjs/Sidebar/Sidebar.js

@@ -10,8 +10,7 @@ var _Box = _interopRequireDefault(require("../internals/Box"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
 var _Container = require("../Container/Container");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
  * The `Sidebar` component for use with the `Container` component.
  * @see https://rsuitejs.com/components/container/

package/cjs/Sidenav/ExpandedSidenavDropdown.js

@@ -14,12 +14,11 @@ var _SidenavDropdownToggle = _interopRequireDefault(require("./SidenavDropdownTo
 var _Box = _interopRequireDefault(require("../internals/Box"));
 var _hooks = require("../internals/hooks");
 var _utils = require("../internals/utils");
-var _Sidenav = require("./Sidenav");
+var _SidenavContext = require("./SidenavContext");
 var _NavMenu = require("../Nav/NavMenu");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const ExpandedSidenavDropdown = (0, _utils.forwardRef)((props, ref) => {
-  const sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
+  const sidenav = (0, _react.useContext)(_SidenavContext.SidenavContext);
   const nav = (0, _react.useContext)(_NavContext.default);
   const navMenu = (0, _react.useContext)(_NavMenu.NavMenuContext);
   if (!sidenav || !nav || !navMenu) {
@@ -78,10 +77,9 @@ const ExpandedSidenavDropdown = (0, _utils.forwardRef)((props, ref) => {
   return /*#__PURE__*/_react.default.createElement(_Disclosure.default, {
     open: open,
     onToggle: handleToggleDisclosure
-  }, (_ref, containerRef) => {
-    let {
-      open
-    } = _ref;
+  }, ({
+    open
+  }, containerRef) => {
     const classes = merge(className, withPrefix({
       [open ? 'expand' : 'collapse']: true,
       disabled
@@ -102,15 +100,12 @@ const ExpandedSidenavDropdown = (0, _utils.forwardRef)((props, ref) => {
       renderToggle: renderToggle,
       icon: icon,
       placement: placement
-    }, (0, _omit.default)(buttonProps, ['open'])), title)), /*#__PURE__*/_react.default.createElement(_Disclosure.default.Content, null, _ref2 => {
-      let {
-        open
-      } = _ref2;
-      return /*#__PURE__*/_react.default.createElement(_SidenavDropdownCollapse.default, {
-        open: open,
-        style: menuStyle
-      }, children);
-    }));
+    }, (0, _omit.default)(buttonProps, ['open'])), title)), /*#__PURE__*/_react.default.createElement(_Disclosure.default.Content, null, ({
+      open
+    }) => /*#__PURE__*/_react.default.createElement(_SidenavDropdownCollapse.default, {
+      open: open,
+      style: menuStyle
+    }, children)));
   });
 });
 ExpandedSidenavDropdown.displayName = 'Sidenav.Dropdown';

package/cjs/Sidenav/ExpandedSidenavDropdownItem.js

@@ -11,16 +11,15 @@ var _SafeAnchor = _interopRequireDefault(require("../internals/SafeAnchor"));
 var _NavContext = _interopRequireDefault(require("../Nav/NavContext"));
 var _utils = require("../internals/utils");
 var _hooks = require("../internals/hooks");
-var _Sidenav = require("./Sidenav");
+var _SidenavContext = require("./SidenavContext");
 var _useRenderMenuItem = require("../internals/Menu/useRenderMenuItem");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 /**
  * Tree View Node
  * @see https://www.w3.org/TR/wai-aria-practices-1.2/#TreeView
  */
 const ExpandedSidenavDropdownItem = (0, _utils.forwardRef)((props, ref) => {
-  const sidenav = (0, _react.useContext)(_Sidenav.SidenavContext);
+  const sidenav = (0, _react.useContext)(_SidenavContext.SidenavContext);
   const nav = (0, _react.useContext)(_NavContext.default);
   if (!sidenav || !nav) {
     throw new Error('<SidenavDropdownItem> component is not supposed to be used standalone. Use <Nav.Item> within <Sidenav> instead.');