@ioca/react 1.3.3 → 1.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/button/button.js +1 -1
- package/lib/components/button/button.js.map +1 -1
- package/lib/components/checkbox/checkbox.js +1 -1
- package/lib/components/checkbox/checkbox.js.map +1 -1
- package/lib/components/datagrid/datagrid.js +1 -1
- package/lib/components/datagrid/datagrid.js.map +1 -1
- package/lib/components/datagrid/resize.js +1 -1
- package/lib/components/datagrid/resize.js.map +1 -1
- package/lib/components/drawer/drawer.js +1 -1
- package/lib/components/drawer/drawer.js.map +1 -1
- package/lib/components/image/image.js +1 -1
- package/lib/components/image/image.js.map +1 -1
- package/lib/components/image/list.js +1 -1
- package/lib/components/image/list.js.map +1 -1
- package/lib/components/input/number.js +1 -1
- package/lib/components/input/number.js.map +1 -1
- package/lib/components/input/range.js +1 -1
- package/lib/components/input/range.js.map +1 -1
- package/lib/components/modal/hookModal.js.map +1 -1
- package/lib/components/modal/modal.js +1 -1
- package/lib/components/modal/modal.js.map +1 -1
- package/lib/components/modal/useModal.js +1 -1
- package/lib/components/modal/useModal.js.map +1 -1
- package/lib/components/picker/colors/index.js +1 -1
- package/lib/components/picker/colors/index.js.map +1 -1
- package/lib/components/popup/popup.js +1 -1
- package/lib/components/popup/popup.js.map +1 -1
- package/lib/components/progress/progress.js +1 -1
- package/lib/components/progress/progress.js.map +1 -1
- package/lib/components/radio/radio.js +1 -1
- package/lib/components/radio/radio.js.map +1 -1
- package/lib/components/resizable/resizable.js +1 -1
- package/lib/components/resizable/resizable.js.map +1 -1
- package/lib/components/swiper/swiper.js +1 -1
- package/lib/components/swiper/swiper.js.map +1 -1
- package/lib/components/tabs/tabs.js +1 -1
- package/lib/components/tabs/tabs.js.map +1 -1
- package/lib/components/text/number.js +1 -1
- package/lib/components/text/number.js.map +1 -1
- package/lib/components/text/time.js +1 -1
- package/lib/components/text/time.js.map +1 -1
- package/lib/components/upload/renderFile.js +1 -1
- package/lib/components/upload/renderFile.js.map +1 -1
- package/lib/components/upload/upload.js +1 -1
- package/lib/components/upload/upload.js.map +1 -1
- package/lib/components/video/video.js +1 -1
- package/lib/components/video/video.js.map +1 -1
- package/lib/css/index.css +1 -1
- package/lib/css/index.css.map +1 -1
- package/lib/js/usePreview/index.js +1 -1
- package/lib/js/usePreview/index.js.map +1 -1
- package/lib/js/usePreview/type.js.map +1 -1
- package/lib/js/utils.js +1 -1
- package/lib/js/utils.js.map +1 -1
- package/lib/types/components/affix/affix.d.ts +2 -0
- package/lib/types/components/affix/index.d.ts +2 -0
- package/lib/types/components/affix/totop.d.ts +2 -0
- package/lib/types/components/affix/type.d.ts +2 -0
- package/lib/types/components/badge/badge.d.ts +2 -0
- package/lib/types/components/badge/index.d.ts +2 -0
- package/lib/types/components/badge/type.d.ts +2 -0
- package/lib/types/components/button/button.d.ts +2 -0
- package/lib/types/components/button/group.d.ts +2 -0
- package/lib/types/components/button/index.d.ts +2 -0
- package/lib/types/components/button/toggle.d.ts +2 -0
- package/lib/types/components/button/type.d.ts +2 -0
- package/lib/types/components/card/card.d.ts +2 -0
- package/lib/types/components/card/index.d.ts +2 -0
- package/lib/types/components/card/type.d.ts +2 -0
- package/lib/types/components/checkbox/checkbox.d.ts +2 -0
- package/lib/types/components/checkbox/index.d.ts +2 -0
- package/lib/types/components/checkbox/item.d.ts +2 -0
- package/lib/types/components/checkbox/type.d.ts +2 -0
- package/lib/types/components/collapse/collapse.d.ts +2 -0
- package/lib/types/components/collapse/index.d.ts +2 -0
- package/lib/types/components/collapse/item.d.ts +2 -0
- package/lib/types/components/collapse/type.d.ts +2 -0
- package/lib/types/components/datagrid/datagrid.d.ts +2 -0
- package/lib/types/components/datagrid/index.d.ts +2 -0
- package/lib/types/components/datagrid/type.d.ts +2 -0
- package/lib/types/components/description/description.d.ts +2 -0
- package/lib/types/components/description/index.d.ts +2 -0
- package/lib/types/components/description/type.d.ts +2 -0
- package/lib/types/components/drawer/drawer.d.ts +2 -0
- package/lib/types/components/drawer/index.d.ts +2 -0
- package/lib/types/components/drawer/type.d.ts +2 -0
- package/lib/types/components/dropdown/dropdown.d.ts +2 -0
- package/lib/types/components/dropdown/index.d.ts +2 -0
- package/lib/types/components/dropdown/type.d.ts +2 -0
- package/lib/types/components/editor/editor.d.ts +2 -0
- package/lib/types/components/editor/index.d.ts +2 -0
- package/lib/types/components/editor/type.d.ts +2 -0
- package/lib/types/components/flex/flex.d.ts +2 -0
- package/lib/types/components/flex/index.d.ts +2 -0
- package/lib/types/components/flex/type.d.ts +2 -0
- package/lib/types/components/form/field.d.ts +2 -0
- package/lib/types/components/form/form.d.ts +2 -0
- package/lib/types/components/form/index.d.ts +2 -0
- package/lib/types/components/form/type.d.ts +2 -0
- package/lib/types/components/form/useForm.d.ts +2 -0
- package/lib/types/components/icon/icon.d.ts +2 -0
- package/lib/types/components/icon/index.d.ts +2 -0
- package/lib/types/components/icon/type.d.ts +2 -0
- package/lib/types/components/image/image.d.ts +2 -0
- package/lib/types/components/image/index.d.ts +2 -0
- package/lib/types/components/image/list.d.ts +2 -0
- package/lib/types/components/image/type.d.ts +2 -0
- package/lib/types/components/input/index.d.ts +2 -0
- package/lib/types/components/input/input.d.ts +2 -0
- package/lib/types/components/input/number.d.ts +2 -0
- package/lib/types/components/input/range.d.ts +2 -0
- package/lib/types/components/input/textarea.d.ts +2 -0
- package/lib/types/components/input/type.d.ts +2 -0
- package/lib/types/components/list/index.d.ts +2 -0
- package/lib/types/components/list/list.d.ts +2 -0
- package/lib/types/components/list/type.d.ts +2 -0
- package/lib/types/components/loading/index.d.ts +2 -0
- package/lib/types/components/loading/loading.d.ts +2 -0
- package/lib/types/components/loading/type.d.ts +2 -0
- package/lib/types/components/message/index.d.ts +2 -0
- package/lib/types/components/message/message.d.ts +2 -0
- package/lib/types/components/message/type.d.ts +2 -0
- package/lib/types/components/modal/index.d.ts +2 -0
- package/lib/types/components/modal/modal.d.ts +2 -0
- package/lib/types/components/modal/type.d.ts +2 -0
- package/lib/types/components/modal/useModal.d.ts +2 -0
- package/lib/types/components/pagination/index.d.ts +2 -0
- package/lib/types/components/pagination/pagination.d.ts +2 -0
- package/lib/types/components/pagination/type.d.ts +2 -0
- package/lib/types/components/picker/colors/index.d.ts +2 -0
- package/lib/types/components/picker/dates/index.d.ts +2 -0
- package/lib/types/components/picker/time/index.d.ts +2 -0
- package/lib/types/components/picker/type.d.ts +2 -0
- package/lib/types/components/popconfirm/index.d.ts +2 -0
- package/lib/types/components/popconfirm/popconfirm.d.ts +2 -0
- package/lib/types/components/popconfirm/type.d.ts +2 -0
- package/lib/types/components/popup/index.d.ts +2 -0
- package/lib/types/components/popup/popup.d.ts +2 -0
- package/lib/types/components/popup/type.d.ts +2 -0
- package/lib/types/components/progress/index.d.ts +2 -0
- package/lib/types/components/progress/progress.d.ts +2 -0
- package/lib/types/components/progress/type.d.ts +2 -0
- package/lib/types/components/radio/index.d.ts +2 -0
- package/lib/types/components/radio/item.d.ts +2 -0
- package/lib/types/components/radio/radio.d.ts +2 -0
- package/lib/types/components/radio/type.d.ts +2 -0
- package/lib/types/components/resizable/index.d.ts +2 -0
- package/lib/types/components/resizable/resizable.d.ts +2 -0
- package/lib/types/components/resizable/type.d.ts +2 -0
- package/lib/types/components/select/index.d.ts +2 -0
- package/lib/types/components/select/select.d.ts +2 -0
- package/lib/types/components/select/type.d.ts +2 -0
- package/lib/types/components/step/index.d.ts +2 -0
- package/lib/types/components/step/item.d.ts +2 -0
- package/lib/types/components/step/step.d.ts +2 -0
- package/lib/types/components/step/type.d.ts +2 -0
- package/lib/types/components/swiper/index.d.ts +2 -0
- package/lib/types/components/swiper/item.d.ts +2 -0
- package/lib/types/components/swiper/swiper.d.ts +2 -0
- package/lib/types/components/swiper/type.d.ts +2 -0
- package/lib/types/components/tabs/index.d.ts +2 -0
- package/lib/types/components/tabs/item.d.ts +2 -0
- package/lib/types/components/tabs/tabs.d.ts +2 -0
- package/lib/types/components/tabs/type.d.ts +2 -0
- package/lib/types/components/tag/index.d.ts +2 -0
- package/lib/types/components/tag/tag.d.ts +2 -0
- package/lib/types/components/tag/type.d.ts +2 -0
- package/lib/types/components/text/highlight.d.ts +2 -0
- package/lib/types/components/text/index.d.ts +2 -0
- package/lib/types/components/text/number.d.ts +2 -0
- package/lib/types/components/text/text.d.ts +2 -0
- package/lib/types/components/text/time.d.ts +2 -0
- package/lib/types/components/text/type.d.ts +2 -0
- package/lib/types/components/tree/index.d.ts +2 -0
- package/lib/types/components/tree/tree.d.ts +2 -0
- package/lib/types/components/tree/type.d.ts +2 -0
- package/lib/types/components/upload/index.d.ts +2 -0
- package/lib/types/components/upload/type.d.ts +2 -0
- package/lib/types/components/upload/upload.d.ts +2 -0
- package/lib/types/components/video/index.d.ts +2 -0
- package/lib/types/components/video/type.d.ts +2 -0
- package/lib/types/components/video/video.d.ts +2 -0
- package/lib/types/index.d.ts +2 -0
- package/lib/types/js/usePreview/index.d.ts +2 -0
- package/lib/types/js/usePreview/type.d.ts +4 -11
- package/lib/types/type/index.d.ts +2 -0
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as n,Fragment as e}from"react/jsx-runtime";import o from"
|
|
1
|
+
import{jsx as n,Fragment as e}from"react/jsx-runtime";import o from"classnames";import{createElement as a,useEffect as i}from"react";import t from"../../js/useRipple/index.js";import r from"../loading/loading.js";const s=({outline:n,flat:e,loading:a,disabled:i,size:t="normal",block:r,round:s,square:l,secondary:d,className:c})=>o("i-btn",c,{"i-btn-outline":n,"i-btn-flat":e,"i-btn-block":r,"i-btn-loading":a,"i-btn-square":l,"i-btn-secondary":d,[`i-btn-${t}`]:"normal"!==t,round:s,disabled:i}),l=o=>{const{as:l="a",ref:d,children:c,className:m,loading:f,flat:p,outline:u,square:b,secondary:g,size:k,round:y,href:j,ripple:N=!0,onClick:h,...q}=o;if(!c)return n(e,{});const v=[f&&n(r,{},"loading"),a("span",{key:"content",className:"i-btn-content"},c)],x={className:s(o),"data-ripple":!N||f||q.disabled?void 0:"",onClick:n=>{if(f||q.disabled)return n.stopPropagation(),void n.preventDefault();h?.(n)}};return i((()=>{N&&t()}),[N]),a(l,"string"==typeof l?{ref:d,href:j,...x,...q}:{to:j||"",...x,...q},v)};export{l as default};
|
|
2
2
|
//# sourceMappingURL=button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sources":["../../../packages/components/button/button.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"button.js","sources":["../../../packages/components/button/button.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { MouseEvent, createElement, useEffect } from \"react\";\nimport useRipple from \"../../js/useRipple\";\nimport Loading from \"../loading\";\nimport \"./index.css\";\nimport { CompositionButton, IButton } from \"./type\";\n\nconst formatClass = ({\n\toutline,\n\tflat,\n\tloading,\n\tdisabled,\n\tsize = \"normal\",\n\tblock,\n\tround,\n\tsquare,\n\tsecondary,\n\tclassName,\n}: IButton) =>\n\tclassnames(\"i-btn\", className, {\n\t\t\"i-btn-outline\": outline,\n\t\t\"i-btn-flat\": flat,\n\t\t\"i-btn-block\": block,\n\t\t\"i-btn-loading\": loading,\n\t\t\"i-btn-square\": square,\n\t\t\"i-btn-secondary\": secondary,\n\t\t[`i-btn-${size}`]: size !== \"normal\",\n\t\tround,\n\t\tdisabled,\n\t});\n\nconst Button = (props: IButton) => {\n\tconst {\n\t\tas: As = \"a\",\n\t\tref,\n\t\tchildren,\n\t\tclassName,\n\t\tloading,\n\t\tflat,\n\t\toutline,\n\t\tsquare,\n\t\tsecondary,\n\t\tsize,\n\t\tround,\n\t\thref,\n\t\tripple = true,\n\t\tonClick,\n\t\t...restProps\n\t} = props;\n\n\tconst handleClick = (e: MouseEvent<HTMLElement>) => {\n\t\tif (loading || restProps.disabled) {\n\t\t\te.stopPropagation();\n\t\t\te.preventDefault();\n\t\t\treturn;\n\t\t}\n\n\t\tonClick?.(e);\n\t};\n\n\tif (!children) return <></>;\n\n\tconst childNodes = [\n\t\tloading && <Loading key='loading' />,\n\t\tcreateElement(\n\t\t\t\"span\",\n\t\t\t{ key: \"content\", className: \"i-btn-content\" },\n\t\t\tchildren\n\t\t),\n\t];\n\n\tconst attrs = {\n\t\tclassName: formatClass(props),\n\t\t[\"data-ripple\"]:\n\t\t\tripple && !loading && !restProps.disabled ? \"\" : undefined,\n\t\tonClick: handleClick,\n\t};\n\n\tuseEffect(() => {\n\t\tripple && useRipple();\n\t}, [ripple]);\n\n\tif (typeof As === \"string\") {\n\t\treturn createElement(\n\t\t\tAs,\n\t\t\t{\n\t\t\t\tref,\n\t\t\t\thref,\n\t\t\t\t...attrs,\n\t\t\t\t...restProps,\n\t\t\t},\n\t\t\tchildNodes\n\t\t);\n\t}\n\n\treturn createElement(\n\t\tAs,\n\t\t{\n\t\t\tto: href || \"\",\n\t\t\t...attrs,\n\t\t\t...restProps,\n\t\t},\n\t\tchildNodes\n\t);\n};\n\nexport default Button as CompositionButton;\n"],"names":["formatClass","outline","flat","loading","disabled","size","block","round","square","secondary","className","classnames","Button","props","as","As","ref","children","href","ripple","onClick","restProps","_jsx","childNodes","Loading","createElement","key","attrs","undefined","e","stopPropagation","preventDefault","useEffect","useRipple","to"],"mappings":"qNAOA,MAAMA,EAAc,EACnBC,UACAC,OACAC,UACAC,WACAC,OAAO,SACPC,QACAC,QACAC,SACAC,YACAC,eAEAC,EAAW,QAASD,EAAW,CAC9B,gBAAiBT,EACjB,aAAcC,EACd,cAAeI,EACf,gBAAiBH,EACjB,eAAgBK,EAChB,kBAAmBC,EACnB,CAAC,SAASJ,KAAkB,WAATA,EACnBE,QACAH,aAGIQ,EAAUC,IACf,MACCC,GAAIC,EAAK,IAAGC,IACZA,EAAGC,SACHA,EAAQP,UACRA,EAASP,QACTA,EAAOD,KACPA,EAAID,QACJA,EAAOO,OACPA,EAAMC,UACNA,EAASJ,KACTA,EAAIE,MACJA,EAAKW,KACLA,EAAIC,OACJA,GAAS,EAAIC,QACbA,KACGC,GACAR,EAYJ,IAAKI,EAAU,OAAOK,QAEtB,MAAMC,EAAa,CAClBpB,GAAWmB,EAACE,EAAO,CAAA,EAAK,WACxBC,EACC,OACA,CAAEC,IAAK,UAAWhB,UAAW,iBAC7BO,IAIIU,EAAQ,CACbjB,UAAWV,EAAYa,GACvB,eACCM,GAAWhB,GAAYkB,EAAUjB,cAAgBwB,EAAL,GAC7CR,QAzBoBS,IACpB,GAAI1B,GAAWkB,EAAUjB,SAGxB,OAFAyB,EAAEC,uBACFD,EAAEE,iBAIHX,IAAUS,EAAE,GAyBb,OAJAG,GAAU,KACTb,GAAUc,GAAW,GACnB,CAACd,IAGIM,EACNV,EAFgB,iBAAPA,EAGT,CACCC,MACAE,UACGS,KACAN,GAQL,CACCa,GAAIhB,GAAQ,MACTS,KACAN,GATHE,EAYD"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as e,jsx as a}from"react/jsx-runtime";import{
|
|
1
|
+
import{jsxs as e,jsx as a}from"react/jsx-runtime";import{useReactive as l}from"ahooks";import i from"classnames";import{useMemo as n,useEffect as o}from"react";import{formatOption as s}from"../../js/utils.js";import t from"./item.js";function r(r){const{label:c,name:m,options:u=[],value:p="",type:d="default",optionInline:b=!0,labelInline:h,disabled:v,status:f="normal",message:x,required:k,className:N,renderItem:I,onChange:g,...j}=r,y=l({value:p}),C=n((()=>s(u)),[u]);return o((()=>{y.value=p}),[p]),e("div",{className:i("i-checkbox i-input-label",{[`i-checkbox-${f}`]:"normal"!==f,"i-input-inline":h},N),...j,children:[c&&e("span",{className:"i-input-label-text",children:[k&&a("span",{className:"error",children:"*"}),c,x&&a("p",{className:"i-checkbox-message",children:x})]}),a("div",{className:i("i-checkbox-options",{"i-options-block":!b,"i-checkbox-options-button":"button"===d}),children:C.map((e=>a(t,{name:m,value:y.value.includes(e.value),optionValue:e.value,type:d,disabled:v||e.disabled,onChange:(a,l)=>((e,a,l)=>{const i=[...y.value],n=i.findIndex((e=>e===a.value));e&&n<0?i.push(a.value):!e&&n>-1&&i.splice(n,1),y.value=i,g?.(i,a,l)})(a,e,l),children:I??e.label},e.value)))})]})}r.Item=t;export{r as default};
|
|
2
2
|
//# sourceMappingURL=checkbox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sources":["../../../packages/components/checkbox/checkbox.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"checkbox.js","sources":["../../../packages/components/checkbox/checkbox.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { useEffect, useMemo } from \"react\";\nimport \"../../css/input.css\";\nimport { formatOption } from \"../../js/utils\";\nimport \"./index.css\";\nimport CheckboxItem from \"./item\";\nimport type { ICheckbox } from \"./type\";\n\nfunction Checkbox(props: ICheckbox) {\n\tconst {\n\t\tlabel,\n\t\tname,\n\t\toptions = [],\n\t\tvalue = \"\",\n\t\ttype = \"default\",\n\t\toptionInline = true,\n\t\tlabelInline,\n\t\tdisabled,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\trequired,\n\t\tclassName,\n\t\trenderItem,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive<{\n\t\tvalue: any;\n\t}>({\n\t\tvalue,\n\t});\n\n\tconst formattedOptions = useMemo(() => formatOption(options), [options]);\n\n\tconst handleChange = (checked, opt, e) => {\n\t\tconst group = [...state.value];\n\t\tconst i = group.findIndex((item) => item === opt.value);\n\n\t\tif (checked && i < 0) {\n\t\t\tgroup.push(opt.value);\n\t\t} else if (!checked && i > -1) {\n\t\t\tgroup.splice(i, 1);\n\t\t}\n\n\t\tstate.value = group;\n\t\tonChange?.(group, opt, e);\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-checkbox i-input-label\",\n\t\t\t\t{\n\t\t\t\t\t[`i-checkbox-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-inline\": labelInline,\n\t\t\t\t},\n\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...restProps}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<span className='i-input-label-text'>\n\t\t\t\t\t{required && <span className='error'>*</span>}\n\t\t\t\t\t{label}\n\n\t\t\t\t\t{message && <p className='i-checkbox-message'>{message}</p>}\n\t\t\t\t</span>\n\t\t\t)}\n\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-checkbox-options\", {\n\t\t\t\t\t\"i-options-block\": !optionInline,\n\t\t\t\t\t\"i-checkbox-options-button\": type === \"button\",\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{formattedOptions.map((option) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<CheckboxItem\n\t\t\t\t\t\t\tkey={option.value as string}\n\t\t\t\t\t\t\tname={name}\n\t\t\t\t\t\t\tvalue={state.value.includes(option.value)}\n\t\t\t\t\t\t\toptionValue={option.value}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t\tdisabled={disabled || option.disabled}\n\t\t\t\t\t\t\tonChange={(checked, e) =>\n\t\t\t\t\t\t\t\thandleChange(checked, option, e)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{renderItem ?? option.label}\n\t\t\t\t\t\t</CheckboxItem>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nCheckbox.Item = CheckboxItem;\n\nexport default Checkbox;\n"],"names":["Checkbox","props","label","name","options","value","type","optionInline","labelInline","disabled","status","message","required","className","renderItem","onChange","restProps","state","useReactive","formattedOptions","useMemo","formatOption","useEffect","_jsxs","classNames","children","_jsx","map","option","CheckboxItem","includes","optionValue","checked","e","opt","group","i","findIndex","item","push","splice","handleChange","Item"],"mappings":"0OASA,SAASA,EAASC,GACjB,MAAMC,MACLA,EAAKC,KACLA,EAAIC,QACJA,EAAU,GAAEC,MACZA,EAAQ,GAAEC,KACVA,EAAO,UAASC,aAChBA,GAAe,EAAIC,YACnBA,EAAWC,SACXA,EAAQC,OACRA,EAAS,SAAQC,QACjBA,EAAOC,SACPA,EAAQC,UACRA,EAASC,WACTA,EAAUC,SACVA,KACGC,GACAf,EAEEgB,EAAQC,EAEX,CACFb,UAGKc,EAAmBC,GAAQ,IAAMC,EAAajB,IAAU,CAACA,IAoB/D,OAJAkB,GAAU,KACTL,EAAMZ,MAAQA,CAAK,GACjB,CAACA,IAGHkB,EACC,MAAA,CAAAV,UAAWW,EACV,2BACA,CACC,CAAC,cAAcd,KAAsB,WAAXA,EAC1B,iBAAkBF,GAGnBK,MAEGG,EAEHS,SAAA,CAAAvB,GACAqB,EAAA,OAAA,CAAMV,UAAU,qBACdY,SAAA,CAAAb,GAAYc,EAAM,OAAA,CAAAb,UAAU,QAAOY,SAAA,MACnCvB,EAEAS,GAAWe,OAAGb,UAAU,qBAAsBY,SAAAd,OAIjDe,EACC,MAAA,CAAAb,UAAWW,EAAW,qBAAsB,CAC3C,mBAAoBjB,EACpB,4BAAsC,WAATD,IAC5BmB,SAEDN,EAAiBQ,KAAKC,GAErBF,EAACG,EAAY,CAEZ1B,KAAMA,EACNE,MAAOY,EAAMZ,MAAMyB,SAASF,EAAOvB,OACnC0B,YAAaH,EAAOvB,MACpBC,KAAMA,EACNG,SAAUA,GAAYmB,EAAOnB,SAC7BM,SAAU,CAACiB,EAASC,IAvDL,EAACD,EAASE,EAAKD,KACnC,MAAME,EAAQ,IAAIlB,EAAMZ,OAClB+B,EAAID,EAAME,WAAWC,GAASA,IAASJ,EAAI7B,QAE7C2B,GAAWI,EAAI,EAClBD,EAAMI,KAAKL,EAAI7B,QACJ2B,GAAWI,MACtBD,EAAMK,OAAOJ,EAAG,GAGjBnB,EAAMZ,MAAQ8B,EACdpB,IAAWoB,EAAOD,EAAKD,EAAE,EA6CnBQ,CAAaT,EAASJ,EAAQK,GAG9BR,SAAAX,GAAcc,EAAO1B,OAVjB0B,EAAOvB,aAiBnB,CAEAL,EAAS0C,KAAOb"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useReactive as r}from"ahooks";import o from"classnames";import{useRef as i,useMemo as s,useEffect as l}from"react";import{getNextSorter as n}from"../../js/utils.js";import a from"../loading/loading.js";import d from"../utils/empty/index.js";import c,{Header as m}from"./row.js";const p=p=>{const{data:f=[],columns:u=[],border:g,striped:h,header:y=!0,resizable:w,cellPadding:C=".5em",cellEllipsis:j,empty:x=e(d,{}),loading:T,height:k="unset",style:B,className:b,renderLoading:z=()=>e(a,{size:"1.5em",className:"color-3"}),onCellClick:N,onRowClick:$,onHeaderClick:v,onSort:E,onScroll:H,onResize:R}=p,S=i(null),W=r({rows:f,widths:u.map((e=>e.width??"min-content")),sortBy:"",sortType:""}),q=s((()=>{const{widths:e}=W,t={...B,"--grid-template-columns":e.map((e=>"number"==typeof e?`${e}px`:e)).join(" ")};if(!w)return t;const r=u.map(((t,r)=>{const{fixed:o}=t;return o?e[r]:0}));return u.map(((e,o)=>{const{fixed:i}=e;if(i)if(0===o)t["--datagrid-cell-inset-0"]=0;else if(o===r.length-1)t["--datagrid-cell-inset-"+(r.length-1)]="auto 0";else{const e="left"===i,s=(e?r.slice(0,o):r.slice(o+1)).reduce(((e,t)=>e+t))+"px",l=e?`${s} auto`:`auto ${s}`;t[`--datagrid-cell-inset-${o}`]=l}})),t}),[W.widths,w]),A=s((()=>{const{sortBy:e,sortType:t}=W;if(e&&!E){const r=u.find((t=>t.id===e))?.sorter,o="function"==typeof r?r:(t,r)=>r[e]-t[e],i=[...f].sort(o);return"desc"===t?i:i.reverse()}return f}),[f,u,W.sortBy,W.sortType]);l((()=>{if(!S.current)return;const{current:e}=S,t=e.querySelector(".i-datagrid-row")?.children;t?.length&&(W.widths=Array.from(t).map((e=>e.offsetWidth)))}),[u,w]),l((()=>{T&&S.current?.scrollTo({top:0,left:0})}),[T]);const L={"--cell-padding":C,...q};return t("div",{style:{maxHeight:k,...L},className:o("i-datagrid-container",b,{"i-datagrid-bordered":g,"i-datagrid-striped":h}),children:[t("div",{ref:S,className:o("i-datagrid",{"i-datagrid-loading":T}),onWheel:H,children:[y&&e(m,{columns:u,resizable:w,sortType:W.sortType,sortBy:W.sortBy,cellEllipsis:j,onWidthChange:(e,t)=>{if(!w)return;const[...r]=W.widths;r[e]=t,W.widths=r,R?.(u[e],t)},onHeaderClick:(e,t)=>{if(e?.sorter){const[t,r]=n(W.sortBy,W.sortType,e.id);Object.assign(W,{sortBy:t,sortType:r}),E?.(t,r)}v?.(e,t)}}),A.map(((t,r)=>e(c,{row:r+(y?1:0),data:t,cellEllipsis:j,columns:u,onCellClick:N,onRowClick:$},r))),A.length<1&&x]}),T&&z()]})};export{p as default};
|
|
2
2
|
//# sourceMappingURL=datagrid.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"datagrid.js","sources":["../../../packages/components/datagrid/datagrid.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"datagrid.js","sources":["../../../packages/components/datagrid/datagrid.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { CSSProperties, MouseEvent, useEffect, useMemo, useRef } from \"react\";\nimport { getNextSorter } from \"../../js/utils\";\nimport Loading from \"../loading\";\nimport Empty from \"../utils/empty\";\nimport \"./index.css\";\nimport Row, { Header } from \"./row\";\nimport type { IColumn, IData, IDatagrid, TDatagridState } from \"./type\";\n\nconst Datagrid = (props: IDatagrid) => {\n\tconst {\n\t\tdata = [],\n\t\tcolumns = [],\n\t\tborder,\n\t\tstriped,\n\t\theader = true,\n\t\tresizable,\n\t\tcellPadding = \".5em\",\n\t\tcellEllipsis,\n\t\tempty = <Empty />,\n\t\tloading,\n\t\theight = \"unset\",\n\t\tstyle,\n\t\tclassName,\n\t\trenderLoading = () => <Loading size='1.5em' className='color-3' />,\n\t\tonCellClick,\n\t\tonRowClick,\n\t\tonHeaderClick,\n\t\tonSort,\n\t\tonScroll,\n\t\tonResize,\n\t} = props;\n\n\tconst container = useRef<HTMLDivElement>(null);\n\tconst state = useReactive<TDatagridState>({\n\t\trows: data,\n\t\twidths: columns.map((col) => col.width ?? \"min-content\"),\n\t\tsortBy: \"\",\n\t\tsortType: \"\",\n\t});\n\n\tconst styles = useMemo(() => {\n\t\tconst { widths } = state;\n\n\t\tconst o = {\n\t\t\t...style,\n\t\t\t\"--grid-template-columns\": widths\n\t\t\t\t.map((w) => {\n\t\t\t\t\treturn typeof w === \"number\" ? `${w}px` : w;\n\t\t\t\t})\n\t\t\t\t.join(\" \"),\n\t\t};\n\n\t\tif (!resizable) return o;\n\n\t\tconst fws = columns.map((col, i) => {\n\t\t\tconst { fixed } = col;\n\t\t\tif (!fixed) return 0;\n\t\t\treturn widths[i] as number;\n\t\t});\n\n\t\tcolumns.map((col, i) => {\n\t\t\tconst { fixed } = col;\n\t\t\tif (!fixed) return;\n\t\t\tif (i === 0) {\n\t\t\t\to[`--datagrid-cell-inset-0`] = 0;\n\t\t\t} else if (i === fws.length - 1) {\n\t\t\t\to[`--datagrid-cell-inset-${fws.length - 1}`] = \"auto 0\";\n\t\t\t} else {\n\t\t\t\tconst isLeft = fixed === \"left\";\n\t\t\t\tconst before = isLeft ? fws.slice(0, i) : fws.slice(i + 1);\n\t\t\t\tconst sum = before.reduce((pre, cur) => pre + cur) + \"px\";\n\t\t\t\tconst result = isLeft ? `${sum} auto` : `auto ${sum}`;\n\t\t\t\to[`--datagrid-cell-inset-${i}`] = result;\n\t\t\t}\n\t\t});\n\n\t\treturn o;\n\t}, [state.widths, resizable]);\n\n\tconst handleWidthChange = (i: number, w: number) => {\n\t\tif (!resizable) return;\n\n\t\tconst [...ws] = state.widths;\n\t\tws[i] = w;\n\t\tstate.widths = ws;\n\t\tonResize?.(columns[i], w);\n\t};\n\n\tconst handleHeaderClick = (column?: IColumn, e?: MouseEvent) => {\n\t\tif (column?.sorter) {\n\t\t\tconst [sortBy, sortType] = getNextSorter(\n\t\t\t\tstate.sortBy,\n\t\t\t\tstate.sortType,\n\t\t\t\tcolumn.id\n\t\t\t);\n\n\t\t\tObject.assign(state, {\n\t\t\t\tsortBy,\n\t\t\t\tsortType,\n\t\t\t});\n\n\t\t\tonSort?.(sortBy, sortType);\n\t\t}\n\n\t\tonHeaderClick?.(column, e);\n\t};\n\n\tconst rows = useMemo(() => {\n\t\tconst { sortBy, sortType } = state;\n\n\t\tif (sortBy && !onSort) {\n\t\t\tconst sorter = columns.find((col) => col.id === sortBy)?.sorter;\n\t\t\tconst sortFn =\n\t\t\t\ttypeof sorter === \"function\"\n\t\t\t\t\t? sorter\n\t\t\t\t\t: (a: IData, b: IData) => b[sortBy] - a[sortBy];\n\t\t\tconst sorted = [...data].sort(sortFn);\n\n\t\t\treturn sortType === \"desc\" ? sorted : sorted.reverse();\n\t\t}\n\n\t\treturn data;\n\t}, [data, columns, state.sortBy, state.sortType]);\n\n\tuseEffect(() => {\n\t\tif (!container.current) return;\n\t\tconst { current: div } = container;\n\t\tconst tds = div.querySelector(\".i-datagrid-row\")?.children;\n\t\tif (!tds?.length) return;\n\t\tstate.widths = Array.from(tds).map((node: any) => node.offsetWidth);\n\t}, [columns, resizable]);\n\n\tuseEffect(() => {\n\t\tloading && container.current?.scrollTo({ top: 0, left: 0 });\n\t}, [loading]);\n\n\tconst mergedStyle = {\n\t\t\"--cell-padding\": cellPadding,\n\t\t...styles,\n\t} as CSSProperties;\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ maxHeight: height, ...mergedStyle }}\n\t\t\tclassName={classNames(\"i-datagrid-container\", className, {\n\t\t\t\t\"i-datagrid-bordered\": border,\n\t\t\t\t\"i-datagrid-striped\": striped,\n\t\t\t})}\n\t\t>\n\t\t\t<div\n\t\t\t\tref={container}\n\t\t\t\tclassName={classNames(\"i-datagrid\", {\n\t\t\t\t\t\"i-datagrid-loading\": loading,\n\t\t\t\t})}\n\t\t\t\tonWheel={onScroll}\n\t\t\t>\n\t\t\t\t{header && (\n\t\t\t\t\t<Header\n\t\t\t\t\t\tcolumns={columns}\n\t\t\t\t\t\tresizable={resizable}\n\t\t\t\t\t\tsortType={state.sortType}\n\t\t\t\t\t\tsortBy={state.sortBy}\n\t\t\t\t\t\tcellEllipsis={cellEllipsis}\n\t\t\t\t\t\tonWidthChange={handleWidthChange}\n\t\t\t\t\t\tonHeaderClick={handleHeaderClick}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{rows.map((row, i) => (\n\t\t\t\t\t<Row\n\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\trow={i + (header ? 1 : 0)}\n\t\t\t\t\t\tdata={row}\n\t\t\t\t\t\tcellEllipsis={cellEllipsis}\n\t\t\t\t\t\tcolumns={columns}\n\t\t\t\t\t\tonCellClick={onCellClick}\n\t\t\t\t\t\tonRowClick={onRowClick}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\n\t\t\t\t{rows.length < 1 && empty}\n\t\t\t</div>\n\n\t\t\t{loading && renderLoading()}\n\t\t</div>\n\t);\n};\n\nexport default Datagrid;\n"],"names":["Datagrid","props","data","columns","border","striped","header","resizable","cellPadding","cellEllipsis","empty","_jsx","Empty","loading","height","style","className","renderLoading","Loading","size","onCellClick","onRowClick","onHeaderClick","onSort","onScroll","onResize","container","useRef","state","useReactive","rows","widths","map","col","width","sortBy","sortType","styles","useMemo","o","w","join","fws","i","fixed","length","isLeft","sum","slice","reduce","pre","cur","result","sorter","find","id","sortFn","a","b","sorted","sort","reverse","useEffect","current","div","tds","querySelector","children","Array","from","node","offsetWidth","scrollTo","top","left","mergedStyle","_jsxs","maxHeight","classNames","ref","onWheel","Header","onWidthChange","ws","column","e","getNextSorter","Object","assign","row","Row"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as i}from"react/jsx-runtime";import{useMouseMove as
|
|
1
|
+
import{jsx as i}from"react/jsx-runtime";import{useReactive as t}from"ahooks";import{useMouseMove as e,useMouseUp as o}from"../../js/hooks.js";function r(r){const{index:n,onWidthChange:s}=r,a=t({resizing:!1,x:0,width:0});return e((i=>{if(!a.resizing)return;i.preventDefault();const t=a.width+i.pageX-a.x;t<=24||s(n,t)})),o((()=>{a.resizing&&(a.resizing=!1)})),i("i",{className:"i-datagrid-resizor",onMouseDown:i=>{const t=i.target.offsetParent.offsetWidth;Object.assign(a,{x:i.pageX,resizing:!0,width:t})},onClick:i=>i.stopPropagation()})}export{r as default};
|
|
2
2
|
//# sourceMappingURL=resize.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resize.js","sources":["../../../packages/components/datagrid/resize.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"resize.js","sources":["../../../packages/components/datagrid/resize.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport { useMouseMove, useMouseUp } from \"../../js/hooks\";\n\nexport default function Resize(props) {\n\tconst { index, onWidthChange } = props;\n\tconst state = useReactive({\n\t\tresizing: false,\n\t\tx: 0,\n\t\twidth: 0,\n\t});\n\n\tconst handleMouseDown = (e) => {\n\t\tconst tar = e.target as HTMLElement;\n\t\tconst width = (tar.offsetParent as HTMLElement).offsetWidth;\n\n\t\tObject.assign(state, {\n\t\t\tx: e.pageX,\n\t\t\tresizing: true,\n\t\t\twidth,\n\t\t});\n\t};\n\n\tconst handleMouseMove = (e) => {\n\t\tif (!state.resizing) return;\n\n\t\te.preventDefault();\n\n\t\tconst after = state.width + e.pageX - state.x;\n\t\tif (after <= 24) return;\n\n\t\tonWidthChange(index, after);\n\t};\n\n\tconst handleMouseUp = () => {\n\t\tif (!state.resizing) return;\n\n\t\tstate.resizing = false;\n\t};\n\n\tuseMouseMove(handleMouseMove);\n\tuseMouseUp(handleMouseUp);\n\n\treturn (\n\t\t<i\n\t\t\tclassName='i-datagrid-resizor'\n\t\t\tonMouseDown={handleMouseDown}\n\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t/>\n\t);\n}\n"],"names":["Resize","props","index","onWidthChange","state","useReactive","resizing","x","width","useMouseMove","e","preventDefault","after","pageX","useMouseUp","_jsx","className","onMouseDown","target","offsetParent","offsetWidth","Object","assign","onClick","stopPropagation"],"mappings":"8IAGwB,SAAAA,EAAOC,GAC9B,MAAMC,MAAEA,EAAKC,cAAEA,GAAkBF,EAC3BG,EAAQC,EAAY,CACzBC,UAAU,EACVC,EAAG,EACHC,MAAO,IAkCR,OAHAC,GAjByBC,IACxB,IAAKN,EAAME,SAAU,OAErBI,EAAEC,iBAEF,MAAMC,EAAQR,EAAMI,MAAQE,EAAEG,MAAQT,EAAMG,EACxCK,GAAS,IAEbT,EAAcD,EAAOU,EAAM,IAU5BE,GAPsB,KAChBV,EAAME,WAEXF,EAAME,UAAW,EAAK,IAOtBS,OACCC,UAAU,qBACVC,YAlCuBP,IACxB,MACMF,EADME,EAAEQ,OACKC,aAA6BC,YAEhDC,OAAOC,OAAOlB,EAAO,CACpBG,EAAGG,EAAEG,MACLP,UAAU,EACVE,SACC,EA2BDe,QAAUb,GAAMA,EAAEc,mBAGrB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as r}from"react/jsx-runtime";import{
|
|
1
|
+
import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useReactive as o}from"ahooks";import i from"classnames";import{useRef as t,useEffect as a}from"react";import{createPortal as c}from"react-dom";import{useKeydown as s}from"../../js/hooks.js";import n from"../utils/helpericon/helpericon.js";function d(d){const{visible:l,position:m="left",header:h,footer:p,backdropClosable:u=!0,hideCloseButton:f,keepDOM:v,className:w,disabledEsc:b,children:k,onVisibleChange:C,onClose:N,...j}=d,g=t(!0),x=o({show:l,active:l,init:!1});a((()=>{l?E():T()}),[l]);const E=()=>{g.current&&(x.show=!0,C?.(!0),g.current=!1,setTimeout((()=>{x.active=!0,g.current=!0,x.init=!0}),24))},T=()=>{g.current&&(g.current=!1,x.active=!1,setTimeout((()=>{v||(x.show=!1),C?.(!1),g.current=!0,N?.()}),240))};return s((e=>{"Escape"===e.code&&l&&T()}),{disabled:b}),c(x.show&&e("div",{className:i("i-backdrop-drawer",w,{"i-active":x.active}),onClick:function(){u&&T()},...j,children:r("div",{className:i("i-drawer",`i-drawer-${m}`),onClick:e=>e.stopPropagation(),children:[r("header",{className:"i-drawer-header",children:[h,e(n,{active:!f,className:"i-drawer-close",onClick:T})]}),e("div",{className:"i-drawer-content",children:k}),e("div",{className:"i-drawer-footer",children:p})]})}),document.body)}export{d as default};
|
|
2
2
|
//# sourceMappingURL=drawer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drawer.js","sources":["../../../packages/components/drawer/drawer.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"drawer.js","sources":["../../../packages/components/drawer/drawer.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { useEffect, useRef } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useKeydown } from \"../../js/hooks\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport { IDrawer } from \"./type\";\n\nfunction Drawer(props: IDrawer) {\n\tconst {\n\t\tvisible,\n\t\tposition = \"left\",\n\t\theader,\n\t\tfooter,\n\t\tbackdropClosable = true,\n\t\thideCloseButton,\n\t\tkeepDOM,\n\t\tclassName,\n\t\tdisabledEsc,\n\t\tchildren,\n\t\tonVisibleChange,\n\t\tonClose,\n\t\t...restProps\n\t} = props;\n\tconst toggable = useRef(true);\n\tconst state = useReactive({\n\t\tshow: visible,\n\t\tactive: visible,\n\t\tinit: false,\n\t});\n\n\tuseEffect(() => {\n\t\tvisible ? handleShow() : handleHide();\n\t}, [visible]);\n\n\tconst handleShow = () => {\n\t\tif (!toggable.current) return;\n\n\t\tstate.show = true;\n\t\tonVisibleChange?.(true);\n\t\ttoggable.current = false;\n\t\tsetTimeout(() => {\n\t\t\tstate.active = true;\n\t\t\ttoggable.current = true;\n\t\t\tstate.init = true;\n\t\t}, 24);\n\t};\n\n\tconst handleHide = () => {\n\t\tif (!toggable.current) return;\n\t\ttoggable.current = false;\n\n\t\tstate.active = false;\n\t\tsetTimeout(() => {\n\t\t\tif (!keepDOM) {\n\t\t\t\tstate.show = false;\n\t\t\t}\n\t\t\tonVisibleChange?.(false);\n\t\t\ttoggable.current = true;\n\t\t\tonClose?.();\n\t\t}, 240);\n\t};\n\n\tconst handleBackdropClick = function () {\n\t\tbackdropClosable && handleHide();\n\t};\n\n\tuseKeydown(\n\t\t(e) => {\n\t\t\tif (e.code !== \"Escape\" || !visible) return;\n\t\t\thandleHide();\n\t\t},\n\t\t{\n\t\t\tdisabled: disabledEsc,\n\t\t}\n\t);\n\n\treturn createPortal(\n\t\tstate.show && (\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-backdrop-drawer\", className, {\n\t\t\t\t\t\"i-active\": state.active,\n\t\t\t\t})}\n\t\t\t\tonClick={handleBackdropClick}\n\t\t\t\t{...restProps}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-drawer\", `i-drawer-${position}`)}\n\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t<header className='i-drawer-header'>\n\t\t\t\t\t\t{header}\n\n\t\t\t\t\t\t<Helpericon\n\t\t\t\t\t\t\tactive={!hideCloseButton}\n\t\t\t\t\t\t\tclassName='i-drawer-close'\n\t\t\t\t\t\t\tonClick={handleHide}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</header>\n\n\t\t\t\t\t<div className='i-drawer-content'>{children}</div>\n\n\t\t\t\t\t<div className='i-drawer-footer'>{footer}</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t),\n\t\tdocument.body\n\t);\n}\n\nexport default Drawer;\n"],"names":["Drawer","props","visible","position","header","footer","backdropClosable","hideCloseButton","keepDOM","className","disabledEsc","children","onVisibleChange","onClose","restProps","toggable","useRef","state","useReactive","show","active","init","useEffect","handleShow","handleHide","current","setTimeout","useKeydown","e","code","disabled","createPortal","_jsx","classNames","onClick","_jsxs","stopPropagation","Helpericon","document","body"],"mappings":"wSASA,SAASA,EAAOC,GACf,MAAMC,QACLA,EAAOC,SACPA,EAAW,OAAMC,OACjBA,EAAMC,OACNA,EAAMC,iBACNA,GAAmB,EAAIC,gBACvBA,EAAeC,QACfA,EAAOC,UACPA,EAASC,YACTA,EAAWC,SACXA,EAAQC,gBACRA,EAAeC,QACfA,KACGC,GACAb,EACEc,EAAWC,GAAO,GAClBC,EAAQC,EAAY,CACzBC,KAAMjB,EACNkB,OAAQlB,EACRmB,MAAM,IAGPC,GAAU,KACTpB,EAAUqB,IAAeC,GAAY,GACnC,CAACtB,IAEJ,MAAMqB,EAAa,KACbR,EAASU,UAEdR,EAAME,MAAO,EACbP,KAAkB,GAClBG,EAASU,SAAU,EACnBC,YAAW,KACVT,EAAMG,QAAS,EACfL,EAASU,SAAU,EACnBR,EAAMI,MAAO,CAAI,GACf,IAAG,EAGDG,EAAa,KACbT,EAASU,UACdV,EAASU,SAAU,EAEnBR,EAAMG,QAAS,EACfM,YAAW,KACLlB,IACJS,EAAME,MAAO,GAEdP,KAAkB,GAClBG,EAASU,SAAU,EACnBZ,KAAW,GACT,KAAI,EAiBR,OAVAc,GACEC,IACe,WAAXA,EAAEC,MAAsB3B,GAC5BsB,GAAY,GAEb,CACCM,SAAUpB,IAILqB,EACNd,EAAME,MACLa,EACC,MAAA,CAAAvB,UAAWwB,EAAW,oBAAqBxB,EAAW,CACrD,WAAYQ,EAAMG,SAEnBc,QApByB,WAC3B5B,GAAoBkB,GACpB,KAmBMV,EAEJH,SAAAwB,EAAA,MAAA,CACC1B,UAAWwB,EAAW,WAAY,YAAY9B,KAC9C+B,QAAUN,GAAMA,EAAEQ,4BAElBD,EAAQ,SAAA,CAAA1B,UAAU,kBAAiBE,SAAA,CACjCP,EAED4B,EAACK,EAAU,CACVjB,QAASb,EACTE,UAAU,iBACVyB,QAASV,OAIXQ,EAAA,MAAA,CAAKvB,UAAU,mBAAoBE,SAAAA,IAEnCqB,EAAA,MAAA,CAAKvB,UAAU,kBAAmBE,SAAAN,SAIrCiC,SAASC,KAEX"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r,jsxs as o,Fragment as
|
|
1
|
+
import{jsx as r,jsxs as o,Fragment as t}from"react/jsx-runtime";import{HideImageTwotone as s}from"@ricons/material";import{useReactive as e}from"ahooks";import i from"classnames";import{useRef as a,useEffect as c}from"react";import{useIntersectionObserver as n}from"../../js/hooks.js";import l from"../../js/usePreview/index.js";import m from"../icon/icon.js";import d from"../loading/loading.js";const u=u=>{const{src:f,round:g,size:p,initSize:v,lazyload:h,fallback:j=r(m,{icon:r(s,{}),size:"2em",className:"color-5"}),fit:b,style:k,className:y,cover:w,coverClass:z,usePreview:C,onLoad:N,onError:x,onClick:E,...A}=u,L=e({status:"loading"}),P=a(null),F=b?"100%":void 0,{observe:G,unobserve:I}=n(),M=l(),S=r=>{E?.(r),C&&f&&M({items:[{src:f,type:"IMAGE"}]})};c((()=>{if(f&&(P.current?.complete||(L.status="loading"),h&&P.current))return G(P.current,((r,o)=>{o&&(r.setAttribute("src",r.dataset.src||""),I(r))})),()=>{P.current&&I(P.current)}}),[f]),A[h?"data-src":"src"]=f;const $="loading"===L.status?v:void 0;return r("div",{style:{width:p??$,height:p??$,...k},className:i("i-image",y,{rounded:g,[`i-image-${L.status}`]:L.status}),children:"error"===L.status?j:o(t,{children:[f&&r("img",{ref:P,style:{objectFit:b,width:F,height:F},...A,onLoad:r=>{N?.(r),L.status=void 0},onError:r=>{x?.(r),L.status="error"},onClick:S}),f&&"loading"===L.status&&r(d,{absolute:!0}),w&&r("div",{className:i("i-image-cover",z),onClick:S,children:w})]})})};export{u as default};
|
|
2
2
|
//# sourceMappingURL=image.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image.js","sources":["../../../packages/components/image/image.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"image.js","sources":["../../../packages/components/image/image.tsx"],"sourcesContent":["import { HideImageTwotone } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { useEffect, useRef } from \"react\";\nimport { useIntersectionObserver } from \"../../js/hooks\";\nimport usePreview from \"../../js/usePreview\";\nimport Icon from \"../icon\";\nimport Loading from \"../loading\";\nimport \"./index.css\";\nimport type { CompositionImage, IImage } from \"./type\";\n\nconst Image = (props: IImage) => {\n\tconst {\n\t\tsrc,\n\t\tround,\n\t\tsize,\n\t\tinitSize,\n\t\tlazyload,\n\t\tfallback = (\n\t\t\t<Icon icon={<HideImageTwotone />} size='2em' className='color-5' />\n\t\t),\n\t\tfit,\n\t\tstyle,\n\t\tclassName,\n\t\tcover,\n\t\tcoverClass,\n\t\tusePreview: previewable,\n\t\tonLoad,\n\t\tonError,\n\t\tonClick,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive<{ status?: string }>({\n\t\tstatus: \"loading\",\n\t});\n\tconst ref = useRef<HTMLImageElement>(null);\n\tconst wh = fit ? \"100%\" : undefined;\n\n\tconst { observe, unobserve } = useIntersectionObserver();\n\tconst preview = usePreview();\n\n\tconst handleError = (err) => {\n\t\tonError?.(err);\n\t\tstate.status = \"error\";\n\t};\n\n\tconst handleLoad = (e) => {\n\t\tonLoad?.(e);\n\t\tstate.status = undefined;\n\t};\n\n\tconst handleClick = (e) => {\n\t\tonClick?.(e);\n\n\t\tpreviewable &&\n\t\t\tsrc &&\n\t\t\tpreview({\n\t\t\t\titems: [\n\t\t\t\t\t{\n\t\t\t\t\t\tsrc,\n\t\t\t\t\t\ttype: \"IMAGE\",\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t});\n\t};\n\n\tuseEffect(() => {\n\t\tif (!src) return;\n\n\t\tif (!ref.current?.complete) {\n\t\t\tstate.status = \"loading\";\n\t\t}\n\n\t\tif (!lazyload || !ref.current) return;\n\n\t\tobserve(ref.current, (tar: HTMLElement, visible: boolean) => {\n\t\t\tif (!visible) return;\n\n\t\t\ttar.setAttribute(\"src\", tar.dataset.src || \"\");\n\t\t\tunobserve(tar);\n\t\t});\n\n\t\treturn () => {\n\t\t\tref.current && unobserve(ref.current);\n\t\t};\n\t}, [src]);\n\n\trestProps[lazyload ? \"data-src\" : \"src\"] = src;\n\tconst iSize = state.status === \"loading\" ? initSize : undefined;\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\twidth: size ?? iSize,\n\t\t\t\theight: size ?? iSize,\n\t\t\t\t...style,\n\t\t\t}}\n\t\t\tclassName={classNames(\"i-image\", className, {\n\t\t\t\trounded: round,\n\t\t\t\t[`i-image-${state.status}`]: state.status,\n\t\t\t})}\n\t\t>\n\t\t\t{state.status === \"error\" ? (\n\t\t\t\tfallback\n\t\t\t) : (\n\t\t\t\t<>\n\t\t\t\t\t{src && (\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t\tstyle={{ objectFit: fit, width: wh, height: wh }}\n\t\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t\t\tonLoad={handleLoad}\n\t\t\t\t\t\t\tonError={handleError}\n\t\t\t\t\t\t\tonClick={handleClick}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{src && state.status === \"loading\" && <Loading absolute />}\n\n\t\t\t\t\t{cover && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={classNames(\"i-image-cover\", coverClass)}\n\t\t\t\t\t\t\tonClick={handleClick}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{cover}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Image as CompositionImage;\n"],"names":["Image","props","src","round","size","initSize","lazyload","fallback","_jsx","Icon","icon","HideImageTwotone","className","fit","style","cover","coverClass","usePreview","previewable","onLoad","onError","onClick","restProps","state","useReactive","status","ref","useRef","wh","undefined","observe","unobserve","useIntersectionObserver","preview","handleClick","e","items","type","useEffect","current","complete","tar","visible","setAttribute","dataset","iSize","width","height","classNames","rounded","children","_jsxs","objectFit","err","Loading","absolute"],"mappings":"6YAWA,MAAMA,EAASC,IACd,MAAMC,IACLA,EAAGC,MACHA,EAAKC,KACLA,EAAIC,SACJA,EAAQC,SACRA,EAAQC,SACRA,EACCC,EAACC,EAAI,CAACC,KAAMF,EAACG,EAAmB,CAAA,GAAEP,KAAK,MAAMQ,UAAU,YACvDC,IACDA,EAAGC,MACHA,EAAKF,UACLA,EAASG,MACTA,EAAKC,WACLA,EACAC,WAAYC,EAAWC,OACvBA,EAAMC,QACNA,EAAOC,QACPA,KACGC,GACArB,EAEEsB,EAAQC,EAAiC,CAC9CC,OAAQ,YAEHC,EAAMC,EAAyB,MAC/BC,EAAKf,EAAM,YAASgB,GAEpBC,QAAEA,EAAOC,UAAEA,GAAcC,IACzBC,EAAUhB,IAYViB,EAAeC,IACpBd,IAAUc,GAEVjB,GACChB,GACA+B,EAAQ,CACPG,MAAO,CACN,CACClC,MACAmC,KAAM,WAGP,EAGJC,GAAU,KACT,GAAKpC,IAEAwB,EAAIa,SAASC,WACjBjB,EAAME,OAAS,WAGXnB,GAAaoB,EAAIa,SAStB,OAPAT,EAAQJ,EAAIa,SAAS,CAACE,EAAkBC,KAClCA,IAELD,EAAIE,aAAa,MAAOF,EAAIG,QAAQ1C,KAAO,IAC3C6B,EAAUU,GAAI,IAGR,KACNf,EAAIa,SAAWR,EAAUL,EAAIa,QAAQ,CACrC,GACC,CAACrC,IAEJoB,EAAUhB,EAAW,WAAa,OAASJ,EAC3C,MAAM2C,EAAyB,YAAjBtB,EAAME,OAAuBpB,OAAWwB,EAEtD,OACCrB,EACC,MAAA,CAAAM,MAAO,CACNgC,MAAO1C,GAAQyC,EACfE,OAAQ3C,GAAQyC,KACb/B,GAEJF,UAAWoC,EAAW,UAAWpC,EAAW,CAC3CqC,QAAS9C,EACT,CAAC,WAAWoB,EAAME,UAAWF,EAAME,SAClCyB,SAEgB,UAAjB3B,EAAME,OAAkB,EAGxB0B,eACEjD,GACAM,EACC,MAAA,CAAAkB,IAAKA,EACLZ,MAAO,CAAEsC,UAAWvC,EAAKiC,MAAOlB,EAAImB,OAAQnB,MACxCN,EACJH,OAjEcgB,IACnBhB,IAASgB,GACTZ,EAAME,YAASI,CAAS,EAgEnBT,QAvEeiC,IACpBjC,IAAUiC,GACV9B,EAAME,OAAS,OAAO,EAsEjBJ,QAASa,IAIVhC,GAAwB,YAAjBqB,EAAME,QAAwBjB,EAAC8C,EAAO,CAACC,UAAQ,IAEtDxC,GACAP,EAAA,MAAA,CACCI,UAAWoC,EAAW,gBAAiBhC,GACvCK,QAASa,WAERnB,QAKA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as i}from"react/jsx-runtime";import r from"../../js/usePreview/index.js";import{getSuffixByUrl as
|
|
1
|
+
import{jsx as i}from"react/jsx-runtime";import{useMemo as r}from"react";import e from"../../js/usePreview/index.js";import{getSuffixByUrl as s,getFileType as t}from"../../js/utils.js";import o from"../flex/flex.js";import m from"./image.js";function c(c){const{items:n=[],gap:a=8,columns:p,wrap:f,direction:l,usePreview:u,onClick:j,...g}=c,x=e(),d=r((()=>n.map((i=>{const r={src:""};return"string"==typeof i?r.src=i:Object.assign(r,i),r.suffix=s(r.src)||"",r.type=t(r.suffix,i.type),r}))),[n]);return d.length?i(o,{className:"i-image-list",gap:a,columns:p,wrap:f,direction:l,children:d.map(((r,e)=>i(m,{src:r.src,size:60,usePreview:!1,onClick:i=>((i,r)=>{j?.(i),u&&x({items:d,initial:r})})(i,e),...g},e)))}):""}export{c as default};
|
|
2
2
|
//# sourceMappingURL=list.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"list.js","sources":["../../../packages/components/image/list.tsx"],"sourcesContent":["import usePreview from \"
|
|
1
|
+
{"version":3,"file":"list.js","sources":["../../../packages/components/image/list.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport usePreview from \"../../js/usePreview\";\nimport { TPreviewItem } from \"../../js/usePreview/type\";\nimport { getFileType, getSuffixByUrl } from \"../../js/utils\";\nimport Flex from \"../flex\";\nimport Image from \"./image\";\nimport { IImageList } from \"./type\";\n\nexport default function List(props: IImageList) {\n\tconst {\n\t\titems = [],\n\t\tgap = 8,\n\t\tcolumns,\n\t\twrap,\n\t\tdirection,\n\t\tusePreview: previewable,\n\t\tonClick,\n\t\t...restProps\n\t} = props;\n\tconst preview = usePreview();\n\n\tconst files = useMemo(() => {\n\t\treturn items.map((item) => {\n\t\t\tconst o: TPreviewItem = {\n\t\t\t\tsrc: \"\",\n\t\t\t};\n\t\t\tif (typeof item === \"string\") {\n\t\t\t\to.src = item;\n\t\t\t} else {\n\t\t\t\tObject.assign(o, item);\n\t\t\t}\n\n\t\t\to.suffix = getSuffixByUrl(o.src) || \"\";\n\t\t\to.type = getFileType(o.suffix, item[\"type\"]);\n\n\t\t\treturn o;\n\t\t});\n\t}, [items]);\n\n\tconst handleClick = (e, i) => {\n\t\tonClick?.(e);\n\n\t\tpreviewable &&\n\t\t\tpreview({\n\t\t\t\titems: files,\n\t\t\t\tinitial: i,\n\t\t\t});\n\t};\n\n\tif (!files.length) return \"\";\n\n\treturn (\n\t\t<Flex\n\t\t\tclassName='i-image-list'\n\t\t\tgap={gap}\n\t\t\tcolumns={columns}\n\t\t\twrap={wrap}\n\t\t\tdirection={direction}\n\t\t>\n\t\t\t{files.map((img, i) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Image\n\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\tsrc={img.src}\n\t\t\t\t\t\tsize={60}\n\t\t\t\t\t\tusePreview={false}\n\t\t\t\t\t\tonClick={(e) => handleClick(e, i)}\n\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Flex>\n\t);\n}\n"],"names":["List","props","items","gap","columns","wrap","direction","usePreview","previewable","onClick","restProps","preview","files","useMemo","map","item","o","src","Object","assign","suffix","getSuffixByUrl","type","getFileType","length","_jsx","Flex","className","children","img","i","Image","size","e","initial","handleClick"],"mappings":"iPAQwB,SAAAA,EAAKC,GAC5B,MAAMC,MACLA,EAAQ,GAAEC,IACVA,EAAM,EAACC,QACPA,EAAOC,KACPA,EAAIC,UACJA,EACAC,WAAYC,EAAWC,QACvBA,KACGC,GACAT,EACEU,EAAUJ,IAEVK,EAAQC,GAAQ,IACdX,EAAMY,KAAKC,IACjB,MAAMC,EAAkB,CACvBC,IAAK,IAWN,MAToB,iBAATF,EACVC,EAAEC,IAAMF,EAERG,OAAOC,OAAOH,EAAGD,GAGlBC,EAAEI,OAASC,EAAeL,EAAEC,MAAQ,GACpCD,EAAEM,KAAOC,EAAYP,EAAEI,OAAQL,EAAW,MAEnCC,CAAC,KAEP,CAACd,IAYJ,OAAKU,EAAMY,OAGVC,EAACC,EAAI,CACJC,UAAU,eACVxB,IAAKA,EACLC,QAASA,EACTC,KAAMA,EACNC,UAAWA,EAEVsB,SAAAhB,EAAME,KAAI,CAACe,EAAKC,IAEfL,EAACM,EAEA,CAAAd,IAAKY,EAAIZ,IACTe,KAAM,GACNzB,YAAY,EACZE,QAAUwB,GA3BK,EAACA,EAAGH,KACvBrB,IAAUwB,GAEVzB,GACCG,EAAQ,CACPT,MAAOU,EACPsB,QAASJ,GACR,EAoBiBK,CAAYF,EAAGH,MAC3BpB,GALCoB,OAbgB,EAwB3B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as n}from"react/jsx-runtime";import{
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import{MinusRound as i,PlusRound as a}from"@ricons/material";import{useReactive as t}from"ahooks";import l from"classnames";import{useEffect as r}from"react";import{formatNumber as o,clamp as s}from"../../js/utils.js";import p from"../utils/helpericon/helpericon.js";import m from"./container.js";const c=c=>{const{ref:u,label:d,name:v,value:f=c.initValue??"",initValue:h,labelInline:b,step:N=1,min:g=-1/0,max:j=1/0,thousand:C,precision:y,type:k,className:x,status:I="normal",append:V,border:A,prepend:B,message:E,tip:$,hideControl:q,style:w,onChange:z,onEnter:D,onInput:F,onBlur:G,...H}=c,J=t({value:f}),K=e=>e?"number"!=typeof e&&C?e.replaceAll(C,""):e:"",L=e=>{const n=K(J.value)??0,i=s(+n+e,g,j);J.value=(e=>o(e,{precision:y,thousand:C}))(i),z?.(i)};r((()=>{J.value=f}),[f]);const M={ref:u,name:v,value:J.value,className:"i-input i-input-number",onChange:e=>{const{value:n}=e.target,i=K(n.replace(/[^\d\.-]/g,""));J.value=i,z?.(+i,e)},...H};return e(m,{label:d,labelInline:b,className:x,style:w,tip:E??$,status:I,children:n("div",{className:l("i-input-item",{[`i-input-${I}`]:"normal"!==I,"i-input-borderless":!A}),children:[B&&e("div",{className:"i-input-prepend",children:B}),!q&&e(p,{active:!0,icon:e(i,{}),onClick:()=>L(-N)}),e("input",{...M}),!q&&e(p,{active:!0,icon:e(a,{}),onClick:()=>L(N)}),V&&e("div",{className:"i-input-append",children:V})]})})};export{c as default};
|
|
2
2
|
//# sourceMappingURL=number.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"number.js","sources":["../../../packages/components/input/number.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"number.js","sources":["../../../packages/components/input/number.tsx"],"sourcesContent":["import { MinusRound, PlusRound } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { ChangeEvent, useEffect } from \"react\";\nimport \"../../css/input.css\";\nimport { clamp, formatNumber } from \"../../js/utils\";\nimport Helpericon from \"../utils/helpericon\";\nimport InputContainer from \"./container\";\nimport type { IInputNumber } from \"./type\";\n\nconst Number = (props: IInputNumber) => {\n\tconst {\n\t\tref,\n\t\tlabel,\n\t\tname,\n\t\tvalue = props.initValue ?? \"\",\n\t\tinitValue,\n\t\tlabelInline,\n\t\tstep = 1,\n\t\tmin = -Infinity,\n\t\tmax = Infinity,\n\t\tthousand,\n\t\tprecision,\n\t\ttype,\n\t\tclassName,\n\t\tstatus = \"normal\",\n\t\tappend,\n\t\tborder,\n\t\tprepend,\n\t\tmessage,\n\t\ttip,\n\t\thideControl,\n\t\tstyle,\n\t\tonChange,\n\t\tonEnter,\n\t\tonInput,\n\t\tonBlur,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tvalue,\n\t});\n\n\tconst getRangeNumber = (v: number) => clamp(v, min, max);\n\n\tconst getFormatNumber = (v: number) =>\n\t\tformatNumber(v, { precision, thousand });\n\n\tconst formatInputValue = (v?: string | number) => {\n\t\tif (!v) return \"\";\n\t\tif (typeof v === \"number\" || !thousand) return v;\n\n\t\treturn v.replaceAll(thousand, \"\");\n\t};\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst { value } = e.target;\n\t\tconst v = formatInputValue(value.replace(/[^\\d\\.-]/g, \"\"));\n\n\t\tstate.value = v;\n\t\tonChange?.(+v, e);\n\t};\n\n\tconst handleOperate = (param: number) => {\n\t\tconst value = formatInputValue(state.value) ?? 0;\n\t\tconst result = getRangeNumber(+value + param);\n\n\t\tstate.value = getFormatNumber(result);\n\n\t\tonChange?.(result);\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\tconst inputProps = {\n\t\tref,\n\t\tname,\n\t\tvalue: state.value,\n\t\tclassName: \"i-input i-input-number\",\n\t\tonChange: handleChange,\n\t\t...restProps,\n\t};\n\n\treturn (\n\t\t<InputContainer\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\ttip={message ?? tip}\n\t\t\tstatus={status}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{prepend && <div className='i-input-prepend'>{prepend}</div>}\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<MinusRound />}\n\t\t\t\t\t\tonClick={() => handleOperate(-step)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<input {...inputProps} />\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<PlusRound />}\n\t\t\t\t\t\tonClick={() => handleOperate(step)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{append && <div className='i-input-append'>{append}</div>}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Number;\n"],"names":["Number","props","ref","label","name","value","initValue","labelInline","step","min","Infinity","max","thousand","precision","type","className","status","append","border","prepend","message","tip","hideControl","style","onChange","onEnter","onInput","onBlur","restProps","state","useReactive","formatInputValue","v","replaceAll","handleOperate","param","result","clamp","formatNumber","getFormatNumber","useEffect","inputProps","e","target","replace","_jsx","InputContainer","children","_jsxs","classNames","Helpericon","active","icon","MinusRound","onClick","PlusRound"],"mappings":"2VAUA,MAAMA,EAAUC,IACf,MAAMC,IACLA,EAAGC,MACHA,EAAKC,KACLA,EAAIC,MACJA,EAAQJ,EAAMK,WAAa,GAAEA,UAC7BA,EAASC,YACTA,EAAWC,KACXA,EAAO,EAACC,IACRA,GAAOC,IAAQC,IACfA,EAAMD,IAAQE,SACdA,EAAQC,UACRA,EAASC,KACTA,EAAIC,UACJA,EAASC,OACTA,EAAS,SAAQC,OACjBA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,QACPA,EAAOC,IACPA,EAAGC,YACHA,EAAWC,MACXA,EAAKC,SACLA,EAAQC,QACRA,EAAOC,QACPA,EAAOC,OACPA,KACGC,GACA3B,EAEE4B,EAAQC,EAAY,CACzBzB,UAQK0B,EAAoBC,GACpBA,EACY,iBAANA,GAAmBpB,EAEvBoB,EAAEC,WAAWrB,EAAU,IAFiBoB,EADhC,GAcVE,EAAiBC,IACtB,MAAM9B,EAAQ0B,EAAiBF,EAAMxB,QAAU,EACzC+B,EAtB+BC,GAsBNhC,EAAQ8B,EAtBO1B,EAAKE,GAwBnDkB,EAAMxB,MAtBiB,CAAC2B,GACxBM,EAAaN,EAAG,CAAEnB,YAAWD,aAqBf2B,CAAgBH,GAE9BZ,IAAWY,EAAO,EAGnBI,GAAU,KACTX,EAAMxB,MAAQA,CAAK,GACjB,CAACA,IAEJ,MAAMoC,EAAa,CAClBvC,MACAE,OACAC,MAAOwB,EAAMxB,MACbU,UAAW,yBACXS,SA1BqBkB,IACrB,MAAMrC,MAAEA,GAAUqC,EAAEC,OACdX,EAAID,EAAiB1B,EAAMuC,QAAQ,YAAa,KAEtDf,EAAMxB,MAAQ2B,EACdR,KAAYQ,EAAGU,EAAE,KAsBdd,GAGJ,OACCiB,EAACC,EACA,CAAA3C,MAAOA,EACPI,YAAaA,EACbQ,UAAWA,EACXQ,MAAOA,EACPF,IAAKD,GAAWC,EAChBL,OAAQA,EAAM+B,SAEdC,SACCjC,UAAWkC,EAAW,eAAgB,CACrC,CAAC,WAAWjC,KAAsB,WAAXA,EACvB,sBAAuBE,cAGvBC,GAAW0B,EAAK,MAAA,CAAA9B,UAAU,kBAAiBgC,SAAE5B,KAE5CG,GACDuB,EAACK,EACA,CAAAC,QACA,EAAAC,KAAMP,EAACQ,MACPC,QAAS,IAAMpB,GAAe1B,KAIhCqC,EAAW,QAAA,IAAAJ,KAETnB,GACDuB,EAACK,EACA,CAAAC,QACA,EAAAC,KAAMP,EAACU,MACPD,QAAS,IAAMpB,EAAc1B,KAI9BS,GAAU4B,EAAA,MAAA,CAAK9B,UAAU,iBAAkBgC,SAAA9B,QAE7B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as a}from"react/jsx-runtime";import{
|
|
1
|
+
import{jsx as e,jsxs as a}from"react/jsx-runtime";import{MinusRound as i,PlusRound as l,SyncAltRound as n}from"@ricons/material";import{useReactive as t}from"ahooks";import r from"classnames";import{useEffect as o}from"react";import{formatNumber as s,clamp as p}from"../../js/utils.js";import c from"../utils/helpericon/helpericon.js";import u from"./container.js";const m=m=>{const{label:v,name:d,value:h=m.initValue??"",initValue:f,labelInline:g,min:y=-1/0,max:C=1/0,type:b,className:k,status:N="normal",message:j,tip:A,append:x,prepend:D,step:I=1,thousand:P,precision:V,hideControl:B,placeholder:$,border:q,onChange:w,onBlur:z,style:E,...F}=m,G=t({value:h}),H=e=>e?"number"!=typeof e&&P?e.replaceAll(P,""):e:"",J=(e,a)=>{const{value:i}=e.target,l=H(i.replace(/[^\d\.-]/g,"")),n=Array.isArray(G.value)?G.value:[];n[a]=+l,G.value=n,w?.(n,e)},K=(e,a,i)=>{e.preventDefault(),e.stopPropagation();const l=Array.isArray(G.value)?G.value:[],n=H(l[i])??0,t=p(+n+a,y,C);l[i]=(e=>s(e,{precision:V,thousand:P}))(t),G.value=l,w?.(l,e)};o((()=>{G.value=h}),[h]);const L={name:d,className:"i-input i-input-number",...F};return e(u,{label:v,labelInline:g,className:k,style:E,tip:j??A,status:N,children:a("div",{className:r("i-input-item",{[`i-input-${N}`]:"normal"!==N,"i-input-borderless":!q}),children:[D&&e("div",{className:"i-input-prepend",children:D}),!B&&e(c,{active:!0,icon:e(i,{}),onClick:e=>K(e,-I,0)}),e("input",{value:G.value?.[0]||"",placeholder:$?.[0],...L,onChange:e=>J(e,0)}),!B&&e(c,{active:!0,icon:e(l,{}),onClick:e=>K(e,I,0)}),e(c,{active:!0,icon:e(n,{}),style:{margin:0},onClick:e=>{e.preventDefault(),e.stopPropagation();const a=G.value?G.value:[],i=a[0];a[0]=a[1],a[1]=i,G.value=a,w?.(a)}}),!B&&e(c,{active:!0,icon:e(i,{}),onClick:e=>K(e,-I,1)}),e("input",{value:G.value?.[1]||"",placeholder:$?.[1],...L,onChange:e=>J(e,1)}),!B&&e(c,{active:!0,icon:e(l,{}),onClick:e=>K(e,I,1)}),x&&e("div",{className:"i-input-append",children:x})]})})};export{m as default};
|
|
2
2
|
//# sourceMappingURL=range.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"range.js","sources":["../../../packages/components/input/range.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"range.js","sources":["../../../packages/components/input/range.tsx"],"sourcesContent":["import { MinusRound, PlusRound, SyncAltRound } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { ChangeEvent, MouseEvent, useEffect } from \"react\";\nimport \"../../css/input.css\";\nimport { clamp, formatNumber } from \"../../js/utils\";\nimport Helpericon from \"../utils/helpericon\";\nimport InputContainer from \"./container\";\nimport type { IInputRange } from \"./type\";\n\nconst Range = (props: IInputRange) => {\n\tconst {\n\t\tlabel,\n\t\tname,\n\t\tvalue = props.initValue ?? \"\",\n\t\tinitValue,\n\t\tlabelInline,\n\t\tmin = -Infinity,\n\t\tmax = Infinity,\n\t\ttype,\n\t\tclassName,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\ttip,\n\t\tappend,\n\t\tprepend,\n\t\tstep = 1,\n\t\tthousand,\n\t\tprecision,\n\t\thideControl,\n\t\tplaceholder,\n\t\tborder,\n\t\tonChange,\n\t\tonBlur,\n\t\tstyle,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tvalue,\n\t});\n\n\tconst getRangeNumber = (v: number) => clamp(v, min, max);\n\n\tconst getFormatNumber = (v: number) =>\n\t\tformatNumber(v, { precision, thousand });\n\n\tconst formatInputValue = (v?: string | number) => {\n\t\tif (!v) return \"\";\n\t\tif (typeof v === \"number\" || !thousand) return v;\n\n\t\treturn v.replaceAll(thousand, \"\");\n\t};\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>, i: number) => {\n\t\tconst { value } = e.target;\n\t\tconst v = formatInputValue(value.replace(/[^\\d\\.-]/g, \"\"));\n\n\t\tconst range = Array.isArray(state.value) ? state.value : [];\n\t\trange[i] = +v;\n\n\t\tstate.value = range;\n\t\tonChange?.(range, e);\n\t};\n\n\tconst handleOperate = (\n\t\te: MouseEvent<Element>,\n\t\tparam: number,\n\t\ti: number\n\t) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\n\t\tconst range = Array.isArray(state.value) ? state.value : [];\n\t\tconst value = formatInputValue(range[i]) ?? 0;\n\t\tconst result = getRangeNumber(+value + param);\n\n\t\trange[i] = getFormatNumber(result);\n\n\t\tstate.value = range;\n\t\tonChange?.(range, e);\n\t};\n\n\tconst handleSwitch = (e: MouseEvent) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tconst range = state.value ? state.value : [];\n\t\tconst v = range[0];\n\t\trange[0] = range[1];\n\t\trange[1] = v;\n\n\t\tstate.value = range;\n\t\tonChange?.(range);\n\t};\n\n\tuseEffect(() => {\n\t\tstate.value = value;\n\t}, [value]);\n\n\tconst inputProps = {\n\t\tname,\n\t\tclassName: \"i-input i-input-number\",\n\t\t...restProps,\n\t};\n\n\treturn (\n\t\t<InputContainer\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t\ttip={message ?? tip}\n\t\t\tstatus={status}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{prepend && <div className='i-input-prepend'>{prepend}</div>}\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<MinusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, -step, 0)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<input\n\t\t\t\t\tvalue={state.value?.[0] || \"\"}\n\t\t\t\t\tplaceholder={placeholder?.[0]}\n\t\t\t\t\t{...inputProps}\n\t\t\t\t\tonChange={(e) => handleChange(e, 0)}\n\t\t\t\t/>\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<PlusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, step, 0)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<Helpericon\n\t\t\t\t\tactive\n\t\t\t\t\ticon={<SyncAltRound />}\n\t\t\t\t\tstyle={{ margin: 0 }}\n\t\t\t\t\tonClick={handleSwitch}\n\t\t\t\t/>\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<MinusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, -step, 1)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t<input\n\t\t\t\t\tvalue={state.value?.[1] || \"\"}\n\t\t\t\t\tplaceholder={placeholder?.[1]}\n\t\t\t\t\t{...inputProps}\n\t\t\t\t\tonChange={(e) => handleChange(e, 1)}\n\t\t\t\t/>\n\n\t\t\t\t{!hideControl && (\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive\n\t\t\t\t\t\ticon={<PlusRound />}\n\t\t\t\t\t\tonClick={(e) => handleOperate(e, step, 1)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{append && <div className='i-input-append'>{append}</div>}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Range;\n"],"names":["Range","props","label","name","value","initValue","labelInline","min","Infinity","max","type","className","status","message","tip","append","prepend","step","thousand","precision","hideControl","placeholder","border","onChange","onBlur","style","restProps","state","useReactive","formatInputValue","v","replaceAll","handleChange","e","i","target","replace","range","Array","isArray","handleOperate","param","preventDefault","stopPropagation","result","clamp","formatNumber","getFormatNumber","useEffect","inputProps","_jsx","InputContainer","children","_jsxs","classNames","Helpericon","active","icon","MinusRound","onClick","PlusRound","SyncAltRound","margin"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hookModal.js","sources":["../../../packages/components/modal/hookModal.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport { RefObject
|
|
1
|
+
{"version":3,"file":"hookModal.js","sources":["../../../packages/components/modal/hookModal.tsx"],"sourcesContent":["import { useReactive } from \"ahooks\";\nimport type { RefObject } from \"react\";\nimport { useImperativeHandle } from \"react\";\nimport Modal from \"./modal\";\nimport type { IModal, RefHookModal } from \"./type\";\n\nconst HookModal = (\n\tprops: IModal & { ref?: RefObject<RefHookModal | null> }\n) => {\n\tconst { ref } = props;\n\tconst state = useReactive<IModal>({});\n\n\tconst mergedProps = Object.assign({}, props, state);\n\n\tuseImperativeHandle(ref, () => ({\n\t\tupdate: (config: IModal = {}) => {\n\t\t\tObject.assign(state, config);\n\t\t},\n\n\t\tclose: () => {\n\t\t\tstate.visible = false;\n\n\t\t\tif (mergedProps.closable) return;\n\t\t\tPromise.resolve().then(() => {\n\t\t\t\tstate.visible = true;\n\t\t\t});\n\t\t},\n\t}));\n\n\treturn <Modal {...mergedProps} />;\n};\n\nexport default HookModal;\n"],"names":["HookModal","props","ref","state","useReactive","mergedProps","Object","assign","useImperativeHandle","update","config","close","visible","closable","Promise","resolve","then","_jsx","Modal"],"mappings":"mJAMA,MAAMA,EACLC,IAEA,MAAMC,IAAEA,GAAQD,EACVE,EAAQC,EAAoB,IAE5BC,EAAcC,OAAOC,OAAO,CAAA,EAAIN,EAAOE,GAiB7C,OAfAK,EAAoBN,GAAK,KAAO,CAC/BO,OAAQ,CAACC,EAAiB,MACzBJ,OAAOC,OAAOJ,EAAOO,EAAO,EAG7BC,MAAO,KACNR,EAAMS,SAAU,EAEZP,EAAYQ,UAChBC,QAAQC,UAAUC,MAAK,KACtBb,EAAMS,SAAU,CAAI,GACnB,MAIGK,EAACC,EAAU,IAAAb,GAAe"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as o,jsxs as e,Fragment as t}from"react/jsx-runtime";import
|
|
1
|
+
import{jsx as o,jsxs as e,Fragment as t}from"react/jsx-runtime";import i from"classnames";import{useState as n,useRef as r,useEffect as c,useMemo as l}from"react";import{createPortal as s}from"react-dom";import{useKeydown as a}from"../../js/hooks.js";import"../button/index.js";import d from"../utils/helpericon/helpericon.js";import m from"../button/button.js";function u(i){const{title:n,footer:r,hideCloseButton:c,footerLeft:s,okButtonProps:a,cancelButtonProps:u,children:h,onOk:f,onClose:p}=i,k=n||!c,b=async()=>{await(f?.())||p?.()},C=l((()=>{if(r||null===r)return r;const i=Object.assign({children:"确定",onClick:b},a),n=Object.assign({secondary:!0,children:"关闭",onClick:p},u);return e(t,{children:[s,o(m,{...i}),o(m,{...n})]})}),[r,a,u]);return e(t,{children:[k&&e("header",{className:"i-modal-header",children:[n&&o("b",{children:n}),o(d,{active:!c,className:"i-modal-close",onClick:p})]}),o("div",{className:"i-modal-content",children:h}),o("footer",{className:"i-modal-footer",children:C})]})}function h(t){const{visible:l,title:d,footer:m,okButtonProps:h,cancelButtonProps:f,closable:p=!0,hideBackdrop:k,backdropClosable:b=!0,hideCloseButton:C,disableEsc:B,width:j,height:v,customized:N,fixed:P,hideShadow:g,children:y,style:O,className:w,keepDOM:x,footerLeft:E,onClick:L,onVisibleChange:T,onClose:z,onOk:D,...M}=t,[S,V]=n(l),[q,A]=n(!1),[F,G]=n(!1),H=r(!0),I=()=>{if(H.current){if(H.current=!1,!p)return G(!0),void setTimeout((()=>{G(!1),H.current=!0}),400);A(!1),setTimeout((()=>{!x&&V(!1),H.current=!0,T?.(!1),z?.()}),240)}};return a((o=>{"Escape"===o.code&&l&&I()}),{disabled:B}),c((()=>{l?H.current&&((!x||!S)&&V(!0),H.current=!1,setTimeout((()=>{A(!0),T?.(!0),H.current=!0}),24)):I()}),[l]),S?s(o("div",{className:i("i-modal-container",{"i-modal-backdrop":!k,"i-modal-customized":N,"i-modal-active":q,fixed:P},w),style:O,onClick:function(){b&&I()},children:e("div",{className:i("i-modal",{bounced:F,shadow:!g}),style:{width:j,height:v},onClick:o=>{o.stopPropagation(),document.documentElement.click(),L?.(o)},...M,children:[N&&y,!N&&o(u,{title:d,hideCloseButton:C,footer:m,okButtonProps:h,cancelButtonProps:f,children:y,footerLeft:E,onOk:D,onClose:I})]})}),document.body):null}export{h as default};
|
|
2
2
|
//# sourceMappingURL=modal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal.js","sources":["../../../packages/components/modal/modal.tsx"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"modal.js","sources":["../../../packages/components/modal/modal.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useKeydown } from \"../../js/hooks\";\nimport Button from \"../button\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport { CompositionModal, IModal, IModalContent } from \"./type\";\n\nfunction DefaultContent(props: IModalContent) {\n\tconst {\n\t\ttitle,\n\t\tfooter,\n\t\thideCloseButton,\n\t\tfooterLeft,\n\t\tokButtonProps,\n\t\tcancelButtonProps,\n\t\tchildren,\n\t\tonOk,\n\t\tonClose,\n\t} = props;\n\tconst showHeader = title || !hideCloseButton;\n\n\tconst handleOk = async () => {\n\t\tconst ret = await onOk?.();\n\n\t\tif (ret) return;\n\n\t\tonClose?.();\n\t};\n\n\tconst renderFooter = useMemo(() => {\n\t\tif (footer || footer === null) return footer;\n\n\t\tconst propsOk = Object.assign(\n\t\t\t{\n\t\t\t\tchildren: \"确定\",\n\t\t\t\tonClick: handleOk,\n\t\t\t},\n\t\t\tokButtonProps\n\t\t);\n\t\tconst propsCancel = Object.assign(\n\t\t\t{\n\t\t\t\tsecondary: true,\n\t\t\t\tchildren: \"关闭\",\n\t\t\t\tonClick: onClose,\n\t\t\t},\n\t\t\tcancelButtonProps\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{footerLeft}\n\t\t\t\t<Button {...propsOk} />\n\t\t\t\t<Button {...propsCancel} />\n\t\t\t</>\n\t\t);\n\t}, [footer, okButtonProps, cancelButtonProps]);\n\n\treturn (\n\t\t<>\n\t\t\t{showHeader && (\n\t\t\t\t<header className='i-modal-header'>\n\t\t\t\t\t{title && <b>{title}</b>}\n\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive={!hideCloseButton}\n\t\t\t\t\t\tclassName='i-modal-close'\n\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t/>\n\t\t\t\t</header>\n\t\t\t)}\n\n\t\t\t<div className='i-modal-content'>{children}</div>\n\n\t\t\t<footer className='i-modal-footer'>{renderFooter}</footer>\n\t\t</>\n\t);\n}\n\nfunction Modal(props: IModal) {\n\tconst {\n\t\tvisible,\n\t\ttitle,\n\t\tfooter,\n\t\tokButtonProps,\n\t\tcancelButtonProps,\n\t\tclosable = true,\n\t\thideBackdrop,\n\t\tbackdropClosable = true,\n\t\thideCloseButton,\n\t\tdisableEsc,\n\t\twidth,\n\t\theight,\n\t\tcustomized,\n\t\tfixed,\n\t\thideShadow,\n\t\tchildren,\n\t\tstyle,\n\t\tclassName,\n\t\tkeepDOM,\n\t\tfooterLeft,\n\t\tonClick,\n\t\tonVisibleChange,\n\t\tonClose,\n\t\tonOk,\n\t\t...restProps\n\t} = props;\n\tconst [show, setShow] = useState(visible);\n\tconst [active, setActive] = useState(false);\n\tconst [bounced, setBounced] = useState(false);\n\tconst toggable = useRef(true);\n\n\tconst handleShow = () => {\n\t\tif (!toggable.current) return;\n\n\t\t(!keepDOM || !show) && setShow(true);\n\t\ttoggable.current = false;\n\t\tsetTimeout(() => {\n\t\t\tsetActive(true);\n\t\t\tonVisibleChange?.(true);\n\t\t\ttoggable.current = true;\n\t\t}, 24);\n\t};\n\n\tconst handleHide = () => {\n\t\tif (!toggable.current) return;\n\t\ttoggable.current = false;\n\n\t\tif (!closable) {\n\t\t\tsetBounced(true);\n\t\t\tsetTimeout(() => {\n\t\t\t\tsetBounced(false);\n\t\t\t\ttoggable.current = true;\n\t\t\t}, 400);\n\t\t\treturn;\n\t\t}\n\n\t\tsetActive(false);\n\t\tsetTimeout(() => {\n\t\t\t!keepDOM && setShow(false);\n\t\t\ttoggable.current = true;\n\t\t\tonVisibleChange?.(false);\n\t\t\tonClose?.();\n\t\t}, 240);\n\t};\n\n\tconst handleBackdropClick = function () {\n\t\tbackdropClosable && handleHide();\n\t};\n\n\tuseKeydown(\n\t\t(e) => {\n\t\t\tif (e.code !== \"Escape\" || !visible) return;\n\t\t\thandleHide();\n\t\t},\n\t\t{ disabled: disableEsc }\n\t);\n\n\tuseEffect(() => {\n\t\tvisible ? handleShow() : handleHide();\n\t}, [visible]);\n\n\tif (!show) return null;\n\n\treturn createPortal(\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-modal-container\",\n\t\t\t\t{\n\t\t\t\t\t\"i-modal-backdrop\": !hideBackdrop,\n\t\t\t\t\t\"i-modal-customized\": customized,\n\t\t\t\t\t\"i-modal-active\": active,\n\t\t\t\t\tfixed,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={style}\n\t\t\tonClick={handleBackdropClick}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-modal\", {\n\t\t\t\t\tbounced,\n\t\t\t\t\tshadow: !hideShadow,\n\t\t\t\t})}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth,\n\t\t\t\t\theight,\n\t\t\t\t}}\n\t\t\t\tonClick={(e) => {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\tdocument.documentElement.click();\n\t\t\t\t\tonClick?.(e);\n\t\t\t\t}}\n\t\t\t\t{...restProps}\n\t\t\t>\n\t\t\t\t{customized && children}\n\n\t\t\t\t{!customized && (\n\t\t\t\t\t<DefaultContent\n\t\t\t\t\t\ttitle={title}\n\t\t\t\t\t\thideCloseButton={hideCloseButton}\n\t\t\t\t\t\tfooter={footer}\n\t\t\t\t\t\tokButtonProps={okButtonProps}\n\t\t\t\t\t\tcancelButtonProps={cancelButtonProps}\n\t\t\t\t\t\tchildren={children}\n\t\t\t\t\t\tfooterLeft={footerLeft}\n\t\t\t\t\t\tonOk={onOk}\n\t\t\t\t\t\tonClose={handleHide}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\nexport default Modal as CompositionModal;\n"],"names":["DefaultContent","props","title","footer","hideCloseButton","footerLeft","okButtonProps","cancelButtonProps","children","onOk","onClose","showHeader","handleOk","async","renderFooter","useMemo","propsOk","Object","assign","onClick","propsCancel","secondary","_jsxs","_Fragment","_jsx","Button","className","Helpericon","active","Modal","visible","closable","hideBackdrop","backdropClosable","disableEsc","width","height","customized","fixed","hideShadow","style","keepDOM","onVisibleChange","restProps","show","setShow","useState","setActive","bounced","setBounced","toggable","useRef","handleHide","current","setTimeout","useKeydown","e","code","disabled","useEffect","createPortal","classNames","shadow","stopPropagation","document","documentElement","click","body"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r}from"react/jsx-runtime";import{
|
|
1
|
+
import{jsx as r}from"react/jsx-runtime";import{useRef as o}from"react";import{renderNode as t}from"../../js/utils.js";import e from"./hookModal.js";function n(){const n=o(null);return{open:o=>{const s=t(r(e,{ref:n,visible:!0,...o,onClose:()=>{o.onClose?.(),s?.()}}))},update:r=>{if(!n.current)return;const{update:o}=n.current;o(r)},close:()=>{if(!n.current)return;const{close:r}=n.current;r()}}}export{n as default};
|
|
2
2
|
//# sourceMappingURL=useModal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useModal.js","sources":["../../../packages/components/modal/useModal.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"useModal.js","sources":["../../../packages/components/modal/useModal.tsx"],"sourcesContent":["import { useRef } from \"react\";\nimport { renderNode } from \"../../js/utils\";\nimport HookModal from \"./hookModal\";\nimport { IModal, RefHookModal } from \"./type\";\n\nexport default function useModal() {\n\tconst ref = useRef<RefHookModal>(null);\n\n\tconst handleOpen = (props: IModal) => {\n\t\tconst unMount = renderNode(\n\t\t\t<HookModal\n\t\t\t\tref={ref}\n\t\t\t\tvisible\n\t\t\t\t{...props}\n\t\t\t\tonClose={() => {\n\t\t\t\t\tprops.onClose?.();\n\t\t\t\t\tunMount?.();\n\t\t\t\t}}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst handleUpdate = (props: IModal) => {\n\t\tif (!ref.current) return;\n\n\t\tconst { update } = ref.current;\n\t\tupdate(props);\n\t};\n\n\tconst handleClose = () => {\n\t\tif (!ref.current) return;\n\n\t\tconst { close } = ref.current;\n\t\tclose();\n\t};\n\n\treturn {\n\t\topen: handleOpen,\n\t\tupdate: handleUpdate,\n\t\tclose: handleClose,\n\t};\n}\n"],"names":["useModal","ref","useRef","open","props","unMount","renderNode","_jsx","HookModal","visible","onClose","update","current","close"],"mappings":"oJAKc,SAAUA,IACvB,MAAMC,EAAMC,EAAqB,MA8BjC,MAAO,CACNC,KA7BmBC,IACnB,MAAMC,EAAUC,EACfC,EAACC,GACAP,IAAKA,EACLQ,SACI,KAAAL,EACJM,QAAS,KACRN,EAAMM,YACNL,KAAW,IAGb,EAmBDM,OAhBqBP,IACrB,IAAKH,EAAIW,QAAS,OAElB,MAAMD,OAAEA,GAAWV,EAAIW,QACvBD,EAAOP,EAAM,EAabS,MAVmB,KACnB,IAAKZ,EAAIW,QAAS,OAElB,MAAMC,MAAEA,GAAUZ,EAAIW,QACtBC,GAAO,EAQT"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as o,Fragment as l}from"react/jsx-runtime";import a from"@rc-component/color-picker";import
|
|
1
|
+
import{jsx as e,jsxs as o,Fragment as l}from"react/jsx-runtime";import a from"@rc-component/color-picker";import{useReactive as n}from"ahooks";import{useEffect as i}from"react";import r from"../../popup/popup.js";import t,{ColorMethods as p}from"./footer.js";import s from"./handle.js";function c(c){const{value:u,type:h="HEX",disabledAlpha:m,children:v,usePanel:d,handle:b="both",placeholder:y="Colors",popupProps:f,onChange:g}=c,C=n({type:h,value:u,syncValue:u,visible:f?.visible}),V=e=>{const o=p[e];C.type=e,C.value=C.syncValue[o]?.()},j=e=>{C.value=e,C.syncValue=e},k=()=>{g?.(C.value),C.visible=!1};return i((()=>{C.syncValue=u,C.value=u}),[u]),d?e(a,{...c}):e(r,{trigger:"click",touchable:!0,position:"bottom",...f,visible:C.visible,content:e(a,{value:C.syncValue,disabledAlpha:m,panelRender:a=>o(l,{children:[a,e(t,{value:C.value,type:C.type,onTypeChange:V,onChange:j,onOk:k})]}),onChange:e=>{C.syncValue=e},onChangeComplete:e=>{const o=p[C.type];1!==e.a&&(e.a=parseFloat(e.a.toFixed(3))),C.value=e[o]?.()}}),onVisibleChange:e=>{C.visible=e,f?.onVisibleChange?.(e)},children:v??e(s,{color:u,handle:b,placeholder:y})})}export{c as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../packages/components/picker/colors/index.tsx"],"sourcesContent":["import ColorsPanel from \"@rc-component/color-picker\";\nimport
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../packages/components/picker/colors/index.tsx"],"sourcesContent":["import ColorsPanel from \"@rc-component/color-picker\";\nimport { useReactive } from \"ahooks\";\nimport { useEffect } from \"react\";\nimport Popup from \"../../popup\";\nimport { IColorPicker } from \"../type\";\nimport Footer, { ColorMethods } from \"./footer\";\nimport Handle from \"./handle\";\nimport \"./index.css\";\n\nexport default function ColorPicker(props: IColorPicker) {\n\tconst {\n\t\tvalue,\n\t\ttype = \"HEX\",\n\t\tdisabledAlpha,\n\t\tchildren,\n\t\tusePanel,\n\t\thandle = \"both\",\n\t\tplaceholder = \"Colors\",\n\t\tpopupProps,\n\t\tonChange,\n\t} = props;\n\n\tconst state = useReactive({\n\t\ttype,\n\t\tvalue,\n\t\tsyncValue: value,\n\t\tvisible: popupProps?.visible,\n\t});\n\n\tconst handleChange = (target) => {\n\t\tstate.syncValue = target;\n\t};\n\n\tconst handleComplete = (target) => {\n\t\tconst method = ColorMethods[state.type];\n\n\t\tif (target.a !== 1) {\n\t\t\ttarget.a = parseFloat(target.a.toFixed(3));\n\t\t}\n\n\t\tstate.value = target[method]?.();\n\t};\n\n\tconst handleVisibleChange = (v: boolean) => {\n\t\tstate.visible = v;\n\t\tpopupProps?.onVisibleChange?.(v);\n\t};\n\n\tconst handleTypeChange = (t) => {\n\t\tconst method = ColorMethods[t];\n\n\t\tstate.type = t;\n\t\tstate.value = state.syncValue[method]?.();\n\t};\n\n\tconst handleValueChange = (v) => {\n\t\tstate.value = v;\n\t\tstate.syncValue = v;\n\t};\n\n\tconst handleOk = () => {\n\t\tonChange?.(state.value);\n\t\tstate.visible = false;\n\t};\n\n\tuseEffect(() => {\n\t\tstate.syncValue = value;\n\t\tstate.value = value;\n\t}, [value]);\n\n\tif (usePanel) {\n\t\treturn <ColorsPanel {...props} />;\n\t}\n\n\treturn (\n\t\t<Popup\n\t\t\ttrigger='click'\n\t\t\ttouchable\n\t\t\tposition='bottom'\n\t\t\t{...popupProps}\n\t\t\tvisible={state.visible}\n\t\t\tcontent={\n\t\t\t\t<ColorsPanel\n\t\t\t\t\tvalue={state.syncValue}\n\t\t\t\t\tdisabledAlpha={disabledAlpha}\n\t\t\t\t\tpanelRender={(panel) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{panel}\n\t\t\t\t\t\t\t\t<Footer\n\t\t\t\t\t\t\t\t\tvalue={state.value}\n\t\t\t\t\t\t\t\t\ttype={state.type}\n\t\t\t\t\t\t\t\t\tonTypeChange={handleTypeChange}\n\t\t\t\t\t\t\t\t\tonChange={handleValueChange}\n\t\t\t\t\t\t\t\t\tonOk={handleOk}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t);\n\t\t\t\t\t}}\n\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\tonChangeComplete={handleComplete}\n\t\t\t\t/>\n\t\t\t}\n\t\t\tonVisibleChange={handleVisibleChange}\n\t\t>\n\t\t\t{children ?? (\n\t\t\t\t<Handle\n\t\t\t\t\tcolor={value}\n\t\t\t\t\thandle={handle}\n\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Popup>\n\t);\n}\n"],"names":["ColorPicker","props","value","type","disabledAlpha","children","usePanel","handle","placeholder","popupProps","onChange","state","useReactive","syncValue","visible","handleTypeChange","t","method","ColorMethods","handleValueChange","v","handleOk","useEffect","_jsx","ColorsPanel","Popup","trigger","touchable","position","content","panelRender","panel","_jsxs","_Fragment","Footer","onTypeChange","onOk","target","onChangeComplete","a","parseFloat","toFixed","onVisibleChange","Handle","color"],"mappings":"8RASwB,SAAAA,EAAYC,GACnC,MAAMC,MACLA,EAAKC,KACLA,EAAO,MAAKC,cACZA,EAAaC,SACbA,EAAQC,SACRA,EAAQC,OACRA,EAAS,OAAMC,YACfA,EAAc,SAAQC,WACtBA,EAAUC,SACVA,GACGT,EAEEU,EAAQC,EAAY,CACzBT,OACAD,QACAW,UAAWX,EACXY,QAASL,GAAYK,UAsBhBC,EAAoBC,IACzB,MAAMC,EAASC,EAAaF,GAE5BL,EAAMR,KAAOa,EACbL,EAAMT,MAAQS,EAAME,UAAUI,MAAW,EAGpCE,EAAqBC,IAC1BT,EAAMT,MAAQkB,EACdT,EAAME,UAAYO,CAAC,EAGdC,EAAW,KAChBX,IAAWC,EAAMT,OACjBS,EAAMG,SAAU,CAAK,EAQtB,OALAQ,GAAU,KACTX,EAAME,UAAYX,EAClBS,EAAMT,MAAQA,CAAK,GACjB,CAACA,IAEAI,EACIiB,EAACC,EAAgB,IAAAvB,IAIxBsB,EAACE,GACAC,QAAQ,QACRC,aACAC,SAAS,YACLnB,EACJK,QAASH,EAAMG,QACfe,QACCN,EAACC,GACAtB,MAAOS,EAAME,UACbT,cAAeA,EACf0B,YAAcC,GAEZC,EAAAC,EAAA,CAAA5B,SAAA,CACE0B,EACDR,EAACW,EAAM,CACNhC,MAAOS,EAAMT,MACbC,KAAMQ,EAAMR,KACZgC,aAAcpB,EACdL,SAAUS,EACViB,KAAMf,OAKVX,SAtEkB2B,IACrB1B,EAAME,UAAYwB,CAAM,EAsErBC,iBAnEoBD,IACvB,MAAMpB,EAASC,EAAaP,EAAMR,MAEjB,IAAbkC,EAAOE,IACVF,EAAOE,EAAIC,WAAWH,EAAOE,EAAEE,QAAQ,KAGxC9B,EAAMT,MAAQmC,EAAOpB,MAAW,IA+D/ByB,gBA5D2BtB,IAC5BT,EAAMG,QAAUM,EAChBX,GAAYiC,kBAAkBtB,EAAE,EA0DKf,SAEnCA,GACAkB,EAACoB,GACAC,MAAO1C,EACPK,OAAQA,EACRC,YAAaA,KAKlB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as r,Fragment as t,jsx as e}from"react/jsx-runtime";import{
|
|
1
|
+
import{jsxs as r,Fragment as t,jsx as e}from"react/jsx-runtime";import{useReactive as o,useCreation as n}from"ahooks";import{useRef as s,useMemo as c,useEffect as i,useLayoutEffect as u,Children as a,isValidElement as l,cloneElement as f}from"react";import{useMouseUp as p,useResizeObserver as h}from"../../js/hooks.js";import{getPointPosition as w,getPosition as m}from"../../js/utils.js";import g from"./content.js";function y(y){const{visible:d=!1,content:v,trigger:b="hover",gap:x=12,offset:j=8,fixed:P,position:k="top",showDelay:T=16,hideDelay:C=12,touchable:M,arrow:N=!0,align:W,fitSize:D,watchResize:O,clickOutside:z=!0,disabled:E,referToWindow:L,style:X,className:Y,getContainer:B,children:F,onVisibleChange:H}=y,R=s(null),S=s(null),V=s(null),q=s(""),A=o({show:!1,style:{position:P?"fixed":"absolute"},arrowProps:{}});p((r=>{if(!R.current||!S.current||!z)return;const t=r.target,e=R.current.contains(t)||S.current.contains(t);A.show&&!e&&K(!1)}));const G=()=>{V.current&&(clearTimeout(V.current),V.current=null)},I=()=>{E||A.show&&("hover"!==b||"hover"===b&&!M)||(A.show=!0,q.current="showing",V.current=setTimeout((()=>{if("showing"!==q.current)return;const[r,t,{arrowX:e,arrowY:o,arrowPos:n}]=m(R.current,S.current,{position:k,gap:x,offset:j,align:W,refWindow:L});A.style={...A.style,opacity:1,transform:"none",left:r,top:t},A.arrowProps={left:e,top:o,pos:n},H?.(!0),G(),q.current=""}),T))},J=()=>{A.show&&(q.current="hiding",V.current=setTimeout((()=>{"hiding"===q.current?(A.style={...A.style,opacity:0,transform:"translate(0, 2px)"},setTimeout((()=>{A.show=!1,G(),H?.(!1),q.current=""}),160)):G()}),C))},K=r=>{void 0===r?A.show?J():I():r?I():J()},Q=n((()=>({click:{onClick:()=>K(!0)},hover:{onMouseEnter:()=>K(!0),onMouseLeave:()=>K(!1)},focus:{onFocus:()=>K(!0),onBlur:()=>K(!1)},contextmenu:{onContextMenu:r=>{if(r.preventDefault(),r.stopPropagation(),A.show){const[t,e]=w(r,S.current);A.style={...A.style,left:t,top:e}}else A.show=!0,V.current=setTimeout((()=>{const[t,e]=w(r,S.current);A.style={...A.style,opacity:1,transform:"none",left:t,top:e},G(),H?.(!0)}),T)}},none:{}})),[]),U=c((()=>{if(!M)return{};const r={};return"hover"===b&&(r.onMouseEnter=()=>{G()},r.onMouseLeave=()=>K(!1)),r}),[M,b]),Z=()=>{if(!A.show)return;const[r,t,{arrowX:e,arrowY:o,arrowPos:n}]=m(R.current,S.current,{position:k,gap:x,offset:j,align:W,refWindow:L});Object.assign(A,{style:{...A.style,left:r,top:t},arrowProps:{left:e,top:o,pos:n}})};return i((()=>{if("contextmenu"===b)return;const{observe:r,unobserve:t,disconnect:e}=h();return R.current&&r(R.current,Z),O&&S.current?(r(S.current,Z),()=>{O&&S.current&&(t(S.current),R.current&&t(R.current),e())}):void 0}),[O,S.current,R.current]),u((()=>{if(!D||!A.show)return;const r=["top","bottom"].includes(k),t=R.current?.[r?"offsetWidth":"offsetHeight"];A.style={...A.style,[r?"width":"height"]:t}}),[A.show,D]),u((()=>{K(d)}),[d]),r(t,{children:[a.map(F,(r=>{if(!l(r))return;const{className:t,...e}=r.props;return Object.keys(Q[b]).map((r=>{if(!e[r])return;const t=Q[b][r];Q[b][r]=o=>{t(),e[r](o)}})),f(r,{ref:R,className:t,...e,...Q[b]})})),A.show&&e(g,{ref:S,arrow:N&&"contextmenu"!==b,style:{...X,...A.style},arrowProps:A.arrowProps,className:Y,...U,trigger:R.current,getContainer:B,children:v})]})}export{y as default};
|
|
2
2
|
//# sourceMappingURL=popup.js.map
|