@xanui/ui 1.1.17 → 1.1.19
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/Accordion/index.js +18 -3
- package/Accordion/index.js.map +1 -1
- package/Accordion/index.mjs +15 -2
- package/Accordion/index.mjs.map +1 -1
- package/Alert/index.js +24 -5
- package/Alert/index.js.map +1 -1
- package/Alert/index.mjs +19 -2
- package/Alert/index.mjs.map +1 -1
- package/Avatar/index.js +13 -2
- package/Avatar/index.js.map +1 -1
- package/Avatar/index.mjs +11 -2
- package/Avatar/index.mjs.map +1 -1
- package/Badge/index.js +12 -2
- package/Badge/index.js.map +1 -1
- package/Badge/index.mjs +10 -2
- package/Badge/index.mjs.map +1 -1
- package/Box/index.js +12 -2
- package/Box/index.js.map +1 -1
- package/Box/index.mjs +10 -2
- package/Box/index.mjs.map +1 -1
- package/Button/index.js +17 -4
- package/Button/index.js.map +1 -1
- package/Button/index.mjs +13 -2
- package/Button/index.mjs.map +1 -1
- package/ButtonGroup/index.js +12 -2
- package/ButtonGroup/index.js.map +1 -1
- package/ButtonGroup/index.mjs +10 -2
- package/ButtonGroup/index.mjs.map +1 -1
- package/Calendar/index.js +35 -16
- package/Calendar/index.js.map +1 -1
- package/Calendar/index.mjs +19 -2
- package/Calendar/index.mjs.map +1 -1
- package/CalendarInput/index.js +23 -4
- package/CalendarInput/index.js.map +1 -1
- package/CalendarInput/index.mjs +19 -2
- package/CalendarInput/index.mjs.map +1 -1
- package/Checkbox/index.js +16 -2
- package/Checkbox/index.js.map +1 -1
- package/Checkbox/index.mjs +14 -2
- package/Checkbox/index.mjs.map +1 -1
- package/Chip/index.js +14 -3
- package/Chip/index.js.map +1 -1
- package/Chip/index.mjs +11 -2
- package/Chip/index.mjs.map +1 -1
- package/CircleProgress/index.js +13 -2
- package/CircleProgress/index.js.map +1 -1
- package/CircleProgress/index.mjs +11 -2
- package/CircleProgress/index.mjs.map +1 -1
- package/ClickOutside/index.js +13 -2
- package/ClickOutside/index.js.map +1 -1
- package/ClickOutside/index.mjs +11 -2
- package/ClickOutside/index.mjs.map +1 -1
- package/Collaps/index.js +12 -2
- package/Collaps/index.js.map +1 -1
- package/Collaps/index.mjs +10 -2
- package/Collaps/index.mjs.map +1 -1
- package/Container/index.js +12 -2
- package/Container/index.js.map +1 -1
- package/Container/index.mjs +10 -2
- package/Container/index.mjs.map +1 -1
- package/Datatable/FilterBox.js +22 -7
- package/Datatable/FilterBox.js.map +1 -1
- package/Datatable/FilterBox.mjs +15 -2
- package/Datatable/FilterBox.mjs.map +1 -1
- package/Datatable/Row.js +25 -7
- package/Datatable/Row.js.map +1 -1
- package/Datatable/Row.mjs +18 -2
- package/Datatable/Row.mjs.map +1 -1
- package/Datatable/SelectedBox.js +15 -4
- package/Datatable/SelectedBox.js.map +1 -1
- package/Datatable/SelectedBox.mjs +11 -2
- package/Datatable/SelectedBox.mjs.map +1 -1
- package/Datatable/Table.js +16 -4
- package/Datatable/Table.js.map +1 -1
- package/Datatable/Table.mjs +12 -2
- package/Datatable/Table.mjs.map +1 -1
- package/Datatable/TableHead.js +22 -5
- package/Datatable/TableHead.js.map +1 -1
- package/Datatable/TableHead.mjs +17 -2
- package/Datatable/TableHead.mjs.map +1 -1
- package/Datatable/index.js +21 -4
- package/Datatable/index.js.map +1 -1
- package/Datatable/index.mjs +17 -2
- package/Datatable/index.mjs.map +1 -1
- package/Datatable/types.d.ts +12 -2
- package/Divider/index.js +12 -2
- package/Divider/index.js.map +1 -1
- package/Divider/index.mjs +10 -2
- package/Divider/index.mjs.map +1 -1
- package/Drawer/index.js +16 -4
- package/Drawer/index.js.map +1 -1
- package/Drawer/index.mjs +12 -2
- package/Drawer/index.mjs.map +1 -1
- package/Form/index.js +13 -2
- package/Form/index.js.map +1 -1
- package/Form/index.mjs +11 -2
- package/Form/index.mjs.map +1 -1
- package/GridContainer/index.js +12 -2
- package/GridContainer/index.js.map +1 -1
- package/GridContainer/index.mjs +10 -2
- package/GridContainer/index.mjs.map +1 -1
- package/GridItem/index.js +12 -2
- package/GridItem/index.js.map +1 -1
- package/GridItem/index.mjs +10 -2
- package/GridItem/index.mjs.map +1 -1
- package/IconButton/index.js +15 -3
- package/IconButton/index.js.map +1 -1
- package/IconButton/index.mjs +12 -2
- package/IconButton/index.mjs.map +1 -1
- package/Image/index.js +13 -2
- package/Image/index.js.map +1 -1
- package/Image/index.mjs +11 -2
- package/Image/index.mjs.map +1 -1
- package/Input/index.js +15 -3
- package/Input/index.js.map +1 -1
- package/Input/index.mjs +12 -2
- package/Input/index.mjs.map +1 -1
- package/Label/index.js +12 -2
- package/Label/index.js.map +1 -1
- package/Label/index.mjs +10 -2
- package/Label/index.mjs.map +1 -1
- package/Layer/index.js +17 -4
- package/Layer/index.js.map +1 -1
- package/Layer/index.mjs +13 -2
- package/Layer/index.mjs.map +1 -1
- package/LineProgress/index.js +13 -2
- package/LineProgress/index.js.map +1 -1
- package/LineProgress/index.mjs +11 -2
- package/LineProgress/index.mjs.map +1 -1
- package/List/index.js +12 -2
- package/List/index.js.map +1 -1
- package/List/index.mjs +10 -2
- package/List/index.mjs.map +1 -1
- package/ListItem/index.js +14 -3
- package/ListItem/index.js.map +1 -1
- package/ListItem/index.mjs +11 -2
- package/ListItem/index.mjs.map +1 -1
- package/LoadingBox/index.js +14 -3
- package/LoadingBox/index.js.map +1 -1
- package/LoadingBox/index.mjs +11 -2
- package/LoadingBox/index.mjs.map +1 -1
- package/Menu/index.js +16 -3
- package/Menu/index.js.map +1 -1
- package/Menu/index.mjs +13 -2
- package/Menu/index.mjs.map +1 -1
- package/Modal/index.js +15 -3
- package/Modal/index.js.map +1 -1
- package/Modal/index.mjs +12 -2
- package/Modal/index.mjs.map +1 -1
- package/NoSSR/index.js +10 -2
- package/NoSSR/index.js.map +1 -1
- package/NoSSR/index.mjs +8 -2
- package/NoSSR/index.mjs.map +1 -1
- package/Option/index.js +13 -3
- package/Option/index.js.map +1 -1
- package/Option/index.mjs +10 -2
- package/Option/index.mjs.map +1 -1
- package/Paper/index.js +12 -2
- package/Paper/index.js.map +1 -1
- package/Paper/index.mjs +10 -2
- package/Paper/index.mjs.map +1 -1
- package/Portal/index.js +13 -2
- package/Portal/index.js.map +1 -1
- package/Portal/index.mjs +11 -2
- package/Portal/index.mjs.map +1 -1
- package/Radio/index.js +15 -3
- package/Radio/index.js.map +1 -1
- package/Radio/index.mjs +12 -2
- package/Radio/index.mjs.map +1 -1
- package/Scrollbar/index.js +13 -2
- package/Scrollbar/index.js.map +1 -1
- package/Scrollbar/index.mjs +11 -2
- package/Scrollbar/index.mjs.map +1 -1
- package/Select/index.js +22 -5
- package/Select/index.js.map +1 -1
- package/Select/index.mjs +17 -2
- package/Select/index.mjs.map +1 -1
- package/Stack/index.js +12 -2
- package/Stack/index.js.map +1 -1
- package/Stack/index.mjs +10 -2
- package/Stack/index.mjs.map +1 -1
- package/Switch/index.js +13 -2
- package/Switch/index.js.map +1 -1
- package/Switch/index.mjs +11 -2
- package/Switch/index.mjs.map +1 -1
- package/Tab/index.js +15 -3
- package/Tab/index.js.map +1 -1
- package/Tab/index.mjs +12 -2
- package/Tab/index.mjs.map +1 -1
- package/Table/index.js +14 -3
- package/Table/index.js.map +1 -1
- package/Table/index.mjs +11 -2
- package/Table/index.mjs.map +1 -1
- package/TableBody/index.js +12 -2
- package/TableBody/index.js.map +1 -1
- package/TableBody/index.mjs +10 -2
- package/TableBody/index.mjs.map +1 -1
- package/TableCell/index.js +12 -2
- package/TableCell/index.js.map +1 -1
- package/TableCell/index.mjs +10 -2
- package/TableCell/index.mjs.map +1 -1
- package/TableFooter/index.js +12 -2
- package/TableFooter/index.js.map +1 -1
- package/TableFooter/index.mjs +10 -2
- package/TableFooter/index.mjs.map +1 -1
- package/TableHead/index.js +12 -2
- package/TableHead/index.js.map +1 -1
- package/TableHead/index.mjs +10 -2
- package/TableHead/index.mjs.map +1 -1
- package/TablePagination/index.js +23 -6
- package/TablePagination/index.js.map +1 -1
- package/TablePagination/index.mjs +17 -2
- package/TablePagination/index.mjs.map +1 -1
- package/TableRow/index.js +12 -2
- package/TableRow/index.js.map +1 -1
- package/TableRow/index.mjs +10 -2
- package/TableRow/index.mjs.map +1 -1
- package/Tabs/index.js +13 -2
- package/Tabs/index.js.map +1 -1
- package/Tabs/index.mjs +11 -2
- package/Tabs/index.mjs.map +1 -1
- package/Text/index.js +12 -2
- package/Text/index.js.map +1 -1
- package/Text/index.mjs +10 -2
- package/Text/index.mjs.map +1 -1
- package/Toast/index.js +18 -4
- package/Toast/index.js.map +1 -1
- package/Toast/index.mjs +14 -2
- package/Toast/index.mjs.map +1 -1
- package/Tooltip/index.js +14 -3
- package/Tooltip/index.js.map +1 -1
- package/Tooltip/index.mjs +11 -2
- package/Tooltip/index.mjs.map +1 -1
- package/ViewBox/index.js +14 -3
- package/ViewBox/index.js.map +1 -1
- package/ViewBox/index.mjs +11 -2
- package/ViewBox/index.mjs.map +1 -1
- package/index.js +116 -1
- package/index.js.map +1 -1
- package/index.mjs +56 -1
- package/index.mjs.map +1 -1
- package/package.json +3 -12
- package/useAlert/index.js +19 -5
- package/useAlert/index.js.map +1 -1
- package/useAlert/index.mjs +14 -2
- package/useAlert/index.mjs.map +1 -1
- package/useBlurCss/index.js +10 -2
- package/useBlurCss/index.js.map +1 -1
- package/useBlurCss/index.mjs +8 -2
- package/useBlurCss/index.mjs.map +1 -1
- package/useCorner/index.js +7 -2
- package/useCorner/index.js.map +1 -1
- package/useCorner/index.mjs +4 -1
- package/useCorner/index.mjs.map +1 -1
- package/useLayer/index.js +14 -3
- package/useLayer/index.js.map +1 -1
- package/useLayer/index.mjs +11 -2
- package/useLayer/index.mjs.map +1 -1
- package/useModal/index.js +14 -3
- package/useModal/index.js.map +1 -1
- package/useModal/index.mjs +11 -2
- package/useModal/index.mjs.map +1 -1
package/Accordion/index.js
CHANGED
|
@@ -1,4 +1,16 @@
|
|
|
1
|
-
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var tslib = require('tslib');
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var core = require('@xanui/core');
|
|
8
|
+
var ExpandIcon = require('@xanui/icons/ExpandMore');
|
|
9
|
+
var index$2 = require('../Collaps/index.js');
|
|
10
|
+
var index = require('../List/index.js');
|
|
11
|
+
var index$1 = require('../ListItem/index.js');
|
|
12
|
+
|
|
13
|
+
const Accordion = React.forwardRef((_a, ref) => {
|
|
2
14
|
var { children, title, subtitle } = _a, rest = tslib.__rest(_a, ["children", "title", "subtitle"]);
|
|
3
15
|
const [_expand, setExpand] = React.useState(false);
|
|
4
16
|
let [_b] = core.useInterface("Accordion", rest, {
|
|
@@ -72,10 +84,13 @@
|
|
|
72
84
|
}
|
|
73
85
|
return (jsxRuntime.jsx(core.Tag, Object.assign({}, rootProps, { sxr: {
|
|
74
86
|
bgcolor: "background.primary"
|
|
75
|
-
}, baseClass: 'accordion', classNames: [{ "accordion-expanded": expand }, ...(classNames || [])], ref: ref, children: jsxRuntime.jsxs(index
|
|
87
|
+
}, baseClass: 'accordion', classNames: [{ "accordion-expanded": expand }, ...(classNames || [])], ref: ref, children: jsxRuntime.jsxs(index, Object.assign({ component: 'div' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.header, { color: color, variant: variant, hoverColor: hoverColor, hoverVariant: hoverVariant, className: 'accoutdion-header', children: [jsxRuntime.jsx(index$1, Object.assign({ minHeight: 55, radius: 0, component: 'div' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.headerContent, itemsx, { subtitle: subtitle, selected: expand, onClick: () => onClick && onClick(), className: "accordion-header-content", children: title })), jsxRuntime.jsx(index$2, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.collaps, { open: expand, className: "accordion-collaps", children: jsxRuntime.jsx(core.Tag, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: {
|
|
76
88
|
color: "text.primary",
|
|
77
89
|
p: 2,
|
|
78
90
|
py: 1,
|
|
79
91
|
bgcolor: "background.primary"
|
|
80
92
|
}, baseClass: 'accordion-content', children: children })) }))] })) })));
|
|
81
|
-
});
|
|
93
|
+
});
|
|
94
|
+
|
|
95
|
+
module.exports = Accordion;
|
|
96
|
+
//# sourceMappingURL=index.js.map
|
package/Accordion/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps, { CollapsProps } from '../Collaps';\nimport List, { ListProps } from '../List';\nimport ListItem, { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"in\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"brand\",\n variant: \"soft\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"text.primary\",\n p: 2,\n py: 1,\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":["__rest","useState","useInterface","useBreakpointProps","_jsx","Tag","_jsxs","List","ListItem","Collaps"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps, { CollapsProps } from '../Collaps';\nimport List, { ListProps } from '../List';\nimport ListItem, { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"in\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"brand\",\n variant: \"soft\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"text.primary\",\n p: 2,\n py: 1,\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;AAgCA;;;AAEI;;AAiBI;AACA;AACH;;AAGD;AAAW;AACX;AAAc;AACd;AAAe;AACf;AAAa;AACb;AAAgB;AAChB;AAAyB;AACzB;AAAkB;AAClB;AAAW;AACX;AAAa;AACb;AAAgB;AAChB;AAAkB;AAElB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAqBA;AACI;;AAIY;AACA;AACA;AACA;;;;;;AAUZ;;AAIY;AACA;AACA;AACA;;;;;AAUhB;AACI;AACA;;AAGJ;AAIY;AACH;AAiCe;AACA;AACA;AACA;;AAU5B;;"}
|
package/Accordion/index.mjs
CHANGED
|
@@ -1,4 +1,14 @@
|
|
|
1
|
-
|
|
1
|
+
"use client";
|
|
2
|
+
import { __rest } from 'tslib';
|
|
3
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
|
+
import React, { useState } from 'react';
|
|
5
|
+
import { useInterface, useBreakpointProps, Tag } from '@xanui/core';
|
|
6
|
+
import ExpandIcon from '@xanui/icons/ExpandMore';
|
|
7
|
+
import Collaps from '../Collaps/index.mjs';
|
|
8
|
+
import List from '../List/index.mjs';
|
|
9
|
+
import ListItem from '../ListItem/index.mjs';
|
|
10
|
+
|
|
11
|
+
const Accordion = React.forwardRef((_a, ref) => {
|
|
2
12
|
var { children, title, subtitle } = _a, rest = __rest(_a, ["children", "title", "subtitle"]);
|
|
3
13
|
const [_expand, setExpand] = useState(false);
|
|
4
14
|
let [_b] = useInterface("Accordion", rest, {
|
|
@@ -78,4 +88,7 @@ import {__rest}from'tslib';import {jsx,jsxs}from'react/jsx-runtime';import React
|
|
|
78
88
|
py: 1,
|
|
79
89
|
bgcolor: "background.primary"
|
|
80
90
|
}, baseClass: 'accordion-content', children: children })) }))] })) })));
|
|
81
|
-
});
|
|
91
|
+
});
|
|
92
|
+
|
|
93
|
+
export { Accordion as default };
|
|
94
|
+
//# sourceMappingURL=index.mjs.map
|
package/Accordion/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps, { CollapsProps } from '../Collaps';\nimport List, { ListProps } from '../List';\nimport ListItem, { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"in\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"brand\",\n variant: \"soft\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"text.primary\",\n p: 2,\n py: 1,\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps, { CollapsProps } from '../Collaps';\nimport List, { ListProps } from '../List';\nimport ListItem, { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"in\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"brand\",\n variant: \"soft\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"text.primary\",\n p: 2,\n py: 1,\n bgcolor: \"background.primary\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":[],"mappings":";;;;;;;;;;AAgCA;;;AAEI;;AAiBI;AACA;AACH;;AAGD;AAAW;AACX;AAAc;AACd;AAAe;AACf;AAAa;AACb;AAAgB;AAChB;AAAyB;AACzB;AAAkB;AAClB;AAAW;AACX;AAAa;AACb;AAAgB;AAChB;AAAkB;AAElB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAqBA;AACI;;AAIY;AACA;AACA;AACA;;;;;;AAUZ;;AAIY;AACA;AACA;AACA;;;;;AAUhB;AACI;AACA;;AAGJ;AAIY;AACH;AAiCe;AACA;AACA;AACA;;AAU5B;;"}
|
package/Alert/index.js
CHANGED
|
@@ -1,4 +1,20 @@
|
|
|
1
|
-
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var tslib = require('tslib');
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var core = require('@xanui/core');
|
|
7
|
+
var React = require('react');
|
|
8
|
+
var index$1 = require('../Text/index.js');
|
|
9
|
+
var InfoIcon = require('@xanui/icons/Info');
|
|
10
|
+
var WarningIcon = require('@xanui/icons/Warning');
|
|
11
|
+
var SuccessIcon = require('@xanui/icons/CheckCircle');
|
|
12
|
+
var ErrorIcon = require('@xanui/icons/Cancel');
|
|
13
|
+
var IconClose = require('@xanui/icons/Close');
|
|
14
|
+
var index = require('../IconButton/index.js');
|
|
15
|
+
var index$2 = require('../useAlert/index.js');
|
|
16
|
+
|
|
17
|
+
const Alert = (_a) => {
|
|
2
18
|
var { children } = _a, rest = tslib.__rest(_a, ["children"]);
|
|
3
19
|
let [_b] = core.useInterface("Alert", rest, {
|
|
4
20
|
variant: "fill"
|
|
@@ -35,7 +51,7 @@
|
|
|
35
51
|
"danger": jsxRuntime.jsx(ErrorIcon, { sx: iconsx })
|
|
36
52
|
};
|
|
37
53
|
let _icon = icons[icon] || icons[color];
|
|
38
|
-
return (jsxRuntime.jsxs(core.Tag, Object.assign({}, _props, { baseClass: "alert", sxr: Object.assign({ justifyContent: "flex-start", position: "relative", radius: 1, px: isRow ? (_icon ? .5 : 2) : 3, py: isRow ? .5 : 3, flexDirection: "column", display: 'flex' }, _props === null || _props === void 0 ? void 0 : _props.sx) }, template.primary, { children: [onClose && jsxRuntime.jsx(index
|
|
54
|
+
return (jsxRuntime.jsxs(core.Tag, Object.assign({}, _props, { baseClass: "alert", sxr: Object.assign({ justifyContent: "flex-start", position: "relative", radius: 1, px: isRow ? (_icon ? .5 : 2) : 3, py: isRow ? .5 : 3, flexDirection: "column", display: 'flex' }, _props === null || _props === void 0 ? void 0 : _props.sx) }, template.primary, { children: [onClose && jsxRuntime.jsx(index, { color: color, variant: variant === 'fill' ? "fill" : "text", size: 25, sx: {
|
|
39
55
|
position: "absolute",
|
|
40
56
|
top: 5,
|
|
41
57
|
right: 5
|
|
@@ -60,7 +76,7 @@
|
|
|
60
76
|
py: 1,
|
|
61
77
|
textAlign: isRow ? "left" : "center",
|
|
62
78
|
gap: isRow ? 0 : 1
|
|
63
|
-
}, children: [title && jsxRuntime.jsx(jsxRuntime.Fragment, { children: React.isValidElement(title) ? jsxRuntime.jsx(core.Tag, { className: "alert-title", children: title }) : jsxRuntime.jsx(index$1
|
|
79
|
+
}, children: [title && jsxRuntime.jsx(jsxRuntime.Fragment, { children: React.isValidElement(title) ? jsxRuntime.jsx(core.Tag, { className: "alert-title", children: title }) : jsxRuntime.jsx(index$1, { className: "alert-title", variant: "text", sx: {
|
|
64
80
|
font: "text",
|
|
65
81
|
fontWeight: "bold!important",
|
|
66
82
|
color: template.primary.color
|
|
@@ -71,7 +87,7 @@
|
|
|
71
87
|
const ActionAlert = (props) => {
|
|
72
88
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
73
89
|
const ref = React.useRef(null);
|
|
74
|
-
const alert = index$2
|
|
90
|
+
const alert = index$2(Object.assign(Object.assign({}, props), { slotProps: Object.assign(Object.assign({}, props.slotProps), { modal: Object.assign(Object.assign({}, (_a = props.slotProps) === null || _a === void 0 ? void 0 : _a.modal), { slotProps: Object.assign(Object.assign({}, (_c = (_b = props.slotProps) === null || _b === void 0 ? void 0 : _b.modal) === null || _c === void 0 ? void 0 : _c.slotProps), { layer: Object.assign(Object.assign({}, (_f = (_e = (_d = props.slotProps) === null || _d === void 0 ? void 0 : _d.modal) === null || _e === void 0 ? void 0 : _e.slotProps) === null || _f === void 0 ? void 0 : _f.layer), { portal: Object.assign(Object.assign({}, (_k = (_j = (_h = (_g = props.slotProps) === null || _g === void 0 ? void 0 : _g.modal) === null || _h === void 0 ? void 0 : _h.slotProps) === null || _j === void 0 ? void 0 : _j.layer) === null || _k === void 0 ? void 0 : _k.portal), { container: ref.current || undefined }) }) }) }) }) }));
|
|
75
91
|
React.useEffect(() => {
|
|
76
92
|
if (props.open) {
|
|
77
93
|
alert.open();
|
|
@@ -99,4 +115,7 @@ Alert.confirm = (props) => {
|
|
|
99
115
|
a.updateProps({ open: false });
|
|
100
116
|
},
|
|
101
117
|
};
|
|
102
|
-
};
|
|
118
|
+
};
|
|
119
|
+
|
|
120
|
+
module.exports = Alert;
|
|
121
|
+
//# sourceMappingURL=index.js.map
|
package/Alert/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Alert/index.tsx"],"sourcesContent":["\"use client\";\nimport { Tag, TagProps, useBreakpointProps, useColorTemplate, useInterface, useBreakpointPropsType, Renderar, UseColorTemplateType, UseColorTemplateColor } from \"@xanui/core\"\nimport React, { isValidElement, ReactElement, useEffect, useRef } from \"react\"\nimport Text from \"../Text\"\nimport InfoIcon from '@xanui/icons/Info';\nimport WarningIcon from '@xanui/icons/Warning';\nimport SuccessIcon from '@xanui/icons/CheckCircle';\nimport ErrorIcon from '@xanui/icons/Cancel';\nimport IconClose from '@xanui/icons/Close';\nimport IconButton from \"../IconButton\";\nimport useAlert, { UseAlerProps } from \"../useAlert\";\n\n\nexport type AlertProps = Omit<TagProps<\"div\">, \"content\" | \"title\" | \"direction\"> & {\n title?: useBreakpointPropsType<string | ReactElement>;\n direction?: useBreakpointPropsType<\"row\" | \"column\">;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n icon?: useBreakpointPropsType<\"info\" | \"warning\" | \"success\" | \"error\" | false | ReactElement>;\n onClose?: React.DOMAttributes<\"button\">['onClick'];\n}\n\nexport type AlertMesssageType = string | ReactElement | AlertProps\n\nconst Alert = ({ children, ...rest }: AlertProps) => {\n let [{\n title,\n variant,\n icon,\n color,\n direction,\n slotProps,\n onClose,\n ..._props\n }] = useInterface<any>(\"Alert\", rest, {\n variant: \"fill\"\n })\n color ??= \"default\"\n direction ??= \"row\"\n\n const _p: any = {}\n if (title) _p.title = title\n if (variant) _p.variant = variant\n if (icon) _p.icon = icon\n if (color) _p.color = color\n if (direction) _p.direction = direction\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n variant = p.variant\n icon = p.icon\n color = p.color\n direction = p.direction\n\n let isRow = direction === 'row'\n\n\n const template = useColorTemplate(color, variant)\n\n let iconsx = {\n fontSize: isRow ? 22 : 40,\n color: color === 'default' ? \"text.primary\" : template.primary.color\n }\n\n const icons: any = {\n \"info\": <InfoIcon sx={iconsx} />,\n \"warning\": <WarningIcon sx={iconsx} />,\n \"success\": <SuccessIcon sx={iconsx} />,\n \"danger\": <ErrorIcon sx={iconsx} />\n }\n\n let _icon = icons[icon] || icons[color]\n\n return (\n <Tag\n {..._props}\n baseClass=\"alert\"\n sxr={{\n justifyContent: \"flex-start\",\n position: \"relative\",\n radius: 1,\n px: isRow ? (_icon ? .5 : 2) : 3,\n py: isRow ? .5 : 3,\n flexDirection: \"column\",\n display: 'flex',\n ..._props?.sx\n }}\n {...template.primary}\n >\n {\n onClose && <IconButton\n color={color}\n variant={variant === 'fill' ? \"fill\" : \"text\"}\n size={25}\n sx={{\n position: \"absolute\",\n top: 5,\n right: 5\n }}\n onClick={onClose}\n className=\"alert-close-button\"\n >\n <IconClose fontSize={18} />\n </IconButton>\n }\n <Tag\n sx={{\n display: \"flex\",\n gap: 1,\n flexDirection: direction,\n alignItems: isRow ? \"flex-start\" : \"center\"\n }}\n baseClass=\"alert-container\"\n >\n {\n _icon && <Tag\n baseClass=\"alert-icon\"\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n p: isRow ? 1 : 0,\n \"& svg\": {\n color: template.primary.color\n }\n }}\n >\n {_icon}\n </Tag>\n }\n <Tag\n baseClass=\"alert-content\"\n sxr={{\n display: \"flex\",\n flexDirection: \"column\",\n flex: 1,\n color: template.primary.color,\n py: 1,\n textAlign: isRow ? \"left\" : \"center\",\n gap: isRow ? 0 : 1\n }}\n >\n {title && <>\n {\n isValidElement(title) ? <Tag className=\"alert-title\">{title}</Tag> : <Text\n className=\"alert-title\"\n variant=\"text\"\n sx={{\n font: \"text\",\n fontWeight: \"bold!important\",\n color: template.primary.color\n }}\n >{title}</Text>\n }\n </>}\n <Tag\n sxr={{\n font: \"button\",\n }}\n >\n {children}\n </Tag>\n </Tag>\n </Tag>\n </Tag>\n )\n}\n\nconst ActionAlert = (props: UseAlerProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const alert = useAlert({\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n slotProps: {\n ...props.slotProps?.modal?.slotProps,\n layer: {\n ...props.slotProps?.modal?.slotProps?.layer,\n portal: {\n ...props.slotProps?.modal?.slotProps?.layer?.portal,\n container: ref.current || undefined\n }\n }\n }\n }\n }\n })\n\n useEffect(() => {\n if (props.open) {\n alert.open()\n } else {\n alert.close()\n }\n }, [props.open])\n return <Tag ref={ref}></Tag>\n}\n\nAlert.confirm = (props: UseAlerProps) => {\n const a = Renderar.render(ActionAlert as any, {\n open: true,\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n onClosed: () => {\n a.unrender()\n if (props?.slotProps?.modal?.onClosed) {\n props.slotProps?.modal?.onClosed()\n }\n },\n }\n },\n })\n\n return {\n open: () => {\n a.updateProps({ open: true })\n },\n close: () => {\n a.updateProps({ open: false })\n },\n }\n}\n\nexport default Alert"],"names":["__rest","useInterface","useBreakpointProps","useColorTemplate","_jsx","_jsxs","Tag","IconButton","_Fragment","isValidElement","Text","useRef","useAlert","useEffect","Renderar"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Alert/index.tsx"],"sourcesContent":["\"use client\";\nimport { Tag, TagProps, useBreakpointProps, useColorTemplate, useInterface, useBreakpointPropsType, Renderar, UseColorTemplateType, UseColorTemplateColor } from \"@xanui/core\"\nimport React, { isValidElement, ReactElement, useEffect, useRef } from \"react\"\nimport Text from \"../Text\"\nimport InfoIcon from '@xanui/icons/Info';\nimport WarningIcon from '@xanui/icons/Warning';\nimport SuccessIcon from '@xanui/icons/CheckCircle';\nimport ErrorIcon from '@xanui/icons/Cancel';\nimport IconClose from '@xanui/icons/Close';\nimport IconButton from \"../IconButton\";\nimport useAlert, { UseAlerProps } from \"../useAlert\";\n\n\nexport type AlertProps = Omit<TagProps<\"div\">, \"content\" | \"title\" | \"direction\"> & {\n title?: useBreakpointPropsType<string | ReactElement>;\n direction?: useBreakpointPropsType<\"row\" | \"column\">;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n icon?: useBreakpointPropsType<\"info\" | \"warning\" | \"success\" | \"error\" | false | ReactElement>;\n onClose?: React.DOMAttributes<\"button\">['onClick'];\n}\n\nexport type AlertMesssageType = string | ReactElement | AlertProps\n\nconst Alert = ({ children, ...rest }: AlertProps) => {\n let [{\n title,\n variant,\n icon,\n color,\n direction,\n slotProps,\n onClose,\n ..._props\n }] = useInterface<any>(\"Alert\", rest, {\n variant: \"fill\"\n })\n color ??= \"default\"\n direction ??= \"row\"\n\n const _p: any = {}\n if (title) _p.title = title\n if (variant) _p.variant = variant\n if (icon) _p.icon = icon\n if (color) _p.color = color\n if (direction) _p.direction = direction\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n variant = p.variant\n icon = p.icon\n color = p.color\n direction = p.direction\n\n let isRow = direction === 'row'\n\n\n const template = useColorTemplate(color, variant)\n\n let iconsx = {\n fontSize: isRow ? 22 : 40,\n color: color === 'default' ? \"text.primary\" : template.primary.color\n }\n\n const icons: any = {\n \"info\": <InfoIcon sx={iconsx} />,\n \"warning\": <WarningIcon sx={iconsx} />,\n \"success\": <SuccessIcon sx={iconsx} />,\n \"danger\": <ErrorIcon sx={iconsx} />\n }\n\n let _icon = icons[icon] || icons[color]\n\n return (\n <Tag\n {..._props}\n baseClass=\"alert\"\n sxr={{\n justifyContent: \"flex-start\",\n position: \"relative\",\n radius: 1,\n px: isRow ? (_icon ? .5 : 2) : 3,\n py: isRow ? .5 : 3,\n flexDirection: \"column\",\n display: 'flex',\n ..._props?.sx\n }}\n {...template.primary}\n >\n {\n onClose && <IconButton\n color={color}\n variant={variant === 'fill' ? \"fill\" : \"text\"}\n size={25}\n sx={{\n position: \"absolute\",\n top: 5,\n right: 5\n }}\n onClick={onClose}\n className=\"alert-close-button\"\n >\n <IconClose fontSize={18} />\n </IconButton>\n }\n <Tag\n sx={{\n display: \"flex\",\n gap: 1,\n flexDirection: direction,\n alignItems: isRow ? \"flex-start\" : \"center\"\n }}\n baseClass=\"alert-container\"\n >\n {\n _icon && <Tag\n baseClass=\"alert-icon\"\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n p: isRow ? 1 : 0,\n \"& svg\": {\n color: template.primary.color\n }\n }}\n >\n {_icon}\n </Tag>\n }\n <Tag\n baseClass=\"alert-content\"\n sxr={{\n display: \"flex\",\n flexDirection: \"column\",\n flex: 1,\n color: template.primary.color,\n py: 1,\n textAlign: isRow ? \"left\" : \"center\",\n gap: isRow ? 0 : 1\n }}\n >\n {title && <>\n {\n isValidElement(title) ? <Tag className=\"alert-title\">{title}</Tag> : <Text\n className=\"alert-title\"\n variant=\"text\"\n sx={{\n font: \"text\",\n fontWeight: \"bold!important\",\n color: template.primary.color\n }}\n >{title}</Text>\n }\n </>}\n <Tag\n sxr={{\n font: \"button\",\n }}\n >\n {children}\n </Tag>\n </Tag>\n </Tag>\n </Tag>\n )\n}\n\nconst ActionAlert = (props: UseAlerProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const alert = useAlert({\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n slotProps: {\n ...props.slotProps?.modal?.slotProps,\n layer: {\n ...props.slotProps?.modal?.slotProps?.layer,\n portal: {\n ...props.slotProps?.modal?.slotProps?.layer?.portal,\n container: ref.current || undefined\n }\n }\n }\n }\n }\n })\n\n useEffect(() => {\n if (props.open) {\n alert.open()\n } else {\n alert.close()\n }\n }, [props.open])\n return <Tag ref={ref}></Tag>\n}\n\nAlert.confirm = (props: UseAlerProps) => {\n const a = Renderar.render(ActionAlert as any, {\n open: true,\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n onClosed: () => {\n a.unrender()\n if (props?.slotProps?.modal?.onClosed) {\n props.slotProps?.modal?.onClosed()\n }\n },\n }\n },\n })\n\n return {\n open: () => {\n a.updateProps({ open: true })\n },\n close: () => {\n a.updateProps({ open: false })\n },\n }\n}\n\nexport default Alert"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAwBA;AAAe;AACX;AAUI;;;;;AAMJ;AAAW;AACX;AAAa;AACb;AAAU;AACV;AAAW;AACX;AAAe;AAEf;AAEA;AACA;AACA;AACA;AACA;AAEA;;AAKA;;AAEI;;AAGJ;AACI;AACA;AACA;AACA;;;;AA2BgB;AACA;AACA;;AAUJ;AACA;AACA;;AAEH;AAOW;AACA;AACA;;AAEA;AACI;AACH;;AASL;AACA;AACA;AACA;AACA;;;AAGH;AAQe;AACA;AACA;;AAOR;AACH;AAQzB;AAEA;;AACI;AACA;;AAqBI;;;;;;AAKJ;AACA;AACJ;AAEA;;AACI;;;AASgB;;;AAGJ;;;;;;;;;AAahB;;"}
|
package/Alert/index.mjs
CHANGED
|
@@ -1,4 +1,18 @@
|
|
|
1
|
-
|
|
1
|
+
"use client";
|
|
2
|
+
import { __rest } from 'tslib';
|
|
3
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
4
|
+
import { useInterface, useBreakpointProps, useColorTemplate, Tag, Renderar } from '@xanui/core';
|
|
5
|
+
import { isValidElement, useRef, useEffect } from 'react';
|
|
6
|
+
import Text from '../Text/index.mjs';
|
|
7
|
+
import InfoIcon from '@xanui/icons/Info';
|
|
8
|
+
import WarningIcon from '@xanui/icons/Warning';
|
|
9
|
+
import SuccessIcon from '@xanui/icons/CheckCircle';
|
|
10
|
+
import ErrorIcon from '@xanui/icons/Cancel';
|
|
11
|
+
import IconClose from '@xanui/icons/Close';
|
|
12
|
+
import IconButton from '../IconButton/index.mjs';
|
|
13
|
+
import useAlert from '../useAlert/index.mjs';
|
|
14
|
+
|
|
15
|
+
const Alert = (_a) => {
|
|
2
16
|
var { children } = _a, rest = __rest(_a, ["children"]);
|
|
3
17
|
let [_b] = useInterface("Alert", rest, {
|
|
4
18
|
variant: "fill"
|
|
@@ -99,4 +113,7 @@ Alert.confirm = (props) => {
|
|
|
99
113
|
a.updateProps({ open: false });
|
|
100
114
|
},
|
|
101
115
|
};
|
|
102
|
-
};
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
export { Alert as default };
|
|
119
|
+
//# sourceMappingURL=index.mjs.map
|
package/Alert/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Alert/index.tsx"],"sourcesContent":["\"use client\";\nimport { Tag, TagProps, useBreakpointProps, useColorTemplate, useInterface, useBreakpointPropsType, Renderar, UseColorTemplateType, UseColorTemplateColor } from \"@xanui/core\"\nimport React, { isValidElement, ReactElement, useEffect, useRef } from \"react\"\nimport Text from \"../Text\"\nimport InfoIcon from '@xanui/icons/Info';\nimport WarningIcon from '@xanui/icons/Warning';\nimport SuccessIcon from '@xanui/icons/CheckCircle';\nimport ErrorIcon from '@xanui/icons/Cancel';\nimport IconClose from '@xanui/icons/Close';\nimport IconButton from \"../IconButton\";\nimport useAlert, { UseAlerProps } from \"../useAlert\";\n\n\nexport type AlertProps = Omit<TagProps<\"div\">, \"content\" | \"title\" | \"direction\"> & {\n title?: useBreakpointPropsType<string | ReactElement>;\n direction?: useBreakpointPropsType<\"row\" | \"column\">;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n icon?: useBreakpointPropsType<\"info\" | \"warning\" | \"success\" | \"error\" | false | ReactElement>;\n onClose?: React.DOMAttributes<\"button\">['onClick'];\n}\n\nexport type AlertMesssageType = string | ReactElement | AlertProps\n\nconst Alert = ({ children, ...rest }: AlertProps) => {\n let [{\n title,\n variant,\n icon,\n color,\n direction,\n slotProps,\n onClose,\n ..._props\n }] = useInterface<any>(\"Alert\", rest, {\n variant: \"fill\"\n })\n color ??= \"default\"\n direction ??= \"row\"\n\n const _p: any = {}\n if (title) _p.title = title\n if (variant) _p.variant = variant\n if (icon) _p.icon = icon\n if (color) _p.color = color\n if (direction) _p.direction = direction\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n variant = p.variant\n icon = p.icon\n color = p.color\n direction = p.direction\n\n let isRow = direction === 'row'\n\n\n const template = useColorTemplate(color, variant)\n\n let iconsx = {\n fontSize: isRow ? 22 : 40,\n color: color === 'default' ? \"text.primary\" : template.primary.color\n }\n\n const icons: any = {\n \"info\": <InfoIcon sx={iconsx} />,\n \"warning\": <WarningIcon sx={iconsx} />,\n \"success\": <SuccessIcon sx={iconsx} />,\n \"danger\": <ErrorIcon sx={iconsx} />\n }\n\n let _icon = icons[icon] || icons[color]\n\n return (\n <Tag\n {..._props}\n baseClass=\"alert\"\n sxr={{\n justifyContent: \"flex-start\",\n position: \"relative\",\n radius: 1,\n px: isRow ? (_icon ? .5 : 2) : 3,\n py: isRow ? .5 : 3,\n flexDirection: \"column\",\n display: 'flex',\n ..._props?.sx\n }}\n {...template.primary}\n >\n {\n onClose && <IconButton\n color={color}\n variant={variant === 'fill' ? \"fill\" : \"text\"}\n size={25}\n sx={{\n position: \"absolute\",\n top: 5,\n right: 5\n }}\n onClick={onClose}\n className=\"alert-close-button\"\n >\n <IconClose fontSize={18} />\n </IconButton>\n }\n <Tag\n sx={{\n display: \"flex\",\n gap: 1,\n flexDirection: direction,\n alignItems: isRow ? \"flex-start\" : \"center\"\n }}\n baseClass=\"alert-container\"\n >\n {\n _icon && <Tag\n baseClass=\"alert-icon\"\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n p: isRow ? 1 : 0,\n \"& svg\": {\n color: template.primary.color\n }\n }}\n >\n {_icon}\n </Tag>\n }\n <Tag\n baseClass=\"alert-content\"\n sxr={{\n display: \"flex\",\n flexDirection: \"column\",\n flex: 1,\n color: template.primary.color,\n py: 1,\n textAlign: isRow ? \"left\" : \"center\",\n gap: isRow ? 0 : 1\n }}\n >\n {title && <>\n {\n isValidElement(title) ? <Tag className=\"alert-title\">{title}</Tag> : <Text\n className=\"alert-title\"\n variant=\"text\"\n sx={{\n font: \"text\",\n fontWeight: \"bold!important\",\n color: template.primary.color\n }}\n >{title}</Text>\n }\n </>}\n <Tag\n sxr={{\n font: \"button\",\n }}\n >\n {children}\n </Tag>\n </Tag>\n </Tag>\n </Tag>\n )\n}\n\nconst ActionAlert = (props: UseAlerProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const alert = useAlert({\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n slotProps: {\n ...props.slotProps?.modal?.slotProps,\n layer: {\n ...props.slotProps?.modal?.slotProps?.layer,\n portal: {\n ...props.slotProps?.modal?.slotProps?.layer?.portal,\n container: ref.current || undefined\n }\n }\n }\n }\n }\n })\n\n useEffect(() => {\n if (props.open) {\n alert.open()\n } else {\n alert.close()\n }\n }, [props.open])\n return <Tag ref={ref}></Tag>\n}\n\nAlert.confirm = (props: UseAlerProps) => {\n const a = Renderar.render(ActionAlert as any, {\n open: true,\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n onClosed: () => {\n a.unrender()\n if (props?.slotProps?.modal?.onClosed) {\n props.slotProps?.modal?.onClosed()\n }\n },\n }\n },\n })\n\n return {\n open: () => {\n a.updateProps({ open: true })\n },\n close: () => {\n a.updateProps({ open: false })\n },\n }\n}\n\nexport default Alert"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Alert/index.tsx"],"sourcesContent":["\"use client\";\nimport { Tag, TagProps, useBreakpointProps, useColorTemplate, useInterface, useBreakpointPropsType, Renderar, UseColorTemplateType, UseColorTemplateColor } from \"@xanui/core\"\nimport React, { isValidElement, ReactElement, useEffect, useRef } from \"react\"\nimport Text from \"../Text\"\nimport InfoIcon from '@xanui/icons/Info';\nimport WarningIcon from '@xanui/icons/Warning';\nimport SuccessIcon from '@xanui/icons/CheckCircle';\nimport ErrorIcon from '@xanui/icons/Cancel';\nimport IconClose from '@xanui/icons/Close';\nimport IconButton from \"../IconButton\";\nimport useAlert, { UseAlerProps } from \"../useAlert\";\n\n\nexport type AlertProps = Omit<TagProps<\"div\">, \"content\" | \"title\" | \"direction\"> & {\n title?: useBreakpointPropsType<string | ReactElement>;\n direction?: useBreakpointPropsType<\"row\" | \"column\">;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n icon?: useBreakpointPropsType<\"info\" | \"warning\" | \"success\" | \"error\" | false | ReactElement>;\n onClose?: React.DOMAttributes<\"button\">['onClick'];\n}\n\nexport type AlertMesssageType = string | ReactElement | AlertProps\n\nconst Alert = ({ children, ...rest }: AlertProps) => {\n let [{\n title,\n variant,\n icon,\n color,\n direction,\n slotProps,\n onClose,\n ..._props\n }] = useInterface<any>(\"Alert\", rest, {\n variant: \"fill\"\n })\n color ??= \"default\"\n direction ??= \"row\"\n\n const _p: any = {}\n if (title) _p.title = title\n if (variant) _p.variant = variant\n if (icon) _p.icon = icon\n if (color) _p.color = color\n if (direction) _p.direction = direction\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n variant = p.variant\n icon = p.icon\n color = p.color\n direction = p.direction\n\n let isRow = direction === 'row'\n\n\n const template = useColorTemplate(color, variant)\n\n let iconsx = {\n fontSize: isRow ? 22 : 40,\n color: color === 'default' ? \"text.primary\" : template.primary.color\n }\n\n const icons: any = {\n \"info\": <InfoIcon sx={iconsx} />,\n \"warning\": <WarningIcon sx={iconsx} />,\n \"success\": <SuccessIcon sx={iconsx} />,\n \"danger\": <ErrorIcon sx={iconsx} />\n }\n\n let _icon = icons[icon] || icons[color]\n\n return (\n <Tag\n {..._props}\n baseClass=\"alert\"\n sxr={{\n justifyContent: \"flex-start\",\n position: \"relative\",\n radius: 1,\n px: isRow ? (_icon ? .5 : 2) : 3,\n py: isRow ? .5 : 3,\n flexDirection: \"column\",\n display: 'flex',\n ..._props?.sx\n }}\n {...template.primary}\n >\n {\n onClose && <IconButton\n color={color}\n variant={variant === 'fill' ? \"fill\" : \"text\"}\n size={25}\n sx={{\n position: \"absolute\",\n top: 5,\n right: 5\n }}\n onClick={onClose}\n className=\"alert-close-button\"\n >\n <IconClose fontSize={18} />\n </IconButton>\n }\n <Tag\n sx={{\n display: \"flex\",\n gap: 1,\n flexDirection: direction,\n alignItems: isRow ? \"flex-start\" : \"center\"\n }}\n baseClass=\"alert-container\"\n >\n {\n _icon && <Tag\n baseClass=\"alert-icon\"\n sxr={{\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n p: isRow ? 1 : 0,\n \"& svg\": {\n color: template.primary.color\n }\n }}\n >\n {_icon}\n </Tag>\n }\n <Tag\n baseClass=\"alert-content\"\n sxr={{\n display: \"flex\",\n flexDirection: \"column\",\n flex: 1,\n color: template.primary.color,\n py: 1,\n textAlign: isRow ? \"left\" : \"center\",\n gap: isRow ? 0 : 1\n }}\n >\n {title && <>\n {\n isValidElement(title) ? <Tag className=\"alert-title\">{title}</Tag> : <Text\n className=\"alert-title\"\n variant=\"text\"\n sx={{\n font: \"text\",\n fontWeight: \"bold!important\",\n color: template.primary.color\n }}\n >{title}</Text>\n }\n </>}\n <Tag\n sxr={{\n font: \"button\",\n }}\n >\n {children}\n </Tag>\n </Tag>\n </Tag>\n </Tag>\n )\n}\n\nconst ActionAlert = (props: UseAlerProps) => {\n const ref = useRef<HTMLDivElement>(null);\n const alert = useAlert({\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n slotProps: {\n ...props.slotProps?.modal?.slotProps,\n layer: {\n ...props.slotProps?.modal?.slotProps?.layer,\n portal: {\n ...props.slotProps?.modal?.slotProps?.layer?.portal,\n container: ref.current || undefined\n }\n }\n }\n }\n }\n })\n\n useEffect(() => {\n if (props.open) {\n alert.open()\n } else {\n alert.close()\n }\n }, [props.open])\n return <Tag ref={ref}></Tag>\n}\n\nAlert.confirm = (props: UseAlerProps) => {\n const a = Renderar.render(ActionAlert as any, {\n open: true,\n ...props,\n slotProps: {\n ...props.slotProps,\n modal: {\n ...props.slotProps?.modal,\n onClosed: () => {\n a.unrender()\n if (props?.slotProps?.modal?.onClosed) {\n props.slotProps?.modal?.onClosed()\n }\n },\n }\n },\n })\n\n return {\n open: () => {\n a.updateProps({ open: true })\n },\n close: () => {\n a.updateProps({ open: false })\n },\n }\n}\n\nexport default Alert"],"names":[],"mappings":";;;;;;;;;;;;;;AAwBA;AAAe;AACX;AAUI;;;;;AAMJ;AAAW;AACX;AAAa;AACb;AAAU;AACV;AAAW;AACX;AAAe;AAEf;AAEA;AACA;AACA;AACA;AACA;AAEA;;AAKA;;AAEI;;AAGJ;AACI;AACA;AACA;AACA;;;;AA2BgB;AACA;AACA;;AAUJ;AACA;AACA;;AAEH;AAOW;AACA;AACA;;AAEA;AACI;AACH;;AASL;AACA;AACA;AACA;AACA;;;AAGH;AAQe;AACA;AACA;;AAOR;AACH;AAQzB;AAEA;;AACI;AACA;;AAqBI;;;;;;AAKJ;AACA;AACJ;AAEA;;AACI;;;AASgB;;;AAGJ;;;;;;;;;AAahB;;"}
|
package/Avatar/index.js
CHANGED
|
@@ -1,4 +1,12 @@
|
|
|
1
|
-
'use strict';
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var tslib = require('tslib');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var core = require('@xanui/core');
|
|
7
|
+
var PersonIcon = require('@xanui/icons/Person');
|
|
8
|
+
|
|
9
|
+
const Avatar = React.forwardRef((_a, ref) => {
|
|
2
10
|
var { children, src, alt } = _a, rest = tslib.__rest(_a, ["children", "src", "alt"]);
|
|
3
11
|
const [faild, setFaild] = React.useState();
|
|
4
12
|
let [_b] = core.useInterface("Avatar", rest, {}), { size } = _b, props = tslib.__rest(_b, ["size"]);
|
|
@@ -31,4 +39,7 @@
|
|
|
31
39
|
setFaild(false);
|
|
32
40
|
props.onError && props.onError(e);
|
|
33
41
|
}, ref: ref })));
|
|
34
|
-
});
|
|
42
|
+
});
|
|
43
|
+
|
|
44
|
+
module.exports = Avatar;
|
|
45
|
+
//# sourceMappingURL=index.js.map
|
package/Avatar/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Avatar/index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport PersonIcon from '@xanui/icons/Person'\n\nexport type AvatarProps<T extends TagComponentType = \"img\"> = TagProps<T> & {\n size?: useBreakpointPropsType<number>;\n}\n\nconst Avatar = React.forwardRef(<T extends TagComponentType = \"img\">({ children, src, alt, ...rest }: AvatarProps<T>, ref: any) => {\n const [faild, setFaild] = useState<boolean>()\n let [{ size, ...props }] = useInterface<any>(\"Avatar\", rest, {})\n size ??= 36\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n\n if (faild === false || !src) {\n let t = alt?.charAt(0).toUpperCase() || (children || <PersonIcon />)\n return (\n <Tag\n component=\"div\"\n src={src}\n {...props}\n baseClass='avatar'\n sxr={{\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.secondary\",\n radius: size,\n fontSize: (size / 3) * 2,\n width: size,\n height: size,\n userSelect: \"none\",\n color: \"text.primary\",\n '& svg': {\n fontSize: (size / 3) * 2,\n opacity: .6\n }\n }}\n ref={ref}\n >{t}</Tag>\n )\n }\n return (\n <Tag\n component=\"img\"\n radius={size}\n width={size}\n height={size}\n objectFit=\"cover\"\n {...props}\n alt={alt}\n src={src}\n baseClass='avatar'\n onError={(e) => {\n setFaild(false)\n props.onError && props.onError(e as any)\n }}\n ref={ref}\n />\n )\n})\n\nexport default Avatar\n\n\n"],"names":["__rest","useState","useInterface","useBreakpointProps","_jsx","Tag"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Avatar/index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport PersonIcon from '@xanui/icons/Person'\n\nexport type AvatarProps<T extends TagComponentType = \"img\"> = TagProps<T> & {\n size?: useBreakpointPropsType<number>;\n}\n\nconst Avatar = React.forwardRef(<T extends TagComponentType = \"img\">({ children, src, alt, ...rest }: AvatarProps<T>, ref: any) => {\n const [faild, setFaild] = useState<boolean>()\n let [{ size, ...props }] = useInterface<any>(\"Avatar\", rest, {})\n size ??= 36\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n\n if (faild === false || !src) {\n let t = alt?.charAt(0).toUpperCase() || (children || <PersonIcon />)\n return (\n <Tag\n component=\"div\"\n src={src}\n {...props}\n baseClass='avatar'\n sxr={{\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.secondary\",\n radius: size,\n fontSize: (size / 3) * 2,\n width: size,\n height: size,\n userSelect: \"none\",\n color: \"text.primary\",\n '& svg': {\n fontSize: (size / 3) * 2,\n opacity: .6\n }\n }}\n ref={ref}\n >{t}</Tag>\n )\n }\n return (\n <Tag\n component=\"img\"\n radius={size}\n width={size}\n height={size}\n objectFit=\"cover\"\n {...props}\n alt={alt}\n src={src}\n baseClass='avatar'\n onError={(e) => {\n setFaild(false)\n props.onError && props.onError(e as any)\n }}\n ref={ref}\n />\n )\n})\n\nexport default Avatar\n\n\n"],"names":["__rest","useState","useInterface","useBreakpointProps","_jsx","Tag"],"mappings":";;;;;;;;AAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA+C,EAAE,GAAQ,KAAI;QAA7D,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,OAA2B,EAAtB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAA7B,CAAA,UAAA,EAAA,KAAA,EAAA,KAAA,CAA+B,CAAF;IAC9F,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAGC,cAAQ,EAAW;AAC7C,IAAA,IAAI,OAAuBC,iBAAY,CAAM,QAAQ,EAAE,IAAI,EAAE,EAAE,CAAC,EAA3D,EAAE,IAAI,EAAA,GAAA,EAAY,EAAP,KAAK,GAAAF,YAAA,CAAA,EAAA,EAAhB,CAAA,MAAA,CAAkB,CAAyC;IAChE,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,MAAA,GAAJ,IAAI,IAAJ,IAAI,GAAK,EAAE,CAAA;IACX,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,IAAI;AAAE,QAAA,EAAE,CAAC,IAAI,GAAG,IAAI;AACxB,IAAA,MAAM,CAAC,GAAQG,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,IAAI,GAAG,CAAC,CAAC,IAAI;AAEb,IAAA,IAAI,KAAK,KAAK,KAAK,IAAI,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,GAAG,CAAA,GAAG,aAAH,GAAG,KAAA,MAAA,GAAA,MAAA,GAAH,GAAG,CAAE,MAAM,CAAC,CAAC,CAAA,CAAE,WAAW,EAAE,MAAK,QAAQ,IAAIC,cAAA,CAAC,UAAU,EAAA,EAAA,CAAG,CAAC;AACpE,QAAA,QACIA,cAAA,CAACC,QAAG,kBACA,SAAS,EAAC,KAAK,EACf,GAAG,EAAE,GAAG,EAAA,EACJ,KAAK,EAAA,EACT,SAAS,EAAC,QAAQ,EAClB,GAAG,EAAE;AACD,gBAAA,OAAO,EAAE,aAAa;AACtB,gBAAA,cAAc,EAAE,QAAQ;AACxB,gBAAA,UAAU,EAAE,QAAQ;AACpB,gBAAA,OAAO,EAAE,sBAAsB;AAC/B,gBAAA,MAAM,EAAE,IAAI;AACZ,gBAAA,QAAQ,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC;AACxB,gBAAA,KAAK,EAAE,IAAI;AACX,gBAAA,MAAM,EAAE,IAAI;AACZ,gBAAA,UAAU,EAAE,MAAM;AAClB,gBAAA,KAAK,EAAE,cAAc;AACrB,gBAAA,OAAO,EAAE;AACL,oBAAA,QAAQ,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC;AACxB,oBAAA,OAAO,EAAE;AACZ;AACJ,aAAA,EACD,GAAG,EAAE,GAAG,YACV,CAAC,EAAA,CAAA,CAAO;IAElB;AACA,IAAA,QACID,cAAA,CAACC,QAAG,kBACA,SAAS,EAAC,KAAK,EACf,MAAM,EAAE,IAAI,EACZ,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,SAAS,EAAC,OAAO,EAAA,EACb,KAAK,EAAA,EACT,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,QAAQ,EAClB,OAAO,EAAE,CAAC,CAAC,KAAI;YACX,QAAQ,CAAC,KAAK,CAAC;YACf,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,CAAQ,CAAC;AAC5C,QAAA,CAAC,EACD,GAAG,EAAE,GAAG,EAAA,CAAA,CACV;AAEV,CAAC;;;;"}
|
package/Avatar/index.mjs
CHANGED
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
import {__rest
|
|
1
|
+
import { __rest } from 'tslib';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import React, { useState } from 'react';
|
|
4
|
+
import { useInterface, useBreakpointProps, Tag } from '@xanui/core';
|
|
5
|
+
import PersonIcon from '@xanui/icons/Person';
|
|
6
|
+
|
|
7
|
+
const Avatar = React.forwardRef((_a, ref) => {
|
|
2
8
|
var { children, src, alt } = _a, rest = __rest(_a, ["children", "src", "alt"]);
|
|
3
9
|
const [faild, setFaild] = useState();
|
|
4
10
|
let [_b] = useInterface("Avatar", rest, {}), { size } = _b, props = __rest(_b, ["size"]);
|
|
@@ -31,4 +37,7 @@ import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React,{use
|
|
|
31
37
|
setFaild(false);
|
|
32
38
|
props.onError && props.onError(e);
|
|
33
39
|
}, ref: ref })));
|
|
34
|
-
});
|
|
40
|
+
});
|
|
41
|
+
|
|
42
|
+
export { Avatar as default };
|
|
43
|
+
//# sourceMappingURL=index.mjs.map
|
package/Avatar/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Avatar/index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport PersonIcon from '@xanui/icons/Person'\n\nexport type AvatarProps<T extends TagComponentType = \"img\"> = TagProps<T> & {\n size?: useBreakpointPropsType<number>;\n}\n\nconst Avatar = React.forwardRef(<T extends TagComponentType = \"img\">({ children, src, alt, ...rest }: AvatarProps<T>, ref: any) => {\n const [faild, setFaild] = useState<boolean>()\n let [{ size, ...props }] = useInterface<any>(\"Avatar\", rest, {})\n size ??= 36\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n\n if (faild === false || !src) {\n let t = alt?.charAt(0).toUpperCase() || (children || <PersonIcon />)\n return (\n <Tag\n component=\"div\"\n src={src}\n {...props}\n baseClass='avatar'\n sxr={{\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.secondary\",\n radius: size,\n fontSize: (size / 3) * 2,\n width: size,\n height: size,\n userSelect: \"none\",\n color: \"text.primary\",\n '& svg': {\n fontSize: (size / 3) * 2,\n opacity: .6\n }\n }}\n ref={ref}\n >{t}</Tag>\n )\n }\n return (\n <Tag\n component=\"img\"\n radius={size}\n width={size}\n height={size}\n objectFit=\"cover\"\n {...props}\n alt={alt}\n src={src}\n baseClass='avatar'\n onError={(e) => {\n setFaild(false)\n props.onError && props.onError(e as any)\n }}\n ref={ref}\n />\n )\n})\n\nexport default Avatar\n\n\n"],"names":["_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Avatar/index.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport PersonIcon from '@xanui/icons/Person'\n\nexport type AvatarProps<T extends TagComponentType = \"img\"> = TagProps<T> & {\n size?: useBreakpointPropsType<number>;\n}\n\nconst Avatar = React.forwardRef(<T extends TagComponentType = \"img\">({ children, src, alt, ...rest }: AvatarProps<T>, ref: any) => {\n const [faild, setFaild] = useState<boolean>()\n let [{ size, ...props }] = useInterface<any>(\"Avatar\", rest, {})\n size ??= 36\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n\n if (faild === false || !src) {\n let t = alt?.charAt(0).toUpperCase() || (children || <PersonIcon />)\n return (\n <Tag\n component=\"div\"\n src={src}\n {...props}\n baseClass='avatar'\n sxr={{\n display: \"inline-flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.secondary\",\n radius: size,\n fontSize: (size / 3) * 2,\n width: size,\n height: size,\n userSelect: \"none\",\n color: \"text.primary\",\n '& svg': {\n fontSize: (size / 3) * 2,\n opacity: .6\n }\n }}\n ref={ref}\n >{t}</Tag>\n )\n }\n return (\n <Tag\n component=\"img\"\n radius={size}\n width={size}\n height={size}\n objectFit=\"cover\"\n {...props}\n alt={alt}\n src={src}\n baseClass='avatar'\n onError={(e) => {\n setFaild(false)\n props.onError && props.onError(e as any)\n }}\n ref={ref}\n />\n )\n})\n\nexport default Avatar\n\n\n"],"names":["_jsx"],"mappings":";;;;;;AAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA+C,EAAE,GAAQ,KAAI;QAA7D,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,OAA2B,EAAtB,IAAI,GAAA,MAAA,CAAA,EAAA,EAA7B,CAAA,UAAA,EAAA,KAAA,EAAA,KAAA,CAA+B,CAAF;IAC9F,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAAW;AAC7C,IAAA,IAAI,OAAuB,YAAY,CAAM,QAAQ,EAAE,IAAI,EAAE,EAAE,CAAC,EAA3D,EAAE,IAAI,EAAA,GAAA,EAAY,EAAP,KAAK,GAAA,MAAA,CAAA,EAAA,EAAhB,CAAA,MAAA,CAAkB,CAAyC;IAChE,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,MAAA,GAAJ,IAAI,IAAJ,IAAI,GAAK,EAAE,CAAA;IACX,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,IAAI;AAAE,QAAA,EAAE,CAAC,IAAI,GAAG,IAAI;AACxB,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,IAAI,GAAG,CAAC,CAAC,IAAI;AAEb,IAAA,IAAI,KAAK,KAAK,KAAK,IAAI,CAAC,GAAG,EAAE;QACzB,IAAI,CAAC,GAAG,CAAA,GAAG,aAAH,GAAG,KAAA,MAAA,GAAA,MAAA,GAAH,GAAG,CAAE,MAAM,CAAC,CAAC,CAAA,CAAE,WAAW,EAAE,MAAK,QAAQ,IAAIA,GAAA,CAAC,UAAU,EAAA,EAAA,CAAG,CAAC;AACpE,QAAA,QACIA,GAAA,CAAC,GAAG,kBACA,SAAS,EAAC,KAAK,EACf,GAAG,EAAE,GAAG,EAAA,EACJ,KAAK,EAAA,EACT,SAAS,EAAC,QAAQ,EAClB,GAAG,EAAE;AACD,gBAAA,OAAO,EAAE,aAAa;AACtB,gBAAA,cAAc,EAAE,QAAQ;AACxB,gBAAA,UAAU,EAAE,QAAQ;AACpB,gBAAA,OAAO,EAAE,sBAAsB;AAC/B,gBAAA,MAAM,EAAE,IAAI;AACZ,gBAAA,QAAQ,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC;AACxB,gBAAA,KAAK,EAAE,IAAI;AACX,gBAAA,MAAM,EAAE,IAAI;AACZ,gBAAA,UAAU,EAAE,MAAM;AAClB,gBAAA,KAAK,EAAE,cAAc;AACrB,gBAAA,OAAO,EAAE;AACL,oBAAA,QAAQ,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC;AACxB,oBAAA,OAAO,EAAE;AACZ;AACJ,aAAA,EACD,GAAG,EAAE,GAAG,YACV,CAAC,EAAA,CAAA,CAAO;IAElB;AACA,IAAA,QACIA,GAAA,CAAC,GAAG,kBACA,SAAS,EAAC,KAAK,EACf,MAAM,EAAE,IAAI,EACZ,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,SAAS,EAAC,OAAO,EAAA,EACb,KAAK,EAAA,EACT,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,QAAQ,EAClB,OAAO,EAAE,CAAC,CAAC,KAAI;YACX,QAAQ,CAAC,KAAK,CAAC;YACf,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,OAAO,CAAC,CAAQ,CAAC;AAC5C,QAAA,CAAC,EACD,GAAG,EAAE,GAAG,EAAA,CAAA,CACV;AAEV,CAAC;;;;"}
|
package/Badge/index.js
CHANGED
|
@@ -1,4 +1,11 @@
|
|
|
1
|
-
'use strict';
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var tslib = require('tslib');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var core = require('@xanui/core');
|
|
7
|
+
|
|
8
|
+
const Badge = React.forwardRef((_a, ref) => {
|
|
2
9
|
var { children, content } = _a, rest = tslib.__rest(_a, ["children", "content"]);
|
|
3
10
|
let [_b] = core.useInterface("Badge", rest, {}), { color, placement, visible, slotProps } = _b, props = tslib.__rest(_b, ["color", "placement", "visible", "slotProps"]);
|
|
4
11
|
color !== null && color !== void 0 ? color : (color = "danger");
|
|
@@ -64,4 +71,7 @@
|
|
|
64
71
|
fontWeight: 500,
|
|
65
72
|
fontSize: 11
|
|
66
73
|
} }, template.primary, _css, { children: typeof content === 'number' ? (content >= 100 ? "99+" : content) : content })), children] })));
|
|
67
|
-
});
|
|
74
|
+
});
|
|
75
|
+
|
|
76
|
+
module.exports = Badge;
|
|
77
|
+
//# sourceMappingURL=index.js.map
|
package/Badge/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Badge/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, UseColorTemplateColor, useColorTemplate, useBreakpointPropsType, useBreakpointProps, TransitionProps } from '@xanui/core';\n\n\nexport type BadgeProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"baseClass\" | \"content\"> & {\n content?: useBreakpointPropsType<number | ReactElement>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n placement?: useBreakpointPropsType<\"left-top\" | \"left-bottom\" | \"right-top\" | \"right-bottom\">;\n visible?: useBreakpointPropsType<boolean>;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">\n }\n}\n\nconst Badge = React.forwardRef(<T extends TagComponentType = \"div\">({ children, content, ...rest }: BadgeProps<T>, ref: React.Ref<any>) => {\n let [{ color, placement, visible, slotProps, ...props }] = useInterface<any>(\"Badge\", rest, {})\n color ??= \"danger\"\n visible ??= true\n placement ??= \"right-top\"\n\n const _p: any = {}\n\n if (content) _p.content = content\n if (color) _p.color = color\n if (placement) _p.placement = placement\n if (visible) _p.visible = visible\n\n const p: any = useBreakpointProps(_p)\n\n content = p.content\n color = p.color\n placement = p.placement\n visible = p.visible\n\n const template = useColorTemplate(color, \"fill\")\n let _css: any = {}\n let pos = -3;\n if (typeof content === \"number\") {\n if (content.toString().length === 2) {\n pos = -5\n } else if (content.toString().length > 2) {\n pos = -8\n }\n }\n\n switch (placement) {\n case \"left-top\":\n _css = { top: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"left-bottom\":\n _css = { bottom: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"right-top\":\n _css = { top: content ? pos : 0, right: content ? pos : 0 }\n break;\n case \"right-bottom\":\n _css = { bottom: content ? pos : 0, right: content ? pos : 0 }\n break;\n }\n if (content) {\n _css.minWidth = 16\n _css.height = 16\n _css.height = 16\n _css.p = .8\n _css.px = .4\n } else {\n _css.width = 8\n _css.height = 8\n }\n\n return (\n <Tag\n {...props}\n position=\"relative\"\n display=\"inline-block\"\n baseClass='badge'\n ref={ref}\n >\n <Tag\n component='span'\n baseClass='badge-content'\n sxr={{\n position: \"absolute\",\n zIndex: 1,\n radius: 2,\n display: 'flex',\n justifyContent: \"center\",\n alignItems: 'center',\n fontWeight: 500,\n fontSize: 11\n }}\n {...template.primary}\n {..._css}\n >\n {typeof content === 'number' ? (content >= 100 ? \"99+\" : content) : content}\n </Tag>\n {children}\n </Tag>\n )\n})\n\nexport default Badge\n\n"],"names":["__rest","useInterface","useBreakpointProps","useColorTemplate","_jsxs","Tag","_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Badge/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, UseColorTemplateColor, useColorTemplate, useBreakpointPropsType, useBreakpointProps, TransitionProps } from '@xanui/core';\n\n\nexport type BadgeProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"baseClass\" | \"content\"> & {\n content?: useBreakpointPropsType<number | ReactElement>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n placement?: useBreakpointPropsType<\"left-top\" | \"left-bottom\" | \"right-top\" | \"right-bottom\">;\n visible?: useBreakpointPropsType<boolean>;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">\n }\n}\n\nconst Badge = React.forwardRef(<T extends TagComponentType = \"div\">({ children, content, ...rest }: BadgeProps<T>, ref: React.Ref<any>) => {\n let [{ color, placement, visible, slotProps, ...props }] = useInterface<any>(\"Badge\", rest, {})\n color ??= \"danger\"\n visible ??= true\n placement ??= \"right-top\"\n\n const _p: any = {}\n\n if (content) _p.content = content\n if (color) _p.color = color\n if (placement) _p.placement = placement\n if (visible) _p.visible = visible\n\n const p: any = useBreakpointProps(_p)\n\n content = p.content\n color = p.color\n placement = p.placement\n visible = p.visible\n\n const template = useColorTemplate(color, \"fill\")\n let _css: any = {}\n let pos = -3;\n if (typeof content === \"number\") {\n if (content.toString().length === 2) {\n pos = -5\n } else if (content.toString().length > 2) {\n pos = -8\n }\n }\n\n switch (placement) {\n case \"left-top\":\n _css = { top: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"left-bottom\":\n _css = { bottom: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"right-top\":\n _css = { top: content ? pos : 0, right: content ? pos : 0 }\n break;\n case \"right-bottom\":\n _css = { bottom: content ? pos : 0, right: content ? pos : 0 }\n break;\n }\n if (content) {\n _css.minWidth = 16\n _css.height = 16\n _css.height = 16\n _css.p = .8\n _css.px = .4\n } else {\n _css.width = 8\n _css.height = 8\n }\n\n return (\n <Tag\n {...props}\n position=\"relative\"\n display=\"inline-block\"\n baseClass='badge'\n ref={ref}\n >\n <Tag\n component='span'\n baseClass='badge-content'\n sxr={{\n position: \"absolute\",\n zIndex: 1,\n radius: 2,\n display: 'flex',\n justifyContent: \"center\",\n alignItems: 'center',\n fontWeight: 500,\n fontSize: 11\n }}\n {...template.primary}\n {..._css}\n >\n {typeof content === 'number' ? (content >= 100 ? \"99+\" : content) : content}\n </Tag>\n {children}\n </Tag>\n )\n})\n\nexport default Badge\n\n"],"names":["__rest","useInterface","useBreakpointProps","useColorTemplate","_jsxs","Tag","_jsx"],"mappings":"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"}
|
package/Badge/index.mjs
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
|
-
import {__rest
|
|
1
|
+
import { __rest } from 'tslib';
|
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import { useInterface, useBreakpointProps, useColorTemplate, Tag } from '@xanui/core';
|
|
5
|
+
|
|
6
|
+
const Badge = React.forwardRef((_a, ref) => {
|
|
2
7
|
var { children, content } = _a, rest = __rest(_a, ["children", "content"]);
|
|
3
8
|
let [_b] = useInterface("Badge", rest, {}), { color, placement, visible, slotProps } = _b, props = __rest(_b, ["color", "placement", "visible", "slotProps"]);
|
|
4
9
|
color !== null && color !== void 0 ? color : (color = "danger");
|
|
@@ -64,4 +69,7 @@ import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React
|
|
|
64
69
|
fontWeight: 500,
|
|
65
70
|
fontSize: 11
|
|
66
71
|
} }, template.primary, _css, { children: typeof content === 'number' ? (content >= 100 ? "99+" : content) : content })), children] })));
|
|
67
|
-
});
|
|
72
|
+
});
|
|
73
|
+
|
|
74
|
+
export { Badge as default };
|
|
75
|
+
//# sourceMappingURL=index.mjs.map
|
package/Badge/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Badge/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, UseColorTemplateColor, useColorTemplate, useBreakpointPropsType, useBreakpointProps, TransitionProps } from '@xanui/core';\n\n\nexport type BadgeProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"baseClass\" | \"content\"> & {\n content?: useBreakpointPropsType<number | ReactElement>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n placement?: useBreakpointPropsType<\"left-top\" | \"left-bottom\" | \"right-top\" | \"right-bottom\">;\n visible?: useBreakpointPropsType<boolean>;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">\n }\n}\n\nconst Badge = React.forwardRef(<T extends TagComponentType = \"div\">({ children, content, ...rest }: BadgeProps<T>, ref: React.Ref<any>) => {\n let [{ color, placement, visible, slotProps, ...props }] = useInterface<any>(\"Badge\", rest, {})\n color ??= \"danger\"\n visible ??= true\n placement ??= \"right-top\"\n\n const _p: any = {}\n\n if (content) _p.content = content\n if (color) _p.color = color\n if (placement) _p.placement = placement\n if (visible) _p.visible = visible\n\n const p: any = useBreakpointProps(_p)\n\n content = p.content\n color = p.color\n placement = p.placement\n visible = p.visible\n\n const template = useColorTemplate(color, \"fill\")\n let _css: any = {}\n let pos = -3;\n if (typeof content === \"number\") {\n if (content.toString().length === 2) {\n pos = -5\n } else if (content.toString().length > 2) {\n pos = -8\n }\n }\n\n switch (placement) {\n case \"left-top\":\n _css = { top: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"left-bottom\":\n _css = { bottom: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"right-top\":\n _css = { top: content ? pos : 0, right: content ? pos : 0 }\n break;\n case \"right-bottom\":\n _css = { bottom: content ? pos : 0, right: content ? pos : 0 }\n break;\n }\n if (content) {\n _css.minWidth = 16\n _css.height = 16\n _css.height = 16\n _css.p = .8\n _css.px = .4\n } else {\n _css.width = 8\n _css.height = 8\n }\n\n return (\n <Tag\n {...props}\n position=\"relative\"\n display=\"inline-block\"\n baseClass='badge'\n ref={ref}\n >\n <Tag\n component='span'\n baseClass='badge-content'\n sxr={{\n position: \"absolute\",\n zIndex: 1,\n radius: 2,\n display: 'flex',\n justifyContent: \"center\",\n alignItems: 'center',\n fontWeight: 500,\n fontSize: 11\n }}\n {...template.primary}\n {..._css}\n >\n {typeof content === 'number' ? (content >= 100 ? \"99+\" : content) : content}\n </Tag>\n {children}\n </Tag>\n )\n})\n\nexport default Badge\n\n"],"names":["_jsxs","_jsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Badge/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface, UseColorTemplateColor, useColorTemplate, useBreakpointPropsType, useBreakpointProps, TransitionProps } from '@xanui/core';\n\n\nexport type BadgeProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"baseClass\" | \"content\"> & {\n content?: useBreakpointPropsType<number | ReactElement>;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n placement?: useBreakpointPropsType<\"left-top\" | \"left-bottom\" | \"right-top\" | \"right-bottom\">;\n visible?: useBreakpointPropsType<boolean>;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">\n }\n}\n\nconst Badge = React.forwardRef(<T extends TagComponentType = \"div\">({ children, content, ...rest }: BadgeProps<T>, ref: React.Ref<any>) => {\n let [{ color, placement, visible, slotProps, ...props }] = useInterface<any>(\"Badge\", rest, {})\n color ??= \"danger\"\n visible ??= true\n placement ??= \"right-top\"\n\n const _p: any = {}\n\n if (content) _p.content = content\n if (color) _p.color = color\n if (placement) _p.placement = placement\n if (visible) _p.visible = visible\n\n const p: any = useBreakpointProps(_p)\n\n content = p.content\n color = p.color\n placement = p.placement\n visible = p.visible\n\n const template = useColorTemplate(color, \"fill\")\n let _css: any = {}\n let pos = -3;\n if (typeof content === \"number\") {\n if (content.toString().length === 2) {\n pos = -5\n } else if (content.toString().length > 2) {\n pos = -8\n }\n }\n\n switch (placement) {\n case \"left-top\":\n _css = { top: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"left-bottom\":\n _css = { bottom: content ? pos : 0, left: content ? pos : 0 }\n break;\n case \"right-top\":\n _css = { top: content ? pos : 0, right: content ? pos : 0 }\n break;\n case \"right-bottom\":\n _css = { bottom: content ? pos : 0, right: content ? pos : 0 }\n break;\n }\n if (content) {\n _css.minWidth = 16\n _css.height = 16\n _css.height = 16\n _css.p = .8\n _css.px = .4\n } else {\n _css.width = 8\n _css.height = 8\n }\n\n return (\n <Tag\n {...props}\n position=\"relative\"\n display=\"inline-block\"\n baseClass='badge'\n ref={ref}\n >\n <Tag\n component='span'\n baseClass='badge-content'\n sxr={{\n position: \"absolute\",\n zIndex: 1,\n radius: 2,\n display: 'flex',\n justifyContent: \"center\",\n alignItems: 'center',\n fontWeight: 500,\n fontSize: 11\n }}\n {...template.primary}\n {..._css}\n >\n {typeof content === 'number' ? (content >= 100 ? \"99+\" : content) : content}\n </Tag>\n {children}\n </Tag>\n )\n})\n\nexport default Badge\n\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
|