neko-ui 1.0.45 → 1.0.47

package/es/back-top/style.js

@@ -1,8 +1,8 @@
 import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export const cls={backtop:prefixCls("back-top"),out:prefixCls("back-top-out")};injectGlobal`
   :root {
     --back-top-color: #fff;
-    --back-top-bg: var(--text-secondary, #4e4e4e);
-    --back-top-hover-bg: var(--text-color, rgb(0 0 0 / 65%));
+    --back-top-bg: var(--text-secondary);
+    --back-top-hover-bg: var(--text-color);
   }
 
   [data-theme='dark'] {

package/es/button/style.js

@@ -3,17 +3,17 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
       .${cls.label} {
         --btn-color: var(--${type}-color);
       }
-      --btn-border: var(--${type}-color-border);
-      --btn-bg: var(--${type}-color-bg);
-      --btn-hover-color: var(--${type}-color-hover);
-      --btn-active-color: var(--${type}-color-active);
-      --btn-outline-color: var(--${type}-color-outline);
+      --btn-border: var(--${type}-border);
+      --btn-bg: var(--${type}-bg);
+      --btn-hover-color: var(--${type}-hover);
+      --btn-active-color: var(--${type}-active);
+      --btn-outline-color: var(--${type}-outline);
     }
     ${fillCls} {
       --btn-bg: var(--${type}-color);
       --btn-border: var(--${type}-color);
-      --btn-hover-bg: var(--${type}-color-hover);
-      --btn-active-bg: var(--${type}-color-active);
+      --btn-hover-bg: var(--${type}-hover);
+      --btn-active-bg: var(--${type}-active);
     }
   `}injectGlobal`
   :root {
@@ -52,7 +52,7 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
     min-inline-size: var(--btn-size);
     block-size: fit-content;
     min-block-size: var(--btn-size);
-    font-size: var(--font-size, 14px);
+    font-size: var(--font-size);
     color: var(--btn-color);
     background-color: var(--btn-bg);
     outline-offset: 4px;
@@ -87,12 +87,12 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
     --btn-size: 1.5rem;
 
     padding: 0 7px;
-    font-size: var(--font-size-xs, 10px);
+    font-size: var(--font-size-xs);
   }
   .${cls.large} {
     --btn-size: 2.5rem;
 
-    font-size: var(--font-size-lg, 16px);
+    font-size: var(--font-size-lg);
   }
   .${cls.link} {
     .${cls.label} {
@@ -100,12 +100,12 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
     }
   }
   .${cls.default} {
-    --btn-outline-color: var(--primary-color-outline);
+    --btn-outline-color: var(--primary-outline);
     --btn-color: var(--text-color);
-    --btn-bg: var(--component-background, #fff);
+    --btn-bg: var(--component-background);
     --btn-border: var(--border-color);
-    --btn-hover-color: var(--primary-color-hover);
-    --btn-active-color: var(--primary-color-active);
+    --btn-hover-color: var(--primary-hover);
+    --btn-active-color: var(--primary-active);
   }
   ${btnColor("primary")}
   ${btnColor("error")}

package/es/capture-screen/style.js

@@ -7,7 +7,7 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
   }
   .${cls.view} video {
     border: var(--border-base);
-    border-radius: var(--border-radius, 8px);
+    border-radius: var(--border-radius);
     inline-size: 100%;
     transition: border-color var(--transition-duration) var(--transition-timing-function);
   }
@@ -39,7 +39,7 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
 
     &::before {
       display: block;
-      border-inline-start: 1px solid var(--border-color, #d9d9d9);
+      border-inline-start: 1px solid var(--border-color);
       block-size: 100%;
       transition: border-color var(--transition-duration) var(--transition-timing-function);
       transform: translateX(-16px);

package/es/carousel/index.js

@@ -1 +1 @@
-import React,{useEffect,useMemo,useRef}from"react";import{isUndefined}from"@moneko/common";import sso from"shared-store-object";import{cls}from"./style";import{cx}from"../emotion";function Carousel(props){const carousel=useRef(sso({prev:props.children.length-1,offset:props.offset||0,next:1,direction:0,playTimer:null,onOffsetChange(){var _props_onOffsetChange;if(carousel.current.direction===-1){carousel.current.offset=carousel.current.prev}else if(carousel.current.direction===1){carousel.current.offset=carousel.current.next}carousel.current.direction=0;(_props_onOffsetChange=props.onOffsetChange)===null||_props_onOffsetChange===void 0?void 0:_props_onOffsetChange.call(props,carousel.current.offset)},handlePrev(){carousel.current.direction=-1},handleNext(){carousel.current.direction=1}}));const{offset,prev,next,direction}=carousel.current;const{autoplay=-1,className,style,dots,children,header}=props;const dotLen=useMemo(()=>Array(children.length>20?20:children.length).fill(0),[children.length]);useEffect(()=>{if(carousel.current.playTimer){clearTimeout(carousel.current.playTimer)}if(autoplay>0){carousel.current.playTimer=setInterval(()=>{if(autoplay<1&&carousel.current.playTimer){clearInterval(carousel.current.playTimer)}carousel.current.handleNext()},autoplay)}},[autoplay]);useEffect(()=>{if(!isUndefined(props.offset)){carousel.current.offset=props.offset}},[props.offset]);useEffect(()=>{let _prev=offset-1,_next=offset+1;if(_prev<0){_prev=children.length-1}if(_next>children.length-1){_next=0}carousel.current.prev=_prev;carousel.current.next=_next},[children.length,offset]);return React.createElement("section",{className:cx(cls.carousel,className),style:style},React.createElement("section",{className:cls.list,"data-dir":direction,onAnimationEnd:carousel.current.onOffsetChange},React.createElement("div",{className:cls.item},children[prev]),React.createElement("div",{className:cls.item},children[offset]),React.createElement("div",{className:cls.item},children[next])),header?React.createElement("section",{className:cls.header},header(offset)):null,React.createElement("div",{className:cx("neko-icon",cls.prev),onClick:carousel.current.handlePrev}),React.createElement("div",{className:cx("neko-icon",cls.next),onClick:carousel.current.handleNext}),dots?React.createElement("div",{className:cls.dots},dotLen.map((_,i)=>React.createElement("i",{key:i,className:cx(cls.dot,i===offset%20+direction&&cls.active),onClick:()=>carousel.current.offset=Math.floor(offset/20)*20+i}))):null)}export default Carousel;
+import React,{useEffect,useMemo,useRef}from"react";import{isUndefined}from"@moneko/common";import sso from"shared-store-object";import{cls}from"./style";import{cx}from"../emotion";function Carousel(props){const carousel=useRef(sso({prev:props.children.length-1,offset:props.offset||0,next:1,direction:0,playTimer:null,onOffsetChange(){var _props_onOffsetChange;if(carousel.current.direction===-1){carousel.current.offset=carousel.current.prev}else if(carousel.current.direction===1){carousel.current.offset=carousel.current.next}carousel.current.direction=0;(_props_onOffsetChange=props.onOffsetChange)===null||_props_onOffsetChange===void 0?void 0:_props_onOffsetChange.call(props,carousel.current.offset)},handlePrev(){carousel.current.direction=-1},handleNext(){carousel.current.direction=1}}));const{offset,prev,next,direction}=carousel.current;const{autoplay=-1,className,style,dots,children,header}=props;const dotLen=useMemo(()=>Array(children.length>20?20:children.length).fill(0),[children.length]);useEffect(()=>{if(carousel.current.playTimer){clearTimeout(carousel.current.playTimer)}if(autoplay>0){carousel.current.playTimer=setInterval(()=>{if(autoplay<1&&carousel.current.playTimer){clearInterval(carousel.current.playTimer)}carousel.current.handleNext()},autoplay)}},[autoplay]);useEffect(()=>{if(!isUndefined(props.offset)){carousel.current.offset=props.offset}},[props.offset]);useEffect(()=>{let _prev=offset-1,_next=offset+1;if(_prev<0){_prev=children.length-1}if(_next>children.length-1){_next=0}carousel.current.prev=_prev;carousel.current.next=_next},[children.length,offset]);useEffect(()=>{const _store=carousel.current;return()=>{if(_store.playTimer){clearTimeout(_store.playTimer)}_store()}},[]);return React.createElement("section",{className:cx(cls.carousel,className),style:style},React.createElement("section",{className:cls.list,"data-dir":direction,onAnimationEnd:carousel.current.onOffsetChange},React.createElement("div",{className:cls.item},children[prev]),React.createElement("div",{className:cls.item},children[offset]),React.createElement("div",{className:cls.item},children[next])),header?React.createElement("section",{className:cls.header},header(offset)):null,React.createElement("div",{className:cx("neko-icon",cls.prev),onClick:carousel.current.handlePrev}),React.createElement("div",{className:cx("neko-icon",cls.next),onClick:carousel.current.handleNext}),dots?React.createElement("div",{className:cls.dots},dotLen.map((_,i)=>React.createElement("i",{key:i,className:cx(cls.dot,i===offset%20+direction&&cls.active),onClick:()=>carousel.current.offset=Math.floor(offset/20)*20+i}))):null)}export default Carousel;

package/es/color-palette/index.js

@@ -1 +1 @@
-function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};return _extends.apply(this,arguments)}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{colorParse,passiveSupported,setClipboard,throttle}from"@moneko/common";import{cls}from"./style";import{cx}from"../emotion";import{Input,InputNumber}from"../index";const material=["#f44336","#E91E63","#9C27B0","#673AB7","#3F51B5","#2196F3","#03A9F4","#00BCD4","#009688","#4CAF50","#8BC34A","#CDDC39","#FFEB3B","#FFC107","#FF9800","#FF5722","#795548","#9E9E9E","#607D8B","rgba(0,0,0,.65)","transparent"];function formatterOpacity(v){return v?Number((v*100).toFixed()):v}function parseOpacity(v){let _val=v;if(typeof v==="string"){_val=v.replace(/[^\d]/g,"")}return _val/100}const opt={hexa:{get:"toHexa",next:"rgba",max:[255,255,255,1]},rgba:{get:"toRgba",next:"hsla",max:[255,255,255,1]},hsla:{get:"toHsla",next:"hsva",max:[360,100,100,1]},hsva:{get:"toHsva",next:"cmyk",max:[360,100,100,1]},cmyk:{get:"toCmyk",next:"hexa",max:[100,100,100,100]}};const HexaForm=({value,onChange})=>{const[hex,setHex]=useState(value);const hexChange=useCallback(v=>{if(typeof v==="string"){setHex(v);throttle(onChange,4)(v)}},[onChange]);useEffect(()=>{setHex(value)},[value]);return React.createElement(Input,{className:cls.input,name:"hex",size:"small",value:hex,onChange:hexChange})};const ColorPalette=_param=>{var{className,defaultValue="#5794ff",value,onChange}=_param,props=_objectWithoutProperties(_param,["className","defaultValue","value","onChange"]);const colorPickerRef=useRef(null);const color=useRef(colorParse(value||defaultValue));const drag=useRef(false);const[type,setType]=useState(color.current.type);const[hsva,setHSVA]=useState(color.current.value);const[inputVal,setInputVal]=useState(color.current[opt[type].get]());const setColor=useCallback(c=>{if(c&&color.current[opt[color.current.type].get]().toString()!==c){const nc=colorParse(c);color.current.setValue(nc.value);color.current.type=nc.type;setInputVal(color.current[opt[color.current.type].get]());setType(color.current.type);setHSVA(color.current.value)}},[]);const changeColor=useCallback(ev=>{if(colorPickerRef.current){const _hsva=[...color.current.value];const{x,y,width,height}=colorPickerRef.current.getBoundingClientRect();_hsva[1]=Math.floor(Math.min(Math.max(0,(ev.clientX-x)/width*100),100));_hsva[2]=Math.floor(100-Math.min(Math.max(0,(ev.clientY-y)/height*100),100));color.current.setValue(_hsva);setHSVA(_hsva)}},[]);const colorPickerMouseDown=useCallback(e=>{Object.assign(drag,{current:true});changeColor(e)},[changeColor]);const colorPickerMouseMove=useCallback(e=>{if(drag.current){changeColor(e)}},[changeColor]);const colorPickerMouseUp=useCallback(()=>{Object.assign(drag,{current:false})},[]);const handleSwitch=useCallback(()=>{color.current.type=opt[color.current.type].next;setInputVal(color.current[opt[color.current.type].get]());setType(color.current.type)},[]);const handleCopy=useCallback(e=>{setClipboard(inputVal.toString(),e.target)},[inputVal]);const setHue=useCallback(e=>{const _hsva=[...color.current.value];_hsva[0]=Number(e.target.value);setHSVA(_hsva)},[]);const setAlpha=useCallback(e=>{const _hsva=[...color.current.value];_hsva[3]=Number(e.target.value);setHSVA(_hsva)},[]);const handleFliedChange=useCallback((i,v)=>{if(typeof v==="number"){const old=color.current[opt[color.current.type].get]();old[i]=v||0;setInputVal(old);if(i===3&&color.current.type!=="cmyk"){setAlpha({target:{value:v||0}})}else{setHSVA(colorParse(old.toString()).value)}}},[setAlpha]);const handleHexChange=useCallback(hex=>{if(color.current.isColor(hex)){setColor(hex)}},[setColor]);const style=useMemo(()=>{return{"--c":color.current.toRgbaString(),"--h":hsva[0],"--s":hsva[1],"--v":hsva[2],"--a":hsva[3]}},[hsva]);useEffect(()=>{throttle(setColor,4)(value)},[setColor,value]);useEffect(()=>{color.current.setValue(hsva);color.current.type=type;setInputVal(color.current[opt[type].get]())},[hsva,type]);useEffect(()=>{onChange===null||onChange===void 0?void 0:onChange(inputVal.toString())},[onChange,inputVal,setColor]);useEffect(()=>{document.documentElement.addEventListener("mousemove",colorPickerMouseMove,passiveSupported);document.documentElement.addEventListener("mouseup",colorPickerMouseUp,passiveSupported);return()=>{document.documentElement.removeEventListener("mousemove",colorPickerMouseMove,passiveSupported);document.documentElement.removeEventListener("mouseup",colorPickerMouseUp,passiveSupported)}},[colorPickerMouseMove,colorPickerMouseUp]);return React.createElement("div",_extends({},props,{className:cx(cls.palette,className),style:style}),React.createElement("div",{className:cls.picker,ref:colorPickerRef,onMouseDown:colorPickerMouseDown}),React.createElement("div",{className:cls.chooser},React.createElement("div",{className:cls.range},React.createElement("input",{className:cx(cls.slider,cls.hue,type==="cmyk"&&cls.cmykHue),min:"0",max:"360",type:"range",value:hsva[0],onChange:setHue}),type!=="cmyk"?React.createElement("input",{className:cx(cls.slider,cls.opacity),min:"0",max:"1",step:"0.01",type:"range",value:hsva[3],onChange:setAlpha}):null),React.createElement("div",{className:cls.preview,onClick:handleCopy})),React.createElement("div",{className:cls.form},type==="hexa"?React.createElement(HexaForm,{value:inputVal.toString(),onChange:handleHexChange}):inputVal.map((n,i)=>{const isAlpha=i===3&&type!=="cmyk";return React.createElement(InputNumber,{size:"small",key:type+i,className:cls.input,value:n,max:opt[type].max[i],min:0,step:isAlpha?.01:1,formatter:isAlpha?formatterOpacity:null,parser:isAlpha?parseOpacity:null,onChange:v=>handleFliedChange(i,v)})}),React.createElement("div",{className:cls.switch,onClick:handleSwitch},type)),React.createElement("div",{className:cls.color},material.map(c=>React.createElement("i",{key:c,style:{"--c":c},onClick:()=>{setColor(c)}}))))};export default ColorPalette;
+function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};return _extends.apply(this,arguments)}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import{colorParse,passiveSupported,setClipboard,throttle}from"@moneko/common";import{cls}from"./style";import{cx}from"../emotion";import{Input,InputNumber}from"../index";const material=["#f44336","#E91E63","#9C27B0","#673AB7","#3F51B5","#2196F3","#03A9F4","#00BCD4","#009688","#4CAF50","#8BC34A","#CDDC39","#FFEB3B","#FFC107","#FF9800","#FF5722","#795548","#9E9E9E","#607D8B","rgba(0,0,0,.65)","transparent"];function formatterOpacity(v){return v?Number((v*100).toFixed()):v}function parseOpacity(v){let _val=v;if(typeof v==="string"){_val=v.replace(/[^\d]/g,"")}return _val/100}const opt={hexa:{get:"toHexa",next:"rgba",max:[255,255,255,1]},rgba:{get:"toRgba",next:"hsla",max:[255,255,255,1]},hsla:{get:"toHsla",next:"hsva",max:[360,100,100,1]},hsva:{get:"toHsva",next:"cmyk",max:[360,100,100,1]},cmyk:{get:"toCmyk",next:"hexa",max:[100,100,100,100]}};const HexaForm=({value,onChange})=>{const[hex,setHex]=useState(value);const hexChange=useCallback(v=>{if(typeof v==="string"){setHex(v);throttle(onChange,4)(v)}},[onChange]);useEffect(()=>{setHex(value)},[value]);return React.createElement(Input,{className:cls.input,name:"hex",size:"small",value:hex,onChange:hexChange})};const ColorPalette=_param=>{var{className,defaultValue="#5794ff",value,onChange}=_param,props=_objectWithoutProperties(_param,["className","defaultValue","value","onChange"]);const colorPickerRef=useRef(null);const color=useRef(colorParse(value||defaultValue));const drag=useRef(false);const[type,setType]=useState(color.current.type);const[hsva,setHSVA]=useState(color.current.value);const[inputVal,setInputVal]=useState(color.current[opt[type].get]());const setColor=useCallback(c=>{if(c&&color.current[opt[color.current.type].get]().toString()!==c){const nc=colorParse(c);color.current.setValue(nc.value);color.current.type=nc.type;setInputVal(color.current[opt[color.current.type].get]());setType(color.current.type);setHSVA(color.current.value)}},[]);const changeColor=useCallback(ev=>{if(colorPickerRef.current){const _hsva=[...color.current.value];const{x,y,width,height}=colorPickerRef.current.getBoundingClientRect();_hsva[1]=Math.floor(Math.min(Math.max(0,(ev.clientX-x)/width*100),100));_hsva[2]=Math.floor(100-Math.min(Math.max(0,(ev.clientY-y)/height*100),100));color.current.setValue(_hsva);setHSVA(_hsva)}},[]);const colorPickerMouseDown=useCallback(e=>{Object.assign(drag,{current:true});changeColor(e)},[changeColor]);const colorPickerMouseMove=useCallback(e=>{if(drag.current){changeColor(e)}},[changeColor]);const colorPickerMouseUp=useCallback(()=>{Object.assign(drag,{current:false})},[]);const handleSwitch=useCallback(()=>{color.current.type=opt[color.current.type].next;setInputVal(color.current[opt[color.current.type].get]());setType(color.current.type)},[]);const handleCopy=useCallback(e=>{setClipboard(inputVal.toString(),e.target)},[inputVal]);const setHue=useCallback(e=>{const _hsva=[...color.current.value];_hsva[0]=Number(e.target.value);setHSVA(_hsva)},[]);const setAlpha=useCallback(e=>{const _hsva=[...color.current.value];_hsva[3]=Number(e.target.value);setHSVA(_hsva)},[]);const handleFliedChange=useCallback((i,v)=>{if(typeof v==="number"){const old=color.current[opt[color.current.type].get]();old[i]=v||0;setInputVal(old);if(i===3&&color.current.type!=="cmyk"){setAlpha({target:{value:v||0}})}else{setHSVA(colorParse(old.toString()).value)}}},[setAlpha]);const handleHexChange=useCallback(hex=>{if(color.current.isColor(hex)){setColor(hex)}},[setColor]);const style=useMemo(()=>{return{"--c":color.current.toRgbaString(),"--h":hsva[0],"--s":hsva[1],"--v":hsva[2],"--a":hsva[3]}},[hsva]);useEffect(()=>{throttle(setColor,4)(value)},[setColor,value]);useEffect(()=>{color.current.setValue(hsva);color.current.type=type;setInputVal(color.current[opt[type].get]())},[hsva,type]);useEffect(()=>{onChange===null||onChange===void 0?void 0:onChange(inputVal.toString())},[onChange,inputVal]);useEffect(()=>{document.documentElement.addEventListener("mousemove",colorPickerMouseMove,passiveSupported);document.documentElement.addEventListener("mouseup",colorPickerMouseUp,passiveSupported);return()=>{document.documentElement.removeEventListener("mousemove",colorPickerMouseMove,passiveSupported);document.documentElement.removeEventListener("mouseup",colorPickerMouseUp,passiveSupported)}},[colorPickerMouseMove,colorPickerMouseUp]);return React.createElement("div",_extends({},props,{className:cx(cls.palette,className),style:style}),React.createElement("div",{className:cls.picker,ref:colorPickerRef,onMouseDown:colorPickerMouseDown}),React.createElement("div",{className:cls.chooser},React.createElement("div",{className:cls.range},React.createElement("input",{className:cx(cls.slider,cls.hue,type==="cmyk"&&cls.cmykHue),min:"0",max:"360",type:"range",value:hsva[0],onChange:setHue}),type!=="cmyk"?React.createElement("input",{className:cx(cls.slider,cls.opacity),min:"0",max:"1",step:"0.01",type:"range",value:hsva[3],onChange:setAlpha}):null),React.createElement("div",{className:cls.preview,onClick:handleCopy})),React.createElement("div",{className:cls.form},type==="hexa"?React.createElement(HexaForm,{value:inputVal.toString(),onChange:handleHexChange}):inputVal.map((n,i)=>{const isAlpha=i===3&&type!=="cmyk";return React.createElement(InputNumber,{size:"small",key:type+i,className:cls.input,value:n,max:opt[type].max[i],min:0,step:isAlpha?.01:1,formatter:isAlpha?formatterOpacity:null,parser:isAlpha?parseOpacity:null,onChange:v=>handleFliedChange(i,v)})}),React.createElement("div",{className:cls.switch,onClick:handleSwitch},type)),React.createElement("div",{className:cls.color},material.map(c=>React.createElement("i",{key:c,style:{"--c":c},onClick:()=>{setColor(c)}}))))};export default ColorPalette;

package/es/color-palette/style.js

@@ -57,19 +57,19 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
     font-size: 12px;
     text-align: center;
     color: var(--primary-color);
-    background-color: var(--primary-color-bg);
+    background-color: var(--primary-bg);
     text-transform: uppercase;
-    outline-color: var(--primary-color-outline);
+    outline-color: var(--primary-outline);
     transition-property: background-color, color, outline-color, border-radius, transform;
     transition-timing-function: var(--transition-timing-function);
     transition-duration: var(--transition-duration);
 
     &:hover {
-      color: var(--primary-color-hover);
+      color: var(--primary-hover);
     }
 
     &:active {
-      color: var(--primary-color-active);
+      color: var(--primary-active);
       transform: scale(0.98);
     }
   }

package/es/color-picker/style.js

@@ -7,14 +7,14 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
     --alpha-gradient: repeating-conic-gradient(#eee 0 25%, transparent 0 50%) 0 / 10px 10px;
 
     display: inline-block;
-    border-radius: var(--border-radius, 8px);
+    border-radius: var(--border-radius);
     inline-size: 25px;
     block-size: 25px;
     background: var(--alpha-gradient);
 
     &::after {
       display: block;
-      border-radius: var(--border-radius, 8px);
+      border-radius: var(--border-radius);
       inline-size: 100%;
       block-size: 100%;
       background: var(--c, #fff);

package/es/from-schema/index.d.ts

@@ -0,0 +1,3 @@
+import { type TreeData } from '../tree';
+declare function fromSchema(schema: Record<string, any>, pid?: string): TreeData<string>[];
+export default fromSchema;

package/es/from-schema/index.js

@@ -0,0 +1 @@
+function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=arguments[i]!=null?arguments[i]:{};var ownKeys=Object.keys(source);if(typeof Object.getOwnPropertySymbols==="function"){ownKeys=ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym){return Object.getOwnPropertyDescriptor(source,sym).enumerable}))}ownKeys.forEach(function(key){_defineProperty(target,key,source[key])})}return target}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly){symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable})}keys.push.apply(keys,symbols)}return keys}function _objectSpreadProps(target,source){source=source!=null?source:{};if(Object.getOwnPropertyDescriptors){Object.defineProperties(target,Object.getOwnPropertyDescriptors(source))}else{ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))})}return target}function _objectWithoutProperties(source,excluded){if(source==null)return{};var target=_objectWithoutPropertiesLoose(source,excluded);var key,i;if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++){key=sourceSymbolKeys[i];if(excluded.indexOf(key)>=0)continue;if(!Object.prototype.propertyIsEnumerable.call(source,key))continue;target[key]=source[key]}}return target}function _objectWithoutPropertiesLoose(source,excluded){if(source==null)return{};var target={};var sourceKeys=Object.keys(source);var key,i;for(i=0;i<sourceKeys.length;i++){key=sourceKeys[i];if(excluded.indexOf(key)>=0)continue;target[key]=source[key]}return target}function fromSchema(schema,pid){const treeData=[];const{properties}=schema;for(const _ref in properties){var name=_ref;if(Object.prototype.hasOwnProperty.call(properties,name)){const _properties_name=properties[name],{properties:_properties,items}=_properties_name,item=_objectWithoutProperties(_properties_name,["properties","items"]);const node=_objectSpreadProps(_objectSpread({},item),{name:name,subTitle:item.type,key:`${pid?pid+".":""}${name}`});if(item.type==="object"){node.children=fromSchema({properties:_properties},node.key)}else if(item.type==="array"){node.children=fromSchema({properties:{items:_objectSpreadProps(_objectSpread({},items),{title:"items"})}},node.key)}treeData.push(node)}}return treeData}export default fromSchema;

package/es/index.d.ts

@@ -2,7 +2,7 @@ export * from './emotion';
 export { default as Markdown, getMarkedImgList, markdownUtil, type PhotoViewDataType, type MarkdownProps, type CodeToolType, type AnchorType, } from './markdown';
 export { default as BackTop, type BackTopProps } from './back-top';
 export { default as Tree, type TreeProps, type TreeBaseProp, type TreeData } from './tree';
-export { default as schemaToTreeData } from './schema-to-tree-data';
+export { default as fromSchema } from './from-schema';
 export { default as HighlightText, strToHighlight, RegExp_HighLight, type HighlightFlag, type Highlight, type HighlightTextProps, type HighlightTextJson, } from './highlight-text';
 export { default as colorScheme, type ColorScheme } from './color-scheme';
 export { default as Avatar, type AvatarProps } from './avatar';

package/es/index.js

@@ -1,12 +1,43 @@
-import{getColorVariableString}from"@moneko/common";import{injectGlobal}from"./emotion";export*from"./emotion";export{default as Markdown,getMarkedImgList,markdownUtil}from"./markdown";export{default as BackTop}from"./back-top";export{default as Tree}from"./tree";export{default as schemaToTreeData}from"./schema-to-tree-data";export{default as HighlightText,strToHighlight,RegExp_HighLight}from"./highlight-text";export{default as colorScheme}from"./color-scheme";export{default as Avatar}from"./avatar";export{default as AvatarGroup}from"./avatar-group";export{default as CaptureScreen}from"./capture-screen";export{default as WaveCircle}from"./wave-circle";export{default as Button}from"./button";export{default as Input}from"./input";export{default as InputNumber}from"./input-number";export{default as Tooltip}from"./tooltip";export{default as ColorPalette}from"./color-palette";export{default as ColorPicker}from"./color-picker";export{default as Skeleton}from"./skeleton";export{default as CodeBlock}from"./code-block";export{default as Photo}from"./photo";export{default as Carousel}from"./carousel";export{default as prefixCls,setPrefixCls}from"./prefix-cls";export{default as highlight}from"./highlight";export{default as Prism}from"./prism";injectGlobal([`:root {
+import{getColorVariableString}from"@moneko/common";import{injectGlobal}from"./emotion";export*from"./emotion";export{default as Markdown,getMarkedImgList,markdownUtil}from"./markdown";export{default as BackTop}from"./back-top";export{default as Tree}from"./tree";export{default as fromSchema}from"./from-schema";export{default as HighlightText,strToHighlight,RegExp_HighLight}from"./highlight-text";export{default as colorScheme}from"./color-scheme";export{default as Avatar}from"./avatar";export{default as AvatarGroup}from"./avatar-group";export{default as CaptureScreen}from"./capture-screen";export{default as WaveCircle}from"./wave-circle";export{default as Button}from"./button";export{default as Input}from"./input";export{default as InputNumber}from"./input-number";export{default as Tooltip}from"./tooltip";export{default as ColorPalette}from"./color-palette";export{default as ColorPicker}from"./color-picker";export{default as Skeleton}from"./skeleton";export{default as CodeBlock}from"./code-block";export{default as Photo}from"./photo";export{default as Carousel}from"./carousel";export{default as prefixCls,setPrefixCls}from"./prefix-cls";export{default as highlight}from"./highlight";export{default as Prism}from"./prism";injectGlobal`
+  :root {
+    --font-size: 14px;
+    --font-size-sm: 12px;
+    --font-size-xs: 10px;
+    --font-size-lg: 16px;
+    --border-base: 1px solid var(--border-color);
+    --border-color: rgb(5 5 5 / 6%);
+    --border-radius: 8px;
+    --component-background: rgb(255 255 255 / 80%);
+    --text-color: rgb(0 0 0 / 65%);
+    --text-secondary: #4e4e4e;
+    --text-heading: #1b1b1b;
+    --text-selection-bg: var(--primary-bg);
+    --text-shadow-color: rgb(0 0 0 / 10%);
+    --box-shadow-base: 0 3px 6px -4px rgb(0 0 0 / 12%), 0 6px 16px 0 rgb(0 0 0 / 8%),
+      0 9px 28px 8px rgb(0 0 0 / 5%);
+    --font-family: -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Helvetica Neue',
+      'Arial', 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
+      'Noto Color Emoji', 'Helvetica', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans';
+    --transition-duration: 0.3s;
+    --transition-timing-function: cubic-bezier(0.94, -0.1, 0.1, 1.2);
     ${getColorVariableString("#5794ff",{name:"primary"})}
     ${getColorVariableString("#faad14",{name:"warning"})}
     ${getColorVariableString("#ff4d4f",{name:"error"})}
     ${getColorVariableString("#52c41a",{name:"success"})}
   }
+
   :root[data-theme='dark'] {
+    --text-color: #ffffffd9;
+    --text-secondary: #cdcdcd;
+    --text-heading: rgb(255 255 255 / 85%);
+    --text-shadow-color: rgb(255 255 255 / 10%);
+    --body-background: #000;
+    --component-background: rgb(20 20 20 / 80%);
+    --header-bg: rgb(20 20 20 / 90%);
+    --border-color: #303030;
     ${getColorVariableString("#4d81dc",{name:"primary",theme:"dark"})}
     ${getColorVariableString("#bb8314",{name:"warning",theme:"dark"})}
     ${getColorVariableString("#901c22",{name:"error",theme:"dark"})}
     ${getColorVariableString("#419418",{name:"success",theme:"dark"})}
-  }`]);
+  }
+`;

package/es/input/index.js

@@ -9,12 +9,12 @@ function _extends(){_extends=Object.assign||function(target){for(var i=1;i<argum
 `;const wrapperCss=css`
   display: flex;
   border: var(--border-base);
-  border-radius: var(--border-radius, 8px);
+  border-radius: var(--border-radius);
   padding: 4px 10px;
   inline-size: 100%;
-  font-size: var(--font-size, 14px);
-  color: var(--text-color, rgb(0 0 0 / 65%));
-  background-color: var(--component-background, rgb(255 255 255 / 80%));
+  font-size: var(--font-size);
+  color: var(--text-color);
+  background-color: var(--component-background);
   transition: all 0.3s;
   line-height: 1.5715;
   background-image: none;
@@ -22,7 +22,7 @@ function _extends(){_extends=Object.assign||function(target){for(var i=1;i<argum
   accent-color: var(--primary-color, #5794ff);
 
   &:hover {
-    border-color: var(--primary-color-hover, #80b3ff);
+    border-color: var(--primary-hover, #80b3ff);
     border-inline-end-width: 1px;
   }
 
@@ -30,12 +30,12 @@ function _extends(){_extends=Object.assign||function(target){for(var i=1;i<argum
     background: none;
   }
 `;const focusCss=css`
-  border-color: var(--primary-color-hover, #80b3ff);
+  border-color: var(--primary-hover, #80b3ff);
   border-inline-end-width: 1px;
   outline: 0;
   box-shadow: 0 0 0 2px rgb(45 115 255 / 20%);
 `;const disabledCss=css`
-  border-color: var(--border-color, #d9d9d9);
+  border-color: var(--border-color);
   background: var(--disabled-bg, #f5f5f5);
   cursor: not-allowed;
 `;const prefixCss=css`
@@ -44,7 +44,7 @@ function _extends(){_extends=Object.assign||function(target){for(var i=1;i<argum
   margin-inline-start: 4px;
 `;const sizeCss={small:css`
     padding: 2px;
-    font-size: var(--font-size-sm, 12px);
+    font-size: var(--font-size-sm);
     line-height: 20px;
 
     input {
@@ -52,5 +52,5 @@ function _extends(){_extends=Object.assign||function(target){for(var i=1;i<argum
     }
   `,large:css`
     padding: 6px 16px;
-    font-size: var(--font-size-lg, 16px);
+    font-size: var(--font-size-lg);
   `,normal:null};const Input=_param=>{var{className,suffix,prefix,value,size,type="text",disabled,formatter,parser,onChange,onFocus,onBlur,autoComplete="off"}=_param,prpos=_objectWithoutProperties(_param,["className","suffix","prefix","value","size","type","disabled","formatter","parser","onChange","onFocus","onBlur","autoComplete"]);const[focus,setFocus]=useState(false);const getValue=useCallback(val=>{return formatter?formatter===null||formatter===void 0?void 0:formatter(val):val},[formatter]);const parserValue=useCallback(val=>{if(parser){return parser(val)}else if(type==="number"&&typeof val==="string"){const num=val.replace(/[^\d]/g,"");return num.length?parseFloat(num):undefined}return val},[parser,type]);const handleChange=useCallback(e=>{onChange===null||onChange===void 0?void 0:onChange(parserValue(e.target.value))},[onChange,parserValue]);const handleFocus=useCallback(e=>{setFocus(true);onFocus===null||onFocus===void 0?void 0:onFocus(e)},[onFocus]);const handleBlur=useCallback(e=>{setFocus(false);onBlur===null||onBlur===void 0?void 0:onBlur(e)},[onBlur]);return React.createElement("span",{className:cx(wrapperCss,size&&sizeCss[size],disabled&&disabledCss,focus&&focusCss,className)},prefix?React.createElement("span",{className:prefixCss},prefix):null,React.createElement("input",_extends({value:getValue(value),className:inputCss,autoComplete:autoComplete,type:"text",disabled:disabled,onFocus:handleFocus,onBlur:handleBlur,onChange:handleChange},prpos)),suffix?React.createElement("span",{className:suffixCss},suffix):null)};export default Input;

