@lobehub/ui 1.26.0 → 1.26.2

package/es/Logo/index.js

@@ -30,48 +30,58 @@ var Logo = /*#__PURE__*/memo(function (_ref) {
   var logoComponent;
   switch (type) {
     case '3d':
-      return /*#__PURE__*/_jsx(Logo3D, _objectSpread({
-        style: _objectSpread({
-          height: size,
-          width: size
-        }, style)
-      }, props));
+      {
+        return /*#__PURE__*/_jsx(Logo3D, _objectSpread({
+          style: _objectSpread({
+            height: size,
+            width: size
+          }, style)
+        }, props));
+      }
     case 'flat':
-      return /*#__PURE__*/_jsx(LogoFlat, _objectSpread({
-        style: _objectSpread({
-          height: size,
-          width: size
-        }, style)
-      }, props));
+      {
+        return /*#__PURE__*/_jsx(LogoFlat, _objectSpread({
+          style: _objectSpread({
+            height: size,
+            width: size
+          }, style)
+        }, props));
+      }
     case 'high-contrast':
-      return /*#__PURE__*/_jsx(LogoHighContrast, _objectSpread({
-        style: _objectSpread({
-          height: size,
-          width: size
-        }, style)
-      }, props));
-    case 'text':
-      return /*#__PURE__*/_jsx(LogoText, _objectSpread({
-        style: _objectSpread({
-          height: size,
-          width: 'auto'
-        }, style)
-      }, props));
-    case 'combine':
-      logoComponent = /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx(Logo3D, {
-          style: {
+      {
+        return /*#__PURE__*/_jsx(LogoHighContrast, _objectSpread({
+          style: _objectSpread({
             height: size,
             width: size
-          }
-        }), /*#__PURE__*/_jsx(LogoText, {
-          style: {
-            marginLeft: Math.round(size / 4),
+          }, style)
+        }, props));
+      }
+    case 'text':
+      {
+        return /*#__PURE__*/_jsx(LogoText, _objectSpread({
+          style: _objectSpread({
             height: size,
             width: 'auto'
-          }
-        })]
-      });
+          }, style)
+        }, props));
+      }
+    case 'combine':
+      {
+        logoComponent = /*#__PURE__*/_jsxs(_Fragment, {
+          children: [/*#__PURE__*/_jsx(Logo3D, {
+            style: {
+              height: size,
+              width: size
+            }
+          }), /*#__PURE__*/_jsx(LogoText, {
+            style: {
+              height: size,
+              marginLeft: Math.round(size / 4),
+              width: 'auto'
+            }
+          })]
+        });
+      }
   }
   var extraSize = Math.round(size / 3 * 1.9);
   return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
