@veeqo/ui 14.10.4-beta-1 → 14.10.4-beta-3
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/dist/components/ActionMenu/ActionMenu.cjs +2 -1
- package/dist/components/ActionMenu/ActionMenu.cjs.map +1 -1
- package/dist/components/ActionMenu/ActionMenu.d.ts +1 -1
- package/dist/components/ActionMenu/ActionMenu.js +3 -2
- package/dist/components/ActionMenu/ActionMenu.js.map +1 -1
- package/package.json +2 -2
|
@@ -13,7 +13,8 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
|
|
|
13
13
|
|
|
14
14
|
var React__default = /*#__PURE__*/_interopDefaultCompat(React);
|
|
15
15
|
|
|
16
|
-
const MenuItem = ({ className, ...props }) => (React__default.default.createElement(reactAriaComponents.MenuItem, { ...props, className: buildClassnames.buildClassnames([ActionMenu_module.menuItem, className]) }));
|
|
16
|
+
const MenuItem = React__default.default.forwardRef(({ className, ...props }, ref) => (React__default.default.createElement(reactAriaComponents.MenuItem, { ...props, ref: ref, className: buildClassnames.buildClassnames([ActionMenu_module.menuItem, className]) })));
|
|
17
|
+
MenuItem.displayName = 'ActionMenu.Item';
|
|
17
18
|
const Section = ({ className, ...props }) => (React__default.default.createElement(reactAriaComponents.Section, { ...props, className: buildClassnames.buildClassnames([ActionMenu_module.section, className]) }));
|
|
18
19
|
const ActionMenu = ({ id, menuLabel, ctaProps, actions, children }) => {
|
|
19
20
|
var _a;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionMenu.cjs","sources":["../../../src/components/ActionMenu/ActionMenu.tsx"],"sourcesContent":["import React, { ReactNode, useState } from 'react';\nimport {\n Menu,\n MenuItem as AriaMenuItem,\n MenuItemProps,\n Section as AriaSection,\n SectionProps,\n Text,\n} from 'react-aria-components';\nimport { Dropdown } from '../Dropdown';\nimport { useId } from '../../hooks';\nimport { ButtonProps } from '../Button/types';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport styles from './ActionMenu.module.scss';\n\nexport type ActionMenuProps = {\n id?: string;\n menuLabel?: string;\n actions?: MenuItemProps[];\n ctaProps: ButtonProps;\n children?: ReactNode;\n};\n\nconst MenuItem = ({ className, ...props }
|
|
1
|
+
{"version":3,"file":"ActionMenu.cjs","sources":["../../../src/components/ActionMenu/ActionMenu.tsx"],"sourcesContent":["import React, { ReactNode, useState } from 'react';\nimport {\n Menu,\n MenuItem as AriaMenuItem,\n MenuItemProps,\n Section as AriaSection,\n SectionProps,\n Text,\n} from 'react-aria-components';\nimport { Dropdown } from '../Dropdown';\nimport { useId } from '../../hooks';\nimport { ButtonProps } from '../Button/types';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport styles from './ActionMenu.module.scss';\n\nexport type ActionMenuProps = {\n id?: string;\n menuLabel?: string;\n actions?: MenuItemProps[];\n ctaProps: ButtonProps;\n children?: ReactNode;\n};\n\nconst MenuItem = React.forwardRef<HTMLDivElement, MenuItemProps>(\n ({ className, ...props }, ref) => (\n <AriaMenuItem {...props} ref={ref} className={buildClassnames([styles.menuItem, className])} />\n ),\n);\nMenuItem.displayName = 'ActionMenu.Item';\n\nconst Section = ({ className, ...props }: SectionProps<object>) => (\n <AriaSection {...props} className={buildClassnames([styles.section, className])} />\n);\n\nexport const ActionMenu = ({ id, menuLabel, ctaProps, actions, children }: ActionMenuProps) => {\n const [shouldShow, setShouldShow] = useState(false);\n const idComputed = useId({ id, prefix: 'action-menu' });\n\n const onKeyDown: React.KeyboardEventHandler<HTMLDialogElement> = (e) => {\n if (e.code === 'Escape' || e.code === 'Tab') setShouldShow(false);\n e.preventDefault();\n };\n\n return (\n <Dropdown\n id={idComputed}\n style={{ padding: '0' }}\n shouldShow={shouldShow}\n setShouldShow={setShouldShow}\n ctaProps={{ size: 'sm', ...ctaProps }}\n useAnchorWidth\n onKeyDown={onKeyDown}\n >\n <Menu\n onClose={() => setShouldShow(false)}\n aria-label={menuLabel || ctaProps.children?.toString()}\n >\n {actions?.map((action) => (\n <MenuItem {...action} key={action.id || action.children?.toString()} />\n ))}\n\n {children}\n </Menu>\n </Dropdown>\n );\n};\n\nActionMenu.Item = MenuItem;\nActionMenu.Section = Section;\nActionMenu.Text = Text;\n"],"names":["React","AriaMenuItem","buildClassnames","styles","AriaSection","useState","useId","Dropdown","Menu","Text"],"mappings":";;;;;;;;;;;;;;;AAuBA,MAAM,QAAQ,GAAGA,sBAAK,CAAC,UAAU,CAC/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MAC3BA,sBAAA,CAAA,aAAA,CAACC,4BAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAEC,+BAAe,CAAC,CAACC,iBAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,EAAA,CAAI,CAChG,CACF;AACD,QAAQ,CAAC,WAAW,GAAG,iBAAiB;AAExC,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAwB,MAC5DH,qCAACI,2BAAW,EAAA,EAAA,GAAK,KAAK,EAAE,SAAS,EAAEF,+BAAe,CAAC,CAACC,iBAAM,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,EAAA,CAAI,CACpF;AAEM,MAAM,UAAU,GAAG,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAmB,KAAI;;IAC5F,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGE,cAAQ,CAAC,KAAK,CAAC;AACnD,IAAA,MAAM,UAAU,GAAGC,WAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,aAAa,EAAE,CAAC;AAEvD,IAAA,MAAM,SAAS,GAAkD,CAAC,CAAC,KAAI;QACrE,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,CAAC,IAAI,KAAK,KAAK;YAAE,aAAa,CAAC,KAAK,CAAC;QACjE,CAAC,CAAC,cAAc,EAAE;AACpB,IAAA,CAAC;AAED,IAAA,QACEN,sBAAA,CAAA,aAAA,CAACO,iBAAQ,EAAA,EACP,EAAE,EAAE,UAAU,EACd,KAAK,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,EACvB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,QAAQ,EAAE,EACrC,cAAc,EAAA,IAAA,EACd,SAAS,EAAE,SAAS,EAAA;QAEpBP,sBAAA,CAAA,aAAA,CAACQ,wBAAI,EAAA,EACH,OAAO,EAAE,MAAM,aAAa,CAAC,KAAK,CAAC,EAAA,YAAA,EACvB,SAAS,KAAI,CAAA,EAAA,GAAA,QAAQ,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,EAAE,CAAA,EAAA,EAErD,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAA,MAAA;AAAP,YAAA,OAAO,CAAE,GAAG,CAAC,CAAC,MAAM,KAAI;;gBAAC,QACxBR,qCAAC,QAAQ,EAAA,EAAA,GAAK,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,EAAE,KAAI,CAAA,EAAA,GAAA,MAAM,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,EAAE,CAAA,EAAA,CAAI;aACxE,CAAC;YAED,QAAQ,CACJ,CACE;AAEf;AAEA,UAAU,CAAC,IAAI,GAAG,QAAQ;AAC1B,UAAU,CAAC,OAAO,GAAG,OAAO;AAC5B,UAAU,CAAC,IAAI,GAAGS,wBAAI;;;;"}
|
|
@@ -10,7 +10,7 @@ export type ActionMenuProps = {
|
|
|
10
10
|
};
|
|
11
11
|
export declare const ActionMenu: {
|
|
12
12
|
({ id, menuLabel, ctaProps, actions, children }: ActionMenuProps): React.JSX.Element;
|
|
13
|
-
Item:
|
|
13
|
+
Item: React.ForwardRefExoticComponent<MenuItemProps<object> & React.RefAttributes<HTMLDivElement>>;
|
|
14
14
|
Section: ({ className, ...props }: SectionProps<object>) => React.JSX.Element;
|
|
15
15
|
Text: React.ForwardRefExoticComponent<import("react-aria-components").TextProps & React.RefAttributes<HTMLElement>>;
|
|
16
16
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React__default, { useState } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { MenuItem as MenuItem$1, Menu, Text, Section as Section$1 } from 'react-aria-components';
|
|
3
3
|
import { Dropdown } from '../Dropdown/Dropdown.js';
|
|
4
4
|
import '../../hooks/useFocusVisible.js';
|
|
5
5
|
import { useId } from '../../hooks/useId.js';
|
|
@@ -7,7 +7,8 @@ import 'lodash.throttle';
|
|
|
7
7
|
import { buildClassnames } from '../../utils/buildClassnames.js';
|
|
8
8
|
import styles from './ActionMenu.module.scss.js';
|
|
9
9
|
|
|
10
|
-
const MenuItem = ({ className, ...props }) => (React__default.createElement(MenuItem$1, { ...props, className: buildClassnames([styles.menuItem, className]) }));
|
|
10
|
+
const MenuItem = React__default.forwardRef(({ className, ...props }, ref) => (React__default.createElement(MenuItem$1, { ...props, ref: ref, className: buildClassnames([styles.menuItem, className]) })));
|
|
11
|
+
MenuItem.displayName = 'ActionMenu.Item';
|
|
11
12
|
const Section = ({ className, ...props }) => (React__default.createElement(Section$1, { ...props, className: buildClassnames([styles.section, className]) }));
|
|
12
13
|
const ActionMenu = ({ id, menuLabel, ctaProps, actions, children }) => {
|
|
13
14
|
var _a;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionMenu.js","sources":["../../../src/components/ActionMenu/ActionMenu.tsx"],"sourcesContent":["import React, { ReactNode, useState } from 'react';\nimport {\n Menu,\n MenuItem as AriaMenuItem,\n MenuItemProps,\n Section as AriaSection,\n SectionProps,\n Text,\n} from 'react-aria-components';\nimport { Dropdown } from '../Dropdown';\nimport { useId } from '../../hooks';\nimport { ButtonProps } from '../Button/types';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport styles from './ActionMenu.module.scss';\n\nexport type ActionMenuProps = {\n id?: string;\n menuLabel?: string;\n actions?: MenuItemProps[];\n ctaProps: ButtonProps;\n children?: ReactNode;\n};\n\nconst MenuItem = ({ className, ...props }
|
|
1
|
+
{"version":3,"file":"ActionMenu.js","sources":["../../../src/components/ActionMenu/ActionMenu.tsx"],"sourcesContent":["import React, { ReactNode, useState } from 'react';\nimport {\n Menu,\n MenuItem as AriaMenuItem,\n MenuItemProps,\n Section as AriaSection,\n SectionProps,\n Text,\n} from 'react-aria-components';\nimport { Dropdown } from '../Dropdown';\nimport { useId } from '../../hooks';\nimport { ButtonProps } from '../Button/types';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport styles from './ActionMenu.module.scss';\n\nexport type ActionMenuProps = {\n id?: string;\n menuLabel?: string;\n actions?: MenuItemProps[];\n ctaProps: ButtonProps;\n children?: ReactNode;\n};\n\nconst MenuItem = React.forwardRef<HTMLDivElement, MenuItemProps>(\n ({ className, ...props }, ref) => (\n <AriaMenuItem {...props} ref={ref} className={buildClassnames([styles.menuItem, className])} />\n ),\n);\nMenuItem.displayName = 'ActionMenu.Item';\n\nconst Section = ({ className, ...props }: SectionProps<object>) => (\n <AriaSection {...props} className={buildClassnames([styles.section, className])} />\n);\n\nexport const ActionMenu = ({ id, menuLabel, ctaProps, actions, children }: ActionMenuProps) => {\n const [shouldShow, setShouldShow] = useState(false);\n const idComputed = useId({ id, prefix: 'action-menu' });\n\n const onKeyDown: React.KeyboardEventHandler<HTMLDialogElement> = (e) => {\n if (e.code === 'Escape' || e.code === 'Tab') setShouldShow(false);\n e.preventDefault();\n };\n\n return (\n <Dropdown\n id={idComputed}\n style={{ padding: '0' }}\n shouldShow={shouldShow}\n setShouldShow={setShouldShow}\n ctaProps={{ size: 'sm', ...ctaProps }}\n useAnchorWidth\n onKeyDown={onKeyDown}\n >\n <Menu\n onClose={() => setShouldShow(false)}\n aria-label={menuLabel || ctaProps.children?.toString()}\n >\n {actions?.map((action) => (\n <MenuItem {...action} key={action.id || action.children?.toString()} />\n ))}\n\n {children}\n </Menu>\n </Dropdown>\n );\n};\n\nActionMenu.Item = MenuItem;\nActionMenu.Section = Section;\nActionMenu.Text = Text;\n"],"names":["React","AriaMenuItem","AriaSection"],"mappings":";;;;;;;;;AAuBA,MAAM,QAAQ,GAAGA,cAAK,CAAC,UAAU,CAC/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MAC3BA,cAAA,CAAA,aAAA,CAACC,UAAY,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,EAAA,CAAI,CAChG,CACF;AACD,QAAQ,CAAC,WAAW,GAAG,iBAAiB;AAExC,MAAM,OAAO,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAwB,MAC5DD,6BAACE,SAAW,EAAA,EAAA,GAAK,KAAK,EAAE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,EAAA,CAAI,CACpF;AAEM,MAAM,UAAU,GAAG,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAmB,KAAI;;IAC5F,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AACnD,IAAA,MAAM,UAAU,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,aAAa,EAAE,CAAC;AAEvD,IAAA,MAAM,SAAS,GAAkD,CAAC,CAAC,KAAI;QACrE,IAAI,CAAC,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,CAAC,IAAI,KAAK,KAAK;YAAE,aAAa,CAAC,KAAK,CAAC;QACjE,CAAC,CAAC,cAAc,EAAE;AACpB,IAAA,CAAC;AAED,IAAA,QACEF,cAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,EACP,EAAE,EAAE,UAAU,EACd,KAAK,EAAE,EAAE,OAAO,EAAE,GAAG,EAAE,EACvB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,QAAQ,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,QAAQ,EAAE,EACrC,cAAc,EAAA,IAAA,EACd,SAAS,EAAE,SAAS,EAAA;QAEpBA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EACH,OAAO,EAAE,MAAM,aAAa,CAAC,KAAK,CAAC,EAAA,YAAA,EACvB,SAAS,KAAI,CAAA,EAAA,GAAA,QAAQ,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,EAAE,CAAA,EAAA,EAErD,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAA,MAAA;AAAP,YAAA,OAAO,CAAE,GAAG,CAAC,CAAC,MAAM,KAAI;;gBAAC,QACxBA,6BAAC,QAAQ,EAAA,EAAA,GAAK,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,EAAE,KAAI,CAAA,EAAA,GAAA,MAAM,CAAC,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,EAAE,CAAA,EAAA,CAAI;aACxE,CAAC;YAED,QAAQ,CACJ,CACE;AAEf;AAEA,UAAU,CAAC,IAAI,GAAG,QAAQ;AAC1B,UAAU,CAAC,OAAO,GAAG,OAAO;AAC5B,UAAU,CAAC,IAAI,GAAG,IAAI;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@veeqo/ui",
|
|
3
|
-
"version": "14.10.4-beta-
|
|
3
|
+
"version": "14.10.4-beta-3",
|
|
4
4
|
"description": "New optimised component library for Veeqo.",
|
|
5
5
|
"author": "Robert Wealthall",
|
|
6
6
|
"license": "ISC",
|
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
"framer-motion": ">=6.5.1",
|
|
143
143
|
"lodash.throttle": "^4.1.1",
|
|
144
144
|
"react": "^17.0.2",
|
|
145
|
-
"react-aria-components": "^1.
|
|
145
|
+
"react-aria-components": "^1.2.1",
|
|
146
146
|
"react-dom": "^17.0.2",
|
|
147
147
|
"react-popper": "^2.2.5",
|
|
148
148
|
"react-scrolllock-configurable": "4.0.5",
|