@iziui/react 0.0.87-rc → 0.0.88-rc
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/dist/.types/actions/ButtonIcon/ButtonIcon.d.ts +1 -1
- package/dist/.types/actions/ButtonIcon/ButtonIcon.d.ts.map +1 -1
- package/dist/.types/display/Icon/Icon.d.ts +2 -0
- package/dist/.types/display/Icon/Icon.d.ts.map +1 -1
- package/dist/.types/display/Icon/Icon.stories.d.ts.map +1 -1
- package/dist/.types/lab/Form/Form.stories.d.ts.map +1 -1
- package/dist/chunks/{Alert-c5rRrf_E.cjs → Alert-Cc5S-AfT.cjs} +2 -2
- package/dist/chunks/{Alert-c5rRrf_E.cjs.map → Alert-Cc5S-AfT.cjs.map} +1 -1
- package/dist/chunks/{Alert-CxSNWq4w.js → Alert-DJexLc9y.js} +2 -2
- package/dist/chunks/{Alert-CxSNWq4w.js.map → Alert-DJexLc9y.js.map} +1 -1
- package/dist/chunks/ButtonIcon-B-M87M5L.cjs +2 -0
- package/dist/chunks/ButtonIcon-B-M87M5L.cjs.map +1 -0
- package/dist/chunks/ButtonIcon-D0YH7wS6.js +2 -0
- package/dist/chunks/ButtonIcon-D0YH7wS6.js.map +1 -0
- package/dist/chunks/{DrawerContent-CQrCertn.cjs → DrawerContent-CvWZGjje.cjs} +2 -2
- package/dist/chunks/{DrawerContent-CQrCertn.cjs.map → DrawerContent-CvWZGjje.cjs.map} +1 -1
- package/dist/chunks/{DrawerContent-DuvNqOEG.js → DrawerContent-DswF1783.js} +2 -2
- package/dist/chunks/{DrawerContent-DuvNqOEG.js.map → DrawerContent-DswF1783.js.map} +1 -1
- package/dist/chunks/Icon-0KfCwKWR.js +2 -0
- package/dist/chunks/Icon-0KfCwKWR.js.map +1 -0
- package/dist/chunks/Icon-Dv3oduiN.cjs +2 -0
- package/dist/chunks/Icon-Dv3oduiN.cjs.map +1 -0
- package/dist/components/Alert/index.cjs +1 -1
- package/dist/components/Alert/index.js +1 -1
- package/dist/components/Avatar/index.cjs +1 -1
- package/dist/components/Avatar/index.js +1 -1
- package/dist/components/ButtonIcon/index.cjs +1 -1
- package/dist/components/ButtonIcon/index.js +1 -1
- package/dist/components/ColorPicker/index.cjs +1 -1
- package/dist/components/ColorPicker/index.js +1 -1
- package/dist/components/Drawer/index.cjs +1 -1
- package/dist/components/Drawer/index.js +1 -1
- package/dist/components/Icon/index.cjs +1 -1
- package/dist/components/Icon/index.js +1 -1
- package/dist/components/Modal/index.cjs +1 -1
- package/dist/components/Modal/index.cjs.map +1 -1
- package/dist/components/Modal/index.js +1 -1
- package/dist/components/Modal/index.js.map +1 -1
- package/dist/components/Select/index.cjs +1 -1
- package/dist/components/Select/index.js +1 -1
- package/dist/components/Switch/index.cjs +1 -1
- package/dist/components/Switch/index.cjs.map +1 -1
- package/dist/components/Switch/index.js +1 -1
- package/dist/components/Switch/index.js.map +1 -1
- package/dist/components/Toast/index.cjs +1 -1
- package/dist/components/Toast/index.js +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/style.css +4 -4
- package/package.json +1 -1
- package/dist/chunks/ButtonIcon-Cad6goHv.js +0 -2
- package/dist/chunks/ButtonIcon-Cad6goHv.js.map +0 -1
- package/dist/chunks/ButtonIcon-QfMInabj.cjs +0 -2
- package/dist/chunks/ButtonIcon-QfMInabj.cjs.map +0 -1
- package/dist/chunks/Icon-BGZ3K3Nf.js +0 -2
- package/dist/chunks/Icon-BGZ3K3Nf.js.map +0 -1
- package/dist/chunks/Icon-D5fDXkwG.cjs +0 -2
- package/dist/chunks/Icon-D5fDXkwG.cjs.map +0 -1
|
@@ -6,6 +6,6 @@ export interface ButtonIconProps extends PropsWithChildren<ButtonHTMLAttributes<
|
|
|
6
6
|
size?: number;
|
|
7
7
|
children: ReactElement<IconProps>;
|
|
8
8
|
}
|
|
9
|
-
declare const _default: import('react').FC<import('../../
|
|
9
|
+
declare const _default: import('react').FC<import('../../_internal/core/system').Sx<ButtonIconProps>>;
|
|
10
10
|
export default _default;
|
|
11
11
|
//# sourceMappingURL=ButtonIcon.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonIcon.d.ts","sourceRoot":"","sources":["../../../../src/actions/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,KAAK,oBAAoB,EAAE,KAAK,iBAAiB,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAI3G,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"ButtonIcon.d.ts","sourceRoot":"","sources":["../../../../src/actions/ButtonIcon/ButtonIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,KAAK,oBAAoB,EAAE,KAAK,iBAAiB,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAI3G,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAGhD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAIhD,OAAO,0CAA0C,CAAC;AAElD,MAAM,WAAW,eAAgB,SAAQ,iBAAiB,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAAC;IACjG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;CACnC;;AA8BD,wBAA2C"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { HTMLAttributes } from 'react';
|
|
2
|
+
import { Colors } from '../../_internal/core/theme';
|
|
2
3
|
export interface IconProps extends HTMLAttributes<HTMLElement> {
|
|
3
4
|
name: string;
|
|
4
5
|
size?: number;
|
|
6
|
+
color?: Colors;
|
|
5
7
|
}
|
|
6
8
|
declare const _default: import('react').FC<import('../../_internal/core/system').Sx<IconProps>>;
|
|
7
9
|
export default _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/display/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/display/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAIhD,OAAO,oCAAoC,CAAC;AAE5C,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;;AAgBD,wBAAqC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.stories.d.ts","sourceRoot":"","sources":["../../../../src/display/Icon/Icon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAOvD,OAAO,IAAI,MAAM,QAAQ,CAAC;AAK1B,eAAO,MAAM,WAAW,EAAE,QAAQ,CAAC,OAAO,IAAI,CAa7C,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,QAAQ,CAAC,OAAO,IAAI,CAqBtC,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAC,OAAO,IAAI,
|
|
1
|
+
{"version":3,"file":"Icon.stories.d.ts","sourceRoot":"","sources":["../../../../src/display/Icon/Icon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAOvD,OAAO,IAAI,MAAM,QAAQ,CAAC;AAK1B,eAAO,MAAM,WAAW,EAAE,QAAQ,CAAC,OAAO,IAAI,CAa7C,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,QAAQ,CAAC,OAAO,IAAI,CAqBtC,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAC,OAAO,IAAI,CAezC,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,QAAQ,CAAC,OAAO,IAAI,CAE5C,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAqE3B,CAAC;AAEF,eAAe,IAAI,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.stories.d.ts","sourceRoot":"","sources":["../../../../src/lab/Form/Form.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"Form.stories.d.ts","sourceRoot":"","sources":["../../../../src/lab/Form/Form.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AASvD,OAAO,IAAI,MAAM,QAAQ,CAAC;AAU1B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAe3B,CAAC;AAeF,eAAO,MAAM,QAAQ,EAAE,QAAQ,CAAC,OAAO,IAAI,CAiC1C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,QAAQ,CAAC,OAAO,IAAI,CA+B1C,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,QAAQ,CAAC,OAAO,IAAI,CAsB7C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,QAAQ,CAAC,OAAO,IAAI,CA+D5C,CAAC;AAEF,eAAe,IAAI,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const e=require("react/jsx-runtime"),d=require("react"),t=require("./index-DYxwT4uW.cjs"),i=require("./joinClass-Jk3EszKD.cjs"),j=require("./useTheme-DhX2tM8O.cjs"),a=require("./Stack-DsVkiTT_.cjs"),$=require("./Typography-C7B3jwUf.cjs"),q=require("./ButtonIcon-
|
|
2
|
-
//# sourceMappingURL=Alert-
|
|
1
|
+
"use strict";const e=require("react/jsx-runtime"),d=require("react"),t=require("./index-DYxwT4uW.cjs"),i=require("./joinClass-Jk3EszKD.cjs"),j=require("./useTheme-DhX2tM8O.cjs"),a=require("./Stack-DsVkiTT_.cjs"),$=require("./Typography-C7B3jwUf.cjs"),q=require("./ButtonIcon-B-M87M5L.cjs"),y=require("./createComponent-BBXW0GJ6.cjs"),h=require("./Icon-Dv3oduiN.cjs");function g({children:n,icon:s,color:r="primary",onClose:c,...o}){const{theme:{mode:l}}=j.useTheme(),u=i.joinClass(`${t.prefix}-alert`,`${t.prefix}-alert--${l}`,`${t.prefix}-alert--${r}`,o.className),m=i.joinClass(`${t.prefix}-alert__button`,`${t.prefix}-alert__button--${r}`),x=()=>typeof n=="string"?e.jsx($.Typography,{variant:"body1",style:{color:"currentcolor"},children:n}):n,f=p=>d.cloneElement(p,{color:`${r}.dark`});return e.jsxs(a.Stack,{fullWidth:!0,gap:0,flexDirection:"row",alignItems:"center",justifyContent:"center",...o,className:u,children:[e.jsxs(a.Stack,{fullWidth:!0,gap:8,flexDirection:"row",alignItems:"center",className:`${t.prefix}-alert__content`,children:[s&&f(s),x()]}),c&&e.jsx("div",{children:e.jsx(q.ButtonIcon,{className:m,onClick:c,color:r,style:{color:"currentColor"},children:e.jsx(h.Icon,{name:"times"})})})]})}const C=y.createComponent(g);exports.Alert=C;
|
|
2
|
+
//# sourceMappingURL=Alert-Cc5S-AfT.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert-
|
|
1
|
+
{"version":3,"file":"Alert-Cc5S-AfT.cjs","sources":["../../src/feedback/Alert/Alert.tsx"],"sourcesContent":["import { cloneElement, type HtmlHTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport { useTheme } from '@/theme';\nimport Stack from '@/layout/Stack';\nimport Typography from '@/display/Typography';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport createComponent from '@/core/createComponent';\nimport Icon, { type IconProps } from '@/display/Icon';\n\nimport '@iziui/styles/components/Alert.scss';\n\nexport interface AlertProps extends HtmlHTMLAttributes<HTMLDivElement> {\n color?: Colors;\n icon?: React.JSX.Element;\n children: React.ReactNode;\n onClose?: () => void;\n}\n\nfunction Alert({\n children,\n icon,\n color = 'primary',\n onClose,\n ...props\n}: AlertProps) {\n const { theme: { mode } } = useTheme();\n\n const className = joinClass(\n `${prefix}-alert`,\n `${prefix}-alert--${mode}`,\n `${prefix}-alert--${color}`,\n props.className\n );\n\n const classNameAction = joinClass(\n `${prefix}-alert__button`,\n `${prefix}-alert__button--${color}`,\n );\n\n const renderMessage = () => {\n if (typeof children === 'string') {\n return (\n <Typography variant=\"body1\" style={{ color: 'currentcolor' }}>\n {children}\n </Typography>\n );\n }\n\n return children;\n };\n\n const renderIcon = (icon: React.JSX.Element) => {\n return cloneElement<IconProps>(icon, {\n color: `${color}.dark`\n });\n };\n\n return (\n <Stack\n fullWidth\n gap={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n {...props}\n className={className}\n >\n <Stack\n fullWidth\n gap={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n className={`${prefix}-alert__content`}\n >\n {icon && renderIcon(icon)}\n {renderMessage()}\n </Stack>\n {\n onClose && (\n <div>\n <ButtonIcon\n className={classNameAction}\n onClick={onClose}\n color={color}\n style={{ color: 'currentColor' }}\n >\n <Icon name=\"times\" />\n </ButtonIcon>\n </div>)\n }\n </Stack>\n );\n}\n\nexport default createComponent(Alert);"],"names":["Alert","children","icon","color","onClose","props","mode","useTheme","className","joinClass","prefix","classNameAction","renderMessage","jsx","Typography","renderIcon","cloneElement","jsxs","Stack","ButtonIcon","Icon","createComponent"],"mappings":"+WAuBA,SAASA,EAAM,CACb,SAAAC,EACA,KAAAC,EACA,MAAAC,EAAQ,UACR,QAAAC,EACA,GAAGC,CACL,EAAe,CACb,KAAM,CAAE,MAAO,CAAE,KAAAC,CAAA,CAAK,EAAMC,EAAAA,SAAA,EAEtBC,EAAYC,EAAAA,UAChB,GAAGC,EAAAA,MAAM,SACT,GAAGA,EAAAA,MAAM,WAAWJ,CAAI,GACxB,GAAGI,EAAAA,MAAM,WAAWP,CAAK,GACzBE,EAAM,SAAA,EAGFM,EAAkBF,EAAAA,UACtB,GAAGC,EAAAA,MAAM,iBACT,GAAGA,EAAAA,MAAM,mBAAmBP,CAAK,EAAA,EAG7BS,EAAgB,IAChB,OAAOX,GAAa,SAEpBY,MAACC,EAAAA,YAAW,QAAQ,QAAQ,MAAO,CAAE,MAAO,gBACzC,SAAAb,EACH,EAIGA,EAGHc,EAAcb,GACXc,EAAAA,aAAwBd,EAAM,CACnC,MAAO,GAAGC,CAAK,OAAA,CAChB,EAGH,OACEc,EAAAA,KAACC,EAAAA,MAAA,CACC,UAAS,GACT,IAAK,EACL,cAAc,MACd,WAAW,SACX,eAAe,SACd,GAAGb,EACJ,UAAAG,EAEA,SAAA,CAAAS,EAAAA,KAACC,EAAAA,MAAA,CACC,UAAS,GACT,IAAK,EACL,cAAc,MACd,WAAW,SACX,UAAW,GAAGR,EAAAA,MAAM,kBAEnB,SAAA,CAAAR,GAAQa,EAAWb,CAAI,EACvBU,EAAA,CAAc,CAAA,CAAA,EAGfR,SACG,MAAA,CACC,SAAAS,EAAAA,IAACM,EAAAA,WAAA,CACC,UAAWR,EACX,QAASP,EACT,MAAAD,EACA,MAAO,CAAE,MAAO,cAAA,EAEhB,SAAAU,EAAAA,IAACO,EAAAA,KAAA,CAAK,KAAK,OAAA,CAAQ,CAAA,CAAA,CACrB,CACF,CAAA,CAAA,CAAA,CAIV,CAEA,MAAApB,EAAeqB,EAAAA,gBAAgBrB,CAAK"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as m,jsx as e}from"react/jsx-runtime";import{cloneElement as y}from"react";import{p as t}from"./index-CZ41y9Hn.js";import{j as c}from"./joinClass-anSpaauN.js";import{u as g}from"./useTheme-g5gOUmLf.js";import{S as i}from"./Stack-D0feJnm7.js";import{T as h}from"./Typography-hazfs4Ye.js";import{B as x}from"./ButtonIcon-
|
|
2
|
-
//# sourceMappingURL=Alert-
|
|
1
|
+
import{jsxs as m,jsx as e}from"react/jsx-runtime";import{cloneElement as y}from"react";import{p as t}from"./index-CZ41y9Hn.js";import{j as c}from"./joinClass-anSpaauN.js";import{u as g}from"./useTheme-g5gOUmLf.js";import{S as i}from"./Stack-D0feJnm7.js";import{T as h}from"./Typography-hazfs4Ye.js";import{B as x}from"./ButtonIcon-D0YH7wS6.js";import{c as I}from"./createComponent-DZqrA_Tp.js";import{I as _}from"./Icon-0KfCwKWR.js";function j({children:o,icon:n,color:r="primary",onClose:a,...s}){const{theme:{mode:l}}=g(),f=c(`${t}-alert`,`${t}-alert--${l}`,`${t}-alert--${r}`,s.className),p=c(`${t}-alert__button`,`${t}-alert__button--${r}`),u=()=>typeof o=="string"?e(h,{variant:"body1",style:{color:"currentcolor"},children:o}):o,$=d=>y(d,{color:`${r}.dark`});return m(i,{fullWidth:!0,gap:0,flexDirection:"row",alignItems:"center",justifyContent:"center",...s,className:f,children:[m(i,{fullWidth:!0,gap:8,flexDirection:"row",alignItems:"center",className:`${t}-alert__content`,children:[n&&$(n),u()]}),a&&e("div",{children:e(x,{className:p,onClick:a,color:r,style:{color:"currentColor"},children:e(_,{name:"times"})})})]})}const S=I(j);export{S as A};
|
|
2
|
+
//# sourceMappingURL=Alert-DJexLc9y.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert-
|
|
1
|
+
{"version":3,"file":"Alert-DJexLc9y.js","sources":["../../src/feedback/Alert/Alert.tsx"],"sourcesContent":["import { cloneElement, type HtmlHTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport { useTheme } from '@/theme';\nimport Stack from '@/layout/Stack';\nimport Typography from '@/display/Typography';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport createComponent from '@/core/createComponent';\nimport Icon, { type IconProps } from '@/display/Icon';\n\nimport '@iziui/styles/components/Alert.scss';\n\nexport interface AlertProps extends HtmlHTMLAttributes<HTMLDivElement> {\n color?: Colors;\n icon?: React.JSX.Element;\n children: React.ReactNode;\n onClose?: () => void;\n}\n\nfunction Alert({\n children,\n icon,\n color = 'primary',\n onClose,\n ...props\n}: AlertProps) {\n const { theme: { mode } } = useTheme();\n\n const className = joinClass(\n `${prefix}-alert`,\n `${prefix}-alert--${mode}`,\n `${prefix}-alert--${color}`,\n props.className\n );\n\n const classNameAction = joinClass(\n `${prefix}-alert__button`,\n `${prefix}-alert__button--${color}`,\n );\n\n const renderMessage = () => {\n if (typeof children === 'string') {\n return (\n <Typography variant=\"body1\" style={{ color: 'currentcolor' }}>\n {children}\n </Typography>\n );\n }\n\n return children;\n };\n\n const renderIcon = (icon: React.JSX.Element) => {\n return cloneElement<IconProps>(icon, {\n color: `${color}.dark`\n });\n };\n\n return (\n <Stack\n fullWidth\n gap={0}\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"center\"\n {...props}\n className={className}\n >\n <Stack\n fullWidth\n gap={8}\n flexDirection=\"row\"\n alignItems=\"center\"\n className={`${prefix}-alert__content`}\n >\n {icon && renderIcon(icon)}\n {renderMessage()}\n </Stack>\n {\n onClose && (\n <div>\n <ButtonIcon\n className={classNameAction}\n onClick={onClose}\n color={color}\n style={{ color: 'currentColor' }}\n >\n <Icon name=\"times\" />\n </ButtonIcon>\n </div>)\n }\n </Stack>\n );\n}\n\nexport default createComponent(Alert);"],"names":["Alert","children","icon","color","onClose","props","mode","useTheme","className","joinClass","prefix","classNameAction","renderMessage","jsx","Typography","renderIcon","cloneElement","jsxs","Stack","ButtonIcon","Icon","Alert$1","createComponent"],"mappings":"ibAuBA,SAASA,EAAM,CACb,SAAAC,EACA,KAAAC,EACA,MAAAC,EAAQ,UACR,QAAAC,EACA,GAAGC,CACL,EAAe,CACb,KAAM,CAAE,MAAO,CAAE,KAAAC,CAAA,CAAK,EAAMC,EAAA,EAEtBC,EAAYC,EAChB,GAAGC,CAAM,SACT,GAAGA,CAAM,WAAWJ,CAAI,GACxB,GAAGI,CAAM,WAAWP,CAAK,GACzBE,EAAM,SAAA,EAGFM,EAAkBF,EACtB,GAAGC,CAAM,iBACT,GAAGA,CAAM,mBAAmBP,CAAK,EAAA,EAG7BS,EAAgB,IAChB,OAAOX,GAAa,SAEpBY,EAACC,GAAW,QAAQ,QAAQ,MAAO,CAAE,MAAO,gBACzC,SAAAb,EACH,EAIGA,EAGHc,EAAcb,GACXc,EAAwBd,EAAM,CACnC,MAAO,GAAGC,CAAK,OAAA,CAChB,EAGH,OACEc,EAACC,EAAA,CACC,UAAS,GACT,IAAK,EACL,cAAc,MACd,WAAW,SACX,eAAe,SACd,GAAGb,EACJ,UAAAG,EAEA,SAAA,CAAAS,EAACC,EAAA,CACC,UAAS,GACT,IAAK,EACL,cAAc,MACd,WAAW,SACX,UAAW,GAAGR,CAAM,kBAEnB,SAAA,CAAAR,GAAQa,EAAWb,CAAI,EACvBU,EAAA,CAAc,CAAA,CAAA,EAGfR,KACG,MAAA,CACC,SAAAS,EAACM,EAAA,CACC,UAAWR,EACX,QAASP,EACT,MAAAD,EACA,MAAO,CAAE,MAAO,cAAA,EAEhB,SAAAU,EAACO,EAAA,CAAK,KAAK,OAAA,CAAQ,CAAA,CAAA,CACrB,CACF,CAAA,CAAA,CAAA,CAIV,CAEA,MAAAC,EAAeC,EAAgBtB,CAAK"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";const r=require("react/jsx-runtime"),m=require("react"),c=require("./index-DYxwT4uW.cjs"),p=require("./joinClass-Jk3EszKD.cjs"),q=require("./Ripple-Dy4i91j1.cjs"),x=require("./createComponent-BBXW0GJ6.cjs");function j({children:i,size:t=40,color:n="primary",...e}){const[o,u]=[t,t],l=p.joinClass(`${c.prefix}-button-icon`,n&&`${c.prefix}-button-icon--${n}`,e.className),a=s=>m.cloneElement(s,{size:o/1.5,...s.props,style:{color:"currentColor"}});return r.jsxs("button",{...e,className:l,style:{...e.style,width:o,height:u},children:[a(i),r.jsx(q.Ripple,{})]})}const C=x.createComponent(j);exports.ButtonIcon=C;
|
|
2
|
+
//# sourceMappingURL=ButtonIcon-B-M87M5L.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ButtonIcon-B-M87M5L.cjs","sources":["../../src/actions/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { cloneElement, type ButtonHTMLAttributes, type PropsWithChildren, type ReactElement } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport type { IconProps } from '@/display/Icon';\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport '@iziui/styles/components/ButtonIcon.scss';\n\nexport interface ButtonIconProps extends PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>> {\n color?: Colors;\n size?: number;\n children: ReactElement<IconProps>;\n};\nfunction ButtonIcon({ children, size = 40, color = 'primary', ...props }: ButtonIconProps) {\n const [width, height] = [size, size];\n\n const classess = joinClass(\n `${prefix}-button-icon`,\n color && `${prefix}-button-icon--${color}`,\n props.className\n );\n\n const renderIcon = (icon: ReactElement<IconProps>) => {\n return cloneElement(icon, {\n size: width / 1.5,\n ...icon.props,\n style: { color: 'currentColor' }\n });\n };\n\n return (\n <button\n {...props}\n className={classess}\n style={{ ...props.style, width, height }}\n >\n {renderIcon(children)}\n <Ripple />\n </button>\n );\n}\n\nexport default createComponent(ButtonIcon);"],"names":["ButtonIcon","children","size","color","props","width","height","classess","joinClass","prefix","renderIcon","icon","cloneElement","jsxs","Ripple","createComponent"],"mappings":"4NAkBA,SAASA,EAAW,CAAE,SAAAC,EAAU,KAAAC,EAAO,GAAI,MAAAC,EAAQ,UAAW,GAAGC,GAA0B,CACzF,KAAM,CAACC,EAAOC,CAAM,EAAI,CAACJ,EAAMA,CAAI,EAE7BK,EAAWC,EAAAA,UACf,GAAGC,EAAAA,MAAM,eACTN,GAAS,GAAGM,EAAAA,MAAM,iBAAiBN,CAAK,GACxCC,EAAM,SAAA,EAGFM,EAAcC,GACXC,EAAAA,aAAaD,EAAM,CACxB,KAAMN,EAAQ,IACd,GAAGM,EAAK,MACR,MAAO,CAAE,MAAO,cAAA,CAAe,CAChC,EAGH,OACEE,EAAAA,KAAC,SAAA,CACE,GAAGT,EACJ,UAAWG,EACX,MAAO,CAAE,GAAGH,EAAM,MAAO,MAAAC,EAAO,OAAAC,CAAA,EAE/B,SAAA,CAAAI,EAAWT,CAAQ,QACnBa,EAAAA,OAAA,CAAA,CAAO,CAAA,CAAA,CAAA,CAGd,CAEA,MAAAd,EAAee,EAAAA,gBAAgBf,CAAU"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{jsxs as l,jsx as p}from"react/jsx-runtime";import{cloneElement as u}from"react";import{p as e}from"./index-CZ41y9Hn.js";import{j as f}from"./joinClass-anSpaauN.js";import{R as h}from"./Ripple-Bq9bxg4k.js";import{c as j}from"./createComponent-DZqrA_Tp.js";function x({children:c,size:o=40,color:r="primary",...t}){const[n,m]=[o,o],i=f(`${e}-button-icon`,r&&`${e}-button-icon--${r}`,t.className),a=s=>u(s,{size:n/1.5,...s.props,style:{color:"currentColor"}});return l("button",{...t,className:i,style:{...t.style,width:n,height:m},children:[a(c),p(h,{})]})}const I=j(x);export{I as B};
|
|
2
|
+
//# sourceMappingURL=ButtonIcon-D0YH7wS6.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ButtonIcon-D0YH7wS6.js","sources":["../../src/actions/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { cloneElement, type ButtonHTMLAttributes, type PropsWithChildren, type ReactElement } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport type { IconProps } from '@/display/Icon';\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport '@iziui/styles/components/ButtonIcon.scss';\n\nexport interface ButtonIconProps extends PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>> {\n color?: Colors;\n size?: number;\n children: ReactElement<IconProps>;\n};\nfunction ButtonIcon({ children, size = 40, color = 'primary', ...props }: ButtonIconProps) {\n const [width, height] = [size, size];\n\n const classess = joinClass(\n `${prefix}-button-icon`,\n color && `${prefix}-button-icon--${color}`,\n props.className\n );\n\n const renderIcon = (icon: ReactElement<IconProps>) => {\n return cloneElement(icon, {\n size: width / 1.5,\n ...icon.props,\n style: { color: 'currentColor' }\n });\n };\n\n return (\n <button\n {...props}\n className={classess}\n style={{ ...props.style, width, height }}\n >\n {renderIcon(children)}\n <Ripple />\n </button>\n );\n}\n\nexport default createComponent(ButtonIcon);"],"names":["ButtonIcon","children","size","color","props","width","height","classess","joinClass","prefix","renderIcon","icon","cloneElement","jsxs","Ripple","ButtonIcon$1","createComponent"],"mappings":"sQAkBA,SAASA,EAAW,CAAE,SAAAC,EAAU,KAAAC,EAAO,GAAI,MAAAC,EAAQ,UAAW,GAAGC,GAA0B,CACzF,KAAM,CAACC,EAAOC,CAAM,EAAI,CAACJ,EAAMA,CAAI,EAE7BK,EAAWC,EACf,GAAGC,CAAM,eACTN,GAAS,GAAGM,CAAM,iBAAiBN,CAAK,GACxCC,EAAM,SAAA,EAGFM,EAAcC,GACXC,EAAaD,EAAM,CACxB,KAAMN,EAAQ,IACd,GAAGM,EAAK,MACR,MAAO,CAAE,MAAO,cAAA,CAAe,CAChC,EAGH,OACEE,EAAC,SAAA,CACE,GAAGT,EACJ,UAAWG,EACX,MAAO,CAAE,GAAGH,EAAM,MAAO,MAAAC,EAAO,OAAAC,CAAA,EAE/B,SAAA,CAAAI,EAAWT,CAAQ,IACnBa,EAAA,CAAA,CAAO,CAAA,CAAA,CAAA,CAGd,CAEA,MAAAC,EAAeC,EAAgBhB,CAAU"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";const u=require("react"),s=require("react/jsx-runtime"),a=require("./index-DYxwT4uW.cjs"),o=require("./joinClass-Jk3EszKD.cjs"),m=require("./Stack-DsVkiTT_.cjs"),d=require("./createComponent-BBXW0GJ6.cjs"),N=require("./ButtonIcon-
|
|
2
|
-
//# sourceMappingURL=DrawerContent-
|
|
1
|
+
"use strict";const u=require("react"),s=require("react/jsx-runtime"),a=require("./index-DYxwT4uW.cjs"),o=require("./joinClass-Jk3EszKD.cjs"),m=require("./Stack-DsVkiTT_.cjs"),d=require("./createComponent-BBXW0GJ6.cjs"),N=require("./ButtonIcon-B-M87M5L.cjs"),$=require("./Icon-Dv3oduiN.cjs");function y(t=!1){const[e,r]=u.useState(!1);return u.useEffect(()=>{r(t)},[t]),[e,()=>{r(i=>!i)}]}function b({open:t,header:e,body:r,footer:c,direction:i="right",onClose:_,...w}){const[f,l]=u.useState({visible:!1,animation:"hide"}),C=300,x=o.joinClass(`${a.prefix}-drawer`,w.className),D=o.joinClass(`${a.prefix}-drawer__content`,`${a.prefix}-drawer__content--${i}`,`${a.prefix}-drawer__content--${i}--${f.animation}`),j=o.joinClass(`${a.prefix}-drawer__overlay`,`${a.prefix}-drawer__overlay--${f.animation}`);u.useEffect(()=>{let n;if(t){n=v();return}return n=h(),()=>{clearTimeout(n)}},[t]);const v=()=>(l(n=>({...n,visible:!0})),setTimeout(()=>{l(n=>({...n,animation:"show"})),document.body.style.overflow="hidden"},100)),h=()=>(l(n=>({...n,animation:"hide"})),setTimeout(()=>{l(n=>({...n,visible:!1})),document.body.style.overflow=""},C));return f.visible&&s.jsxs("div",{...w,className:x,children:[s.jsxs(m.Stack,{className:D,children:[e,r,c]}),s.jsx("div",{"data-testid":"drawer-overlay",className:j,onClick:_})]})}const p=d.createComponent(b);function q({children:t,...e}){const r=o.joinClass(`${a.prefix}-drawer__footer`,e.className);return s.jsx("div",{...e,className:r,children:t})}const I=d.createComponent(q);function g({children:t,onClose:e,...r}){const c=o.joinClass(`${a.prefix}-drawer__header`,r.className);return s.jsxs(m.Stack,{flexDirection:"row",alignItems:"center",justifyContent:"space-between",...r,className:c,children:[t,e&&s.jsx(N.ButtonIcon,{onClick:e,color:"grey","aria-label":"Fechar","data-testid":"drawer-close-button",children:s.jsx($.Icon,{name:"times"})})]})}const k=d.createComponent(g);function S({children:t,...e}){const r=o.joinClass(`${a.prefix}-drawer__content__container`,e.className);return s.jsx("div",{...e,className:r,children:t})}const T=d.createComponent(S);exports.DrawerContent_default=T;exports.DrawerFooter_default=I;exports.DrawerHeader_default=k;exports.Drawer_default=p;exports.useDrawer=y;
|
|
2
|
+
//# sourceMappingURL=DrawerContent-CvWZGjje.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerContent-
|
|
1
|
+
{"version":3,"file":"DrawerContent-CvWZGjje.cjs","sources":["../../src/navigation/Drawer/useDrawer.ts","../../src/navigation/Drawer/Drawer.tsx","../../src/navigation/Drawer/DrawerFooter.tsx","../../src/navigation/Drawer/DrawerHeader.tsx","../../src/navigation/Drawer/DrawerContent.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\ntype UseDrawer = [boolean, () => void]\n\nexport default function useDrawer(open = false): UseDrawer {\n const [_open, setOpen] = useState(false);\n\n useEffect(() => { setOpen(open); }, [open]);\n\n const toogleDrawer = () => { setOpen(prev => !prev); };\n\n return [_open, toogleDrawer];\n}","import { useEffect, useState, type HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\n\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Drawer.scss';\n\ntype Direction = 'right' | 'left' | 'bottom';\ntype AnimationClass = 'show' | 'hide';\ntype Config = { animation: AnimationClass; visible: boolean };\n\nexport interface DrawerProps extends HTMLAttributes<HTMLDivElement> {\n open: boolean;\n direction?: Direction;\n body: React.JSX.Element;\n header?: React.JSX.Element;\n footer?: React.JSX.Element;\n onClose: () => void;\n};\n\nfunction Drawer({\n open,\n header,\n body,\n footer,\n direction = 'right',\n onClose,\n ...props\n}: DrawerProps) {\n const [config, setConfig] = useState<Config>({ visible: false, animation: 'hide' });\n\n const ANIMATION_DURATION = 300;\n\n const cls = joinClass(\n `${prefix}-drawer`,\n props.className\n );\n\n const contentCls = joinClass(\n `${prefix}-drawer__content`,\n `${prefix}-drawer__content--${direction}`,\n `${prefix}-drawer__content--${direction}--${config.animation}`,\n );\n\n const overlayCls = joinClass(\n `${prefix}-drawer__overlay`,\n `${prefix}-drawer__overlay--${config.animation}`,\n );\n\n useEffect(() => {\n let timer: NodeJS.Timeout;\n\n if (open) {\n timer = handleOpen();\n return;\n }\n\n timer = handleClose();\n\n return () => {\n clearTimeout(timer);\n };\n }, [open]);\n\n const handleOpen = () => {\n setConfig(prev => ({ ...prev, visible: true }));\n\n return setTimeout(() => {\n setConfig(prev => ({ ...prev, animation: 'show' }));\n document.body.style.overflow = 'hidden';\n }, 100);\n };\n\n const handleClose = () => {\n setConfig(prev => ({ ...prev, animation: 'hide' }));\n\n return setTimeout(() => {\n setConfig(prev => ({ ...prev, visible: false }));\n document.body.style.overflow = '';\n }, ANIMATION_DURATION);\n };\n\n return (\n config.visible && (\n <div {...props} className={cls}>\n <Stack className={contentCls}>\n {header}\n {body}\n {footer}\n </Stack>\n <div\n data-testid=\"drawer-overlay\"\n className={overlayCls}\n onClick={onClose}\n />\n </div>\n )\n );\n}\n\nexport default createComponent(Drawer);\n","import { HtmlHTMLAttributes, PropsWithChildren } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '../../core/createComponent';\n\ntype DrawerFooterProps = PropsWithChildren<HtmlHTMLAttributes<HTMLDivElement>>\n\nfunction DrawerFooter({ children, ...props }: DrawerFooterProps) {\n const cls = joinClass(\n `${prefix}-drawer__footer`,\n props.className\n );\n\n return (\n <div {...props} className={cls}>\n {children}\n </div>\n );\n}\n\nexport default createComponent(DrawerFooter);\n","import { HtmlHTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport Stack from '@/layout/Stack';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport Icon from '@/display/Icon';\n\nimport createComponent from '../../core/createComponent';\n\ninterface DrawerHeaderProps extends HtmlHTMLAttributes<HTMLDivElement> {\n onClose: () => void;\n}\n\nfunction DrawerHeader({ children, onClose, ...props }: DrawerHeaderProps) {\n const cls = joinClass(\n `${prefix}-drawer__header`,\n props.className\n );\n\n return (\n <Stack\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n {...props}\n className={cls}\n >\n {children}\n {\n onClose && (\n <ButtonIcon\n onClick={onClose}\n color=\"grey\"\n aria-label=\"Fechar\"\n data-testid=\"drawer-close-button\"\n >\n <Icon name=\"times\" />\n </ButtonIcon>\n )\n }\n </Stack>\n );\n}\n\nexport default createComponent(DrawerHeader);","import { HtmlHTMLAttributes, PropsWithChildren } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '../../core/createComponent';\n\ntype DrawerContentProps = PropsWithChildren<HtmlHTMLAttributes<HTMLDivElement>>\n\nfunction DrawerContent({ children, ...props }: DrawerContentProps) {\n const cls = joinClass(\n `${prefix}-drawer__content__container`,\n props.className\n );\n\n return (\n <div {...props} className={cls}>\n {children}\n </div>\n );\n}\n\nexport default createComponent(DrawerContent);"],"names":["useDrawer","open","_open","setOpen","useState","useEffect","prev","Drawer","header","body","footer","direction","onClose","props","config","setConfig","ANIMATION_DURATION","cls","joinClass","prefix","contentCls","overlayCls","timer","handleOpen","handleClose","jsxs","Stack","jsx","Drawer_default","createComponent","DrawerFooter","children","DrawerFooter_default","DrawerHeader","ButtonIcon","Icon","DrawerHeader_default","DrawerContent","DrawerContent_default"],"mappings":"mSAIA,SAAwBA,EAAUC,EAAO,GAAkB,CACzD,KAAM,CAACC,EAAOC,CAAO,EAAIC,EAAAA,SAAS,EAAK,EAEvCC,OAAAA,EAAAA,UAAU,IAAM,CAAEF,EAAQF,CAAI,CAAG,EAAG,CAACA,CAAI,CAAC,EAInC,CAACC,EAFa,IAAM,CAAEC,EAAQG,GAAQ,CAACA,CAAI,CAAG,CAE1B,CAC7B,CCaA,SAASC,EAAO,CACd,KAAAN,EACA,OAAAO,EACA,KAAAC,EACA,OAAAC,EACA,UAAAC,EAAY,QACZ,QAAAC,EACA,GAAGC,CACL,EAAgB,CACd,KAAM,CAACC,EAAQC,CAAS,EAAIX,EAAAA,SAAiB,CAAE,QAAS,GAAO,UAAW,OAAQ,EAE5EY,EAAqB,IAErBC,EAAMC,EAAAA,UACV,GAAGC,EAAAA,MAAM,UACTN,EAAM,SAAA,EAGFO,EAAaF,EAAAA,UACjB,GAAGC,EAAAA,MAAM,mBACT,GAAGA,EAAAA,MAAM,qBAAqBR,CAAS,GACvC,GAAGQ,EAAAA,MAAM,qBAAqBR,CAAS,KAAKG,EAAO,SAAS,EAAA,EAGxDO,EAAaH,EAAAA,UACjB,GAAGC,EAAAA,MAAM,mBACT,GAAGA,EAAAA,MAAM,qBAAqBL,EAAO,SAAS,EAAA,EAGhDT,EAAAA,UAAU,IAAM,CACd,IAAIiB,EAEJ,GAAIrB,EAAM,CACRqB,EAAQC,EAAA,EACR,MACF,CAEA,OAAAD,EAAQE,EAAA,EAED,IAAM,CACX,aAAaF,CAAK,CACpB,CACF,EAAG,CAACrB,CAAI,CAAC,EAET,MAAMsB,EAAa,KACjBR,MAAmB,CAAE,GAAGT,EAAM,QAAS,IAAO,EAEvC,WAAW,IAAM,CACtBS,MAAmB,CAAE,GAAGT,EAAM,UAAW,QAAS,EAClD,SAAS,KAAK,MAAM,SAAW,QACjC,EAAG,GAAG,GAGFkB,EAAc,KAClBT,MAAmB,CAAE,GAAGT,EAAM,UAAW,QAAS,EAE3C,WAAW,IAAM,CACtBS,MAAmB,CAAE,GAAGT,EAAM,QAAS,IAAQ,EAC/C,SAAS,KAAK,MAAM,SAAW,EACjC,EAAGU,CAAkB,GAGvB,OACEF,EAAO,SACLW,EAAAA,KAAC,OAAK,GAAGZ,EAAO,UAAWI,EACzB,SAAA,CAAAQ,EAAAA,KAACC,EAAAA,MAAA,CAAM,UAAWN,EACf,SAAA,CAAAZ,EACAC,EACAC,CAAA,EACH,EACAiB,EAAAA,IAAC,MAAA,CACC,cAAY,iBACZ,UAAWN,EACX,QAAST,CAAA,CAAA,CACX,EACF,CAGN,CAEA,MAAAgB,EAAeC,EAAAA,gBAAgBtB,CAAM,EC/FrC,SAASuB,EAAa,CAAE,SAAAC,EAAU,GAAGlB,GAA4B,CAC/D,MAAMI,EAAMC,EAAAA,UACV,GAAGC,EAAAA,MAAM,kBACTN,EAAM,SAAA,EAGR,aACG,MAAA,CAAK,GAAGA,EAAO,UAAWI,EACxB,SAAAc,EACH,CAEJ,CAEA,MAAAC,EAAeH,EAAAA,gBAAgBC,CAAY,ECP3C,SAASG,EAAa,CAAE,SAAAF,EAAU,QAAAnB,EAAS,GAAGC,GAA4B,CACxE,MAAMI,EAAMC,EAAAA,UACV,GAAGC,EAAAA,MAAM,kBACTN,EAAM,SAAA,EAGR,OACEY,EAAAA,KAACC,EAAAA,MAAA,CACC,cAAc,MACd,WAAW,SACX,eAAe,gBACd,GAAGb,EACJ,UAAWI,EAEV,SAAA,CAAAc,EAECnB,GACEe,EAAAA,IAACO,EAAAA,WAAA,CACC,QAAStB,EACT,MAAM,OACN,aAAW,SACX,cAAY,sBAEZ,SAAAe,EAAAA,IAACQ,EAAAA,KAAA,CAAK,KAAK,OAAA,CAAQ,CAAA,CAAA,CACrB,CAAA,CAAA,CAKV,CAEA,MAAAC,EAAeP,EAAAA,gBAAgBI,CAAY,ECrC3C,SAASI,EAAc,CAAE,SAAAN,EAAU,GAAGlB,GAA6B,CACjE,MAAMI,EAAMC,EAAAA,UACV,GAAGC,EAAAA,MAAM,8BACTN,EAAM,SAAA,EAGR,aACG,MAAA,CAAK,GAAGA,EAAO,UAAWI,EACxB,SAAAc,EACH,CAEJ,CAEA,MAAAO,EAAeT,EAAAA,gBAAgBQ,CAAa"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{useState as w,useEffect as _}from"react";import{jsxs as f,jsx as s}from"react/jsx-runtime";import{p as n}from"./index-CZ41y9Hn.js";import{j as o}from"./joinClass-anSpaauN.js";import{S as v}from"./Stack-D0feJnm7.js";import{c as m}from"./createComponent-DZqrA_Tp.js";import{B as g}from"./ButtonIcon-
|
|
2
|
-
//# sourceMappingURL=DrawerContent-
|
|
1
|
+
import{useState as w,useEffect as _}from"react";import{jsxs as f,jsx as s}from"react/jsx-runtime";import{p as n}from"./index-CZ41y9Hn.js";import{j as o}from"./joinClass-anSpaauN.js";import{S as v}from"./Stack-D0feJnm7.js";import{c as m}from"./createComponent-DZqrA_Tp.js";import{B as g}from"./ButtonIcon-D0YH7wS6.js";import{I}from"./Icon-0KfCwKWR.js";function M(t=!1){const[e,r]=w(!1);return _(()=>{r(t)},[t]),[e,()=>{r(i=>!i)}]}function p({open:t,header:e,body:r,footer:c,direction:i="right",onClose:D,...u}){const[d,l]=w({visible:!1,animation:"hide"}),h=300,N=o(`${n}-drawer`,u.className),$=o(`${n}-drawer__content`,`${n}-drawer__content--${i}`,`${n}-drawer__content--${i}--${d.animation}`),b=o(`${n}-drawer__overlay`,`${n}-drawer__overlay--${d.animation}`);_(()=>{let a;if(t){a=y();return}return a=C(),()=>{clearTimeout(a)}},[t]);const y=()=>(l(a=>({...a,visible:!0})),setTimeout(()=>{l(a=>({...a,animation:"show"})),document.body.style.overflow="hidden"},100)),C=()=>(l(a=>({...a,animation:"hide"})),setTimeout(()=>{l(a=>({...a,visible:!1})),document.body.style.overflow=""},h));return d.visible&&f("div",{...u,className:N,children:[f(v,{className:$,children:[e,r,c]}),s("div",{"data-testid":"drawer-overlay",className:b,onClick:D})]})}const R=m(p);function j({children:t,...e}){const r=o(`${n}-drawer__footer`,e.className);return s("div",{...e,className:r,children:t})}const U=m(j);function x({children:t,onClose:e,...r}){const c=o(`${n}-drawer__header`,r.className);return f(v,{flexDirection:"row",alignItems:"center",justifyContent:"space-between",...r,className:c,children:[t,e&&s(g,{onClick:e,color:"grey","aria-label":"Fechar","data-testid":"drawer-close-button",children:s(I,{name:"times"})})]})}const q=m(x);function T({children:t,...e}){const r=o(`${n}-drawer__content__container`,e.className);return s("div",{...e,className:r,children:t})}const z=m(T);export{R as D,z as a,U as b,q as c,M as u};
|
|
2
|
+
//# sourceMappingURL=DrawerContent-DswF1783.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerContent-
|
|
1
|
+
{"version":3,"file":"DrawerContent-DswF1783.js","sources":["../../src/navigation/Drawer/useDrawer.ts","../../src/navigation/Drawer/Drawer.tsx","../../src/navigation/Drawer/DrawerFooter.tsx","../../src/navigation/Drawer/DrawerHeader.tsx","../../src/navigation/Drawer/DrawerContent.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\ntype UseDrawer = [boolean, () => void]\n\nexport default function useDrawer(open = false): UseDrawer {\n const [_open, setOpen] = useState(false);\n\n useEffect(() => { setOpen(open); }, [open]);\n\n const toogleDrawer = () => { setOpen(prev => !prev); };\n\n return [_open, toogleDrawer];\n}","import { useEffect, useState, type HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\n\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Drawer.scss';\n\ntype Direction = 'right' | 'left' | 'bottom';\ntype AnimationClass = 'show' | 'hide';\ntype Config = { animation: AnimationClass; visible: boolean };\n\nexport interface DrawerProps extends HTMLAttributes<HTMLDivElement> {\n open: boolean;\n direction?: Direction;\n body: React.JSX.Element;\n header?: React.JSX.Element;\n footer?: React.JSX.Element;\n onClose: () => void;\n};\n\nfunction Drawer({\n open,\n header,\n body,\n footer,\n direction = 'right',\n onClose,\n ...props\n}: DrawerProps) {\n const [config, setConfig] = useState<Config>({ visible: false, animation: 'hide' });\n\n const ANIMATION_DURATION = 300;\n\n const cls = joinClass(\n `${prefix}-drawer`,\n props.className\n );\n\n const contentCls = joinClass(\n `${prefix}-drawer__content`,\n `${prefix}-drawer__content--${direction}`,\n `${prefix}-drawer__content--${direction}--${config.animation}`,\n );\n\n const overlayCls = joinClass(\n `${prefix}-drawer__overlay`,\n `${prefix}-drawer__overlay--${config.animation}`,\n );\n\n useEffect(() => {\n let timer: NodeJS.Timeout;\n\n if (open) {\n timer = handleOpen();\n return;\n }\n\n timer = handleClose();\n\n return () => {\n clearTimeout(timer);\n };\n }, [open]);\n\n const handleOpen = () => {\n setConfig(prev => ({ ...prev, visible: true }));\n\n return setTimeout(() => {\n setConfig(prev => ({ ...prev, animation: 'show' }));\n document.body.style.overflow = 'hidden';\n }, 100);\n };\n\n const handleClose = () => {\n setConfig(prev => ({ ...prev, animation: 'hide' }));\n\n return setTimeout(() => {\n setConfig(prev => ({ ...prev, visible: false }));\n document.body.style.overflow = '';\n }, ANIMATION_DURATION);\n };\n\n return (\n config.visible && (\n <div {...props} className={cls}>\n <Stack className={contentCls}>\n {header}\n {body}\n {footer}\n </Stack>\n <div\n data-testid=\"drawer-overlay\"\n className={overlayCls}\n onClick={onClose}\n />\n </div>\n )\n );\n}\n\nexport default createComponent(Drawer);\n","import { HtmlHTMLAttributes, PropsWithChildren } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '../../core/createComponent';\n\ntype DrawerFooterProps = PropsWithChildren<HtmlHTMLAttributes<HTMLDivElement>>\n\nfunction DrawerFooter({ children, ...props }: DrawerFooterProps) {\n const cls = joinClass(\n `${prefix}-drawer__footer`,\n props.className\n );\n\n return (\n <div {...props} className={cls}>\n {children}\n </div>\n );\n}\n\nexport default createComponent(DrawerFooter);\n","import { HtmlHTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport Stack from '@/layout/Stack';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport Icon from '@/display/Icon';\n\nimport createComponent from '../../core/createComponent';\n\ninterface DrawerHeaderProps extends HtmlHTMLAttributes<HTMLDivElement> {\n onClose: () => void;\n}\n\nfunction DrawerHeader({ children, onClose, ...props }: DrawerHeaderProps) {\n const cls = joinClass(\n `${prefix}-drawer__header`,\n props.className\n );\n\n return (\n <Stack\n flexDirection=\"row\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n {...props}\n className={cls}\n >\n {children}\n {\n onClose && (\n <ButtonIcon\n onClick={onClose}\n color=\"grey\"\n aria-label=\"Fechar\"\n data-testid=\"drawer-close-button\"\n >\n <Icon name=\"times\" />\n </ButtonIcon>\n )\n }\n </Stack>\n );\n}\n\nexport default createComponent(DrawerHeader);","import { HtmlHTMLAttributes, PropsWithChildren } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '../../core/createComponent';\n\ntype DrawerContentProps = PropsWithChildren<HtmlHTMLAttributes<HTMLDivElement>>\n\nfunction DrawerContent({ children, ...props }: DrawerContentProps) {\n const cls = joinClass(\n `${prefix}-drawer__content__container`,\n props.className\n );\n\n return (\n <div {...props} className={cls}>\n {children}\n </div>\n );\n}\n\nexport default createComponent(DrawerContent);"],"names":["useDrawer","open","_open","setOpen","useState","useEffect","prev","Drawer","header","body","footer","direction","onClose","props","config","setConfig","ANIMATION_DURATION","cls","joinClass","prefix","contentCls","overlayCls","timer","handleOpen","handleClose","jsxs","Stack","jsx","Drawer_default","createComponent","DrawerFooter","children","DrawerFooter_default","DrawerHeader","ButtonIcon","Icon","DrawerHeader_default","DrawerContent","DrawerContent_default"],"mappings":"+VAIA,SAAwBA,EAAUC,EAAO,GAAkB,CACzD,KAAM,CAACC,EAAOC,CAAO,EAAIC,EAAS,EAAK,EAEvC,OAAAC,EAAU,IAAM,CAAEF,EAAQF,CAAI,CAAG,EAAG,CAACA,CAAI,CAAC,EAInC,CAACC,EAFa,IAAM,CAAEC,EAAQG,GAAQ,CAACA,CAAI,CAAG,CAE1B,CAC7B,CCaA,SAASC,EAAO,CACd,KAAAN,EACA,OAAAO,EACA,KAAAC,EACA,OAAAC,EACA,UAAAC,EAAY,QACZ,QAAAC,EACA,GAAGC,CACL,EAAgB,CACd,KAAM,CAACC,EAAQC,CAAS,EAAIX,EAAiB,CAAE,QAAS,GAAO,UAAW,OAAQ,EAE5EY,EAAqB,IAErBC,EAAMC,EACV,GAAGC,CAAM,UACTN,EAAM,SAAA,EAGFO,EAAaF,EACjB,GAAGC,CAAM,mBACT,GAAGA,CAAM,qBAAqBR,CAAS,GACvC,GAAGQ,CAAM,qBAAqBR,CAAS,KAAKG,EAAO,SAAS,EAAA,EAGxDO,EAAaH,EACjB,GAAGC,CAAM,mBACT,GAAGA,CAAM,qBAAqBL,EAAO,SAAS,EAAA,EAGhDT,EAAU,IAAM,CACd,IAAIiB,EAEJ,GAAIrB,EAAM,CACRqB,EAAQC,EAAA,EACR,MACF,CAEA,OAAAD,EAAQE,EAAA,EAED,IAAM,CACX,aAAaF,CAAK,CACpB,CACF,EAAG,CAACrB,CAAI,CAAC,EAET,MAAMsB,EAAa,KACjBR,MAAmB,CAAE,GAAGT,EAAM,QAAS,IAAO,EAEvC,WAAW,IAAM,CACtBS,MAAmB,CAAE,GAAGT,EAAM,UAAW,QAAS,EAClD,SAAS,KAAK,MAAM,SAAW,QACjC,EAAG,GAAG,GAGFkB,EAAc,KAClBT,MAAmB,CAAE,GAAGT,EAAM,UAAW,QAAS,EAE3C,WAAW,IAAM,CACtBS,MAAmB,CAAE,GAAGT,EAAM,QAAS,IAAQ,EAC/C,SAAS,KAAK,MAAM,SAAW,EACjC,EAAGU,CAAkB,GAGvB,OACEF,EAAO,SACLW,EAAC,OAAK,GAAGZ,EAAO,UAAWI,EACzB,SAAA,CAAAQ,EAACC,EAAA,CAAM,UAAWN,EACf,SAAA,CAAAZ,EACAC,EACAC,CAAA,EACH,EACAiB,EAAC,MAAA,CACC,cAAY,iBACZ,UAAWN,EACX,QAAST,CAAA,CAAA,CACX,EACF,CAGN,CAEA,MAAAgB,EAAeC,EAAgBtB,CAAM,EC/FrC,SAASuB,EAAa,CAAE,SAAAC,EAAU,GAAGlB,GAA4B,CAC/D,MAAMI,EAAMC,EACV,GAAGC,CAAM,kBACTN,EAAM,SAAA,EAGR,SACG,MAAA,CAAK,GAAGA,EAAO,UAAWI,EACxB,SAAAc,EACH,CAEJ,CAEA,MAAAC,EAAeH,EAAgBC,CAAY,ECP3C,SAASG,EAAa,CAAE,SAAAF,EAAU,QAAAnB,EAAS,GAAGC,GAA4B,CACxE,MAAMI,EAAMC,EACV,GAAGC,CAAM,kBACTN,EAAM,SAAA,EAGR,OACEY,EAACC,EAAA,CACC,cAAc,MACd,WAAW,SACX,eAAe,gBACd,GAAGb,EACJ,UAAWI,EAEV,SAAA,CAAAc,EAECnB,GACEe,EAACO,EAAA,CACC,QAAStB,EACT,MAAM,OACN,aAAW,SACX,cAAY,sBAEZ,SAAAe,EAACQ,EAAA,CAAK,KAAK,OAAA,CAAQ,CAAA,CAAA,CACrB,CAAA,CAAA,CAKV,CAEA,MAAAC,EAAeP,EAAgBI,CAAY,ECrC3C,SAASI,EAAc,CAAE,SAAAN,EAAU,GAAGlB,GAA6B,CACjE,MAAMI,EAAMC,EACV,GAAGC,CAAM,8BACTN,EAAM,SAAA,EAGR,SACG,MAAA,CAAK,GAAGA,EAAO,UAAWI,EACxB,SAAAc,EACH,CAEJ,CAEA,MAAAO,EAAeT,EAAgBQ,CAAa"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{jsx as e}from"react/jsx-runtime";import{p as t}from"./index-CZ41y9Hn.js";import{j as m}from"./joinClass-anSpaauN.js";import{c as a}from"./createComponent-DZqrA_Tp.js";function r({name:i,color:s,size:n=24,...o}){const c=m(`${t}-icon`,s&&`${t}-icon--${s}`,"uil",`uil-${i}`,o.className);return e("i",{...o,className:c,style:{fontSize:n,...o.style}})}const u=a(r);export{u as I};
|
|
2
|
+
//# sourceMappingURL=Icon-0KfCwKWR.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Icon-0KfCwKWR.js","sources":["../../src/display/Icon/Icon.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\nimport type { Colors } from '@iziui/core/theme';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Icon.scss';\n\nexport interface IconProps extends HTMLAttributes<HTMLElement> {\n name: string;\n size?: number;\n color?: Colors;\n}\n\nfunction Icon({ name, color, size = 24, ...props }: IconProps) {\n const clss = joinClass(\n `${prefix}-icon`,\n color && `${prefix}-icon--${color}`,\n 'uil',\n `uil-${name}`,\n props.className\n );\n\n return (\n <i {...props} className={clss} style={{ fontSize: size, ...props.style }}></i>\n );\n}\n\nexport default createComponent(Icon);"],"names":["Icon","name","color","size","props","clss","joinClass","prefix","jsx","Icon$1","createComponent"],"mappings":"8KAiBA,SAASA,EAAK,CAAE,KAAAC,EAAM,MAAAC,EAAO,KAAAC,EAAO,GAAI,GAAGC,GAAoB,CAC7D,MAAMC,EAAOC,EACX,GAAGC,CAAM,QACTL,GAAS,GAAGK,CAAM,UAAUL,CAAK,GACjC,MACA,OAAOD,CAAI,GACXG,EAAM,SAAA,EAGR,OACEI,EAAC,IAAA,CAAG,GAAGJ,EAAO,UAAWC,EAAM,MAAO,CAAE,SAAUF,EAAM,GAAGC,EAAM,MAAM,CAAG,CAE9E,CAEA,MAAAK,EAAeC,EAAgBV,CAAI"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";const o=require("react/jsx-runtime"),s=require("./index-DYxwT4uW.cjs"),r=require("./joinClass-Jk3EszKD.cjs"),u=require("./createComponent-BBXW0GJ6.cjs");function a({name:i,color:n,size:t=24,...e}){const c=r.joinClass(`${s.prefix}-icon`,n&&`${s.prefix}-icon--${n}`,"uil",`uil-${i}`,e.className);return o.jsx("i",{...e,className:c,style:{fontSize:t,...e.style}})}const l=u.createComponent(a);exports.Icon=l;
|
|
2
|
+
//# sourceMappingURL=Icon-Dv3oduiN.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Icon-Dv3oduiN.cjs","sources":["../../src/display/Icon/Icon.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\nimport type { Colors } from '@iziui/core/theme';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Icon.scss';\n\nexport interface IconProps extends HTMLAttributes<HTMLElement> {\n name: string;\n size?: number;\n color?: Colors;\n}\n\nfunction Icon({ name, color, size = 24, ...props }: IconProps) {\n const clss = joinClass(\n `${prefix}-icon`,\n color && `${prefix}-icon--${color}`,\n 'uil',\n `uil-${name}`,\n props.className\n );\n\n return (\n <i {...props} className={clss} style={{ fontSize: size, ...props.style }}></i>\n );\n}\n\nexport default createComponent(Icon);"],"names":["Icon","name","color","size","props","clss","joinClass","prefix","jsx","createComponent"],"mappings":"sKAiBA,SAASA,EAAK,CAAE,KAAAC,EAAM,MAAAC,EAAO,KAAAC,EAAO,GAAI,GAAGC,GAAoB,CAC7D,MAAMC,EAAOC,EAAAA,UACX,GAAGC,EAAAA,MAAM,QACTL,GAAS,GAAGK,EAAAA,MAAM,UAAUL,CAAK,GACjC,MACA,OAAOD,CAAI,GACXG,EAAM,SAAA,EAGR,OACEI,EAAAA,IAAC,IAAA,CAAG,GAAGJ,EAAO,UAAWC,EAAM,MAAO,CAAE,SAAUF,EAAM,GAAGC,EAAM,MAAM,CAAG,CAE9E,CAEA,MAAAJ,EAAeS,EAAAA,gBAAgBT,CAAI"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Alert-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Alert-Cc5S-AfT.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/useTheme-DhX2tM8O.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/Stack-DsVkiTT_.cjs");require("../../chunks/createComponent-BBXW0GJ6.cjs");require("../../chunks/Typography-C7B3jwUf.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");require("../../chunks/ButtonIcon-B-M87M5L.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/Icon-Dv3oduiN.cjs");exports.default=e.Alert;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{A as b}from"../../chunks/Alert-
|
|
1
|
+
import{A as b}from"../../chunks/Alert-DJexLc9y.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/useTheme-g5gOUmLf.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/Stack-D0feJnm7.js";import"../../chunks/createComponent-DZqrA_Tp.js";import"../../chunks/Typography-hazfs4Ye.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";import"../../chunks/ButtonIcon-D0YH7wS6.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/Icon-0KfCwKWR.js";export{b as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),t=require("../../chunks/index-DYxwT4uW.cjs"),f=require("../../chunks/joinClass-Jk3EszKD.cjs"),d=require("../../chunks/Ripple-Dy4i91j1.cjs"),g=require("../../chunks/createComponent-BBXW0GJ6.cjs"),v=require("../../chunks/Icon-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),t=require("../../chunks/index-DYxwT4uW.cjs"),f=require("../../chunks/joinClass-Jk3EszKD.cjs"),d=require("../../chunks/Ripple-Dy4i91j1.cjs"),g=require("../../chunks/createComponent-BBXW0GJ6.cjs"),v=require("../../chunks/Icon-Dv3oduiN.cjs"),x=require("../../chunks/Typography-C7B3jwUf.cjs");require("react");require("../../chunks/useTheme-DhX2tM8O.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");function s(e){return e.normalize("NFD").trim().toLowerCase().replace(/a-zA-Z0-9_.-+/g,"").replace(/_/g,"").replace(/[^\w\s]/gi,"")}function m(e){const a=e.trim().split(" "),i=a.length===1,r=s(a[0]).charAt(0).toLocaleUpperCase(),c=i?s(a[0]).charAt(1).toLocaleUpperCase():s(a.reverse()[0]).charAt(0).toLocaleUpperCase();return r+c}function y({src:e,alt:a,name:i,size:r=40,variant:c="circular",color:u="primary",icon:l,...n}){const h=f.joinClass(`${t.prefix}-avatar`,`${t.prefix}-avatar--${c}`,`${t.prefix}-avatar--${u}`,e&&`${t.prefix}-avatar--image`,i&&`${t.prefix}-avatar--name`,!e&&!i||l&&`${t.prefix}-avatar--icon`,n.onClick&&`${t.prefix}-avatar--clickable`,n.className),p=()=>e?o.jsx("img",{src:e,alt:a,width:r,height:r,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):i?o.jsx(x.Typography,{style:{fontSize:r/2,color:"currentColor"},children:m(i)}):l||o.jsx(v.Icon,{name:"user",size:r/1.6,style:{color:"currentColor"}});return o.jsxs("div",{...n,style:{width:r,height:r,...n.style},className:h,children:[p(),n.children,n.onClick&&o.jsx(d.Ripple,{})]})}const C=g.createComponent(y);exports.default=C;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as h,jsx as n}from"react/jsx-runtime";import{p as r}from"../../chunks/index-CZ41y9Hn.js";import{j as u}from"../../chunks/joinClass-anSpaauN.js";import{R as g}from"../../chunks/Ripple-Bq9bxg4k.js";import{c as v}from"../../chunks/createComponent-DZqrA_Tp.js";import{I as d}from"../../chunks/Icon-
|
|
1
|
+
import{jsxs as h,jsx as n}from"react/jsx-runtime";import{p as r}from"../../chunks/index-CZ41y9Hn.js";import{j as u}from"../../chunks/joinClass-anSpaauN.js";import{R as g}from"../../chunks/Ripple-Bq9bxg4k.js";import{c as v}from"../../chunks/createComponent-DZqrA_Tp.js";import{I as d}from"../../chunks/Icon-0KfCwKWR.js";import{T as C}from"../../chunks/Typography-hazfs4Ye.js";import"react";import"../../chunks/useTheme-g5gOUmLf.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";function s(t){return t.normalize("NFD").trim().toLowerCase().replace(/a-zA-Z0-9_.-+/g,"").replace(/_/g,"").replace(/[^\w\s]/gi,"")}function y(t){const e=t.trim().split(" "),o=e.length===1,a=s(e[0]).charAt(0).toLocaleUpperCase(),l=o?s(e[0]).charAt(1).toLocaleUpperCase():s(e.reverse()[0]).charAt(0).toLocaleUpperCase();return a+l}function $({src:t,alt:e,name:o,size:a=40,variant:l="circular",color:m="primary",icon:c,...i}){const p=u(`${r}-avatar`,`${r}-avatar--${l}`,`${r}-avatar--${m}`,t&&`${r}-avatar--image`,o&&`${r}-avatar--name`,!t&&!o||c&&`${r}-avatar--icon`,i.onClick&&`${r}-avatar--clickable`,i.className),f=()=>t?n("img",{src:t,alt:e,width:a,height:a,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):o?n(C,{style:{fontSize:a/2,color:"currentColor"},children:y(o)}):c||n(d,{name:"user",size:a/1.6,style:{color:"currentColor"}});return h("div",{...i,style:{width:a,height:a,...i.style},className:p,children:[f(),i.children,i.onClick&&n(g,{})]})}const R=v($);export{R as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/ButtonIcon-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/ButtonIcon-B-M87M5L.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/createComponent-BBXW0GJ6.cjs");require("../../chunks/useTheme-DhX2tM8O.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.ButtonIcon;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{B as
|
|
1
|
+
import{B as l}from"../../chunks/ButtonIcon-D0YH7wS6.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/createComponent-DZqrA_Tp.js";import"../../chunks/useTheme-g5gOUmLf.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{l as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),d=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/generateSupportColors-CTMoGhDf.cjs"),P=require("../../chunks/uuid-omnJ9TjZ.cjs"),R=require("../../chunks/Box-D7fnBKFY.cjs"),C=require("../../chunks/Icon-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),d=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/generateSupportColors-CTMoGhDf.cjs"),P=require("../../chunks/uuid-omnJ9TjZ.cjs"),R=require("../../chunks/Box-D7fnBKFY.cjs"),C=require("../../chunks/Icon-Dv3oduiN.cjs"),E=require("../../chunks/Stack-DsVkiTT_.cjs"),I=require("../../chunks/useTheme-DhX2tM8O.cjs"),_=require("../../chunks/useMenu-Bw3Im-FW.cjs"),O=require("../../chunks/createComponent-BBXW0GJ6.cjs");require("../../chunks/useListenerResized-AwpsZLcP.cjs");require("../../chunks/Card-DqoL_8z0.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/CardContent-BOuRiZyj.cjs");const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function T({label:n,error:i,helperText:t,fitContent:m,value:c=k[0],autoClose:b,onChange:j,onInput:h,...$}){const{theme:{palette:a}}=I.useTheme(),l=d.useRef(null),[q,g,u]=_.useMenu(),p=d.useMemo(()=>P.uuid(),[]),N=s.joinClass(`${e.prefix}-color-picker__label`,i&&`${e.prefix}-color-picker__label--error`),y=s.joinClass(`${e.prefix}-color-picker-container`,i&&`${e.prefix}-color-picker-container--error`),v=s.joinClass(`${e.prefix}-color-picker`,i&&`${e.prefix}-color-picker--error`),M=s.joinClass(`${e.prefix}-color-picker__value`,i&&`${e.prefix}-color-picker__value--error`),S=s.joinClass(`${e.prefix}-color-picker__helper-text`,t&&`${e.prefix}-color-picker__helper-text--visible`,i&&`${e.prefix}-color-picker__helper-text--error`),f=o=>s.joinClass(`${e.prefix}-color-picker__color__icon`,c===o&&`${e.prefix}-color-picker__color__icon--visible`);function w(o){l.current&&(l.current.value=o,l.current.dispatchEvent(new Event("input",{bubbles:!0})))}return r.jsxs("div",{className:y,children:[n&&r.jsxs("label",{className:N,children:[n," ",$.required&&"*"]}),r.jsxs("button",{type:"button",onClick:u,className:v,children:[r.jsx("div",{className:`${e.prefix}-color-picker__preview`,children:r.jsx("div",{style:{backgroundColor:c}})}),r.jsx("div",{className:M,children:c})]}),r.jsx("span",{className:S,children:t}),r.jsx(_.Menu,{direction:"left",autoClose:b,open:q,anchorEl:g,width:m?"fit-content":"",onClose:u,children:r.jsx(R.Box,{sx:{p:1},children:r.jsxs(E.Stack,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(o=>r.jsx("button",{type:"button",className:`${e.prefix}-color-picker__color`,onClick:()=>w(o),style:{backgroundColor:o},children:r.jsx(C.Icon,{name:"check",className:f(o),style:{color:x.getContrastColor(c)}})},o)),r.jsxs("label",{htmlFor:`color-picker-${p}`,className:`${e.prefix}-color-picker__color`,style:{backgroundColor:a.grey.main},children:[r.jsx(C.Icon,{name:"plus",className:f(c),style:{color:x.getContrastColor(a.grey.main)}}),r.jsx("input",{ref:l,type:"color",id:`color-picker-${p}`,value:c,onChange:j,onInput:h})]})]})})})]})}const B=O.createComponent(T);exports.default=B;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useRef as P,useMemo as R}from"react";import{p as o}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{b as u}from"../../chunks/generateSupportColors-BN5t8dA-.js";import{u as S}from"../../chunks/uuid-dGvr9vBZ.js";import{B}from"../../chunks/Box-BzStXj3R.js";import{I as _}from"../../chunks/Icon-
|
|
1
|
+
import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useRef as P,useMemo as R}from"react";import{p as o}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{b as u}from"../../chunks/generateSupportColors-BN5t8dA-.js";import{u as S}from"../../chunks/uuid-dGvr9vBZ.js";import{B}from"../../chunks/Box-BzStXj3R.js";import{I as _}from"../../chunks/Icon-0KfCwKWR.js";import{S as I}from"../../chunks/Stack-D0feJnm7.js";import{u as O}from"../../chunks/useTheme-g5gOUmLf.js";import{u as q,M as D}from"../../chunks/useMenu-DU5PYJUH.js";import{c as F}from"../../chunks/createComponent-DZqrA_Tp.js";import"../../chunks/useListenerResized-Bnqxrt7k.js";import"../../chunks/Card-wBDtOPXO.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/CardContent-D0o8c1Yf.js";const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function L({label:s,error:t,helperText:a,fitContent:b,value:c=k[0],autoClose:h,onChange:C,onInput:$,...N}){const{theme:{palette:p}}=O(),n=P(null),[y,x,m]=q(),f=R(()=>S(),[]),g=l(`${o}-color-picker__label`,t&&`${o}-color-picker__label--error`),v=l(`${o}-color-picker-container`,t&&`${o}-color-picker-container--error`),j=l(`${o}-color-picker`,t&&`${o}-color-picker--error`),w=l(`${o}-color-picker__value`,t&&`${o}-color-picker__value--error`),M=l(`${o}-color-picker__helper-text`,a&&`${o}-color-picker__helper-text--visible`,t&&`${o}-color-picker__helper-text--error`),d=r=>l(`${o}-color-picker__color__icon`,c===r&&`${o}-color-picker__color__icon--visible`);function E(r){n.current&&(n.current.value=r,n.current.dispatchEvent(new Event("input",{bubbles:!0})))}return i("div",{className:v,children:[s&&i("label",{className:g,children:[s," ",N.required&&"*"]}),i("button",{type:"button",onClick:m,className:j,children:[e("div",{className:`${o}-color-picker__preview`,children:e("div",{style:{backgroundColor:c}})}),e("div",{className:w,children:c})]}),e("span",{className:M,children:a}),e(D,{direction:"left",autoClose:h,open:y,anchorEl:x,width:b?"fit-content":"",onClose:m,children:e(B,{sx:{p:1},children:i(I,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(r=>e("button",{type:"button",className:`${o}-color-picker__color`,onClick:()=>E(r),style:{backgroundColor:r},children:e(_,{name:"check",className:d(r),style:{color:u(c)}})},r)),i("label",{htmlFor:`color-picker-${f}`,className:`${o}-color-picker__color`,style:{backgroundColor:p.grey.main},children:[e(_,{name:"plus",className:d(c),style:{color:u(p.grey.main)}}),e("input",{ref:n,type:"color",id:`color-picker-${f}`,value:c,onChange:C,onInput:$})]})]})})})]})}const ro=F(L);export{ro as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/DrawerContent-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/DrawerContent-CvWZGjje.cjs");require("react");require("react/jsx-runtime");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Stack-DsVkiTT_.cjs");require("../../chunks/createComponent-BBXW0GJ6.cjs");require("../../chunks/useTheme-DhX2tM8O.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/ButtonIcon-B-M87M5L.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/Icon-Dv3oduiN.cjs");exports.Drawer=e.Drawer_default;exports.DrawerContent=e.DrawerContent_default;exports.DrawerFooter=e.DrawerFooter_default;exports.DrawerHeader=e.DrawerHeader_default;exports.useDrawer=e.useDrawer;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{D as
|
|
1
|
+
import{D as b,a as c,b as d,c as f,u as x}from"../../chunks/DrawerContent-DswF1783.js";import"react";import"react/jsx-runtime";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Stack-D0feJnm7.js";import"../../chunks/createComponent-DZqrA_Tp.js";import"../../chunks/useTheme-g5gOUmLf.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/ButtonIcon-D0YH7wS6.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/Icon-0KfCwKWR.js";export{b as Drawer,c as DrawerContent,d as DrawerFooter,f as DrawerHeader,x as useDrawer};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Icon-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Icon-Dv3oduiN.cjs");require("react/jsx-runtime");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/createComponent-BBXW0GJ6.cjs");require("../../chunks/useTheme-DhX2tM8O.cjs");require("react");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.Icon;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{I as d}from"../../chunks/Icon-
|
|
1
|
+
import{I as d}from"../../chunks/Icon-0KfCwKWR.js";import"react/jsx-runtime";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/createComponent-DZqrA_Tp.js";import"../../chunks/useTheme-g5gOUmLf.js";import"react";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{d as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),o=require("../../chunks/index-DYxwT4uW.cjs"),f=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/createComponent-BBXW0GJ6.cjs"),v=require("../../chunks/Card-DqoL_8z0.cjs"),g=require("../../chunks/CardContent-BOuRiZyj.cjs"),C=require("../../chunks/Stack-DsVkiTT_.cjs"),_=require("../../chunks/ButtonIcon-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),o=require("../../chunks/index-DYxwT4uW.cjs"),f=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/createComponent-BBXW0GJ6.cjs"),v=require("../../chunks/Card-DqoL_8z0.cjs"),g=require("../../chunks/CardContent-BOuRiZyj.cjs"),C=require("../../chunks/Stack-DsVkiTT_.cjs"),_=require("../../chunks/ButtonIcon-B-M87M5L.cjs"),M=require("../../chunks/Icon-Dv3oduiN.cjs");require("../../chunks/useTheme-DhX2tM8O.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");function N({children:n,title:c,subtitle:l,isOpen:u,onClose:i,...m}){const[d,a]=s.useState({visible:!1,animation:"hide"}),r=s.useRef(null),j=300,p=f.joinClass(`${o.prefix}-modal`,`${o.prefix}-modal--${d.animation}`),b=f.joinClass(`${o.prefix}-modal__content`,m.className),h=f.joinClass(`${o.prefix}-modal__backdrop`,`${o.prefix}-modal__backdrop--${d.animation}`);s.useEffect(()=>(document.body.style.overflow="hidden",()=>{document.body.style.overflow="auto"}),[]),s.useEffect(()=>(u?y():q(),()=>{r.current&&(clearTimeout(r.current),r.current=null)}),[u]);const y=()=>{a(t=>({...t,visible:!0})),r.current=setTimeout(()=>{a(t=>({...t,animation:"show"})),document.body.style.overflow="hidden"},100)},q=()=>{a(t=>({...t,animation:"hide"})),r.current=setTimeout(()=>{a(t=>({...t,visible:!1})),document.body.style.overflow=""},j)};return d.visible&&e.jsx("div",{className:h,onClick:i,children:e.jsx("div",{className:`${o.prefix}-modal__container`,children:e.jsx(v.Card,{className:p,children:e.jsxs(g.CardContent,{onClick:t=>t.stopPropagation(),children:[e.jsxs(C.Stack,{alignItems:"center",flexDirection:"row",justifyContent:"space-between",style:{flexWrap:"nowrap"},children:[e.jsxs("div",{children:[c,l]}),e.jsx(_.ButtonIcon,{color:"grey",onClick:i,children:e.jsx(M.Icon,{name:"times"})})]}),e.jsx("div",{...m,className:b,children:n})]})})})})}const k=x.createComponent(N);function w({children:n}){return e.jsx(C.Stack,{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",children:n})}const I=x.createComponent(w);function $({open:n=!1}={}){const[c,l]=s.useState(n);return[c,()=>l(i=>!i)]}exports.Modal=k;exports.ModalFooter=I;exports.useModal=$;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/feedback/Modal/Modal.tsx","../../../src/feedback/Modal/ModalFooter.tsx","../../../src/feedback/Modal/useModal.ts"],"sourcesContent":["import { useEffect, useRef, useState, type HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '@/core/createComponent';\nimport { Card, CardContent } from '@/display/Card';\nimport Stack from '@/layout/Stack';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport Icon from '@/display/Icon';\n\nimport '@iziui/styles/components/Modal.scss';\n\ntype AnimationClass = 'show' | 'hide';\ntype Config = { animation: AnimationClass, visible: boolean };\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {\n isOpen: boolean;\n onClose: () => void;\n children: React.ReactNode;\n title?: React.JSX.Element;\n subtitle?: React.JSX.Element;\n}\n\nfunction Modal({ children, title, subtitle, isOpen, onClose, ...props }: ModalProps) {\n const [config, setConfig] = useState<Config>({ visible: false, animation: 'hide' });\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const ANIMATION_DURATION = 300;\n\n const className = joinClass(\n `${prefix}-modal`,\n `${prefix}-modal--${config.animation}`\n );\n const classNameContent = joinClass(\n `${prefix}-modal__content`,\n props.className\n );\n const backdropClassName = joinClass(\n `${prefix}-modal__backdrop`,\n `${prefix}-modal__backdrop--${config.animation}`\n );\n\n useEffect(() => {\n document.body.style.overflow = 'hidden';\n\n return () => {\n document.body.style.overflow = 'auto';\n };\n }, []);\n\n useEffect(() => {\n if (isOpen) {\n handleOpen();\n } else {\n handleClose();\n }\n\n return () => {\n if (!timeoutRef.current) { return; }\n clearTimeout(timeoutRef.current);\n timeoutRef.current = null;\n };\n }, [isOpen]);\n\n const handleOpen = () => {\n setConfig(prev => ({ ...prev, visible: true }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, animation: 'show' }));\n document.body.style.overflow = 'hidden';\n }, 100);\n };\n\n const handleClose = () => {\n setConfig(prev => ({ ...prev, animation: 'hide' }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, visible: false }));\n document.body.style.overflow = '';\n }, ANIMATION_DURATION);\n };\n\n return (\n config.visible && (\n <div className={backdropClassName} onClick={onClose}>\n <div className={`${prefix}-modal__container`}>\n <Card className={className}>\n <CardContent onClick={(e) => e.stopPropagation()}>\n <Stack\n alignItems=\"center\"\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n style={{ flexWrap: 'nowrap' }}\n >\n <div>\n {title}\n {subtitle}\n </div>\n <ButtonIcon color=\"grey\" onClick={onClose}>\n <Icon name=\"times\" />\n </ButtonIcon>\n </Stack>\n <div\n {...props}\n className={classNameContent}\n >\n {children}\n </div>\n </CardContent>\n </Card>\n </div>\n </div>\n )\n );\n}\n\nexport default createComponent(Modal);\n","\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\ninterface ModalFooterProps { children: React.ReactNode; }\n\nfunction ModalFooter({ children }: ModalFooterProps) {\n return (\n <Stack flexDirection=\"row\" justifyContent=\"flex-end\" alignItems=\"center\">\n {children}\n </Stack>\n );\n}\n\nexport default createComponent(ModalFooter);","import { useState } from 'react';\n\ninterface UseModalProps { open?: boolean; }\n\nexport default function useModal({ open = false }: UseModalProps = {}): [boolean, () => void] {\n const [_open, setOpen] = useState(open);\n\n const toggle = () => setOpen((prev) => !prev);\n\n return [_open, toggle];\n};"],"names":["Modal","children","title","subtitle","isOpen","onClose","props","config","setConfig","useState","timeoutRef","useRef","ANIMATION_DURATION","className","joinClass","prefix","classNameContent","backdropClassName","useEffect","handleOpen","handleClose","prev","jsx","Card","jsxs","CardContent","e","Stack","ButtonIcon","Icon","Modal_default","createComponent","ModalFooter","ModalFooter_default","useModal","open","_open","setOpen"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/feedback/Modal/Modal.tsx","../../../src/feedback/Modal/ModalFooter.tsx","../../../src/feedback/Modal/useModal.ts"],"sourcesContent":["import { useEffect, useRef, useState, type HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '@/core/createComponent';\nimport { Card, CardContent } from '@/display/Card';\nimport Stack from '@/layout/Stack';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport Icon from '@/display/Icon';\n\nimport '@iziui/styles/components/Modal.scss';\n\ntype AnimationClass = 'show' | 'hide';\ntype Config = { animation: AnimationClass, visible: boolean };\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {\n isOpen: boolean;\n onClose: () => void;\n children: React.ReactNode;\n title?: React.JSX.Element;\n subtitle?: React.JSX.Element;\n}\n\nfunction Modal({ children, title, subtitle, isOpen, onClose, ...props }: ModalProps) {\n const [config, setConfig] = useState<Config>({ visible: false, animation: 'hide' });\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const ANIMATION_DURATION = 300;\n\n const className = joinClass(\n `${prefix}-modal`,\n `${prefix}-modal--${config.animation}`\n );\n const classNameContent = joinClass(\n `${prefix}-modal__content`,\n props.className\n );\n const backdropClassName = joinClass(\n `${prefix}-modal__backdrop`,\n `${prefix}-modal__backdrop--${config.animation}`\n );\n\n useEffect(() => {\n document.body.style.overflow = 'hidden';\n\n return () => {\n document.body.style.overflow = 'auto';\n };\n }, []);\n\n useEffect(() => {\n if (isOpen) {\n handleOpen();\n } else {\n handleClose();\n }\n\n return () => {\n if (!timeoutRef.current) { return; }\n clearTimeout(timeoutRef.current);\n timeoutRef.current = null;\n };\n }, [isOpen]);\n\n const handleOpen = () => {\n setConfig(prev => ({ ...prev, visible: true }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, animation: 'show' }));\n document.body.style.overflow = 'hidden';\n }, 100);\n };\n\n const handleClose = () => {\n setConfig(prev => ({ ...prev, animation: 'hide' }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, visible: false }));\n document.body.style.overflow = '';\n }, ANIMATION_DURATION);\n };\n\n return (\n config.visible && (\n <div className={backdropClassName} onClick={onClose}>\n <div className={`${prefix}-modal__container`}>\n <Card className={className}>\n <CardContent onClick={(e) => e.stopPropagation()}>\n <Stack\n alignItems=\"center\"\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n style={{ flexWrap: 'nowrap' }}\n >\n <div>\n {title}\n {subtitle}\n </div>\n <ButtonIcon color=\"grey\" onClick={onClose}>\n <Icon name=\"times\" />\n </ButtonIcon>\n </Stack>\n <div\n {...props}\n className={classNameContent}\n >\n {children}\n </div>\n </CardContent>\n </Card>\n </div>\n </div>\n )\n );\n}\n\nexport default createComponent(Modal);\n","\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\ninterface ModalFooterProps { children: React.ReactNode; }\n\nfunction ModalFooter({ children }: ModalFooterProps) {\n return (\n <Stack flexDirection=\"row\" justifyContent=\"flex-end\" alignItems=\"center\">\n {children}\n </Stack>\n );\n}\n\nexport default createComponent(ModalFooter);","import { useState } from 'react';\n\ninterface UseModalProps { open?: boolean; }\n\nexport default function useModal({ open = false }: UseModalProps = {}): [boolean, () => void] {\n const [_open, setOpen] = useState(open);\n\n const toggle = () => setOpen((prev) => !prev);\n\n return [_open, toggle];\n};"],"names":["Modal","children","title","subtitle","isOpen","onClose","props","config","setConfig","useState","timeoutRef","useRef","ANIMATION_DURATION","className","joinClass","prefix","classNameContent","backdropClassName","useEffect","handleOpen","handleClose","prev","jsx","Card","jsxs","CardContent","e","Stack","ButtonIcon","Icon","Modal_default","createComponent","ModalFooter","ModalFooter_default","useModal","open","_open","setOpen"],"mappings":"4pBAyBA,SAASA,EAAM,CAAE,SAAAC,EAAU,MAAAC,EAAO,SAAAC,EAAU,OAAAC,EAAQ,QAAAC,EAAS,GAAGC,GAAqB,CACnF,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAAA,SAAiB,CAAE,QAAS,GAAO,UAAW,OAAQ,EAC5EC,EAAaC,EAAAA,OAA6C,IAAI,EAE9DC,EAAqB,IAErBC,EAAYC,EAAAA,UAChB,GAAGC,EAAAA,MAAM,SACT,GAAGA,EAAAA,MAAM,WAAWR,EAAO,SAAS,EAAA,EAEhCS,EAAmBF,EAAAA,UACvB,GAAGC,EAAAA,MAAM,kBACTT,EAAM,SAAA,EAEFW,EAAoBH,EAAAA,UACxB,GAAGC,EAAAA,MAAM,mBACT,GAAGA,EAAAA,MAAM,qBAAqBR,EAAO,SAAS,EAAA,EAGhDW,EAAAA,UAAU,KACR,SAAS,KAAK,MAAM,SAAW,SAExB,IAAM,CACX,SAAS,KAAK,MAAM,SAAW,MACjC,GACC,CAAA,CAAE,EAELA,EAAAA,UAAU,KACJd,EACFe,EAAA,EAEAC,EAAA,EAGK,IAAM,CACNV,EAAW,UAChB,aAAaA,EAAW,OAAO,EAC/BA,EAAW,QAAU,KACvB,GACC,CAACN,CAAM,CAAC,EAEX,MAAMe,EAAa,IAAM,CACvBX,MAAmB,CAAE,GAAGa,EAAM,QAAS,IAAO,EAC9CX,EAAW,QAAU,WAAW,IAAM,CACpCF,MAAmB,CAAE,GAAGa,EAAM,UAAW,QAAS,EAClD,SAAS,KAAK,MAAM,SAAW,QACjC,EAAG,GAAG,CACR,EAEMD,EAAc,IAAM,CACxBZ,MAAmB,CAAE,GAAGa,EAAM,UAAW,QAAS,EAClDX,EAAW,QAAU,WAAW,IAAM,CACpCF,MAAmB,CAAE,GAAGa,EAAM,QAAS,IAAQ,EAC/C,SAAS,KAAK,MAAM,SAAW,EACjC,EAAGT,CAAkB,CACvB,EAEA,OACEL,EAAO,SACLe,EAAAA,IAAC,MAAA,CAAI,UAAWL,EAAmB,QAASZ,EAC1C,SAAAiB,EAAAA,IAAC,MAAA,CAAI,UAAW,GAAGP,EAAAA,MAAM,oBACvB,SAAAO,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAAV,EACJ,SAAAW,EAAAA,KAACC,EAAAA,YAAA,CAAY,QAAUC,GAAMA,EAAE,gBAAA,EAC7B,SAAA,CAAAF,EAAAA,KAACG,EAAAA,MAAA,CACC,WAAW,SACX,cAAc,MACd,eAAe,gBACf,MAAO,CAAE,SAAU,QAAA,EAEnB,SAAA,CAAAH,OAAC,MAAA,CACE,SAAA,CAAAtB,EACAC,CAAA,EACH,EACAmB,EAAAA,IAACM,EAAAA,WAAA,CAAW,MAAM,OAAO,QAASvB,EAChC,SAAAiB,EAAAA,IAACO,EAAAA,KAAA,CAAK,KAAK,OAAA,CAAQ,CAAA,CACrB,CAAA,CAAA,CAAA,EAEFP,EAAAA,IAAC,MAAA,CACE,GAAGhB,EACJ,UAAWU,EAEV,SAAAf,CAAA,CAAA,CACH,EACF,CAAA,CACF,EACF,EACF,CAGN,CAEA,MAAA6B,EAAeC,EAAAA,gBAAgB/B,CAAK,EC7GpC,SAASgC,EAAY,CAAE,SAAA/B,GAA8B,CACnD,OACEqB,MAACK,EAAAA,OAAM,cAAc,MAAM,eAAe,WAAW,WAAW,SAC7D,SAAA1B,EACH,CAEJ,CAEA,MAAAgC,EAAeF,EAAAA,gBAAgBC,CAAW,ECX1C,SAAwBE,EAAS,CAAE,KAAAC,EAAO,EAAA,EAAyB,CAAA,EAA2B,CAC5F,KAAM,CAACC,EAAOC,CAAO,EAAI5B,EAAAA,SAAS0B,CAAI,EAItC,MAAO,CAACC,EAFO,IAAMC,EAAShB,GAAS,CAACA,CAAI,CAEvB,CACvB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as d}from"react/jsx-runtime";import{useState as C,useRef as x,useEffect as p}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as f}from"../../chunks/joinClass-anSpaauN.js";import{c as h}from"../../chunks/createComponent-DZqrA_Tp.js";import{C as I}from"../../chunks/Card-wBDtOPXO.js";import{C as M}from"../../chunks/CardContent-D0o8c1Yf.js";import{S as b}from"../../chunks/Stack-D0feJnm7.js";import{B as $}from"../../chunks/ButtonIcon-
|
|
1
|
+
import{jsx as e,jsxs as d}from"react/jsx-runtime";import{useState as C,useRef as x,useEffect as p}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as f}from"../../chunks/joinClass-anSpaauN.js";import{c as h}from"../../chunks/createComponent-DZqrA_Tp.js";import{C as I}from"../../chunks/Card-wBDtOPXO.js";import{C as M}from"../../chunks/CardContent-D0o8c1Yf.js";import{S as b}from"../../chunks/Stack-D0feJnm7.js";import{B as $}from"../../chunks/ButtonIcon-D0YH7wS6.js";import{I as k}from"../../chunks/Icon-0KfCwKWR.js";import"../../chunks/useTheme-g5gOUmLf.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/Ripple-Bq9bxg4k.js";function j({children:n,title:s,subtitle:l,isOpen:c,onClose:a,...u}){const[m,i]=C({visible:!1,animation:"hide"}),r=x(null),v=300,y=f(`${t}-modal`,`${t}-modal--${m.animation}`),_=f(`${t}-modal__content`,u.className),g=f(`${t}-modal__backdrop`,`${t}-modal__backdrop--${m.animation}`);p(()=>(document.body.style.overflow="hidden",()=>{document.body.style.overflow="auto"}),[]),p(()=>(c?N():w(),()=>{r.current&&(clearTimeout(r.current),r.current=null)}),[c]);const N=()=>{i(o=>({...o,visible:!0})),r.current=setTimeout(()=>{i(o=>({...o,animation:"show"})),document.body.style.overflow="hidden"},100)},w=()=>{i(o=>({...o,animation:"hide"})),r.current=setTimeout(()=>{i(o=>({...o,visible:!1})),document.body.style.overflow=""},v)};return m.visible&&e("div",{className:g,onClick:a,children:e("div",{className:`${t}-modal__container`,children:e(I,{className:y,children:d(M,{onClick:o=>o.stopPropagation(),children:[d(b,{alignItems:"center",flexDirection:"row",justifyContent:"space-between",style:{flexWrap:"nowrap"},children:[d("div",{children:[s,l]}),e($,{color:"grey",onClick:a,children:e(k,{name:"times"})})]}),e("div",{...u,className:_,children:n})]})})})})}const G=h(j);function T({children:n}){return e(b,{flexDirection:"row",justifyContent:"flex-end",alignItems:"center",children:n})}const H=h(T);function J({open:n=!1}={}){const[s,l]=C(n);return[s,()=>l(a=>!a)]}export{G as Modal,H as ModalFooter,J as useModal};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/feedback/Modal/Modal.tsx","../../../src/feedback/Modal/ModalFooter.tsx","../../../src/feedback/Modal/useModal.ts"],"sourcesContent":["import { useEffect, useRef, useState, type HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '@/core/createComponent';\nimport { Card, CardContent } from '@/display/Card';\nimport Stack from '@/layout/Stack';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport Icon from '@/display/Icon';\n\nimport '@iziui/styles/components/Modal.scss';\n\ntype AnimationClass = 'show' | 'hide';\ntype Config = { animation: AnimationClass, visible: boolean };\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {\n isOpen: boolean;\n onClose: () => void;\n children: React.ReactNode;\n title?: React.JSX.Element;\n subtitle?: React.JSX.Element;\n}\n\nfunction Modal({ children, title, subtitle, isOpen, onClose, ...props }: ModalProps) {\n const [config, setConfig] = useState<Config>({ visible: false, animation: 'hide' });\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const ANIMATION_DURATION = 300;\n\n const className = joinClass(\n `${prefix}-modal`,\n `${prefix}-modal--${config.animation}`\n );\n const classNameContent = joinClass(\n `${prefix}-modal__content`,\n props.className\n );\n const backdropClassName = joinClass(\n `${prefix}-modal__backdrop`,\n `${prefix}-modal__backdrop--${config.animation}`\n );\n\n useEffect(() => {\n document.body.style.overflow = 'hidden';\n\n return () => {\n document.body.style.overflow = 'auto';\n };\n }, []);\n\n useEffect(() => {\n if (isOpen) {\n handleOpen();\n } else {\n handleClose();\n }\n\n return () => {\n if (!timeoutRef.current) { return; }\n clearTimeout(timeoutRef.current);\n timeoutRef.current = null;\n };\n }, [isOpen]);\n\n const handleOpen = () => {\n setConfig(prev => ({ ...prev, visible: true }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, animation: 'show' }));\n document.body.style.overflow = 'hidden';\n }, 100);\n };\n\n const handleClose = () => {\n setConfig(prev => ({ ...prev, animation: 'hide' }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, visible: false }));\n document.body.style.overflow = '';\n }, ANIMATION_DURATION);\n };\n\n return (\n config.visible && (\n <div className={backdropClassName} onClick={onClose}>\n <div className={`${prefix}-modal__container`}>\n <Card className={className}>\n <CardContent onClick={(e) => e.stopPropagation()}>\n <Stack\n alignItems=\"center\"\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n style={{ flexWrap: 'nowrap' }}\n >\n <div>\n {title}\n {subtitle}\n </div>\n <ButtonIcon color=\"grey\" onClick={onClose}>\n <Icon name=\"times\" />\n </ButtonIcon>\n </Stack>\n <div\n {...props}\n className={classNameContent}\n >\n {children}\n </div>\n </CardContent>\n </Card>\n </div>\n </div>\n )\n );\n}\n\nexport default createComponent(Modal);\n","\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\ninterface ModalFooterProps { children: React.ReactNode; }\n\nfunction ModalFooter({ children }: ModalFooterProps) {\n return (\n <Stack flexDirection=\"row\" justifyContent=\"flex-end\" alignItems=\"center\">\n {children}\n </Stack>\n );\n}\n\nexport default createComponent(ModalFooter);","import { useState } from 'react';\n\ninterface UseModalProps { open?: boolean; }\n\nexport default function useModal({ open = false }: UseModalProps = {}): [boolean, () => void] {\n const [_open, setOpen] = useState(open);\n\n const toggle = () => setOpen((prev) => !prev);\n\n return [_open, toggle];\n};"],"names":["Modal","children","title","subtitle","isOpen","onClose","props","config","setConfig","useState","timeoutRef","useRef","ANIMATION_DURATION","className","joinClass","prefix","classNameContent","backdropClassName","useEffect","handleOpen","handleClose","prev","jsx","Card","jsxs","CardContent","e","Stack","ButtonIcon","Icon","Modal_default","createComponent","ModalFooter","ModalFooter_default","useModal","open","_open","setOpen"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/feedback/Modal/Modal.tsx","../../../src/feedback/Modal/ModalFooter.tsx","../../../src/feedback/Modal/useModal.ts"],"sourcesContent":["import { useEffect, useRef, useState, type HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport createComponent from '@/core/createComponent';\nimport { Card, CardContent } from '@/display/Card';\nimport Stack from '@/layout/Stack';\nimport ButtonIcon from '@/actions/ButtonIcon';\nimport Icon from '@/display/Icon';\n\nimport '@iziui/styles/components/Modal.scss';\n\ntype AnimationClass = 'show' | 'hide';\ntype Config = { animation: AnimationClass, visible: boolean };\n\nexport interface ModalProps extends Omit<HTMLAttributes<HTMLElement>, 'title'> {\n isOpen: boolean;\n onClose: () => void;\n children: React.ReactNode;\n title?: React.JSX.Element;\n subtitle?: React.JSX.Element;\n}\n\nfunction Modal({ children, title, subtitle, isOpen, onClose, ...props }: ModalProps) {\n const [config, setConfig] = useState<Config>({ visible: false, animation: 'hide' });\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const ANIMATION_DURATION = 300;\n\n const className = joinClass(\n `${prefix}-modal`,\n `${prefix}-modal--${config.animation}`\n );\n const classNameContent = joinClass(\n `${prefix}-modal__content`,\n props.className\n );\n const backdropClassName = joinClass(\n `${prefix}-modal__backdrop`,\n `${prefix}-modal__backdrop--${config.animation}`\n );\n\n useEffect(() => {\n document.body.style.overflow = 'hidden';\n\n return () => {\n document.body.style.overflow = 'auto';\n };\n }, []);\n\n useEffect(() => {\n if (isOpen) {\n handleOpen();\n } else {\n handleClose();\n }\n\n return () => {\n if (!timeoutRef.current) { return; }\n clearTimeout(timeoutRef.current);\n timeoutRef.current = null;\n };\n }, [isOpen]);\n\n const handleOpen = () => {\n setConfig(prev => ({ ...prev, visible: true }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, animation: 'show' }));\n document.body.style.overflow = 'hidden';\n }, 100);\n };\n\n const handleClose = () => {\n setConfig(prev => ({ ...prev, animation: 'hide' }));\n timeoutRef.current = setTimeout(() => {\n setConfig(prev => ({ ...prev, visible: false }));\n document.body.style.overflow = '';\n }, ANIMATION_DURATION);\n };\n\n return (\n config.visible && (\n <div className={backdropClassName} onClick={onClose}>\n <div className={`${prefix}-modal__container`}>\n <Card className={className}>\n <CardContent onClick={(e) => e.stopPropagation()}>\n <Stack\n alignItems=\"center\"\n flexDirection=\"row\"\n justifyContent=\"space-between\"\n style={{ flexWrap: 'nowrap' }}\n >\n <div>\n {title}\n {subtitle}\n </div>\n <ButtonIcon color=\"grey\" onClick={onClose}>\n <Icon name=\"times\" />\n </ButtonIcon>\n </Stack>\n <div\n {...props}\n className={classNameContent}\n >\n {children}\n </div>\n </CardContent>\n </Card>\n </div>\n </div>\n )\n );\n}\n\nexport default createComponent(Modal);\n","\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\ninterface ModalFooterProps { children: React.ReactNode; }\n\nfunction ModalFooter({ children }: ModalFooterProps) {\n return (\n <Stack flexDirection=\"row\" justifyContent=\"flex-end\" alignItems=\"center\">\n {children}\n </Stack>\n );\n}\n\nexport default createComponent(ModalFooter);","import { useState } from 'react';\n\ninterface UseModalProps { open?: boolean; }\n\nexport default function useModal({ open = false }: UseModalProps = {}): [boolean, () => void] {\n const [_open, setOpen] = useState(open);\n\n const toggle = () => setOpen((prev) => !prev);\n\n return [_open, toggle];\n};"],"names":["Modal","children","title","subtitle","isOpen","onClose","props","config","setConfig","useState","timeoutRef","useRef","ANIMATION_DURATION","className","joinClass","prefix","classNameContent","backdropClassName","useEffect","handleOpen","handleClose","prev","jsx","Card","jsxs","CardContent","e","Stack","ButtonIcon","Icon","Modal_default","createComponent","ModalFooter","ModalFooter_default","useModal","open","_open","setOpen"],"mappings":"sqBAyBA,SAASA,EAAM,CAAE,SAAAC,EAAU,MAAAC,EAAO,SAAAC,EAAU,OAAAC,EAAQ,QAAAC,EAAS,GAAGC,GAAqB,CACnF,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAiB,CAAE,QAAS,GAAO,UAAW,OAAQ,EAC5EC,EAAaC,EAA6C,IAAI,EAE9DC,EAAqB,IAErBC,EAAYC,EAChB,GAAGC,CAAM,SACT,GAAGA,CAAM,WAAWR,EAAO,SAAS,EAAA,EAEhCS,EAAmBF,EACvB,GAAGC,CAAM,kBACTT,EAAM,SAAA,EAEFW,EAAoBH,EACxB,GAAGC,CAAM,mBACT,GAAGA,CAAM,qBAAqBR,EAAO,SAAS,EAAA,EAGhDW,EAAU,KACR,SAAS,KAAK,MAAM,SAAW,SAExB,IAAM,CACX,SAAS,KAAK,MAAM,SAAW,MACjC,GACC,CAAA,CAAE,EAELA,EAAU,KACJd,EACFe,EAAA,EAEAC,EAAA,EAGK,IAAM,CACNV,EAAW,UAChB,aAAaA,EAAW,OAAO,EAC/BA,EAAW,QAAU,KACvB,GACC,CAACN,CAAM,CAAC,EAEX,MAAMe,EAAa,IAAM,CACvBX,MAAmB,CAAE,GAAGa,EAAM,QAAS,IAAO,EAC9CX,EAAW,QAAU,WAAW,IAAM,CACpCF,MAAmB,CAAE,GAAGa,EAAM,UAAW,QAAS,EAClD,SAAS,KAAK,MAAM,SAAW,QACjC,EAAG,GAAG,CACR,EAEMD,EAAc,IAAM,CACxBZ,MAAmB,CAAE,GAAGa,EAAM,UAAW,QAAS,EAClDX,EAAW,QAAU,WAAW,IAAM,CACpCF,MAAmB,CAAE,GAAGa,EAAM,QAAS,IAAQ,EAC/C,SAAS,KAAK,MAAM,SAAW,EACjC,EAAGT,CAAkB,CACvB,EAEA,OACEL,EAAO,SACLe,EAAC,MAAA,CAAI,UAAWL,EAAmB,QAASZ,EAC1C,SAAAiB,EAAC,MAAA,CAAI,UAAW,GAAGP,CAAM,oBACvB,SAAAO,EAACC,EAAA,CAAK,UAAAV,EACJ,SAAAW,EAACC,EAAA,CAAY,QAAUC,GAAMA,EAAE,gBAAA,EAC7B,SAAA,CAAAF,EAACG,EAAA,CACC,WAAW,SACX,cAAc,MACd,eAAe,gBACf,MAAO,CAAE,SAAU,QAAA,EAEnB,SAAA,CAAAH,EAAC,MAAA,CACE,SAAA,CAAAtB,EACAC,CAAA,EACH,EACAmB,EAACM,EAAA,CAAW,MAAM,OAAO,QAASvB,EAChC,SAAAiB,EAACO,EAAA,CAAK,KAAK,OAAA,CAAQ,CAAA,CACrB,CAAA,CAAA,CAAA,EAEFP,EAAC,MAAA,CACE,GAAGhB,EACJ,UAAWU,EAEV,SAAAf,CAAA,CAAA,CACH,EACF,CAAA,CACF,EACF,EACF,CAGN,CAEA,MAAA6B,EAAeC,EAAgB/B,CAAK,EC7GpC,SAASgC,EAAY,CAAE,SAAA/B,GAA8B,CACnD,OACEqB,EAACK,GAAM,cAAc,MAAM,eAAe,WAAW,WAAW,SAC7D,SAAA1B,EACH,CAEJ,CAEA,MAAAgC,EAAeF,EAAgBC,CAAW,ECX1C,SAAwBE,EAAS,CAAE,KAAAC,EAAO,EAAA,EAAyB,CAAA,EAA2B,CAC5F,KAAM,CAACC,EAAOC,CAAO,EAAI5B,EAAS0B,CAAI,EAItC,MAAO,CAACC,EAFO,IAAMC,EAAShB,GAAS,CAACA,CAAI,CAEvB,CACvB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),o=require("react"),s=require("../../chunks/index-DYxwT4uW.cjs"),n=require("../../chunks/joinClass-Jk3EszKD.cjs"),M=require("../../chunks/Icon-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),o=require("react"),s=require("../../chunks/index-DYxwT4uW.cjs"),n=require("../../chunks/joinClass-Jk3EszKD.cjs"),M=require("../../chunks/Icon-Dv3oduiN.cjs"),C=require("../../chunks/useMenu-Bw3Im-FW.cjs"),k=require("../../chunks/createComponent-BBXW0GJ6.cjs");require("../../chunks/uuid-omnJ9TjZ.cjs");require("../../chunks/useListenerResized-AwpsZLcP.cjs");require("../../chunks/Card-DqoL_8z0.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/CardContent-BOuRiZyj.cjs");require("../../chunks/useTheme-DhX2tM8O.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function S({error:c,color:a="grey",label:u,helperText:p,startIcon:x,children:j,disabled:l,onChange:d,...t}){const f=o.Children.toArray(j),q=o.useMemo(()=>f.find(e=>e.props.value===t.value)?.props.children||"",[t.value]),[_,$,m]=C.useMenu(),v=n.joinClass(`${s.prefix}-select-container`),h=n.joinClass(`${s.prefix}-select-label`,c&&`${s.prefix}-select-label--error`),N=n.joinClass(`${s.prefix}-select`,l&&`${s.prefix}-select--disabled`,c&&`${s.prefix}-select--error`,t.className),y=n.joinClass(`${s.prefix}-select__helper-text`,p&&`${s.prefix}-select__helper-text--visible`,c&&`${s.prefix}-select__helper-text--error`),b=e=>o.cloneElement(e,{className:n.joinClass(e.props.className,`${s.prefix}-select__icon--left`),type:"button",style:{color:a},onClick:i=>{i.stopPropagation(),e.props.onClick&&!l&&e.props.onClick(i)}}),g=()=>f.map(e=>o.cloneElement(e,{color:a,className:n.joinClass(e.props.className,e.props.value===t.value&&`${s.prefix}-select__option--selected`),onClick:i=>{!e.props.disabled&&d&&d(i)}}));return r.jsxs("div",{className:v,children:[u&&r.jsxs("label",{className:h,children:[u," ",t.required&&"*"]}),r.jsxs("button",{type:"button",className:N,onClick:m,disabled:l,children:[r.jsx("div",{children:x&&b(x)}),r.jsx("input",{...t,readOnly:!0,type:"text",value:q,disabled:l}),r.jsx(M.Icon,{name:"angle-down",sx:{color:({grey:e})=>e.main},className:`${s.prefix}-select__icon--right`})]}),r.jsx(C.Menu,{autoClose:!0,direction:"center",open:_,anchorEl:$,onClose:m,children:g()}),r.jsx("span",{className:y,children:p})]})}const E=k.createComponent(S);exports.default=E;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as a,jsx as l}from"react/jsx-runtime";import{Children as M,useMemo as w,cloneElement as _}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as r}from"../../chunks/joinClass-anSpaauN.js";import{I as E}from"../../chunks/Icon-
|
|
1
|
+
import{jsxs as a,jsx as l}from"react/jsx-runtime";import{Children as M,useMemo as w,cloneElement as _}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as r}from"../../chunks/joinClass-anSpaauN.js";import{I as E}from"../../chunks/Icon-0KfCwKWR.js";import{u as I,M as O}from"../../chunks/useMenu-DU5PYJUH.js";import{c as S}from"../../chunks/createComponent-DZqrA_Tp.js";import"../../chunks/uuid-dGvr9vBZ.js";import"../../chunks/useListenerResized-Bnqxrt7k.js";import"../../chunks/Card-wBDtOPXO.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/CardContent-D0o8c1Yf.js";import"../../chunks/useTheme-g5gOUmLf.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function q({error:c,color:i="grey",label:p,helperText:m,startIcon:u,children:$,disabled:o,onChange:d,...s}){const f=M.toArray($),h=w(()=>f.find(e=>e.props.value===s.value)?.props.children||"",[s.value]),[N,v,C]=I(),x=r(`${t}-select-container`),y=r(`${t}-select-label`,c&&`${t}-select-label--error`),b=r(`${t}-select`,o&&`${t}-select--disabled`,c&&`${t}-select--error`,s.className),g=r(`${t}-select__helper-text`,m&&`${t}-select__helper-text--visible`,c&&`${t}-select__helper-text--error`),k=e=>_(e,{className:r(e.props.className,`${t}-select__icon--left`),type:"button",style:{color:i},onClick:n=>{n.stopPropagation(),e.props.onClick&&!o&&e.props.onClick(n)}}),j=()=>f.map(e=>_(e,{color:i,className:r(e.props.className,e.props.value===s.value&&`${t}-select__option--selected`),onClick:n=>{!e.props.disabled&&d&&d(n)}}));return a("div",{className:x,children:[p&&a("label",{className:y,children:[p," ",s.required&&"*"]}),a("button",{type:"button",className:b,onClick:C,disabled:o,children:[l("div",{children:u&&k(u)}),l("input",{...s,readOnly:!0,type:"text",value:h,disabled:o}),l(E,{name:"angle-down",sx:{color:({grey:e})=>e.main},className:`${t}-select__icon--right`})]}),l(O,{autoClose:!0,direction:"center",open:N,anchorEl:v,onClose:C,children:j()}),l("span",{className:g,children:m})]})}const T=S(q);export{T as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),i=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),r=require("../../chunks/joinClass-Jk3EszKD.cjs"),m=require("../../chunks/uuid-omnJ9TjZ.cjs"),b=require("../../chunks/Stack-DsVkiTT_.cjs"),p=require("../../chunks/createComponent-BBXW0GJ6.cjs");require("../../chunks/useTheme-DhX2tM8O.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function w({label:o,error:n,helperText:a,color:h="primary",...c}){const[l,u]=i.useState(!!c.checked),x=r.joinClass(`${e.prefix}-switch__checkbox`,`${e.prefix}-switch__checkbox--${h}`),d=r.joinClass(`${e.prefix}-switch__label`,n&&`${e.prefix}-switch__label--error`),_=r.joinClass(`${e.prefix}-switch__helper-text`,n&&`${e.prefix}-switch__helper-text--error`,a&&`${e.prefix}-switch__helper-text--visible`),s=i.useMemo(()=>`${e.prefix}-switch-${m.uuid()}`,[]);i.useEffect(()=>{u(!!c.checked)},[c.checked]);const f=()=>{c.onChange&&c.onChange({type:"checkbox",target:{checked:!l}})};return t.jsxs(b.Stack,{gap:2,style:{width:"fit-content"},children:[t.jsx("label",{htmlFor:s,className:d,children:o}),t.jsxs("div",{className:`${e.prefix}-switch`,children:[t.jsx("input",{...c,type:"checkbox",id:s,className:x,onChange:f,checked:l}),t.jsx("label",{className:`${e.prefix}-switch__box`,htmlFor:s,children:t.jsx("span",{className:`${e.prefix}-switch__button`})})]}),t.jsx("span",{className:_,children:a})]})}const j=p.createComponent(w);exports.default=j;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/fields/Switch/Switch.tsx"],"sourcesContent":["import { InputHTMLAttributes, useEffect, useMemo, useState } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Switch.scss';\n\nexport interface SwitchProps extends InputHTMLAttributes<HTMLInputElement> {\n label?: string;\n error?: boolean;\n helperText?: string;\n color?: Colors;\n auto?: boolean;\n}\n\nfunction Switch({ label, error, helperText, color = 'primary', ...props }: SwitchProps) {\n const [checked, setChecked] = useState(Boolean(props.checked));\n\n const classNameCheckbox = joinClass(\n `${prefix}-switch__checkbox`,\n `${prefix}-switch__checkbox--${color}`,\n );\n\n const classNameLabel = joinClass(\n `${prefix}-switch__label`,\n error && `${prefix}-switch__label--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-switch__helper-text`,\n error && `${prefix}-switch__helper-text--error`,\n helperText && `${prefix}-switch__helper-text--visible`,\n );\n\n const id = useMemo(() => `${prefix}-switch-${uuid()}`, []);\n\n useEffect(() => { setChecked(Boolean(props.checked)); }, [props.checked]);\n\n const handleToggle = () => {\n if (!props.onChange) { return; }\n\n props.onChange({\n type: 'checkbox',\n target: { checked: !checked }\n } as React.ChangeEvent<HTMLInputElement>);\n };\n\n return (\n <Stack gap={2}>\n <label htmlFor={id} className={classNameLabel}>\n {label}\n </label>\n <div className={`${prefix}-switch`}>\n <input\n {...props}\n type=\"checkbox\"\n id={id}\n className={classNameCheckbox}\n onChange={handleToggle}\n checked={checked}\n />\n <label className={`${prefix}-switch__box`} htmlFor={id}>\n <span className={`${prefix}-switch__button`} />\n </label>\n </div>\n <span className={helperTextClss}>{helperText}</span>\n </Stack>\n );\n}\n\nexport default createComponent(Switch);"],"names":["Switch","label","error","helperText","color","props","checked","setChecked","useState","classNameCheckbox","joinClass","prefix","classNameLabel","helperTextClss","id","useMemo","uuid","useEffect","handleToggle","jsxs","Stack","jsx","Switch_default","createComponent"],"mappings":"2fAuBA,SAASA,EAAO,CAAE,MAAAC,EAAO,MAAAC,EAAO,WAAAC,EAAY,MAAAC,EAAQ,UAAW,GAAGC,GAAsB,CACtF,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAQH,EAAM,OAAQ,EAEvDI,EAAoBC,EAAAA,UACxB,GAAGC,EAAAA,MAAM,oBACT,GAAGA,EAAAA,MAAM,sBAAsBP,CAAK,EAAA,EAGhCQ,EAAiBF,EAAAA,UACrB,GAAGC,EAAAA,MAAM,iBACTT,GAAS,GAAGS,EAAAA,MAAM,uBAAA,EAGdE,EAAiBH,EAAAA,UACrB,GAAGC,EAAAA,MAAM,uBACTT,GAAS,GAAGS,EAAAA,MAAM,8BAClBR,GAAc,GAAGQ,EAAAA,MAAM,+BAAA,EAGnBG,EAAKC,UAAQ,IAAM,GAAGJ,EAAAA,MAAM,WAAWK,EAAAA,KAAA,CAAM,GAAI,EAAE,EAEzDC,EAAAA,UAAU,IAAM,CAAEV,EAAW,EAAQF,EAAM,OAAQ,CAAG,EAAG,CAACA,EAAM,OAAO,CAAC,EAExE,MAAMa,EAAe,IAAM,CACpBb,EAAM,UAEXA,EAAM,SAAS,CACb,KAAM,WACN,OAAQ,CAAE,QAAS,CAACC,CAAA,CAAQ,CACU,CAC1C,EAEA,OACEa,EAAAA,KAACC,
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/fields/Switch/Switch.tsx"],"sourcesContent":["import { InputHTMLAttributes, useEffect, useMemo, useState } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Switch.scss';\n\nexport interface SwitchProps extends InputHTMLAttributes<HTMLInputElement> {\n label?: string;\n error?: boolean;\n helperText?: string;\n color?: Colors;\n auto?: boolean;\n}\n\nfunction Switch({ label, error, helperText, color = 'primary', ...props }: SwitchProps) {\n const [checked, setChecked] = useState(Boolean(props.checked));\n\n const classNameCheckbox = joinClass(\n `${prefix}-switch__checkbox`,\n `${prefix}-switch__checkbox--${color}`,\n );\n\n const classNameLabel = joinClass(\n `${prefix}-switch__label`,\n error && `${prefix}-switch__label--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-switch__helper-text`,\n error && `${prefix}-switch__helper-text--error`,\n helperText && `${prefix}-switch__helper-text--visible`,\n );\n\n const id = useMemo(() => `${prefix}-switch-${uuid()}`, []);\n\n useEffect(() => { setChecked(Boolean(props.checked)); }, [props.checked]);\n\n const handleToggle = () => {\n if (!props.onChange) { return; }\n\n props.onChange({\n type: 'checkbox',\n target: { checked: !checked }\n } as React.ChangeEvent<HTMLInputElement>);\n };\n\n return (\n <Stack gap={2} style={{ width: 'fit-content' }}>\n <label htmlFor={id} className={classNameLabel}>\n {label}\n </label>\n <div className={`${prefix}-switch`}>\n <input\n {...props}\n type=\"checkbox\"\n id={id}\n className={classNameCheckbox}\n onChange={handleToggle}\n checked={checked}\n />\n <label className={`${prefix}-switch__box`} htmlFor={id}>\n <span className={`${prefix}-switch__button`} />\n </label>\n </div>\n <span className={helperTextClss}>{helperText}</span>\n </Stack>\n );\n}\n\nexport default createComponent(Switch);"],"names":["Switch","label","error","helperText","color","props","checked","setChecked","useState","classNameCheckbox","joinClass","prefix","classNameLabel","helperTextClss","id","useMemo","uuid","useEffect","handleToggle","jsxs","Stack","jsx","Switch_default","createComponent"],"mappings":"2fAuBA,SAASA,EAAO,CAAE,MAAAC,EAAO,MAAAC,EAAO,WAAAC,EAAY,MAAAC,EAAQ,UAAW,GAAGC,GAAsB,CACtF,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAQH,EAAM,OAAQ,EAEvDI,EAAoBC,EAAAA,UACxB,GAAGC,EAAAA,MAAM,oBACT,GAAGA,EAAAA,MAAM,sBAAsBP,CAAK,EAAA,EAGhCQ,EAAiBF,EAAAA,UACrB,GAAGC,EAAAA,MAAM,iBACTT,GAAS,GAAGS,EAAAA,MAAM,uBAAA,EAGdE,EAAiBH,EAAAA,UACrB,GAAGC,EAAAA,MAAM,uBACTT,GAAS,GAAGS,EAAAA,MAAM,8BAClBR,GAAc,GAAGQ,EAAAA,MAAM,+BAAA,EAGnBG,EAAKC,UAAQ,IAAM,GAAGJ,EAAAA,MAAM,WAAWK,EAAAA,KAAA,CAAM,GAAI,EAAE,EAEzDC,EAAAA,UAAU,IAAM,CAAEV,EAAW,EAAQF,EAAM,OAAQ,CAAG,EAAG,CAACA,EAAM,OAAO,CAAC,EAExE,MAAMa,EAAe,IAAM,CACpBb,EAAM,UAEXA,EAAM,SAAS,CACb,KAAM,WACN,OAAQ,CAAE,QAAS,CAACC,CAAA,CAAQ,CACU,CAC1C,EAEA,OACEa,EAAAA,KAACC,SAAM,IAAK,EAAG,MAAO,CAAE,MAAO,eAC7B,SAAA,CAAAC,MAAC,QAAA,CAAM,QAASP,EAAI,UAAWF,EAC5B,SAAAX,EACH,EACAkB,EAAAA,KAAC,MAAA,CAAI,UAAW,GAAGR,QAAM,UACvB,SAAA,CAAAU,EAAAA,IAAC,QAAA,CACE,GAAGhB,EACJ,KAAK,WACL,GAAAS,EACA,UAAWL,EACX,SAAUS,EACV,QAAAZ,CAAA,CAAA,EAEFe,EAAAA,IAAC,QAAA,CAAM,UAAW,GAAGV,QAAM,eAAgB,QAASG,EAClD,SAAAO,EAAAA,IAAC,OAAA,CAAK,UAAW,GAAGV,QAAM,kBAAmB,CAAA,CAC/C,CAAA,EACF,EACAU,EAAAA,IAAC,OAAA,CAAK,UAAWR,EAAiB,SAAAV,CAAA,CAAW,CAAA,EAC/C,CAEJ,CAEA,MAAAmB,EAAeC,EAAAA,gBAAgBvB,CAAM"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as l,jsx as
|
|
1
|
+
import{jsxs as l,jsx as c}from"react/jsx-runtime";import{useState as b,useMemo as p,useEffect as u}from"react";import{p as e}from"../../chunks/index-CZ41y9Hn.js";import{j as a}from"../../chunks/joinClass-anSpaauN.js";import{u as x}from"../../chunks/uuid-dGvr9vBZ.js";import{S as $}from"../../chunks/Stack-D0feJnm7.js";import{c as k}from"../../chunks/createComponent-DZqrA_Tp.js";import"../../chunks/useTheme-g5gOUmLf.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function C({label:n,error:o,helperText:i,color:r="primary",...t}){const[h,m]=b(!!t.checked),_=a(`${e}-switch__checkbox`,`${e}-switch__checkbox--${r}`),d=a(`${e}-switch__label`,o&&`${e}-switch__label--error`),f=a(`${e}-switch__helper-text`,o&&`${e}-switch__helper-text--error`,i&&`${e}-switch__helper-text--visible`),s=p(()=>`${e}-switch-${x()}`,[]);u(()=>{m(!!t.checked)},[t.checked]);const w=()=>{t.onChange&&t.onChange({type:"checkbox",target:{checked:!h}})};return l($,{gap:2,style:{width:"fit-content"},children:[c("label",{htmlFor:s,className:d,children:n}),l("div",{className:`${e}-switch`,children:[c("input",{...t,type:"checkbox",id:s,className:_,onChange:w,checked:h}),c("label",{className:`${e}-switch__box`,htmlFor:s,children:c("span",{className:`${e}-switch__button`})})]}),c("span",{className:f,children:i})]})}const L=k(C);export{L as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/fields/Switch/Switch.tsx"],"sourcesContent":["import { InputHTMLAttributes, useEffect, useMemo, useState } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Switch.scss';\n\nexport interface SwitchProps extends InputHTMLAttributes<HTMLInputElement> {\n label?: string;\n error?: boolean;\n helperText?: string;\n color?: Colors;\n auto?: boolean;\n}\n\nfunction Switch({ label, error, helperText, color = 'primary', ...props }: SwitchProps) {\n const [checked, setChecked] = useState(Boolean(props.checked));\n\n const classNameCheckbox = joinClass(\n `${prefix}-switch__checkbox`,\n `${prefix}-switch__checkbox--${color}`,\n );\n\n const classNameLabel = joinClass(\n `${prefix}-switch__label`,\n error && `${prefix}-switch__label--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-switch__helper-text`,\n error && `${prefix}-switch__helper-text--error`,\n helperText && `${prefix}-switch__helper-text--visible`,\n );\n\n const id = useMemo(() => `${prefix}-switch-${uuid()}`, []);\n\n useEffect(() => { setChecked(Boolean(props.checked)); }, [props.checked]);\n\n const handleToggle = () => {\n if (!props.onChange) { return; }\n\n props.onChange({\n type: 'checkbox',\n target: { checked: !checked }\n } as React.ChangeEvent<HTMLInputElement>);\n };\n\n return (\n <Stack gap={2}>\n <label htmlFor={id} className={classNameLabel}>\n {label}\n </label>\n <div className={`${prefix}-switch`}>\n <input\n {...props}\n type=\"checkbox\"\n id={id}\n className={classNameCheckbox}\n onChange={handleToggle}\n checked={checked}\n />\n <label className={`${prefix}-switch__box`} htmlFor={id}>\n <span className={`${prefix}-switch__button`} />\n </label>\n </div>\n <span className={helperTextClss}>{helperText}</span>\n </Stack>\n );\n}\n\nexport default createComponent(Switch);"],"names":["Switch","label","error","helperText","color","props","checked","setChecked","useState","classNameCheckbox","joinClass","prefix","classNameLabel","helperTextClss","id","useMemo","uuid","useEffect","handleToggle","jsxs","Stack","jsx","Switch_default","createComponent"],"mappings":"4dAuBA,SAASA,EAAO,CAAE,MAAAC,EAAO,MAAAC,EAAO,WAAAC,EAAY,MAAAC,EAAQ,UAAW,GAAGC,GAAsB,CACtF,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAS,EAAQH,EAAM,OAAQ,EAEvDI,EAAoBC,EACxB,GAAGC,CAAM,oBACT,GAAGA,CAAM,sBAAsBP,CAAK,EAAA,EAGhCQ,EAAiBF,EACrB,GAAGC,CAAM,iBACTT,GAAS,GAAGS,CAAM,uBAAA,EAGdE,EAAiBH,EACrB,GAAGC,CAAM,uBACTT,GAAS,GAAGS,CAAM,8BAClBR,GAAc,GAAGQ,CAAM,+BAAA,EAGnBG,EAAKC,EAAQ,IAAM,GAAGJ,CAAM,WAAWK,EAAA,CAAM,GAAI,EAAE,EAEzDC,EAAU,IAAM,CAAEV,EAAW,EAAQF,EAAM,OAAQ,CAAG,EAAG,CAACA,EAAM,OAAO,CAAC,EAExE,MAAMa,EAAe,IAAM,CACpBb,EAAM,UAEXA,EAAM,SAAS,CACb,KAAM,WACN,OAAQ,CAAE,QAAS,CAACC,CAAA,CAAQ,CACU,CAC1C,EAEA,OACEa,EAACC,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/fields/Switch/Switch.tsx"],"sourcesContent":["import { InputHTMLAttributes, useEffect, useMemo, useState } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Stack from '@/layout/Stack';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Switch.scss';\n\nexport interface SwitchProps extends InputHTMLAttributes<HTMLInputElement> {\n label?: string;\n error?: boolean;\n helperText?: string;\n color?: Colors;\n auto?: boolean;\n}\n\nfunction Switch({ label, error, helperText, color = 'primary', ...props }: SwitchProps) {\n const [checked, setChecked] = useState(Boolean(props.checked));\n\n const classNameCheckbox = joinClass(\n `${prefix}-switch__checkbox`,\n `${prefix}-switch__checkbox--${color}`,\n );\n\n const classNameLabel = joinClass(\n `${prefix}-switch__label`,\n error && `${prefix}-switch__label--error`,\n );\n\n const helperTextClss = joinClass(\n `${prefix}-switch__helper-text`,\n error && `${prefix}-switch__helper-text--error`,\n helperText && `${prefix}-switch__helper-text--visible`,\n );\n\n const id = useMemo(() => `${prefix}-switch-${uuid()}`, []);\n\n useEffect(() => { setChecked(Boolean(props.checked)); }, [props.checked]);\n\n const handleToggle = () => {\n if (!props.onChange) { return; }\n\n props.onChange({\n type: 'checkbox',\n target: { checked: !checked }\n } as React.ChangeEvent<HTMLInputElement>);\n };\n\n return (\n <Stack gap={2} style={{ width: 'fit-content' }}>\n <label htmlFor={id} className={classNameLabel}>\n {label}\n </label>\n <div className={`${prefix}-switch`}>\n <input\n {...props}\n type=\"checkbox\"\n id={id}\n className={classNameCheckbox}\n onChange={handleToggle}\n checked={checked}\n />\n <label className={`${prefix}-switch__box`} htmlFor={id}>\n <span className={`${prefix}-switch__button`} />\n </label>\n </div>\n <span className={helperTextClss}>{helperText}</span>\n </Stack>\n );\n}\n\nexport default createComponent(Switch);"],"names":["Switch","label","error","helperText","color","props","checked","setChecked","useState","classNameCheckbox","joinClass","prefix","classNameLabel","helperTextClss","id","useMemo","uuid","useEffect","handleToggle","jsxs","Stack","jsx","Switch_default","createComponent"],"mappings":"4dAuBA,SAASA,EAAO,CAAE,MAAAC,EAAO,MAAAC,EAAO,WAAAC,EAAY,MAAAC,EAAQ,UAAW,GAAGC,GAAsB,CACtF,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAS,EAAQH,EAAM,OAAQ,EAEvDI,EAAoBC,EACxB,GAAGC,CAAM,oBACT,GAAGA,CAAM,sBAAsBP,CAAK,EAAA,EAGhCQ,EAAiBF,EACrB,GAAGC,CAAM,iBACTT,GAAS,GAAGS,CAAM,uBAAA,EAGdE,EAAiBH,EACrB,GAAGC,CAAM,uBACTT,GAAS,GAAGS,CAAM,8BAClBR,GAAc,GAAGQ,CAAM,+BAAA,EAGnBG,EAAKC,EAAQ,IAAM,GAAGJ,CAAM,WAAWK,EAAA,CAAM,GAAI,EAAE,EAEzDC,EAAU,IAAM,CAAEV,EAAW,EAAQF,EAAM,OAAQ,CAAG,EAAG,CAACA,EAAM,OAAO,CAAC,EAExE,MAAMa,EAAe,IAAM,CACpBb,EAAM,UAEXA,EAAM,SAAS,CACb,KAAM,WACN,OAAQ,CAAE,QAAS,CAACC,CAAA,CAAQ,CACU,CAC1C,EAEA,OACEa,EAACC,GAAM,IAAK,EAAG,MAAO,CAAE,MAAO,eAC7B,SAAA,CAAAC,EAAC,QAAA,CAAM,QAASP,EAAI,UAAWF,EAC5B,SAAAX,EACH,EACAkB,EAAC,MAAA,CAAI,UAAW,GAAGR,CAAM,UACvB,SAAA,CAAAU,EAAC,QAAA,CACE,GAAGhB,EACJ,KAAK,WACL,GAAAS,EACA,UAAWL,EACX,SAAUS,EACV,QAAAZ,CAAA,CAAA,EAEFe,EAAC,QAAA,CAAM,UAAW,GAAGV,CAAM,eAAgB,QAASG,EAClD,SAAAO,EAAC,OAAA,CAAK,UAAW,GAAGV,CAAM,kBAAmB,CAAA,CAC/C,CAAA,EACF,EACAU,EAAC,OAAA,CAAK,UAAWR,EAAiB,SAAAV,CAAA,CAAW,CAAA,EAC/C,CAEJ,CAEA,MAAAmB,EAAeC,EAAgBvB,CAAM"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),n=require("react"),f=require("../../chunks/index-DYxwT4uW.cjs"),h=require("../../chunks/joinClass-Jk3EszKD.cjs"),C=require("../../chunks/createComponent-BBXW0GJ6.cjs"),p=require("../../chunks/useTheme-DhX2tM8O.cjs"),b=require("../../chunks/Alert-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),n=require("react"),f=require("../../chunks/index-DYxwT4uW.cjs"),h=require("../../chunks/joinClass-Jk3EszKD.cjs"),C=require("../../chunks/createComponent-BBXW0GJ6.cjs"),p=require("../../chunks/useTheme-DhX2tM8O.cjs"),b=require("../../chunks/Alert-Cc5S-AfT.cjs"),R=require("../../chunks/uuid-omnJ9TjZ.cjs"),g=require("../../chunks/Zoom-BOnqwiDY.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/Stack-DsVkiTT_.cjs");require("../../chunks/Typography-C7B3jwUf.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");require("../../chunks/ButtonIcon-B-M87M5L.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/Icon-Dv3oduiN.cjs");function y({id:o,color:i,message:u,icon:c,delay:a,onRemove:l,...e}){const t=n.useRef(null),{theme:{mode:r}}=p.useTheme(),j=h.joinClass(`${f.prefix}-toast`,e.className);n.useEffect(()=>(T(),q),[]);const m=()=>{o&&l(o)},T=()=>{t.current=setTimeout(()=>{m()},a)},q=()=>{t.current&&(clearTimeout(t.current),t.current=null)};return s.jsx(b.Alert,{className:j,icon:c,sx:{backgroundColor:({text:d})=>d.primary,color:d=>d[i][r]},onClose:m,onMouseEnter:q,onMouseLeave:T,children:u})}const x=C.createComponent(y),v=n.createContext({toasts:[],add:()=>{}});function M({children:o}){const[i,u]=n.useState([]),c=n.useMemo(()=>({toasts:i,add:e=>{a(e)}}),[i]),a=e=>{u(t=>[...t,{id:R.uuid(),visible:!0,...e}])},l=e=>{u(t=>t.map(r=>(r.id===e&&(r.visible=!1),r))),setTimeout(()=>{u(t=>t.filter(r=>r.id!==e))},500)};return s.jsxs(v.Provider,{value:c,children:[s.jsx("div",{className:`${f.prefix}-toast-container`,children:i.map(({...e})=>s.jsx("div",{style:{marginBottom:15},children:s.jsx(g.Zoom,{enter:!!e.visible,children:s.jsx(x,{...e,onRemove:l})})},e.id))}),o]})}function P(){const{add:o}=n.useContext(v);return{addToast:o}}exports.Toast=x;exports.ToastProvider=M;exports.useToast=P;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as i,jsxs as x}from"react/jsx-runtime";import{useRef as h,useEffect as C,useState as b,useMemo as j,createContext as R,useContext as M}from"react";import{p as f}from"../../chunks/index-CZ41y9Hn.js";import{j as N}from"../../chunks/joinClass-anSpaauN.js";import{c as $}from"../../chunks/createComponent-DZqrA_Tp.js";import{u as g}from"../../chunks/useTheme-g5gOUmLf.js";import{A as y}from"../../chunks/Alert-
|
|
1
|
+
import{jsx as i,jsxs as x}from"react/jsx-runtime";import{useRef as h,useEffect as C,useState as b,useMemo as j,createContext as R,useContext as M}from"react";import{p as f}from"../../chunks/index-CZ41y9Hn.js";import{j as N}from"../../chunks/joinClass-anSpaauN.js";import{c as $}from"../../chunks/createComponent-DZqrA_Tp.js";import{u as g}from"../../chunks/useTheme-g5gOUmLf.js";import{A as y}from"../../chunks/Alert-DJexLc9y.js";import{u as A}from"../../chunks/uuid-dGvr9vBZ.js";import{Z as B}from"../../chunks/Zoom-DqgU4Wfv.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/Stack-D0feJnm7.js";import"../../chunks/Typography-hazfs4Ye.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";import"../../chunks/ButtonIcon-D0YH7wS6.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/Icon-0KfCwKWR.js";function E({id:r,color:s,message:n,icon:m,delay:a,onRemove:c,...t}){const o=h(null),{theme:{mode:e}}=g(),v=N(`${f}-toast`,t.className);C(()=>(d(),p),[]);const l=()=>{r&&c(r)},d=()=>{o.current=setTimeout(()=>{l()},a)},p=()=>{o.current&&(clearTimeout(o.current),o.current=null)};return i(y,{className:v,icon:m,sx:{backgroundColor:({text:u})=>u.primary,color:u=>u[s][e]},onClose:l,onMouseEnter:p,onMouseLeave:d,children:n})}const P=$(E),T=R({toasts:[],add:()=>{}});function U({children:r}){const[s,n]=b([]),m=j(()=>({toasts:s,add:t=>{a(t)}}),[s]),a=t=>{n(o=>[...o,{id:A(),visible:!0,...t}])},c=t=>{n(o=>o.map(e=>(e.id===t&&(e.visible=!1),e))),setTimeout(()=>{n(o=>o.filter(e=>e.id!==t))},500)};return x(T.Provider,{value:m,children:[i("div",{className:`${f}-toast-container`,children:s.map(({...t})=>i("div",{style:{marginBottom:15},children:i(B,{enter:!!t.visible,children:i(P,{...t,onRemove:c})})},t.id))}),r]})}function V(){const{add:r}=M(T);return{addToast:r}}export{P as Toast,U as ToastProvider,V as useToast};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/index.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");const o=require("./chunks/useTheme-DhX2tM8O.cjs"),i=require("./chunks/Bounce-ByNbJjX0.cjs"),e=require("./chunks/useForm-BNLOy0E6.cjs"),a=require("./chunks/Fade-CM-5xRVt.cjs"),s=require("./chunks/Slide-D4aLHjYS.cjs"),u=require("./chunks/TableHeader-DNnzAUGG.cjs"),d=require("./chunks/Zoom-BOnqwiDY.cjs"),r=require("./chunks/DrawerContent-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");const o=require("./chunks/useTheme-DhX2tM8O.cjs"),i=require("./chunks/Bounce-ByNbJjX0.cjs"),e=require("./chunks/useForm-BNLOy0E6.cjs"),a=require("./chunks/Fade-CM-5xRVt.cjs"),s=require("./chunks/Slide-D4aLHjYS.cjs"),u=require("./chunks/TableHeader-DNnzAUGG.cjs"),d=require("./chunks/Zoom-BOnqwiDY.cjs"),r=require("./chunks/DrawerContent-CvWZGjje.cjs"),l=require("./chunks/useListenerResized-AwpsZLcP.cjs"),t=require("./chunks/useMenu-Bw3Im-FW.cjs"),q=require("./chunks/useResize-B-oebgDR.cjs"),c=require("./chunks/Card-DqoL_8z0.cjs"),m=require("./chunks/CardContent-BOuRiZyj.cjs"),n=require("./chunks/GridItem-wwo-SHGR.cjs"),C=require("./chunks/MenuButton-BF6coRYt.cjs"),T=require("./chunks/Typography-C7B3jwUf.cjs");require("react");require("./chunks/generateSupportColors-CTMoGhDf.cjs");require("./chunks/index-DYxwT4uW.cjs");require("./chunks/joinClass-Jk3EszKD.cjs");require("./chunks/createComponent-BBXW0GJ6.cjs");require("./chunks/Stack-DsVkiTT_.cjs");require("./chunks/ButtonIcon-B-M87M5L.cjs");require("./chunks/Ripple-Dy4i91j1.cjs");require("./chunks/Icon-Dv3oduiN.cjs");require("./chunks/uuid-omnJ9TjZ.cjs");require("./chunks/convertPathToColor-D8eBpd_D.cjs");exports.ThemeProvider=o.ThemeProvider;exports.createTheme=o.createTheme;exports.useTheme=o.useTheme;exports.Bounce=i.Bounce;exports.Control=e.Control;exports.Form=e.Form;exports.useControl=e.useControl;exports.useForm=e.useForm;exports.useFormGroup=e.useFormGroup;exports.Fade=a.Fade;exports.Slide=s.Slide;exports.Table=u.Table_default;exports.TableBody=u.TableBody;exports.TableCell=u.TableCell_default;exports.TableHeader=u.TableHeader;exports.Zoom=d.Zoom;exports.Drawer=r.Drawer_default;exports.DrawerContent=r.DrawerContent_default;exports.DrawerFooter=r.DrawerFooter_default;exports.DrawerHeader=r.DrawerHeader_default;exports.useDrawer=r.useDrawer;exports.useListenerResized=l.useListenerResized;exports.Menu=t.Menu;exports.useMenu=t.useMenu;exports.useResize=q.useResize;exports.Card=c.Card;exports.CardContent=m.CardContent;exports.Grid=n.Grid;exports.GridItem=n.GridItem;exports.MenuButton=C.MenuButton_default;exports.variants=T.variants;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"react/jsx-runtime";import{T as C,c as l,u as T}from"./chunks/useTheme-g5gOUmLf.js";import{B as F}from"./chunks/Bounce-DP0PU3kr.js";import{C as c,F as w,u as M,a as B,b as G}from"./chunks/useForm-iwGfb88g.js";import{F as v}from"./chunks/Fade-spxq-W-Q.js";import{S as H}from"./chunks/Slide-BxEwoZ70.js";import{T as S,a as Z,b as y,c as I}from"./chunks/TableHeader-BDY2xI-0.js";import{Z as P}from"./chunks/Zoom-DqgU4Wfv.js";import{D as j,a as k,b as q,c as A,u as E}from"./chunks/DrawerContent-
|
|
1
|
+
import"react/jsx-runtime";import{T as C,c as l,u as T}from"./chunks/useTheme-g5gOUmLf.js";import{B as F}from"./chunks/Bounce-DP0PU3kr.js";import{C as c,F as w,u as M,a as B,b as G}from"./chunks/useForm-iwGfb88g.js";import{F as v}from"./chunks/Fade-spxq-W-Q.js";import{S as H}from"./chunks/Slide-BxEwoZ70.js";import{T as S,a as Z,b as y,c as I}from"./chunks/TableHeader-BDY2xI-0.js";import{Z as P}from"./chunks/Zoom-DqgU4Wfv.js";import{D as j,a as k,b as q,c as A,u as E}from"./chunks/DrawerContent-DswF1783.js";import{u as K}from"./chunks/useListenerResized-Bnqxrt7k.js";import{M as O,u as Q}from"./chunks/useMenu-DU5PYJUH.js";import{u as V}from"./chunks/useResize-BjM6tiAF.js";import{C as X}from"./chunks/Card-wBDtOPXO.js";import{C as _}from"./chunks/CardContent-D0o8c1Yf.js";import{G as rr,a as er}from"./chunks/GridItem-CaoPZmBu.js";import{M as ar}from"./chunks/MenuButton-DbrtU31-.js";import{v as tr}from"./chunks/Typography-hazfs4Ye.js";import"react";import"./chunks/generateSupportColors-BN5t8dA-.js";import"./chunks/index-CZ41y9Hn.js";import"./chunks/joinClass-anSpaauN.js";import"./chunks/createComponent-DZqrA_Tp.js";import"./chunks/Stack-D0feJnm7.js";import"./chunks/ButtonIcon-D0YH7wS6.js";import"./chunks/Ripple-Bq9bxg4k.js";import"./chunks/Icon-0KfCwKWR.js";import"./chunks/uuid-dGvr9vBZ.js";import"./chunks/convertPathToColor-DtOjH4ZP.js";export{F as Bounce,X as Card,_ as CardContent,c as Control,j as Drawer,k as DrawerContent,q as DrawerFooter,A as DrawerHeader,v as Fade,w as Form,rr as Grid,er as GridItem,O as Menu,ar as MenuButton,H as Slide,S as Table,Z as TableBody,y as TableCell,I as TableHeader,C as ThemeProvider,P as Zoom,l as createTheme,M as useControl,E as useDrawer,B as useForm,G as useFormGroup,K as useListenerResized,Q as useMenu,V as useResize,T as useTheme,tr as variants};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/style.css
CHANGED
|
@@ -31,8 +31,8 @@
|
|
|
31
31
|
/*$vite$:1*/
|
|
32
32
|
/* assets/index-tn0RQdqM.css */
|
|
33
33
|
/*$vite$:1*/
|
|
34
|
-
/* assets/index-
|
|
35
|
-
.iziui-input-container{width:100%;position:relative}.iziui-input-label{font-size:12px;color:var(--text-secondary);display:block;margin-bottom:5px}.iziui-input-label--error{color:var(--error)}.iziui-input{cursor:text;border-radius:var(--radius);border:1px solid var(--divider);position:relative;background-color:var(--background-default);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;justify-content:space-between;align-items:center}.iziui-input:focus-within{outline:2px solid var(--primary)}.iziui-input--error{border-color:var(--error)}.iziui-input--disabled{cursor:not-allowed;background:var(--divider);color:var(--text-disabled)}.iziui-input input{background:transparent;height:100%;width:100%;border:none;outline:none;-webkit-user-select:none;user-select:none;padding:10.8px 14.4px;color:var(--text-primary);transition:all .3s cubic-bezier(.4,0,.2,1);font-size:16px}.iziui-input input:-internal-autofill-selected{-webkit-text-fill-color:var(--divider)}.iziui-input input::placeholder{color:var(--
|
|
34
|
+
/* assets/index-DYPt7lEw.css */
|
|
35
|
+
.iziui-input-container{width:100%;position:relative}.iziui-input-label{font-size:12px;color:var(--text-secondary);display:block;margin-bottom:5px}.iziui-input-label--error{color:var(--error)}.iziui-input{cursor:text;border-radius:var(--radius);border:1px solid var(--divider);position:relative;background-color:var(--background-default);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;justify-content:space-between;align-items:center}.iziui-input:focus-within{outline:2px solid var(--primary)}.iziui-input--error{border-color:var(--error)}.iziui-input--disabled{cursor:not-allowed;background:var(--divider);color:var(--text-disabled)}.iziui-input input{background:transparent;height:100%;width:100%;border:none;outline:none;-webkit-user-select:none;user-select:none;padding:10.8px 14.4px;color:var(--text-primary);transition:all .3s cubic-bezier(.4,0,.2,1);font-size:16px}.iziui-input input:-internal-autofill-selected{-webkit-text-fill-color:var(--divider)}.iziui-input input::placeholder{color:var(--);opacity:1}.iziui-input input:disabled{cursor:not-allowed}.iziui-input__helper-text{opacity:0;margin:6px 0 0;transition:all .3s cubic-bezier(.4,0,.2,1);font-size:12px;transform:translateY(-10px)}.iziui-input__helper-text--visible{opacity:1;transform:translateY(0)}.iziui-input__helper-text--error{color:var(--error)}.iziui-input__icon{color:var(--text-secondary)}.iziui-input__icon--margin-left{margin-right:8px;margin-left:-8px}.iziui-input__icon--margin-right{margin-right:-8px;margin-left:8px}.iziui-input__icon--padding-left{padding-right:8px;padding-left:-8px}.iziui-input__icon--padding-right{padding-right:-8px;padding-left:8px}
|
|
36
36
|
/*$vite$:1*/
|
|
37
37
|
/* assets/index-BuyOiNeP.css */
|
|
38
38
|
.iziui-checkbox-group .iziui-checkbox--primary--checked,.iziui-checkbox-group .iziui-checkbox--primary:hover{background-color:var(--primary-opacity)}.iziui-checkbox-group .iziui-checkbox--primary:active{background-color:var(--primary-light)}.iziui-checkbox-group .iziui-checkbox--secondary--checked,.iziui-checkbox-group .iziui-checkbox--secondary:hover{background-color:var(--secondary-opacity)}.iziui-checkbox-group .iziui-checkbox--secondary:active{background-color:var(--secondary-light)}.iziui-checkbox-group .iziui-checkbox--info--checked,.iziui-checkbox-group .iziui-checkbox--info:hover{background-color:var(--info-opacity)}.iziui-checkbox-group .iziui-checkbox--info:active{background-color:var(--info-light)}.iziui-checkbox-group .iziui-checkbox--error--checked,.iziui-checkbox-group .iziui-checkbox--error:hover{background-color:var(--error-opacity)}.iziui-checkbox-group .iziui-checkbox--error:active{background-color:var(--error-light)}.iziui-checkbox-group .iziui-checkbox--warning--checked,.iziui-checkbox-group .iziui-checkbox--warning:hover{background-color:var(--warning-opacity)}.iziui-checkbox-group .iziui-checkbox--warning:active{background-color:var(--warning-light)}.iziui-checkbox-group .iziui-checkbox--success--checked,.iziui-checkbox-group .iziui-checkbox--success:hover{background-color:var(--success-opacity)}.iziui-checkbox-group .iziui-checkbox--success:active{background-color:var(--success-light)}.iziui-checkbox-group .iziui-checkbox--grey--checked,.iziui-checkbox-group .iziui-checkbox--grey:hover{background-color:var(--grey-opacity)}.iziui-checkbox-group .iziui-checkbox--grey:active{background-color:var(--grey-light)}
|
|
@@ -46,8 +46,8 @@
|
|
|
46
46
|
/* assets/ButtonIcon-COrrQJcN.css */
|
|
47
47
|
.iziui-button-icon{position:relative;border-radius:50%;border:none;background-color:transparent;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;padding:5px;display:flex;justify-content:center;align-items:center}.iziui-button-icon:hover{background-color:var(--divider)}.iziui-button-icon:disabled{background-color:var(--text-disabled);color:var(--text-secondary);cursor:not-allowed}.iziui-button-icon:disabled:hover{background-color:var(--text-disabled)!important}.iziui-button-icon--primary{color:var(--primary)}.iziui-button-icon--primary:hover{background-color:var(--primary-opacity)}.iziui-button-icon--secondary{color:var(--secondary)}.iziui-button-icon--secondary:hover{background-color:var(--secondary-opacity)}.iziui-button-icon--info{color:var(--info)}.iziui-button-icon--info:hover{background-color:var(--info-opacity)}.iziui-button-icon--error{color:var(--error)}.iziui-button-icon--error:hover{background-color:var(--error-opacity)}.iziui-button-icon--warning{color:var(--warning)}.iziui-button-icon--warning:hover{background-color:var(--warning-opacity)}.iziui-button-icon--success{color:var(--success)}.iziui-button-icon--success:hover{background-color:var(--success-opacity)}.iziui-button-icon--grey{color:var(--grey)}.iziui-button-icon--grey:hover{background-color:var(--grey-opacity)}
|
|
48
48
|
/*$vite$:1*/
|
|
49
|
-
/* assets/Icon-
|
|
50
|
-
.iziui-icon{transition:all .3s cubic-bezier(.4,0,.2,1);color:currentColor}
|
|
49
|
+
/* assets/Icon-Dw_BtwcS.css */
|
|
50
|
+
.iziui-icon{transition:all .3s cubic-bezier(.4,0,.2,1);color:currentColor}.iziui-icon--primary{color:var(--primary)}.iziui-icon--secondary{color:var(--secondary)}.iziui-icon--info{color:var(--info)}.iziui-icon--error{color:var(--error)}.iziui-icon--warning{color:var(--warning)}.iziui-icon--success{color:var(--success)}.iziui-icon--grey{color:var(--grey)}
|
|
51
51
|
/*$vite$:1*/
|
|
52
52
|
/* assets/Stack-CaqHhBiY.css */
|
|
53
53
|
.iziui-stack{width:100%;display:flex}
|
package/package.json
CHANGED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{jsxs as u,jsx as f}from"react/jsx-runtime";import{cloneElement as h}from"react";import{p as n}from"./index-CZ41y9Hn.js";import{j}from"./joinClass-anSpaauN.js";import{c as x}from"./convertPathToColor-DtOjH4ZP.js";import{u as y}from"./useTheme-g5gOUmLf.js";import{R as C}from"./Ripple-Bq9bxg4k.js";import{c as $}from"./createComponent-DZqrA_Tp.js";function b({children:m,size:r=40,color:o="primary",...t}){const{theme:{palette:c}}=y(),[e,a]=[r,r],i=j(`${n}-button-icon`,o&&`${n}-button-icon--${o}`,t.className),l=x(o,c),p=s=>h(s,{size:e/1.5,...s.props,style:{color:"currentColor"}});return u("button",{...t,className:i,style:{color:l,...t.style,width:e,height:a},children:[p(m),f(C,{})]})}const w=$(b);export{w as B};
|
|
2
|
-
//# sourceMappingURL=ButtonIcon-Cad6goHv.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonIcon-Cad6goHv.js","sources":["../../src/actions/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { cloneElement, type ButtonHTMLAttributes, type PropsWithChildren, type ReactElement } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { convertPathToColor } from '@iziui/core/utils/convertPathToColor';\n\nimport type { IconProps } from '@/display/Icon';\nimport { useTheme } from '@/theme';\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport '@iziui/styles/components/ButtonIcon.scss';\n\nexport interface ButtonIconProps extends PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>> {\n color?: Colors;\n size?: number;\n children: ReactElement<IconProps>;\n};\nfunction ButtonIcon({ children, size = 40, color = 'primary', ...props }: ButtonIconProps) {\n const { theme: { palette } } = useTheme();\n\n const [width, height] = [size, size];\n\n const classess = joinClass(\n `${prefix}-button-icon`,\n color && `${prefix}-button-icon--${color}`,\n props.className\n );\n\n const c = convertPathToColor(color, palette);\n\n const renderIcon = (icon: ReactElement<IconProps>) => {\n return cloneElement(icon, {\n size: width / 1.5,\n ...icon.props,\n style: { color: 'currentColor' }\n });\n };\n\n return (\n <button\n {...props}\n className={classess}\n style={{ color: c, ...props.style, width, height }}\n >\n {renderIcon(children)}\n <Ripple />\n </button>\n );\n}\n\nexport default createComponent(ButtonIcon);"],"names":["ButtonIcon","children","size","color","props","palette","useTheme","width","height","classess","joinClass","prefix","c","convertPathToColor","renderIcon","icon","cloneElement","jsxs","Ripple","ButtonIcon$1","createComponent"],"mappings":"iWAoBA,SAASA,EAAW,CAAE,SAAAC,EAAU,KAAAC,EAAO,GAAI,MAAAC,EAAQ,UAAW,GAAGC,GAA0B,CACzF,KAAM,CAAE,MAAO,CAAE,QAAAC,CAAA,CAAQ,EAAMC,EAAA,EAEzB,CAACC,EAAOC,CAAM,EAAI,CAACN,EAAMA,CAAI,EAE7BO,EAAWC,EACf,GAAGC,CAAM,eACTR,GAAS,GAAGQ,CAAM,iBAAiBR,CAAK,GACxCC,EAAM,SAAA,EAGFQ,EAAIC,EAAmBV,EAAOE,CAAO,EAErCS,EAAcC,GACXC,EAAaD,EAAM,CACxB,KAAMR,EAAQ,IACd,GAAGQ,EAAK,MACR,MAAO,CAAE,MAAO,cAAA,CAAe,CAChC,EAGH,OACEE,EAAC,SAAA,CACE,GAAGb,EACJ,UAAWK,EACX,MAAO,CAAE,MAAOG,EAAG,GAAGR,EAAM,MAAO,MAAAG,EAAO,OAAAC,CAAA,EAEzC,SAAA,CAAAM,EAAWb,CAAQ,IACnBiB,EAAA,CAAA,CAAO,CAAA,CAAA,CAAA,CAGd,CAEA,MAAAC,EAAeC,EAAgBpB,CAAU"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";const s=require("react/jsx-runtime"),p=require("react"),c=require("./index-DYxwT4uW.cjs"),q=require("./joinClass-Jk3EszKD.cjs"),C=require("./convertPathToColor-D8eBpd_D.cjs"),x=require("./useTheme-DhX2tM8O.cjs"),j=require("./Ripple-Dy4i91j1.cjs"),d=require("./createComponent-BBXW0GJ6.cjs");function y({children:i,size:n=40,color:e="primary",...t}){const{theme:{palette:u}}=x.useTheme(),[o,l]=[n,n],a=q.joinClass(`${c.prefix}-button-icon`,e&&`${c.prefix}-button-icon--${e}`,t.className),m=C.convertPathToColor(e,u),h=r=>p.cloneElement(r,{size:o/1.5,...r.props,style:{color:"currentColor"}});return s.jsxs("button",{...t,className:a,style:{color:m,...t.style,width:o,height:l},children:[h(i),s.jsx(j.Ripple,{})]})}const I=d.createComponent(y);exports.ButtonIcon=I;
|
|
2
|
-
//# sourceMappingURL=ButtonIcon-QfMInabj.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonIcon-QfMInabj.cjs","sources":["../../src/actions/ButtonIcon/ButtonIcon.tsx"],"sourcesContent":["import { cloneElement, type ButtonHTMLAttributes, type PropsWithChildren, type ReactElement } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport type { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { convertPathToColor } from '@iziui/core/utils/convertPathToColor';\n\nimport type { IconProps } from '@/display/Icon';\nimport { useTheme } from '@/theme';\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport '@iziui/styles/components/ButtonIcon.scss';\n\nexport interface ButtonIconProps extends PropsWithChildren<ButtonHTMLAttributes<HTMLButtonElement>> {\n color?: Colors;\n size?: number;\n children: ReactElement<IconProps>;\n};\nfunction ButtonIcon({ children, size = 40, color = 'primary', ...props }: ButtonIconProps) {\n const { theme: { palette } } = useTheme();\n\n const [width, height] = [size, size];\n\n const classess = joinClass(\n `${prefix}-button-icon`,\n color && `${prefix}-button-icon--${color}`,\n props.className\n );\n\n const c = convertPathToColor(color, palette);\n\n const renderIcon = (icon: ReactElement<IconProps>) => {\n return cloneElement(icon, {\n size: width / 1.5,\n ...icon.props,\n style: { color: 'currentColor' }\n });\n };\n\n return (\n <button\n {...props}\n className={classess}\n style={{ color: c, ...props.style, width, height }}\n >\n {renderIcon(children)}\n <Ripple />\n </button>\n );\n}\n\nexport default createComponent(ButtonIcon);"],"names":["ButtonIcon","children","size","color","props","palette","useTheme","width","height","classess","joinClass","prefix","c","convertPathToColor","renderIcon","icon","cloneElement","jsxs","Ripple","createComponent"],"mappings":"gTAoBA,SAASA,EAAW,CAAE,SAAAC,EAAU,KAAAC,EAAO,GAAI,MAAAC,EAAQ,UAAW,GAAGC,GAA0B,CACzF,KAAM,CAAE,MAAO,CAAE,QAAAC,CAAA,CAAQ,EAAMC,EAAAA,SAAA,EAEzB,CAACC,EAAOC,CAAM,EAAI,CAACN,EAAMA,CAAI,EAE7BO,EAAWC,EAAAA,UACf,GAAGC,EAAAA,MAAM,eACTR,GAAS,GAAGQ,EAAAA,MAAM,iBAAiBR,CAAK,GACxCC,EAAM,SAAA,EAGFQ,EAAIC,EAAAA,mBAAmBV,EAAOE,CAAO,EAErCS,EAAcC,GACXC,EAAAA,aAAaD,EAAM,CACxB,KAAMR,EAAQ,IACd,GAAGQ,EAAK,MACR,MAAO,CAAE,MAAO,cAAA,CAAe,CAChC,EAGH,OACEE,EAAAA,KAAC,SAAA,CACE,GAAGb,EACJ,UAAWK,EACX,MAAO,CAAE,MAAOG,EAAG,GAAGR,EAAM,MAAO,MAAAG,EAAO,OAAAC,CAAA,EAEzC,SAAA,CAAAM,EAAWb,CAAQ,QACnBiB,EAAAA,OAAA,CAAA,CAAO,CAAA,CAAA,CAAA,CAGd,CAEA,MAAAlB,EAAemB,EAAAA,gBAAgBnB,CAAU"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{jsx as n}from"react/jsx-runtime";import{p as c}from"./index-CZ41y9Hn.js";import{j as e}from"./joinClass-anSpaauN.js";import{c as m}from"./createComponent-DZqrA_Tp.js";function r({name:s,size:t=24,...o}){const i=e(`${c}-icon`,"uil",`uil-${s}`,o.className);return n("i",{...o,className:i,style:{fontSize:t,...o.style}})}const u=m(r);export{u as I};
|
|
2
|
-
//# sourceMappingURL=Icon-BGZ3K3Nf.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Icon-BGZ3K3Nf.js","sources":["../../src/display/Icon/Icon.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Icon.scss';\n\nexport interface IconProps extends HTMLAttributes<HTMLElement> {\n name: string;\n size?: number;\n}\n\nfunction Icon({ name, size = 24, ...props }: IconProps) {\n const clss = joinClass(\n `${prefix}-icon`,\n 'uil',\n `uil-${name}`,\n props.className\n );\n\n return (\n <i {...props} className={clss} style={{ fontSize: size, ...props.style }}></i>\n );\n}\n\nexport default createComponent(Icon);"],"names":["Icon","name","size","props","clss","joinClass","prefix","jsx","Icon$1","createComponent"],"mappings":"8KAeA,SAASA,EAAK,CAAE,KAAAC,EAAM,KAAAC,EAAO,GAAI,GAAGC,GAAoB,CACtD,MAAMC,EAAOC,EACX,GAAGC,CAAM,QACT,MACA,OAAOL,CAAI,GACXE,EAAM,SAAA,EAGR,OACEI,EAAC,IAAA,CAAG,GAAGJ,EAAO,UAAWC,EAAM,MAAO,CAAE,SAAUF,EAAM,GAAGC,EAAM,MAAM,CAAG,CAE9E,CAEA,MAAAK,EAAeC,EAAgBT,CAAI"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";const c=require("react/jsx-runtime"),i=require("./index-DYxwT4uW.cjs"),o=require("./joinClass-Jk3EszKD.cjs"),r=require("./createComponent-BBXW0GJ6.cjs");function u({name:n,size:s=24,...e}){const t=o.joinClass(`${i.prefix}-icon`,"uil",`uil-${n}`,e.className);return c.jsx("i",{...e,className:t,style:{fontSize:s,...e.style}})}const l=r.createComponent(u);exports.Icon=l;
|
|
2
|
-
//# sourceMappingURL=Icon-D5fDXkwG.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Icon-D5fDXkwG.cjs","sources":["../../src/display/Icon/Icon.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Icon.scss';\n\nexport interface IconProps extends HTMLAttributes<HTMLElement> {\n name: string;\n size?: number;\n}\n\nfunction Icon({ name, size = 24, ...props }: IconProps) {\n const clss = joinClass(\n `${prefix}-icon`,\n 'uil',\n `uil-${name}`,\n props.className\n );\n\n return (\n <i {...props} className={clss} style={{ fontSize: size, ...props.style }}></i>\n );\n}\n\nexport default createComponent(Icon);"],"names":["Icon","name","size","props","clss","joinClass","prefix","jsx","createComponent"],"mappings":"sKAeA,SAASA,EAAK,CAAE,KAAAC,EAAM,KAAAC,EAAO,GAAI,GAAGC,GAAoB,CACtD,MAAMC,EAAOC,EAAAA,UACX,GAAGC,EAAAA,MAAM,QACT,MACA,OAAOL,CAAI,GACXE,EAAM,SAAA,EAGR,OACEI,EAAAA,IAAC,IAAA,CAAG,GAAGJ,EAAO,UAAWC,EAAM,MAAO,CAAE,SAAUF,EAAM,GAAGC,EAAM,MAAM,CAAG,CAE9E,CAEA,MAAAH,EAAeQ,EAAAA,gBAAgBR,CAAI"}
|