@xanui/ui 1.2.7 → 1.2.9

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.
@@ -11,8 +11,8 @@ var index = require('../List/index.cjs');
11
11
  var index$1 = require('../ListItem/index.cjs');
12
12
 
13
13
  const Accordion = React.forwardRef((_a, ref) => {
14
- var { children, title, subtitle } = _a, rest = tslib.__rest(_a, ["children", "title", "subtitle"]);
15
- const [_expand, setExpand] = React.useState(false);
14
+ var { children, title, subtitle, defaultExpand } = _a, rest = tslib.__rest(_a, ["children", "title", "subtitle", "defaultExpand"]);
15
+ const [_expand, setExpand] = React.useState(defaultExpand || false);
16
16
  let [_b] = core.useInterface("Accordion", rest, {
17
17
  onClick: () => setExpand(!_expand),
18
18
  color: "primary",
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps from '../Collaps';\nimport List from '../List';\nimport ListItem from '../ListItem';\nimport type { CollapsProps } from '../Collaps';\nimport type { ListProps } from '../List';\nimport type { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"open\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"primary\",\n variant: \"ghost\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"surface.contrast\",\n p: 2,\n py: 1,\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;AAmCA;;;AAEI;;AAiBI;AACA;AACH;;AAGD;AAAW;AACX;AAAc;AACd;AAAe;AACf;AAAa;AACb;AAAgB;AAChB;AAAyB;AACzB;AAAkB;AAClB;AAAW;AACX;AAAa;AACb;AAAgB;AAChB;AAAkB;AAElB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAqBA;AACI;;AAIY;AACA;AACA;AACA;;;;;;AAUZ;;AAIY;AACA;AACA;AACA;;;;;AAUhB;AACI;AACA;;AAGJ;AAIY;AACH;AAiCe;AACA;AACA;AACA;;AAU5B;;"}
1
+ {"version":3,"file":"index.cjs","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps from '../Collaps';\nimport List from '../List';\nimport ListItem from '../ListItem';\nimport type { CollapsProps } from '../Collaps';\nimport type { ListProps } from '../List';\nimport type { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n defaultExpand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"open\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, defaultExpand, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(defaultExpand || false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"primary\",\n variant: \"ghost\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"surface.contrast\",\n p: 2,\n py: 1,\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":[],"mappings":";;;;;;;;;;;;AAoCA;AAAwE;AACpE;AACA;;AAiBI;AACA;AACH;;AAGD;AAAW;AACX;AAAc;AACd;AAAe;AACf;AAAa;AACb;AAAgB;AAChB;AAAyB;AACzB;AAAkB;AAClB;AAAW;AACX;AAAa;AACb;AAAgB;AAChB;AAAkB;AAElB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAqBA;AACI;;AAIY;AACA;AACA;AACA;;;;;;AAUZ;;AAIY;AACA;AACA;AACA;;;;;AAUhB;AACI;AACA;;AAGJ;AAIY;AACH;AAiCe;AACA;AACA;AACA;;AAU5B;;"}
@@ -6,6 +6,7 @@ import { ListItemProps } from '../ListItem/index.js';
6
6
 
7
7
  type AccordionProps<T extends TagComponentType = "div"> = Omit<TagProps<T>, "color"> & {
8
8
  expand?: boolean;
9
+ defaultExpand?: boolean;
9
10
  onClick?: () => void;
10
11
  title: useBreakpointPropsType<ReactElement | string>;
11
12
  subtitle?: useBreakpointPropsType<ReactElement | string>;
@@ -9,8 +9,8 @@ import List from '../List/index.js';
9
9
  import ListItem from '../ListItem/index.js';
10
10
 
11
11
  const Accordion = React.forwardRef((_a, ref) => {
12
- var { children, title, subtitle } = _a, rest = __rest(_a, ["children", "title", "subtitle"]);
13
- const [_expand, setExpand] = useState(false);
12
+ var { children, title, subtitle, defaultExpand } = _a, rest = __rest(_a, ["children", "title", "subtitle", "defaultExpand"]);
13
+ const [_expand, setExpand] = useState(defaultExpand || false);
14
14
  let [_b] = useInterface("Accordion", rest, {
15
15
  onClick: () => setExpand(!_expand),
16
16
  color: "primary",
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps from '../Collaps';\nimport List from '../List';\nimport ListItem from '../ListItem';\nimport type { CollapsProps } from '../Collaps';\nimport type { ListProps } from '../List';\nimport type { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"open\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"primary\",\n variant: \"ghost\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"surface.contrast\",\n p: 2,\n py: 1,\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":[],"mappings":";;;;;;;;;;AAmCA;;;AAEI;;AAiBI;AACA;AACH;;AAGD;AAAW;AACX;AAAc;AACd;AAAe;AACf;AAAa;AACb;AAAgB;AAChB;AAAyB;AACzB;AAAkB;AAClB;AAAW;AACX;AAAa;AACb;AAAgB;AAChB;AAAkB;AAElB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAqBA;AACI;;AAIY;AACA;AACA;AACA;;;;;;AAUZ;;AAIY;AACA;AACA;AACA;;;;;AAUhB;AACI;AACA;;AAGJ;AAIY;AACH;AAiCe;AACA;AACA;AACA;;AAU5B;;"}
1
+ {"version":3,"file":"index.js","sources":["../../src/Accordion/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { ReactElement, useState } from 'react';\nimport { Tag, TagProps, useInterface, UseColorTemplateColor, UseColorTemplateType, TagComponentType, useBreakpointPropsType, useBreakpointProps } from '@xanui/core';\nimport ExpandIcon from \"@xanui/icons/ExpandMore\";\nimport Collaps from '../Collaps';\nimport List from '../List';\nimport ListItem from '../ListItem';\nimport type { CollapsProps } from '../Collaps';\nimport type { ListProps } from '../List';\nimport type { ListItemProps } from '../ListItem';\n\nexport type AccordionProps<T extends TagComponentType = \"div\"> = Omit<TagProps<T>, \"color\"> & {\n expand?: boolean;\n defaultExpand?: boolean;\n onClick?: () => void;\n title: useBreakpointPropsType<ReactElement | string>;\n subtitle?: useBreakpointPropsType<ReactElement | string>;\n startIcon?: useBreakpointPropsType<ReactElement>;\n endIcon?: useBreakpointPropsType<ReactElement>;\n expandIcon?: useBreakpointPropsType<ReactElement>;\n expandIconPlacement?: useBreakpointPropsType<\"start\" | \"end\">;\n expandAction?: useBreakpointPropsType<\"header\" | \"icon\">;\n color?: useBreakpointPropsType<UseColorTemplateColor>;\n variant?: useBreakpointPropsType<UseColorTemplateType>;\n hoverColor?: useBreakpointPropsType<UseColorTemplateColor>;\n hoverVariant?: useBreakpointPropsType<UseColorTemplateType>;\n\n slotProps?: {\n header?: Omit<ListProps, \"children\" | \"color\" | \"variant\" | \"hoverColor\" | \"hoverVariant\" | \"className\">;\n headerContent?: Omit<ListItemProps, \"children\" | \"subtitle\" | \"selected\" | \"startIcon\" | \"endIcon\" | \"onClick\" | \"className\">\n collaps?: Omit<CollapsProps, \"children\" | \"open\">;\n content?: Omit<TagProps, \"children\">;\n expandIconContainer?: Omit<TagProps<\"div\">, 'children' | 'className'>;\n }\n}\n\nconst Accordion = React.forwardRef(<T extends TagComponentType = \"div\">({ children, title, subtitle, defaultExpand, ...rest }: AccordionProps<T>, ref: React.Ref<any>) => {\n const [_expand, setExpand] = useState(defaultExpand || false)\n let [{\n expand,\n onClick,\n color,\n variant,\n hoverColor,\n hoverVariant,\n expandIcon,\n expandIconPlacement,\n startIcon,\n endIcon,\n expandAction,\n classNames,\n slotProps,\n ...rootProps\n }] = useInterface<any>(\"Accordion\", rest, {\n onClick: () => setExpand(!_expand) as any,\n color: \"primary\",\n variant: \"ghost\"\n })\n\n const _p: any = {}\n if (title) _p.title = title\n if (subtitle) _p.subtitle = subtitle\n if (startIcon) _p.startIcon = startIcon\n if (endIcon) _p.endIcon = endIcon\n if (expandIcon) _p.expandIcon = expandIcon\n if (expandIconPlacement) _p.expandIconPlacement = expandIconPlacement\n if (expandAction) _p.expandAction = expandAction\n if (color) _p.color = color\n if (variant) _p.variant = variant\n if (hoverColor) _p.hoverColor = hoverColor\n if (hoverVariant) _p.hoverVariant = hoverVariant\n\n const p: any = useBreakpointProps(_p)\n\n title = p.title\n subtitle = p.subtitle\n startIcon = p.startIcon\n endIcon = p.endIcon\n expandIcon = p.expandIcon\n expandIconPlacement = p.expandIconPlacement\n expandAction = p.expandAction\n color = p.color\n variant = p.variant\n hoverColor = p.hoverColor\n hoverVariant = p.hoverVariant\n\n expand = expand === undefined ? _expand : expand\n expandIcon = expandIcon ? <Tag\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n {expandIcon}\n </Tag> : <Tag\n transform={`rotate(${expand ? 0 : -180}deg)`}\n transition=\"transform .4s\"\n cursor=\"pointer\"\n {...slotProps?.expandIconContainer}\n onClick={expandAction === 'icon' && onClick ? () => onClick() : () => { }}\n className='expand-icon-container'\n >\n <ExpandIcon />\n </Tag>\n\n let itemsx: any = {}\n\n if (expandIconPlacement === 'start') {\n itemsx = {\n startIcon: <Tag\n className='start-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {expandIcon}\n {startIcon}\n </Tag>,\n endIcon\n }\n\n } else {\n itemsx = {\n endIcon: <Tag\n className='end-icon-container'\n sxr={{\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"center\",\n gap: 1\n }}\n >\n {endIcon}\n {expandIcon}\n </Tag>,\n startIcon\n }\n }\n\n if (expandAction === 'icon') {\n itemsx.onClick = () => { }\n itemsx.cursor = \"initial!important\"\n }\n\n return (\n <Tag\n {...rootProps}\n sxr={{\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion'\n classNames={[{ \"accordion-expanded\": expand }, ...(classNames || [])]}\n ref={ref}\n >\n <List\n component='div'\n {...slotProps?.header}\n color={color}\n variant={variant}\n hoverColor={hoverColor}\n hoverVariant={hoverVariant}\n className='accoutdion-header'\n >\n <ListItem\n minHeight={55}\n radius={0}\n component='div'\n {...slotProps?.headerContent}\n {...itemsx}\n subtitle={subtitle}\n selected={expand}\n onClick={() => onClick && onClick()}\n className=\"accordion-header-content\"\n >{title}</ListItem>\n <Collaps\n {...slotProps?.collaps}\n open={expand}\n className=\"accordion-collaps\"\n >\n <Tag\n {...slotProps?.content}\n sxr={{\n color: \"surface.contrast\",\n p: 2,\n py: 1,\n bgcolor: \"surface.main\"\n }}\n baseClass='accordion-content'\n >\n {children}\n </Tag>\n </Collaps>\n </List>\n </Tag>\n )\n})\nexport default Accordion\n\n\n"],"names":[],"mappings":";;;;;;;;;;AAoCA;AAAwE;AACpE;AACA;;AAiBI;AACA;AACH;;AAGD;AAAW;AACX;AAAc;AACd;AAAe;AACf;AAAa;AACb;AAAgB;AAChB;AAAyB;AACzB;AAAkB;AAClB;AAAW;AACX;AAAa;AACb;AAAgB;AAChB;AAAkB;AAElB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;AAqBA;AACI;;AAIY;AACA;AACA;AACA;;;;;;AAUZ;;AAIY;AACA;AACA;AACA;;;;;AAUhB;AACI;AACA;;AAGJ;AAIY;AACH;AAiCe;AACA;AACA;AACA;;AAU5B;;"}
@@ -21,7 +21,7 @@ type AvatarPickerProps<T extends TagComponentType = "div"> = TagProps<T> & {
21
21
  menu?: Omit<MenuProps, "target" | "onClickOutside">;
22
22
  };
23
23
  };
24
- declare const AvatarPicker: React__default.ForwardRefExoticComponent<Omit<AvatarPickerProps<"div">, "ref"> & React__default.RefAttributes<"symbol" | "object" | "cite" | "data" | "form" | "label" | "pattern" | "span" | "summary" | "slot" | "style" | "title" | "div" | "filter" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "big" | "text" | "button" | "p" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "center" | "code" | "col" | "colgroup" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "search" | "script" | "section" | "select" | "source" | "strong" | "sub" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | React__default.ComponentClass<any, any> | React__default.FunctionComponent<any>>>;
24
+ declare const AvatarPicker: React__default.ForwardRefExoticComponent<Omit<AvatarPickerProps<"div">, "ref"> & React__default.RefAttributes<"symbol" | "object" | "title" | "search" | "big" | "link" | "small" | "sub" | "sup" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | React__default.ComponentClass<any, any> | React__default.FunctionComponent<any>>>;
25
25
 
26
26
  export { AvatarPicker as default };
27
27
  export type { AvataPickerValue, AvatarPickerProps };
package/Card/index.cjs ADDED
@@ -0,0 +1,34 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var tslib = require('tslib');
5
+ var jsxRuntime = require('react/jsx-runtime');
6
+ var React = require('react');
7
+ var core = require('@xanui/core');
8
+
9
+ const Card = React.forwardRef((_a, ref) => {
10
+ var _b;
11
+ var { children } = _a, rest = tslib.__rest(_a, ["children"]);
12
+ let [_c] = core.useInterface('Card', rest, {}), { variant } = _c, props = tslib.__rest(_c, ["variant"]);
13
+ const _p = {};
14
+ if (variant !== undefined)
15
+ _p.variant = variant;
16
+ const p = core.useBreakpointProps(_p);
17
+ variant = (_b = p.variant) !== null && _b !== void 0 ? _b : "elevated";
18
+ const variantSx = {
19
+ elevated: {
20
+ shadow: 2,
21
+ },
22
+ outlined: {
23
+ border: '1px solid',
24
+ borderColor: 'surface.divider',
25
+ },
26
+ filled: {
27
+ bgcolor: 'surface.light',
28
+ },
29
+ };
30
+ return (jsxRuntime.jsx(core.Tag, Object.assign({}, props, { baseClass: 'card', ref: ref, sxr: Object.assign({ display: 'flex', flexDirection: 'column', gap: 1, radius: 1, overflow: 'hidden', p: 1 }, (variant ? variantSx[variant] : {})), children: children })));
31
+ });
32
+
33
+ module.exports = Card;
34
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs","sources":["../../src/Card/index.tsx"],"sourcesContent":["\"use client\"\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useBreakpointProps, useInterface } from '@xanui/core';\n\nexport type CardProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n variant?: 'elevated' | 'outlined' | 'filled' | false;\n}\n\nconst Card = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: CardProps<T>, ref: React.Ref<any>) => {\n\n let [{\n variant,\n ...props\n }] = useInterface<any>('Card', rest, {})\n\n const _p: any = {}\n if (variant !== undefined) _p.variant = variant\n const p: any = useBreakpointProps(_p)\n variant = p.variant ?? \"elevated\";\n\n const variantSx: any = {\n elevated: {\n shadow: 2,\n },\n outlined: {\n border: '1px solid',\n borderColor: 'surface.divider',\n },\n filled: {\n bgcolor: 'surface.light',\n },\n }\n\n return (\n <Tag\n {...props}\n baseClass='card'\n ref={ref}\n sxr={{\n display: 'flex',\n flexDirection: 'column',\n gap: 1,\n radius: 1,\n overflow: 'hidden',\n p: 1,\n ...(variant ? variantSx[variant] : {}),\n }}\n >{children}</Tag>\n )\n})\n\nexport default Card\n\n"],"names":[],"mappings":";;;;;;;;AAQA;;AAAmE;AAEhE;;;AAM2B;AAC3B;AACA;AAEA;AACG;AACG;AACF;AACD;AACG;AACA;AACF;AACD;AACG;AACF;;;AAmBP;;"}
@@ -0,0 +1,10 @@
1
+ import React__default from 'react';
2
+ import { TagComponentType, TagProps } from '@xanui/core';
3
+
4
+ type CardProps<T extends TagComponentType = "div"> = TagProps<T> & {
5
+ variant?: 'elevated' | 'outlined' | 'filled' | false;
6
+ };
7
+ declare const Card: React__default.ForwardRefExoticComponent<Omit<CardProps<TagComponentType>, "ref"> & React__default.RefAttributes<any>>;
8
+
9
+ export { Card as default };
10
+ export type { CardProps };
package/Card/index.js ADDED
@@ -0,0 +1,32 @@
1
+ "use client";
2
+ import { __rest } from 'tslib';
3
+ import { jsx } from 'react/jsx-runtime';
4
+ import React from 'react';
5
+ import { useInterface, useBreakpointProps, Tag } from '@xanui/core';
6
+
7
+ const Card = React.forwardRef((_a, ref) => {
8
+ var _b;
9
+ var { children } = _a, rest = __rest(_a, ["children"]);
10
+ let [_c] = useInterface('Card', rest, {}), { variant } = _c, props = __rest(_c, ["variant"]);
11
+ const _p = {};
12
+ if (variant !== undefined)
13
+ _p.variant = variant;
14
+ const p = useBreakpointProps(_p);
15
+ variant = (_b = p.variant) !== null && _b !== void 0 ? _b : "elevated";
16
+ const variantSx = {
17
+ elevated: {
18
+ shadow: 2,
19
+ },
20
+ outlined: {
21
+ border: '1px solid',
22
+ borderColor: 'surface.divider',
23
+ },
24
+ filled: {
25
+ bgcolor: 'surface.light',
26
+ },
27
+ };
28
+ return (jsx(Tag, Object.assign({}, props, { baseClass: 'card', ref: ref, sxr: Object.assign({ display: 'flex', flexDirection: 'column', gap: 1, radius: 1, overflow: 'hidden', p: 1 }, (variant ? variantSx[variant] : {})), children: children })));
29
+ });
30
+
31
+ export { Card as default };
32
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":["../../src/Card/index.tsx"],"sourcesContent":["\"use client\"\nimport React from 'react';\nimport { Tag, TagProps, TagComponentType, useBreakpointProps, useInterface } from '@xanui/core';\n\nexport type CardProps<T extends TagComponentType = \"div\"> = TagProps<T> & {\n variant?: 'elevated' | 'outlined' | 'filled' | false;\n}\n\nconst Card = React.forwardRef(<T extends TagComponentType = \"div\">({ children, ...rest }: CardProps<T>, ref: React.Ref<any>) => {\n\n let [{\n variant,\n ...props\n }] = useInterface<any>('Card', rest, {})\n\n const _p: any = {}\n if (variant !== undefined) _p.variant = variant\n const p: any = useBreakpointProps(_p)\n variant = p.variant ?? \"elevated\";\n\n const variantSx: any = {\n elevated: {\n shadow: 2,\n },\n outlined: {\n border: '1px solid',\n borderColor: 'surface.divider',\n },\n filled: {\n bgcolor: 'surface.light',\n },\n }\n\n return (\n <Tag\n {...props}\n baseClass='card'\n ref={ref}\n sxr={{\n display: 'flex',\n flexDirection: 'column',\n gap: 1,\n radius: 1,\n overflow: 'hidden',\n p: 1,\n ...(variant ? variantSx[variant] : {}),\n }}\n >{children}</Tag>\n )\n})\n\nexport default Card\n\n"],"names":[],"mappings":";;;;;;AAQA;;AAAmE;AAEhE;;;AAM2B;AAC3B;AACA;AAEA;AACG;AACG;AACF;AACD;AACG;AACA;AACF;AACD;AACG;AACF;;;AAmBP;;"}
@@ -17,7 +17,7 @@ type FilePickerProps<T extends TagComponentType = "div"> = Omit<TagProps<T>, 'ac
17
17
  onDragLeave?: (e: React__default.DragEvent) => void;
18
18
  onError?: (error: FilePickerError) => void;
19
19
  };
20
- declare const _default: React__default.ForwardRefExoticComponent<Omit<FilePickerProps<TagComponentType>, "ref"> & React__default.RefAttributes<"symbol" | "object" | "cite" | "data" | "form" | "label" | "pattern" | "span" | "summary" | "slot" | "style" | "title" | "div" | "filter" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "big" | "text" | "button" | "p" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "center" | "code" | "col" | "colgroup" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "search" | "script" | "section" | "select" | "source" | "strong" | "sub" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | React__default.ComponentClass<any, any> | React__default.FunctionComponent<any>>>;
20
+ declare const _default: React__default.ForwardRefExoticComponent<Omit<FilePickerProps<TagComponentType>, "ref"> & React__default.RefAttributes<"symbol" | "object" | "title" | "search" | "big" | "link" | "small" | "sub" | "sup" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | React__default.ComponentClass<any, any> | React__default.FunctionComponent<any>>>;
21
21
 
22
22
  export { _default as default };
23
23
  export type { FilePickerError, FilePickerProps };
@@ -20,7 +20,7 @@ type GalleryPickerProps<T extends TagComponentType = "div"> = Omit<TagProps<T>,
20
20
  content?: Omit<TagProps, "children">;
21
21
  };
22
22
  };
23
- declare const GalleryPicker: React__default.ForwardRefExoticComponent<Omit<GalleryPickerProps<"div">, "ref"> & React__default.RefAttributes<"symbol" | "object" | "cite" | "data" | "form" | "label" | "pattern" | "span" | "summary" | "slot" | "style" | "title" | "div" | "filter" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "big" | "text" | "button" | "p" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "canvas" | "caption" | "center" | "code" | "col" | "colgroup" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "legend" | "li" | "link" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "search" | "script" | "section" | "select" | "source" | "strong" | "sub" | "sup" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "textPath" | "tspan" | "use" | "view" | React__default.ComponentClass<any, any> | React__default.FunctionComponent<any>>>;
23
+ declare const GalleryPicker: React__default.ForwardRefExoticComponent<Omit<GalleryPickerProps<"div">, "ref"> & React__default.RefAttributes<"symbol" | "object" | "title" | "search" | "big" | "link" | "small" | "sub" | "sup" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "map" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "style" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "clipPath" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "filter" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "marker" | "mask" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | React__default.ComponentClass<any, any> | React__default.FunctionComponent<any>>>;
24
24
 
25
25
  export { GalleryPicker as default };
26
26
  export type { GalleryPickerProps };
package/index.cjs CHANGED
@@ -13,59 +13,60 @@ var index$9 = require('./ButtonGroup/index.cjs');
13
13
  var index$a = require('./Calendar/index.cjs');
14
14
  var index$b = require('./CalendarInput/index.cjs');
15
15
  var index$c = require('./Carousel/index.cjs');
16
- var index$d = require('./Checkbox/index.cjs');
17
- var index$e = require('./Chip/index.cjs');
18
- var index$f = require('./CircleProgress/index.cjs');
19
- var index$g = require('./ClickOutside/index.cjs');
20
- var index$h = require('./Collaps/index.cjs');
21
- var index$i = require('./Container/index.cjs');
22
- var index$j = require('./Datatable/index.cjs');
23
- var index$k = require('./DataFilter/index.cjs');
24
- var index$l = require('./Divider/index.cjs');
25
- var index$m = require('./Drawer/index.cjs');
26
- var index$n = require('./FilePicker/index.cjs');
27
- var index$o = require('./Form/index.cjs');
28
- var index$p = require('./GalleryPicker/index.cjs');
29
- var index$q = require('./GridContainer/index.cjs');
30
- var index$r = require('./GridItem/index.cjs');
31
- var index$s = require('./IconButton/index.cjs');
32
- var index$t = require('./Image/index.cjs');
33
- var index$u = require('./Input/index.cjs');
34
- var index$v = require('./InputNumber/index.cjs');
35
- var index$w = require('./Label/index.cjs');
36
- var index$x = require('./Layer/index.cjs');
37
- var index$y = require('./LineProgress/index.cjs');
38
- var index$z = require('./Link/index.cjs');
39
- var index$A = require('./List/index.cjs');
40
- var index$B = require('./ListItem/index.cjs');
41
- var index$C = require('./LoadingBox/index.cjs');
42
- var index$D = require('./Menu/index.cjs');
43
- var index$E = require('./Modal/index.cjs');
44
- var index$F = require('./NoSSR/index.cjs');
45
- var index$G = require('./Option/index.cjs');
46
- var index$H = require('./PasswordInput/index.cjs');
47
- var index$I = require('./Portal/index.cjs');
48
- var index$J = require('./Radio/index.cjs');
49
- var index$K = require('./RangeSlider/index.cjs');
50
- var index$L = require('./Scrollbar/index.cjs');
51
- var index$M = require('./Select/index.cjs');
52
- var index$N = require('./Stack/index.cjs');
53
- var index$O = require('./Switch/index.cjs');
54
- var index$P = require('./Tab/index.cjs');
55
- var index$Q = require('./Table/index.cjs');
56
- var index$R = require('./TableBody/index.cjs');
57
- var index$S = require('./TableCell/index.cjs');
58
- var index$T = require('./TableFooter/index.cjs');
59
- var index$U = require('./TableHead/index.cjs');
60
- var index$V = require('./TablePagination/index.cjs');
61
- var index$W = require('./TableRow/index.cjs');
62
- var index$X = require('./Tabs/index.cjs');
63
- var index$Y = require('./Text/index.cjs');
64
- var index$Z = require('./Toast/index.cjs');
65
- var index$_ = require('./Tooltip/index.cjs');
66
- var index$$ = require('./useCorner/index.cjs');
67
- var index$10 = require('./useContextMenu/index.cjs');
68
- var index$11 = require('./ViewBox/index.cjs');
16
+ var index$d = require('./Card/index.cjs');
17
+ var index$e = require('./Checkbox/index.cjs');
18
+ var index$f = require('./Chip/index.cjs');
19
+ var index$g = require('./CircleProgress/index.cjs');
20
+ var index$h = require('./ClickOutside/index.cjs');
21
+ var index$i = require('./Collaps/index.cjs');
22
+ var index$j = require('./Container/index.cjs');
23
+ var index$k = require('./Datatable/index.cjs');
24
+ var index$l = require('./DataFilter/index.cjs');
25
+ var index$m = require('./Divider/index.cjs');
26
+ var index$n = require('./Drawer/index.cjs');
27
+ var index$o = require('./FilePicker/index.cjs');
28
+ var index$p = require('./Form/index.cjs');
29
+ var index$q = require('./GalleryPicker/index.cjs');
30
+ var index$r = require('./GridContainer/index.cjs');
31
+ var index$s = require('./GridItem/index.cjs');
32
+ var index$t = require('./IconButton/index.cjs');
33
+ var index$u = require('./Image/index.cjs');
34
+ var index$v = require('./Input/index.cjs');
35
+ var index$w = require('./InputNumber/index.cjs');
36
+ var index$x = require('./Label/index.cjs');
37
+ var index$y = require('./Layer/index.cjs');
38
+ var index$z = require('./LineProgress/index.cjs');
39
+ var index$A = require('./Link/index.cjs');
40
+ var index$B = require('./List/index.cjs');
41
+ var index$C = require('./ListItem/index.cjs');
42
+ var index$D = require('./LoadingBox/index.cjs');
43
+ var index$E = require('./Menu/index.cjs');
44
+ var index$F = require('./Modal/index.cjs');
45
+ var index$G = require('./NoSSR/index.cjs');
46
+ var index$H = require('./Option/index.cjs');
47
+ var index$I = require('./PasswordInput/index.cjs');
48
+ var index$J = require('./Portal/index.cjs');
49
+ var index$K = require('./Radio/index.cjs');
50
+ var index$L = require('./RangeSlider/index.cjs');
51
+ var index$M = require('./Scrollbar/index.cjs');
52
+ var index$N = require('./Select/index.cjs');
53
+ var index$O = require('./Stack/index.cjs');
54
+ var index$P = require('./Switch/index.cjs');
55
+ var index$Q = require('./Tab/index.cjs');
56
+ var index$R = require('./Table/index.cjs');
57
+ var index$S = require('./TableBody/index.cjs');
58
+ var index$T = require('./TableCell/index.cjs');
59
+ var index$U = require('./TableFooter/index.cjs');
60
+ var index$V = require('./TableHead/index.cjs');
61
+ var index$W = require('./TablePagination/index.cjs');
62
+ var index$X = require('./TableRow/index.cjs');
63
+ var index$Y = require('./Tabs/index.cjs');
64
+ var index$Z = require('./Text/index.cjs');
65
+ var index$_ = require('./Toast/index.cjs');
66
+ var index$$ = require('./Tooltip/index.cjs');
67
+ var index$10 = require('./useCorner/index.cjs');
68
+ var index$11 = require('./useContextMenu/index.cjs');
69
+ var index$12 = require('./ViewBox/index.cjs');
69
70
  var SelectFilter = require('./DataFilter/options/SelectFilter.cjs');
70
71
  var MultiSelectFilter = require('./DataFilter/options/MultiSelectFilter.cjs');
71
72
  var NumberFilter = require('./DataFilter/options/NumberFilter.cjs');
@@ -89,59 +90,60 @@ exports.ButtonGroup = index$9;
89
90
  exports.Calendar = index$a;
90
91
  exports.CalendarInput = index$b;
91
92
  exports.Carousel = index$c;
92
- exports.Checkbox = index$d;
93
- exports.Chip = index$e;
94
- exports.CircleProgress = index$f;
95
- exports.ClickOutside = index$g;
96
- exports.Collaps = index$h;
97
- exports.Container = index$i;
98
- exports.Datatable = index$j;
99
- exports.DataFilter = index$k.default;
100
- exports.Divider = index$l;
101
- exports.Drawer = index$m;
102
- exports.FilePicker = index$n;
103
- exports.Form = index$o;
104
- exports.GalleryPicker = index$p;
105
- exports.GridContainer = index$q;
106
- exports.GridItem = index$r;
107
- exports.IconButton = index$s;
108
- exports.Image = index$t;
109
- exports.Input = index$u;
110
- exports.InputNumber = index$v;
111
- exports.Label = index$w;
112
- exports.Layer = index$x;
113
- exports.LineProgress = index$y;
114
- exports.Link = index$z;
115
- exports.List = index$A;
116
- exports.ListItem = index$B;
117
- exports.LoadingBox = index$C;
118
- exports.Menu = index$D;
119
- exports.Modal = index$E;
120
- exports.NoSSR = index$F;
121
- exports.Option = index$G;
122
- exports.PasswordInput = index$H;
123
- exports.Portal = index$I;
124
- exports.Radio = index$J;
125
- exports.RangeSlider = index$K;
126
- exports.Scrollbar = index$L;
127
- exports.Select = index$M;
128
- exports.Stack = index$N;
129
- exports.Switch = index$O;
130
- exports.Tab = index$P;
131
- exports.Table = index$Q;
132
- exports.TableBody = index$R;
133
- exports.TableCell = index$S;
134
- exports.TableFooter = index$T;
135
- exports.TableHead = index$U;
136
- exports.TablePagination = index$V;
137
- exports.TableRow = index$W;
138
- exports.Tabs = index$X;
139
- exports.Text = index$Y;
140
- exports.Toast = index$Z;
141
- exports.Tooltip = index$_;
142
- exports.useCorner = index$$;
143
- exports.useContextMenu = index$10;
144
- exports.ViewBox = index$11;
93
+ exports.Card = index$d;
94
+ exports.Checkbox = index$e;
95
+ exports.Chip = index$f;
96
+ exports.CircleProgress = index$g;
97
+ exports.ClickOutside = index$h;
98
+ exports.Collaps = index$i;
99
+ exports.Container = index$j;
100
+ exports.Datatable = index$k;
101
+ exports.DataFilter = index$l.default;
102
+ exports.Divider = index$m;
103
+ exports.Drawer = index$n;
104
+ exports.FilePicker = index$o;
105
+ exports.Form = index$p;
106
+ exports.GalleryPicker = index$q;
107
+ exports.GridContainer = index$r;
108
+ exports.GridItem = index$s;
109
+ exports.IconButton = index$t;
110
+ exports.Image = index$u;
111
+ exports.Input = index$v;
112
+ exports.InputNumber = index$w;
113
+ exports.Label = index$x;
114
+ exports.Layer = index$y;
115
+ exports.LineProgress = index$z;
116
+ exports.Link = index$A;
117
+ exports.List = index$B;
118
+ exports.ListItem = index$C;
119
+ exports.LoadingBox = index$D;
120
+ exports.Menu = index$E;
121
+ exports.Modal = index$F;
122
+ exports.NoSSR = index$G;
123
+ exports.Option = index$H;
124
+ exports.PasswordInput = index$I;
125
+ exports.Portal = index$J;
126
+ exports.Radio = index$K;
127
+ exports.RangeSlider = index$L;
128
+ exports.Scrollbar = index$M;
129
+ exports.Select = index$N;
130
+ exports.Stack = index$O;
131
+ exports.Switch = index$P;
132
+ exports.Tab = index$Q;
133
+ exports.Table = index$R;
134
+ exports.TableBody = index$S;
135
+ exports.TableCell = index$T;
136
+ exports.TableFooter = index$U;
137
+ exports.TableHead = index$V;
138
+ exports.TablePagination = index$W;
139
+ exports.TableRow = index$X;
140
+ exports.Tabs = index$Y;
141
+ exports.Text = index$Z;
142
+ exports.Toast = index$_;
143
+ exports.Tooltip = index$$;
144
+ exports.useCorner = index$10;
145
+ exports.useContextMenu = index$11;
146
+ exports.ViewBox = index$12;
145
147
  exports.SelectFilter = SelectFilter;
146
148
  exports.MultiSelectFilter = MultiSelectFilter;
147
149
  exports.NumberFilter = NumberFilter;
package/index.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/index.d.ts CHANGED
@@ -11,6 +11,7 @@ export { default as ButtonGroup } from './ButtonGroup/index.js';
11
11
  export { default as Calendar } from './Calendar/index.js';
12
12
  export { default as CalendarInput } from './CalendarInput/index.js';
13
13
  export { default as Carousel } from './Carousel/index.js';
14
+ export { default as Card } from './Card/index.js';
14
15
  export { default as Checkbox } from './Checkbox/index.js';
15
16
  export { default as Chip } from './Chip/index.js';
16
17
  export { default as CircleProgress } from './CircleProgress/index.js';
package/index.js CHANGED
@@ -11,6 +11,7 @@ export { default as ButtonGroup } from './ButtonGroup/index.js';
11
11
  export { default as Calendar } from './Calendar/index.js';
12
12
  export { default as CalendarInput } from './CalendarInput/index.js';
13
13
  export { default as Carousel } from './Carousel/index.js';
14
+ export { default as Card } from './Card/index.js';
14
15
  export { default as Checkbox } from './Checkbox/index.js';
15
16
  export { default as Chip } from './Chip/index.js';
16
17
  export { default as CircleProgress } from './CircleProgress/index.js';
package/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xanui/ui",
3
- "version": "1.2.7",
3
+ "version": "1.2.9",
4
4
  "description": "Xanui - A React Component Library",
5
5
  "private": false,
6
6
  "dependencies": {