@teamturing/react-kit 1.2.6 → 1.3.0

package/dist/index.js

@@ -3,7 +3,10 @@
 var React = require('react');
 var styled = require('styled-components');
 
-function _interopNamespaceDefault(e) {
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
   var n = Object.create(null);
   if (e) {
     Object.keys(e).forEach(function (k) {
@@ -20,7 +23,8 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+var styled__default = /*#__PURE__*/_interopDefault(styled);
 
 const gray = {
   gray50: '#F9FAFB',
@@ -566,6 +570,8 @@ const typography$1 = {
   }
 };
 
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 }
@@ -1631,7 +1637,7 @@ const spin = styled.keyframes`
     transform: rotate(360deg);
   }
 `;
-const Spinner = styled(SvgProgressGradient)`
+const Spinner = styled__default.default(SvgProgressGradient)`
   animation: ${spin} 1000ms infinite steps(8, end);
 `;
 Spinner.defaultProps = {
@@ -1662,12 +1668,12 @@ const wordBreak = system({
   }
 });
 
-const View = styled.div`
+const View = styled__default.default.div`
   ${compose(layout, color, flexbox, background, border, position, shadow)}
   ${sx}
 `;
 
-const UnstyledButton = styled.button`
+const UnstyledButton = styled__default.default.button`
   background: none;
   border: 0;
   padding: 0;
@@ -1694,7 +1700,7 @@ var hasRequiredReactJsxRuntime_production_min;
 function requireReactJsxRuntime_production_min() {
   if (hasRequiredReactJsxRuntime_production_min) return reactJsxRuntime_production_min;
   hasRequiredReactJsxRuntime_production_min = 1;
-  var f = React,
+  var f = React__namespace.default,
     k = Symbol.for("react.element"),
     l = Symbol.for("react.fragment"),
     m = Object.prototype.hasOwnProperty,
@@ -1748,7 +1754,7 @@ function requireReactJsxRuntime_development() {
   if (process.env.NODE_ENV !== "production") {
     (function () {
 
-      var React$1 = React;
+      var React = React__namespace.default;
 
       // ATTENTION
       // When adding new symbols to this file,
@@ -1779,7 +1785,7 @@ function requireReactJsxRuntime_development() {
         }
         return null;
       }
-      var ReactSharedInternals = React$1.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+      var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
       function error(format) {
         {
           {
@@ -2925,7 +2931,7 @@ const Button = /*#__PURE__*/React.forwardRef(({
     }) : null]
   });
 });
-const BaseButton = styled(UnstyledButton)(({
+const BaseButton = styled__default.default(UnstyledButton)(({
   $loading,
   $disabled,
   fillWidth
@@ -3173,7 +3179,7 @@ const BaseButton = styled(UnstyledButton)(({
     }
   }
 }));
-const BaseSpinner = styled(Spinner)(variant({
+const BaseSpinner = styled__default.default(Spinner)(variant({
   prop: 'size',
   variants: {
     l: {
@@ -3228,7 +3234,7 @@ const Chip = ({
   trailingIcon: TrailingIcon,
   children: [LeadingIcon ? /*#__PURE__*/jsxRuntimeExports.jsx(LeadingIcon, {}) : null, children, TrailingIcon ? /*#__PURE__*/jsxRuntimeExports.jsx(TrailingIcon, {}) : null]
 });
-const BaseChip = styled.span({
+const BaseChip = styled__default.default.span({
   position: 'relative',
   width: 'fit-content',
   borderRadius: radii.full,
@@ -3384,7 +3390,7 @@ const BaseChip = styled.span({
   }
 }), sx);
 
-const Text = styled.span({
+const Text = styled__default.default.span({
   'display': 'block',
   'whiteSpace': 'pre-wrap',
   '& > span': {
@@ -3424,7 +3430,7 @@ Text.defaultProps = {
   color: 'text/neutral'
 };
 
-const GradientText = styled(Text)`
+const GradientText = styled__default.default(Text)`
   background: ${({
   theme
 }) => `linear-gradient(${theme.gradients['text/accent']})`};
@@ -3463,7 +3469,7 @@ const Grid = /*#__PURE__*/React.forwardRef(({
     children: children
   });
 });
-const BaseGrid = styled(View)({
+const BaseGrid = styled__default.default(View)({
   display: 'flex',
   flexDirection: 'row'
 }, variant({
@@ -3567,7 +3573,7 @@ const IconButton = /*#__PURE__*/React.forwardRef(({
     })
   });
 });
-const BaseIconButton = styled(UnstyledButton)(({
+const BaseIconButton = styled__default.default(UnstyledButton)(({
   $loading,
   $disabled
 }) => ({
@@ -3768,7 +3774,7 @@ const IconToggleButton = ({
     children: /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {})
   });
 };
-const BaseIconToggleButton = styled(UnstyledButton)(({
+const BaseIconToggleButton = styled__default.default(UnstyledButton)(({
   $disabled
 }) => ({
   'position': 'relative',
@@ -3855,7 +3861,7 @@ const ItemList = ({
   });
 };
 
-const Space = styled.div`
+const Space = styled__default.default.div`
   width: inherit;
   ${space};
   ${sx}
@@ -3875,7 +3881,7 @@ const Stack = /*#__PURE__*/React.forwardRef(({
   ...props,
   children: children
 }));
-const BaseStack = styled(View)({
+const BaseStack = styled__default.default(View)({
   display: 'flex',
   flexDirection: 'row',
   flexWrap: 'wrap'
@@ -3931,6 +3937,508 @@ const StyledIcon = ({
   children: /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {})
 });
 
+/**
+ * lodash (Custom Build) <https://lodash.com/>
+ * Build: `lodash modularize exports="npm" -o ./`
+ * Copyright jQuery Foundation and other contributors <https://jquery.org/>
+ * Released under MIT license <https://lodash.com/license>
+ * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+ * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+ */
+
+/** Used as the `TypeError` message for "Functions" methods. */
+var FUNC_ERROR_TEXT = 'Expected a function';
+
+/** Used as references for various `Number` constants. */
+var NAN = 0 / 0;
+
+/** `Object#toString` result references. */
+var symbolTag = '[object Symbol]';
+
+/** Used to match leading and trailing whitespace. */
+var reTrim = /^\s+|\s+$/g;
+
+/** Used to detect bad signed hexadecimal string values. */
+var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
+
+/** Used to detect binary string values. */
+var reIsBinary = /^0b[01]+$/i;
+
+/** Used to detect octal string values. */
+var reIsOctal = /^0o[0-7]+$/i;
+
+/** Built-in method references without a dependency on `root`. */
+var freeParseInt = parseInt;
+
+/** Detect free variable `global` from Node.js. */
+var freeGlobal = typeof commonjsGlobal == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
+
+/** Detect free variable `self`. */
+var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
+
+/** Used as a reference to the global object. */
+var root = freeGlobal || freeSelf || Function('return this')();
+
+/** Used for built-in method references. */
+var objectProto = Object.prototype;
+
+/**
+ * Used to resolve the
+ * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
+ * of values.
+ */
+var objectToString = objectProto.toString;
+
+/* Built-in method references for those with the same name as other `lodash` methods. */
+var nativeMax = Math.max,
+  nativeMin = Math.min;
+
+/**
+ * Gets the timestamp of the number of milliseconds that have elapsed since
+ * the Unix epoch (1 January 1970 00:00:00 UTC).
+ *
+ * @static
+ * @memberOf _
+ * @since 2.4.0
+ * @category Date
+ * @returns {number} Returns the timestamp.
+ * @example
+ *
+ * _.defer(function(stamp) {
+ *   console.log(_.now() - stamp);
+ * }, _.now());
+ * // => Logs the number of milliseconds it took for the deferred invocation.
+ */
+var now = function () {
+  return root.Date.now();
+};
+
+/**
+ * Creates a debounced function that delays invoking `func` until after `wait`
+ * milliseconds have elapsed since the last time the debounced function was
+ * invoked. The debounced function comes with a `cancel` method to cancel
+ * delayed `func` invocations and a `flush` method to immediately invoke them.
+ * Provide `options` to indicate whether `func` should be invoked on the
+ * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
+ * with the last arguments provided to the debounced function. Subsequent
+ * calls to the debounced function return the result of the last `func`
+ * invocation.
+ *
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
+ * invoked on the trailing edge of the timeout only if the debounced function
+ * is invoked more than once during the `wait` timeout.
+ *
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+ * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+ *
+ * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+ * for details over the differences between `_.debounce` and `_.throttle`.
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Function
+ * @param {Function} func The function to debounce.
+ * @param {number} [wait=0] The number of milliseconds to delay.
+ * @param {Object} [options={}] The options object.
+ * @param {boolean} [options.leading=false]
+ *  Specify invoking on the leading edge of the timeout.
+ * @param {number} [options.maxWait]
+ *  The maximum time `func` is allowed to be delayed before it's invoked.
+ * @param {boolean} [options.trailing=true]
+ *  Specify invoking on the trailing edge of the timeout.
+ * @returns {Function} Returns the new debounced function.
+ * @example
+ *
+ * // Avoid costly calculations while the window size is in flux.
+ * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
+ *
+ * // Invoke `sendMail` when clicked, debouncing subsequent calls.
+ * jQuery(element).on('click', _.debounce(sendMail, 300, {
+ *   'leading': true,
+ *   'trailing': false
+ * }));
+ *
+ * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
+ * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
+ * var source = new EventSource('/stream');
+ * jQuery(source).on('message', debounced);
+ *
+ * // Cancel the trailing debounced invocation.
+ * jQuery(window).on('popstate', debounced.cancel);
+ */
+function debounce(func, wait, options) {
+  var lastArgs,
+    lastThis,
+    maxWait,
+    result,
+    timerId,
+    lastCallTime,
+    lastInvokeTime = 0,
+    leading = false,
+    maxing = false,
+    trailing = true;
+  if (typeof func != 'function') {
+    throw new TypeError(FUNC_ERROR_TEXT);
+  }
+  wait = toNumber(wait) || 0;
+  if (isObject(options)) {
+    leading = !!options.leading;
+    maxing = 'maxWait' in options;
+    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
+    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  }
+  function invokeFunc(time) {
+    var args = lastArgs,
+      thisArg = lastThis;
+    lastArgs = lastThis = undefined;
+    lastInvokeTime = time;
+    result = func.apply(thisArg, args);
+    return result;
+  }
+  function leadingEdge(time) {
+    // Reset any `maxWait` timer.
+    lastInvokeTime = time;
+    // Start the timer for the trailing edge.
+    timerId = setTimeout(timerExpired, wait);
+    // Invoke the leading edge.
+    return leading ? invokeFunc(time) : result;
+  }
+  function remainingWait(time) {
+    var timeSinceLastCall = time - lastCallTime,
+      timeSinceLastInvoke = time - lastInvokeTime,
+      result = wait - timeSinceLastCall;
+    return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result;
+  }
+  function shouldInvoke(time) {
+    var timeSinceLastCall = time - lastCallTime,
+      timeSinceLastInvoke = time - lastInvokeTime;
+
+    // Either this is the first call, activity has stopped and we're at the
+    // trailing edge, the system time has gone backwards and we're treating
+    // it as the trailing edge, or we've hit the `maxWait` limit.
+    return lastCallTime === undefined || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
+  }
+  function timerExpired() {
+    var time = now();
+    if (shouldInvoke(time)) {
+      return trailingEdge(time);
+    }
+    // Restart the timer.
+    timerId = setTimeout(timerExpired, remainingWait(time));
+  }
+  function trailingEdge(time) {
+    timerId = undefined;
+
+    // Only invoke if we have `lastArgs` which means `func` has been
+    // debounced at least once.
+    if (trailing && lastArgs) {
+      return invokeFunc(time);
+    }
+    lastArgs = lastThis = undefined;
+    return result;
+  }
+  function cancel() {
+    if (timerId !== undefined) {
+      clearTimeout(timerId);
+    }
+    lastInvokeTime = 0;
+    lastArgs = lastCallTime = lastThis = timerId = undefined;
+  }
+  function flush() {
+    return timerId === undefined ? result : trailingEdge(now());
+  }
+  function debounced() {
+    var time = now(),
+      isInvoking = shouldInvoke(time);
+    lastArgs = arguments;
+    lastThis = this;
+    lastCallTime = time;
+    if (isInvoking) {
+      if (timerId === undefined) {
+        return leadingEdge(lastCallTime);
+      }
+      if (maxing) {
+        // Handle invocations in a tight loop.
+        timerId = setTimeout(timerExpired, wait);
+        return invokeFunc(lastCallTime);
+      }
+    }
+    if (timerId === undefined) {
+      timerId = setTimeout(timerExpired, wait);
+    }
+    return result;
+  }
+  debounced.cancel = cancel;
+  debounced.flush = flush;
+  return debounced;
+}
+
+/**
+ * Checks if `value` is the
+ * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
+ * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
+ *
+ * @static
+ * @memberOf _
+ * @since 0.1.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is an object, else `false`.
+ * @example
+ *
+ * _.isObject({});
+ * // => true
+ *
+ * _.isObject([1, 2, 3]);
+ * // => true
+ *
+ * _.isObject(_.noop);
+ * // => true
+ *
+ * _.isObject(null);
+ * // => false
+ */
+function isObject(value) {
+  var type = typeof value;
+  return !!value && (type == 'object' || type == 'function');
+}
+
+/**
+ * Checks if `value` is object-like. A value is object-like if it's not `null`
+ * and has a `typeof` result of "object".
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
+ * @example
+ *
+ * _.isObjectLike({});
+ * // => true
+ *
+ * _.isObjectLike([1, 2, 3]);
+ * // => true
+ *
+ * _.isObjectLike(_.noop);
+ * // => false
+ *
+ * _.isObjectLike(null);
+ * // => false
+ */
+function isObjectLike(value) {
+  return !!value && typeof value == 'object';
+}
+
+/**
+ * Checks if `value` is classified as a `Symbol` primitive or object.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to check.
+ * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
+ * @example
+ *
+ * _.isSymbol(Symbol.iterator);
+ * // => true
+ *
+ * _.isSymbol('abc');
+ * // => false
+ */
+function isSymbol(value) {
+  return typeof value == 'symbol' || isObjectLike(value) && objectToString.call(value) == symbolTag;
+}
+
+/**
+ * Converts `value` to a number.
+ *
+ * @static
+ * @memberOf _
+ * @since 4.0.0
+ * @category Lang
+ * @param {*} value The value to process.
+ * @returns {number} Returns the number.
+ * @example
+ *
+ * _.toNumber(3.2);
+ * // => 3.2
+ *
+ * _.toNumber(Number.MIN_VALUE);
+ * // => 5e-324
+ *
+ * _.toNumber(Infinity);
+ * // => Infinity
+ *
+ * _.toNumber('3.2');
+ * // => 3.2
+ */
+function toNumber(value) {
+  if (typeof value == 'number') {
+    return value;
+  }
+  if (isSymbol(value)) {
+    return NAN;
+  }
+  if (isObject(value)) {
+    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
+    value = isObject(other) ? other + '' : other;
+  }
+  if (typeof value != 'string') {
+    return value === 0 ? value : +value;
+  }
+  value = value.replace(reTrim, '');
+  var isBinary = reIsBinary.test(value);
+  return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : reIsBadHex.test(value) ? NAN : +value;
+}
+var lodash_debounce = debounce;
+var debounce$1 = /*@__PURE__*/getDefaultExportFromCjs(lodash_debounce);
+
+const useResize = resizeCallback => {
+  const handleResize = React.useCallback(() => resizeCallback?.(), []);
+  React.useEffect(() => {
+    handleResize();
+  }, []);
+  React.useEffect(() => {
+    if (window) {
+      const debouncedHandleResize = debounce$1(handleResize, 150);
+      window.addEventListener('resize', debouncedHandleResize);
+      return () => window.removeEventListener('resize', debouncedHandleResize);
+    }
+  }, []);
+};
+
+var MobileOS = /*#__PURE__*/function (MobileOS) {
+  MobileOS["Android"] = "android";
+  MobileOS["iOS"] = "ios";
+  MobileOS["Unknown"] = "unknown";
+  MobileOS["WindowsPhone"] = "Windows Phone";
+  return MobileOS;
+}(MobileOS || {});
+var DesktopOS = /*#__PURE__*/function (DesktopOS) {
+  DesktopOS["Linux"] = "linux";
+  DesktopOS["MacOS"] = "mac_os";
+  DesktopOS["Unix"] = "unix";
+  DesktopOS["Unknown"] = "unknown";
+  DesktopOS["Windows"] = "windows";
+  return DesktopOS;
+}(DesktopOS || {});
+const useDevice = () => {
+  const [deviceState, setDeviceState] = React.useState();
+  const handleResize = () => {
+    const userAgent = navigator.userAgent || navigator.vendor || window.opera || undefined;
+    const isMobileDevice = () => {
+      const regexs = [/(Android)(.+)(Mobile)/i, /BlackBerry/i, /iPhone|iPod/i, /Opera Mini/i, /IEMobile/i];
+      return regexs.some(b => userAgent.match(b));
+    };
+    const isTabletDevice = () => {
+      const regex = /(ipad|tablet|(android(?!.*mobile))|(windows(?!.*phone)(.*touch))|kindle|playbook|silk|(puffin(?!.*(IP|AP|WP))))/;
+      return regex.test(userAgent.toLowerCase());
+    };
+    const isDesktopDevice = () => !isMobileDevice() && !isTabletDevice();
+    const isDesktop = isDesktopDevice();
+    const isMobile = isMobileDevice();
+    const isTablet = isTabletDevice();
+    const getMobileOS = () => {
+      if (isMobileDevice()) {
+        if (/windows phone/i.test(userAgent)) return MobileOS.WindowsPhone;else if (/android/i.test(userAgent)) return MobileOS.Android;else if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) return MobileOS.iOS;
+        return MobileOS.Unknown;
+      } else return undefined;
+    };
+    const getDesktopOS = () => {
+      if (isDesktopDevice()) {
+        if (userAgent.indexOf('Win') !== -1) return DesktopOS.Windows;else if (userAgent.indexOf('Mac') !== -1) return DesktopOS.MacOS;else if (userAgent.indexOf('X11') !== -1) return DesktopOS.Unix;else if (userAgent.indexOf('Linux') !== -1) return DesktopOS.Linux;
+        return DesktopOS.Unknown;
+      } else return undefined;
+    };
+    const getDeviceOS = () => getMobileOS() ?? getDesktopOS();
+    const mobileOS = getMobileOS();
+    const isAndroidDevice = getDeviceOS() === MobileOS.Android;
+    const isAppleDevice = getDeviceOS() === MobileOS.iOS || getDeviceOS() === DesktopOS.MacOS;
+    const isUnknownMobileDevice = getDeviceOS() === MobileOS.Unknown;
+    const desktopOS = getDesktopOS();
+    const isWindowsDesktop = getDeviceOS() === DesktopOS.Windows;
+    const isLinuxOrUnixDesktop = getDeviceOS() === DesktopOS.Linux || getDeviceOS() === DesktopOS.Unix;
+    const supportedScreenOrientation = (screen?.orientation || {}).type ?? screen.mozOrientation ?? screen.msOrientation;
+    const safariScreenOrientation = !screen?.orientation && matchMedia('(orientation: portrait)').matches ? 'portrait-primary' : 'landscape-primary';
+    const initialScreenOrientation = supportedScreenOrientation ?? safariScreenOrientation ?? 'portrait-primary';
+    let screenOrientation = initialScreenOrientation;
+    if (screen.orientation) {
+      screen.orientation.addEventListener('change', ev => screenOrientation = (ev.target ?? {}).type);
+    }
+    const isLandscapeOrientation = () => ['landscape-primary', 'landscape-secondary'].includes(screenOrientation);
+    const isPortraitOrientation = () => ['portrait-primary', 'portrait-secondary'].includes(screenOrientation);
+    setDeviceState({
+      isDesktop,
+      desktopOS,
+      isWindowsDesktop,
+      isLinuxOrUnixDesktop,
+      isMobile,
+      mobileOS,
+      isAndroidDevice,
+      isAppleDevice,
+      isUnknownMobileDevice,
+      isTablet,
+      isLandscapeOrientation,
+      isPortraitOrientation
+    });
+  };
+  useResize(handleResize);
+  return deviceState || {};
+};
+
+/**
+ * 특정 컴포넌트을 제외한 바깥쪽을 클릭했을 때를 핸들링하기 위한 훅입니다.
+ */
+const useOutsideClick = ({
+  containerRef,
+  onOutsideClick
+}) => {
+  const handleClick = e => {
+    if (containerRef.current && !containerRef.current.contains(e.target)) {
+      onOutsideClick(e);
+    }
+  };
+  React.useEffect(() => {
+    document.addEventListener('click', handleClick);
+    return () => {
+      document.removeEventListener('click', handleClick);
+    };
+  });
+};
+
+/**
+ * 제공된 `ref`가 없는 경우 새로운 `ref`를 만들어 사용하고, 있는 경우 제공된 ref를 사용할 수 있는 훅입니다.
+ */
+const useProvidedOrCreatedRef = providedRef => {
+  const createdRef = React.useRef(null);
+  return providedRef ?? createdRef;
+};
+
+const useToggleHandler = ({
+  initialState = false
+}) => {
+  const [state, setState] = React.useState(initialState);
+  const on = () => {
+    setState(true);
+  };
+  const off = () => {
+    setState(false);
+  };
+  const toggle = React.useCallback(() => {
+    setState(prev => !prev);
+  }, []);
+  return {
+    state,
+    on,
+    off,
+    toggle
+  };
+};
+
 exports.Button = Button;
 exports.Chip = Chip;
 exports.GradientText = GradientText;
@@ -3943,4 +4451,10 @@ exports.Spinner = Spinner;
 exports.Stack = index;
 exports.StyledIcon = StyledIcon;
 exports.Text = Text;
+exports.UnstyledButton = UnstyledButton;
 exports.View = View;
+exports.useDevice = useDevice;
+exports.useOutsideClick = useOutsideClick;
+exports.useProvidedOrCreatedRef = useProvidedOrCreatedRef;
+exports.useResize = useResize;
+exports.useToggleHandler = useToggleHandler;

package/esm/_virtual/_commonjsHelpers.js

@@ -1,5 +1,7 @@
+var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 }
 
-export { getDefaultExportFromCjs };
+export { commonjsGlobal, getDefaultExportFromCjs };