@xanui/ui 1.0.0 → 1.1.0
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 +7 -7
- package/Accordion/index.js.map +1 -1
- package/Accordion/index.mjs +7 -7
- package/Accordion/index.mjs.map +1 -1
- package/Alert/index.js +10 -10
- package/Alert/index.js.map +1 -1
- package/Alert/index.mjs +10 -10
- package/Alert/index.mjs.map +1 -1
- package/Avatar/index.js +1 -1
- package/Avatar/index.js.map +1 -1
- package/Avatar/index.mjs +1 -1
- package/Avatar/index.mjs.map +1 -1
- package/Badge/index.js +1 -1
- package/Badge/index.js.map +1 -1
- package/Badge/index.mjs +1 -1
- package/Badge/index.mjs.map +1 -1
- package/Box/index.js +1 -1
- package/Box/index.js.map +1 -1
- package/Box/index.mjs +1 -1
- package/Box/index.mjs.map +1 -1
- package/Button/index.js +5 -4
- package/Button/index.js.map +1 -1
- package/Button/index.mjs +4 -3
- package/Button/index.mjs.map +1 -1
- package/ButtonGroup/index.js +1 -1
- package/ButtonGroup/index.js.map +1 -1
- package/ButtonGroup/index.mjs +1 -1
- package/ButtonGroup/index.mjs.map +1 -1
- package/Calendar/index.js +17 -17
- package/Calendar/index.js.map +1 -1
- package/Calendar/index.mjs +17 -17
- package/Calendar/index.mjs.map +1 -1
- package/CalendarInput/index.js +3 -3
- package/CalendarInput/index.js.map +1 -1
- package/CalendarInput/index.mjs +3 -3
- package/CalendarInput/index.mjs.map +1 -1
- package/Checkbox/index.js +2 -2
- package/Checkbox/index.js.map +1 -1
- package/Checkbox/index.mjs +2 -2
- package/Checkbox/index.mjs.map +1 -1
- package/Chip/index.js +2 -2
- package/Chip/index.js.map +1 -1
- package/Chip/index.mjs +2 -2
- package/Chip/index.mjs.map +1 -1
- package/CircleProgress/index.js +5 -5
- package/CircleProgress/index.js.map +1 -1
- package/CircleProgress/index.mjs +5 -5
- package/CircleProgress/index.mjs.map +1 -1
- package/ClickOutside/index.js +1 -1
- package/ClickOutside/index.js.map +1 -1
- package/ClickOutside/index.mjs +1 -1
- package/ClickOutside/index.mjs.map +1 -1
- package/Collaps/index.js +2 -4
- package/Collaps/index.js.map +1 -1
- package/Collaps/index.mjs +2 -4
- package/Collaps/index.mjs.map +1 -1
- package/Container/index.js +1 -1
- package/Container/index.js.map +1 -1
- package/Container/index.mjs +1 -1
- package/Container/index.mjs.map +1 -1
- package/Datatable/FilterBox.js +6 -6
- package/Datatable/FilterBox.js.map +1 -1
- package/Datatable/FilterBox.mjs +6 -6
- package/Datatable/FilterBox.mjs.map +1 -1
- package/Datatable/Row.js +8 -8
- package/Datatable/Row.js.map +1 -1
- package/Datatable/Row.mjs +8 -8
- package/Datatable/Row.mjs.map +1 -1
- package/Datatable/SelectedBox.js +2 -2
- package/Datatable/SelectedBox.js.map +1 -1
- package/Datatable/SelectedBox.mjs +2 -2
- package/Datatable/SelectedBox.mjs.map +1 -1
- package/Datatable/Table.js +3 -3
- package/Datatable/Table.js.map +1 -1
- package/Datatable/Table.mjs +3 -3
- package/Datatable/Table.mjs.map +1 -1
- package/Datatable/TableHead.js +3 -3
- package/Datatable/TableHead.js.map +1 -1
- package/Datatable/TableHead.mjs +3 -3
- package/Datatable/TableHead.mjs.map +1 -1
- package/Datatable/index.js +4 -4
- package/Datatable/index.js.map +1 -1
- package/Datatable/index.mjs +4 -4
- package/Datatable/index.mjs.map +1 -1
- package/Divider/index.js +1 -1
- package/Divider/index.js.map +1 -1
- package/Divider/index.mjs +1 -1
- package/Divider/index.mjs.map +1 -1
- package/Drawer/index.js +4 -4
- package/Drawer/index.js.map +1 -1
- package/Drawer/index.mjs +4 -4
- package/Drawer/index.mjs.map +1 -1
- package/Form/index.js +1 -1
- package/Form/index.js.map +1 -1
- package/Form/index.mjs +1 -1
- package/Form/index.mjs.map +1 -1
- package/GridContainer/index.js +1 -1
- package/GridContainer/index.js.map +1 -1
- package/GridContainer/index.mjs +1 -1
- package/GridContainer/index.mjs.map +1 -1
- package/GridItem/index.js +1 -1
- package/GridItem/index.js.map +1 -1
- package/GridItem/index.mjs +1 -1
- package/GridItem/index.mjs.map +1 -1
- package/IconButton/index.js +1 -1
- package/IconButton/index.js.map +1 -1
- package/IconButton/index.mjs +1 -1
- package/IconButton/index.mjs.map +1 -1
- package/Image/index.js +1 -1
- package/Image/index.js.map +1 -1
- package/Image/index.mjs +1 -1
- package/Image/index.mjs.map +1 -1
- package/Input/index.js +6 -6
- package/Input/index.js.map +1 -1
- package/Input/index.mjs +6 -6
- package/Input/index.mjs.map +1 -1
- package/Label/index.js +1 -1
- package/Label/index.js.map +1 -1
- package/Label/index.mjs +1 -1
- package/Label/index.mjs.map +1 -1
- package/Layer/index.js +4 -4
- package/Layer/index.js.map +1 -1
- package/Layer/index.mjs +4 -4
- package/Layer/index.mjs.map +1 -1
- package/LineProgress/index.js +3 -3
- package/LineProgress/index.js.map +1 -1
- package/LineProgress/index.mjs +3 -3
- package/LineProgress/index.mjs.map +1 -1
- package/List/index.js +1 -1
- package/List/index.js.map +1 -1
- package/List/index.mjs +1 -1
- package/List/index.mjs.map +1 -1
- package/ListItem/index.js +1 -1
- package/ListItem/index.js.map +1 -1
- package/ListItem/index.mjs +1 -1
- package/ListItem/index.mjs.map +1 -1
- package/LoadingBox/index.js +2 -2
- package/LoadingBox/index.js.map +1 -1
- package/LoadingBox/index.mjs +2 -2
- package/LoadingBox/index.mjs.map +1 -1
- package/Menu/getOrigin.js.map +1 -1
- package/Menu/getOrigin.mjs.map +1 -1
- package/Menu/index.js +3 -3
- package/Menu/index.js.map +1 -1
- package/Menu/index.mjs +3 -3
- package/Menu/index.mjs.map +1 -1
- package/Menu/placedMenu.js.map +1 -1
- package/Menu/placedMenu.mjs.map +1 -1
- package/Modal/index.js +2 -2
- package/Modal/index.js.map +1 -1
- package/Modal/index.mjs +2 -2
- package/Modal/index.mjs.map +1 -1
- package/Option/index.js +1 -1
- package/Option/index.js.map +1 -1
- package/Option/index.mjs +1 -1
- package/Option/index.mjs.map +1 -1
- package/Paper/index.js +1 -1
- package/Paper/index.js.map +1 -1
- package/Paper/index.mjs +1 -1
- package/Paper/index.mjs.map +1 -1
- package/Portal/index.js +1 -1
- package/Portal/index.js.map +1 -1
- package/Portal/index.mjs +1 -1
- package/Portal/index.mjs.map +1 -1
- package/Scrollbar/index.js +5 -5
- package/Scrollbar/index.js.map +1 -1
- package/Scrollbar/index.mjs +5 -5
- package/Scrollbar/index.mjs.map +1 -1
- package/Select/index.js +2 -2
- package/Select/index.js.map +1 -1
- package/Select/index.mjs +2 -2
- package/Select/index.mjs.map +1 -1
- package/Stack/index.js +1 -1
- package/Stack/index.js.map +1 -1
- package/Stack/index.mjs +1 -1
- package/Stack/index.mjs.map +1 -1
- package/Switch/index.js +4 -4
- package/Switch/index.js.map +1 -1
- package/Switch/index.mjs +4 -4
- package/Switch/index.mjs.map +1 -1
- package/Tab/index.js +1 -1
- package/Tab/index.js.map +1 -1
- package/Tab/index.mjs +1 -1
- package/Tab/index.mjs.map +1 -1
- package/Table/index.js +3 -3
- package/Table/index.js.map +1 -1
- package/Table/index.mjs +3 -3
- package/Table/index.mjs.map +1 -1
- package/TableBody/index.js +1 -1
- package/TableBody/index.js.map +1 -1
- package/TableBody/index.mjs +1 -1
- package/TableBody/index.mjs.map +1 -1
- package/TableCell/index.js +1 -1
- package/TableCell/index.js.map +1 -1
- package/TableCell/index.mjs +1 -1
- package/TableCell/index.mjs.map +1 -1
- package/TableFooter/index.js +1 -1
- package/TableFooter/index.js.map +1 -1
- package/TableFooter/index.mjs +1 -1
- package/TableFooter/index.mjs.map +1 -1
- package/TableHead/index.js +1 -1
- package/TableHead/index.js.map +1 -1
- package/TableHead/index.mjs +1 -1
- package/TableHead/index.mjs.map +1 -1
- package/TablePagination/index.js +5 -5
- package/TablePagination/index.js.map +1 -1
- package/TablePagination/index.mjs +5 -5
- package/TablePagination/index.mjs.map +1 -1
- package/TableRow/index.js +1 -1
- package/TableRow/index.js.map +1 -1
- package/TableRow/index.mjs +1 -1
- package/TableRow/index.mjs.map +1 -1
- package/Tabs/index.js +3 -3
- package/Tabs/index.js.map +1 -1
- package/Tabs/index.mjs +3 -3
- package/Tabs/index.mjs.map +1 -1
- package/Text/index.js +1 -1
- package/Text/index.js.map +1 -1
- package/Text/index.mjs +1 -1
- package/Text/index.mjs.map +1 -1
- package/ThemeProvider/RenderRoot.js.map +1 -1
- package/ThemeProvider/RenderRoot.mjs.map +1 -1
- package/ThemeProvider/index.js +1 -1
- package/ThemeProvider/index.js.map +1 -1
- package/ThemeProvider/index.mjs +1 -1
- package/ThemeProvider/index.mjs.map +1 -1
- package/Toast/index.js +6 -6
- package/Toast/index.js.map +1 -1
- package/Toast/index.mjs +6 -6
- package/Toast/index.mjs.map +1 -1
- package/Tooltip/index.js +2 -2
- package/Tooltip/index.js.map +1 -1
- package/Tooltip/index.mjs +2 -2
- package/Tooltip/index.mjs.map +1 -1
- package/ViewBox/index.js +1 -1
- package/ViewBox/index.js.map +1 -1
- package/ViewBox/index.mjs +1 -1
- package/ViewBox/index.mjs.map +1 -1
- package/package.json +5 -5
- package/readme.md +103 -0
- package/useCorner/index.js.map +1 -1
- package/useCorner/index.mjs.map +1 -1
package/LoadingBox/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, ColorTemplateColors, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n loading?: boolean;\n color?: useBreakpointPropsType<ColorTemplateColors>;\n slotProps?: {\n CircleProgress?: Omit<CircleProgressProps, \"value\">\n }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n const _p: any = {}\n if (color) _p.color = color\n const p: any = useBreakpointProps(_p)\n color = p.color ?? \"brand\"\n\n return (\n <Tag\n baseClass='loading-box'\n {...rest}\n sxr={{\n position: \"relative\",\n display: \"inline-block\",\n ...((rest as any).sx || {})\n }}\n disabled={loading ?? rest.disabled ?? false}\n ref={ref}\n >\n {loading && <Tag\n baseClass=\"loading-box-container\"\n sxr={{\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n zIndex: 1,\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.alpha\"\n }}\n >\n <CircleProgress\n color=\"brand\"\n hideTrack\n {...slotProps?.CircleProgress}\n />\n </Tag>}\n {children}\n </Tag>\n )\n})\n\nexport default LoadingBox\n\n"],"names":["__rest","useInterface","useBreakpointProps","_jsxs","Tag","_jsx","CircleProgress"],"mappings":"wOAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAAA,YAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2CC,iBAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAAD,YAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQE,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIC,eAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,EAAA,EACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EAAA,GAClB,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,QAAQ,EAAE,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAP,OAAO,GAAI,IAAI,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,KAAK,EAC3C,GAAG,EAAE,GAAG,EAAA,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, ColorTemplateColors, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n loading?: boolean;\n color?: useBreakpointPropsType<ColorTemplateColors>;\n slotProps?: {\n CircleProgress?: Omit<CircleProgressProps, \"value\">\n }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n const _p: any = {}\n if (color) _p.color = color\n const p: any = useBreakpointProps(_p)\n color = p.color ?? \"brand\"\n\n return (\n <Tag\n baseClass='loading-box'\n {...rest}\n sxr={{\n position: \"relative\",\n display: \"inline-block\",\n ...((rest as any).sx || {})\n }}\n disabled={loading ?? rest.disabled ?? false}\n ref={ref}\n >\n {loading && <Tag\n baseClass=\"loading-box-container\"\n sxr={{\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n zIndex: 1,\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.alpha\"\n }}\n >\n <CircleProgress\n color=\"brand\"\n hideTrack\n {...slotProps?.CircleProgress}\n />\n </Tag>}\n {children}\n </Tag>\n )\n})\n\nexport default LoadingBox\n\n"],"names":["__rest","useInterface","useBreakpointProps","_jsxs","Tag","_jsx","CircleProgress"],"mappings":"wOAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAAA,YAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2CC,iBAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAAD,YAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQE,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIC,eAAA,CAACC,QAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,EAAA,EACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EAAA,GAClB,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,QAAQ,EAAE,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAP,OAAO,GAAI,IAAI,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,KAAK,EAC3C,GAAG,EAAE,GAAG,EAAA,QAAA,EAAA,CAEP,OAAO,IAAIC,cAAA,CAACD,QAAG,EAAA,EACZ,SAAS,EAAC,uBAAuB,EACjC,GAAG,EAAE;AACD,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,IAAI,EAAE,CAAC;AACP,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,cAAc,EAAE,QAAQ;AACxB,oBAAA,UAAU,EAAE,QAAQ;AACpB,oBAAA,OAAO,EAAE;iBACZ,EAAA,QAAA,EAEDC,cAAA,CAACC,aAAc,EAAA,MAAA,CAAA,MAAA,CAAA,EACX,KAAK,EAAC,OAAO,EACb,SAAS,EAAA,IAAA,EAAA,EACL,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,cAAc,CAAA,CAC/B,GACA,EACL,QAAQ,CAAA,EAAA,CAAA,CACP;AAEd,CAAC"}
|
package/LoadingBox/index.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React
|
|
|
7
7
|
_p.color = color;
|
|
8
8
|
const p = useBreakpointProps(_p);
|
|
9
9
|
color = (_b = p.color) !== null && _b !== void 0 ? _b : "brand";
|
|
10
|
-
return (jsxs(Tag, Object.assign({ baseClass: 'loading-box' }, rest, { sxr: Object.assign({ position: "relative", display: "inline-block" }, (rest.sx || {})), disabled: (_c = loading !== null && loading !== void 0 ? loading : rest.disabled) !== null && _c !== void 0 ? _c : false, ref: ref
|
|
10
|
+
return (jsxs(Tag, Object.assign({ baseClass: 'loading-box' }, rest, { sxr: Object.assign({ position: "relative", display: "inline-block" }, (rest.sx || {})), disabled: (_c = loading !== null && loading !== void 0 ? loading : rest.disabled) !== null && _c !== void 0 ? _c : false, ref: ref, children: [loading && jsx(Tag, { baseClass: "loading-box-container", sxr: {
|
|
11
11
|
position: "absolute",
|
|
12
12
|
top: 0,
|
|
13
13
|
left: 0,
|
|
@@ -18,5 +18,5 @@ import {__rest}from'tslib';import {jsxs,jsx}from'react/jsx-runtime';import React
|
|
|
18
18
|
justifyContent: "center",
|
|
19
19
|
alignItems: "center",
|
|
20
20
|
bgcolor: "background.alpha"
|
|
21
|
-
}
|
|
21
|
+
}, children: jsx(CircleProgress, Object.assign({ color: "brand", hideTrack: true }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.CircleProgress)) }), children] })));
|
|
22
22
|
});export{LoadingBox as default};//# sourceMappingURL=index.mjs.map
|
package/LoadingBox/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, ColorTemplateColors, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n loading?: boolean;\n color?: useBreakpointPropsType<ColorTemplateColors>;\n slotProps?: {\n CircleProgress?: Omit<CircleProgressProps, \"value\">\n }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n const _p: any = {}\n if (color) _p.color = color\n const p: any = useBreakpointProps(_p)\n color = p.color ?? \"brand\"\n\n return (\n <Tag\n baseClass='loading-box'\n {...rest}\n sxr={{\n position: \"relative\",\n display: \"inline-block\",\n ...((rest as any).sx || {})\n }}\n disabled={loading ?? rest.disabled ?? false}\n ref={ref}\n >\n {loading && <Tag\n baseClass=\"loading-box-container\"\n sxr={{\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n zIndex: 1,\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.alpha\"\n }}\n >\n <CircleProgress\n color=\"brand\"\n hideTrack\n {...slotProps?.CircleProgress}\n />\n </Tag>}\n {children}\n </Tag>\n )\n})\n\nexport default LoadingBox\n\n"],"names":["_jsxs","_jsx"],"mappings":"mNAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAA,MAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2C,YAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAA,MAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIA,IAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,EAAA,EACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EAAA,GAClB,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,QAAQ,EAAE,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAP,OAAO,GAAI,IAAI,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,KAAK,EAC3C,GAAG,EAAE,GAAG,EAAA,
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/LoadingBox/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, ColorTemplateColors, useInterface, useBreakpointProps, useBreakpointPropsType } from '@xanui/core';\nimport CircleProgress, { CircleProgressProps } from '../CircleProgress';\n\n\nexport type LoadingBoxProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n loading?: boolean;\n color?: useBreakpointPropsType<ColorTemplateColors>;\n slotProps?: {\n CircleProgress?: Omit<CircleProgressProps, \"value\">\n }\n\n}\n\nconst LoadingBox = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...props }: LoadingBoxProps<T>, ref: React.Ref<any>) => {\n let [{ loading, color, slotProps, ...rest }] = useInterface<any>(\"LoadingBox\", props, {})\n const _p: any = {}\n if (color) _p.color = color\n const p: any = useBreakpointProps(_p)\n color = p.color ?? \"brand\"\n\n return (\n <Tag\n baseClass='loading-box'\n {...rest}\n sxr={{\n position: \"relative\",\n display: \"inline-block\",\n ...((rest as any).sx || {})\n }}\n disabled={loading ?? rest.disabled ?? false}\n ref={ref}\n >\n {loading && <Tag\n baseClass=\"loading-box-container\"\n sxr={{\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n zIndex: 1,\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n bgcolor: \"background.alpha\"\n }}\n >\n <CircleProgress\n color=\"brand\"\n hideTrack\n {...slotProps?.CircleProgress}\n />\n </Tag>}\n {children}\n </Tag>\n )\n})\n\nexport default LoadingBox\n\n"],"names":["_jsxs","_jsx"],"mappings":"mNAeA,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAA0C,EAAE,GAAmB,KAAI;;AAAnE,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAAgC,EAA3B,KAAK,GAAA,MAAA,CAAA,EAAA,EAApB,YAAsB,CAAF;IACzF,IAAI,CAAA,EAAA,CAAA,GAA2C,YAAY,CAAM,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,EAApF,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAA,GAAA,EAAW,EAAN,IAAI,GAAA,MAAA,CAAA,EAAA,EAApC,CAAA,SAAA,EAAA,OAAA,EAAA,WAAA,CAAsC,CAA8C;IACzF,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,KAAK;AAAE,QAAA,EAAE,CAAC,KAAK,GAAG,KAAK;AAC3B,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,KAAK,GAAG,CAAA,EAAA,GAAA,CAAC,CAAC,KAAK,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,OAAO;IAE1B,QACIA,IAAA,CAAC,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,SAAS,EAAC,aAAa,EAAA,EACnB,IAAI,EAAA,EACR,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,cAAc,EAAA,GAClB,IAAY,CAAC,EAAE,IAAI,EAAE,EAAC,EAE/B,QAAQ,EAAE,CAAA,EAAA,GAAA,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAP,OAAO,GAAI,IAAI,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,KAAK,EAC3C,GAAG,EAAE,GAAG,EAAA,QAAA,EAAA,CAEP,OAAO,IAAIC,GAAA,CAAC,GAAG,EAAA,EACZ,SAAS,EAAC,uBAAuB,EACjC,GAAG,EAAE;AACD,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,GAAG,EAAE,CAAC;AACN,oBAAA,IAAI,EAAE,CAAC;AACP,oBAAA,KAAK,EAAE,CAAC;AACR,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,MAAM,EAAE,CAAC;AACT,oBAAA,OAAO,EAAE,MAAM;AACf,oBAAA,cAAc,EAAE,QAAQ;AACxB,oBAAA,UAAU,EAAE,QAAQ;AACpB,oBAAA,OAAO,EAAE;iBACZ,EAAA,QAAA,EAEDA,GAAA,CAAC,cAAc,EAAA,MAAA,CAAA,MAAA,CAAA,EACX,KAAK,EAAC,OAAO,EACb,SAAS,EAAA,IAAA,EAAA,EACL,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,cAAc,CAAA,CAC/B,GACA,EACL,QAAQ,CAAA,EAAA,CAAA,CACP;AAEd,CAAC"}
|
package/Menu/getOrigin.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOrigin.js","sources":["../../src/Menu/getOrigin.ts"],"sourcesContent":["\nexport const getOrigin = (placed: string) => {\n let _origin: any = \"top\"\n switch (placed) {\n case \"bottom\":\n _origin = \"top\"\n break;\n case \"bottom-left\":\n _origin = \"top left\"\n break;\n case \"bottom-right\":\n _origin = \"top right\"\n break;\n case \"top\":\n _origin = \"bottom\"\n break;\n case \"top-left\":\n _origin = \"bottom left\"\n break;\n case \"top-right\":\n _origin = \"bottom right\"\n break;\n case \"right\":\n _origin = \"left\"\n break;\n case \"right-bottom\":\n _origin = \"bottom left\"\n break;\n case \"right-top\":\n _origin = \"top left\"\n break;\n case \"left\":\n _origin = \"right\"\n break;\n case \"left-bottom\":\n _origin = \"bottom right\"\n break;\n case \"left-top\":\n _origin = \"top right\"\n break;\n }\n return _origin\n}"],"names":[],"mappings":"sEACO,MAAM,SAAS,GAAG,CAAC,MAAc,KAAI;IACxC,IAAI,OAAO,GAAQ,KAAK;
|
|
1
|
+
{"version":3,"file":"getOrigin.js","sources":["../../src/Menu/getOrigin.ts"],"sourcesContent":["\nexport const getOrigin = (placed: string) => {\n let _origin: any = \"top\"\n switch (placed) {\n case \"bottom\":\n _origin = \"top\"\n break;\n case \"bottom-left\":\n _origin = \"top left\"\n break;\n case \"bottom-right\":\n _origin = \"top right\"\n break;\n case \"top\":\n _origin = \"bottom\"\n break;\n case \"top-left\":\n _origin = \"bottom left\"\n break;\n case \"top-right\":\n _origin = \"bottom right\"\n break;\n case \"right\":\n _origin = \"left\"\n break;\n case \"right-bottom\":\n _origin = \"bottom left\"\n break;\n case \"right-top\":\n _origin = \"top left\"\n break;\n case \"left\":\n _origin = \"right\"\n break;\n case \"left-bottom\":\n _origin = \"bottom right\"\n break;\n case \"left-top\":\n _origin = \"top right\"\n break;\n }\n return _origin\n}"],"names":[],"mappings":"sEACO,MAAM,SAAS,GAAG,CAAC,MAAc,KAAI;IACxC,IAAI,OAAO,GAAQ,KAAK;IACxB,QAAQ,MAAM;AACV,QAAA,KAAK,QAAQ;YACT,OAAO,GAAG,KAAK;YACf;AACJ,QAAA,KAAK,aAAa;YACd,OAAO,GAAG,UAAU;YACpB;AACJ,QAAA,KAAK,cAAc;YACf,OAAO,GAAG,WAAW;YACrB;AACJ,QAAA,KAAK,KAAK;YACN,OAAO,GAAG,QAAQ;YAClB;AACJ,QAAA,KAAK,UAAU;YACX,OAAO,GAAG,aAAa;YACvB;AACJ,QAAA,KAAK,WAAW;YACZ,OAAO,GAAG,cAAc;YACxB;AACJ,QAAA,KAAK,OAAO;YACR,OAAO,GAAG,MAAM;YAChB;AACJ,QAAA,KAAK,cAAc;YACf,OAAO,GAAG,aAAa;YACvB;AACJ,QAAA,KAAK,WAAW;YACZ,OAAO,GAAG,UAAU;YACpB;AACJ,QAAA,KAAK,MAAM;YACP,OAAO,GAAG,OAAO;YACjB;AACJ,QAAA,KAAK,aAAa;YACd,OAAO,GAAG,cAAc;YACxB;AACJ,QAAA,KAAK,UAAU;YACX,OAAO,GAAG,WAAW;YACrB;;AAER,IAAA,OAAO,OAAO;AAClB"}
|
package/Menu/getOrigin.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOrigin.mjs","sources":["../../src/Menu/getOrigin.ts"],"sourcesContent":["\nexport const getOrigin = (placed: string) => {\n let _origin: any = \"top\"\n switch (placed) {\n case \"bottom\":\n _origin = \"top\"\n break;\n case \"bottom-left\":\n _origin = \"top left\"\n break;\n case \"bottom-right\":\n _origin = \"top right\"\n break;\n case \"top\":\n _origin = \"bottom\"\n break;\n case \"top-left\":\n _origin = \"bottom left\"\n break;\n case \"top-right\":\n _origin = \"bottom right\"\n break;\n case \"right\":\n _origin = \"left\"\n break;\n case \"right-bottom\":\n _origin = \"bottom left\"\n break;\n case \"right-top\":\n _origin = \"top left\"\n break;\n case \"left\":\n _origin = \"right\"\n break;\n case \"left-bottom\":\n _origin = \"bottom right\"\n break;\n case \"left-top\":\n _origin = \"top right\"\n break;\n }\n return _origin\n}"],"names":[],"mappings":"AACO,MAAM,SAAS,GAAG,CAAC,MAAc,KAAI;IACxC,IAAI,OAAO,GAAQ,KAAK;
|
|
1
|
+
{"version":3,"file":"getOrigin.mjs","sources":["../../src/Menu/getOrigin.ts"],"sourcesContent":["\nexport const getOrigin = (placed: string) => {\n let _origin: any = \"top\"\n switch (placed) {\n case \"bottom\":\n _origin = \"top\"\n break;\n case \"bottom-left\":\n _origin = \"top left\"\n break;\n case \"bottom-right\":\n _origin = \"top right\"\n break;\n case \"top\":\n _origin = \"bottom\"\n break;\n case \"top-left\":\n _origin = \"bottom left\"\n break;\n case \"top-right\":\n _origin = \"bottom right\"\n break;\n case \"right\":\n _origin = \"left\"\n break;\n case \"right-bottom\":\n _origin = \"bottom left\"\n break;\n case \"right-top\":\n _origin = \"top left\"\n break;\n case \"left\":\n _origin = \"right\"\n break;\n case \"left-bottom\":\n _origin = \"bottom right\"\n break;\n case \"left-top\":\n _origin = \"top right\"\n break;\n }\n return _origin\n}"],"names":[],"mappings":"AACO,MAAM,SAAS,GAAG,CAAC,MAAc,KAAI;IACxC,IAAI,OAAO,GAAQ,KAAK;IACxB,QAAQ,MAAM;AACV,QAAA,KAAK,QAAQ;YACT,OAAO,GAAG,KAAK;YACf;AACJ,QAAA,KAAK,aAAa;YACd,OAAO,GAAG,UAAU;YACpB;AACJ,QAAA,KAAK,cAAc;YACf,OAAO,GAAG,WAAW;YACrB;AACJ,QAAA,KAAK,KAAK;YACN,OAAO,GAAG,QAAQ;YAClB;AACJ,QAAA,KAAK,UAAU;YACX,OAAO,GAAG,aAAa;YACvB;AACJ,QAAA,KAAK,WAAW;YACZ,OAAO,GAAG,cAAc;YACxB;AACJ,QAAA,KAAK,OAAO;YACR,OAAO,GAAG,MAAM;YAChB;AACJ,QAAA,KAAK,cAAc;YACf,OAAO,GAAG,aAAa;YACvB;AACJ,QAAA,KAAK,WAAW;YACZ,OAAO,GAAG,UAAU;YACpB;AACJ,QAAA,KAAK,MAAM;YACP,OAAO,GAAG,OAAO;YACjB;AACJ,QAAA,KAAK,aAAa;YACd,OAAO,GAAG,cAAc;YACxB;AACJ,QAAA,KAAK,UAAU;YACX,OAAO,GAAG,WAAW;YACrB;;AAER,IAAA,OAAO,OAAO;AAClB"}
|
package/Menu/index.js
CHANGED
|
@@ -34,14 +34,14 @@
|
|
|
34
34
|
}, [closed]);
|
|
35
35
|
if (closed)
|
|
36
36
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
37
|
-
return (jsxRuntime.jsx(index.default, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsxRuntime.jsx(index$1.default,
|
|
37
|
+
return (jsxRuntime.jsx(index.default, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsxRuntime.jsx(index$1.default, { baseClass: "menu", id: id, sx: {
|
|
38
38
|
position: "fixed",
|
|
39
39
|
zIndex: 1500 + (zIndex || 0)
|
|
40
40
|
}, onClickOutside: () => {
|
|
41
41
|
onClickOutside && onClickOutside();
|
|
42
|
-
}
|
|
42
|
+
}, children: jsxRuntime.jsx(core.Transition, Object.assign({ duration: 200, easing: "easeInOut", variant: "grow" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition, { open: isOpen, onClosed: () => {
|
|
43
43
|
var _a, _b;
|
|
44
44
|
setClosed(true);
|
|
45
45
|
((_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _a === void 0 ? void 0 : _a.onClosed) && ((_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _b === void 0 ? void 0 : _b.onClosed());
|
|
46
|
-
}
|
|
46
|
+
}, children: jsxRuntime.jsx(core.Tag, Object.assign({ baseClass: 'menu-content' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: Object.assign({ overflow: "hidden", bgcolor: "background.primary", shadow: 5, radius: 1, transformOrigin: getOrigin.getOrigin(placed) || "top" }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.content) === null || _b === void 0 ? void 0 : _b.sx), children: children })) })) }) })));
|
|
47
47
|
};exports.default=Menu;//# sourceMappingURL=index.js.map
|
package/Menu/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n children?: ReactNode;\n target?: HTMLElement;\n placement?: useBreakpointPropsType<PlacementTypes>;\n zIndex?: number;\n onClickOutside?: () => void;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">;\n portal?: Omit<PortalProps, \"children\">;\n content?: Omit<TagProps<\"div\">, \"children\">;\n }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n const _p: any = {}\n if (placement) _p.placement = placement\n const p: any = useBreakpointProps(_p)\n placement = p.placement\n\n const isOpen = Boolean(target)\n const [closed, setClosed] = useState(!isOpen)\n let id = \"menu-\" + useId().replace(\":\", \"\")\n const [placed, setPlaced] = useState<any>(placement)\n placement = placement || \"bottom-left\"\n\n useEffect(() => {\n if (closed && isOpen) {\n setClosed(false)\n }\n }, [isOpen])\n\n useEffect(() => {\n if (!closed) {\n setTimeout(() => {\n const ele = document.getElementById(id)\n if (target && ele) {\n let p = placedMenu({\n place: placement as any,\n menu: ele,\n target\n })\n setPlaced(p)\n }\n }, 1);\n }\n }, [closed])\n\n if (closed) return <></>\n\n return (\n <Portal {...slotProps?.portal}>\n <ClickOutside\n baseClass=\"menu\"\n id={id}\n sx={{\n position: \"fixed\",\n zIndex: 1500 + (zIndex || 0)\n }}\n onClickOutside={() => {\n onClickOutside && onClickOutside()\n }}\n >\n <Transition\n duration={200}\n easing=\"easeInOut\"\n variant=\"grow\"\n {...slotProps?.transition}\n open={isOpen}\n onClosed={() => {\n setClosed(true)\n slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n }}\n >\n <Tag\n baseClass='menu-content'\n {...slotProps?.content}\n sxr={{\n overflow: \"hidden\",\n bgcolor: \"background.primary\",\n shadow: 5,\n radius: 1,\n transformOrigin: getOrigin(placed) || \"top\",\n ...slotProps?.content?.sx\n }}\n >\n {children}\n </Tag>\n </Transition>\n </ClickOutside>\n </Portal>\n )\n}\n\nexport default Menu"],"names":["__rest","useInterface","useBreakpointProps","useState","useId","useEffect","placedMenu","_jsx","Portal","ClickOutside","Transition","Tag","getOrigin"],"mappings":"sVAqBA,MAAM,IAAI,GAAG,CAAC,EAAyC,KAAI;;QAA7C,EAAE,QAAQ,EAAE,MAAM,EAAA,GAAA,EAAuB,EAAlB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA5B,sBAA8B,CAAF;IACtC,IAAI,CAAC,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,GAAGC,iBAAY,CAAM,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;IAC7F,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,SAAS;AAAE,QAAA,EAAE,CAAC,SAAS,GAAG,SAAS;AACvC,IAAA,MAAM,CAAC,GAAQC,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,SAAS,GAAG,CAAC,CAAC,SAAS;AAEvB,IAAA,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAC9B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGC,cAAQ,CAAC,CAAC,MAAM,CAAC;AAC7C,IAAA,IAAI,EAAE,GAAG,OAAO,GAAGC,WAAK,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC;IAC3C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAGD,cAAQ,CAAM,SAAS,CAAC;AACpD,IAAA,SAAS,GAAG,SAAS,IAAI,aAAa;IAEtCE,eAAS,CAAC,MAAK;
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n children?: ReactNode;\n target?: HTMLElement;\n placement?: useBreakpointPropsType<PlacementTypes>;\n zIndex?: number;\n onClickOutside?: () => void;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">;\n portal?: Omit<PortalProps, \"children\">;\n content?: Omit<TagProps<\"div\">, \"children\">;\n }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n const _p: any = {}\n if (placement) _p.placement = placement\n const p: any = useBreakpointProps(_p)\n placement = p.placement\n\n const isOpen = Boolean(target)\n const [closed, setClosed] = useState(!isOpen)\n let id = \"menu-\" + useId().replace(\":\", \"\")\n const [placed, setPlaced] = useState<any>(placement)\n placement = placement || \"bottom-left\"\n\n useEffect(() => {\n if (closed && isOpen) {\n setClosed(false)\n }\n }, [isOpen])\n\n useEffect(() => {\n if (!closed) {\n setTimeout(() => {\n const ele = document.getElementById(id)\n if (target && ele) {\n let p = placedMenu({\n place: placement as any,\n menu: ele,\n target\n })\n setPlaced(p)\n }\n }, 1);\n }\n }, [closed])\n\n if (closed) return <></>\n\n return (\n <Portal {...slotProps?.portal}>\n <ClickOutside\n baseClass=\"menu\"\n id={id}\n sx={{\n position: \"fixed\",\n zIndex: 1500 + (zIndex || 0)\n }}\n onClickOutside={() => {\n onClickOutside && onClickOutside()\n }}\n >\n <Transition\n duration={200}\n easing=\"easeInOut\"\n variant=\"grow\"\n {...slotProps?.transition}\n open={isOpen}\n onClosed={() => {\n setClosed(true)\n slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n }}\n >\n <Tag\n baseClass='menu-content'\n {...slotProps?.content}\n sxr={{\n overflow: \"hidden\",\n bgcolor: \"background.primary\",\n shadow: 5,\n radius: 1,\n transformOrigin: getOrigin(placed) || \"top\",\n ...slotProps?.content?.sx\n }}\n >\n {children}\n </Tag>\n </Transition>\n </ClickOutside>\n </Portal>\n )\n}\n\nexport default Menu"],"names":["__rest","useInterface","useBreakpointProps","useState","useId","useEffect","placedMenu","_jsx","Portal","ClickOutside","Transition","Tag","getOrigin"],"mappings":"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"}
|
package/Menu/index.mjs
CHANGED
|
@@ -34,14 +34,14 @@ import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import {
|
|
|
34
34
|
}, [closed]);
|
|
35
35
|
if (closed)
|
|
36
36
|
return jsx(Fragment, {});
|
|
37
|
-
return (jsx(Portal, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsx(ClickOutside,
|
|
37
|
+
return (jsx(Portal, Object.assign({}, slotProps === null || slotProps === void 0 ? void 0 : slotProps.portal, { children: jsx(ClickOutside, { baseClass: "menu", id: id, sx: {
|
|
38
38
|
position: "fixed",
|
|
39
39
|
zIndex: 1500 + (zIndex || 0)
|
|
40
40
|
}, onClickOutside: () => {
|
|
41
41
|
onClickOutside && onClickOutside();
|
|
42
|
-
}
|
|
42
|
+
}, children: jsx(Transition, Object.assign({ duration: 200, easing: "easeInOut", variant: "grow" }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition, { open: isOpen, onClosed: () => {
|
|
43
43
|
var _a, _b;
|
|
44
44
|
setClosed(true);
|
|
45
45
|
((_a = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _a === void 0 ? void 0 : _a.onClosed) && ((_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.transition) === null || _b === void 0 ? void 0 : _b.onClosed());
|
|
46
|
-
}
|
|
46
|
+
}, children: jsx(Tag, Object.assign({ baseClass: 'menu-content' }, slotProps === null || slotProps === void 0 ? void 0 : slotProps.content, { sxr: Object.assign({ overflow: "hidden", bgcolor: "background.primary", shadow: 5, radius: 1, transformOrigin: getOrigin(placed) || "top" }, (_b = slotProps === null || slotProps === void 0 ? void 0 : slotProps.content) === null || _b === void 0 ? void 0 : _b.sx), children: children })) })) }) })));
|
|
47
47
|
};export{Menu as default};//# sourceMappingURL=index.mjs.map
|
package/Menu/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n children?: ReactNode;\n target?: HTMLElement;\n placement?: useBreakpointPropsType<PlacementTypes>;\n zIndex?: number;\n onClickOutside?: () => void;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">;\n portal?: Omit<PortalProps, \"children\">;\n content?: Omit<TagProps<\"div\">, \"children\">;\n }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n const _p: any = {}\n if (placement) _p.placement = placement\n const p: any = useBreakpointProps(_p)\n placement = p.placement\n\n const isOpen = Boolean(target)\n const [closed, setClosed] = useState(!isOpen)\n let id = \"menu-\" + useId().replace(\":\", \"\")\n const [placed, setPlaced] = useState<any>(placement)\n placement = placement || \"bottom-left\"\n\n useEffect(() => {\n if (closed && isOpen) {\n setClosed(false)\n }\n }, [isOpen])\n\n useEffect(() => {\n if (!closed) {\n setTimeout(() => {\n const ele = document.getElementById(id)\n if (target && ele) {\n let p = placedMenu({\n place: placement as any,\n menu: ele,\n target\n })\n setPlaced(p)\n }\n }, 1);\n }\n }, [closed])\n\n if (closed) return <></>\n\n return (\n <Portal {...slotProps?.portal}>\n <ClickOutside\n baseClass=\"menu\"\n id={id}\n sx={{\n position: \"fixed\",\n zIndex: 1500 + (zIndex || 0)\n }}\n onClickOutside={() => {\n onClickOutside && onClickOutside()\n }}\n >\n <Transition\n duration={200}\n easing=\"easeInOut\"\n variant=\"grow\"\n {...slotProps?.transition}\n open={isOpen}\n onClosed={() => {\n setClosed(true)\n slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n }}\n >\n <Tag\n baseClass='menu-content'\n {...slotProps?.content}\n sxr={{\n overflow: \"hidden\",\n bgcolor: \"background.primary\",\n shadow: 5,\n radius: 1,\n transformOrigin: getOrigin(placed) || \"top\",\n ...slotProps?.content?.sx\n }}\n >\n {children}\n </Tag>\n </Transition>\n </ClickOutside>\n </Portal>\n )\n}\n\nexport default Menu"],"names":["_jsx"],"mappings":"4WAqBA,MAAM,IAAI,GAAG,CAAC,EAAyC,KAAI;;QAA7C,EAAE,QAAQ,EAAE,MAAM,EAAA,GAAA,EAAuB,EAAlB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA5B,sBAA8B,CAAF;IACtC,IAAI,CAAC,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,GAAG,YAAY,CAAM,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;IAC7F,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,SAAS;AAAE,QAAA,EAAE,CAAC,SAAS,GAAG,SAAS;AACvC,IAAA,MAAM,CAAC,GAAQ,kBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,SAAS,GAAG,CAAC,CAAC,SAAS;AAEvB,IAAA,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;IAC9B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,CAAC,MAAM,CAAC;AAC7C,IAAA,IAAI,EAAE,GAAG,OAAO,GAAG,KAAK,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC;IAC3C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAM,SAAS,CAAC;AACpD,IAAA,SAAS,GAAG,SAAS,IAAI,aAAa;IAEtC,SAAS,CAAC,MAAK;
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Menu/index.tsx"],"sourcesContent":["import { ReactNode, useEffect, useId, useState } from 'react'\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType, useInterface, TransitionProps, Transition } from \"@xanui/core\"\nimport { placedMenu, PlacementTypes } from \"./placedMenu\";\nimport Portal, { PortalProps } from \"../Portal\";\nimport { getOrigin } from './getOrigin';\nimport ClickOutside from '../ClickOutside';\n\n\nexport type MenuProps = {\n children?: ReactNode;\n target?: HTMLElement;\n placement?: useBreakpointPropsType<PlacementTypes>;\n zIndex?: number;\n onClickOutside?: () => void;\n slotProps?: {\n transition?: Omit<TransitionProps, \"open\">;\n portal?: Omit<PortalProps, \"children\">;\n content?: Omit<TagProps<\"div\">, \"children\">;\n }\n}\n\nconst Menu = ({ children, target, ...props }: MenuProps) => {\n let [{ onClickOutside, placement, zIndex, slotProps }] = useInterface<any>(\"Menu\", props, {})\n const _p: any = {}\n if (placement) _p.placement = placement\n const p: any = useBreakpointProps(_p)\n placement = p.placement\n\n const isOpen = Boolean(target)\n const [closed, setClosed] = useState(!isOpen)\n let id = \"menu-\" + useId().replace(\":\", \"\")\n const [placed, setPlaced] = useState<any>(placement)\n placement = placement || \"bottom-left\"\n\n useEffect(() => {\n if (closed && isOpen) {\n setClosed(false)\n }\n }, [isOpen])\n\n useEffect(() => {\n if (!closed) {\n setTimeout(() => {\n const ele = document.getElementById(id)\n if (target && ele) {\n let p = placedMenu({\n place: placement as any,\n menu: ele,\n target\n })\n setPlaced(p)\n }\n }, 1);\n }\n }, [closed])\n\n if (closed) return <></>\n\n return (\n <Portal {...slotProps?.portal}>\n <ClickOutside\n baseClass=\"menu\"\n id={id}\n sx={{\n position: \"fixed\",\n zIndex: 1500 + (zIndex || 0)\n }}\n onClickOutside={() => {\n onClickOutside && onClickOutside()\n }}\n >\n <Transition\n duration={200}\n easing=\"easeInOut\"\n variant=\"grow\"\n {...slotProps?.transition}\n open={isOpen}\n onClosed={() => {\n setClosed(true)\n slotProps?.transition?.onClosed && slotProps?.transition?.onClosed()\n }}\n >\n <Tag\n baseClass='menu-content'\n {...slotProps?.content}\n sxr={{\n overflow: \"hidden\",\n bgcolor: \"background.primary\",\n shadow: 5,\n radius: 1,\n transformOrigin: getOrigin(placed) || \"top\",\n ...slotProps?.content?.sx\n }}\n >\n {children}\n </Tag>\n </Transition>\n </ClickOutside>\n </Portal>\n )\n}\n\nexport default Menu"],"names":["_jsx"],"mappings":"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"}
|
package/Menu/placedMenu.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"placedMenu.js","sources":["../../src/Menu/placedMenu.ts"],"sourcesContent":["\n\nexport const placements = [\n \"top\",\n \"top-left\",\n \"top-right\",\n \"bottom\",\n \"bottom-left\",\n \"bottom-right\",\n \"right\",\n \"right-top\",\n \"right-bottom\",\n \"left\",\n \"left-top\",\n \"left-bottom\"\n] as const\n\n\nexport type PlacementTypes = typeof placements[number]\n\nconst isOffScreen = (menu: HTMLElement) => {\n const { x, y, width, height } = menu.getBoundingClientRect()\n return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight\n};\n\ntype Props = {\n place: PlacementTypes,\n menu: HTMLElement,\n target: HTMLElement\n}\n\n\nlet setStyles = ({ place, menu, target }: Props) => {\n\n const { height, width } = menu.getBoundingClientRect()\n const targetBoundary = target.getBoundingClientRect()\n let targetTop = targetBoundary.top + window.scrollY\n let targetBottom = targetBoundary.bottom + window.scrollY\n let targetLeft = targetBoundary.left + window.scrollX\n let targetRight = targetBoundary.right + window.scrollX\n\n const _styles = {\n \"top\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"top-left\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetLeft}px`\n },\n \"top-right\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"bottom\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"bottom-left\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetLeft}px`\n },\n \"bottom-right\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"right\": () => {\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-bottom\": () => {\n menu.style.top = `${(targetTop + targetBoundary.height) - height}px`\n menu.style.left = `${targetRight}px`\n },\n \"left\": () => {\n menu.style.left = `${targetLeft - width}px`\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n },\n \"left-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetLeft - width}px`\n },\n \"left-bottom\": () => {\n menu.style.top = `${targetBottom - height}px`\n menu.style.left = `${targetLeft - width}px`\n }\n }\n _styles[place] && _styles[place]()\n}\n\nexport const placedMenu = ({ place, menu, target }: Props) => {\n setStyles({ place, menu, target })\n if (isOffScreen(menu)) {\n let found_placement = false\n for (let i = 0; i < placements.length; i++) {\n let _place = placements[i]\n setStyles({ place: _place, menu, target })\n if (!isOffScreen(menu)) {\n found_placement = true\n return _place\n }\n }\n if (!found_placement) {\n setStyles({ place, menu, target })\n }\n }\n return place\n}\n\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"placedMenu.js","sources":["../../src/Menu/placedMenu.ts"],"sourcesContent":["\n\nexport const placements = [\n \"top\",\n \"top-left\",\n \"top-right\",\n \"bottom\",\n \"bottom-left\",\n \"bottom-right\",\n \"right\",\n \"right-top\",\n \"right-bottom\",\n \"left\",\n \"left-top\",\n \"left-bottom\"\n] as const\n\n\nexport type PlacementTypes = typeof placements[number]\n\nconst isOffScreen = (menu: HTMLElement) => {\n const { x, y, width, height } = menu.getBoundingClientRect()\n return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight\n};\n\ntype Props = {\n place: PlacementTypes,\n menu: HTMLElement,\n target: HTMLElement\n}\n\n\nlet setStyles = ({ place, menu, target }: Props) => {\n\n const { height, width } = menu.getBoundingClientRect()\n const targetBoundary = target.getBoundingClientRect()\n let targetTop = targetBoundary.top + window.scrollY\n let targetBottom = targetBoundary.bottom + window.scrollY\n let targetLeft = targetBoundary.left + window.scrollX\n let targetRight = targetBoundary.right + window.scrollX\n\n const _styles = {\n \"top\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"top-left\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetLeft}px`\n },\n \"top-right\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"bottom\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"bottom-left\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetLeft}px`\n },\n \"bottom-right\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"right\": () => {\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-bottom\": () => {\n menu.style.top = `${(targetTop + targetBoundary.height) - height}px`\n menu.style.left = `${targetRight}px`\n },\n \"left\": () => {\n menu.style.left = `${targetLeft - width}px`\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n },\n \"left-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetLeft - width}px`\n },\n \"left-bottom\": () => {\n menu.style.top = `${targetBottom - height}px`\n menu.style.left = `${targetLeft - width}px`\n }\n }\n _styles[place] && _styles[place]()\n}\n\nexport const placedMenu = ({ place, menu, target }: Props) => {\n setStyles({ place, menu, target })\n if (isOffScreen(menu)) {\n let found_placement = false\n for (let i = 0; i < placements.length; i++) {\n let _place = placements[i]\n setStyles({ place: _place, menu, target })\n if (!isOffScreen(menu)) {\n found_placement = true\n return _place\n }\n }\n if (!found_placement) {\n setStyles({ place, menu, target })\n }\n }\n return place\n}\n\n"],"names":[],"mappings":"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"}
|
package/Menu/placedMenu.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"placedMenu.mjs","sources":["../../src/Menu/placedMenu.ts"],"sourcesContent":["\n\nexport const placements = [\n \"top\",\n \"top-left\",\n \"top-right\",\n \"bottom\",\n \"bottom-left\",\n \"bottom-right\",\n \"right\",\n \"right-top\",\n \"right-bottom\",\n \"left\",\n \"left-top\",\n \"left-bottom\"\n] as const\n\n\nexport type PlacementTypes = typeof placements[number]\n\nconst isOffScreen = (menu: HTMLElement) => {\n const { x, y, width, height } = menu.getBoundingClientRect()\n return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight\n};\n\ntype Props = {\n place: PlacementTypes,\n menu: HTMLElement,\n target: HTMLElement\n}\n\n\nlet setStyles = ({ place, menu, target }: Props) => {\n\n const { height, width } = menu.getBoundingClientRect()\n const targetBoundary = target.getBoundingClientRect()\n let targetTop = targetBoundary.top + window.scrollY\n let targetBottom = targetBoundary.bottom + window.scrollY\n let targetLeft = targetBoundary.left + window.scrollX\n let targetRight = targetBoundary.right + window.scrollX\n\n const _styles = {\n \"top\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"top-left\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetLeft}px`\n },\n \"top-right\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"bottom\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"bottom-left\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetLeft}px`\n },\n \"bottom-right\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"right\": () => {\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-bottom\": () => {\n menu.style.top = `${(targetTop + targetBoundary.height) - height}px`\n menu.style.left = `${targetRight}px`\n },\n \"left\": () => {\n menu.style.left = `${targetLeft - width}px`\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n },\n \"left-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetLeft - width}px`\n },\n \"left-bottom\": () => {\n menu.style.top = `${targetBottom - height}px`\n menu.style.left = `${targetLeft - width}px`\n }\n }\n _styles[place] && _styles[place]()\n}\n\nexport const placedMenu = ({ place, menu, target }: Props) => {\n setStyles({ place, menu, target })\n if (isOffScreen(menu)) {\n let found_placement = false\n for (let i = 0; i < placements.length; i++) {\n let _place = placements[i]\n setStyles({ place: _place, menu, target })\n if (!isOffScreen(menu)) {\n found_placement = true\n return _place\n }\n }\n if (!found_placement) {\n setStyles({ place, menu, target })\n }\n }\n return place\n}\n\n"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"placedMenu.mjs","sources":["../../src/Menu/placedMenu.ts"],"sourcesContent":["\n\nexport const placements = [\n \"top\",\n \"top-left\",\n \"top-right\",\n \"bottom\",\n \"bottom-left\",\n \"bottom-right\",\n \"right\",\n \"right-top\",\n \"right-bottom\",\n \"left\",\n \"left-top\",\n \"left-bottom\"\n] as const\n\n\nexport type PlacementTypes = typeof placements[number]\n\nconst isOffScreen = (menu: HTMLElement) => {\n const { x, y, width, height } = menu.getBoundingClientRect()\n return x < 0 || y < 0 || x + width > window.innerWidth || y + height > window.innerHeight\n};\n\ntype Props = {\n place: PlacementTypes,\n menu: HTMLElement,\n target: HTMLElement\n}\n\n\nlet setStyles = ({ place, menu, target }: Props) => {\n\n const { height, width } = menu.getBoundingClientRect()\n const targetBoundary = target.getBoundingClientRect()\n let targetTop = targetBoundary.top + window.scrollY\n let targetBottom = targetBoundary.bottom + window.scrollY\n let targetLeft = targetBoundary.left + window.scrollX\n let targetRight = targetBoundary.right + window.scrollX\n\n const _styles = {\n \"top\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"top-left\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetLeft}px`\n },\n \"top-right\": () => {\n menu.style.top = `${targetTop - height}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"bottom\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${(targetLeft + (targetBoundary.width / 2)) - (width / 2)}px`\n },\n \"bottom-left\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetLeft}px`\n },\n \"bottom-right\": () => {\n menu.style.top = `${targetBottom}px`\n menu.style.left = `${targetRight - width}px`\n },\n \"right\": () => {\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetRight}px`\n },\n \"right-bottom\": () => {\n menu.style.top = `${(targetTop + targetBoundary.height) - height}px`\n menu.style.left = `${targetRight}px`\n },\n \"left\": () => {\n menu.style.left = `${targetLeft - width}px`\n menu.style.top = `${(targetTop + (targetBoundary.height / 2)) - (height / 2)}px`\n },\n \"left-top\": () => {\n menu.style.top = `${targetTop}px`\n menu.style.left = `${targetLeft - width}px`\n },\n \"left-bottom\": () => {\n menu.style.top = `${targetBottom - height}px`\n menu.style.left = `${targetLeft - width}px`\n }\n }\n _styles[place] && _styles[place]()\n}\n\nexport const placedMenu = ({ place, menu, target }: Props) => {\n setStyles({ place, menu, target })\n if (isOffScreen(menu)) {\n let found_placement = false\n for (let i = 0; i < placements.length; i++) {\n let _place = placements[i]\n setStyles({ place: _place, menu, target })\n if (!isOffScreen(menu)) {\n found_placement = true\n return _place\n }\n }\n if (!found_placement) {\n setStyles({ place, menu, target })\n }\n }\n return place\n}\n\n"],"names":[],"mappings":"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"}
|
package/Modal/index.js
CHANGED
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
fullWidth: "100%"
|
|
16
16
|
};
|
|
17
17
|
let _b = slotProps || {}, { modal } = _b, _slotProps = tslib.__rest(_b, ["modal"]);
|
|
18
|
-
return (jsxRuntime.jsx(index.default, Object.assign({ transition: "zoom" }, props, { slotProps: Object.assign(Object.assign({}, _slotProps), { root: Object.assign({ display: "flex", alignItems: 'center', justifyContent: "center" }, _slotProps === null || _slotProps === void 0 ? void 0 : _slotProps.root) })
|
|
18
|
+
return (jsxRuntime.jsx(index.default, Object.assign({ transition: "zoom" }, props, { slotProps: Object.assign(Object.assign({}, _slotProps), { root: Object.assign({ display: "flex", alignItems: 'center', justifyContent: "center" }, _slotProps === null || _slotProps === void 0 ? void 0 : _slotProps.root) }), children: jsxRuntime.jsx(core.Tag, Object.assign({}, modal, { sxr: Object.assign({ maxWidth: sizes[size] || size, width: "100%", radius: 2, bgcolor: "background.primary", shadow: 15 }, modal === null || modal === void 0 ? void 0 : modal.sx), baseClass: 'modal', children: children })) })));
|
|
19
19
|
};
|
|
20
20
|
Modal.open = (id, content, props) => {
|
|
21
21
|
id = "modal-" + id;
|
|
@@ -30,7 +30,7 @@ Modal.open = (id, content, props) => {
|
|
|
30
30
|
fullWidth: "100%"
|
|
31
31
|
};
|
|
32
32
|
let _a = slotProps || {}, { modal } = _a, _slotProps = tslib.__rest(_a, ["modal"]);
|
|
33
|
-
index.default.open(id, jsxRuntime.jsx(core.Tag, Object.assign({}, modal, { sxr: Object.assign({ maxWidth: sizes[size] || size, width: "100%", radius: 2, bgcolor: "background.primary", shadow: 15 }, modal === null || modal === void 0 ? void 0 : modal.sx), baseClass: 'modal'
|
|
33
|
+
index.default.open(id, jsxRuntime.jsx(core.Tag, Object.assign({}, modal, { sxr: Object.assign({ maxWidth: sizes[size] || size, width: "100%", radius: 2, bgcolor: "background.primary", shadow: 15 }, modal === null || modal === void 0 ? void 0 : modal.sx), baseClass: 'modal', children: content })), Object.assign(Object.assign({ transition: "zoom" }, props), { slotProps: Object.assign(Object.assign({}, _slotProps), { root: Object.assign({ display: "flex", alignItems: 'center', justifyContent: "center" }, _slotProps === null || _slotProps === void 0 ? void 0 : _slotProps.root) }) }));
|
|
34
34
|
};
|
|
35
35
|
Modal.close = (id) => {
|
|
36
36
|
id = "modal-" + id;
|
package/Modal/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\nimport { ReactNode } from 'react'\nimport Layer, { LayerProps } from \"../Layer\"\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\n\n\n\nexport type ModalProps = Omit<LayerProps, \"slotProps\"> & {\n size?: useBreakpointPropsType<\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"fullWidth\" | number>;\n slotProps?: LayerProps['slotProps'] & {\n modal?: Omit<TagProps<'div'>, \"children\">\n }\n}\n\n\nconst Modal = ({ children, size, slotProps, ...props }: ModalProps) => {\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n\n let { modal, ..._slotProps }: any = slotProps || {}\n\n return (\n <Layer\n transition=\"zoom\"\n {...props}\n slotProps={{\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }}\n >\n <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {children}\n </Tag>\n </Layer>\n )\n}\n\n\nModal.open = (id: string, content: ReactNode, props?: Omit<ModalProps, \"open\" | \"children\">) => {\n id = \"modal-\" + id\n let { size, slotProps } = props || {}\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n let { modal, ..._slotProps }: any = slotProps || {}\n\n Layer.open(id, <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {content}\n </Tag>, {\n transition: \"zoom\",\n ...props,\n slotProps: {\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }\n })\n}\n\nModal.close = (id: string) => {\n id = \"modal-\" + id\n Layer.close(id)\n}\n\nexport default Modal"],"names":["__rest","useBreakpointProps","_jsx","Layer","Tag"],"mappings":"wMAeA,MAAM,KAAK,GAAG,CAAC,EAAmD,KAAI;QAAvD,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,OAAwB,EAAnB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAArC,CAAA,UAAA,EAAA,MAAA,EAAA,WAAA,CAAuC,CAAF;IAChD,MAAM,EAAE,GAAQ,EAAE;AAClB,IAAA,IAAI,IAAI;AAAE,QAAA,EAAE,CAAC,IAAI,GAAG,IAAI;AACxB,IAAA,MAAM,CAAC,GAAQC,uBAAkB,CAAC,EAAE,CAAC;AACrC,IAAA,IAAI,GAAG,CAAC,CAAC,IAAI;IACb,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,MAAA,GAAJ,IAAI,IAAJ,IAAI,GAAK,IAAI,CAAA;AACb,IAAA,IAAI,KAAK,GAAQ;AACb,QAAA,EAAE,EAAE,GAAG;AACP,QAAA,EAAE,EAAE,GAAG;AACP,QAAA,EAAE,EAAE,GAAG;AACP,QAAA,EAAE,EAAE,IAAI;AACR,QAAA,EAAE,EAAE,IAAI;AACR,QAAA,SAAS,EAAE;KACd;AAED,IAAA,IAAI,EAAA,GAAgC,SAAS,IAAI,EAAE,EAA/C,EAAE,KAAK,EAAA,GAAA,EAAwC,EAAnC,UAAU,GAAAD,YAAA,CAAA,EAAA,EAAtB,CAAA,OAAA,CAAwB,CAAuB;AAEnD,IAAA,QACIE,cAAA,CAACC,aAAK,kBACF,UAAU,EAAC,MAAM,EAAA,EACb,KAAK,EAAA,EACT,SAAS,kCACF,UAAU,CAAA,EAAA,EACb,IAAI,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,QAAQ,EACpB,cAAc,EAAE,QAAQ,EAAA,EACrB,UAAU,KAAA,IAAA,IAAV,UAAU,KAAA,MAAA,GAAA,MAAA,GAAV,UAAU,CAAE,IAAI,CAAA,EAAA,CAAA,EAAA,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\nimport { ReactNode } from 'react'\nimport Layer, { LayerProps } from \"../Layer\"\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\n\n\n\nexport type ModalProps = Omit<LayerProps, \"slotProps\"> & {\n size?: useBreakpointPropsType<\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"fullWidth\" | number>;\n slotProps?: LayerProps['slotProps'] & {\n modal?: Omit<TagProps<'div'>, \"children\">\n }\n}\n\n\nconst Modal = ({ children, size, slotProps, ...props }: ModalProps) => {\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n\n let { modal, ..._slotProps }: any = slotProps || {}\n\n return (\n <Layer\n transition=\"zoom\"\n {...props}\n slotProps={{\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }}\n >\n <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {children}\n </Tag>\n </Layer>\n )\n}\n\n\nModal.open = (id: string, content: ReactNode, props?: Omit<ModalProps, \"open\" | \"children\">) => {\n id = \"modal-\" + id\n let { size, slotProps } = props || {}\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n let { modal, ..._slotProps }: any = slotProps || {}\n\n Layer.open(id, <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {content}\n </Tag>, {\n transition: \"zoom\",\n ...props,\n slotProps: {\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }\n })\n}\n\nModal.close = (id: string) => {\n id = \"modal-\" + id\n Layer.close(id)\n}\n\nexport default Modal"],"names":["__rest","useBreakpointProps","_jsx","Layer","Tag"],"mappings":"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"}
|
package/Modal/index.mjs
CHANGED
|
@@ -15,7 +15,7 @@ import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import Layer from
|
|
|
15
15
|
fullWidth: "100%"
|
|
16
16
|
};
|
|
17
17
|
let _b = slotProps || {}, { modal } = _b, _slotProps = __rest(_b, ["modal"]);
|
|
18
|
-
return (jsx(Layer, Object.assign({ transition: "zoom" }, props, { slotProps: Object.assign(Object.assign({}, _slotProps), { root: Object.assign({ display: "flex", alignItems: 'center', justifyContent: "center" }, _slotProps === null || _slotProps === void 0 ? void 0 : _slotProps.root) })
|
|
18
|
+
return (jsx(Layer, Object.assign({ transition: "zoom" }, props, { slotProps: Object.assign(Object.assign({}, _slotProps), { root: Object.assign({ display: "flex", alignItems: 'center', justifyContent: "center" }, _slotProps === null || _slotProps === void 0 ? void 0 : _slotProps.root) }), children: jsx(Tag, Object.assign({}, modal, { sxr: Object.assign({ maxWidth: sizes[size] || size, width: "100%", radius: 2, bgcolor: "background.primary", shadow: 15 }, modal === null || modal === void 0 ? void 0 : modal.sx), baseClass: 'modal', children: children })) })));
|
|
19
19
|
};
|
|
20
20
|
Modal.open = (id, content, props) => {
|
|
21
21
|
id = "modal-" + id;
|
|
@@ -30,7 +30,7 @@ Modal.open = (id, content, props) => {
|
|
|
30
30
|
fullWidth: "100%"
|
|
31
31
|
};
|
|
32
32
|
let _a = slotProps || {}, { modal } = _a, _slotProps = __rest(_a, ["modal"]);
|
|
33
|
-
Layer.open(id, jsx(Tag, Object.assign({}, modal, { sxr: Object.assign({ maxWidth: sizes[size] || size, width: "100%", radius: 2, bgcolor: "background.primary", shadow: 15 }, modal === null || modal === void 0 ? void 0 : modal.sx), baseClass: 'modal'
|
|
33
|
+
Layer.open(id, jsx(Tag, Object.assign({}, modal, { sxr: Object.assign({ maxWidth: sizes[size] || size, width: "100%", radius: 2, bgcolor: "background.primary", shadow: 15 }, modal === null || modal === void 0 ? void 0 : modal.sx), baseClass: 'modal', children: content })), Object.assign(Object.assign({ transition: "zoom" }, props), { slotProps: Object.assign(Object.assign({}, _slotProps), { root: Object.assign({ display: "flex", alignItems: 'center', justifyContent: "center" }, _slotProps === null || _slotProps === void 0 ? void 0 : _slotProps.root) }) }));
|
|
34
34
|
};
|
|
35
35
|
Modal.close = (id) => {
|
|
36
36
|
id = "modal-" + id;
|
package/Modal/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\nimport { ReactNode } from 'react'\nimport Layer, { LayerProps } from \"../Layer\"\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\n\n\n\nexport type ModalProps = Omit<LayerProps, \"slotProps\"> & {\n size?: useBreakpointPropsType<\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"fullWidth\" | number>;\n slotProps?: LayerProps['slotProps'] & {\n modal?: Omit<TagProps<'div'>, \"children\">\n }\n}\n\n\nconst Modal = ({ children, size, slotProps, ...props }: ModalProps) => {\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n\n let { modal, ..._slotProps }: any = slotProps || {}\n\n return (\n <Layer\n transition=\"zoom\"\n {...props}\n slotProps={{\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }}\n >\n <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {children}\n </Tag>\n </Layer>\n )\n}\n\n\nModal.open = (id: string, content: ReactNode, props?: Omit<ModalProps, \"open\" | \"children\">) => {\n id = \"modal-\" + id\n let { size, slotProps } = props || {}\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n let { modal, ..._slotProps }: any = slotProps || {}\n\n Layer.open(id, <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {content}\n </Tag>, {\n transition: \"zoom\",\n ...props,\n slotProps: {\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }\n })\n}\n\nModal.close = (id: string) => {\n id = \"modal-\" + id\n Layer.close(id)\n}\n\nexport default Modal"],"names":["_jsx"],"mappings":"sJAeA,MAAM,KAAK,GAAG,CAAC,EAAmD,KAAI;QAAvD,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,OAAwB,EAAnB,KAAK,GAAA,MAAA,CAAA,EAAA,EAArC,CAAA,UAAA,EAAA,MAAA,EAAA,WAAA,CAAuC,CAAF;IAChD,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;IACb,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,MAAA,GAAJ,IAAI,IAAJ,IAAI,GAAK,IAAI,CAAA;AACb,IAAA,IAAI,KAAK,GAAQ;AACb,QAAA,EAAE,EAAE,GAAG;AACP,QAAA,EAAE,EAAE,GAAG;AACP,QAAA,EAAE,EAAE,GAAG;AACP,QAAA,EAAE,EAAE,IAAI;AACR,QAAA,EAAE,EAAE,IAAI;AACR,QAAA,SAAS,EAAE;KACd;AAED,IAAA,IAAI,EAAA,GAAgC,SAAS,IAAI,EAAE,EAA/C,EAAE,KAAK,EAAA,GAAA,EAAwC,EAAnC,UAAU,GAAA,MAAA,CAAA,EAAA,EAAtB,CAAA,OAAA,CAAwB,CAAuB;AAEnD,IAAA,QACIA,GAAA,CAAC,KAAK,kBACF,UAAU,EAAC,MAAM,EAAA,EACb,KAAK,EAAA,EACT,SAAS,kCACF,UAAU,CAAA,EAAA,EACb,IAAI,EAAA,MAAA,CAAA,MAAA,CAAA,EACA,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,QAAQ,EACpB,cAAc,EAAE,QAAQ,EAAA,EACrB,UAAU,KAAA,IAAA,IAAV,UAAU,KAAA,MAAA,GAAA,MAAA,GAAV,UAAU,CAAE,IAAI,CAAA,EAAA,CAAA,EAAA,
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Modal/index.tsx"],"sourcesContent":["\nimport { ReactNode } from 'react'\nimport Layer, { LayerProps } from \"../Layer\"\nimport { Tag, TagProps, useBreakpointProps, useBreakpointPropsType } from '@xanui/core'\n\n\n\nexport type ModalProps = Omit<LayerProps, \"slotProps\"> & {\n size?: useBreakpointPropsType<\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"fullWidth\" | number>;\n slotProps?: LayerProps['slotProps'] & {\n modal?: Omit<TagProps<'div'>, \"children\">\n }\n}\n\n\nconst Modal = ({ children, size, slotProps, ...props }: ModalProps) => {\n const _p: any = {}\n if (size) _p.size = size\n const p: any = useBreakpointProps(_p)\n size = p.size\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n\n let { modal, ..._slotProps }: any = slotProps || {}\n\n return (\n <Layer\n transition=\"zoom\"\n {...props}\n slotProps={{\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }}\n >\n <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {children}\n </Tag>\n </Layer>\n )\n}\n\n\nModal.open = (id: string, content: ReactNode, props?: Omit<ModalProps, \"open\" | \"children\">) => {\n id = \"modal-\" + id\n let { size, slotProps } = props || {}\n size ??= \"xs\"\n let sizes: any = {\n xs: 420,\n sm: 760,\n md: 990,\n lg: 1120,\n xl: 1300,\n fullWidth: \"100%\"\n }\n let { modal, ..._slotProps }: any = slotProps || {}\n\n Layer.open(id, <Tag\n {...modal}\n sxr={{\n maxWidth: sizes[size as any] || size,\n width: \"100%\",\n radius: 2,\n bgcolor: \"background.primary\",\n shadow: 15,\n ...modal?.sx\n }}\n baseClass='modal'\n >\n {content}\n </Tag>, {\n transition: \"zoom\",\n ...props,\n slotProps: {\n ..._slotProps,\n root: {\n display: \"flex\",\n alignItems: 'center',\n justifyContent: \"center\",\n ..._slotProps?.root,\n }\n }\n })\n}\n\nModal.close = (id: string) => {\n id = \"modal-\" + id\n Layer.close(id)\n}\n\nexport default Modal"],"names":["_jsx"],"mappings":"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"}
|
package/Option/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),index=require('../ListItem/index.js');const Option = React.forwardRef((_a, ref) => {
|
|
2
2
|
var { value, children } = _a, props = tslib.__rest(_a, ["value", "children"]);
|
|
3
|
-
return (jsxRuntime.jsx(index.default, Object.assign({}, props, { ref: ref
|
|
3
|
+
return (jsxRuntime.jsx(index.default, Object.assign({}, props, { ref: ref, children: children })));
|
|
4
4
|
});exports.default=Option;//# sourceMappingURL=index.js.map
|
package/Option/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n return (\n <ListItem {...props} ref={ref}>{children}</ListItem>\n )\n})\n\nexport default Option"],"names":["__rest","_jsx","ListItem"],"mappings":"sMAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIC,cAAA,CAACC,aAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n return (\n <ListItem {...props} ref={ref}>{children}</ListItem>\n )\n})\n\nexport default Option"],"names":["__rest","_jsx","ListItem"],"mappings":"sMAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAAA,YAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIC,cAAA,CAACC,aAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAA,CAAY;AAE5D,CAAC"}
|
package/Option/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from'react';import ListItem from'../ListItem/index.mjs';const Option = React.forwardRef((_a, ref) => {
|
|
2
2
|
var { value, children } = _a, props = __rest(_a, ["value", "children"]);
|
|
3
|
-
return (jsx(ListItem, Object.assign({}, props, { ref: ref
|
|
3
|
+
return (jsx(ListItem, Object.assign({}, props, { ref: ref, children: children })));
|
|
4
4
|
});export{Option as default};//# sourceMappingURL=index.mjs.map
|
package/Option/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n return (\n <ListItem {...props} ref={ref}>{children}</ListItem>\n )\n})\n\nexport default Option"],"names":["_jsx"],"mappings":"oIAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIA,GAAA,CAAC,QAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Option/index.tsx"],"sourcesContent":["\nimport React from 'react'\nimport ListItem, { ListItemProps } from '../ListItem'\n\nexport type OptionProps = ListItemProps & {\n value: string | number;\n}\n\nconst Option = React.forwardRef(({ value, children, ...props }: OptionProps, ref: React.Ref<any>) => {\n return (\n <ListItem {...props} ref={ref}>{children}</ListItem>\n )\n})\n\nexport default Option"],"names":["_jsx"],"mappings":"oIAQA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,EAA0C,EAAE,GAAmB,KAAI;QAAnE,EAAE,KAAK,EAAE,QAAQ,EAAA,GAAA,EAAyB,EAApB,KAAK,GAAA,MAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;AACxD,IAAA,QACIA,GAAA,CAAC,QAAQ,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,KAAK,EAAA,EAAE,GAAG,EAAE,GAAG,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAA,CAAY;AAE5D,CAAC"}
|
package/Paper/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),core=require('@xanui/core');const Paper = React.forwardRef((_a, ref) => {
|
|
2
2
|
var { children } = _a, rest = tslib.__rest(_a, ["children"]);
|
|
3
3
|
let [props] = core.useInterface("default", rest, {});
|
|
4
|
-
return (jsxRuntime.jsx(core.Tag, Object.assign({}, props, { sxr: Object.assign({ radius: 1, p: 1.5, bgcolor: "background.secondary", color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'default', ref: ref
|
|
4
|
+
return (jsxRuntime.jsx(core.Tag, Object.assign({}, props, { sxr: Object.assign({ radius: 1, p: 1.5, bgcolor: "background.secondary", color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'default', ref: ref, children: children })));
|
|
5
5
|
});exports.default=Paper;//# sourceMappingURL=index.js.map
|
package/Paper/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n let [props] = useInterface<any>(\"default\", rest, {})\n return (\n <Tag\n {...props}\n sxr={{\n radius: 1,\n p: 1.5,\n bgcolor: \"background.secondary\",\n color: \"text.primary\",\n ...props?.sx\n }}\n baseClass='default'\n ref={ref}\n >{children}</Tag>\n )\n})\n\nexport default Paper\n"],"names":["__rest","useInterface","_jsx","Tag"],"mappings":"4LAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAGC,iBAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIC,cAAA,CAACC,QAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n let [props] = useInterface<any>(\"default\", rest, {})\n return (\n <Tag\n {...props}\n sxr={{\n radius: 1,\n p: 1.5,\n bgcolor: \"background.secondary\",\n color: \"text.primary\",\n ...props?.sx\n }}\n baseClass='default'\n ref={ref}\n >{children}</Tag>\n )\n})\n\nexport default Paper\n"],"names":["__rest","useInterface","_jsx","Tag"],"mappings":"4LAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAGC,iBAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIC,cAAA,CAACC,QAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,YACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC"}
|
package/Paper/index.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {__rest}from'tslib';import {jsx}from'react/jsx-runtime';import React from'react';import {useInterface,Tag}from'@xanui/core';const Paper = React.forwardRef((_a, ref) => {
|
|
2
2
|
var { children } = _a, rest = __rest(_a, ["children"]);
|
|
3
3
|
let [props] = useInterface("default", rest, {});
|
|
4
|
-
return (jsx(Tag, Object.assign({}, props, { sxr: Object.assign({ radius: 1, p: 1.5, bgcolor: "background.secondary", color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'default', ref: ref
|
|
4
|
+
return (jsx(Tag, Object.assign({}, props, { sxr: Object.assign({ radius: 1, p: 1.5, bgcolor: "background.secondary", color: "text.primary" }, props === null || props === void 0 ? void 0 : props.sx), baseClass: 'default', ref: ref, children: children })));
|
|
5
5
|
});export{Paper as default};//# sourceMappingURL=index.mjs.map
|
package/Paper/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n let [props] = useInterface<any>(\"default\", rest, {})\n return (\n <Tag\n {...props}\n sxr={{\n radius: 1,\n p: 1.5,\n bgcolor: \"background.secondary\",\n color: \"text.primary\",\n ...props?.sx\n }}\n baseClass='default'\n ref={ref}\n >{children}</Tag>\n )\n})\n\nexport default Paper\n"],"names":["_jsx"],"mappings":"mIAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAG,YAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIA,GAAA,CAAC,GAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Paper/index.tsx"],"sourcesContent":["\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useInterface } from '@xanui/core';\n\nexport type PaperProps<T extends TagComponentType = \"div\"> = TagProps<T>\n\nconst Paper = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: PaperProps<T>, ref?: React.Ref<any>) => {\n let [props] = useInterface<any>(\"default\", rest, {})\n return (\n <Tag\n {...props}\n sxr={{\n radius: 1,\n p: 1.5,\n bgcolor: \"background.secondary\",\n color: \"text.primary\",\n ...props?.sx\n }}\n baseClass='default'\n ref={ref}\n >{children}</Tag>\n )\n})\n\nexport default Paper\n"],"names":["_jsx"],"mappings":"mIAMA,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAoC,EAAE,GAAoB,KAAI;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAA,GAAA,EAA0B,EAArB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnB,YAAqB,CAAF;AACnF,IAAA,IAAI,CAAC,KAAK,CAAC,GAAG,YAAY,CAAM,SAAS,EAAE,IAAI,EAAE,EAAE,CAAC;AACpD,IAAA,QACIA,GAAA,CAAC,GAAG,oBACI,KAAK,EAAA,EACT,GAAG,EAAA,MAAA,CAAA,MAAA,CAAA,EACC,MAAM,EAAE,CAAC,EACT,CAAC,EAAE,GAAG,EACN,OAAO,EAAE,sBAAsB,EAC/B,KAAK,EAAE,cAAc,EAAA,EAClB,KAAK,KAAA,IAAA,IAAL,KAAK,uBAAL,KAAK,CAAE,EAAE,CAAA,EAEhB,SAAS,EAAC,SAAS,EACnB,GAAG,EAAE,GAAG,YACV,QAAQ,EAAA,CAAA,CAAO;AAEzB,CAAC"}
|
package/Portal/index.js
CHANGED
|
@@ -22,5 +22,5 @@
|
|
|
22
22
|
}, []);
|
|
23
23
|
if (!_container)
|
|
24
24
|
return jsxRuntime.jsx(jsxRuntime.Fragment, {});
|
|
25
|
-
return ReactDOM.createPortal(jsxRuntime.jsx(core.ThemeProvider,
|
|
25
|
+
return ReactDOM.createPortal(jsxRuntime.jsx(core.ThemeProvider, { theme: theme.name, children: children }), _container);
|
|
26
26
|
});exports.default=Portal;//# sourceMappingURL=index.js.map
|
package/Portal/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTagProps, TagProps, TagComponentType, useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n appendTo?: HTMLElement;\n container?: HTMLElement;\n}\n\nconst Portal = React.forwardRef(<T extends TagComponentType = \"div\">({ children, component, appendTo, container, ...rest }: PortalProps<T>, ref?: React.Ref<any>) => {\n const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n let props = useTagProps(rest)\n const theme = useTheme()\n\n useEffect(() => {\n appendTo = appendTo || document.body\n let _con: HTMLElement = _container || document.createElement(component as any || \"div\");\n appendTo.appendChild(_con);\n for (let prop in props) {\n _con.setAttribute(prop, (props as any)[prop])\n }\n if (!_container) {\n setContainer(_con)\n }\n if (ref) {\n (ref as any).current = _con\n }\n return () => {\n (appendTo as any).removeChild(_con);\n }\n }, [])\n\n if (!_container) return <></>\n\n return ReactDOM.createPortal(\n <ThemeProvider theme={theme.name}>\n {children}\n </ThemeProvider>,\n _container,\n );\n})\n\nexport default Portal"],"names":["__rest","useState","useTagProps","useTheme","useEffect","_jsx","ThemeProvider"],"mappings":"0NASA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAqE,EAAE,GAAoB,KAAI;AAA/F,IAAA,IAAA,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAA,GAAA,EAA2B,EAAtB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnD,CAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,CAAqD,CAAF;IACpH,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAGC,cAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,IAAI,KAAK,GAAGC,gBAAW,CAAC,IAAI,CAAC;AAC7B,IAAA,MAAM,KAAK,GAAGC,aAAQ,EAAE;IAExBC,eAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AACpC,QAAA,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,SAAgB,IAAI,KAAK,CAAC;AACvF,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAG,KAAa,CAAC,IAAI,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTagProps, TagProps, TagComponentType, useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n appendTo?: HTMLElement;\n container?: HTMLElement;\n}\n\nconst Portal = React.forwardRef(<T extends TagComponentType = \"div\">({ children, component, appendTo, container, ...rest }: PortalProps<T>, ref?: React.Ref<any>) => {\n const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n let props = useTagProps(rest)\n const theme = useTheme()\n\n useEffect(() => {\n appendTo = appendTo || document.body\n let _con: HTMLElement = _container || document.createElement(component as any || \"div\");\n appendTo.appendChild(_con);\n for (let prop in props) {\n _con.setAttribute(prop, (props as any)[prop])\n }\n if (!_container) {\n setContainer(_con)\n }\n if (ref) {\n (ref as any).current = _con\n }\n return () => {\n (appendTo as any).removeChild(_con);\n }\n }, [])\n\n if (!_container) return <></>\n\n return ReactDOM.createPortal(\n <ThemeProvider theme={theme.name}>\n {children}\n </ThemeProvider>,\n _container,\n );\n})\n\nexport default Portal"],"names":["__rest","useState","useTagProps","useTheme","useEffect","_jsx","ThemeProvider"],"mappings":"0NASA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAqE,EAAE,GAAoB,KAAI;AAA/F,IAAA,IAAA,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAA,GAAA,EAA2B,EAAtB,IAAI,GAAAA,YAAA,CAAA,EAAA,EAAnD,CAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,CAAqD,CAAF;IACpH,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAGC,cAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,IAAI,KAAK,GAAGC,gBAAW,CAAC,IAAI,CAAC;AAC7B,IAAA,MAAM,KAAK,GAAGC,aAAQ,EAAE;IAExBC,eAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AACpC,QAAA,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,SAAgB,IAAI,KAAK,CAAC;AACvF,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAG,KAAa,CAAC,IAAI,CAAC,CAAC;QACjD;QACA,IAAI,CAAC,UAAU,EAAE;YACb,YAAY,CAAC,IAAI,CAAC;QACtB;QACA,IAAI,GAAG,EAAE;AACJ,YAAA,GAAW,CAAC,OAAO,GAAG,IAAI;QAC/B;AACA,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,IAAI,CAAC;AACvC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAOC,uCAAK;AAE7B,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBA,cAAA,CAACC,kBAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,UAAU,CACb;AACL,CAAC"}
|
package/Portal/index.mjs
CHANGED
|
@@ -22,5 +22,5 @@ import {__rest}from'tslib';import {jsx,Fragment}from'react/jsx-runtime';import R
|
|
|
22
22
|
}, []);
|
|
23
23
|
if (!_container)
|
|
24
24
|
return jsx(Fragment, {});
|
|
25
|
-
return ReactDOM.createPortal(jsx(ThemeProvider,
|
|
25
|
+
return ReactDOM.createPortal(jsx(ThemeProvider, { theme: theme.name, children: children }), _container);
|
|
26
26
|
});export{Portal as default};//# sourceMappingURL=index.mjs.map
|
package/Portal/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTagProps, TagProps, TagComponentType, useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n appendTo?: HTMLElement;\n container?: HTMLElement;\n}\n\nconst Portal = React.forwardRef(<T extends TagComponentType = \"div\">({ children, component, appendTo, container, ...rest }: PortalProps<T>, ref?: React.Ref<any>) => {\n const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n let props = useTagProps(rest)\n const theme = useTheme()\n\n useEffect(() => {\n appendTo = appendTo || document.body\n let _con: HTMLElement = _container || document.createElement(component as any || \"div\");\n appendTo.appendChild(_con);\n for (let prop in props) {\n _con.setAttribute(prop, (props as any)[prop])\n }\n if (!_container) {\n setContainer(_con)\n }\n if (ref) {\n (ref as any).current = _con\n }\n return () => {\n (appendTo as any).removeChild(_con);\n }\n }, [])\n\n if (!_container) return <></>\n\n return ReactDOM.createPortal(\n <ThemeProvider theme={theme.name}>\n {children}\n </ThemeProvider>,\n _container,\n );\n})\n\nexport default Portal"],"names":["_jsx"],"mappings":"kNASA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAqE,EAAE,GAAoB,KAAI;AAA/F,IAAA,IAAA,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAA,GAAA,EAA2B,EAAtB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnD,CAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,CAAqD,CAAF;IACpH,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAG,QAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,IAAI,KAAK,GAAG,WAAW,CAAC,IAAI,CAAC;AAC7B,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IAExB,SAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AACpC,QAAA,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,SAAgB,IAAI,KAAK,CAAC;AACvF,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAG,KAAa,CAAC,IAAI,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/Portal/index.tsx"],"sourcesContent":["\nimport React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom';\nimport { useTagProps, TagProps, TagComponentType, useTheme, ThemeProvider } from '@xanui/core';\nexport type PortalProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n appendTo?: HTMLElement;\n container?: HTMLElement;\n}\n\nconst Portal = React.forwardRef(<T extends TagComponentType = \"div\">({ children, component, appendTo, container, ...rest }: PortalProps<T>, ref?: React.Ref<any>) => {\n const [_container, setContainer] = useState<HTMLElement | undefined>(container)\n let props = useTagProps(rest)\n const theme = useTheme()\n\n useEffect(() => {\n appendTo = appendTo || document.body\n let _con: HTMLElement = _container || document.createElement(component as any || \"div\");\n appendTo.appendChild(_con);\n for (let prop in props) {\n _con.setAttribute(prop, (props as any)[prop])\n }\n if (!_container) {\n setContainer(_con)\n }\n if (ref) {\n (ref as any).current = _con\n }\n return () => {\n (appendTo as any).removeChild(_con);\n }\n }, [])\n\n if (!_container) return <></>\n\n return ReactDOM.createPortal(\n <ThemeProvider theme={theme.name}>\n {children}\n </ThemeProvider>,\n _container,\n );\n})\n\nexport default Portal"],"names":["_jsx"],"mappings":"kNASA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC,CAAqC,EAAqE,EAAE,GAAoB,KAAI;AAA/F,IAAA,IAAA,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAA,GAAA,EAA2B,EAAtB,IAAI,GAAA,MAAA,CAAA,EAAA,EAAnD,CAAA,UAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,CAAqD,CAAF;IACpH,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,GAAG,QAAQ,CAA0B,SAAS,CAAC;AAC/E,IAAA,IAAI,KAAK,GAAG,WAAW,CAAC,IAAI,CAAC;AAC7B,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IAExB,SAAS,CAAC,MAAK;AACX,QAAA,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC,IAAI;AACpC,QAAA,IAAI,IAAI,GAAgB,UAAU,IAAI,QAAQ,CAAC,aAAa,CAAC,SAAgB,IAAI,KAAK,CAAC;AACvF,QAAA,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC;AAC1B,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;YACpB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAG,KAAa,CAAC,IAAI,CAAC,CAAC;QACjD;QACA,IAAI,CAAC,UAAU,EAAE;YACb,YAAY,CAAC,IAAI,CAAC;QACtB;QACA,IAAI,GAAG,EAAE;AACJ,YAAA,GAAW,CAAC,OAAO,GAAG,IAAI;QAC/B;AACA,QAAA,OAAO,MAAK;AACP,YAAA,QAAgB,CAAC,WAAW,CAAC,IAAI,CAAC;AACvC,QAAA,CAAC;IACL,CAAC,EAAE,EAAE,CAAC;AAEN,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAOA,iBAAK;AAE7B,IAAA,OAAO,QAAQ,CAAC,YAAY,CACxBA,GAAA,CAAC,aAAa,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,QAAA,EAC3B,QAAQ,GACG,EAChB,UAAU,CACb;AACL,CAAC"}
|
package/Scrollbar/index.js
CHANGED
|
@@ -46,20 +46,20 @@
|
|
|
46
46
|
// scrollbarColor: `${thumbColor} ${trackColor}`, //"#888 #f4f4f4", // Thumb and track colors for Firefox
|
|
47
47
|
// msOverflowStyle: "scrollbar", // Internet Explorer
|
|
48
48
|
"&::-webkit-scrollbar": {
|
|
49
|
-
width: thumbSize,
|
|
49
|
+
width: thumbSize, // Width of the vertical scrollbar
|
|
50
50
|
height: thumbSize, // Height of the horizontal scrollbar
|
|
51
51
|
},
|
|
52
52
|
"&::-webkit-scrollbar-thumb": {
|
|
53
|
-
backgroundColor: thumbColor,
|
|
54
|
-
borderRadius: "5px",
|
|
53
|
+
backgroundColor: thumbColor, // Color of the scroll thumb
|
|
54
|
+
borderRadius: "5px", // Rounded corners
|
|
55
55
|
border: "2px solid #f4f4f4", // Space around the thumb
|
|
56
56
|
},
|
|
57
57
|
"&::-webkit-scrollbar-thumb:hover": {
|
|
58
58
|
backgroundColor: thumbColor, // Thumb color on hover
|
|
59
59
|
},
|
|
60
60
|
"&::-webkit-scrollbar-track": {
|
|
61
|
-
backgroundColor: trackColor,
|
|
61
|
+
backgroundColor: trackColor, // Background color of the scrollbar track
|
|
62
62
|
borderRadius: "5px", // Rounded corners
|
|
63
63
|
},
|
|
64
|
-
}
|
|
64
|
+
}, children: children })));
|
|
65
65
|
});exports.default=Scrollbar;//# sourceMappingURL=index.js.map
|