@xanui/ui 1.1.35 → 1.1.37
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/DataFilter/index.js +3 -3
- package/package.json +4 -4
- package/Accordion/index.mjs +0 -94
- package/Accordion/index.mjs.map +0 -1
- package/Alert/index.mjs +0 -119
- package/Alert/index.mjs.map +0 -1
- package/Autocomplete/index.mjs +0 -134
- package/Autocomplete/index.mjs.map +0 -1
- package/Avatar/index.mjs +0 -48
- package/Avatar/index.mjs.map +0 -1
- package/Badge/index.mjs +0 -107
- package/Badge/index.mjs.map +0 -1
- package/Box/index.mjs +0 -12
- package/Box/index.mjs.map +0 -1
- package/Button/index.mjs +0 -92
- package/Button/index.mjs.map +0 -1
- package/ButtonGroup/index.mjs +0 -56
- package/ButtonGroup/index.mjs.map +0 -1
- package/Calendar/index.mjs +0 -172
- package/Calendar/index.mjs.map +0 -1
- package/CalendarInput/index.mjs +0 -32
- package/CalendarInput/index.mjs.map +0 -1
- package/Checkbox/index.mjs +0 -56
- package/Checkbox/index.mjs.map +0 -1
- package/Chip/index.mjs +0 -74
- package/Chip/index.mjs.map +0 -1
- package/CircleProgress/index.mjs +0 -127
- package/CircleProgress/index.mjs.map +0 -1
- package/ClickOutside/index.mjs +0 -35
- package/ClickOutside/index.mjs.map +0 -1
- package/Collaps/index.mjs +0 -24
- package/Collaps/index.mjs.map +0 -1
- package/Container/index.mjs +0 -27
- package/Container/index.mjs.map +0 -1
- package/DataFilter/index.mjs +0 -67
- package/DataFilter/index.mjs.map +0 -1
- package/DataFilter/options/DateFilter.mjs +0 -30
- package/DataFilter/options/DateFilter.mjs.map +0 -1
- package/DataFilter/options/DateRangeFilter.mjs +0 -25
- package/DataFilter/options/DateRangeFilter.mjs.map +0 -1
- package/DataFilter/options/MultiSelectFilter.mjs +0 -36
- package/DataFilter/options/MultiSelectFilter.mjs.map +0 -1
- package/DataFilter/options/NumberFilter.mjs +0 -22
- package/DataFilter/options/NumberFilter.mjs.map +0 -1
- package/DataFilter/options/NumberRangeFilter.mjs +0 -27
- package/DataFilter/options/NumberRangeFilter.mjs.map +0 -1
- package/DataFilter/options/SelectFilter.mjs +0 -32
- package/DataFilter/options/SelectFilter.mjs.map +0 -1
- package/DataFilter/options/TextFilter.mjs +0 -22
- package/DataFilter/options/TextFilter.mjs.map +0 -1
- package/Datatable/FilterBox.mjs +0 -37
- package/Datatable/FilterBox.mjs.map +0 -1
- package/Datatable/Row.mjs +0 -57
- package/Datatable/Row.mjs.map +0 -1
- package/Datatable/SelectedBox.mjs +0 -19
- package/Datatable/SelectedBox.mjs.map +0 -1
- package/Datatable/Table.mjs +0 -21
- package/Datatable/Table.mjs.map +0 -1
- package/Datatable/TableHead.mjs +0 -59
- package/Datatable/TableHead.mjs.map +0 -1
- package/Datatable/index.mjs +0 -91
- package/Datatable/index.mjs.map +0 -1
- package/Divider/index.mjs +0 -29
- package/Divider/index.mjs.map +0 -1
- package/Drawer/index.mjs +0 -76
- package/Drawer/index.mjs.map +0 -1
- package/Form/index.mjs +0 -43
- package/Form/index.mjs.map +0 -1
- package/GridContainer/index.mjs +0 -17
- package/GridContainer/index.mjs.map +0 -1
- package/GridItem/index.mjs +0 -18
- package/GridItem/index.mjs.map +0 -1
- package/IconButton/index.mjs +0 -62
- package/IconButton/index.mjs.map +0 -1
- package/Image/index.mjs +0 -25
- package/Image/index.mjs.map +0 -1
- package/Input/index.mjs +0 -142
- package/Input/index.mjs.map +0 -1
- package/InputNumber/index.mjs +0 -30
- package/InputNumber/index.mjs.map +0 -1
- package/Label/index.mjs +0 -22
- package/Label/index.mjs.map +0 -1
- package/Layer/index.mjs +0 -60
- package/Layer/index.mjs.map +0 -1
- package/LineProgress/index.mjs +0 -57
- package/LineProgress/index.mjs.map +0 -1
- package/List/ListContext.mjs +0 -8
- package/List/ListContext.mjs.map +0 -1
- package/List/index.mjs +0 -61
- package/List/index.mjs.map +0 -1
- package/ListItem/index.mjs +0 -52
- package/ListItem/index.mjs.map +0 -1
- package/LoadingBox/index.mjs +0 -30
- package/LoadingBox/index.mjs.map +0 -1
- package/Menu/index.mjs +0 -148
- package/Menu/index.mjs.map +0 -1
- package/Modal/index.mjs +0 -57
- package/Modal/index.mjs.map +0 -1
- package/NoSSR/index.mjs +0 -13
- package/NoSSR/index.mjs.map +0 -1
- package/Option/index.mjs +0 -12
- package/Option/index.mjs.map +0 -1
- package/Paper/index.mjs +0 -13
- package/Paper/index.mjs.map +0 -1
- package/Portal/index.mjs +0 -25
- package/Portal/index.mjs.map +0 -1
- package/Radio/index.mjs +0 -14
- package/Radio/index.mjs.map +0 -1
- package/Scrollbar/index.mjs +0 -57
- package/Scrollbar/index.mjs.map +0 -1
- package/Select/index.mjs +0 -57
- package/Select/index.mjs.map +0 -1
- package/Skeleton/index.mjs +0 -58
- package/Skeleton/index.mjs.map +0 -1
- package/Stack/index.mjs +0 -15
- package/Stack/index.mjs.map +0 -1
- package/Switch/index.mjs +0 -77
- package/Switch/index.mjs.map +0 -1
- package/Tab/index.mjs +0 -15
- package/Tab/index.mjs.map +0 -1
- package/Table/index.mjs +0 -86
- package/Table/index.mjs.map +0 -1
- package/TableBody/index.mjs +0 -12
- package/TableBody/index.mjs.map +0 -1
- package/TableCell/index.mjs +0 -12
- package/TableCell/index.mjs.map +0 -1
- package/TableFooter/index.mjs +0 -12
- package/TableFooter/index.mjs.map +0 -1
- package/TableHead/index.mjs +0 -12
- package/TableHead/index.mjs.map +0 -1
- package/TablePagination/index.mjs +0 -57
- package/TablePagination/index.mjs.map +0 -1
- package/TableRow/index.mjs +0 -12
- package/TableRow/index.mjs.map +0 -1
- package/Tabs/index.mjs +0 -199
- package/Tabs/index.mjs.map +0 -1
- package/Text/index.mjs +0 -23
- package/Text/index.mjs.map +0 -1
- package/Toast/index.mjs +0 -118
- package/Toast/index.mjs.map +0 -1
- package/Tooltip/index.mjs +0 -38
- package/Tooltip/index.mjs.map +0 -1
- package/ViewBox/index.mjs +0 -30
- package/ViewBox/index.mjs.map +0 -1
- package/index.mjs +0 -65
- package/index.mjs.map +0 -1
- package/useAlert/index.mjs +0 -92
- package/useAlert/index.mjs.map +0 -1
- package/useBlurCss/index.mjs +0 -17
- package/useBlurCss/index.mjs.map +0 -1
- package/useCorner/index.mjs +0 -20
- package/useCorner/index.mjs.map +0 -1
- package/useLayer/index.mjs +0 -36
- package/useLayer/index.mjs.map +0 -1
- package/useModal/index.mjs +0 -35
- package/useModal/index.mjs.map +0 -1
package/Select/index.mjs
DELETED
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { __rest } from 'tslib';
|
|
3
|
-
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
4
|
-
import React, { useState, useRef, useMemo, Children, cloneElement } from 'react';
|
|
5
|
-
import Input from '../Input/index.mjs';
|
|
6
|
-
import List from '../List/index.mjs';
|
|
7
|
-
import Menu from '../Menu/index.mjs';
|
|
8
|
-
import Stack from '../Stack/index.mjs';
|
|
9
|
-
import DownIcon from '@xanui/icons/KeyboardArrowDown';
|
|
10
|
-
import UpIcon from '@xanui/icons/KeyboardArrowUp';
|
|
11
|
-
import { useInterface, useMergeRefs } from '@xanui/core';
|
|
12
|
-
|
|
13
|
-
const Select = React.forwardRef((_a, ref) => {
|
|
14
|
-
var _b, _c, _d, _e, _f, _g;
|
|
15
|
-
var { onChange, value, children, error, helperText, name, refs } = _a, props = __rest(_a, ["onChange", "value", "children", "error", "helperText", "name", "refs"]);
|
|
16
|
-
let [_h] = useInterface("Select", props, {}), { slotProps, color, variant } = _h, inputProps = __rest(_h, ["slotProps", "color", "variant"]);
|
|
17
|
-
color !== null && color !== void 0 ? color : (color = "brand");
|
|
18
|
-
variant !== null && variant !== void 0 ? variant : (variant = "fill");
|
|
19
|
-
const [target, setTarget] = useState();
|
|
20
|
-
const conRef = useRef(null);
|
|
21
|
-
const { childs, selectedProps } = useMemo(() => {
|
|
22
|
-
let sProps = {};
|
|
23
|
-
const c = Children.map(children, (child) => {
|
|
24
|
-
let selected = child.props.value === value;
|
|
25
|
-
if (selected)
|
|
26
|
-
sProps = child.props;
|
|
27
|
-
return cloneElement(child, {
|
|
28
|
-
value: undefined,
|
|
29
|
-
selected,
|
|
30
|
-
onClick: () => {
|
|
31
|
-
setTarget(null);
|
|
32
|
-
onChange && onChange(child.props.value);
|
|
33
|
-
}
|
|
34
|
-
});
|
|
35
|
-
});
|
|
36
|
-
return {
|
|
37
|
-
childs: c,
|
|
38
|
-
selectedProps: sProps
|
|
39
|
-
};
|
|
40
|
-
}, [children, value]);
|
|
41
|
-
const mergeRefs = useMergeRefs(ref, conRef);
|
|
42
|
-
const toggleMenu = () => setTarget(target ? null : conRef.current);
|
|
43
|
-
return (jsxs(Fragment, { children: [jsx(Input, Object.assign({ ref: mergeRefs, color: color, variant: variant === "soft" ? "fill" : variant, endIcon: jsxs(Stack, { flexDirection: "row", component: "span", children: [" ", (target ? jsx(UpIcon, {}) : jsx(DownIcon, {}))] }), readOnly: true, value: typeof selectedProps.children === 'string' ? selectedProps.children : value, cursor: "pointer", userSelect: "none", startIcon: selectedProps.startIcon, focused: !!target, error: error, helperText: helperText, name: name }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.input, inputProps, { refs: Object.assign({ input: refs === null || refs === void 0 ? void 0 : refs.input }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.input) === null || _b === void 0 ? void 0 : _b.refs), slotProps: {
|
|
44
|
-
rootContainer: Object.assign(Object.assign({ cursor: "pointer", userSelect: "none" }, (((_d = (_c = slotProps === null || slotProps === void 0 ? void 0 : slotProps.input) === null || _c === void 0 ? void 0 : _c.slotProps) === null || _d === void 0 ? void 0 : _d.container) || {})), { onClick: () => {
|
|
45
|
-
if (!target) {
|
|
46
|
-
toggleMenu();
|
|
47
|
-
}
|
|
48
|
-
} })
|
|
49
|
-
} })), jsx(Menu, Object.assign({ ref: refs === null || refs === void 0 ? void 0 : refs.menu, target: target, placement: "bottom-left" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.menu, { slotProps: Object.assign(Object.assign({}, (_e = slotProps === null || slotProps === void 0 ? void 0 : slotProps.menu) === null || _e === void 0 ? void 0 : _e.slotProps), { content: Object.assign(Object.assign({ mt: .5 }, (_f = slotProps === null || slotProps === void 0 ? void 0 : slotProps.menu) === null || _f === void 0 ? void 0 : _f.content), { width: conRef && ((_g = conRef === null || conRef === void 0 ? void 0 : conRef.current) === null || _g === void 0 ? void 0 : _g.clientWidth) }) }), onClickOutside: (e) => {
|
|
50
|
-
if (conRef.current.contains(e.target))
|
|
51
|
-
return;
|
|
52
|
-
toggleMenu();
|
|
53
|
-
}, children: jsx(List, Object.assign({ ref: refs === null || refs === void 0 ? void 0 : refs.list }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.list, { color: color, variant: variant === "outline" ? "fill" : variant, children: childs })) }))] }));
|
|
54
|
-
});
|
|
55
|
-
|
|
56
|
-
export { Select as default };
|
|
57
|
-
//# sourceMappingURL=index.mjs.map
|
package/Select/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Select/index.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { ReactElement, useMemo, cloneElement, useState, Children, useRef } from 'react'\r\nimport Input, { InputProps } from '../Input'\r\nimport List, { ListProps } from '../List'\r\nimport Menu, { MenuProps } from '../Menu'\r\nimport Stack from '../Stack'\r\nimport { OptionProps } from '../Option'\r\nimport DownIcon from '@xanui/icons/KeyboardArrowDown';\r\nimport UpIcon from '@xanui/icons/KeyboardArrowUp';\r\nimport { useInterface, useMergeRefs } from '@xanui/core'\r\n\r\n\r\nexport type SelectProps = Omit<InputProps, \"onChange\" | \"value\" | \"children\" | \"slotProps\"> & {\r\n value?: string | number;\r\n onChange?: (value: string | number) => void;\r\n children: ReactElement<OptionProps> | ReactElement<OptionProps>[];\r\n\r\n refs?: {\r\n input?: React.Ref<any>;\r\n menu?: React.Ref<any>;\r\n list?: React.Ref<any>;\r\n };\r\n slotProps?: {\r\n menu?: Omit<MenuProps, 'children' | 'target'>;\r\n input?: Omit<InputProps, \"onChange\" | \"value\">;\r\n list?: Omit<ListProps, \"children\">\r\n }\r\n}\r\n\r\nconst Select = React.forwardRef(({ onChange, value, children, error, helperText, name, refs, ...props }: SelectProps, ref: React.Ref<any>) => {\r\n let [{ slotProps, color, variant, ...inputProps }] = useInterface<any>(\"Select\", props, {})\r\n color ??= \"brand\"\r\n variant ??= \"fill\"\r\n const [target, setTarget] = useState<any>()\r\n const conRef = useRef(null)\r\n const { childs, selectedProps } = useMemo(() => {\r\n let sProps: any = {}\r\n const c = Children.map(children, (child: any) => {\r\n let selected = child.props.value === value\r\n if (selected) sProps = child.props\r\n return cloneElement(child, {\r\n value: undefined,\r\n selected,\r\n onClick: () => {\r\n setTarget(null)\r\n onChange && onChange(child.props.value)\r\n }\r\n })\r\n })\r\n return {\r\n childs: c,\r\n selectedProps: sProps as OptionProps\r\n }\r\n }, [children, value])\r\n\r\n const mergeRefs = useMergeRefs(ref, conRef)\r\n const toggleMenu = () => setTarget(target ? null : conRef.current)\r\n\r\n return (\r\n <>\r\n <Input\r\n ref={mergeRefs}\r\n color={color}\r\n variant={variant === \"soft\" ? \"fill\" : variant}\r\n endIcon={<Stack flexDirection=\"row\" component=\"span\" > {(target ? <UpIcon /> : <DownIcon />)}</Stack>}\r\n readOnly\r\n value={typeof selectedProps.children === 'string' ? selectedProps.children : value}\r\n cursor=\"pointer\"\r\n userSelect=\"none\"\r\n startIcon={selectedProps.startIcon}\r\n focused={!!target}\r\n error={error}\r\n helperText={helperText}\r\n name={name}\r\n {...slotProps?.input}\r\n {...inputProps}\r\n refs={{\r\n input: refs?.input,\r\n ...slotProps?.input?.refs\r\n }}\r\n slotProps={{\r\n rootContainer: {\r\n cursor: \"pointer\",\r\n userSelect: \"none\",\r\n ...(slotProps?.input?.slotProps?.container || {}),\r\n onClick: () => {\r\n if (!target) {\r\n toggleMenu()\r\n }\r\n },\r\n }\r\n }}\r\n />\r\n <Menu\r\n ref={refs?.menu}\r\n target={target}\r\n placement=\"bottom-left\"\r\n {...slotProps?.menu}\r\n slotProps={{\r\n ...slotProps?.menu?.slotProps,\r\n content: {\r\n mt: .5,\r\n ...slotProps?.menu?.content,\r\n width: conRef && (conRef?.current as any)?.clientWidth,\r\n }\r\n }}\r\n onClickOutside={(e) => {\r\n if ((conRef.current as any).contains(e.target)) return;\r\n toggleMenu()\r\n }}\r\n >\r\n <List\r\n ref={refs?.list}\r\n {...slotProps?.list}\r\n color={color}\r\n variant={variant === \"outline\" ? \"fill\" : variant}\r\n >\r\n {childs}\r\n </List>\r\n </Menu>\r\n </>\r\n )\r\n})\r\n\r\nexport default Select"],"names":[],"mappings":";;;;;;;;;;;;AA8BA;;AAAiC;;;;;AAK7B;;;;;AAKQ;AAAc;;AAEV;;;;;;AAMH;AACL;;AAEI;AACA;;AAER;;AAGA;AAEA;AAuBgB;;AAMY;;AAER;AAEP;;;AAiBG;;AAcpB;;"}
|
package/Skeleton/index.mjs
DELETED
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Tag } from '@xanui/core';
|
|
5
|
-
|
|
6
|
-
const Skeleton = React.forwardRef((_a, ref) => {
|
|
7
|
-
var { children, loading, color, animation } = _a, props = __rest(_a, ["children", "loading", "color", "animation"]);
|
|
8
|
-
if (!children)
|
|
9
|
-
loading = true;
|
|
10
|
-
if (loading) {
|
|
11
|
-
animation !== null && animation !== void 0 ? animation : (animation = 'pulse');
|
|
12
|
-
color !== null && color !== void 0 ? color : (color = "default");
|
|
13
|
-
let sxr = {};
|
|
14
|
-
switch (animation) {
|
|
15
|
-
case 'pulse':
|
|
16
|
-
sxr = {
|
|
17
|
-
bgcolor: "divider.primary",
|
|
18
|
-
width: "100%",
|
|
19
|
-
animation: 'skpulse 1.5s infinite',
|
|
20
|
-
"@keyframes skpulse": {
|
|
21
|
-
'0%, 100%': {
|
|
22
|
-
opacity: 1,
|
|
23
|
-
},
|
|
24
|
-
'50%': {
|
|
25
|
-
opacity: 0.4,
|
|
26
|
-
},
|
|
27
|
-
}
|
|
28
|
-
};
|
|
29
|
-
break;
|
|
30
|
-
case 'wave':
|
|
31
|
-
sxr = {
|
|
32
|
-
position: 'relative',
|
|
33
|
-
overflow: 'hidden',
|
|
34
|
-
bgcolor: "divider.primary",
|
|
35
|
-
"&::after": {
|
|
36
|
-
content: '""',
|
|
37
|
-
position: 'absolute',
|
|
38
|
-
top: 0,
|
|
39
|
-
left: "0%",
|
|
40
|
-
width: '100%',
|
|
41
|
-
height: '100%',
|
|
42
|
-
animation: 'skwave 2s infinite',
|
|
43
|
-
background: `linear-gradient(90deg, transparent 0%, var(--color-divider-secondary) 50%, transparent 100%)`,
|
|
44
|
-
},
|
|
45
|
-
"@keyframes skwave": {
|
|
46
|
-
'0%': { left: '-100%' },
|
|
47
|
-
'100%': { left: '100%' }
|
|
48
|
-
}
|
|
49
|
-
};
|
|
50
|
-
break;
|
|
51
|
-
}
|
|
52
|
-
return (jsx(Tag, Object.assign({}, props, { baseClass: 'skeleton', ref: ref, sxr: sxr })));
|
|
53
|
-
}
|
|
54
|
-
return children;
|
|
55
|
-
});
|
|
56
|
-
|
|
57
|
-
export { Skeleton as default };
|
|
58
|
-
//# sourceMappingURL=index.mjs.map
|
package/Skeleton/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Skeleton/index.tsx"],"sourcesContent":["import React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type SkeletonProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\r\n animation?: 'pulse' | 'wave' | 'none';\r\n loading?: boolean;\r\n}\r\n\r\nconst Skeleton = React.forwardRef(<T extends TagComponentType = \"div\">({ children, loading, color, animation, ...props }: SkeletonProps<T>, ref: React.Ref<any>) => {\r\n\r\n if (!children) loading = true\r\n\r\n if (loading) {\r\n animation ??= 'pulse'\r\n color ??= \"default\"\r\n let sxr: any = {}\r\n switch (animation) {\r\n case 'pulse':\r\n sxr = {\r\n bgcolor: \"divider.primary\",\r\n width: \"100%\",\r\n animation: 'skpulse 1.5s infinite',\r\n \"@keyframes skpulse\": {\r\n '0%, 100%': {\r\n opacity: 1,\r\n },\r\n '50%': {\r\n opacity: 0.4,\r\n },\r\n }\r\n }\r\n break;\r\n case 'wave':\r\n sxr = {\r\n position: 'relative',\r\n overflow: 'hidden',\r\n bgcolor: \"divider.primary\",\r\n \"&::after\": {\r\n content: '\"\"',\r\n position: 'absolute',\r\n top: 0,\r\n left: \"0%\",\r\n width: '100%',\r\n height: '100%',\r\n animation: 'skwave 2s infinite',\r\n background: `linear-gradient(90deg, transparent 0%, var(--color-divider-secondary) 50%, transparent 100%)`,\r\n },\r\n \"@keyframes skwave\": {\r\n '0%': { left: '-100%' },\r\n '100%': { left: '100%' }\r\n }\r\n }\r\n break;\r\n }\r\n return (\r\n <Tag\r\n {...props}\r\n baseClass='skeleton'\r\n ref={ref}\r\n sxr={sxr}\r\n />\r\n )\r\n }\r\n\r\n return children\r\n})\r\n\r\nexport default Skeleton\r\n\r\n"],"names":["_jsx"],"mappings":";;;;;AAQA,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAmE,EAAE,GAAmB,KAAI;AAA5F,IAAA,IAAA,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAA8B,EAAzB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA/C,CAAA,UAAA,EAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAiD,CAAF;AAEnH,IAAA,IAAI,CAAC,QAAQ;QAAE,OAAO,GAAG,IAAI;IAE7B,IAAI,OAAO,EAAE;QACV,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAT,SAAS,IAAT,SAAS,GAAK,OAAO,CAAA;QACrB,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,MAAA,GAAL,KAAK,IAAL,KAAK,GAAK,SAAS,CAAA;QACnB,IAAI,GAAG,GAAQ,EAAE;QACjB,QAAQ,SAAS;AACd,YAAA,KAAK,OAAO;AACT,gBAAA,GAAG,GAAG;AACH,oBAAA,OAAO,EAAE,iBAAiB;AAC1B,oBAAA,KAAK,EAAE,MAAM;AACb,oBAAA,SAAS,EAAE,uBAAuB;AAClC,oBAAA,oBAAoB,EAAE;AACnB,wBAAA,UAAU,EAAE;AACT,4BAAA,OAAO,EAAE,CAAC;AACZ,yBAAA;AACD,wBAAA,KAAK,EAAE;AACJ,4BAAA,OAAO,EAAE,GAAG;AACd,yBAAA;AACH;iBACH;gBACD;AACH,YAAA,KAAK,MAAM;AACR,gBAAA,GAAG,GAAG;AACH,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,QAAQ,EAAE,QAAQ;AAClB,oBAAA,OAAO,EAAE,iBAAiB;AAC1B,oBAAA,UAAU,EAAE;AACT,wBAAA,OAAO,EAAE,IAAI;AACb,wBAAA,QAAQ,EAAE,UAAU;AACpB,wBAAA,GAAG,EAAE,CAAC;AACN,wBAAA,IAAI,EAAE,IAAI;AACV,wBAAA,KAAK,EAAE,MAAM;AACb,wBAAA,MAAM,EAAE,MAAM;AACd,wBAAA,SAAS,EAAE,oBAAoB;AAC/B,wBAAA,UAAU,EAAE,CAAA,4FAAA,CAA8F;AAC5G,qBAAA;AACD,oBAAA,mBAAmB,EAAE;AAClB,wBAAA,IAAI,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;AACvB,wBAAA,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM;AACxB;iBACH;gBACD;;AAEN,QAAA,QACGA,GAAA,CAAC,GAAG,oBACG,KAAK,EAAA,EACT,SAAS,EAAC,UAAU,EACpB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EAAA,CAAA,CACT;IAER;AAEA,IAAA,OAAO,QAAQ;AAClB,CAAC;;;;"}
|
package/Stack/index.mjs
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Tag } from '@xanui/core';
|
|
5
|
-
|
|
6
|
-
const Stack = React.forwardRef((_a, ref) => {
|
|
7
|
-
var { children } = _a, props = __rest(_a, ["children"]);
|
|
8
|
-
return (jsx(Tag, Object.assign({}, props, { sxr: {
|
|
9
|
-
display: "flex",
|
|
10
|
-
flexDirection: "column",
|
|
11
|
-
}, baseClass: 'stack', ref: ref, children: children })));
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
export { Stack as default };
|
|
15
|
-
//# sourceMappingURL=index.mjs.map
|
package/Stack/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Stack/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type StackProps<T extends TagComponentType = \"div\"> = TagProps<T>\r\n\r\nconst Stack = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: StackProps<T>, ref?: React.Ref<any>) => {\r\n return (\r\n <Tag\r\n {...props}\r\n sxr={{\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n }}\r\n baseClass='stack'\r\n ref={ref}\r\n >{children}</Tag>\r\n )\r\n})\r\n\r\nexport default Stack\r\n"],"names":["_jsx"],"mappings":";;;;;AAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAqC,EAAE,GAAoB,KAAI;AAA/D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA2B,EAAtB,KAAK,GAAA,MAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;AACpF,IAAA,QACIA,GAAA,CAAC,GAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAE;AACD,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,aAAa,EAAE,QAAQ;SAC1B,EACD,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC;;;;"}
|
package/Switch/index.mjs
DELETED
|
@@ -1,77 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { __rest } from 'tslib';
|
|
3
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
4
|
-
import React, { useState } from 'react';
|
|
5
|
-
import { useInterface, useBreakpointProps, Tag } from '@xanui/core';
|
|
6
|
-
|
|
7
|
-
const Switch = React.forwardRef((props, ref) => {
|
|
8
|
-
var _a, _b;
|
|
9
|
-
let [_c] = useInterface("Switch", props, {}), { size, checked, color, disabled, icon, onChange, trackSize, slotProps } = _c, rest = __rest(_c, ["size", "checked", "color", "disabled", "icon", "onChange", "trackSize", "slotProps"]);
|
|
10
|
-
const _p = {};
|
|
11
|
-
if (size)
|
|
12
|
-
_p.size = size;
|
|
13
|
-
if (color)
|
|
14
|
-
_p.color = color;
|
|
15
|
-
if (disabled)
|
|
16
|
-
_p.disabled = disabled;
|
|
17
|
-
if (trackSize)
|
|
18
|
-
_p.trackSize = trackSize;
|
|
19
|
-
if (icon)
|
|
20
|
-
_p.icon = icon;
|
|
21
|
-
const p = useBreakpointProps(_p);
|
|
22
|
-
size = (_a = p.size) !== null && _a !== void 0 ? _a : "medium";
|
|
23
|
-
color = (_b = p.color) !== null && _b !== void 0 ? _b : "brand";
|
|
24
|
-
disabled = p.disabled;
|
|
25
|
-
trackSize = p.trackSize;
|
|
26
|
-
icon = p.icon;
|
|
27
|
-
const [c, set] = useState(false);
|
|
28
|
-
checked !== null && checked !== void 0 ? checked : (checked = c);
|
|
29
|
-
onChange = onChange || (() => set(!c));
|
|
30
|
-
let sizes = {
|
|
31
|
-
small: 32,
|
|
32
|
-
medium: 48,
|
|
33
|
-
large: 60
|
|
34
|
-
};
|
|
35
|
-
let _size = sizes[size] || size;
|
|
36
|
-
let height = (_size / 2);
|
|
37
|
-
trackSize !== null && trackSize !== void 0 ? trackSize : (trackSize = height + 4);
|
|
38
|
-
let isNormalSize = (height + 4) === trackSize;
|
|
39
|
-
let transform = checked ? "92%" : "8%";
|
|
40
|
-
if (!isNormalSize) {
|
|
41
|
-
transform = checked ? "100%" : "-10%";
|
|
42
|
-
}
|
|
43
|
-
return (jsxs(Tag, { disabled: disabled, sxr: {
|
|
44
|
-
width: _size,
|
|
45
|
-
height: height,
|
|
46
|
-
position: "relative",
|
|
47
|
-
cursor: "pointer",
|
|
48
|
-
display: "inline-block"
|
|
49
|
-
}, onClick: onChange, children: [jsx(Tag, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.track, { baseClass: 'switch-track-bar', sxr: {
|
|
50
|
-
width: _size,
|
|
51
|
-
height: trackSize,
|
|
52
|
-
borderRadius: height,
|
|
53
|
-
position: 'absolute',
|
|
54
|
-
top: "50%",
|
|
55
|
-
transform: "translateY(-50%)",
|
|
56
|
-
bgcolor: checked ? color : "divider",
|
|
57
|
-
} })), jsx(Tag, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.thumb, { baseClass: 'switch-thumb', sxr: {
|
|
58
|
-
transition: "all .25s",
|
|
59
|
-
width: height,
|
|
60
|
-
height: height,
|
|
61
|
-
radius: height,
|
|
62
|
-
bgcolor: "#FFFFFF",
|
|
63
|
-
position: "absolute",
|
|
64
|
-
top: "50%",
|
|
65
|
-
border: isNormalSize ? 0 : 1,
|
|
66
|
-
left: 0,
|
|
67
|
-
transform: `translate(${transform}, -50%)`,
|
|
68
|
-
display: "flex",
|
|
69
|
-
justifyContent: "center",
|
|
70
|
-
alignItems: "center"
|
|
71
|
-
}, children: icon })), jsx(Tag, Object.assign({}, rest, { component: 'input', ref: ref, type: "radio", readOnly: true, checked: checked, sxr: {
|
|
72
|
-
display: "none!important"
|
|
73
|
-
} }))] }));
|
|
74
|
-
});
|
|
75
|
-
|
|
76
|
-
export { Switch as default };
|
|
77
|
-
//# sourceMappingURL=index.mjs.map
|
package/Switch/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Switch/index.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { ReactElement, useState } from 'react';\r\nimport { Tag, TagProps, useBreakpointProps, UseColorTemplateColor, useInterface, useBreakpointPropsType } from '@xanui/core';\r\n\r\n\r\nexport type SwitchProps = Omit<TagProps<\"input\">, \"color\" | \"size\" | \"component\" | \"type\" | \"checked\"> & {\r\n checked?: boolean;\r\n size?: useBreakpointPropsType<number | \"small\" | \"medium\" | \"large\">;\r\n color?: useBreakpointPropsType<Omit<UseColorTemplateColor, \"default\">>;\r\n disabled?: useBreakpointPropsType<boolean>;\r\n trackSize?: useBreakpointPropsType<number>;\r\n icon?: useBreakpointPropsType<ReactElement>;\r\n slotProps?: {\r\n thumb?: Omit<TagProps, 'children'>;\r\n track?: Omit<TagProps, 'children'>;\r\n }\r\n}\r\n\r\nconst Switch = React.forwardRef((props: SwitchProps, ref?: React.Ref<any>) => {\r\n let [{ size, checked, color, disabled, icon, onChange, trackSize, slotProps, ...rest }] = useInterface<any>(\"Switch\", props, {})\r\n const _p: any = {}\r\n if (size) _p.size = size\r\n if (color) _p.color = color\r\n if (disabled) _p.disabled = disabled\r\n if (trackSize) _p.trackSize = trackSize\r\n if (icon) _p.icon = icon\r\n const p: any = useBreakpointProps(_p)\r\n size = p.size ?? \"medium\"\r\n color = p.color ?? \"brand\"\r\n disabled = p.disabled\r\n trackSize = p.trackSize\r\n icon = p.icon\r\n\r\n const [c, set] = useState(false)\r\n checked ??= c\r\n\r\n onChange = onChange || (() => set(!c));\r\n\r\n let sizes: any = {\r\n small: 32,\r\n medium: 48,\r\n large: 60\r\n }\r\n let _size = sizes[size as any] || size\r\n\r\n let height = (_size / 2)\r\n trackSize ??= height + 4\r\n let isNormalSize = (height + 4) === trackSize\r\n let transform = checked ? \"92%\" : \"8%\"\r\n if (!isNormalSize) {\r\n transform = checked ? \"100%\" : \"-10%\"\r\n }\r\n\r\n return (\r\n <Tag\r\n disabled={disabled}\r\n sxr={{\r\n width: _size,\r\n height: height,\r\n position: \"relative\",\r\n cursor: \"pointer\",\r\n display: \"inline-block\"\r\n }}\r\n onClick={onChange}\r\n >\r\n <Tag\r\n {...slotProps?.track}\r\n baseClass='switch-track-bar'\r\n sxr={{\r\n width: _size,\r\n height: trackSize,\r\n borderRadius: height,\r\n position: 'absolute',\r\n top: \"50%\",\r\n transform: \"translateY(-50%)\",\r\n bgcolor: checked ? color : \"divider\",\r\n\r\n }}\r\n >\r\n </Tag>\r\n <Tag\r\n {...slotProps?.thumb}\r\n baseClass='switch-thumb'\r\n sxr={{\r\n transition: \"all .25s\",\r\n width: height,\r\n height: height,\r\n radius: height,\r\n bgcolor: \"#FFFFFF\",\r\n position: \"absolute\",\r\n top: \"50%\",\r\n border: isNormalSize ? 0 : 1,\r\n left: 0,\r\n transform: `translate(${transform}, -50%)`,\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n alignItems: \"center\"\r\n }}\r\n >\r\n {\r\n icon\r\n }\r\n </Tag>\r\n <Tag\r\n {...rest}\r\n component='input'\r\n ref={ref}\r\n type=\"radio\"\r\n readOnly\r\n checked={checked}\r\n sxr={{\r\n display: \"none!important\"\r\n }}\r\n />\r\n </Tag>\r\n )\r\n})\r\n\r\nexport default Switch\r\n"],"names":[],"mappings":";;;;;;AAmBA;;AACI;;AAEA;AAAU;AACV;AAAW;AACX;AAAc;AACd;AAAe;AACf;AAAU;AACV;AACA;AACA;AACA;AACA;AACA;;;AAKA;AAEA;AACI;AACA;AACA;;;AAIJ;;;;;;;;AAYY;AACA;AACA;AACA;AACA;;AAQI;AACA;AACA;AACA;AACA;AACA;;AAGH;AAOG;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;;AAeA;;AAKpB;;"}
|
package/Tab/index.mjs
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { __rest } from 'tslib';
|
|
3
|
-
import { jsx } from 'react/jsx-runtime';
|
|
4
|
-
import React from 'react';
|
|
5
|
-
import { useInterface } from '@xanui/core';
|
|
6
|
-
import Button from '../Button/index.mjs';
|
|
7
|
-
|
|
8
|
-
const Tab = React.forwardRef((_a, ref) => {
|
|
9
|
-
var { children } = _a, props = __rest(_a, ["children"]);
|
|
10
|
-
let [_props] = useInterface("Tab", props, {});
|
|
11
|
-
return (jsx(Button, Object.assign({}, _props, { classNames: ["tab", ...((_props === null || _props === void 0 ? void 0 : _props.classNames) || [])], ref: ref, children: children })));
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
export { Tab as default };
|
|
15
|
-
//# sourceMappingURL=index.mjs.map
|
package/Tab/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Tab/index.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React from 'react'\r\nimport { TagComponentType, useInterface } from '@xanui/core';\r\nimport Button, { ButtonProps } from '../Button';\r\n\r\nexport type TabProps<T extends TagComponentType = \"button\"> = ButtonProps<T> & {\r\n value?: string | number\r\n}\r\n\r\nconst Tab = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: TabProps<T>, ref: React.Ref<any>) => {\r\n let [_props] = useInterface<any>(\"Tab\", props, {})\r\n return (\r\n <Button\r\n {..._props}\r\n classNames={[\"tab\", ...(_props?.classNames || [])]}\r\n ref={ref}\r\n >\r\n {children}\r\n </Button>\r\n )\r\n})\r\n\r\nexport default Tab"],"names":[],"mappings":";;;;;;;AAUA;AAAkE;AAC9D;AACA;AASJ;;"}
|
package/Table/index.mjs
DELETED
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { useInterface, useBreakpointProps, useColorTemplate, Tag } from '@xanui/core';
|
|
5
|
-
import Scrollbar from '../Scrollbar/index.mjs';
|
|
6
|
-
|
|
7
|
-
const Table = React.forwardRef((_a, ref) => {
|
|
8
|
-
var _b, _c, _d, _e;
|
|
9
|
-
var { children } = _a, props = __rest(_a, ["children"]);
|
|
10
|
-
let [_f] = useInterface("Table", props, {}), { evenColor, size, color, variant, borderType } = _f, rest = __rest(_f, ["evenColor", "size", "color", "variant", "borderType"]);
|
|
11
|
-
const _p = {};
|
|
12
|
-
if (evenColor)
|
|
13
|
-
_p.evenColor = evenColor;
|
|
14
|
-
if (size)
|
|
15
|
-
_p.size = size;
|
|
16
|
-
if (color)
|
|
17
|
-
_p.color = color;
|
|
18
|
-
if (variant)
|
|
19
|
-
_p.variant = variant;
|
|
20
|
-
if (borderType)
|
|
21
|
-
_p.borderType = borderType;
|
|
22
|
-
const p = useBreakpointProps(_p);
|
|
23
|
-
evenColor = p.evenColor;
|
|
24
|
-
size = (_b = p.size) !== null && _b !== void 0 ? _b : "medium";
|
|
25
|
-
color = (_c = p.color) !== null && _c !== void 0 ? _c : 'default';
|
|
26
|
-
variant = (_d = p.variant) !== null && _d !== void 0 ? _d : "fill";
|
|
27
|
-
borderType = (_e = p.borderType) !== null && _e !== void 0 ? _e : "line";
|
|
28
|
-
const main = useColorTemplate(color, variant);
|
|
29
|
-
const soft = useColorTemplate(color, "soft");
|
|
30
|
-
let sx = {};
|
|
31
|
-
if (evenColor) {
|
|
32
|
-
sx = {
|
|
33
|
-
"& tbody tr:nth-child(even)": {
|
|
34
|
-
bgcolor: soft.primary.bgcolor
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
}
|
|
38
|
-
if (borderType === 'box') {
|
|
39
|
-
sx = Object.assign(Object.assign({}, sx), { "& tr:last-child td": {
|
|
40
|
-
borderBottom: 0
|
|
41
|
-
}, "& tr:first-child th": {
|
|
42
|
-
borderTop: 0
|
|
43
|
-
}, "& tr td:first-child, & tr th:first-child": {
|
|
44
|
-
borderLeft: 0
|
|
45
|
-
}, "& tr td:last-child, & tr th:last-child": {
|
|
46
|
-
borderRight: 0
|
|
47
|
-
} });
|
|
48
|
-
}
|
|
49
|
-
let _size = size;
|
|
50
|
-
let sizes = {
|
|
51
|
-
small: .4,
|
|
52
|
-
medium: .8,
|
|
53
|
-
large: 2
|
|
54
|
-
};
|
|
55
|
-
if (typeof size === 'string' && sizes[size]) {
|
|
56
|
-
_size = sizes[size];
|
|
57
|
-
}
|
|
58
|
-
let border = {
|
|
59
|
-
line: {
|
|
60
|
-
borderBottom: "1px solid",
|
|
61
|
-
borderColor: "divider",
|
|
62
|
-
},
|
|
63
|
-
box: {
|
|
64
|
-
border: "1px solid",
|
|
65
|
-
borderColor: "divider",
|
|
66
|
-
},
|
|
67
|
-
none: {}
|
|
68
|
-
};
|
|
69
|
-
return (jsx(Scrollbar, { style: {
|
|
70
|
-
overflowY: "hidden"
|
|
71
|
-
}, children: jsx(Tag, Object.assign({}, rest, { baseClass: 'table', sxr: Object.assign(Object.assign({ color: "text.primary", fontSize: size === "small" ? "text" : "text", width: "100%", "& thead, & tfoot": {
|
|
72
|
-
bgcolor: main.primary.bgcolor,
|
|
73
|
-
"& th": {
|
|
74
|
-
color: main.primary.color
|
|
75
|
-
}
|
|
76
|
-
}, "& td, & th": Object.assign({ p: _size, px: 1 }, border[borderType]), "& tr:last-child td": {
|
|
77
|
-
borderBottom: 0
|
|
78
|
-
}, "& tr:first-child th": {
|
|
79
|
-
borderTop: 0
|
|
80
|
-
}, "& tbody tr:hover": {
|
|
81
|
-
bgcolor: soft.primary.bgcolor
|
|
82
|
-
} }, sx), (rest.sx || {})), component: "table", ref: ref, children: children })) }));
|
|
83
|
-
});
|
|
84
|
-
|
|
85
|
-
export { Table as default };
|
|
86
|
-
//# sourceMappingURL=index.mjs.map
|
package/Table/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Table/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType, UseColorTemplateColor, useInterface, useColorTemplate, UseColorTemplateType, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\r\nimport Scrollbar from '../Scrollbar';\r\n\r\n\r\nexport type TableProps<T extends TagComponentType = \"table\"> = Omit<TagProps<T>, \"color\" | \"size\"> & {\r\n evenColor?: useBreakpointPropsType<boolean>;\r\n size?: useBreakpointPropsType<\"small\" | \"medium\" | \"large\" | number>;\r\n color?: useBreakpointPropsType<UseColorTemplateColor>;\r\n variant?: useBreakpointPropsType<Omit<UseColorTemplateType, \"outline\">>;\r\n borderType?: useBreakpointPropsType<\"box\" | \"line\" | \"none\">;\r\n}\r\n\r\nconst Table = React.forwardRef(<T extends TagComponentType = \"table\">({ children, ...props }: TableProps<T>, ref: React.Ref<any>) => {\r\n let [{ evenColor, size, color, variant, borderType, ...rest }] = useInterface<any>(\"Table\", props, {})\r\n const _p: any = {}\r\n if (evenColor) _p.evenColor = evenColor\r\n if (size) _p.size = size\r\n if (color) _p.color = color\r\n if (variant) _p.variant = variant\r\n if (borderType) _p.borderType = borderType\r\n const p: any = useBreakpointProps(_p)\r\n evenColor = p.evenColor\r\n size = p.size ?? \"medium\"\r\n color = p.color ?? 'default'\r\n variant = p.variant ?? \"fill\"\r\n borderType = p.borderType ?? \"line\"\r\n\r\n const main = useColorTemplate(color, variant)\r\n const soft = useColorTemplate(color, \"soft\")\r\n\r\n let sx: any = {}\r\n if (evenColor) {\r\n sx = {\r\n \"& tbody tr:nth-child(even)\": {\r\n bgcolor: soft.primary.bgcolor\r\n }\r\n }\r\n }\r\n if (borderType === 'box') {\r\n sx = {\r\n ...sx,\r\n \"& tr:last-child td\": {\r\n borderBottom: 0\r\n },\r\n \"& tr:first-child th\": {\r\n borderTop: 0\r\n },\r\n \"& tr td:first-child, & tr th:first-child\": {\r\n borderLeft: 0\r\n },\r\n \"& tr td:last-child, & tr th:last-child\": {\r\n borderRight: 0\r\n },\r\n }\r\n }\r\n let _size = size\r\n let sizes: any = {\r\n small: .4,\r\n medium: .8,\r\n large: 2\r\n }\r\n\r\n if (typeof size === 'string' && sizes[size]) {\r\n _size = sizes[size]\r\n }\r\n let border: any = {\r\n line: {\r\n borderBottom: \"1px solid\",\r\n borderColor: \"divider\",\r\n },\r\n box: {\r\n border: \"1px solid\",\r\n borderColor: \"divider\",\r\n },\r\n none: {}\r\n }\r\n\r\n return (\r\n <Scrollbar\r\n style={{\r\n overflowY: \"hidden\"\r\n }}\r\n >\r\n <Tag\r\n {...rest}\r\n baseClass='table'\r\n sxr={{\r\n color: \"text.primary\",\r\n fontSize: size === \"small\" ? \"text\" : \"text\",\r\n width: \"100%\",\r\n \"& thead, & tfoot\": {\r\n bgcolor: main.primary.bgcolor,\r\n \"& th\": {\r\n color: main.primary.color\r\n }\r\n },\r\n \"& td, & th\": {\r\n p: _size,\r\n px: 1,\r\n ...border[borderType],\r\n },\r\n \"& tr:last-child td\": {\r\n borderBottom: 0\r\n },\r\n \"& tr:first-child th\": {\r\n borderTop: 0\r\n },\r\n \"& tbody tr:hover\": {\r\n bgcolor: soft.primary.bgcolor\r\n },\r\n ...sx,\r\n ...((rest as any).sx || {})\r\n }}\r\n component=\"table\"\r\n ref={ref}\r\n >{children}</Tag>\r\n </Scrollbar>\r\n )\r\n})\r\n\r\nexport default Table"],"names":["_jsx"],"mappings":"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"}
|
package/TableBody/index.mjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Tag } from '@xanui/core';
|
|
5
|
-
|
|
6
|
-
const TableBody = React.forwardRef((_a, ref) => {
|
|
7
|
-
var { children } = _a, rest = __rest(_a, ["children"]);
|
|
8
|
-
return (jsx(Tag, Object.assign({}, rest, { baseClass: 'table-body', component: "tbody", ref: ref, children: children })));
|
|
9
|
-
});
|
|
10
|
-
|
|
11
|
-
export { TableBody as default };
|
|
12
|
-
//# sourceMappingURL=index.mjs.map
|
package/TableBody/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/TableBody/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type TableBodyProps<T extends TagComponentType = \"tbody\"> = TagProps<T>\r\n\r\nconst TableBody = React.forwardRef(<T extends TagComponentType = \"tbody\">({ children, ...rest }: TableBodyProps<T>, ref: React.Ref<any>) => {\r\n return (\r\n <Tag\r\n {...rest}\r\n baseClass='table-body'\r\n component=\"tbody\"\r\n ref={ref}\r\n >{children}</Tag>\r\n )\r\n})\r\n\r\nexport default TableBody"],"names":["_jsx"],"mappings":";;;;;AAMA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAuC,EAAwC,EAAE,GAAmB,KAAI;AAAjE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA8B,EAAzB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACzF,QACIA,IAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,IAAI,EAAA,EACR,SAAS,EAAC,YAAY,EACtB,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC;;;;"}
|
package/TableCell/index.mjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Tag } from '@xanui/core';
|
|
5
|
-
|
|
6
|
-
const TableCell = React.forwardRef((_a, ref) => {
|
|
7
|
-
var { children, th } = _a, rest = __rest(_a, ["children", "th"]);
|
|
8
|
-
return (jsx(Tag, Object.assign({}, rest, { sxr: Object.assign({ verticalAlign: "inherit", textAlign: "left", fontSize: "inherit", color: "text.primary" }, ((rest === null || rest === void 0 ? void 0 : rest.sx) || {})), baseClass: 'table-cell', component: th ? "th" : "td", ref: ref, children: children })));
|
|
9
|
-
});
|
|
10
|
-
|
|
11
|
-
export { TableCell as default };
|
|
12
|
-
//# sourceMappingURL=index.mjs.map
|
package/TableCell/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/TableCell/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type TableColumnProps<T extends TagComponentType = \"td\"> = TagProps<T> & {\r\n th?: boolean\r\n}\r\n\r\nconst TableCell = React.forwardRef(<T extends TagComponentType = \"td\">({ children, th, ...rest }: TableColumnProps<T>, ref: React.Ref<any>) => {\r\n return (\r\n <Tag\r\n {...rest}\r\n sxr={{\r\n verticalAlign: \"inherit\",\r\n textAlign: \"left\",\r\n fontSize: \"inherit\",\r\n color: \"text.primary\",\r\n ...((rest as any)?.sx || {})\r\n }}\r\n baseClass='table-cell'\r\n component={th ? \"th\" : \"td\"} ref={ref}\r\n >\r\n {children}\r\n </Tag>\r\n )\r\n})\r\n\r\nexport default TableCell"],"names":["_jsx"],"mappings":";;;;;AAQA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAoC,EAA8C,EAAE,GAAmB,KAAI;QAAvE,EAAE,QAAQ,EAAE,EAAE,EAAA,GAAA,EAAgC,EAA3B,IAAI,GAAA,MAAA,CAAA,EAAA,EAAvB,kBAAyB,CAAF;AAC1F,IAAA,QACIA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,aAAa,EAAE,SAAS,EACxB,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,SAAS,EACnB,KAAK,EAAE,cAAc,EAAA,GACjB,CAAC,IAAY,KAAA,IAAA,IAAZ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAU,EAAE,KAAI,EAAE,EAAC,EAEhC,SAAS,EAAC,YAAY,EACtB,SAAS,EAAE,EAAE,GAAG,IAAI,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,EAAA,QAAA,EAEpC,QAAQ,EAAA,CAAA,CACP;AAEd,CAAC;;;;"}
|
package/TableFooter/index.mjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Tag } from '@xanui/core';
|
|
5
|
-
|
|
6
|
-
const TableFooter = React.forwardRef((_a, ref) => {
|
|
7
|
-
var { children } = _a, rest = __rest(_a, ["children"]);
|
|
8
|
-
return (jsx(Tag, Object.assign({}, rest, { baseClass: 'table-footer', component: "tfoot", ref: ref, children: children })));
|
|
9
|
-
});
|
|
10
|
-
|
|
11
|
-
export { TableFooter as default };
|
|
12
|
-
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/TableFooter/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type TableFooterProps<T extends TagComponentType = \"tfoot\"> = TagProps<T>\r\n\r\nconst TableFooter = React.forwardRef(<T extends TagComponentType = \"tfoot\">({ children, ...rest }: TableFooterProps<T>, ref: React.Ref<any>) => {\r\n return (\r\n <Tag\r\n {...rest}\r\n baseClass='table-footer'\r\n component=\"tfoot\"\r\n ref={ref}\r\n >{children}</Tag>\r\n )\r\n})\r\n\r\nexport default TableFooter"],"names":["_jsx"],"mappings":";;;;;AAMA,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAAC,CAAuC,EAA0C,EAAE,GAAmB,KAAI;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IAC3F,QACIA,IAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,IAAI,EAAA,EACR,SAAS,EAAC,cAAc,EACxB,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC;;;;"}
|
package/TableHead/index.mjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Tag } from '@xanui/core';
|
|
5
|
-
|
|
6
|
-
const TableHead = React.forwardRef((_a, ref) => {
|
|
7
|
-
var { children } = _a, rest = __rest(_a, ["children"]);
|
|
8
|
-
return (jsx(Tag, Object.assign({}, rest, { baseClass: 'table-head', component: "thead", ref: ref, children: children })));
|
|
9
|
-
});
|
|
10
|
-
|
|
11
|
-
export { TableHead as default };
|
|
12
|
-
//# sourceMappingURL=index.mjs.map
|
package/TableHead/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/TableHead/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type TableHeadProps<T extends TagComponentType = \"thead\"> = TagProps<T>\r\n\r\nconst TableHead = React.forwardRef(<T extends TagComponentType = \"thead\">({ children, ...rest }: TableHeadProps<T>, ref: React.Ref<any>) => {\r\n return (\r\n <Tag\r\n {...rest}\r\n baseClass='table-head'\r\n component=\"thead\"\r\n ref={ref}\r\n >{children}</Tag>\r\n )\r\n})\r\n\r\nexport default TableHead "],"names":["_jsx"],"mappings":";;;;;AAMA,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAuC,EAAwC,EAAE,GAAmB,KAAI;AAAjE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA8B,EAAzB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACzF,QACIA,IAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACI,IAAI,EAAA,EACR,SAAS,EAAC,YAAY,EACtB,SAAS,EAAC,OAAO,EACjB,GAAG,EAAE,GAAG,EAAA,QAAA,EACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC;;;;"}
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { __rest } from 'tslib';
|
|
3
|
-
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
4
|
-
import Text from '../Text/index.mjs';
|
|
5
|
-
import Select from '../Select/index.mjs';
|
|
6
|
-
import Option from '../Option/index.mjs';
|
|
7
|
-
import IconButton from '../IconButton/index.mjs';
|
|
8
|
-
import React, { useMemo } from 'react';
|
|
9
|
-
import IconKeyboardArrowLeft from '@xanui/icons/KeyboardArrowLeft';
|
|
10
|
-
import IconKeyboardArrowRight from '@xanui/icons/KeyboardArrowRight';
|
|
11
|
-
import { useInterface, Tag } from '@xanui/core';
|
|
12
|
-
|
|
13
|
-
const TablePagination = React.forwardRef((_a, ref) => {
|
|
14
|
-
var { page, total, perpage, onChange } = _a, rest = __rest(_a, ["page", "total", "perpage", "onChange"]);
|
|
15
|
-
let [_b] = useInterface("TablePagination", rest, {}), { perpages, color, variant, slotProps } = _b, props = __rest(_b, ["perpages", "color", "variant", "slotProps"]);
|
|
16
|
-
color !== null && color !== void 0 ? color : (color = "default");
|
|
17
|
-
variant !== null && variant !== void 0 ? variant : (variant = "fill");
|
|
18
|
-
perpages !== null && perpages !== void 0 ? perpages : (perpages = [30, 50, 100]);
|
|
19
|
-
perpage = perpage || perpages[0];
|
|
20
|
-
const isPerpage = perpages[0] && perpages.length >= 1;
|
|
21
|
-
const chunks = useMemo(() => {
|
|
22
|
-
const chunks = [];
|
|
23
|
-
let _page = 1;
|
|
24
|
-
for (let from = 0; from < total; from += perpage) {
|
|
25
|
-
const to = Math.min(from + perpage, total);
|
|
26
|
-
chunks[_page] = { from: from + 1, to, page: _page, perpage };
|
|
27
|
-
_page++;
|
|
28
|
-
}
|
|
29
|
-
return chunks;
|
|
30
|
-
}, [perpage, perpages, total]);
|
|
31
|
-
if (!chunks.length) {
|
|
32
|
-
return jsx(Fragment, {});
|
|
33
|
-
}
|
|
34
|
-
const current = chunks[page] || chunks[1];
|
|
35
|
-
const hasNext = !!chunks[page + 1];
|
|
36
|
-
const hasPrev = !!chunks[page - 1];
|
|
37
|
-
return (jsxs(Tag, Object.assign({}, props, { sxr: {
|
|
38
|
-
display: "flex",
|
|
39
|
-
flexDirection: "row",
|
|
40
|
-
gap: 1,
|
|
41
|
-
alignItems: "center"
|
|
42
|
-
}, baseClass: 'table-pagination', ref: ref, children: [isPerpage && jsxs(Tag, { baseClass: 'table-pagination-perpage', flexBox: true, flexRow: true, gap: 1, alignItems: "center", children: [jsx(Text, { fontSize: "button", children: "PER PAGE" }), jsx(Select, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.select, { width: (perpage.toString().length * 10) + 60, minWidth: "auto", maxWidth: "auto", value: perpage, onChange: (value) => {
|
|
43
|
-
onChange && onChange({ page: 1, perpage: value, from: 1, to: Math.min(value, total) });
|
|
44
|
-
}, children: perpages.map((p) => jsx(Option, { value: p, children: p }, p)) }))] }), jsxs(Tag, { sxr: {
|
|
45
|
-
display: "flex",
|
|
46
|
-
flexDirection: "row",
|
|
47
|
-
gap: 1,
|
|
48
|
-
alignItems: 'center'
|
|
49
|
-
}, children: [jsxs(Text, { fontSize: "button", children: [current === null || current === void 0 ? void 0 : current.from, "-", current.to] }), jsx(Text, { color: "text.secondary", children: "of" }), jsx(Text, { fontSize: "button", children: total })] }), jsxs(Tag, { baseClass: 'table-pagination-navigation', flexBox: true, flexRow: true, gap: .4, children: [jsx(IconButton, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.button, { color: color, variant: variant, size: 30, disabled: !hasPrev, onClick: () => {
|
|
50
|
-
onChange && onChange(chunks[page - 1]);
|
|
51
|
-
}, children: jsx(IconKeyboardArrowLeft, {}) })), jsx(IconButton, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.button, { color: color, variant: variant, size: 30, disabled: !hasNext, onClick: () => {
|
|
52
|
-
onChange && onChange(chunks[page + 1]);
|
|
53
|
-
}, children: jsx(IconKeyboardArrowRight, {}) }))] })] })));
|
|
54
|
-
});
|
|
55
|
-
|
|
56
|
-
export { TablePagination as default };
|
|
57
|
-
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/TablePagination/index.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport Text from '../Text'\r\nimport Select, { SelectProps } from '../Select'\r\nimport Option from '../Option'\r\nimport IconButton, { IconButtonProps } from '../IconButton'\r\nimport React, { useMemo } from 'react'\r\nimport PrevIcon from '@xanui/icons/KeyboardArrowLeft'\r\nimport NextIcon from '@xanui/icons/KeyboardArrowRight'\r\nimport { TagProps, Tag, useInterface, UseColorTemplateColor, UseColorTemplateType, useBreakpointPropsType } from '@xanui/core';\r\n\r\n\r\nexport type TablePaginationState = { page: number, perpage: number, from: number, to: number }\r\nexport type TablePaginationProps = Omit<TagProps, \"children\" | \"onChange\"> & {\r\n page: number;\r\n total: number;\r\n perpage?: number;\r\n perpages?: number[];\r\n color?: useBreakpointPropsType<UseColorTemplateColor>;\r\n variant?: useBreakpointPropsType<UseColorTemplateType>;\r\n onChange?: (state: TablePaginationState) => void;\r\n\r\n slotProps?: {\r\n button?: Omit<IconButtonProps, \"children\" | \"color\" | \"variant\">;\r\n select?: Omit<SelectProps, \"value\" | \"onChange\" | \"children\">;\r\n }\r\n}\r\n\r\nconst TablePagination = React.forwardRef(({ page, total, perpage, onChange, ...rest }: TablePaginationProps, ref: React.Ref<any>) => {\r\n let [{ perpages, color, variant, slotProps, ...props }] = useInterface<any>(\"TablePagination\", rest, {})\r\n color ??= \"default\"\r\n variant ??= \"fill\"\r\n perpages ??= [30, 50, 100]\r\n perpage = perpage || perpages[0] as number\r\n const isPerpage = perpages[0] && perpages.length >= 1\r\n\r\n\r\n const chunks = useMemo(() => {\r\n const chunks: any = [];\r\n let _page = 1;\r\n for (let from = 0; from < total; from += perpage) {\r\n const to = Math.min(from + perpage, total)\r\n chunks[_page] = { from: from + 1, to, page: _page, perpage }\r\n _page++\r\n }\r\n return chunks\r\n }, [perpage, perpages, total])\r\n\r\n if (!chunks.length) {\r\n return <></>\r\n }\r\n\r\n const current = chunks[page] || chunks[1]\r\n const hasNext = !!chunks[page + 1]\r\n const hasPrev = !!chunks[page - 1]\r\n\r\n return (\r\n <Tag\r\n {...props}\r\n sxr={{\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n gap: 1,\r\n alignItems: \"center\"\r\n }}\r\n baseClass='table-pagination'\r\n ref={ref}\r\n >\r\n {\r\n isPerpage && <Tag baseClass='table-pagination-perpage' flexBox flexRow gap={1} alignItems=\"center\">\r\n <Text fontSize=\"button\">PER PAGE</Text>\r\n <Select\r\n {...slotProps?.select}\r\n width={(perpage.toString().length * 10) + 60}\r\n minWidth={\"auto\"}\r\n maxWidth={\"auto\"}\r\n value={perpage}\r\n onChange={(value: any) => {\r\n onChange && onChange({ page: 1, perpage: value, from: 1, to: Math.min(value, total) })\r\n }}\r\n >\r\n {perpages.map((p: number) => <Option key={p} value={p}>{p}</Option>)}\r\n </Select>\r\n </Tag>\r\n }\r\n <Tag\r\n sxr={{\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n gap: 1,\r\n alignItems: 'center'\r\n }}\r\n >\r\n <Text fontSize=\"button\">{current?.from}-{current.to}</Text>\r\n <Text color=\"text.secondary\">of</Text>\r\n <Text fontSize=\"button\">{total}</Text>\r\n </Tag>\r\n <Tag baseClass='table-pagination-navigation' flexBox flexRow gap={.4} >\r\n <IconButton\r\n {...slotProps?.button}\r\n color={color}\r\n variant={variant}\r\n size={30}\r\n disabled={!hasPrev}\r\n onClick={() => {\r\n onChange && onChange(chunks[page - 1]);\r\n }}\r\n >\r\n <PrevIcon />\r\n </IconButton>\r\n <IconButton\r\n {...slotProps?.button}\r\n color={color}\r\n variant={variant}\r\n size={30}\r\n disabled={!hasNext}\r\n onClick={() => {\r\n onChange && onChange(chunks[page + 1]);\r\n }}\r\n >\r\n <NextIcon />\r\n </IconButton>\r\n </Tag>\r\n </Tag>\r\n )\r\n})\r\n\r\nexport default TablePagination"],"names":[],"mappings":";;;;;;;;;;;;AA4BA;AAA0C;;;;AAItC;AACA;AACA;AAGA;;;AAGI;AACI;AACA;AACA;;AAEJ;;AAGJ;AACI;;;;;AAOJ;AAIY;AACA;AACA;AACA;AACH;AAce;AACJ;AAQJ;AACA;AACA;AACA;AACH;;AAeG;;;AAmBpB;;"}
|
package/TableRow/index.mjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { __rest } from 'tslib';
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
3
|
-
import React from 'react';
|
|
4
|
-
import { Tag } from '@xanui/core';
|
|
5
|
-
|
|
6
|
-
const TableRow = React.forwardRef((_a, ref) => {
|
|
7
|
-
var { children } = _a, rest = __rest(_a, ["children"]);
|
|
8
|
-
return (jsx(Tag, Object.assign({ baseClass: 'table-row', verticalAlign: "middle" }, rest, { component: "tr", ref: ref, children: children })));
|
|
9
|
-
});
|
|
10
|
-
|
|
11
|
-
export { TableRow as default };
|
|
12
|
-
//# sourceMappingURL=index.mjs.map
|
package/TableRow/index.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/TableRow/index.tsx"],"sourcesContent":["\r\nimport React from 'react';\r\nimport { Tag, TagProps, TagComponentType } from '@xanui/core';\r\n\r\nexport type TableRowProps<T extends TagComponentType = \"tr\"> = TagProps<T>\r\n\r\nconst TableRow = React.forwardRef(<T extends TagComponentType = \"tr\">({ children, ...rest }: TableRowProps<T>, ref: React.Ref<any>) => {\r\n return (\r\n <Tag\r\n baseClass='table-row'\r\n verticalAlign=\"middle\"\r\n {...rest}\r\n component=\"tr\"\r\n ref={ref}>{children}</Tag>\r\n )\r\n})\r\n\r\nexport default TableRow"],"names":["_jsx"],"mappings":";;;;;AAMA,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,CAAoC,EAAuC,EAAE,GAAmB,KAAI;AAAhE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA6B,EAAxB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;IACrF,QACIA,GAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,WAAW,EACrB,aAAa,EAAC,QAAQ,EAAA,EAClB,IAAI,EAAA,EACR,SAAS,EAAC,IAAI,EACd,GAAG,EAAE,GAAG,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAA,CAAO;AAEtC,CAAC;;;;"}
|