package/es/markdown/index.css

@@ -37,27 +37,27 @@
   display: inline-block;
   margin: auto;
   border: 1px solid;
-  border-radius: var(--border-radius, 8px);
+  border-radius: var(--border-radius);
   padding: 4px 8px;
   inline-size: fit-content;
-  font-size: var(--font-size-sm, 12px);
+  font-size: var(--font-size-sm);
   transition: background-color .2s, color .2s, border-color .2s;
   animation-fill-mode: forwards;
   content: '\590d\5236\6210\529f';
 }
 
 [data-copy='success']::before {
-  border-color: var(--success-color-border, #b7eb8f);
+  border-color: var(--success-border, #b7eb8f);
   color: var(--success-color, #52c41a);
-  background-color: var(--success-color-bg, #f6ffed);
+  background-color: var(--success-bg, #f6ffed);
   animation: copy-slide-in .3s ease-in-out;
   content: '\590d\5236\6210\529f';
 }
 
 [data-copy='failure']::before {
-  border-color: var(--error-color-border, #ffccc7);
+  border-color: var(--error-border, #ffccc7);
   color: var(--error-color, #ff4d4f);
-  background-color: var(--error-color-bg, #fff2f0);
+  background-color: var(--error-bg, #fff2f0);
   animation: copy-slide-in .3s ease-in-out, error 1s ease-in-out 1s;
   content: '\590d\5236\5931\8d25';
 }
@@ -102,10 +102,10 @@
 .n-md-body {
   overflow: hidden;
   margin: 0 auto 1.5rem;
-  border-radius: var(--border-radius, 8px);
+  border-radius: var(--border-radius);
   padding: 1.5rem;
   max-inline-size: 80rem;
-  background-color: var(--component-background, rgb(255 255 255 / 80%));
+  background-color: var(--component-background);
   box-sizing: border-box;
   overflow-wrap: break-word;
   transition-duration: var(--transition-duration);
@@ -118,7 +118,7 @@
 .n-md-body a {
   position: relative;
   text-decoration: none;
-  color: var(--text-color, rgb(0 0 0 / 65%));
+  color: var(--text-color);
 }
 
 .n-md-toc,
@@ -134,7 +134,7 @@
   display: block;
   overflow-y: auto;
   margin: 0;
-  border-radius: var(--border-radius, 8px);
+  border-radius: var(--border-radius);
   padding: 16px;
   max-inline-size: 200px;
   block-size: fit-content;
@@ -158,11 +158,11 @@
 .n-md-toc li a {
   overflow: hidden;
   max-inline-size: 100%;
-  font-size: var(--font-size-sm, 12px);
+  font-size: var(--font-size-sm);
   text-overflow: ellipsis;
   text-decoration: none;
   white-space: nowrap;
-  color: var(--text-color, rgb(0 0 0 / 65%));
+  color: var(--text-color);
   transition-duration: var(--transition-duration);
   transition-timing-function: var(--transition-timing-function);
   transition-property: color;
@@ -180,7 +180,7 @@
   inset-inline-start: 0;
   inline-size: 100%;
   block-size: 2px;
-  background-color: var(--primary-color-hover, #80b3ff);
+  background-color: var(--primary-hover, #80b3ff);
   transform: scaleX(0);
   transform-origin: center;
   transition-duration: var(--transition-duration);
@@ -190,11 +190,11 @@
 }
 
 .n-md-body a:visited {
-  color: var(--text-secondary, #4e4e4e);
+  color: var(--text-secondary);
 }
 
 .n-md-body a:hover {
-  color: var(--primary-color-hover, #80b3ff);
+  color: var(--primary-hover, #80b3ff);
 }
 
 .n-md-body a:hover::after {
@@ -251,7 +251,7 @@ h6[data-prefix]::before {
 .n-md-body td > code,
 .n-md-body mark,
 .n-md-body code:not([class]) {
-  border-radius: var(--border-radius, 8px);
+  border-radius: var(--border-radius);
   padding: 2px 7px;
   font-size: 90%;
   color: var(--md-mark-color, #cd9278);
@@ -269,7 +269,7 @@ h6[data-prefix]::before {
   margin-block-start: 1em;
   margin-block-end: 1em;
   font-weight: 500;
-  color: var(--text-heading, #1b1b1b);
+  color: var(--text-heading);
   transition-duration: var(--transition-duration);
   transition-timing-function: var(--transition-timing-function);
   transition-property: border-color, background-color, box-shadow, color;
@@ -309,7 +309,7 @@ blockquote p {
 
 .n-md-body h1,
 .n-md-body h2 {
-  border-block-end: 1px dotted var(--border-color, #d9d9d9);
+  border-block-end: 1px dotted var(--border-color);
   padding-block-end: 10px;
 }
 
@@ -335,7 +335,7 @@ blockquote p {
   block-size: 2px;
   text-align: start;
   color: var(--text-color);
-  background-color: var(--border-color, #d9d9d9);
+  background-color: var(--border-color);
 }
 
 .n-md-body p {
@@ -351,7 +351,7 @@ blockquote p {
   position: relative;
   display: block;
   margin: auto;
-  border-radius: var(--border-radius, 8px);
+  border-radius: var(--border-radius);
   max-inline-size: 100%;
   cursor: pointer;
 }
@@ -359,7 +359,7 @@ blockquote p {
 .n-md-body p,
 .n-md-body ul,
 .n-md-body ol {
-  font-size: var(--font-size, 14px);
+  font-size: var(--font-size);
 }
 
 .n-md-body dl {
@@ -382,8 +382,8 @@ blockquote p {
 
 .n-md-body table {
   overflow: hidden;
-  border-block-end: 1px solid var(--border-color, #d9d9d9);
-  border-radius: var(--border-radius, 8px);
+  border-block-end: 1px solid var(--border-color);
+  border-radius: var(--border-radius);
   inline-size: 100%;
   max-inline-size: 100%;
   border-spacing: 0;
@@ -397,25 +397,25 @@ blockquote p {
 
 .n-md-body table tr[role='row'] th[role='gridcell'] {
   padding: 10px;
-  color: var(--text-heading, #1b1b1b);
-  background-color: var(--border-color, #d9d9d9);
+  color: var(--text-heading);
+  background-color: var(--border-color);
   transition-property: background-color, color;
 }
 
 .n-md-body table td[role='gridcell'] {
   border-style: dotted;
   border-width: 0 0 1px 1px;
-  border-color: var(--border-color, #d9d9d9);
+  border-color: var(--border-color);
   padding: 10px;
   transition-property: border-color;
 }
 
 .n-md-body table td[role='gridcell']:first-of-type {
-  border-inline-start: 1px solid var(--border-color, #d9d9d9);
+  border-inline-start: 1px solid var(--border-color);
 }
 
 .n-md-body table td[role='gridcell']:last-of-type {
-  border-inline-end: 1px solid var(--border-color, #d9d9d9);
+  border-inline-end: 1px solid var(--border-color);
 }
 
 .n-md-body table tr[role='row']:last-of-type td[role='gridcell'] {
@@ -425,7 +425,7 @@ blockquote p {
 .n-md-body blockquote {
   position: relative;
   margin: 30px 54px;
-  border-radius: var(--border-radius, 8px);
+  border-radius: var(--border-radius);
   padding: 16px;
   font-weight: 500;
   background-color: var(--blockquote-bg, #ecf8ff);
@@ -480,7 +480,7 @@ blockquote p {
 }
 
 .n-md-body blockquote cite {
-  font-size: var(--font-size, 14px);
+  font-size: var(--font-size);
   color: var(--cite-color, #bfbfbf);
   line-height: 20px;
 }
@@ -491,7 +491,7 @@ blockquote p {
 
 .n-md-body blockquote p {
   margin: auto 0;
-  font-size: var(--font-size, 14px);
+  font-size: var(--font-size);
   color: var(--blockquote-color, #5e6d82);
   line-height: 24px;
   transition-property: color;
@@ -499,8 +499,8 @@ blockquote p {
 
 .n-md-body details {
   overflow: hidden;
-  border-inline-start: 5px solid var(--primary-color-border, #5794ff);
-  border-radius: var(--border-radius, 8px);
+  border-inline-start: 5px solid var(--primary-border, #5794ff);
+  border-radius: var(--border-radius);
   padding: 12px 24px;
   background: var(--details-bg, #fafaff);
   box-sizing: border-box;
@@ -521,7 +521,7 @@ blockquote p {
 
 .n-md-body details >summary,
 .n-md-body details >summary ~ * {
-  font-size: var(--font-size, 14px);
+  font-size: var(--font-size);
   font-weight: normal;
   font-style: normal;
   line-height: 1.4;
@@ -549,7 +549,7 @@ blockquote p {
   display: inline-block;
   margin-inline-end: 4px;
   inline-size: 14px;
-  font-size: var(--font-size-sm, 12px);
+  font-size: var(--font-size-sm);
   font-family: neko-icon, sans-serif;
   font-weight: lighter;
   text-align: center;

package/es/photo/index.js

@@ -1 +1 @@
-function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};return _extends.apply(this,arguments)}import React,{useCallback,useEffect,useMemo,useRef}from"react";import sso from"shared-store-object";import{cls}from"./style";import Carousel from"../carousel";import{cx}from"../emotion";import Portal from"../portal";function Photo(props){const photo=useRef(sso({open:props.open,onOpenChange(){var _props_onOpenChange;(_props_onOpenChange=props.onOpenChange)===null||_props_onOpenChange===void 0?void 0:_props_onOpenChange.call(props,!photo.current.open)}}));const{open}=photo.current;const handleDestroy=useCallback(()=>{if(props.open===false){photo.current.open=false}},[props.open]);const renderDom=useMemo(()=>React.createElement(Carousel,_extends({},props,{className:cx(cls.photo,props.className)}),props.data.map(item=>{return React.createElement("div",{className:cls.item,key:item.key,style:{"--img":`url(${item.src})`}},React.createElement("img",{className:cls.img,src:item.src,alt:item.alt}))})),[props]);const render=useMemo(()=>{if(typeof open==="boolean"){return open?React.createElement(Portal,{container:document.body},React.createElement("div",{className:cx(cls.portal,props.open===false?cls.closeing:props.open?cls.open:""),onAnimationEnd:handleDestroy},renderDom,React.createElement("span",{className:cx("neko-icon",cls.close),onClick:photo.current.onOpenChange}))):null}return renderDom},[handleDestroy,open,props.open,renderDom]);useEffect(()=>{if(props.open===true){photo.current.open=true}},[props.open]);useEffect(()=>{const _photo=photo.current;return()=>{_photo()}},[]);return render}export default Photo;
+function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};return _extends.apply(this,arguments)}import React,{useCallback,useEffect,useMemo,useRef}from"react";import sso from"shared-store-object";import{cls}from"./style";import Carousel from"../carousel";import{cx}from"../emotion";import Portal from"../portal";function Photo(props){const photo=useRef(sso({open:props.open,onOpenChange(){var _props_onOpenChange;(_props_onOpenChange=props.onOpenChange)===null||_props_onOpenChange===void 0?void 0:_props_onOpenChange.call(props,!photo.current.open)}}));const{open}=photo.current;const handleDestroy=useCallback(()=>{if(props.open===false){photo.current.open=false}},[props.open]);const renderDom=useMemo(()=>React.createElement(Carousel,_extends({},props,{className:cx(cls.photo,props.className)}),props.data.map(item=>{return React.createElement("div",{className:cls.item,key:item.key,style:{"--img":`url(${item.src})`}},React.createElement("img",{className:cls.img,src:item.src,alt:item.alt,onDragStart:()=>false}))})),[props]);const render=useMemo(()=>{if(typeof open==="boolean"){return open?React.createElement(Portal,{container:document.body},React.createElement("div",{className:cx(cls.portal,props.open===false?cls.closeing:props.open?cls.open:""),onAnimationEnd:handleDestroy},renderDom,React.createElement("span",{className:cx("neko-icon",cls.close),onClick:photo.current.onOpenChange}))):null}return renderDom},[handleDestroy,open,props.open,renderDom]);useEffect(()=>{if(props.open===true){photo.current.open=true}},[props.open]);useEffect(()=>{const _photo=photo.current;return()=>{_photo()}},[]);return render}export default Photo;

package/es/photo/style.js

@@ -13,6 +13,7 @@ import{injectGlobal}from"../emotion";import prefixCls from"../prefix-cls";export
     object-fit: contain;
     content-visibility: auto;
     backdrop-filter: blur(16px);
+    border-radius: 8px;
   }
 
   .${cls.close} {