@xanui/ui 1.1.9 → 1.1.11

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/Input/index.js CHANGED
@@ -110,13 +110,13 @@
110
110
  borderRadius: 1,
111
111
  px: 1,
112
112
  py: .5,
113
- }, baseClass: 'input-container', disabled: disabled || false, ref: conRef }, _size, { height: multiline ? "auto" : _size.height, minHeight: _size.height, children: [startIcon && jsxRuntime.jsx(core.Tag, { sxr: {
113
+ }, baseClass: 'input-container', disabled: disabled || false, ref: conRef }, _size, { height: multiline ? "auto" : _size.height, minHeight: _size.height, children: [startIcon && jsxRuntime.jsx(core.Tag, { flex: "0 0 auto", sxr: {
114
114
  height: "100%",
115
115
  alignItems: 'center',
116
116
  justifyContent: "center",
117
117
  display: "flex",
118
118
  color: error ? "danger.primary" : "text.secondary",
119
- }, baseClass: "input-start-icon", children: startIcon }), jsxRuntime.jsx(core.Tag, { sxr: {
119
+ }, baseClass: "input-start-icon", children: startIcon }), jsxRuntime.jsx(core.Tag, { flex: 1, sxr: {
120
120
  display: "flex",
121
121
  alignItems: "center",
122
122
  flex: 1,
@@ -144,7 +144,7 @@
144
144
  }, onBlur: (e) => {
145
145
  focused !== null && focused !== void 0 ? focused : setFocused(false);
146
146
  onBlur && onBlur(e);
147
- } })) }), endIcon && jsxRuntime.jsx(core.Tag, { sxr: {
147
+ } })) }), endIcon && jsxRuntime.jsx(core.Tag, { flex: "0 0 auto", sxr: {
148
148
  height: "100%",
149
149
  alignItems: 'center',
150
150
  justifyContent: "center",
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/Input/index.tsx"],"sourcesContent":["\nimport React, { MutableRefObject, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, UseColorTemplateColor, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport Text from '../Text';\n\n\nexport type InputProps<T extends TagComponentType = \"input\"> = Omit<TagProps<T>, \"size\" | \"color\"> & {\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n iconPlacement?: useBreakpointPropsType<\"start\" | \"center\" | \"end\">;\n focused?: boolean;\n color?: useBreakpointPropsType<Omit<UseColorTemplateColor, \"default\">>;\n containerRef?: MutableRefObject<HTMLDivElement | undefined>;\n variant?: useBreakpointPropsType<\"fill\" | \"outline\" | \"text\">;\n error?: boolean;\n helperText?: useBreakpointPropsType<string>;\n multiline?: boolean;\n size?: useBreakpointPropsType<\"small\" | \"medium\" | \"large\">;\n rows?: useBreakpointPropsType<number>;\n minRows?: useBreakpointPropsType<number>;\n maxRows?: useBreakpointPropsType<number>;\n slotProps?: {\n container?: Omit<TagProps<\"div\">, \"children\">\n }\n}\n\nconst Input = React.forwardRef(<T extends TagComponentType = \"input\">({ value, ...props }: InputProps<T>, ref?: React.Ref<any>) => {\n let [{\n startIcon,\n endIcon,\n iconPlacement,\n onFocus,\n color,\n onBlur,\n focused,\n containerRef,\n disabled,\n variant,\n error,\n helperText,\n multiline,\n size,\n rows,\n minRows,\n maxRows,\n slotProps,\n ...rest\n }, theme] = useInterface<any>(\"Input\", props, {})\n const _p: any = {}\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (iconPlacement) _p.iconPlacement = iconPlacement\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (helperText) _p.helperText = helperText\n if (size) _p.size = size\n if (rows) _p.rows = rows\n if (minRows) _p.minRows = minRows\n if (maxRows) _p.maxRows = maxRows\n const p: any = useBreakpointProps(_p)\n startIcon = p.startIcon\n endIcon = p.endIcon\n iconPlacement = p.iconPlacement\n color = p.color ?? \"brand\"\n variant = p.variant ?? \"fill\"\n helperText = p.helperText\n size = p.size ?? 'medium'\n rows = p.rows\n minRows = p.minRows\n maxRows = p.maxRows\n\n ref ??= useRef(null);\n iconPlacement ??= multiline ? \"end\" : \"center\"\n if (!value) iconPlacement = 'center'\n\n const [_focused, setFocused] = useState(false)\n const conRef: any = useRef(null)\n let _focus = focused || _focused\n\n useEffect(() => {\n if (containerRef) {\n (containerRef as any).current = conRef?.current\n }\n }, [containerRef])\n\n let _rows = useMemo(() => {\n if (rows) return rows\n if (value && multiline) {\n let lines = (value as string).split(`\\n`).length\n if (minRows && minRows > lines) {\n return minRows\n } else if (maxRows && maxRows < lines) {\n return maxRows\n } else {\n return lines\n }\n }\n }, [value]) || 1\n\n const sizes: any = {\n small: {\n height: 40,\n gap: .5,\n fontSize: 'button',\n },\n medium: {\n height: 48,\n gap: 1,\n fontSize: \"text\"\n },\n large: {\n height: 52,\n gap: 1,\n fontSize: 'big'\n }\n }\n\n const _size = sizes[size]\n let borderColor = _focus ? color : (variant === \"fill\" ? \"transparent\" : \"divider\")\n borderColor = error ? \"danger.primary\" : borderColor\n let multiprops: any = {}\n if (multiline) {\n multiprops = {\n rows: _rows,\n sx: {\n resize: \"none\"\n }\n }\n }\n\n useEffect(() => {\n if ((ref as any).current) {\n (ref as any).current.style.height = \"auto\";\n (ref as any).current.style.height = `${(ref as any).current.scrollHeight}px`;\n }\n }, [value]);\n\n return (\n <Tag\n baseClass={`input${_focus ? \" input-focused\" : \"\"}`}\n >\n <Tag\n {...slotProps?.container}\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: iconPlacement === 'center' ? iconPlacement : `flex-${iconPlacement}`,\n flexWrap: \"nowrap\",\n minWidth: 150,\n transitionProperty: \"border, box-shadow, background\",\n bgcolor: error ? \"danger.soft.primary\" : variant === \"fill\" ? \"background.secondary\" : \"background.primary\",\n border: variant === \"text\" ? 0 : \"1px solid\",\n borderColor: borderColor,\n borderRadius: 1,\n px: 1,\n py: .5,\n }}\n baseClass='input-container'\n disabled={disabled || false}\n ref={conRef}\n {..._size}\n height={multiline ? \"auto\" : _size.height}\n minHeight={_size.height}\n >\n {startIcon && <Tag\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: \"flex\",\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-start-icon\"\n >{startIcon}</Tag>}\n <Tag\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n flex: 1,\n minHeight: _size.height,\n \"& textarea\": {\n resize: \"none\"\n },\n \"& input:-webkit-autofill,& input:-webkit-autofill:hover, & input:-webkit-autofill:focus,& input:-webkit-autofill:active\": {\n \"-webkit-text-fill-color\": \"text.primary\",\n \"box-shadow\": `0 0 0px 1000px ${variant === \"fill\" ? theme.colors.background.secondary : theme.colors.background.primary} inset`,\n transition: \"background-color 5000s ease-in-out 0s\"\n } as any\n }}\n >\n <Tag\n component={multiline ? 'textarea' : 'input'}\n {...multiprops}\n {...rest}\n sxr={{\n border: 0,\n outline: 0,\n bgcolor: \"transparent\",\n color: error ? \"danger.primary\" : \"text.primary\",\n fontSize: _size.fontSize,\n height: multiline ? \"auto\" : _size.height + \"px!important\",\n width: \"100%\",\n maxHeight: 200,\n }}\n value={value}\n baseClass='input-box'\n ref={ref}\n onFocus={(e: any) => {\n focused ?? setFocused(true)\n onFocus && onFocus(e)\n }}\n onBlur={(e: any) => {\n focused ?? setFocused(false)\n onBlur && onBlur(e)\n }}\n />\n </Tag>\n {endIcon && <Tag\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: 'flex',\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-end-icon\"\n >{endIcon}</Tag>}\n </Tag>\n {helperText && <Text\n pl={.5}\n height={_size.height}\n className=\"input-helper-text\"\n fontSize=\"small\"\n color={error ? \"danger.primary\" : \"text.primary\"}\n >{helperText}</Text>}\n </Tag>\n )\n})\n\nexport default Input\n"],"names":["__rest","useInterface","useBreakpointProps","useRef","useState","useEffect","useMemo","_jsxs","Tag","_jsx","Text"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../src/Input/index.tsx"],"sourcesContent":["\nimport React, { MutableRefObject, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\nimport { Tag, TagProps, TagComponentType, UseColorTemplateColor, useBreakpointPropsType, useInterface, useBreakpointProps } from '@xanui/core';\nimport Text from '../Text';\n\n\n\nexport type InputProps<T extends TagComponentType = \"input\"> = Omit<TagProps<T>, \"size\" | \"color\"> & {\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n iconPlacement?: useBreakpointPropsType<\"start\" | \"center\" | \"end\">;\n focused?: boolean;\n color?: useBreakpointPropsType<Omit<UseColorTemplateColor, \"default\">>;\n containerRef?: MutableRefObject<HTMLDivElement | undefined>;\n variant?: useBreakpointPropsType<\"fill\" | \"outline\" | \"text\">;\n error?: boolean;\n helperText?: useBreakpointPropsType<string>;\n multiline?: boolean;\n size?: useBreakpointPropsType<\"small\" | \"medium\" | \"large\">;\n rows?: useBreakpointPropsType<number>;\n minRows?: useBreakpointPropsType<number>;\n maxRows?: useBreakpointPropsType<number>;\n slotProps?: {\n container?: Omit<TagProps<\"div\">, \"children\">\n }\n}\n\nconst Input = React.forwardRef(<T extends TagComponentType = \"input\">({ value, ...props }: InputProps<T>, ref?: React.Ref<any>) => {\n let [{\n startIcon,\n endIcon,\n iconPlacement,\n onFocus,\n color,\n onBlur,\n focused,\n containerRef,\n disabled,\n variant,\n error,\n helperText,\n multiline,\n size,\n rows,\n minRows,\n maxRows,\n slotProps,\n ...rest\n }, theme] = useInterface<any>(\"Input\", props, {})\n\n const _p: any = {}\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (iconPlacement) _p.iconPlacement = iconPlacement\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (helperText) _p.helperText = helperText\n if (size) _p.size = size\n if (rows) _p.rows = rows\n if (minRows) _p.minRows = minRows\n if (maxRows) _p.maxRows = maxRows\n const p: any = useBreakpointProps(_p)\n startIcon = p.startIcon\n endIcon = p.endIcon\n iconPlacement = p.iconPlacement\n color = p.color ?? \"brand\"\n variant = p.variant ?? \"fill\"\n helperText = p.helperText\n size = p.size ?? 'medium'\n rows = p.rows\n minRows = p.minRows\n maxRows = p.maxRows\n\n ref ??= useRef(null);\n iconPlacement ??= multiline ? \"end\" : \"center\"\n if (!value) iconPlacement = 'center'\n\n const [_focused, setFocused] = useState(false)\n const conRef: any = useRef(null)\n let _focus = focused || _focused\n\n useEffect(() => {\n if (containerRef) {\n (containerRef as any).current = conRef?.current\n }\n }, [containerRef])\n\n let _rows = useMemo(() => {\n if (rows) return rows\n if (value && multiline) {\n let lines = (value as string).split(`\\n`).length\n if (minRows && minRows > lines) {\n return minRows\n } else if (maxRows && maxRows < lines) {\n return maxRows\n } else {\n return lines\n }\n }\n }, [value]) || 1\n\n const sizes: any = {\n small: {\n height: 40,\n gap: .5,\n fontSize: 'button',\n },\n medium: {\n height: 48,\n gap: 1,\n fontSize: \"text\"\n },\n large: {\n height: 52,\n gap: 1,\n fontSize: 'big'\n }\n }\n\n const _size = sizes[size]\n let borderColor = _focus ? color : (variant === \"fill\" ? \"transparent\" : \"divider\")\n borderColor = error ? \"danger.primary\" : borderColor\n let multiprops: any = {}\n if (multiline) {\n multiprops = {\n rows: _rows,\n sx: {\n resize: \"none\"\n }\n }\n }\n\n useEffect(() => {\n if ((ref as any).current) {\n (ref as any).current.style.height = \"auto\";\n (ref as any).current.style.height = `${(ref as any).current.scrollHeight}px`;\n }\n }, [value]);\n\n return (\n <Tag\n baseClass={`input${_focus ? \" input-focused\" : \"\"}`}\n >\n <Tag\n {...slotProps?.container}\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: iconPlacement === 'center' ? iconPlacement : `flex-${iconPlacement}`,\n flexWrap: \"nowrap\",\n minWidth: 150,\n transitionProperty: \"border, box-shadow, background\",\n bgcolor: error ? \"danger.soft.primary\" : variant === \"fill\" ? \"background.secondary\" : \"background.primary\",\n border: variant === \"text\" ? 0 : \"1px solid\",\n borderColor: borderColor,\n borderRadius: 1,\n px: 1,\n py: .5,\n }}\n baseClass='input-container'\n disabled={disabled || false}\n ref={conRef}\n {..._size}\n height={multiline ? \"auto\" : _size.height}\n minHeight={_size.height}\n >\n {startIcon && <Tag\n flex={\"0 0 auto\"}\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: \"flex\",\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-start-icon\"\n >{startIcon}</Tag>}\n <Tag\n flex={1}\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n flex: 1,\n minHeight: _size.height,\n \"& textarea\": {\n resize: \"none\"\n },\n \"& input:-webkit-autofill,& input:-webkit-autofill:hover, & input:-webkit-autofill:focus,& input:-webkit-autofill:active\": {\n \"-webkit-text-fill-color\": \"text.primary\",\n \"box-shadow\": `0 0 0px 1000px ${variant === \"fill\" ? theme.colors.background.secondary : theme.colors.background.primary} inset`,\n transition: \"background-color 5000s ease-in-out 0s\"\n } as any\n }}\n >\n <Tag\n component={multiline ? 'textarea' : 'input'}\n {...multiprops}\n {...rest}\n sxr={{\n border: 0,\n outline: 0,\n bgcolor: \"transparent\",\n color: error ? \"danger.primary\" : \"text.primary\",\n fontSize: _size.fontSize,\n height: multiline ? \"auto\" : _size.height + \"px!important\",\n width: \"100%\",\n maxHeight: 200,\n }}\n value={value}\n baseClass='input-box'\n ref={ref}\n onFocus={(e: any) => {\n focused ?? setFocused(true)\n onFocus && onFocus(e)\n }}\n onBlur={(e: any) => {\n focused ?? setFocused(false)\n onBlur && onBlur(e)\n }}\n />\n </Tag>\n {endIcon && <Tag\n flex={\"0 0 auto\"}\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: 'flex',\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-end-icon\"\n >{endIcon}</Tag>}\n </Tag>\n {helperText && <Text\n pl={.5}\n height={_size.height}\n className=\"input-helper-text\"\n fontSize=\"small\"\n color={error ? \"danger.primary\" : \"text.primary\"}\n >{helperText}</Text>}\n </Tag>\n )\n})\n\nexport default Input\n"],"names":["__rest","useInterface","useBreakpointProps","useRef","useState","useEffect","useMemo","_jsxs","Tag","_jsx","Text"],"mappings":"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"}
package/Input/index.mjs CHANGED
@@ -110,13 +110,13 @@ import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React
110
110
  borderRadius: 1,
111
111
  px: 1,
112
112
  py: .5,
113
- }, baseClass: 'input-container', disabled: disabled || false, ref: conRef }, _size, { height: multiline ? "auto" : _size.height, minHeight: _size.height, children: [startIcon && jsx(Tag, { sxr: {
113
+ }, baseClass: 'input-container', disabled: disabled || false, ref: conRef }, _size, { height: multiline ? "auto" : _size.height, minHeight: _size.height, children: [startIcon && jsx(Tag, { flex: "0 0 auto", sxr: {
114
114
  height: "100%",
115
115
  alignItems: 'center',
116
116
  justifyContent: "center",
117
117
  display: "flex",
118
118
  color: error ? "danger.primary" : "text.secondary",
119
- }, baseClass: "input-start-icon", children: startIcon }), jsx(Tag, { sxr: {
119
+ }, baseClass: "input-start-icon", children: startIcon }), jsx(Tag, { flex: 1, sxr: {
120
120
  display: "flex",
121
121
  alignItems: "center",
122
122
  flex: 1,
@@ -144,7 +144,7 @@ import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React
144
144
  }, onBlur: (e) => {
145
145
  focused !== null && focused !== void 0 ? focused : setFocused(false);
146
146
  onBlur && onBlur(e);
147
- } })) }), endIcon && jsx(Tag, { sxr: {
147
+ } })) }), endIcon && jsx(Tag, { flex: "0 0 auto", sxr: {
148
148
  height: "100%",
149
149
  alignItems: 'center',
150
150
  justifyContent: "center",
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../src/Input/index.tsx"],"sourcesContent":["\nimport React, { MutableRefObject, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, UseColorTemplateColor, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport Text from '../Text';\n\n\nexport type InputProps<T extends TagComponentType = \"input\"> = Omit<TagProps<T>, \"size\" | \"color\"> & {\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n iconPlacement?: useBreakpointPropsType<\"start\" | \"center\" | \"end\">;\n focused?: boolean;\n color?: useBreakpointPropsType<Omit<UseColorTemplateColor, \"default\">>;\n containerRef?: MutableRefObject<HTMLDivElement | undefined>;\n variant?: useBreakpointPropsType<\"fill\" | \"outline\" | \"text\">;\n error?: boolean;\n helperText?: useBreakpointPropsType<string>;\n multiline?: boolean;\n size?: useBreakpointPropsType<\"small\" | \"medium\" | \"large\">;\n rows?: useBreakpointPropsType<number>;\n minRows?: useBreakpointPropsType<number>;\n maxRows?: useBreakpointPropsType<number>;\n slotProps?: {\n container?: Omit<TagProps<\"div\">, \"children\">\n }\n}\n\nconst Input = React.forwardRef(<T extends TagComponentType = \"input\">({ value, ...props }: InputProps<T>, ref?: React.Ref<any>) => {\n let [{\n startIcon,\n endIcon,\n iconPlacement,\n onFocus,\n color,\n onBlur,\n focused,\n containerRef,\n disabled,\n variant,\n error,\n helperText,\n multiline,\n size,\n rows,\n minRows,\n maxRows,\n slotProps,\n ...rest\n }, theme] = useInterface<any>(\"Input\", props, {})\n const _p: any = {}\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (iconPlacement) _p.iconPlacement = iconPlacement\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (helperText) _p.helperText = helperText\n if (size) _p.size = size\n if (rows) _p.rows = rows\n if (minRows) _p.minRows = minRows\n if (maxRows) _p.maxRows = maxRows\n const p: any = useBreakpointProps(_p)\n startIcon = p.startIcon\n endIcon = p.endIcon\n iconPlacement = p.iconPlacement\n color = p.color ?? \"brand\"\n variant = p.variant ?? \"fill\"\n helperText = p.helperText\n size = p.size ?? 'medium'\n rows = p.rows\n minRows = p.minRows\n maxRows = p.maxRows\n\n ref ??= useRef(null);\n iconPlacement ??= multiline ? \"end\" : \"center\"\n if (!value) iconPlacement = 'center'\n\n const [_focused, setFocused] = useState(false)\n const conRef: any = useRef(null)\n let _focus = focused || _focused\n\n useEffect(() => {\n if (containerRef) {\n (containerRef as any).current = conRef?.current\n }\n }, [containerRef])\n\n let _rows = useMemo(() => {\n if (rows) return rows\n if (value && multiline) {\n let lines = (value as string).split(`\\n`).length\n if (minRows && minRows > lines) {\n return minRows\n } else if (maxRows && maxRows < lines) {\n return maxRows\n } else {\n return lines\n }\n }\n }, [value]) || 1\n\n const sizes: any = {\n small: {\n height: 40,\n gap: .5,\n fontSize: 'button',\n },\n medium: {\n height: 48,\n gap: 1,\n fontSize: \"text\"\n },\n large: {\n height: 52,\n gap: 1,\n fontSize: 'big'\n }\n }\n\n const _size = sizes[size]\n let borderColor = _focus ? color : (variant === \"fill\" ? \"transparent\" : \"divider\")\n borderColor = error ? \"danger.primary\" : borderColor\n let multiprops: any = {}\n if (multiline) {\n multiprops = {\n rows: _rows,\n sx: {\n resize: \"none\"\n }\n }\n }\n\n useEffect(() => {\n if ((ref as any).current) {\n (ref as any).current.style.height = \"auto\";\n (ref as any).current.style.height = `${(ref as any).current.scrollHeight}px`;\n }\n }, [value]);\n\n return (\n <Tag\n baseClass={`input${_focus ? \" input-focused\" : \"\"}`}\n >\n <Tag\n {...slotProps?.container}\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: iconPlacement === 'center' ? iconPlacement : `flex-${iconPlacement}`,\n flexWrap: \"nowrap\",\n minWidth: 150,\n transitionProperty: \"border, box-shadow, background\",\n bgcolor: error ? \"danger.soft.primary\" : variant === \"fill\" ? \"background.secondary\" : \"background.primary\",\n border: variant === \"text\" ? 0 : \"1px solid\",\n borderColor: borderColor,\n borderRadius: 1,\n px: 1,\n py: .5,\n }}\n baseClass='input-container'\n disabled={disabled || false}\n ref={conRef}\n {..._size}\n height={multiline ? \"auto\" : _size.height}\n minHeight={_size.height}\n >\n {startIcon && <Tag\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: \"flex\",\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-start-icon\"\n >{startIcon}</Tag>}\n <Tag\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n flex: 1,\n minHeight: _size.height,\n \"& textarea\": {\n resize: \"none\"\n },\n \"& input:-webkit-autofill,& input:-webkit-autofill:hover, & input:-webkit-autofill:focus,& input:-webkit-autofill:active\": {\n \"-webkit-text-fill-color\": \"text.primary\",\n \"box-shadow\": `0 0 0px 1000px ${variant === \"fill\" ? theme.colors.background.secondary : theme.colors.background.primary} inset`,\n transition: \"background-color 5000s ease-in-out 0s\"\n } as any\n }}\n >\n <Tag\n component={multiline ? 'textarea' : 'input'}\n {...multiprops}\n {...rest}\n sxr={{\n border: 0,\n outline: 0,\n bgcolor: \"transparent\",\n color: error ? \"danger.primary\" : \"text.primary\",\n fontSize: _size.fontSize,\n height: multiline ? \"auto\" : _size.height + \"px!important\",\n width: \"100%\",\n maxHeight: 200,\n }}\n value={value}\n baseClass='input-box'\n ref={ref}\n onFocus={(e: any) => {\n focused ?? setFocused(true)\n onFocus && onFocus(e)\n }}\n onBlur={(e: any) => {\n focused ?? setFocused(false)\n onBlur && onBlur(e)\n }}\n />\n </Tag>\n {endIcon && <Tag\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: 'flex',\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-end-icon\"\n >{endIcon}</Tag>}\n </Tag>\n {helperText && <Text\n pl={.5}\n height={_size.height}\n className=\"input-helper-text\"\n fontSize=\"small\"\n color={error ? \"danger.primary\" : \"text.primary\"}\n >{helperText}</Text>}\n </Tag>\n )\n})\n\nexport default Input\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"index.mjs","sources":["../../src/Input/index.tsx"],"sourcesContent":["\nimport React, { MutableRefObject, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\nimport { Tag, TagProps, TagComponentType, UseColorTemplateColor, useBreakpointPropsType, useInterface, useBreakpointProps } from '@xanui/core';\nimport Text from '../Text';\n\n\n\nexport type InputProps<T extends TagComponentType = \"input\"> = Omit<TagProps<T>, \"size\" | \"color\"> & {\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n iconPlacement?: useBreakpointPropsType<\"start\" | \"center\" | \"end\">;\n focused?: boolean;\n color?: useBreakpointPropsType<Omit<UseColorTemplateColor, \"default\">>;\n containerRef?: MutableRefObject<HTMLDivElement | undefined>;\n variant?: useBreakpointPropsType<\"fill\" | \"outline\" | \"text\">;\n error?: boolean;\n helperText?: useBreakpointPropsType<string>;\n multiline?: boolean;\n size?: useBreakpointPropsType<\"small\" | \"medium\" | \"large\">;\n rows?: useBreakpointPropsType<number>;\n minRows?: useBreakpointPropsType<number>;\n maxRows?: useBreakpointPropsType<number>;\n slotProps?: {\n container?: Omit<TagProps<\"div\">, \"children\">\n }\n}\n\nconst Input = React.forwardRef(<T extends TagComponentType = \"input\">({ value, ...props }: InputProps<T>, ref?: React.Ref<any>) => {\n let [{\n startIcon,\n endIcon,\n iconPlacement,\n onFocus,\n color,\n onBlur,\n focused,\n containerRef,\n disabled,\n variant,\n error,\n helperText,\n multiline,\n size,\n rows,\n minRows,\n maxRows,\n slotProps,\n ...rest\n }, theme] = useInterface<any>(\"Input\", props, {})\n\n const _p: any = {}\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (iconPlacement) _p.iconPlacement = iconPlacement\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (helperText) _p.helperText = helperText\n if (size) _p.size = size\n if (rows) _p.rows = rows\n if (minRows) _p.minRows = minRows\n if (maxRows) _p.maxRows = maxRows\n const p: any = useBreakpointProps(_p)\n startIcon = p.startIcon\n endIcon = p.endIcon\n iconPlacement = p.iconPlacement\n color = p.color ?? \"brand\"\n variant = p.variant ?? \"fill\"\n helperText = p.helperText\n size = p.size ?? 'medium'\n rows = p.rows\n minRows = p.minRows\n maxRows = p.maxRows\n\n ref ??= useRef(null);\n iconPlacement ??= multiline ? \"end\" : \"center\"\n if (!value) iconPlacement = 'center'\n\n const [_focused, setFocused] = useState(false)\n const conRef: any = useRef(null)\n let _focus = focused || _focused\n\n useEffect(() => {\n if (containerRef) {\n (containerRef as any).current = conRef?.current\n }\n }, [containerRef])\n\n let _rows = useMemo(() => {\n if (rows) return rows\n if (value && multiline) {\n let lines = (value as string).split(`\\n`).length\n if (minRows && minRows > lines) {\n return minRows\n } else if (maxRows && maxRows < lines) {\n return maxRows\n } else {\n return lines\n }\n }\n }, [value]) || 1\n\n const sizes: any = {\n small: {\n height: 40,\n gap: .5,\n fontSize: 'button',\n },\n medium: {\n height: 48,\n gap: 1,\n fontSize: \"text\"\n },\n large: {\n height: 52,\n gap: 1,\n fontSize: 'big'\n }\n }\n\n const _size = sizes[size]\n let borderColor = _focus ? color : (variant === \"fill\" ? \"transparent\" : \"divider\")\n borderColor = error ? \"danger.primary\" : borderColor\n let multiprops: any = {}\n if (multiline) {\n multiprops = {\n rows: _rows,\n sx: {\n resize: \"none\"\n }\n }\n }\n\n useEffect(() => {\n if ((ref as any).current) {\n (ref as any).current.style.height = \"auto\";\n (ref as any).current.style.height = `${(ref as any).current.scrollHeight}px`;\n }\n }, [value]);\n\n return (\n <Tag\n baseClass={`input${_focus ? \" input-focused\" : \"\"}`}\n >\n <Tag\n {...slotProps?.container}\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: iconPlacement === 'center' ? iconPlacement : `flex-${iconPlacement}`,\n flexWrap: \"nowrap\",\n minWidth: 150,\n transitionProperty: \"border, box-shadow, background\",\n bgcolor: error ? \"danger.soft.primary\" : variant === \"fill\" ? \"background.secondary\" : \"background.primary\",\n border: variant === \"text\" ? 0 : \"1px solid\",\n borderColor: borderColor,\n borderRadius: 1,\n px: 1,\n py: .5,\n }}\n baseClass='input-container'\n disabled={disabled || false}\n ref={conRef}\n {..._size}\n height={multiline ? \"auto\" : _size.height}\n minHeight={_size.height}\n >\n {startIcon && <Tag\n flex={\"0 0 auto\"}\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: \"flex\",\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-start-icon\"\n >{startIcon}</Tag>}\n <Tag\n flex={1}\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n flex: 1,\n minHeight: _size.height,\n \"& textarea\": {\n resize: \"none\"\n },\n \"& input:-webkit-autofill,& input:-webkit-autofill:hover, & input:-webkit-autofill:focus,& input:-webkit-autofill:active\": {\n \"-webkit-text-fill-color\": \"text.primary\",\n \"box-shadow\": `0 0 0px 1000px ${variant === \"fill\" ? theme.colors.background.secondary : theme.colors.background.primary} inset`,\n transition: \"background-color 5000s ease-in-out 0s\"\n } as any\n }}\n >\n <Tag\n component={multiline ? 'textarea' : 'input'}\n {...multiprops}\n {...rest}\n sxr={{\n border: 0,\n outline: 0,\n bgcolor: \"transparent\",\n color: error ? \"danger.primary\" : \"text.primary\",\n fontSize: _size.fontSize,\n height: multiline ? \"auto\" : _size.height + \"px!important\",\n width: \"100%\",\n maxHeight: 200,\n }}\n value={value}\n baseClass='input-box'\n ref={ref}\n onFocus={(e: any) => {\n focused ?? setFocused(true)\n onFocus && onFocus(e)\n }}\n onBlur={(e: any) => {\n focused ?? setFocused(false)\n onBlur && onBlur(e)\n }}\n />\n </Tag>\n {endIcon && <Tag\n flex={\"0 0 auto\"}\n sxr={{\n height: \"100%\",\n alignItems: 'center',\n justifyContent: \"center\",\n display: 'flex',\n color: error ? \"danger.primary\" : \"text.secondary\",\n }}\n baseClass=\"input-end-icon\"\n >{endIcon}</Tag>}\n </Tag>\n {helperText && <Text\n pl={.5}\n height={_size.height}\n className=\"input-helper-text\"\n fontSize=\"small\"\n color={error ? \"danger.primary\" : \"text.primary\"}\n >{helperText}</Text>}\n </Tag>\n )\n})\n\nexport default Input\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
package/Tabs/index.js CHANGED
@@ -177,7 +177,7 @@ const Tabs = React.forwardRef((_a, ref) => {
177
177
  }, children: [jsxRuntime.jsx(core.Tag, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { baseClass: 'tabs-content', sxr: {
178
178
  display: verticle ? "flex" : "inline-flex",
179
179
  flexDirection: verticle ? "column" : "row",
180
- }, ref: containerRef, children: childs })), jsxRuntime.jsx(core.Transition, { open: !!trans, variant: trans || { from: {}, to: {} }, easing: "easeInOut", duration: trans ? (disableTransition ? 0 : 250) : 0, children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: 'tabs-indicator',
180
+ }, ref: containerRef, children: childs })), jsxRuntime.jsx(core.Transition, { open: !!trans, variant: trans || { from: {}, to: {} }, easing: "smooth", duration: trans ? (disableTransition ? 0 : 250) : 0, children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: 'tabs-indicator',
181
181
  // className={classname}
182
182
  sxr: {
183
183
  position: "absolute",
package/Tabs/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/Tabs/index.tsx"],"sourcesContent":["\nimport React, { useEffect, ReactElement, useMemo, cloneElement, useState, Children, useRef } from 'react'\nimport { TabProps } from '../Tab'\nimport { Tag, TagProps, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType, Transition } from '@xanui/core'\nimport { ButtonProps } from '../Button'\n\n\ntype ValueType = string | number\nexport type TabsProps = Omit<TagProps, 'onChange'> & {\n children: ReactElement<TabProps> | ReactElement<TabProps>[];\n value?: ValueType;\n onChange?: (value: ValueType) => void;\n variant?: useBreakpointPropsType<\"start-line\" | \"end-line\" | \"fill\" | \"outline\" | \"text\" | \"soft\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n verticle?: useBreakpointPropsType<boolean>;\n disableTransition?: useBreakpointPropsType<boolean>;\n indicatorSize?: useBreakpointPropsType<number>;\n\n slotProps?: {\n content?: Omit<TagProps, \"children\">;\n button?: Omit<ButtonProps, \"children\" | \"color\" | \"variant\" | \"classNames\">;\n }\n}\n\nconst getRect = (ele: HTMLElement, parent: HTMLElement) => {\n const _rect: any = {};\n const parentRect = parent.getBoundingClientRect();\n const childRect = ele.getBoundingClientRect();\n _rect.top = childRect.top - parentRect.top;\n _rect.right = childRect.right - parentRect.right;\n _rect.bottom = childRect.bottom - parentRect.bottom;\n _rect.left = childRect.left - parentRect.left;\n _rect.width = childRect.width;\n _rect.height = childRect.height;\n return _rect\n}\n\nconst Tabs = React.forwardRef(({ onChange, value, children, ...props }: TabsProps, ref: any) => {\n let [{ verticle, color, variant, indicatorSize, disableTransition, slotProps, ...rest }] = useInterface<any>(\"Tabs\", props, {})\n const _p: any = {}\n if (variant) _p.variant = variant\n if (color) _p.color = color\n if (verticle) _p.verticle = verticle\n if (disableTransition) _p.disableTransition = disableTransition\n if (indicatorSize) _p.indicatorSize = indicatorSize\n const p: any = useBreakpointProps(_p)\n\n variant = p.variant ?? \"end-line\"\n color = p.color ?? \"brand\"\n verticle = p.verticle\n disableTransition = p.disableTransition\n indicatorSize = p.indicatorSize ?? 3\n\n ref = ref || useRef(null)\n const containerRef: any = useRef(null)\n const [trans, setTrans] = useState<any>()\n\n const { childs, selectedIndex } = useMemo(() => {\n let info: any = {\n childs: null,\n selectedIndex: 0\n }\n info.childs = Children.map(children, (child: any, idx: number) => {\n let selected = child.props.value === value\n if (selected) {\n info.selectedIndex = idx\n }\n\n let btnProps: any = {}\n if (variant === 'fill' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n color: \"#FFFFFF!important\"\n }\n }\n } else if (variant === 'soft' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n }\n }\n }\n\n // delete child.props.value\n return cloneElement(child, {\n corner: \"square\",\n value: undefined,\n onClick: () => {\n onChange && onChange(child.props.value)\n },\n border: \"1px solid\",\n borderColor: \"transparent\",\n ...slotProps?.button,\n ...btnProps,\n color: selected ? color : \"default\",\n variant: \"text\",\n classNames: [child.props.classNames, { \"tab-selected\": selected }],\n })\n })\n return info\n }, [children, onChange, value, variant, color, verticle])\n\n useEffect(() => {\n let con = containerRef.current\n const conChilds = con.children\n if (conChilds && conChilds[selectedIndex]) {\n const selectedTab = con.querySelector(\".tab-selected\") || conChilds[0]\n const prevRect = getRect(selectedTab, con)\n const rect = getRect(conChilds[selectedIndex], con)\n\n let anim: any = {}\n if (verticle) {\n anim = {\n from: {\n top: prevRect?.top || 0,\n height: prevRect?.height || 0,\n },\n to: {\n top: rect?.top || 0,\n height: rect?.height || 0,\n }\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.width = prevRect?.width\n anim.to.width = rect?.width\n }\n } else {\n anim = {\n from: {\n left: prevRect?.left || 0,\n width: prevRect?.width || 0,\n },\n to: {\n left: rect?.left || 0,\n width: rect?.width || 0,\n },\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.height = prevRect?.height || 0\n anim.to.height = rect?.height || 0\n }\n }\n setTrans(anim)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedIndex, variant, color, verticle])\n\n let indicatorProps: any = useMemo(() => {\n let _indicatorProps: any = {}\n switch (variant) {\n case \"start-line\":\n if (verticle) {\n _indicatorProps = {\n left: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n top: 0,\n height: indicatorSize\n }\n }\n break;\n case \"end-line\":\n if (verticle) {\n _indicatorProps = {\n right: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n bottom: 0,\n height: indicatorSize\n }\n }\n break;\n case \"fill\":\n _indicatorProps = {\n top: 0,\n bgcolor: color\n }\n break;\n case \"outline\":\n _indicatorProps = {\n top: 0,\n border: \"1px solid\",\n borderColor: color,\n bgcolor: \"transparent\"\n }\n break;\n case \"soft\":\n _indicatorProps = {\n top: 0,\n bgcolor: `${color}.soft.primary`\n }\n break;\n case \"text\":\n _indicatorProps = {\n display: \"none\"\n }\n break;\n }\n return _indicatorProps\n }, [selectedIndex, variant, color, verticle])\n\n return (\n <Tag\n {...rest}\n baseClass='tabs'\n ref={ref}\n sxr={{\n position: \"relative\",\n zIndex: 1,\n display: \"inline-block\"\n }}\n >\n <Tag\n {...slotProps?.content}\n baseClass='tabs-content'\n sxr={{\n display: verticle ? \"flex\" : \"inline-flex\",\n flexDirection: verticle ? \"column\" : \"row\",\n }}\n ref={containerRef}\n >\n {childs}\n </Tag>\n <Transition\n key={!!trans ? \"asd\" : \"qwe\"}\n open={!!trans}\n variant={trans || { from: {}, to: {} }}\n easing=\"easeInOut\"\n duration={trans ? (disableTransition ? 0 : 250) : 0}\n >\n <Tag\n baseClass='tabs-indicator'\n // className={classname}\n sxr={{\n position: \"absolute\",\n zIndex: -1,\n cursor: \"pointer\",\n bgcolor: color\n }}\n {...indicatorProps}\n >\n </Tag>\n </Transition>\n </Tag>\n )\n})\n\nexport default Tabs"],"names":["__rest","useInterface","useBreakpointProps","useRef","useState","useMemo","Children","cloneElement","useEffect","_jsxs","Tag","_jsx","Transition"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../src/Tabs/index.tsx"],"sourcesContent":["\nimport React, { useEffect, ReactElement, useMemo, cloneElement, useState, Children, useRef } from 'react'\nimport { TabProps } from '../Tab'\nimport { Tag, TagProps, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType, Transition } from '@xanui/core'\nimport { ButtonProps } from '../Button'\n\n\ntype ValueType = string | number\nexport type TabsProps = Omit<TagProps, 'onChange'> & {\n children: ReactElement<TabProps> | ReactElement<TabProps>[];\n value?: ValueType;\n onChange?: (value: ValueType) => void;\n variant?: useBreakpointPropsType<\"start-line\" | \"end-line\" | \"fill\" | \"outline\" | \"text\" | \"soft\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n verticle?: useBreakpointPropsType<boolean>;\n disableTransition?: useBreakpointPropsType<boolean>;\n indicatorSize?: useBreakpointPropsType<number>;\n\n slotProps?: {\n content?: Omit<TagProps, \"children\">;\n button?: Omit<ButtonProps, \"children\" | \"color\" | \"variant\" | \"classNames\">;\n }\n}\n\nconst getRect = (ele: HTMLElement, parent: HTMLElement) => {\n const _rect: any = {};\n const parentRect = parent.getBoundingClientRect();\n const childRect = ele.getBoundingClientRect();\n _rect.top = childRect.top - parentRect.top;\n _rect.right = childRect.right - parentRect.right;\n _rect.bottom = childRect.bottom - parentRect.bottom;\n _rect.left = childRect.left - parentRect.left;\n _rect.width = childRect.width;\n _rect.height = childRect.height;\n return _rect\n}\n\nconst Tabs = React.forwardRef(({ onChange, value, children, ...props }: TabsProps, ref: any) => {\n let [{ verticle, color, variant, indicatorSize, disableTransition, slotProps, ...rest }] = useInterface<any>(\"Tabs\", props, {})\n const _p: any = {}\n if (variant) _p.variant = variant\n if (color) _p.color = color\n if (verticle) _p.verticle = verticle\n if (disableTransition) _p.disableTransition = disableTransition\n if (indicatorSize) _p.indicatorSize = indicatorSize\n const p: any = useBreakpointProps(_p)\n\n variant = p.variant ?? \"end-line\"\n color = p.color ?? \"brand\"\n verticle = p.verticle\n disableTransition = p.disableTransition\n indicatorSize = p.indicatorSize ?? 3\n\n ref = ref || useRef(null)\n const containerRef: any = useRef(null)\n const [trans, setTrans] = useState<any>()\n\n const { childs, selectedIndex } = useMemo(() => {\n let info: any = {\n childs: null,\n selectedIndex: 0\n }\n info.childs = Children.map(children, (child: any, idx: number) => {\n let selected = child.props.value === value\n if (selected) {\n info.selectedIndex = idx\n }\n\n let btnProps: any = {}\n if (variant === 'fill' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n color: \"#FFFFFF!important\"\n }\n }\n } else if (variant === 'soft' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n }\n }\n }\n\n // delete child.props.value\n return cloneElement(child, {\n corner: \"square\",\n value: undefined,\n onClick: () => {\n onChange && onChange(child.props.value)\n },\n border: \"1px solid\",\n borderColor: \"transparent\",\n ...slotProps?.button,\n ...btnProps,\n color: selected ? color : \"default\",\n variant: \"text\",\n classNames: [child.props.classNames, { \"tab-selected\": selected }],\n })\n })\n return info\n }, [children, onChange, value, variant, color, verticle])\n\n useEffect(() => {\n let con = containerRef.current\n const conChilds = con.children\n if (conChilds && conChilds[selectedIndex]) {\n const selectedTab = con.querySelector(\".tab-selected\") || conChilds[0]\n const prevRect = getRect(selectedTab, con)\n const rect = getRect(conChilds[selectedIndex], con)\n\n let anim: any = {}\n if (verticle) {\n anim = {\n from: {\n top: prevRect?.top || 0,\n height: prevRect?.height || 0,\n },\n to: {\n top: rect?.top || 0,\n height: rect?.height || 0,\n }\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.width = prevRect?.width\n anim.to.width = rect?.width\n }\n } else {\n anim = {\n from: {\n left: prevRect?.left || 0,\n width: prevRect?.width || 0,\n },\n to: {\n left: rect?.left || 0,\n width: rect?.width || 0,\n },\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.height = prevRect?.height || 0\n anim.to.height = rect?.height || 0\n }\n }\n setTrans(anim)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedIndex, variant, color, verticle])\n\n let indicatorProps: any = useMemo(() => {\n let _indicatorProps: any = {}\n switch (variant) {\n case \"start-line\":\n if (verticle) {\n _indicatorProps = {\n left: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n top: 0,\n height: indicatorSize\n }\n }\n break;\n case \"end-line\":\n if (verticle) {\n _indicatorProps = {\n right: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n bottom: 0,\n height: indicatorSize\n }\n }\n break;\n case \"fill\":\n _indicatorProps = {\n top: 0,\n bgcolor: color\n }\n break;\n case \"outline\":\n _indicatorProps = {\n top: 0,\n border: \"1px solid\",\n borderColor: color,\n bgcolor: \"transparent\"\n }\n break;\n case \"soft\":\n _indicatorProps = {\n top: 0,\n bgcolor: `${color}.soft.primary`\n }\n break;\n case \"text\":\n _indicatorProps = {\n display: \"none\"\n }\n break;\n }\n return _indicatorProps\n }, [selectedIndex, variant, color, verticle])\n\n return (\n <Tag\n {...rest}\n baseClass='tabs'\n ref={ref}\n sxr={{\n position: \"relative\",\n zIndex: 1,\n display: \"inline-block\"\n }}\n >\n <Tag\n {...slotProps?.content}\n baseClass='tabs-content'\n sxr={{\n display: verticle ? \"flex\" : \"inline-flex\",\n flexDirection: verticle ? \"column\" : \"row\",\n }}\n ref={containerRef}\n >\n {childs}\n </Tag>\n <Transition\n key={!!trans ? \"asd\" : \"qwe\"}\n open={!!trans}\n variant={trans || { from: {}, to: {} }}\n easing=\"smooth\"\n duration={trans ? (disableTransition ? 0 : 250) : 0}\n >\n <Tag\n baseClass='tabs-indicator'\n // className={classname}\n sxr={{\n position: \"absolute\",\n zIndex: -1,\n cursor: \"pointer\",\n bgcolor: color\n }}\n {...indicatorProps}\n >\n </Tag>\n </Transition>\n </Tag>\n )\n})\n\nexport default Tabs"],"names":["__rest","useInterface","useBreakpointProps","useRef","useState","useMemo","Children","cloneElement","useEffect","_jsxs","Tag","_jsx","Transition"],"mappings":"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"}
package/Tabs/index.mjs CHANGED
@@ -177,7 +177,7 @@ const Tabs = React.forwardRef((_a, ref) => {
177
177
  }, children: [jsx(Tag, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { baseClass: 'tabs-content', sxr: {
178
178
  display: verticle ? "flex" : "inline-flex",
179
179
  flexDirection: verticle ? "column" : "row",
180
- }, ref: containerRef, children: childs })), jsx(Transition, { open: !!trans, variant: trans || { from: {}, to: {} }, easing: "easeInOut", duration: trans ? (disableTransition ? 0 : 250) : 0, children: jsx(Tag, Object.assign({ baseClass: 'tabs-indicator',
180
+ }, ref: containerRef, children: childs })), jsx(Transition, { open: !!trans, variant: trans || { from: {}, to: {} }, easing: "smooth", duration: trans ? (disableTransition ? 0 : 250) : 0, children: jsx(Tag, Object.assign({ baseClass: 'tabs-indicator',
181
181
  // className={classname}
182
182
  sxr: {
183
183
  position: "absolute",
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../src/Tabs/index.tsx"],"sourcesContent":["\nimport React, { useEffect, ReactElement, useMemo, cloneElement, useState, Children, useRef } from 'react'\nimport { TabProps } from '../Tab'\nimport { Tag, TagProps, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType, Transition } from '@xanui/core'\nimport { ButtonProps } from '../Button'\n\n\ntype ValueType = string | number\nexport type TabsProps = Omit<TagProps, 'onChange'> & {\n children: ReactElement<TabProps> | ReactElement<TabProps>[];\n value?: ValueType;\n onChange?: (value: ValueType) => void;\n variant?: useBreakpointPropsType<\"start-line\" | \"end-line\" | \"fill\" | \"outline\" | \"text\" | \"soft\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n verticle?: useBreakpointPropsType<boolean>;\n disableTransition?: useBreakpointPropsType<boolean>;\n indicatorSize?: useBreakpointPropsType<number>;\n\n slotProps?: {\n content?: Omit<TagProps, \"children\">;\n button?: Omit<ButtonProps, \"children\" | \"color\" | \"variant\" | \"classNames\">;\n }\n}\n\nconst getRect = (ele: HTMLElement, parent: HTMLElement) => {\n const _rect: any = {};\n const parentRect = parent.getBoundingClientRect();\n const childRect = ele.getBoundingClientRect();\n _rect.top = childRect.top - parentRect.top;\n _rect.right = childRect.right - parentRect.right;\n _rect.bottom = childRect.bottom - parentRect.bottom;\n _rect.left = childRect.left - parentRect.left;\n _rect.width = childRect.width;\n _rect.height = childRect.height;\n return _rect\n}\n\nconst Tabs = React.forwardRef(({ onChange, value, children, ...props }: TabsProps, ref: any) => {\n let [{ verticle, color, variant, indicatorSize, disableTransition, slotProps, ...rest }] = useInterface<any>(\"Tabs\", props, {})\n const _p: any = {}\n if (variant) _p.variant = variant\n if (color) _p.color = color\n if (verticle) _p.verticle = verticle\n if (disableTransition) _p.disableTransition = disableTransition\n if (indicatorSize) _p.indicatorSize = indicatorSize\n const p: any = useBreakpointProps(_p)\n\n variant = p.variant ?? \"end-line\"\n color = p.color ?? \"brand\"\n verticle = p.verticle\n disableTransition = p.disableTransition\n indicatorSize = p.indicatorSize ?? 3\n\n ref = ref || useRef(null)\n const containerRef: any = useRef(null)\n const [trans, setTrans] = useState<any>()\n\n const { childs, selectedIndex } = useMemo(() => {\n let info: any = {\n childs: null,\n selectedIndex: 0\n }\n info.childs = Children.map(children, (child: any, idx: number) => {\n let selected = child.props.value === value\n if (selected) {\n info.selectedIndex = idx\n }\n\n let btnProps: any = {}\n if (variant === 'fill' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n color: \"#FFFFFF!important\"\n }\n }\n } else if (variant === 'soft' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n }\n }\n }\n\n // delete child.props.value\n return cloneElement(child, {\n corner: \"square\",\n value: undefined,\n onClick: () => {\n onChange && onChange(child.props.value)\n },\n border: \"1px solid\",\n borderColor: \"transparent\",\n ...slotProps?.button,\n ...btnProps,\n color: selected ? color : \"default\",\n variant: \"text\",\n classNames: [child.props.classNames, { \"tab-selected\": selected }],\n })\n })\n return info\n }, [children, onChange, value, variant, color, verticle])\n\n useEffect(() => {\n let con = containerRef.current\n const conChilds = con.children\n if (conChilds && conChilds[selectedIndex]) {\n const selectedTab = con.querySelector(\".tab-selected\") || conChilds[0]\n const prevRect = getRect(selectedTab, con)\n const rect = getRect(conChilds[selectedIndex], con)\n\n let anim: any = {}\n if (verticle) {\n anim = {\n from: {\n top: prevRect?.top || 0,\n height: prevRect?.height || 0,\n },\n to: {\n top: rect?.top || 0,\n height: rect?.height || 0,\n }\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.width = prevRect?.width\n anim.to.width = rect?.width\n }\n } else {\n anim = {\n from: {\n left: prevRect?.left || 0,\n width: prevRect?.width || 0,\n },\n to: {\n left: rect?.left || 0,\n width: rect?.width || 0,\n },\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.height = prevRect?.height || 0\n anim.to.height = rect?.height || 0\n }\n }\n setTrans(anim)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedIndex, variant, color, verticle])\n\n let indicatorProps: any = useMemo(() => {\n let _indicatorProps: any = {}\n switch (variant) {\n case \"start-line\":\n if (verticle) {\n _indicatorProps = {\n left: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n top: 0,\n height: indicatorSize\n }\n }\n break;\n case \"end-line\":\n if (verticle) {\n _indicatorProps = {\n right: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n bottom: 0,\n height: indicatorSize\n }\n }\n break;\n case \"fill\":\n _indicatorProps = {\n top: 0,\n bgcolor: color\n }\n break;\n case \"outline\":\n _indicatorProps = {\n top: 0,\n border: \"1px solid\",\n borderColor: color,\n bgcolor: \"transparent\"\n }\n break;\n case \"soft\":\n _indicatorProps = {\n top: 0,\n bgcolor: `${color}.soft.primary`\n }\n break;\n case \"text\":\n _indicatorProps = {\n display: \"none\"\n }\n break;\n }\n return _indicatorProps\n }, [selectedIndex, variant, color, verticle])\n\n return (\n <Tag\n {...rest}\n baseClass='tabs'\n ref={ref}\n sxr={{\n position: \"relative\",\n zIndex: 1,\n display: \"inline-block\"\n }}\n >\n <Tag\n {...slotProps?.content}\n baseClass='tabs-content'\n sxr={{\n display: verticle ? \"flex\" : \"inline-flex\",\n flexDirection: verticle ? \"column\" : \"row\",\n }}\n ref={containerRef}\n >\n {childs}\n </Tag>\n <Transition\n key={!!trans ? \"asd\" : \"qwe\"}\n open={!!trans}\n variant={trans || { from: {}, to: {} }}\n easing=\"easeInOut\"\n duration={trans ? (disableTransition ? 0 : 250) : 0}\n >\n <Tag\n baseClass='tabs-indicator'\n // className={classname}\n sxr={{\n position: \"absolute\",\n zIndex: -1,\n cursor: \"pointer\",\n bgcolor: color\n }}\n {...indicatorProps}\n >\n </Tag>\n </Transition>\n </Tag>\n )\n})\n\nexport default Tabs"],"names":["_jsxs","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"index.mjs","sources":["../../src/Tabs/index.tsx"],"sourcesContent":["\nimport React, { useEffect, ReactElement, useMemo, cloneElement, useState, Children, useRef } from 'react'\nimport { TabProps } from '../Tab'\nimport { Tag, TagProps, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType, Transition } from '@xanui/core'\nimport { ButtonProps } from '../Button'\n\n\ntype ValueType = string | number\nexport type TabsProps = Omit<TagProps, 'onChange'> & {\n children: ReactElement<TabProps> | ReactElement<TabProps>[];\n value?: ValueType;\n onChange?: (value: ValueType) => void;\n variant?: useBreakpointPropsType<\"start-line\" | \"end-line\" | \"fill\" | \"outline\" | \"text\" | \"soft\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n verticle?: useBreakpointPropsType<boolean>;\n disableTransition?: useBreakpointPropsType<boolean>;\n indicatorSize?: useBreakpointPropsType<number>;\n\n slotProps?: {\n content?: Omit<TagProps, \"children\">;\n button?: Omit<ButtonProps, \"children\" | \"color\" | \"variant\" | \"classNames\">;\n }\n}\n\nconst getRect = (ele: HTMLElement, parent: HTMLElement) => {\n const _rect: any = {};\n const parentRect = parent.getBoundingClientRect();\n const childRect = ele.getBoundingClientRect();\n _rect.top = childRect.top - parentRect.top;\n _rect.right = childRect.right - parentRect.right;\n _rect.bottom = childRect.bottom - parentRect.bottom;\n _rect.left = childRect.left - parentRect.left;\n _rect.width = childRect.width;\n _rect.height = childRect.height;\n return _rect\n}\n\nconst Tabs = React.forwardRef(({ onChange, value, children, ...props }: TabsProps, ref: any) => {\n let [{ verticle, color, variant, indicatorSize, disableTransition, slotProps, ...rest }] = useInterface<any>(\"Tabs\", props, {})\n const _p: any = {}\n if (variant) _p.variant = variant\n if (color) _p.color = color\n if (verticle) _p.verticle = verticle\n if (disableTransition) _p.disableTransition = disableTransition\n if (indicatorSize) _p.indicatorSize = indicatorSize\n const p: any = useBreakpointProps(_p)\n\n variant = p.variant ?? \"end-line\"\n color = p.color ?? \"brand\"\n verticle = p.verticle\n disableTransition = p.disableTransition\n indicatorSize = p.indicatorSize ?? 3\n\n ref = ref || useRef(null)\n const containerRef: any = useRef(null)\n const [trans, setTrans] = useState<any>()\n\n const { childs, selectedIndex } = useMemo(() => {\n let info: any = {\n childs: null,\n selectedIndex: 0\n }\n info.childs = Children.map(children, (child: any, idx: number) => {\n let selected = child.props.value === value\n if (selected) {\n info.selectedIndex = idx\n }\n\n let btnProps: any = {}\n if (variant === 'fill' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n color: \"#FFFFFF!important\"\n }\n }\n } else if (variant === 'soft' && selected) {\n btnProps = {\n sx: {\n bgcolor: \"transparent!importnat\",\n }\n }\n }\n\n // delete child.props.value\n return cloneElement(child, {\n corner: \"square\",\n value: undefined,\n onClick: () => {\n onChange && onChange(child.props.value)\n },\n border: \"1px solid\",\n borderColor: \"transparent\",\n ...slotProps?.button,\n ...btnProps,\n color: selected ? color : \"default\",\n variant: \"text\",\n classNames: [child.props.classNames, { \"tab-selected\": selected }],\n })\n })\n return info\n }, [children, onChange, value, variant, color, verticle])\n\n useEffect(() => {\n let con = containerRef.current\n const conChilds = con.children\n if (conChilds && conChilds[selectedIndex]) {\n const selectedTab = con.querySelector(\".tab-selected\") || conChilds[0]\n const prevRect = getRect(selectedTab, con)\n const rect = getRect(conChilds[selectedIndex], con)\n\n let anim: any = {}\n if (verticle) {\n anim = {\n from: {\n top: prevRect?.top || 0,\n height: prevRect?.height || 0,\n },\n to: {\n top: rect?.top || 0,\n height: rect?.height || 0,\n }\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.width = prevRect?.width\n anim.to.width = rect?.width\n }\n } else {\n anim = {\n from: {\n left: prevRect?.left || 0,\n width: prevRect?.width || 0,\n },\n to: {\n left: rect?.left || 0,\n width: rect?.width || 0,\n },\n }\n if ([\"fill\", \"soft\", \"outline\"].includes(variant)) {\n anim.from.height = prevRect?.height || 0\n anim.to.height = rect?.height || 0\n }\n }\n setTrans(anim)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [selectedIndex, variant, color, verticle])\n\n let indicatorProps: any = useMemo(() => {\n let _indicatorProps: any = {}\n switch (variant) {\n case \"start-line\":\n if (verticle) {\n _indicatorProps = {\n left: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n top: 0,\n height: indicatorSize\n }\n }\n break;\n case \"end-line\":\n if (verticle) {\n _indicatorProps = {\n right: 0,\n width: indicatorSize\n }\n } else {\n _indicatorProps = {\n bottom: 0,\n height: indicatorSize\n }\n }\n break;\n case \"fill\":\n _indicatorProps = {\n top: 0,\n bgcolor: color\n }\n break;\n case \"outline\":\n _indicatorProps = {\n top: 0,\n border: \"1px solid\",\n borderColor: color,\n bgcolor: \"transparent\"\n }\n break;\n case \"soft\":\n _indicatorProps = {\n top: 0,\n bgcolor: `${color}.soft.primary`\n }\n break;\n case \"text\":\n _indicatorProps = {\n display: \"none\"\n }\n break;\n }\n return _indicatorProps\n }, [selectedIndex, variant, color, verticle])\n\n return (\n <Tag\n {...rest}\n baseClass='tabs'\n ref={ref}\n sxr={{\n position: \"relative\",\n zIndex: 1,\n display: \"inline-block\"\n }}\n >\n <Tag\n {...slotProps?.content}\n baseClass='tabs-content'\n sxr={{\n display: verticle ? \"flex\" : \"inline-flex\",\n flexDirection: verticle ? \"column\" : \"row\",\n }}\n ref={containerRef}\n >\n {childs}\n </Tag>\n <Transition\n key={!!trans ? \"asd\" : \"qwe\"}\n open={!!trans}\n variant={trans || { from: {}, to: {} }}\n easing=\"smooth\"\n duration={trans ? (disableTransition ? 0 : 250) : 0}\n >\n <Tag\n baseClass='tabs-indicator'\n // className={classname}\n sxr={{\n position: \"absolute\",\n zIndex: -1,\n cursor: \"pointer\",\n bgcolor: color\n }}\n {...indicatorProps}\n >\n </Tag>\n </Transition>\n </Tag>\n )\n})\n\nexport default Tabs"],"names":["_jsxs","_jsx"],"mappings":"+NAwBA,MAAM,OAAO,GAAG,CAAC,GAAgB,EAAE,MAAmB,KAAI;IACtD,MAAM,KAAK,GAAQ,EAAE;AACrB,IAAA,MAAM,UAAU,GAAG,MAAM,CAAC,qBAAqB,EAAE;AACjD,IAAA,MAAM,SAAS,GAAG,GAAG,CAAC,qBAAqB,EAAE;IAC7C,KAAK,CAAC,GAAG,GAAG,SAAS,CAAC,GAAG,GAAG,UAAU,CAAC,GAAG;IAC1C,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,GAAG,UAAU,CAAC,KAAK;IAChD,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM,GAAG,UAAU,CAAC,MAAM;IACnD,KAAK,CAAC,IAAI,GAAG,SAAS,CAAC,IAAI,GAAG,UAAU,CAAC,IAAI;AAC7C,IAAA,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK;AAC7B,IAAA,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,MAAM;AAC/B,IAAA,OAAO,KAAK;AAChB,CAAC;AAED,MAAM,IAAI,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAAkD,EAAE,GAAQ,KAAI;;QAAhE,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,OAAuB,EAAlB,KAAK,GAAA,MAAA,CAAA,EAAA,EAArC,CAAA,UAAA,EAAA,OAAA,EAAA,UAAA,CAAuC,CAAF;AAChE,IAAA,IAAI,CAAA,EAAA,CAAA,GAAuF,YAAY,CAAM,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,EAA1H,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAA,MAAA,CAAA,EAAA,EAAhF,CAAA,UAAA,EAAA,OAAA,EAAA,SAAA,EAAA,eAAA,EAAA,mBAAA,EAAA,WAAA,CAAkF,CAAwC;IAC/H,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,QAAQ;AAAE,QAAA,EAAE,CAAC,QAAQ,GAAG,QAAQ;AACpC,IAAA,IAAI,iBAAiB;AAAE,QAAA,EAAE,CAAC,iBAAiB,GAAG,iBAAiB;AAC/D,IAAA,IAAI,aAAa;AAAE,QAAA,EAAE,CAAC,aAAa,GAAG,aAAa;AACnD,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AAErC,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,UAAU;AACjC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;AAC1B,IAAA,QAAQ,GAAG,CAAC,CAAC,QAAQ;AACrB,IAAA,iBAAiB,GAAG,CAAC,CAAC,iBAAiB;AACvC,IAAA,aAAa,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,aAAa,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,CAAC;AAEpC,IAAA,GAAG,GAAG,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC;AACzB,IAAA,MAAM,YAAY,GAAQ,MAAM,CAAC,IAAI,CAAC;IACtC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAAO;IAEzC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,OAAO,CAAC,MAAK;AAC3C,QAAA,IAAI,IAAI,GAAQ;AACZ,YAAA,MAAM,EAAE,IAAI;AACZ,YAAA,aAAa,EAAE;SAClB;AACD,QAAA,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAU,EAAE,GAAW,KAAI;YAC7D,IAAI,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,KAAK,KAAK;YAC1C,IAAI,QAAQ,EAAE;AACV,gBAAA,IAAI,CAAC,aAAa,GAAG,GAAG;YAC5B;YAEA,IAAI,QAAQ,GAAQ,EAAE;AACtB,YAAA,IAAI,OAAO,KAAK,MAAM,IAAI,QAAQ,EAAE;AAChC,gBAAA,QAAQ,GAAG;AACP,oBAAA,EAAE,EAAE;AACA,wBAAA,OAAO,EAAE,uBAAuB;AAChC,wBAAA,KAAK,EAAE;AACV;iBACJ;YACL;AAAO,iBAAA,IAAI,OAAO,KAAK,MAAM,IAAI,QAAQ,EAAE;AACvC,gBAAA,QAAQ,GAAG;AACP,oBAAA,EAAE,EAAE;AACA,wBAAA,OAAO,EAAE,uBAAuB;AACnC;iBACJ;YACL;;AAGA,YAAA,OAAO,YAAY,CAAC,KAAK,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EACrB,MAAM,EAAE,QAAQ,EAChB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,MAAK;oBACV,QAAQ,IAAI,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;gBAC3C,CAAC,EACD,MAAM,EAAE,WAAW,EACnB,WAAW,EAAE,aAAa,EAAA,EACvB,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,MAAM,CAAA,EACjB,QAAQ,KACX,KAAK,EAAE,QAAQ,GAAG,KAAK,GAAG,SAAS,EACnC,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,EAAE,cAAc,EAAE,QAAQ,EAAE,CAAC,EAAA,CAAA,CACpE;AACN,QAAA,CAAC,CAAC;AACF,QAAA,OAAO,IAAI;AACf,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;IAEzD,SAAS,CAAC,MAAK;AACX,QAAA,IAAI,GAAG,GAAG,YAAY,CAAC,OAAO;AAC9B,QAAA,MAAM,SAAS,GAAG,GAAG,CAAC,QAAQ;AAC9B,QAAA,IAAI,SAAS,IAAI,SAAS,CAAC,aAAa,CAAC,EAAE;AACvC,YAAA,MAAM,WAAW,GAAG,GAAG,CAAC,aAAa,CAAC,eAAe,CAAC,IAAI,SAAS,CAAC,CAAC,CAAC;YACtE,MAAM,QAAQ,GAAG,OAAO,CAAC,WAAW,EAAE,GAAG,CAAC;YAC1C,MAAM,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,GAAG,CAAC;YAEnD,IAAI,IAAI,GAAQ,EAAE;YAClB,IAAI,QAAQ,EAAE;AACV,gBAAA,IAAI,GAAG;AACH,oBAAA,IAAI,EAAE;wBACF,GAAG,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,GAAG,KAAI,CAAC;wBACvB,MAAM,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,MAAM,KAAI,CAAC;AAChC,qBAAA;AACD,oBAAA,EAAE,EAAE;wBACA,GAAG,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,GAAG,KAAI,CAAC;wBACnB,MAAM,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,KAAI,CAAC;AAC5B;iBACJ;AACD,gBAAA,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;AAC/C,oBAAA,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,QAAQ,KAAA,IAAA,IAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAE,KAAK;AACjC,oBAAA,IAAI,CAAC,EAAE,CAAC,KAAK,GAAG,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAE,KAAK;gBAC/B;YACJ;iBAAO;AACH,gBAAA,IAAI,GAAG;AACH,oBAAA,IAAI,EAAE;wBACF,IAAI,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,KAAI,CAAC;wBACzB,KAAK,EAAE,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,KAAI,CAAC;AAC9B,qBAAA;AACD,oBAAA,EAAE,EAAE;wBACA,IAAI,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,KAAI,CAAC;wBACrB,KAAK,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,KAAI,CAAC;AAC1B,qBAAA;iBACJ;AACD,gBAAA,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;AAC/C,oBAAA,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAA,QAAQ,KAAA,IAAA,IAAR,QAAQ,uBAAR,QAAQ,CAAE,MAAM,KAAI,CAAC;AACxC,oBAAA,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,KAAI,CAAC;gBACtC;YACJ;YACA,QAAQ,CAAC,IAAI,CAAC;QAClB;;IAEJ,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;AAE7C,IAAA,IAAI,cAAc,GAAQ,OAAO,CAAC,MAAK;QACnC,IAAI,eAAe,GAAQ,EAAE;QAC7B,QAAQ,OAAO;AACX,YAAA,KAAK,YAAY;gBACb,IAAI,QAAQ,EAAE;AACV,oBAAA,eAAe,GAAG;AACd,wBAAA,IAAI,EAAE,CAAC;AACP,wBAAA,KAAK,EAAE;qBACV;gBACL;qBAAO;AACH,oBAAA,eAAe,GAAG;AACd,wBAAA,GAAG,EAAE,CAAC;AACN,wBAAA,MAAM,EAAE;qBACX;gBACL;gBACA;AACJ,YAAA,KAAK,UAAU;gBACX,IAAI,QAAQ,EAAE;AACV,oBAAA,eAAe,GAAG;AACd,wBAAA,KAAK,EAAE,CAAC;AACR,wBAAA,KAAK,EAAE;qBACV;gBACL;qBAAO;AACH,oBAAA,eAAe,GAAG;AACd,wBAAA,MAAM,EAAE,CAAC;AACT,wBAAA,MAAM,EAAE;qBACX;gBACL;gBACA;AACJ,YAAA,KAAK,MAAM;AACP,gBAAA,eAAe,GAAG;AACd,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,OAAO,EAAE;iBACZ;gBACD;AACJ,YAAA,KAAK,SAAS;AACV,gBAAA,eAAe,GAAG;AACd,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,MAAM,EAAE,WAAW;AACnB,oBAAA,WAAW,EAAE,KAAK;AAClB,oBAAA,OAAO,EAAE;iBACZ;gBACD;AACJ,YAAA,KAAK,MAAM;AACP,gBAAA,eAAe,GAAG;AACd,oBAAA,GAAG,EAAE,CAAC;oBACN,OAAO,EAAE,CAAA,EAAG,KAAK,CAAA,aAAA;iBACpB;gBACD;AACJ,YAAA,KAAK,MAAM;AACP,gBAAA,eAAe,GAAG;AACd,oBAAA,OAAO,EAAE;iBACZ;gBACD;;AAER,QAAA,OAAO,eAAe;IAC1B,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;AAE7C,IAAA,QACIA,IAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,IAAI,EAAA,EACR,SAAS,EAAC,MAAM,EAChB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE;AACD,YAAA,QAAQ,EAAE,UAAU;AACpB,YAAA,MAAM,EAAE,CAAC;AACT,YAAA,OAAO,EAAE;AACZ,SAAA,EAAA,QAAA,EAAA,CAEDC,IAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO,IACtB,SAAS,EAAC,cAAc,EACxB,GAAG,EAAE;oBACD,OAAO,EAAE,QAAQ,GAAG,MAAM,GAAG,aAAa;oBAC1C,aAAa,EAAE,QAAQ,GAAG,QAAQ,GAAG,KAAK;AAC7C,iBAAA,EACD,GAAG,EAAE,YAAY,EAAA,QAAA,EAEhB,MAAM,EAAA,CAAA,CACL,EACNA,GAAA,CAAC,UAAU,EAAA,EAEP,IAAI,EAAE,CAAC,CAAC,KAAK,EACb,OAAO,EAAE,KAAK,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EACtC,MAAM,EAAC,QAAQ,EACf,QAAQ,EAAE,KAAK,IAAI,iBAAiB,GAAG,CAAC,GAAG,GAAG,IAAI,CAAC,EAAA,QAAA,EAEnDA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,gBAAgB;;AAE1B,oBAAA,GAAG,EAAE;AACD,wBAAA,QAAQ,EAAE,UAAU;wBACpB,MAAM,EAAE,EAAE;AACV,wBAAA,MAAM,EAAE,SAAS;AACjB,wBAAA,OAAO,EAAE;AACZ,qBAAA,EAAA,EACG,cAAc,CAAA,CAEhB,EAAA,EAjBD,CAAC,CAAC,KAAK,GAAG,KAAK,GAAG,KAAK,CAkBnB,CAAA,EAAA,CAAA,CACX;AAEd,CAAC"}
package/Tooltip/index.js CHANGED
@@ -24,6 +24,6 @@
24
24
  onMouseLeave: () => setTarget(null)
25
25
  });
26
26
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [child, jsxRuntime.jsx(index.default, { target: target, placement: placement, slotProps: {
27
- content: Object.assign({ p: .5, shadow: 1 }, template.primary)
27
+ content: Object.assign(Object.assign({ p: .5, shadow: 1 }, template.primary), { bgcolor: color == "default" ? "background.primary" : template.primary.bgcolor })
28
28
  }, children: title })] }));
29
29
  };exports.default=Tooltip;//# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/Tooltip/index.tsx"],"sourcesContent":["\nimport { Children, cloneElement, ReactElement, useState } from 'react'\nimport Menu, { MenuProps } from '../Menu'\nimport { useBreakpointProps, useColorTemplate, UseColorTemplateColor, UseColorTemplateType, useBreakpointPropsType } from '@xanui/core'\n\n\nexport type TooltipProps = {\n children: ReactElement;\n title: useBreakpointPropsType<string>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n placement?: MenuProps['placement']\n}\n\nconst Tooltip = ({ children, title, variant, color, placement }: TooltipProps) => {\n const [target, setTarget] = useState<any>()\n const _p: any = {}\n if (title) _p.title = title\n if (color) _p.color = color\n if (variant) _p.variant = variant\n const p: any = useBreakpointProps(_p)\n title = p.title\n color = p.color ?? \"default\"\n variant = p.variant ?? \"fill\"\n placement ??= \"bottom\"\n\n const template = useColorTemplate(color as any, variant as any)\n if (!children || Array.isArray(children)) throw new Error(\"Invalid children in Toast\")\n const first: any = Children.toArray(children).shift();\n const child = cloneElement(first, {\n onMouseEnter: (e) => {\n setTarget(e.target)\n },\n onMouseLeave: () => setTarget(null)\n })\n\n\n return (\n <>\n {child}\n <Menu\n target={target}\n placement={placement}\n slotProps={{\n content: {\n p: .5,\n shadow: 1,\n ...template.primary\n }\n }}\n >\n {title as any}\n </Menu>\n </>\n )\n}\n\nexport default Tooltip"],"names":["useState","useBreakpointProps","useColorTemplate","Children","cloneElement","_jsxs","_Fragment","_jsx","Menu"],"mappings":"uMAcA,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAgB,KAAI;;IAC7E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAQ,EAAO;IAC3C,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,MAAM,CAAC,GAAQC,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAC,CAAC,KAAK;AACf,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,SAAS;AAC5B,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,MAAM;IAC7B,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAT,SAAS,IAAT,SAAS,GAAK,QAAQ,CAAA;IAEtB,MAAM,QAAQ,GAAGC,qBAAgB,CAAC,KAAY,EAAE,OAAc,CAAC;IAC/D,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC;AAAE,QAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC;IACtF,MAAM,KAAK,GAAQC,cAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,KAAK,EAAE;AACrD,IAAA,MAAM,KAAK,GAAGC,kBAAY,CAAC,KAAK,EAAE;AAC9B,QAAA,YAAY,EAAE,CAAC,CAAC,KAAI;AAChB,YAAA,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC;QACvB,CAAC;AACD,QAAA,YAAY,EAAE,MAAM,SAAS,CAAC,IAAI;AACrC,KAAA,CAAC;AAGF,IAAA,QACIC,eAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA,CACK,KAAK,EACNC,cAAA,CAACC,aAAI,EAAA,EACD,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;AACP,oBAAA,OAAO,EAAA,MAAA,CAAA,MAAA,CAAA,EACH,CAAC,EAAE,EAAE,EACL,MAAM,EAAE,CAAC,EAAA,EACN,QAAQ,CAAC,OAAO;AAE1B,iBAAA,EAAA,QAAA,EAEA,KAAY,EAAA,CACV,CAAA,EAAA,CACR;AAEX"}
1
+ {"version":3,"file":"index.js","sources":["../../src/Tooltip/index.tsx"],"sourcesContent":["\nimport { Children, cloneElement, ReactElement, useState } from 'react'\nimport Menu, { MenuProps } from '../Menu'\nimport { useBreakpointProps, useColorTemplate, UseColorTemplateColor, UseColorTemplateType, useBreakpointPropsType } from '@xanui/core'\n\n\nexport type TooltipProps = {\n children: ReactElement;\n title: useBreakpointPropsType<string>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n placement?: MenuProps['placement']\n}\n\nconst Tooltip = ({ children, title, variant, color, placement }: TooltipProps) => {\n const [target, setTarget] = useState<any>()\n const _p: any = {}\n if (title) _p.title = title\n if (color) _p.color = color\n if (variant) _p.variant = variant\n const p: any = useBreakpointProps(_p)\n title = p.title\n color = p.color ?? \"default\"\n variant = p.variant ?? \"fill\"\n placement ??= \"bottom\"\n\n const template = useColorTemplate(color as any, variant as any)\n if (!children || Array.isArray(children)) throw new Error(\"Invalid children in Toast\")\n const first: any = Children.toArray(children).shift();\n const child = cloneElement(first, {\n onMouseEnter: (e) => {\n setTarget(e.target)\n },\n onMouseLeave: () => setTarget(null)\n })\n\n\n return (\n <>\n {child}\n <Menu\n target={target}\n placement={placement}\n slotProps={{\n content: {\n p: .5,\n shadow: 1,\n ...template.primary,\n bgcolor: color == \"default\" ? \"background.primary\" : template.primary.bgcolor,\n }\n }}\n >\n {title as any}\n </Menu>\n </>\n )\n}\n\nexport default Tooltip"],"names":["useState","useBreakpointProps","useColorTemplate","Children","cloneElement","_jsxs","_Fragment","_jsx","Menu"],"mappings":"uMAcA,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAgB,KAAI;;IAC7E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGA,cAAQ,EAAO;IAC3C,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,MAAM,CAAC,GAAQC,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAC,CAAC,KAAK;AACf,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,SAAS;AAC5B,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,MAAM;IAC7B,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAT,SAAS,IAAT,SAAS,GAAK,QAAQ,CAAA;IAEtB,MAAM,QAAQ,GAAGC,qBAAgB,CAAC,KAAY,EAAE,OAAc,CAAC;IAC/D,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC;AAAE,QAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC;IACtF,MAAM,KAAK,GAAQC,cAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,KAAK,EAAE;AACrD,IAAA,MAAM,KAAK,GAAGC,kBAAY,CAAC,KAAK,EAAE;AAC9B,QAAA,YAAY,EAAE,CAAC,CAAC,KAAI;AAChB,YAAA,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC;QACvB,CAAC;AACD,QAAA,YAAY,EAAE,MAAM,SAAS,CAAC,IAAI;AACrC,KAAA,CAAC;AAGF,IAAA,QACIC,eAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA,CACK,KAAK,EACNC,cAAA,CAACC,aAAI,EAAA,EACD,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;AACP,oBAAA,OAAO,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EACH,CAAC,EAAE,EAAE,EACL,MAAM,EAAE,CAAC,EAAA,EACN,QAAQ,CAAC,OAAO,KACnB,OAAO,EAAE,KAAK,IAAI,SAAS,GAAG,oBAAoB,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAA;AAEpF,iBAAA,EAAA,QAAA,EAEA,KAAY,EAAA,CACV,CAAA,EAAA,CACR;AAEX"}
package/Tooltip/index.mjs CHANGED
@@ -24,6 +24,6 @@ import {jsxs,Fragment,jsx}from'react/jsx-runtime';import {useState,Children,clon
24
24
  onMouseLeave: () => setTarget(null)
25
25
  });
26
26
  return (jsxs(Fragment, { children: [child, jsx(Menu, { target: target, placement: placement, slotProps: {
27
- content: Object.assign({ p: .5, shadow: 1 }, template.primary)
27
+ content: Object.assign(Object.assign({ p: .5, shadow: 1 }, template.primary), { bgcolor: color == "default" ? "background.primary" : template.primary.bgcolor })
28
28
  }, children: title })] }));
29
29
  };export{Tooltip as default};//# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../src/Tooltip/index.tsx"],"sourcesContent":["\nimport { Children, cloneElement, ReactElement, useState } from 'react'\nimport Menu, { MenuProps } from '../Menu'\nimport { useBreakpointProps, useColorTemplate, UseColorTemplateColor, UseColorTemplateType, useBreakpointPropsType } from '@xanui/core'\n\n\nexport type TooltipProps = {\n children: ReactElement;\n title: useBreakpointPropsType<string>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n placement?: MenuProps['placement']\n}\n\nconst Tooltip = ({ children, title, variant, color, placement }: TooltipProps) => {\n const [target, setTarget] = useState<any>()\n const _p: any = {}\n if (title) _p.title = title\n if (color) _p.color = color\n if (variant) _p.variant = variant\n const p: any = useBreakpointProps(_p)\n title = p.title\n color = p.color ?? \"default\"\n variant = p.variant ?? \"fill\"\n placement ??= \"bottom\"\n\n const template = useColorTemplate(color as any, variant as any)\n if (!children || Array.isArray(children)) throw new Error(\"Invalid children in Toast\")\n const first: any = Children.toArray(children).shift();\n const child = cloneElement(first, {\n onMouseEnter: (e) => {\n setTarget(e.target)\n },\n onMouseLeave: () => setTarget(null)\n })\n\n\n return (\n <>\n {child}\n <Menu\n target={target}\n placement={placement}\n slotProps={{\n content: {\n p: .5,\n shadow: 1,\n ...template.primary\n }\n }}\n >\n {title as any}\n </Menu>\n </>\n )\n}\n\nexport default Tooltip"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"uMAcA,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAgB,KAAI;;IAC7E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,EAAO;IAC3C,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAC,CAAC,KAAK;AACf,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,SAAS;AAC5B,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,MAAM;IAC7B,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAT,SAAS,IAAT,SAAS,GAAK,QAAQ,CAAA;IAEtB,MAAM,QAAQ,GAAG,gBAAgB,CAAC,KAAY,EAAE,OAAc,CAAC;IAC/D,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC;AAAE,QAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC;IACtF,MAAM,KAAK,GAAQ,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,KAAK,EAAE;AACrD,IAAA,MAAM,KAAK,GAAG,YAAY,CAAC,KAAK,EAAE;AAC9B,QAAA,YAAY,EAAE,CAAC,CAAC,KAAI;AAChB,YAAA,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC;QACvB,CAAC;AACD,QAAA,YAAY,EAAE,MAAM,SAAS,CAAC,IAAI;AACrC,KAAA,CAAC;AAGF,IAAA,QACIA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACK,KAAK,EACNC,GAAA,CAAC,IAAI,EAAA,EACD,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;AACP,oBAAA,OAAO,EAAA,MAAA,CAAA,MAAA,CAAA,EACH,CAAC,EAAE,EAAE,EACL,MAAM,EAAE,CAAC,EAAA,EACN,QAAQ,CAAC,OAAO;AAE1B,iBAAA,EAAA,QAAA,EAEA,KAAY,EAAA,CACV,CAAA,EAAA,CACR;AAEX"}
1
+ {"version":3,"file":"index.mjs","sources":["../../src/Tooltip/index.tsx"],"sourcesContent":["\nimport { Children, cloneElement, ReactElement, useState } from 'react'\nimport Menu, { MenuProps } from '../Menu'\nimport { useBreakpointProps, useColorTemplate, UseColorTemplateColor, UseColorTemplateType, useBreakpointPropsType } from '@xanui/core'\n\n\nexport type TooltipProps = {\n children: ReactElement;\n title: useBreakpointPropsType<string>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n placement?: MenuProps['placement']\n}\n\nconst Tooltip = ({ children, title, variant, color, placement }: TooltipProps) => {\n const [target, setTarget] = useState<any>()\n const _p: any = {}\n if (title) _p.title = title\n if (color) _p.color = color\n if (variant) _p.variant = variant\n const p: any = useBreakpointProps(_p)\n title = p.title\n color = p.color ?? \"default\"\n variant = p.variant ?? \"fill\"\n placement ??= \"bottom\"\n\n const template = useColorTemplate(color as any, variant as any)\n if (!children || Array.isArray(children)) throw new Error(\"Invalid children in Toast\")\n const first: any = Children.toArray(children).shift();\n const child = cloneElement(first, {\n onMouseEnter: (e) => {\n setTarget(e.target)\n },\n onMouseLeave: () => setTarget(null)\n })\n\n\n return (\n <>\n {child}\n <Menu\n target={target}\n placement={placement}\n slotProps={{\n content: {\n p: .5,\n shadow: 1,\n ...template.primary,\n bgcolor: color == \"default\" ? \"background.primary\" : template.primary.bgcolor,\n }\n }}\n >\n {title as any}\n </Menu>\n </>\n )\n}\n\nexport default Tooltip"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"uMAcA,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAgB,KAAI;;IAC7E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,EAAO;IAC3C,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,IAAI,OAAO;AAAE,QAAA,EAAE,CAAC,OAAO,GAAG,OAAO;AACjC,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAC,CAAC,KAAK;AACf,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,SAAS;AAC5B,IAAA,OAAO,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,MAAM;IAC7B,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAT,SAAS,IAAT,SAAS,GAAK,QAAQ,CAAA;IAEtB,MAAM,QAAQ,GAAG,gBAAgB,CAAC,KAAY,EAAE,OAAc,CAAC;IAC/D,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC;AAAE,QAAA,MAAM,IAAI,KAAK,CAAC,2BAA2B,CAAC;IACtF,MAAM,KAAK,GAAQ,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,KAAK,EAAE;AACrD,IAAA,MAAM,KAAK,GAAG,YAAY,CAAC,KAAK,EAAE;AAC9B,QAAA,YAAY,EAAE,CAAC,CAAC,KAAI;AAChB,YAAA,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC;QACvB,CAAC;AACD,QAAA,YAAY,EAAE,MAAM,SAAS,CAAC,IAAI;AACrC,KAAA,CAAC;AAGF,IAAA,QACIA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACK,KAAK,EACNC,GAAA,CAAC,IAAI,EAAA,EACD,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE;AACP,oBAAA,OAAO,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EACH,CAAC,EAAE,EAAE,EACL,MAAM,EAAE,CAAC,EAAA,EACN,QAAQ,CAAC,OAAO,KACnB,OAAO,EAAE,KAAK,IAAI,SAAS,GAAG,oBAAoB,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAA;AAEpF,iBAAA,EAAA,QAAA,EAEA,KAAY,EAAA,CACV,CAAA,EAAA,CACR;AAEX"}
package/index.d.ts CHANGED
@@ -1,55 +1,55 @@
1
- export { default as Accordion } from './Accordion/index.js';
2
- export { default as Alert } from './Alert/index.js';
3
- export { default as Avatar } from './Avatar/index.js';
4
- export { default as Badge } from './Badge/index.js';
5
- export { default as Box } from './Box/index.js';
6
- export { default as Button } from './Button/index.js';
7
- export { default as ButtonGroup } from './ButtonGroup/index.js';
8
- export { default as Calendar } from './Calendar/index.js';
9
- export { default as CalendarInput } from './CalendarInput/index.js';
10
- export { default as Checkbox } from './Checkbox/index.js';
11
- export { default as Chip } from './Chip/index.js';
12
- export { default as CircleProgress } from './CircleProgress/index.js';
13
- export { default as ClickOutside } from './ClickOutside/index.js';
14
- export { default as Collaps } from './Collaps/index.js';
15
- export { default as Container } from './Container/index.js';
16
- export { default as Datatable } from './Datatable/index.js';
17
- export { default as Divider } from './Divider/index.js';
18
- export { default as Drawer } from './Drawer/index.js';
19
- export { default as Form } from './Form/index.js';
20
- export { default as GridContainer } from './GridContainer/index.js';
21
- export { default as GridItem } from './GridItem/index.js';
22
- export { default as IconButton } from './IconButton/index.js';
23
- export { default as Image } from './Image/index.js';
24
- export { default as Input } from './Input/index.js';
25
- export { default as Label } from './Label/index.js';
26
- export { default as Layer } from './Layer/index.js';
27
- export { default as LineProgress } from './LineProgress/index.js';
28
- export { default as List } from './List/index.js';
29
- export { default as ListItem } from './ListItem/index.js';
30
- export { default as LoadingBox } from './LoadingBox/index.js';
31
- export { default as Menu } from './Menu/index.js';
32
- export { default as Modal } from './Modal/index.js';
33
- export { default as NoSSR } from './NoSSR/index.js';
34
- export { default as Option } from './Option/index.js';
35
- export { default as Paper } from './Paper/index.js';
36
- export { default as Portal } from './Portal/index.js';
37
- export { default as Radio } from './Radio/index.js';
38
- export { default as Scrollbar } from './Scrollbar/index.js';
39
- export { default as Select } from './Select/index.js';
40
- export { default as Stack } from './Stack/index.js';
41
- export { default as Switch } from './Switch/index.js';
42
- export { default as Tab } from './Tab/index.js';
43
- export { default as Table } from './Table/index.js';
44
- export { default as TableBody } from './TableBody/index.js';
45
- export { default as TableCell } from './TableCell/index.js';
46
- export { default as TableFooter } from './TableFooter/index.js';
47
- export { default as TableHead } from './TableHead/index.js';
48
- export { default as TablePagination } from './TablePagination/index.js';
49
- export { default as TableRow } from './TableRow/index.js';
50
- export { default as Tabs } from './Tabs/index.js';
51
- export { default as Text } from './Text/index.js';
52
- export { default as Toast } from './Toast/index.js';
53
- export { default as Tooltip } from './Tooltip/index.js';
54
- export { default as useCorner } from './useCorner/index.js';
55
- export { default as ViewBox } from './ViewBox/index.js';
1
+ export { default as Accordion, default as AccordionProps } from './Accordion/index.js';
2
+ export { default as Alert, default as AlertProps } from './Alert/index.js';
3
+ export { default as Avatar, default as AvatarProps } from './Avatar/index.js';
4
+ export { default as Badge, default as BadgeProps } from './Badge/index.js';
5
+ export { default as Box, default as BoxProps } from './Box/index.js';
6
+ export { default as Button, default as ButtonProps } from './Button/index.js';
7
+ export { default as ButtonGroup, default as ButtonGroupProps } from './ButtonGroup/index.js';
8
+ export { default as Calendar, default as CalendarProps } from './Calendar/index.js';
9
+ export { default as CalendarInput, default as CalendarInputProps } from './CalendarInput/index.js';
10
+ export { default as Checkbox, default as CheckboxProps } from './Checkbox/index.js';
11
+ export { default as Chip, default as ChipProps } from './Chip/index.js';
12
+ export { default as CircleProgress, default as CircleProgressProps } from './CircleProgress/index.js';
13
+ export { default as ClickOutside, default as ClickOutsideProps } from './ClickOutside/index.js';
14
+ export { default as Collaps, default as CollapsProps } from './Collaps/index.js';
15
+ export { default as Container, default as ContainerProps } from './Container/index.js';
16
+ export { default as Datatable, default as DatatableProps } from './Datatable/index.js';
17
+ export { default as Divider, default as DividerProps } from './Divider/index.js';
18
+ export { default as Drawer, default as DrawerProps } from './Drawer/index.js';
19
+ export { default as Form, default as FormProps } from './Form/index.js';
20
+ export { default as GridContainer, default as GridContainerProps } from './GridContainer/index.js';
21
+ export { default as GridItem, default as GridItemProps } from './GridItem/index.js';
22
+ export { default as IconButton, default as IconButtonProps } from './IconButton/index.js';
23
+ export { default as Image, default as ImageProps } from './Image/index.js';
24
+ export { default as Input, default as InputProps } from './Input/index.js';
25
+ export { default as Label, default as LabelProps } from './Label/index.js';
26
+ export { default as Layer, default as LayerProps } from './Layer/index.js';
27
+ export { default as LineProgress, default as LineProgressProps } from './LineProgress/index.js';
28
+ export { default as List, default as ListProps } from './List/index.js';
29
+ export { default as ListItem, default as ListItemProps } from './ListItem/index.js';
30
+ export { default as LoadingBox, default as LoadingBoxProps } from './LoadingBox/index.js';
31
+ export { default as Menu, default as MenuProps } from './Menu/index.js';
32
+ export { default as Modal, default as ModalProps } from './Modal/index.js';
33
+ export { default as NoSSR, default as NoSSRProps } from './NoSSR/index.js';
34
+ export { default as Option, default as OptionProps } from './Option/index.js';
35
+ export { default as Paper, default as PaperProps } from './Paper/index.js';
36
+ export { default as Portal, default as PortalProps } from './Portal/index.js';
37
+ export { default as Radio, default as RadioProps } from './Radio/index.js';
38
+ export { default as Scrollbar, default as ScrollbarProps } from './Scrollbar/index.js';
39
+ export { default as Select, default as SelectProps } from './Select/index.js';
40
+ export { default as Stack, default as StackProps } from './Stack/index.js';
41
+ export { default as Switch, default as SwitchProps } from './Switch/index.js';
42
+ export { default as Tab, default as TabProps } from './Tab/index.js';
43
+ export { default as Table, default as TableProps } from './Table/index.js';
44
+ export { default as TableBody, default as TableBodyProps } from './TableBody/index.js';
45
+ export { default as TableCell, default as TableCellProps } from './TableCell/index.js';
46
+ export { default as TableFooter, default as TableFooterProps } from './TableFooter/index.js';
47
+ export { default as TableHead, default as TableHeadProps } from './TableHead/index.js';
48
+ export { default as TablePagination, default as TablePaginationProps } from './TablePagination/index.js';
49
+ export { default as TableRow, default as TableRowProps } from './TableRow/index.js';
50
+ export { default as Tabs, default as TabsProps } from './Tabs/index.js';
51
+ export { default as Text, default as TextProps } from './Text/index.js';
52
+ export { default as Toast, default as ToastProps } from './Toast/index.js';
53
+ export { default as Tooltip, default as TooltipProps } from './Tooltip/index.js';
54
+ export { default as useCorner, default as useCornerProps } from './useCorner/index.js';
55
+ export { default as ViewBox, default as ViewBoxProps } from './ViewBox/index.js';
package/package.json CHANGED
@@ -1,18 +1,15 @@
1
1
  {
2
2
  "name": "@xanui/ui",
3
- "version": "1.1.9",
3
+ "version": "1.1.11",
4
4
  "description": "",
5
- "publishConfig": {
6
- "access": "public"
7
- },
5
+ "private": false,
8
6
  "main": "./index.js",
9
7
  "module": "./index.mjs",
10
8
  "types": "./index.d.ts",
11
9
  "dependencies": {
12
- "@xanui/core": "^1.2.26",
10
+ "@xanui/core": "^1.2.29",
13
11
  "@xanui/icons": "^1.1.10",
14
- "oncss": "^1.2.3",
15
- "pretty-class": "^1.0.5",
12
+ "pretty-class": "^1.0.8",
16
13
  "react-state-bucket": "^1.2.6"
17
14
  },
18
15
  "devDependencies": {
@@ -33,9 +30,9 @@
33
30
  "types": "./index.d.ts"
34
31
  },
35
32
  "./*": {
36
- "import": "./**/*.mjs",
37
- "require": "./**/*.js",
38
- "types": "./**/*.d.ts"
33
+ "import": "./*/index.mjs",
34
+ "require": "./*/index.js",
35
+ "types": "./*/index.d.ts"
39
36
  }
40
37
  }
41
38
  }
@@ -1,4 +1,4 @@
1
- import { TransitionVariantTypes } from '@xanui/core';
1
+ import { UseTransitionVariantTypes } from '@xanui/core';
2
2
  import { ButtonProps } from '../Button/index.js';
3
3
  import { UseModalProps } from '../useModal/index.js';
4
4
  import { AlertProps } from '../Alert/index.js';
@@ -24,7 +24,7 @@ type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | "size"
24
24
  variant?: "text" | "fill";
25
25
  onConfirm?: () => Promise<void> | void;
26
26
  onCancel?: () => Promise<void> | void;
27
- transition?: TransitionVariantTypes;
27
+ transition?: UseTransitionVariantTypes;
28
28
  blurMode?: UseModalProps['blurMode'];
29
29
  slotProps?: {
30
30
  modal?: UseModalProps;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/useAlert/index.tsx"],"sourcesContent":["\nimport { Tag, TransitionVariantTypes } from \"@xanui/core\"\nimport Button, { ButtonProps } from \"../Button\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport Alert, { AlertProps } from \"../Alert\";\nimport React from \"react\";\nexport type UseAlertContentProps = {\n open: () => void;\n close: () => void;\n loading: (is: boolean) => void;\n isLoading: () => boolean;\n}\n\nexport type UseAlertContent = React.ReactElement | ((props: UseAlertContentProps) => React.ReactElement)\n\nexport type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | \"size\"> & {\n content: string | UseAlertContent,\n size?: \"small\" | \"medium\" | \"large\" | number;\n closeButton?: boolean;\n clickOutsideToClose?: boolean;\n okButtonText?: string;\n cancelButtonText?: string;\n hideOkButton?: boolean;\n hideCancelButton?: boolean;\n buttonPlacement?: \"start\" | \"end\" | \"between\" | \"full\";\n variant?: \"text\" | \"fill\"\n onConfirm?: () => Promise<void> | void;\n onCancel?: () => Promise<void> | void;\n transition?: TransitionVariantTypes;\n blurMode?: UseModalProps['blurMode'];\n slotProps?: {\n modal?: UseModalProps;\n okButton?: Omit<ButtonProps, \"children\">;\n closeButton?: Omit<ButtonProps, \"children\">;\n }\n}\n\n\nconst useAlert = (props: UseAlerProps) => {\n const [loading, setLoading] = React.useState(false)\n let {\n content,\n size,\n color,\n direction,\n variant,\n closeButton,\n clickOutsideToClose,\n okButtonText,\n cancelButtonText,\n hideOkButton,\n hideCancelButton,\n buttonPlacement,\n onConfirm,\n onCancel,\n transition,\n blurMode,\n slotProps,\n ...rest\n } = props\n\n hideOkButton ??= false\n hideCancelButton ??= false\n\n size ??= \"small\"\n color ??= 'default'\n variant ??= \"text\"\n direction ??= \"column\"\n buttonPlacement ??= \"end\"\n let sx: any = {};\n\n switch (buttonPlacement) {\n case \"start\":\n sx.justifyContent = 'flex-start'\n break;\n case \"end\":\n sx.justifyContent = 'flex-end'\n break;\n case \"between\":\n sx.justifyContent = 'space-between'\n break;\n case \"full\":\n sx = {\n \"& button\": {\n flex: 1\n }\n }\n break;\n }\n\n let sizes: any = {\n small: 320,\n medium: 400,\n large: 600\n }\n\n let okcolor = color\n let closecolor = color\n if (color === 'default') {\n okcolor = 'brand'\n closecolor = 'default'\n variant = 'text'\n } else {\n if (variant === 'fill') {\n okcolor = 'default'\n closecolor = 'default'\n } else {\n okcolor = color\n closecolor = 'default'\n }\n }\n\n const modal = useModal(<Alert\n direction={direction}\n sx={{\n px: 2,\n py: 1,\n pt: direction === 'row' ? 1 : 2\n }}\n color={color}\n variant={variant}\n onClose={closeButton ? close : undefined}\n {...rest}\n >\n {typeof content === \"function\" ? content({\n open: () => modal.open(),\n close: () => modal.close(),\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }) : content}\n <Tag\n sxr={{\n display: \"flex\",\n gap: 1,\n pt: 4,\n flexDirection: \"row\",\n ...sx,\n }}\n >\n {!hideCancelButton && <Button\n disabled={loading}\n color={closecolor}\n variant=\"fill\"\n {...slotProps?.closeButton}\n onClick={async () => {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }}\n >{cancelButtonText || \"Close\"}</Button>}\n <Button\n loading={loading}\n color={okcolor}\n variant=\"fill\"\n {...slotProps?.okButton}\n\n onClick={async () => {\n setLoading(true)\n onConfirm && await onConfirm()\n setLoading(false)\n modal.close()\n }}\n >{okButtonText || \"OK\"}</Button>\n </Tag>\n </Alert>, {\n ...slotProps?.modal,\n size: sizes[size] || size,\n blur: 40,\n blurMode: blurMode || \"transparent\",\n transition: transition || \"zoom\",\n onClickOutside: async () => {\n if (clickOutsideToClose && !loading) {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }\n }\n })\n\n return {\n ...modal,\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }\n}\n\nexport default useAlert"],"names":["__rest","useModal","_jsxs","Alert","Tag","_jsx","Button"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../src/useAlert/index.tsx"],"sourcesContent":["\nimport { Tag, UseTransitionVariantTypes } from \"@xanui/core\"\nimport Button, { ButtonProps } from \"../Button\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport Alert, { AlertProps } from \"../Alert\";\nimport React from \"react\";\nexport type UseAlertContentProps = {\n open: () => void;\n close: () => void;\n loading: (is: boolean) => void;\n isLoading: () => boolean;\n}\n\nexport type UseAlertContent = React.ReactElement | ((props: UseAlertContentProps) => React.ReactElement)\n\nexport type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | \"size\"> & {\n content: string | UseAlertContent,\n size?: \"small\" | \"medium\" | \"large\" | number;\n closeButton?: boolean;\n clickOutsideToClose?: boolean;\n okButtonText?: string;\n cancelButtonText?: string;\n hideOkButton?: boolean;\n hideCancelButton?: boolean;\n buttonPlacement?: \"start\" | \"end\" | \"between\" | \"full\";\n variant?: \"text\" | \"fill\"\n onConfirm?: () => Promise<void> | void;\n onCancel?: () => Promise<void> | void;\n transition?: UseTransitionVariantTypes;\n blurMode?: UseModalProps['blurMode'];\n slotProps?: {\n modal?: UseModalProps;\n okButton?: Omit<ButtonProps, \"children\">;\n closeButton?: Omit<ButtonProps, \"children\">;\n }\n}\n\n\nconst useAlert = (props: UseAlerProps) => {\n const [loading, setLoading] = React.useState(false)\n let {\n content,\n size,\n color,\n direction,\n variant,\n closeButton,\n clickOutsideToClose,\n okButtonText,\n cancelButtonText,\n hideOkButton,\n hideCancelButton,\n buttonPlacement,\n onConfirm,\n onCancel,\n transition,\n blurMode,\n slotProps,\n ...rest\n } = props\n\n hideOkButton ??= false\n hideCancelButton ??= false\n\n size ??= \"small\"\n color ??= 'default'\n variant ??= \"text\"\n direction ??= \"column\"\n buttonPlacement ??= \"end\"\n let sx: any = {};\n\n switch (buttonPlacement) {\n case \"start\":\n sx.justifyContent = 'flex-start'\n break;\n case \"end\":\n sx.justifyContent = 'flex-end'\n break;\n case \"between\":\n sx.justifyContent = 'space-between'\n break;\n case \"full\":\n sx = {\n \"& button\": {\n flex: 1\n }\n }\n break;\n }\n\n let sizes: any = {\n small: 320,\n medium: 400,\n large: 600\n }\n\n let okcolor = color\n let closecolor = color\n if (color === 'default') {\n okcolor = 'brand'\n closecolor = 'default'\n variant = 'text'\n } else {\n if (variant === 'fill') {\n okcolor = 'default'\n closecolor = 'default'\n } else {\n okcolor = color\n closecolor = 'default'\n }\n }\n\n const modal = useModal(<Alert\n direction={direction}\n sx={{\n px: 2,\n py: 1,\n pt: direction === 'row' ? 1 : 2\n }}\n color={color}\n variant={variant}\n onClose={closeButton ? close : undefined}\n {...rest}\n >\n {typeof content === \"function\" ? content({\n open: () => modal.open(),\n close: () => modal.close(),\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }) : content}\n <Tag\n sxr={{\n display: \"flex\",\n gap: 1,\n pt: 4,\n flexDirection: \"row\",\n ...sx,\n }}\n >\n {!hideCancelButton && <Button\n disabled={loading}\n color={closecolor}\n variant=\"fill\"\n {...slotProps?.closeButton}\n onClick={async () => {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }}\n >{cancelButtonText || \"Close\"}</Button>}\n <Button\n loading={loading}\n color={okcolor}\n variant=\"fill\"\n {...slotProps?.okButton}\n\n onClick={async () => {\n setLoading(true)\n onConfirm && await onConfirm()\n setLoading(false)\n modal.close()\n }}\n >{okButtonText || \"OK\"}</Button>\n </Tag>\n </Alert>, {\n ...slotProps?.modal,\n size: sizes[size] || size,\n blur: 40,\n blurMode: blurMode || \"transparent\",\n transition: transition || \"zoom\",\n onClickOutside: async () => {\n if (clickOutsideToClose && !loading) {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }\n }\n })\n\n return {\n ...modal,\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }\n}\n\nexport default useAlert"],"names":["__rest","useModal","_jsxs","Alert","Tag","_jsx","Button"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../src/useAlert/index.tsx"],"sourcesContent":["\nimport { Tag, TransitionVariantTypes } from \"@xanui/core\"\nimport Button, { ButtonProps } from \"../Button\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport Alert, { AlertProps } from \"../Alert\";\nimport React from \"react\";\nexport type UseAlertContentProps = {\n open: () => void;\n close: () => void;\n loading: (is: boolean) => void;\n isLoading: () => boolean;\n}\n\nexport type UseAlertContent = React.ReactElement | ((props: UseAlertContentProps) => React.ReactElement)\n\nexport type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | \"size\"> & {\n content: string | UseAlertContent,\n size?: \"small\" | \"medium\" | \"large\" | number;\n closeButton?: boolean;\n clickOutsideToClose?: boolean;\n okButtonText?: string;\n cancelButtonText?: string;\n hideOkButton?: boolean;\n hideCancelButton?: boolean;\n buttonPlacement?: \"start\" | \"end\" | \"between\" | \"full\";\n variant?: \"text\" | \"fill\"\n onConfirm?: () => Promise<void> | void;\n onCancel?: () => Promise<void> | void;\n transition?: TransitionVariantTypes;\n blurMode?: UseModalProps['blurMode'];\n slotProps?: {\n modal?: UseModalProps;\n okButton?: Omit<ButtonProps, \"children\">;\n closeButton?: Omit<ButtonProps, \"children\">;\n }\n}\n\n\nconst useAlert = (props: UseAlerProps) => {\n const [loading, setLoading] = React.useState(false)\n let {\n content,\n size,\n color,\n direction,\n variant,\n closeButton,\n clickOutsideToClose,\n okButtonText,\n cancelButtonText,\n hideOkButton,\n hideCancelButton,\n buttonPlacement,\n onConfirm,\n onCancel,\n transition,\n blurMode,\n slotProps,\n ...rest\n } = props\n\n hideOkButton ??= false\n hideCancelButton ??= false\n\n size ??= \"small\"\n color ??= 'default'\n variant ??= \"text\"\n direction ??= \"column\"\n buttonPlacement ??= \"end\"\n let sx: any = {};\n\n switch (buttonPlacement) {\n case \"start\":\n sx.justifyContent = 'flex-start'\n break;\n case \"end\":\n sx.justifyContent = 'flex-end'\n break;\n case \"between\":\n sx.justifyContent = 'space-between'\n break;\n case \"full\":\n sx = {\n \"& button\": {\n flex: 1\n }\n }\n break;\n }\n\n let sizes: any = {\n small: 320,\n medium: 400,\n large: 600\n }\n\n let okcolor = color\n let closecolor = color\n if (color === 'default') {\n okcolor = 'brand'\n closecolor = 'default'\n variant = 'text'\n } else {\n if (variant === 'fill') {\n okcolor = 'default'\n closecolor = 'default'\n } else {\n okcolor = color\n closecolor = 'default'\n }\n }\n\n const modal = useModal(<Alert\n direction={direction}\n sx={{\n px: 2,\n py: 1,\n pt: direction === 'row' ? 1 : 2\n }}\n color={color}\n variant={variant}\n onClose={closeButton ? close : undefined}\n {...rest}\n >\n {typeof content === \"function\" ? content({\n open: () => modal.open(),\n close: () => modal.close(),\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }) : content}\n <Tag\n sxr={{\n display: \"flex\",\n gap: 1,\n pt: 4,\n flexDirection: \"row\",\n ...sx,\n }}\n >\n {!hideCancelButton && <Button\n disabled={loading}\n color={closecolor}\n variant=\"fill\"\n {...slotProps?.closeButton}\n onClick={async () => {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }}\n >{cancelButtonText || \"Close\"}</Button>}\n <Button\n loading={loading}\n color={okcolor}\n variant=\"fill\"\n {...slotProps?.okButton}\n\n onClick={async () => {\n setLoading(true)\n onConfirm && await onConfirm()\n setLoading(false)\n modal.close()\n }}\n >{okButtonText || \"OK\"}</Button>\n </Tag>\n </Alert>, {\n ...slotProps?.modal,\n size: sizes[size] || size,\n blur: 40,\n blurMode: blurMode || \"transparent\",\n transition: transition || \"zoom\",\n onClickOutside: async () => {\n if (clickOutsideToClose && !loading) {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }\n }\n })\n\n return {\n ...modal,\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }\n}\n\nexport default useAlert"],"names":["_jsxs","_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"index.mjs","sources":["../../src/useAlert/index.tsx"],"sourcesContent":["\nimport { Tag, UseTransitionVariantTypes } from \"@xanui/core\"\nimport Button, { ButtonProps } from \"../Button\";\nimport useModal, { UseModalProps } from \"../useModal\";\nimport Alert, { AlertProps } from \"../Alert\";\nimport React from \"react\";\nexport type UseAlertContentProps = {\n open: () => void;\n close: () => void;\n loading: (is: boolean) => void;\n isLoading: () => boolean;\n}\n\nexport type UseAlertContent = React.ReactElement | ((props: UseAlertContentProps) => React.ReactElement)\n\nexport type UseAlerProps = Omit<AlertProps, 'children' | 'onClose' | 'variant' | \"size\"> & {\n content: string | UseAlertContent,\n size?: \"small\" | \"medium\" | \"large\" | number;\n closeButton?: boolean;\n clickOutsideToClose?: boolean;\n okButtonText?: string;\n cancelButtonText?: string;\n hideOkButton?: boolean;\n hideCancelButton?: boolean;\n buttonPlacement?: \"start\" | \"end\" | \"between\" | \"full\";\n variant?: \"text\" | \"fill\"\n onConfirm?: () => Promise<void> | void;\n onCancel?: () => Promise<void> | void;\n transition?: UseTransitionVariantTypes;\n blurMode?: UseModalProps['blurMode'];\n slotProps?: {\n modal?: UseModalProps;\n okButton?: Omit<ButtonProps, \"children\">;\n closeButton?: Omit<ButtonProps, \"children\">;\n }\n}\n\n\nconst useAlert = (props: UseAlerProps) => {\n const [loading, setLoading] = React.useState(false)\n let {\n content,\n size,\n color,\n direction,\n variant,\n closeButton,\n clickOutsideToClose,\n okButtonText,\n cancelButtonText,\n hideOkButton,\n hideCancelButton,\n buttonPlacement,\n onConfirm,\n onCancel,\n transition,\n blurMode,\n slotProps,\n ...rest\n } = props\n\n hideOkButton ??= false\n hideCancelButton ??= false\n\n size ??= \"small\"\n color ??= 'default'\n variant ??= \"text\"\n direction ??= \"column\"\n buttonPlacement ??= \"end\"\n let sx: any = {};\n\n switch (buttonPlacement) {\n case \"start\":\n sx.justifyContent = 'flex-start'\n break;\n case \"end\":\n sx.justifyContent = 'flex-end'\n break;\n case \"between\":\n sx.justifyContent = 'space-between'\n break;\n case \"full\":\n sx = {\n \"& button\": {\n flex: 1\n }\n }\n break;\n }\n\n let sizes: any = {\n small: 320,\n medium: 400,\n large: 600\n }\n\n let okcolor = color\n let closecolor = color\n if (color === 'default') {\n okcolor = 'brand'\n closecolor = 'default'\n variant = 'text'\n } else {\n if (variant === 'fill') {\n okcolor = 'default'\n closecolor = 'default'\n } else {\n okcolor = color\n closecolor = 'default'\n }\n }\n\n const modal = useModal(<Alert\n direction={direction}\n sx={{\n px: 2,\n py: 1,\n pt: direction === 'row' ? 1 : 2\n }}\n color={color}\n variant={variant}\n onClose={closeButton ? close : undefined}\n {...rest}\n >\n {typeof content === \"function\" ? content({\n open: () => modal.open(),\n close: () => modal.close(),\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }) : content}\n <Tag\n sxr={{\n display: \"flex\",\n gap: 1,\n pt: 4,\n flexDirection: \"row\",\n ...sx,\n }}\n >\n {!hideCancelButton && <Button\n disabled={loading}\n color={closecolor}\n variant=\"fill\"\n {...slotProps?.closeButton}\n onClick={async () => {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }}\n >{cancelButtonText || \"Close\"}</Button>}\n <Button\n loading={loading}\n color={okcolor}\n variant=\"fill\"\n {...slotProps?.okButton}\n\n onClick={async () => {\n setLoading(true)\n onConfirm && await onConfirm()\n setLoading(false)\n modal.close()\n }}\n >{okButtonText || \"OK\"}</Button>\n </Tag>\n </Alert>, {\n ...slotProps?.modal,\n size: sizes[size] || size,\n blur: 40,\n blurMode: blurMode || \"transparent\",\n transition: transition || \"zoom\",\n onClickOutside: async () => {\n if (clickOutsideToClose && !loading) {\n setLoading(true)\n onCancel && await onCancel()\n setLoading(false)\n modal.close()\n }\n }\n })\n\n return {\n ...modal,\n loading: (is: boolean) => setLoading(is),\n isLoading: () => loading\n }\n}\n\nexport default useAlert"],"names":["_jsxs","_jsx"],"mappings":"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"}