@@ -81,9 +91,9 @@ var Logo = /*#__PURE__*/memo(function (_ref) {
     children: [logoComponent, extra && /*#__PURE__*/_jsxs(_Fragment, {
       children: [/*#__PURE__*/_jsx(Divider, {
         style: {
+          color: theme.colorBorder,
           height: extraSize,
-          width: extraSize,
-          color: theme.colorBorder
+          width: extraSize
         }
       }), /*#__PURE__*/_jsx("div", {
         className: styles.extraTitle,

package/es/Logo/style.d.ts

@@ -1,4 +1,4 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    flexCenter: import("antd-style").SerializedStyles;
     extraTitle: import("antd-style").SerializedStyles;
+    flexCenter: import("antd-style").SerializedStyles;
 }>;

package/es/Logo/style.js

@@ -4,7 +4,7 @@ import { createStyles } from 'antd-style';
 export var useStyles = createStyles(function (_ref) {
   var css = _ref.css;
   return {
-    flexCenter: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      align-items: center;\n    "]))),
-    extraTitle: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      font-weight: 300;\n      white-space: nowrap;\n    "])))
+    extraTitle: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      font-weight: 300;\n      white-space: nowrap;\n    "]))),
+    flexCenter: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      display: flex;\n      align-items: center;\n    "])))
   };
 });

package/es/Markdown/CodeBlock.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
-declare const Code: import("react").MemoExoticComponent<(props: any) => import("react/jsx-runtime").JSX.Element | null>;
+declare const Code: import("react").NamedExoticComponent<any>;
 export default Code;

package/es/Markdown/CodeBlock.js

@@ -8,22 +8,22 @@ var useStyles = createStyles(function (_ref) {
   var css = _ref.css;
   return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    :not(:last-child) {\n      margin-block-start: 1em;\n      margin-block-end: 1em;\n      margin-inline-start: 0;\n      margin-inline-end: 0;\n    }\n  "])));
 });
-var Code = /*#__PURE__*/memo(function (props) {
+var Code = /*#__PURE__*/memo(function (properties) {
   var _useStyles = useStyles(),
     styles = _useStyles.styles,
     theme = _useStyles.theme;
-  if (!props.children[0]) return null;
-  var _props$children$0$pro = props.children[0].props,
-    children = _props$children$0$pro.children,
-    className = _props$children$0$pro.className;
-  if (!children) return null;
+  if (!properties.children[0]) return;
+  var _properties$children$ = properties.children[0].props,
+    children = _properties$children$.children,
+    className = _properties$children$.className;
+  if (!children) return;
   return /*#__PURE__*/_jsx(Highlighter, {
     className: styles,
     language: (className === null || className === void 0 ? void 0 : className.replace('language-', '')) || 'markdown',
     spotlight: true,
     theme: theme.appearance,
     type: "block",
-    children: children instanceof Array ? children[0] : children
+    children: Array.isArray(children) ? children[0] : children
   });
 });
 export default Code;

package/es/Markdown/index.js

@@ -14,11 +14,11 @@ var Markdown = /*#__PURE__*/memo(function (_ref) {
     styles = _useStyles.styles,
     cx = _useStyles.cx;
   var components = {
-    pre: CodeBlock,
+    a: Typography.Link,
     code: Code,
+    details: Collapse,
     hr: Divider,
-    a: Typography.Link,
-    details: Collapse
+    pre: CodeBlock
   };
   return /*#__PURE__*/_jsx(Typography, {
     children: /*#__PURE__*/_jsx(ReactMarkdown, {

package/es/Markdown/style.d.ts

@@ -1,4 +1,4 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    markdown: any;
     code: import("antd-style").SerializedStyles;
+    markdown: any;
 }>;

package/es/Markdown/style.js

@@ -7,7 +7,7 @@ export var useStyles = createStyles(function (_ref) {
     isDarkMode = _ref.isDarkMode,
     stylish = _ref.stylish;
   return {
-    markdown: stylish.markdown,
-    code: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      padding: 2px 4px;\n      font-family: ", " !important;\n      color: ", ";\n      border-radius: 4px;\n    "])), token.fontFamilyCode, isDarkMode ? token.cyan8 : token.pink7)
+    code: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      padding: 2px 4px;\n      font-family: ", " !important;\n      color: ", ";\n      border-radius: 4px;\n    "])), token.fontFamilyCode, isDarkMode ? token.cyan8 : token.pink7),
+    markdown: stylish.markdown
   };
 });

package/es/MessageInput/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ButtonProps } from 'antd';
-import { type TextAreaProps } from "../index";
+import { type TextAreaProps } from "../Input";
 /**
  * @title MessageInputProps
  * @category Props

package/es/MessageInput/index.js

@@ -6,7 +6,7 @@ import { Button } from 'antd';
 import { cx } from 'antd-style';
 import { memo, useState } from 'react';
 import { Flexbox } from 'react-layout-kit';
-import { TextArea } from "./..";
+import { TextArea } from "../Input";
 
 /**
  * @title MessageInputProps
@@ -26,7 +26,7 @@ var MessageInput = /*#__PURE__*/memo(function (_ref) {
     className = _ref.className;
   var _useState = useState(defaultValue || ''),
     _useState2 = _slicedToArray(_useState, 2),
-    tempSystemRole = _useState2[0],
+    temporarySystemRole = _useState2[0],
     setRole = _useState2[1];
   return /*#__PURE__*/_jsxs(Flexbox, {
     gap: 8,
@@ -40,16 +40,16 @@ var MessageInput = /*#__PURE__*/memo(function (_ref) {
         height: height !== null && height !== void 0 ? height : 200
       },
       type: type,
-      value: tempSystemRole
+      value: temporarySystemRole
     }), /*#__PURE__*/_jsx(Flexbox, {
       direction: 'horizontal-reverse',
       gap: 8,
-      children: renderButtons ? renderButtons(tempSystemRole).map(function (buttonProps, index) {
+      children: renderButtons ? renderButtons(temporarySystemRole).map(function (buttonProps, index) {
         return /*#__PURE__*/_jsx(Button, _objectSpread({}, buttonProps), index);
       }) : /*#__PURE__*/_jsxs(_Fragment, {
         children: [/*#__PURE__*/_jsx(Button, {
           onClick: function onClick() {
-            onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(tempSystemRole);
+            onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(temporarySystemRole);
           },
           type: "primary",
           children: "Confirm"

package/es/MessageModal/index.js

@@ -4,7 +4,9 @@ import { X } from 'lucide-react';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 import useControlledState from 'use-merge-value';
-import { Icon, Markdown, MessageInput } from "./..";
+import Icon from "../Icon";
+import Markdown from "../Markdown";
+import MessageInput from "../MessageInput";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 var MessageModal = /*#__PURE__*/memo(function (_ref) {
@@ -17,15 +19,15 @@ var MessageModal = /*#__PURE__*/memo(function (_ref) {
   var _useStyles = useStyles(),
     styles = _useStyles.styles;
   var _useControlledState = useControlledState(false, {
-      value: editing,
-      onChange: onEditingChange
+      onChange: onEditingChange,
+      value: editing
     }),
     _useControlledState2 = _slicedToArray(_useControlledState, 2),
     isEdit = _useControlledState2[0],
     setTyping = _useControlledState2[1];
   var _useControlledState3 = useControlledState(false, {
-      value: open,
-      onChange: onOpenChange
+      onChange: onOpenChange,
+      value: open
     }),
     _useControlledState4 = _slicedToArray(_useControlledState3, 2),
     expand = _useControlledState4[0],
@@ -36,7 +38,7 @@ var MessageModal = /*#__PURE__*/memo(function (_ref) {
     closeIcon: /*#__PURE__*/_jsx(Icon, {
       icon: X
     }),
-    footer: isEdit ? null : undefined,
+    footer: isEdit ? undefined : undefined,
     okText: 'Edit',
     onCancel: function onCancel() {
       return setExpand(false);

package/es/MessageModal/style.d.ts

@@ -1,4 +1,4 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    modal: import("antd-style").SerializedStyles;
     body: import("antd-style").SerializedStyles;
+    modal: import("antd-style").SerializedStyles;
 }>;

package/es/MessageModal/style.js

@@ -5,7 +5,7 @@ export var useStyles = createStyles(function (_ref) {
   var css = _ref.css,
     prefixCls = _ref.prefixCls;
   return {
-    modal: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    height: 70%;\n    .", "-modal-header {\n      margin-bottom: 24px;\n    }\n  "])), prefixCls),
-    body: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    overflow-y: scroll;\n    max-height: 70vh;\n  "])))
+    body: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    overflow-y: scroll;\n    max-height: 70vh;\n  "]))),
+    modal: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    height: 70%;\n    .", "-modal-header {\n      margin-bottom: 24px;\n    }\n  "])), prefixCls)
   };
 });

package/es/SearchBar/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { InputProps } from "../index";
+import { type InputProps } from "../Input";
 export interface SearchBarProps extends InputProps {
     /**
      * @description Whether to enable the shortcut key to focus on the input

package/es/SearchBar/index.js

@@ -8,11 +8,13 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import { Tag } from 'antd';
 import { Search } from 'lucide-react';
 import { memo, useEffect, useRef, useState } from 'react';
-import { Icon, Input, Spotlight } from "./..";
+import Icon from "../Icon";
+import { Input } from "../Input";
+import Spotlight from "../Spotlight";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var isAppleDevice = /(mac|iphone|ipod|ipad)/i.test(typeof navigator !== 'undefined' ? (_navigator = navigator) === null || _navigator === void 0 ? void 0 : _navigator.platform : '');
+var isAppleDevice = /(mac|iphone|ipod|ipad)/i.test(typeof navigator === 'undefined' ? '' : (_navigator = navigator) === null || _navigator === void 0 ? void 0 : _navigator.platform);
 var symbol = isAppleDevice ? '⌘' : 'Ctrl';
 var SearchBar = /*#__PURE__*/memo(function (_ref) {
   var spotlight = _ref.spotlight,
@@ -23,7 +25,7 @@ var SearchBar = /*#__PURE__*/memo(function (_ref) {
     enableShortKey = _ref.enableShortKey,
     _ref$shortKey = _ref.shortKey,
     shortKey = _ref$shortKey === void 0 ? 'f' : _ref$shortKey,
-    props = _objectWithoutProperties(_ref, _excluded);
+    properties = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(true),
     _useState2 = _slicedToArray(_useState, 2),
     showTag = _useState2[0],
@@ -35,14 +37,14 @@ var SearchBar = /*#__PURE__*/memo(function (_ref) {
   var _useStyles = useStyles(),
     styles = _useStyles.styles,
     cx = _useStyles.cx;
-  var inputRef = useRef(null);
+  var inputReference = useRef();
   useEffect(function () {
     if (!enableShortKey) return;
-    var handler = function handler(ev) {
-      if ((isAppleDevice ? ev.metaKey : ev.ctrlKey) && ev.key === shortKey) {
-        var _inputRef$current;
-        ev.preventDefault();
-        (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
+    var handler = function handler(event_) {
+      if ((isAppleDevice ? event_.metaKey : event_.ctrlKey) && event_.key === shortKey) {
+        var _inputReference$curre;
+        event_.preventDefault();
+        (_inputReference$curre = inputReference.current) === null || _inputReference$curre === void 0 ? void 0 : _inputReference$curre.focus();
       }
     };
     document.addEventListener('keydown', handler);
@@ -75,9 +77,9 @@ var SearchBar = /*#__PURE__*/memo(function (_ref) {
           marginRight: 4
         }
       }),
-      ref: inputRef,
+      ref: inputReference,
       value: value
-    }, props)), enableShortKey && showTag && !inputValue && /*#__PURE__*/_jsxs(Tag, {
+    }, properties)), enableShortKey && showTag && !inputValue && /*#__PURE__*/_jsxs(Tag, {
       className: styles.tag,
       children: [symbol, " ", shortKey.toUpperCase()]
     })]

package/es/SearchBar/style.d.ts

@@ -1,6 +1,6 @@
 export declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
-    search: import("antd-style").SerializedStyles;
+    icon: import("antd-style").SerializedStyles;
     input: import("antd-style").SerializedStyles;
+    search: import("antd-style").SerializedStyles;
     tag: import("antd-style").SerializedStyles;
-    icon: import("antd-style").SerializedStyles;
 }>;

package/es/SearchBar/style.js

@@ -5,9 +5,9 @@ export var useStyles = createStyles(function (_ref) {
   var css = _ref.css,
     token = _ref.token;
   return {
-    search: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    position: relative;\n    max-width: 100%;\n  "]))),
+    icon: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    color: ", ";\n  "])), token.colorTextPlaceholder),
     input: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    position: relative;\n    padding: 0 8px 0 12px;\n  "]))),
-    tag: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 5;\n    top: 50%;\n    right: 0;\n    transform: translateY(-50%);\n\n    background: ", ";\n  "])), token.colorBgContainer),
-    icon: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    color: ", ";\n  "])), token.colorTextPlaceholder)
+    search: css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    position: relative;\n    max-width: 100%;\n  "]))),
+    tag: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    pointer-events: none;\n\n    position: absolute;\n    z-index: 5;\n    top: 50%;\n    right: 0;\n    transform: translateY(-50%);\n\n    background: ", ";\n  "])), token.colorBgContainer)
   };
 });

package/es/Snippet/index.js

@@ -4,7 +4,9 @@ var _excluded = ["symbol", "language", "children", "copyable", "type", "spotligh
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { memo } from 'react';
-import { CopyButton, Spotlight, SyntaxHighlighter } from "./..";
+import CopyButton from "../CopyButton";
+import SyntaxHighlighter from "../Highlighter/SyntaxHighlighter";
+import Spotlight from "../Spotlight";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -30,8 +32,8 @@ var Snippet = /*#__PURE__*/memo(function (_ref) {
     }), copyable && /*#__PURE__*/_jsx(CopyButton, {
       content: children,
       size: {
-        fontSize: 14,
-        blockSize: 24
+        blockSize: 24,
+        fontSize: 14
       }
     })]
   }));

package/es/Spotlight/index.js

@@ -16,14 +16,14 @@ var useMouseOffset = function useMouseOffset() {
     _useState4 = _slicedToArray(_useState3, 2),
     outside = _useState4[0],
     setOutside = _useState4[1];
-  var ref = useRef(null);
+  var reference = useRef();
   useEffect(function () {
-    if (ref.current && ref.current.parentElement) {
-      var el = ref.current.parentElement;
+    if (reference.current && reference.current.parentElement) {
+      var element = reference.current.parentElement;
 
       // debounce?
       var onMouseMove = function onMouseMove(e) {
-        var bound = el.getBoundingClientRect();
+        var bound = element.getBoundingClientRect();
         setOffset({
           x: e.clientX - bound.x,
           y: e.clientY - bound.y
@@ -33,26 +33,26 @@ var useMouseOffset = function useMouseOffset() {
       var onMouseLeave = function onMouseLeave() {
         setOutside(true);
       };
-      el.addEventListener('mousemove', onMouseMove);
-      el.addEventListener('mouseleave', onMouseLeave);
+      element.addEventListener('mousemove', onMouseMove);
+      element.addEventListener('mouseleave', onMouseLeave);
       return function () {
-        el.removeEventListener('mousemove', onMouseMove);
-        el.removeEventListener('mouseleave', onMouseLeave);
+        element.removeEventListener('mousemove', onMouseMove);
+        element.removeEventListener('mouseleave', onMouseLeave);
       };
     }
   }, []);
-  return [offset, outside, ref];
+  return [offset, outside, reference];
 };
 var Spotlight = /*#__PURE__*/memo(function (_ref) {
   var className = _ref.className,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 64 : _ref$size,
-    props = _objectWithoutProperties(_ref, _excluded);
+    properties = _objectWithoutProperties(_ref, _excluded);
   var _useMouseOffset = useMouseOffset(),
     _useMouseOffset2 = _slicedToArray(_useMouseOffset, 3),
     offset = _useMouseOffset2[0],
     outside = _useMouseOffset2[1],
-    ref = _useMouseOffset2[2];
+    reference = _useMouseOffset2[2];
   var _useStyles = useStyles({
       offset: offset,
       outside: outside,
@@ -62,7 +62,7 @@ var Spotlight = /*#__PURE__*/memo(function (_ref) {
     cx = _useStyles.cx;
   return /*#__PURE__*/_jsx("div", _objectSpread({
     className: cx(styles, className),
-    ref: ref
-  }, props));
+    ref: reference
+  }, properties));
 });
 export default Spotlight;

package/es/Spotlight/style.js

@@ -13,5 +13,5 @@ export var useStyles = createStyles(function (_ref, _ref2) {
   var spotlightY = ((_offset$y = offset === null || offset === void 0 ? void 0 : offset.y) !== null && _offset$y !== void 0 ? _offset$y : 0) + 'px';
   var spotlightOpacity = outside ? '0' : '.1';
   var spotlightSize = size + 'px';
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      pointer-events: none;\n\n      position: absolute;\n      z-index: 1;\n      inset: 0;\n\n      opacity: ", ";\n      background: radial-gradient(\n        ", " circle at ", " ", ",\n        ", ",\n        ", "\n      );\n      border-radius: inherit;\n\n      transition: all 0.2s;\n    "])), spotlightOpacity, spotlightSize, spotlightX, spotlightY, isDarkMode ? token.colorText : '#fff', !isDarkMode ? token.colorTextQuaternary : 'transparent');
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      pointer-events: none;\n\n      position: absolute;\n      z-index: 1;\n      inset: 0;\n\n      opacity: ", ";\n      background: radial-gradient(\n        ", " circle at ", " ", ",\n        ", ",\n        ", "\n      );\n      border-radius: inherit;\n\n      transition: all 0.2s;\n    "])), spotlightOpacity, spotlightSize, spotlightX, spotlightY, isDarkMode ? token.colorText : '#fff', isDarkMode ? 'transparent' : token.colorTextQuaternary);
 });

package/es/StroyBook/index.d.ts

@@ -1,7 +1,5 @@
 /// <reference types="react" />
-import { useControls, useCreateStore } from 'leva';
 import { DivProps } from "../types";
-export { useControls, useCreateStore };
 export interface StroyBookProps extends DivProps {
     /**
      * @description The Leva store instance to be used by the component
@@ -15,3 +13,4 @@ export interface StroyBookProps extends DivProps {
 }
 export declare const StroyBook: import("react").NamedExoticComponent<StroyBookProps>;
 export default StroyBook;
+export { useControls, useCreateStore } from 'leva';

package/es/StroyBook/index.js

@@ -4,13 +4,12 @@ var _excluded = ["levaStore", "noPadding", "className", "children"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import { useResponsive } from 'antd-style';
-import { LevaPanel, useControls, useCreateStore } from 'leva';
+import { LevaPanel } from 'leva';
 import { memo } from 'react';
 import DraggablePanel from "../DraggablePanel";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-export { useControls, useCreateStore };
 export var StroyBook = /*#__PURE__*/memo(function (_ref) {
   var levaStore = _ref.levaStore,
     noPadding = _ref.noPadding,
@@ -44,4 +43,5 @@ export var StroyBook = /*#__PURE__*/memo(function (_ref) {
     })]
   }));
 });
-export default StroyBook;
+export default StroyBook;
+export { useControls, useCreateStore } from 'leva';

package/es/StroyBook/style.d.ts

@@ -1,6 +1,6 @@
 export declare const useStyles: (props?: boolean | undefined) => import("antd-style").ReturnStyles<{
     editor: import("antd-style").SerializedStyles;
     left: import("antd-style").SerializedStyles;
-    right: import("antd-style").SerializedStyles;
     leva: import("antd-style").SerializedStyles;
+    right: import("antd-style").SerializedStyles;
 }>;

package/es/StroyBook/style.js

@@ -8,7 +8,7 @@ export var useStyles = createStyles(function (_ref, noPadding) {
   return {
     editor: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      align-items: stretch;\n      justify-content: stretch;\n\n      width: inherit;\n      min-height: inherit;\n\n      ", " {\n        flex-direction: column;\n      }\n    "])), responsive.mobile),
     left: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      overflow: auto;\n      display: flex;\n      flex: 1;\n      align-items: center;\n      justify-content: center;\n\n      ", "\n    "])), !noPadding && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        padding: 40px 24px;\n      "])))),
-    right: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      background: ", ";\n\n      ", " {\n        .draggable-panel-fixed {\n          width: 100% !important;\n        }\n      }\n    "])), token.colorBgLayout, responsive.mobile),
-    leva: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      --leva-sizes-controlWidth: 66%;\n      --leva-colors-elevation1: ", ";\n      --leva-colors-elevation2: transparent;\n      --leva-colors-elevation3: ", ";\n      --leva-colors-accent1: ", ";\n      --leva-colors-accent2: ", ";\n      --leva-colors-accent3: ", ";\n      --leva-colors-highlight1: ", ";\n      --leva-colors-highlight2: ", ";\n      --leva-colors-highlight3: ", ";\n      --leva-colors-vivid1: ", ";\n      --leva-shadows-level1: unset;\n      --leva-shadows-level2: unset;\n      --leva-fonts-mono: ", ";\n\n      overflow: auto;\n      width: 100%;\n      height: 100%;\n      padding: 6px 0;\n\n      > div {\n        background: transparent;\n\n        > div {\n          background: transparent;\n        }\n      }\n\n      input:checked + label > svg {\n        stroke: ", ";\n      }\n\n      button {\n        --leva-colors-accent2: ", ";\n      }\n    "])), token.colorFillSecondary, token.colorFillSecondary, token.colorPrimary, token.colorPrimaryHover, token.colorPrimaryActive, token.colorTextTertiary, token.colorTextSecondary, token.colorText, token.colorWarning, token.fontFamilyCode, token.colorBgLayout, token.colorFillSecondary)
+    leva: css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      --leva-sizes-controlWidth: 66%;\n      --leva-colors-elevation1: ", ";\n      --leva-colors-elevation2: transparent;\n      --leva-colors-elevation3: ", ";\n      --leva-colors-accent1: ", ";\n      --leva-colors-accent2: ", ";\n      --leva-colors-accent3: ", ";\n      --leva-colors-highlight1: ", ";\n      --leva-colors-highlight2: ", ";\n      --leva-colors-highlight3: ", ";\n      --leva-colors-vivid1: ", ";\n      --leva-shadows-level1: unset;\n      --leva-shadows-level2: unset;\n      --leva-fonts-mono: ", ";\n\n      overflow: auto;\n      width: 100%;\n      height: 100%;\n      padding: 6px 0;\n\n      > div {\n        background: transparent;\n\n        > div {\n          background: transparent;\n        }\n      }\n\n      input:checked + label > svg {\n        stroke: ", ";\n      }\n\n      button {\n        --leva-colors-accent2: ", ";\n      }\n    "])), token.colorFillSecondary, token.colorFillSecondary, token.colorPrimary, token.colorPrimaryHover, token.colorPrimaryActive, token.colorTextTertiary, token.colorTextSecondary, token.colorText, token.colorWarning, token.fontFamilyCode, token.colorBgLayout, token.colorFillSecondary),
+    right: css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      background: ", ";\n\n      ", " {\n        .draggable-panel-fixed {\n          width: 100% !important;\n        }\n      }\n    "])), token.colorBgLayout, responsive.mobile)
   };
 });

package/es/Swatches/index.d.ts

@@ -13,7 +13,7 @@ export interface SwatchesProps {
      * @description A function to be called when a swatch is selected
      * @default undefined
      */
-    onSelect?: (c: string | null) => void;
+    onSelect?: (c?: string | undefined) => void;
 }
 declare const Swatches: import("react").NamedExoticComponent<SwatchesProps>;
 export default Swatches;

package/es/Swatches/index.js

@@ -13,15 +13,15 @@ var Swatches = /*#__PURE__*/memo(function (_ref) {
     horizontal: true,
     children: [/*#__PURE__*/_jsx(Flexbox, {
       onClick: function onClick() {
-        onSelect === null || onSelect === void 0 ? void 0 : onSelect(null);
+        onSelect === null || onSelect === void 0 ? void 0 : onSelect();
       },
       style: {
-        width: 24,
-        height: 24,
         background: theme.colorBgContainer,
-        boxShadow: "inset 0 0 0px 2px ".concat(!activeColor ? theme.colorPrimary : 'rgba(0,0,0,0.1)'),
         borderRadius: '50%',
-        cursor: 'pointer'
+        boxShadow: "inset 0 0 0px 2px ".concat(activeColor ? 'rgba(0,0,0,0.1)' : theme.colorPrimary),
+        cursor: 'pointer',
+        height: 24,
+        width: 24
       }
     }), colors.map(function (c) {
       var borderColor = c === activeColor ? theme.colorPrimary : 'rgba(0,0,0,0.1)';
@@ -30,12 +30,12 @@ var Swatches = /*#__PURE__*/memo(function (_ref) {
           onSelect === null || onSelect === void 0 ? void 0 : onSelect(c);
         },
         style: {
-          width: 24,
-          height: 24,
           background: c,
-          boxShadow: "inset 0 0 0px 2px ".concat(borderColor),
           borderRadius: '50%',
-          cursor: 'pointer'
+          boxShadow: "inset 0 0 0px 2px ".concat(borderColor),
+          cursor: 'pointer',
+          height: 24,
+          width: 24
         }
       }, c);
     })]

package/es/ThemeProvider/index.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
 import { type ThemeMode, extractStaticStyle } from 'antd-style';
 import type { CustomStylishParams, CustomTokenParams } from 'antd-style/lib/types/function';
+import { type ReactNode } from 'react';
 export interface ThemeProviderProps {
     /**
      * @description Cache for the extracted static styles
@@ -9,7 +9,7 @@ export interface ThemeProviderProps {
     /**
      * @description The children of the ThemeProvider component
      */
-    children: React.ReactNode;
+    children: ReactNode;
     /**
      * @description Custom stylish
      */