@alto-avios/alto-ui 5.2.0 → 5.4.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/dist/assets/BannerSectionContent.css +1 -0
- package/dist/assets/BannerSectionPlectrum.css +1 -0
- package/dist/assets/Box.css +1 -1
- package/dist/assets/BoxLink.css +1 -0
- package/dist/assets/CalloutBanner.css +1 -1
- package/dist/assets/Carousel.css +1 -1
- package/dist/assets/CarouselButton.css +1 -1
- package/dist/assets/CategoryTileGroup.css +1 -0
- package/dist/assets/Input.css +1 -1
- package/dist/assets/IntroSection.css +1 -0
- package/dist/assets/Link.css +1 -1
- package/dist/assets/ProductTile.css +1 -0
- package/dist/assets/SelectCard.css +1 -1
- package/dist/assets/margin.css +1 -0
- package/dist/components/BannerSectionContent/BannerSectionContent.d.ts +31 -0
- package/dist/components/BannerSectionContent/BannerSectionContent.js +5 -0
- package/dist/components/BannerSectionContent/BannerSectionContent.js.map +1 -0
- package/dist/components/BannerSectionContent/index.d.ts +2 -0
- package/dist/components/BannerSectionContent/index.js +2 -0
- package/dist/components/BannerSectionContent/index.js.map +1 -0
- package/dist/components/BannerSectionPlectrum/BannerSectionPlectrum.d.ts +39 -0
- package/dist/components/BannerSectionPlectrum/BannerSectionPlectrum.js +9 -0
- package/dist/components/BannerSectionPlectrum/BannerSectionPlectrum.js.map +1 -0
- package/dist/components/BannerSectionPlectrum/index.d.ts +2 -0
- package/dist/components/BannerSectionPlectrum/index.js +2 -0
- package/dist/components/BannerSectionPlectrum/index.js.map +1 -0
- package/dist/components/Box/Box.d.ts +17 -6
- package/dist/components/Box/Box.js +2 -2
- package/dist/components/Box/Box.js.map +1 -1
- package/dist/components/BoxLink/BoxLink.d.ts +59 -0
- package/dist/components/BoxLink/BoxLink.js +3 -0
- package/dist/components/BoxLink/BoxLink.js.map +1 -0
- package/dist/components/BoxLink/BoxLinkContext.d.ts +24 -0
- package/dist/components/BoxLink/BoxLinkContext.js +2 -0
- package/dist/components/BoxLink/BoxLinkContext.js.map +1 -0
- package/dist/components/BoxLink/index.d.ts +4 -0
- package/dist/components/BoxLink/index.js +2 -0
- package/dist/components/BoxLink/index.js.map +1 -0
- package/dist/components/Button/Button.d.ts +1 -1
- package/dist/components/CalloutBanner/CalloutBanner.d.ts +2 -1
- package/dist/components/CalloutBanner/CalloutBanner.js +9 -9
- package/dist/components/CalloutBanner/CalloutBanner.js.map +1 -1
- package/dist/components/Carousel/Carousel.d.ts +29 -1
- package/dist/components/Carousel/Carousel.js +8 -8
- package/dist/components/Carousel/Carousel.js.map +1 -1
- package/dist/components/Carousel/CarouselButton/CarouselButton.d.ts +6 -0
- package/dist/components/Carousel/CarouselButton/CarouselButton.js +1 -1
- package/dist/components/Carousel/CarouselButton/CarouselButton.js.map +1 -1
- package/dist/components/Carousel/CarouselControls.js +1 -1
- package/dist/components/Carousel/CarouselControls.js.map +1 -1
- package/dist/components/Carousel/index.d.ts +2 -0
- package/dist/components/Carousel/index.js +1 -1
- package/dist/components/CategoryTileGroup/CategoryTileGroup.d.ts +52 -0
- package/dist/components/CategoryTileGroup/CategoryTileGroup.js +8 -0
- package/dist/components/CategoryTileGroup/CategoryTileGroup.js.map +1 -0
- package/dist/components/CategoryTileGroup/index.d.ts +2 -0
- package/dist/components/CategoryTileGroup/index.js +2 -0
- package/dist/components/CategoryTileGroup/index.js.map +1 -0
- package/dist/components/Checkbox/Checkbox.d.ts +1 -1
- package/dist/components/Checkbox/Checkbox.js +5 -5
- package/dist/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/CreditCardNumberField/CreditCardNumberField.d.ts +2 -1
- package/dist/components/CreditCardNumberField/CreditCardNumberField.js +4 -4
- package/dist/components/CreditCardNumberField/CreditCardNumberField.js.map +1 -1
- package/dist/components/CreditCardSecurityCodeField/CreditCardSecurityCodeField.d.ts +1 -1
- package/dist/components/CreditCardSecurityCodeField/CreditCardSecurityCodeField.js +6 -6
- package/dist/components/CreditCardSecurityCodeField/CreditCardSecurityCodeField.js.map +1 -1
- package/dist/components/DatePicker/DatePicker.d.ts +1 -1
- package/dist/components/DatePicker/DatePicker.js +3 -3
- package/dist/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/components/DateRangePicker/DateRangePicker.d.ts +1 -1
- package/dist/components/DateRangePicker/DateRangePicker.js +6 -6
- package/dist/components/DateRangePicker/DateRangePicker.js.map +1 -1
- package/dist/components/FieldHeader/FieldHeader.d.ts +1 -1
- package/dist/components/FieldHeader/FieldHeader.js +2 -2
- package/dist/components/FieldHeader/FieldHeader.js.map +1 -1
- package/dist/components/Form/Form.d.ts +1 -1
- package/dist/components/Form/Form.js +1 -1
- package/dist/components/Form/Form.js.map +1 -1
- package/dist/components/Heading/Heading.js +2 -2
- package/dist/components/Heading/Heading.js.map +1 -1
- package/dist/components/IntroSection/IntroSection.d.ts +42 -0
- package/dist/components/IntroSection/IntroSection.js +4 -0
- package/dist/components/IntroSection/IntroSection.js.map +1 -0
- package/dist/components/IntroSection/index.d.ts +2 -0
- package/dist/components/IntroSection/index.js +2 -0
- package/dist/components/IntroSection/index.js.map +1 -0
- package/dist/components/Label/Label.js +1 -1
- package/dist/components/Label/Label.js.map +1 -1
- package/dist/components/Link/Link.js +2 -3
- package/dist/components/Link/Link.js.map +1 -1
- package/dist/components/Menu/Menu.d.ts +4 -4
- package/dist/components/Menu/Menu.js +1 -1
- package/dist/components/Menu/Menu.js.map +1 -1
- package/dist/components/Paragraph/Paragraph.js +1 -1
- package/dist/components/Paragraph/Paragraph.js.map +1 -1
- package/dist/components/Popover/Popover.d.ts +1 -1
- package/dist/components/Popover/Popover.js.map +1 -1
- package/dist/components/ProductTile/ProductTile.d.ts +51 -0
- package/dist/components/ProductTile/ProductTile.js +7 -0
- package/dist/components/ProductTile/ProductTile.js.map +1 -0
- package/dist/components/ProductTile/index.d.ts +2 -0
- package/dist/components/ProductTile/index.js +2 -0
- package/dist/components/ProductTile/index.js.map +1 -0
- package/dist/components/Radio/Radio.d.ts +1 -1
- package/dist/components/Radio/Radio.js +1 -1
- package/dist/components/Radio/Radio.js.map +1 -1
- package/dist/components/SearchField/SearchField.d.ts +2 -1
- package/dist/components/SearchField/SearchField.js +4 -4
- package/dist/components/SearchField/SearchField.js.map +1 -1
- package/dist/components/Section/Section.d.ts +9 -1
- package/dist/components/Section/Section.js +3 -3
- package/dist/components/Section/Section.js.map +1 -1
- package/dist/components/SelectCard/SelectCard.d.ts +18 -9
- package/dist/components/SelectCard/SelectCard.js +5 -5
- package/dist/components/SelectCard/SelectCard.js.map +1 -1
- package/dist/components/Slider/Slider.d.ts +1 -1
- package/dist/components/Slider/Slider.js +12 -12
- package/dist/components/Slider/Slider.js.map +1 -1
- package/dist/components/SubHeading/SubHeading.js +1 -1
- package/dist/components/SubHeading/SubHeading.js.map +1 -1
- package/dist/components/_base/Input/Input.js +8 -8
- package/dist/components/index.d.ts +16 -2
- package/dist/components/index.js +1 -1
- package/dist/{flex-BJOhaXnU.js → flex-BfhdHBb6.js} +2 -2
- package/dist/flex-BfhdHBb6.js.map +1 -0
- package/dist/index.js +1 -1
- package/dist/margin-CCJx_ENX.js +2 -0
- package/dist/margin-CCJx_ENX.js.map +1 -0
- package/dist/useObjectRef-DIiuqtNU.js +2 -0
- package/dist/useObjectRef-DIiuqtNU.js.map +1 -0
- package/dist/utils/flex/flex.d.ts +20 -6
- package/dist/utils/flex/flex.js +1 -1
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/index.js +1 -1
- package/dist/utils/layout/hooks/useFitCount.d.ts +74 -0
- package/dist/utils/layout/hooks/useFitCount.js +2 -0
- package/dist/utils/layout/hooks/useFitCount.js.map +1 -0
- package/dist/utils/margin/margin.d.ts +13 -0
- package/dist/utils/margin/margin.js +2 -0
- package/dist/utils/margin/margin.js.map +1 -0
- package/dist/utils/margin/margin.test.d.ts +1 -0
- package/dist/utils/position/position.d.ts +1 -1
- package/dist/utils/stories/DraggableContainer.js +7 -7
- package/dist/utils/stories/DraggableContainer.js.map +1 -1
- package/dist/utils/stories/IntroSectionWithCategoryTileGroup.d.ts +3 -0
- package/dist/utils/stories/IntroSectionWithCategoryTileGroup.js +5 -0
- package/dist/utils/stories/IntroSectionWithCategoryTileGroup.js.map +1 -0
- package/package.json +4 -2
- package/dist/assets/truncate.css +0 -1
- package/dist/flex-BJOhaXnU.js.map +0 -1
- package/dist/utils/truncate/truncate.d.ts +0 -6
- package/dist/utils/truncate/truncate.js +0 -2
- package/dist/utils/truncate/truncate.js.map +0 -1
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{jsx as e}from"react/jsx-runtime";import s from"react";import{c as _}from"../../index-CCUt_dAN.js";import{foregroundColorVariants as t}from"../../utils/foregroundColour/foregroundColor.js";import
|
|
1
|
+
import{jsx as e}from"react/jsx-runtime";import s from"react";import{c as _}from"../../index-CCUt_dAN.js";import{foregroundColorVariants as t}from"../../utils/foregroundColour/foregroundColor.js";import{getBaseValue as l,generateResponsiveClasses as i}from"../../utils/breakpoint/responsiveSSR.js";import '../../assets/Label.css';const x={label:"_label_1fo68_1","size--xxs":"_size--xxs_1fo68_36","size--xs":"_size--xs_1fo68_39","size--sm":"_size--sm_1fo68_42","size--md":"_size--md_1fo68_45","size--lg":"_size--lg_1fo68_48","truncate--true":"_truncate--true_1fo68_68","truncate--false":"_truncate--false_1fo68_72","sm:size--xxs":"_sm:size--xxs_1fo68_1","sm:size--xs":"_sm:size--xs_1fo68_1","sm:size--sm":"_sm:size--sm_1fo68_1","sm:size--md":"_sm:size--md_1fo68_1","sm:size--lg":"_sm:size--lg_1fo68_1","sm:truncate--true":"_sm:truncate--true_1fo68_1","sm:truncate--false":"_sm:truncate--false_1fo68_1","md:size--xxs":"_md:size--xxs_1fo68_1","md:size--xs":"_md:size--xs_1fo68_1","md:size--sm":"_md:size--sm_1fo68_1","md:size--md":"_md:size--md_1fo68_1","md:size--lg":"_md:size--lg_1fo68_1","md:truncate--true":"_md:truncate--true_1fo68_1","md:truncate--false":"_md:truncate--false_1fo68_1","lg:size--xxs":"_lg:size--xxs_1fo68_1","lg:size--xs":"_lg:size--xs_1fo68_1","lg:size--sm":"_lg:size--sm_1fo68_1","lg:size--md":"_lg:size--md_1fo68_1","lg:size--lg":"_lg:size--lg_1fo68_1","lg:truncate--true":"_lg:truncate--true_1fo68_1","lg:truncate--false":"_lg:truncate--false_1fo68_1","xl:size--xxs":"_xl:size--xxs_1fo68_1","xl:size--xs":"_xl:size--xs_1fo68_1","xl:size--sm":"_xl:size--sm_1fo68_1","xl:size--md":"_xl:size--md_1fo68_1","xl:size--lg":"_xl:size--lg_1fo68_1","xl:truncate--true":"_xl:truncate--true_1fo68_1","xl:truncate--false":"_xl:truncate--false_1fo68_1","xxl:size--xxs":"_xxl:size--xxs_1fo68_1","xxl:size--xs":"_xxl:size--xs_1fo68_1","xxl:size--sm":"_xxl:size--sm_1fo68_1","xxl:size--md":"_xxl:size--md_1fo68_1","xxl:size--lg":"_xxl:size--lg_1fo68_1","xxl:truncate--true":"_xxl:truncate--true_1fo68_1","xxl:truncate--false":"_xxl:truncate--false_1fo68_1"},o=i(x),r=_(x.label,{variants:{size:{"2xs":x["size--xxs"],xxs:x["size--xxs"],xs:x["size--xs"],sm:x["size--sm"],md:x["size--md"],lg:x["size--lg"]},truncate:{true:x["truncate--true"],false:x["truncate--false"]}},defaultVariants:{size:"md"}}),a=({children:_,as:i="span",size:x,foregroundColor:a,truncate:f=!1,...z})=>{s.useEffect(()=>{if("production"!==process.env.NODE_ENV)if("2xs"===x)console.warn("Label: The size value '2xs' is deprecated. Please use 'xxs' instead.");else if("object"==typeof x&&null!==x){Object.values(x).some(e=>"2xs"===e)&&console.warn("Label: The size value '2xs' is deprecated. Please use 'xxs' instead.")}},[x]);const m=l(x,"md"),u=l(f,!1),n=o(x,"size"),c=o(f,"truncate"),d=[r({size:m,truncate:u}),t({foregroundColor:a}),...n,...c].filter(Boolean).join(" ");/* @__PURE__ */
|
|
2
2
|
return e(i,{className:d,...z,children:_})};export{a as Label,a as default};
|
|
3
3
|
//# sourceMappingURL=Label.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Label.js","sources":["../../../src/components/Label/Label.tsx"],"sourcesContent":["import React from 'react';\nimport { cva } from 'class-variance-authority';\nimport styles from './Label.module.css';\nimport {\n foregroundColorVariants,\n type ForegroundVariants,\n} from '../../utils/foregroundColour/foregroundColor';\nimport
|
|
1
|
+
{"version":3,"file":"Label.js","sources":["../../../src/components/Label/Label.tsx"],"sourcesContent":["import React from 'react';\nimport { cva } from 'class-variance-authority';\nimport styles from './Label.module.css';\nimport {\n foregroundColorVariants,\n type ForegroundVariants,\n} from '../../utils/foregroundColour/foregroundColor';\nimport {\n getBaseValue,\n generateResponsiveClasses,\n type WithResponsiveProps,\n} from '../../utils/breakpoint/responsiveSSR';\n\nconst getResponsiveClasses = generateResponsiveClasses(styles);\n\nconst label = cva(styles.label, {\n variants: {\n size: {\n '2xs': styles['size--xxs'],\n xxs: styles['size--xxs'],\n xs: styles['size--xs'],\n sm: styles['size--sm'],\n md: styles['size--md'],\n lg: styles['size--lg'],\n },\n truncate: {\n true: styles['truncate--true'],\n false: styles['truncate--false'],\n },\n },\n defaultVariants: {\n size: 'md',\n },\n});\n\ntype LabelSize = '2xs' | 'xxs' | 'xs' | 'sm' | 'md' | 'lg';\n\ninterface BaseProps\n extends Omit<React.HTMLAttributes<Element>, 'className' | 'style'> {\n /**\n * children\n */\n children: React.ReactNode;\n /**\n * The HTML element to render the label as.\n */\n as?: 'span' | 'div' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n /**\n * **[Responsive]** The size of the label\n */\n size?: LabelSize;\n /**\n * The foreground color of the label\n */\n foregroundColor?: ForegroundVariants['foregroundColor'];\n /**\n * **[Responsive]** Truncate text with ellipsis\n * @default false\n */\n truncate?: boolean;\n}\n\ntype ResponsivePropKeys = 'size' | 'truncate';\n\nexport type LabelProps = WithResponsiveProps<BaseProps, ResponsivePropKeys>;\n\nexport const Label = ({\n children,\n as: Component = 'span',\n size,\n foregroundColor,\n truncate = false,\n ...props\n}: LabelProps) => {\n // TODO: Remove deprecation warning for '2xs'\n // Deprecation warning for '2xs' and specify to use 'xxs'\n React.useEffect(() => {\n // Only show deprecation warnings in development mode\n if (process.env.NODE_ENV !== 'production') {\n if (size === '2xs') {\n console.warn(\n \"Label: The size value '2xs' is deprecated. Please use 'xxs' instead.\",\n );\n } else if (typeof size === 'object' && size !== null) {\n const hasDeprecatedValue = Object.values(size).some(\n (val) => val === '2xs',\n );\n if (hasDeprecatedValue) {\n console.warn(\n \"Label: The size value '2xs' is deprecated. Please use 'xxs' instead.\",\n );\n }\n }\n }\n }, [size]);\n\n const baseSize = getBaseValue(size, 'md');\n const truncateBase = getBaseValue(truncate, false);\n\n const sizeResp = getResponsiveClasses(size, 'size');\n const truncateResp = getResponsiveClasses(truncate, 'truncate');\n\n const classNames = [\n label({ size: baseSize, truncate: truncateBase }),\n foregroundColorVariants({ foregroundColor }),\n ...sizeResp,\n ...truncateResp,\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <Component className={classNames} {...props}>\n {children}\n </Component>\n );\n};\n\nexport default Label;\n"],"names":["getResponsiveClasses","generateResponsiveClasses","styles","label","cva","variants","size","xxs","xs","sm","md","lg","truncate","true","false","defaultVariants","Label","children","as","Component","foregroundColor","props","React","useEffect","process","env","NODE_ENV","console","warn","Object","values","some","val","baseSize","getBaseValue","truncateBase","sizeResp","truncateResp","classNames","foregroundColorVariants","filter","Boolean","join","className"],"mappings":"++DAaMA,EAAuBC,EAA0BC,GAEjDC,EAAQC,EAAIF,EAAOC,MAAO,CAC9BE,SAAU,CACRC,KAAM,CACJ,MAAOJ,EAAO,aACdK,IAAKL,EAAO,aACZM,GAAIN,EAAO,YACXO,GAAIP,EAAO,YACXQ,GAAIR,EAAO,YACXS,GAAIT,EAAO,aAEbU,SAAU,CACRC,KAAMX,EAAO,kBACbY,MAAOZ,EAAO,qBAGlBa,gBAAiB,CACfT,KAAM,QAmCGU,EAAQ,EACnBC,WACAC,GAAIC,EAAY,OAChBb,OACAc,kBACAR,YAAW,KACRS,MAIHC,EAAMC,UAAU,KAEd,GAA6B,eAAzBC,QAAQC,IAAIC,SACd,GAAa,QAATpB,EACFqB,QAAQC,KACN,6EAEJ,GAA2B,iBAATtB,GAA8B,OAATA,EAAe,CACzBuB,OAAOC,OAAOxB,GAAMyB,KAC5CC,GAAgB,QAARA,IAGTL,QAAQC,KACN,uEAGN,GAED,CAACtB,IAEJ,MAAM2B,EAAWC,EAAa5B,EAAM,MAC9B6B,EAAeD,EAAatB,GAAU,GAEtCwB,EAAWpC,EAAqBM,EAAM,QACtC+B,EAAerC,EAAqBY,EAAU,YAE9C0B,EAAa,CACjBnC,EAAM,CAAEG,KAAM2B,EAAUrB,SAAUuB,IAClCI,EAAwB,CAAEnB,uBACvBgB,KACAC,GAEFG,OAAOC,SACPC,KAAK;AAER,SACGvB,EAAA,CAAUwB,UAAWL,KAAgBjB,EACnCJ"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import{jsxs as e,jsx as
|
|
2
|
-
return e(
|
|
3
|
-
/* @__PURE__ */i("span",{className:x["link__text-wrapper"],children:k}),p&&/* @__PURE__ */i(m,{className:u({iconEnd:!!p}),iconSize:V,...p}),C&&/* @__PURE__ */i(_,{children:j||h})]})});export{p as default};
|
|
1
|
+
import{jsxs as e,jsx as l}from"react/jsx-runtime";import{forwardRef as s,useEffect as i,useMemo as n}from"react";import{Link as r}from"react-aria-components";import{useObjectRef as _}from"@react-aria/utils";import{VisuallyHidden as o}from"../VisuallyHidden/VisuallyHidden.js";import{Icon as m}from"../Icon/Icon.js";import{c as t}from"../../index-CCUt_dAN.js";import{focusStyleVariants as a}from"../../utils/focus/focusStyles.js";import{foregroundColorVariants as u}from"../../utils/foregroundColour/foregroundColor.js";import{getBaseValue as d,generateResponsiveClasses as z}from"../../utils/breakpoint/responsiveSSR.js";import '../../assets/Link.css';const x={link:"_link_qluln_1","size--xs":"_size--xs_qluln_33","size--sm":"_size--sm_qluln_36","size--md":"_size--md_qluln_39","size--lg":"_size--lg_qluln_42","sm:size--xs":"_sm:size--xs_qluln_1","sm:size--sm":"_sm:size--sm_qluln_1","sm:size--md":"_sm:size--md_qluln_1","sm:size--lg":"_sm:size--lg_qluln_1","md:size--xs":"_md:size--xs_qluln_1","md:size--sm":"_md:size--sm_qluln_1","md:size--md":"_md:size--md_qluln_1","md:size--lg":"_md:size--lg_qluln_1","lg:size--xs":"_lg:size--xs_qluln_1","lg:size--sm":"_lg:size--sm_qluln_1","lg:size--md":"_lg:size--md_qluln_1","lg:size--lg":"_lg:size--lg_qluln_1","xl:size--xs":"_xl:size--xs_qluln_1","xl:size--sm":"_xl:size--sm_qluln_1","xl:size--md":"_xl:size--md_qluln_1","xl:size--lg":"_xl:size--lg_qluln_1","xxl:size--xs":"_xxl:size--xs_qluln_1","xxl:size--sm":"_xxl:size--sm_qluln_1","xxl:size--md":"_xxl:size--md_qluln_1","xxl:size--lg":"_xxl:size--lg_qluln_1","link--underline":"_link--underline_qluln_88","link__icon-start":"_link__icon-start_qluln_105","link__icon-end":"_link__icon-end_qluln_106"},c=z(x),f=t(x.link,{variants:{size:{xs:x["size--xs"],sm:x["size--sm"],md:x["size--md"],lg:x["size--lg"]},underline:{true:x["link--underline"],false:""},iconEnd:{true:x["link__icon-end"],false:""},iconStart:{true:x["link__icon-start"],false:""}},defaultVariants:{size:"md",underline:!1}}),g=s(function({size:s="md",underline:t=!0,iconStartProps:z,iconEndProps:x={iconName:"arrow-right"},href:g,target:q="_self",focusStyle:p="default",children:k,ariaLabelExternal:S,externalLinkScreenReaderText:h="opens in a new tab",foregroundColor:j="accentPrimary",...E},y){const L=_(y);i(()=>{S&&"production"!==process.env.NODE_ENV&&console.warn("[Link] `ariaLabelExternal` prop is deprecated. Use the `externalLinkScreenReaderText` prop instead.")},[S]);const N=d(s,"md"),b=c(s,"size"),v="_blank"===q,w=n(()=>{switch(s){case"xs":case"sm":return"0.75x";case"md":default:return"1x";case"lg":return"1.25x"}},[s]);/* @__PURE__ */
|
|
2
|
+
return e(r,{className:[f({size:N,underline:t}),a({focusStyle:p}),u({foregroundColor:j}),...b].filter(Boolean).join(" "),href:g,target:q,rel:v?"noopener noreferrer":void 0,ref:L,...E,children:[z&&/* @__PURE__ */l(m,{className:f({iconStart:!!z}),iconSize:w,...z}),k,x&&/* @__PURE__ */l(m,{className:f({iconEnd:!!x}),iconSize:w,...x}),v&&/* @__PURE__ */l(o,{children:h||S})]})});export{g as default};
|
|
4
3
|
//# sourceMappingURL=Link.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Link.js","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import { useMemo, useEffect, forwardRef } from 'react';\nimport {\n LinkProps as AriaLinkProps,\n Link as AriaLink,\n} from 'react-aria-components';\nimport { useObjectRef } from '@react-aria/utils';\nimport VisuallyHidden from '../VisuallyHidden/VisuallyHidden';\nimport { Icon, IconProps, IconSize } from '../Icon/Icon';\nimport { cva } from 'class-variance-authority';\nimport styles from './Link.module.css';\nimport { focusStyleVariants } from '../../utils/focus/focusStyles';\nimport {\n foregroundColorVariants,\n type ForegroundVariants,\n} from '../../utils/foregroundColour/foregroundColor';\nimport {\n generateResponsiveClasses,\n getBaseValue,\n WithResponsiveProps,\n} from '../../utils/breakpoint/responsiveSSR';\n\nconst getResponsiveClasses = generateResponsiveClasses(styles);\n\nconst link = cva(styles.link, {\n variants: {\n size: {\n xs: styles['size--xs'],\n sm: styles['size--sm'],\n md: styles['size--md'],\n lg: styles['size--lg'],\n },\n underline: {\n true: styles
|
|
1
|
+
{"version":3,"file":"Link.js","sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import { useMemo, useEffect, forwardRef } from 'react';\nimport {\n LinkProps as AriaLinkProps,\n Link as AriaLink,\n} from 'react-aria-components';\nimport { useObjectRef } from '@react-aria/utils';\nimport VisuallyHidden from '../VisuallyHidden/VisuallyHidden';\nimport { Icon, IconProps, IconSize } from '../Icon/Icon';\nimport { cva } from 'class-variance-authority';\nimport styles from './Link.module.css';\nimport { focusStyleVariants } from '../../utils/focus/focusStyles';\nimport {\n foregroundColorVariants,\n type ForegroundVariants,\n} from '../../utils/foregroundColour/foregroundColor';\nimport {\n generateResponsiveClasses,\n getBaseValue,\n WithResponsiveProps,\n} from '../../utils/breakpoint/responsiveSSR';\n\nconst getResponsiveClasses = generateResponsiveClasses(styles);\n\nconst link = cva(styles.link, {\n variants: {\n size: {\n xs: styles['size--xs'],\n sm: styles['size--sm'],\n md: styles['size--md'],\n lg: styles['size--lg'],\n },\n underline: {\n true: styles['link--underline'],\n false: '',\n },\n iconEnd: {\n true: styles['link__icon-end'],\n false: '',\n },\n iconStart: {\n true: styles['link__icon-start'],\n false: '',\n },\n },\n defaultVariants: {\n size: 'md',\n underline: false,\n },\n});\n\nexport interface LinkBaseProps extends AriaLinkProps {\n /**\n * The children of the component. A function may be provided to alter the children based on component state.\n */\n children?: React.ReactNode | string;\n /**\n * What the size of the Link is\n * @default 'md'\n */\n size?: 'xs' | 'sm' | 'md' | 'lg';\n /**\n * Whether the Link should be underlined\n * @default false\n */\n underline?: boolean;\n /**\n * Whether the link is disabled.\n * @default false\n */\n isDisabled?: boolean;\n /**\n * The foreground color of the label\n */\n foregroundColor?: ForegroundVariants['foregroundColor'];\n /**\n * Whether an icon should display at the end of Link and icon properties\n * @default { iconName: 'arrow-right' }\n */\n iconEndProps?: IconProps | false;\n /**\n * Whether an icon should display at the start of the Link and icon properties\n */\n iconStartProps?: IconProps;\n /**\n * The URL the Link will navigate to\n */\n href?: string;\n /**\n * The target attribute for the Link\n * @default '_self'\n */\n target?: string;\n /**\n * @deprecated Use externalLinkScreenReaderText instead\n * Aria label applied when target=\"_blank\"\n * @default \"open in new tab\"\n */\n ariaLabelExternal?: string;\n /**\n * Specify custom screen reader text for external links\n * @default \"opens in a new tab\"\n */\n externalLinkScreenReaderText?: string;\n /**\n * \tThe focus style of the button\n */\n focusStyle?: 'default' | 'white';\n}\n\ntype ResponsivePropKeys = 'size';\n\nexport type LinkProps = WithResponsiveProps<LinkBaseProps, ResponsivePropKeys>;\n\nconst Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n {\n size = 'md',\n underline = true,\n iconStartProps,\n iconEndProps = { iconName: 'arrow-right' },\n href,\n target = '_self',\n focusStyle = 'default',\n children,\n ariaLabelExternal,\n externalLinkScreenReaderText = 'opens in a new tab',\n foregroundColor = 'accentPrimary',\n ...props\n },\n forwardedRef,\n) {\n const anchorRef = useObjectRef(forwardedRef);\n\n // Deprecation warning\n useEffect(() => {\n if (ariaLabelExternal && process.env.NODE_ENV !== 'production') {\n console.warn(\n '[Link] `ariaLabelExternal` prop is deprecated. Use the `externalLinkScreenReaderText` prop instead.',\n );\n }\n }, [ariaLabelExternal]);\n\n const baseSize = getBaseValue(size, 'md');\n\n const sizeResponsiveClasses = getResponsiveClasses(size, 'size');\n\n const isExternalLink = target === '_blank';\n\n const iconSize = useMemo<IconSize>(() => {\n switch (size) {\n case 'xs':\n return '0.75x';\n case 'sm':\n return '0.75x';\n case 'md':\n return '1x';\n case 'lg':\n return '1.25x';\n default:\n return '1x';\n }\n }, [size]);\n\n return (\n <AriaLink\n className={[\n link({ size: baseSize, underline }),\n focusStyleVariants({ focusStyle }),\n foregroundColorVariants({ foregroundColor }),\n ...sizeResponsiveClasses,\n ]\n .filter(Boolean)\n .join(' ')}\n href={href}\n target={target}\n rel={isExternalLink ? 'noopener noreferrer' : undefined}\n ref={anchorRef}\n {...props}\n >\n {iconStartProps && (\n <Icon\n className={link({ iconStart: !!iconStartProps })}\n iconSize={iconSize}\n {...iconStartProps}\n />\n )}\n {children}\n {iconEndProps && (\n <Icon\n className={link({ iconEnd: !!iconEndProps })}\n iconSize={iconSize}\n {...iconEndProps}\n />\n )}\n {isExternalLink && (\n <VisuallyHidden>\n {externalLinkScreenReaderText || ariaLabelExternal}\n </VisuallyHidden>\n )}\n </AriaLink>\n );\n});\n\nexport default Link;\n"],"names":["getResponsiveClasses","generateResponsiveClasses","styles","link","cva","variants","size","xs","sm","md","lg","underline","true","false","iconEnd","iconStart","defaultVariants","Link","forwardRef","iconStartProps","iconEndProps","iconName","href","target","focusStyle","children","ariaLabelExternal","externalLinkScreenReaderText","foregroundColor","props","forwardedRef","anchorRef","useObjectRef","useEffect","process","env","NODE_ENV","console","warn","baseSize","getBaseValue","sizeResponsiveClasses","isExternalLink","iconSize","useMemo","jsxs","AriaLink","className","focusStyleVariants","foregroundColorVariants","filter","Boolean","join","rel","ref","jsx","Icon","VisuallyHidden"],"mappings":"ooDAqBMA,EAAuBC,EAA0BC,GAEjDC,EAAOC,EAAIF,EAAOC,KAAM,CAC5BE,SAAU,CACRC,KAAM,CACJC,GAAIL,EAAO,YACXM,GAAIN,EAAO,YACXO,GAAIP,EAAO,YACXQ,GAAIR,EAAO,aAEbS,UAAW,CACTC,KAAMV,EAAO,mBACbW,MAAO,IAETC,QAAS,CACPF,KAAMV,EAAO,kBACbW,MAAO,IAETE,UAAW,CACTH,KAAMV,EAAO,oBACbW,MAAO,KAGXG,gBAAiB,CACfV,KAAM,KACNK,WAAW,KAmETM,EAAOC,EAAyC,UACpDZ,KACEA,EAAO,KAAAK,UACPA,GAAY,EAAAQ,eACZA,EAAAC,aACAA,EAAe,CAAEC,SAAU,eAAAC,KAC3BA,EAAAC,OACAA,EAAS,QAAAC,WACTA,EAAa,UAAAC,SACbA,EAAAC,kBACAA,EAAAC,6BACAA,EAA+B,qBAAAC,gBAC/BA,EAAkB,mBACfC,GAELC,GAEA,MAAMC,EAAYC,EAAaF,GAG/BG,EAAU,KACJP,GAA8C,eAAzBQ,QAAQC,IAAIC,UACnCC,QAAQC,KACN,wGAGH,CAACZ,IAEJ,MAAMa,EAAWC,EAAalC,EAAM,MAE9BmC,EAAwBzC,EAAqBM,EAAM,QAEnDoC,EAA4B,WAAXnB,EAEjBoB,EAAWC,EAAkB,KACjC,OAAQtC,GACN,IAAK,KAEL,IAAK,KACH,MAAO,QACT,IAAK,KAIL,QACE,MAAO,KAHT,IAAK,KACH,MAAO,UAIV,CAACA;AAEJ,OACEuC,EAACC,EAAA,CACCC,UAAW,CACT5C,EAAK,CAAEG,KAAMiC,EAAU5B,cACvBqC,EAAmB,CAAExB,eACrByB,EAAwB,CAAErB,uBACvBa,GAEFS,OAAOC,SACPC,KAAK,KACR9B,OACAC,SACA8B,IAAKX,EAAiB,2BAAwB,EAC9CY,IAAKvB,KACDF,EAEHJ,SAAA,CAAAN,kBACCoC,EAACC,EAAA,CACCT,UAAW5C,EAAK,CAAEY,YAAaI,IAC/BwB,cACIxB,IAGPM,EACAL,kBACCmC,EAACC,EAAA,CACCT,UAAW5C,EAAK,CAAEW,UAAWM,IAC7BuB,cACIvB,IAGPsB,kBACCa,EAACE,EAAA,CACEhC,SAAAE,GAAgCD,MAK3C"}
|
|
@@ -84,17 +84,17 @@ export interface MenuProps {
|
|
|
84
84
|
/**
|
|
85
85
|
* Component to replace default Button with another button-like component/element
|
|
86
86
|
*/
|
|
87
|
-
export declare const Trigger: React.ForwardRefExoticComponent<Omit<import('../Button/Button').ButtonBaseProps<"button">, "size" | "
|
|
87
|
+
export declare const Trigger: React.ForwardRefExoticComponent<Omit<import('../Button/Button').ButtonBaseProps<"button">, "size" | "textAlign" | "fullWidth"> & {
|
|
88
88
|
size?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<("lg" | "sm" | "md") | undefined>> | undefined;
|
|
89
|
-
fullWidth?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<boolean | undefined>> | undefined;
|
|
90
89
|
textAlign?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<("left" | "right" | "center") | undefined>> | undefined;
|
|
90
|
+
fullWidth?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<boolean | undefined>> | undefined;
|
|
91
91
|
} & React.RefAttributes<HTMLButtonElement>>;
|
|
92
92
|
export declare const Menu: {
|
|
93
93
|
({ label, "aria-label": ariaLabel, isDisabled, placement, buttonEmphasis, buttonStyleVariant, buttonOpenVariant, alignToElementId, shouldFlip, openOnHoverAndFocus, allowTabOut, closeOnHover, children, iconStartProps, iconEndProps, onOpenChange, }: MenuProps): import("react/jsx-runtime").JSX.Element;
|
|
94
|
-
Trigger: React.ForwardRefExoticComponent<Omit<import('../Button/Button').ButtonBaseProps<"button">, "size" | "
|
|
94
|
+
Trigger: React.ForwardRefExoticComponent<Omit<import('../Button/Button').ButtonBaseProps<"button">, "size" | "textAlign" | "fullWidth"> & {
|
|
95
95
|
size?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<("lg" | "sm" | "md") | undefined>> | undefined;
|
|
96
|
-
fullWidth?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<boolean | undefined>> | undefined;
|
|
97
96
|
textAlign?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<("left" | "right" | "center") | undefined>> | undefined;
|
|
97
|
+
fullWidth?: import('../../utils/breakpoint/responsiveSSR').ResponsiveValue<NonNullable<boolean | undefined>> | undefined;
|
|
98
98
|
} & React.RefAttributes<HTMLButtonElement>>;
|
|
99
99
|
};
|
|
100
100
|
export default Menu;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import r,{useRef as n,useCallback as o,useMemo as i,useState as s,useEffect as a,useContext as u,forwardRef as l,useId as c}from"react";import{Button as p}from"../Button/Button.js";import{Popover as d}from"../Popover/Popover.js";import{IconButton as g}from"../IconButton/IconButton.js";import{$ as v,a as f,b as m,c as y,d as T,e as E,f as h,g as P,h as b,i as M,j as k,k as O,l as K,m as S,n as w,o as I,p as L,q as A,r as D,s as x,t as C}from"../../useGlobalListeners-CGYK0FZ8.js";import{flushSync as F}from"react-dom";import '../../assets/Menu.css';const _="_menuContainer_qw7ps_1",V="_menuContent_qw7ps_6";let N="default",U="",H=/* @__PURE__ */new WeakMap;function B(e){if(v()){if("default"===N){const t=f(e);U=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}N="disabled"}else if(e instanceof HTMLElement||e instanceof SVGElement){let t="userSelect"in e.style?"userSelect":"webkitUserSelect";H.set(e,e.style[t]),e.style[t]="none"}}function X(e){if(v()){if("disabled"!==N)return;N="restoring",setTimeout(()=>{m(()=>{if("restoring"===N){const t=f(e);"none"===t.documentElement.style.webkitUserSelect&&(t.documentElement.style.webkitUserSelect=U||""),U="",N="default"}})},300)}else if((e instanceof HTMLElement||e instanceof SVGElement)&&e&&H.has(e)){let t=H.get(e),r="userSelect"in e.style?"userSelect":"webkitUserSelect";"none"===e.style[r]&&(e.style[r]=t),""===e.getAttribute("style")&&e.removeAttribute("style"),H.delete(e)}}function Y(e){let t=e?.defaultView;return t?.__webpack_nonce__||globalThis.__webpack_nonce__||void 0}let j=/* @__PURE__ */new WeakMap;const q=r.createContext({register:()=>{}});q.displayName="PressResponderContext";class G{#e;constructor(e,t,r,n){this.#e=!0;let o=n?.target??r.currentTarget;const i=o?.getBoundingClientRect();let s,a,u=0,l=null;null!=r.clientX&&null!=r.clientY&&(a=r.clientX,l=r.clientY),i&&(null!=a&&null!=l?(s=a-i.left,u=l-i.top):(s=i.width/2,u=i.height/2)),this.type=e,this.pointerType=t,this.target=r.currentTarget,this.shiftKey=r.shiftKey,this.metaKey=r.metaKey,this.ctrlKey=r.ctrlKey,this.altKey=r.altKey,this.x=s,this.y=u,this.key=r.key}continuePropagation(){this.#e=!1}get shouldStopPropagation(){return this.#e}}const R=/* @__PURE__ */Symbol("linkClicked"),W="react-aria-pressable-style",$="data-react-aria-pressable";function z(e){let{onPress:t,onPressChange:r,onPressStart:l,onPressEnd:c,onPressUp:p,onClick:d,isDisabled:g,isPressed:v,preventFocusOnPress:m,shouldCancelOnPointerExit:x,allowTextSelectionOnPress:C,ref:_,...V}=function(e){let t=u(q);if(t){let{register:r,ref:n,...o}=t;e=w(o,e),r()}return I(t,e.ref),e}(e),[N,U]=s(!1),H=n({isPressed:!1,ignoreEmulatedMouseEvents:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null,disposables:[]}),{addGlobalListener:z,removeAllGlobalListeners:oe}=T(),ie=o((e,t)=>{let n=H.current;if(g||n.didFirePressStart)return!1;let o=!0;if(n.isTriggeringEvent=!0,l){let r=new G("pressstart",t,e);l(r),o=r.shouldStopPropagation}return r&&r(!0),n.isTriggeringEvent=!1,n.didFirePressStart=!0,U(!0),o},[g,l,r]),se=o((e,n,o=!0)=>{let i=H.current;if(!i.didFirePressStart)return!1;i.didFirePressStart=!1,i.isTriggeringEvent=!0;let s=!0;if(c){let t=new G("pressend",n,e);c(t),s=t.shouldStopPropagation}if(r&&r(!1),U(!1),t&&o&&!g){let r=new G("press",n,e);t(r),s&&=r.shouldStopPropagation}return i.isTriggeringEvent=!1,s},[g,c,r,t]),ae=E(se),ue=o((e,t)=>{let r=H.current;if(g)return!1;if(p){r.isTriggeringEvent=!0;let n=new G("pressup",t,e);return p(n),r.isTriggeringEvent=!1,n.shouldStopPropagation}return!0},[g,p]),le=E(ue),ce=o(e=>{let t=H.current;if(t.isPressed&&t.target){t.didFirePressStart&&null!=t.pointerType&&se(te(t.target,e),t.pointerType,!1),t.isPressed=!1,t.isOverTarget=!1,t.activePointerId=null,t.pointerType=null,oe(),C||X(t.target);for(let e of t.disposables)e();t.disposables=[]}},[C,oe,se]),pe=E(ce),de=o(e=>{x&&ce(e)},[x,ce]),ge=o(e=>{g||d?.(e)},[g,d]),ve=o((e,t)=>{if(!g&&d){let r=new MouseEvent("click",e);h(r,t),d(P(r))}},[g,d]),fe=i(()=>{let e=H.current,t={onKeyDown(t){if(Q(t.nativeEvent,t.currentTarget)&&b(t.currentTarget,M(t))){ne(M(t),t.key)&&t.preventDefault();let n=!0;e.isPressed||t.repeat||(e.target=t.currentTarget,e.isPressed=!0,e.pointerType="keyboard",n=ie(t,"keyboard"));let o=t.currentTarget,i=t=>{Q(t,o)&&!t.repeat&&b(o,M(t))&&e.target&&le(te(e.target,t),"keyboard")};z(f(t.currentTarget),"keyup",A(i,r),!0),n&&t.stopPropagation(),t.metaKey&&D()&&e.metaKeyEvents?.set(t.key,t.nativeEvent)}else"Meta"===t.key&&(e.metaKeyEvents=/* @__PURE__ */new Map)},onClick(t){if((!t||b(t.currentTarget,M(t)))&&t&&0===t.button&&!e.isTriggeringEvent&&!L.isOpening){let r=!0;if(g&&t.preventDefault(),e.ignoreEmulatedMouseEvents||e.isPressed||"virtual"!==e.pointerType&&!S(t.nativeEvent)){if(e.isPressed&&"keyboard"!==e.pointerType){let n=e.pointerType||t.nativeEvent.pointerType||"virtual",o=le(te(t.currentTarget,t),n),i=ae(te(t.currentTarget,t),n,!0);r=o&&i,e.isOverTarget=!1,ge(t),pe(t)}}else{let e=ie(t,"virtual"),n=le(t,"virtual"),o=ae(t,"virtual");ge(t),r=e&&n&&o}e.ignoreEmulatedMouseEvents=!1,r&&t.stopPropagation()}}},r=t=>{if(e.isPressed&&e.target&&Q(t,e.target)){ne(M(t),t.key)&&t.preventDefault();let r=M(t),n=b(e.target,r);ae(te(e.target,t),"keyboard",n),n&&ve(t,e.target),oe(),"Enter"!==t.key&&J(e.target)&&b(e.target,r)&&!t[R]&&(t[R]=!0,L(e.target,t,!1)),e.isPressed=!1,e.metaKeyEvents?.delete(t.key)}else if("Meta"===t.key&&e.metaKeyEvents?.size){let t=e.metaKeyEvents;e.metaKeyEvents=void 0;for(let r of t.values())e.target?.dispatchEvent(new KeyboardEvent("keyup",r))}};if("undefined"!=typeof PointerEvent){t.onPointerDown=t=>{if(0!==t.button||!b(t.currentTarget,M(t)))return;if(k(t.nativeEvent))return void(e.pointerType="virtual");e.pointerType=t.pointerType;let o=!0;if(!e.isPressed){e.isPressed=!0,e.isOverTarget=!0,e.activePointerId=t.pointerId,e.target=t.currentTarget,C||B(e.target),o=ie(t,e.pointerType);let i=M(t);"releasePointerCapture"in i&&("hasPointerCapture"in i?i.hasPointerCapture(t.pointerId)&&i.releasePointerCapture(t.pointerId):i.releasePointerCapture(t.pointerId)),z(f(t.currentTarget),"pointerup",r,!1),z(f(t.currentTarget),"pointercancel",n,!1)}o&&t.stopPropagation()},t.onMouseDown=t=>{if(b(t.currentTarget,M(t))&&0===t.button){if(m){let r=O(t.target);r&&e.disposables.push(r)}t.stopPropagation()}},t.onPointerUp=t=>{b(t.currentTarget,M(t))&&"virtual"!==e.pointerType&&(0!==t.button||e.isPressed||le(t,e.pointerType||t.pointerType))},t.onPointerEnter=t=>{t.pointerId===e.activePointerId&&e.target&&!e.isOverTarget&&null!=e.pointerType&&(e.isOverTarget=!0,ie(te(e.target,t),e.pointerType))},t.onPointerLeave=t=>{t.pointerId===e.activePointerId&&e.target&&e.isOverTarget&&null!=e.pointerType&&(e.isOverTarget=!1,ae(te(e.target,t),e.pointerType,!1),de(t))};let r=t=>{if(t.pointerId===e.activePointerId&&e.isPressed&&0===t.button&&e.target){if(b(e.target,M(t))&&null!=e.pointerType){let r=!1,n=setTimeout(()=>{e.isPressed&&e.target instanceof HTMLElement&&(r?pe(t):(K(e.target),e.target.click()))},80);z(t.currentTarget,"click",()=>r=!0,!0),e.disposables.push(()=>clearTimeout(n))}else pe(t);e.isOverTarget=!1}},n=e=>{pe(e)};t.onDragStart=e=>{b(e.currentTarget,M(e))&&pe(e)}}else if("test"===process.env.NODE_ENV){t.onMouseDown=t=>{if(0!==t.button||!b(t.currentTarget,M(t)))return;if(e.ignoreEmulatedMouseEvents)return void t.stopPropagation();if(e.isPressed=!0,e.isOverTarget=!0,e.target=t.currentTarget,e.pointerType=S(t.nativeEvent)?"virtual":"mouse",F(()=>ie(t,e.pointerType))&&t.stopPropagation(),m){let r=O(t.target);r&&e.disposables.push(r)}z(f(t.currentTarget),"mouseup",r,!1)},t.onMouseEnter=t=>{if(!b(t.currentTarget,M(t)))return;let r=!0;e.isPressed&&!e.ignoreEmulatedMouseEvents&&null!=e.pointerType&&(e.isOverTarget=!0,r=ie(t,e.pointerType)),r&&t.stopPropagation()},t.onMouseLeave=t=>{if(!b(t.currentTarget,M(t)))return;let r=!0;e.isPressed&&!e.ignoreEmulatedMouseEvents&&null!=e.pointerType&&(e.isOverTarget=!1,r=ae(t,e.pointerType,!1),de(t)),r&&t.stopPropagation()},t.onMouseUp=t=>{b(t.currentTarget,M(t))&&(e.ignoreEmulatedMouseEvents||0!==t.button||e.isPressed||le(t,e.pointerType||"mouse"))};let r=t=>{0===t.button&&(e.ignoreEmulatedMouseEvents?e.ignoreEmulatedMouseEvents=!1:(e.target&&b(e.target,M(t))&&null!=e.pointerType||pe(t),e.isOverTarget=!1))};t.onTouchStart=t=>{if(!b(t.currentTarget,M(t)))return;let r=function(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}(t.nativeEvent);r&&(e.activePointerId=r.identifier,e.ignoreEmulatedMouseEvents=!0,e.isOverTarget=!0,e.isPressed=!0,e.target=t.currentTarget,e.pointerType="touch",C||B(e.target),ie(ee(e.target,t),e.pointerType)&&t.stopPropagation(),z(y(t.currentTarget),"scroll",n,!0))},t.onTouchMove=t=>{if(!b(t.currentTarget,M(t)))return;if(!e.isPressed)return void t.stopPropagation();let r=Z(t.nativeEvent,e.activePointerId),n=!0;r&&re(r,t.currentTarget)?e.isOverTarget||null==e.pointerType||(e.isOverTarget=!0,n=ie(ee(e.target,t),e.pointerType)):e.isOverTarget&&null!=e.pointerType&&(e.isOverTarget=!1,n=ae(ee(e.target,t),e.pointerType,!1),de(ee(e.target,t))),n&&t.stopPropagation()},t.onTouchEnd=t=>{if(!b(t.currentTarget,M(t)))return;if(!e.isPressed)return void t.stopPropagation();let r=Z(t.nativeEvent,e.activePointerId),n=!0;r&&re(r,t.currentTarget)&&null!=e.pointerType?(le(ee(e.target,t),e.pointerType),n=ae(ee(e.target,t),e.pointerType),ve(t.nativeEvent,e.target)):e.isOverTarget&&null!=e.pointerType&&(n=ae(ee(e.target,t),e.pointerType,!1)),n&&t.stopPropagation(),e.isPressed=!1,e.activePointerId=null,e.isOverTarget=!1,e.ignoreEmulatedMouseEvents=!0,e.target&&!C&&X(e.target),oe()},t.onTouchCancel=t=>{b(t.currentTarget,M(t))&&(t.stopPropagation(),e.isPressed&&pe(ee(e.target,t)))};let n=t=>{e.isPressed&&b(M(t),e.target)&&pe({currentTarget:e.target,shiftKey:!1,ctrlKey:!1,metaKey:!1,altKey:!1})};t.onDragStart=e=>{b(e.currentTarget,M(e))&&pe(e)}}return t},[z,g,m,oe,C,de,ie,ge,ve]);return a(()=>{if(!_||"test"===process.env.NODE_ENV)return;const e=f(_.current);if(!e||!e.head||e.getElementById(W))return;const t=e.createElement("style");t.id=W;let r=function(e){let t=e??("undefined"!=typeof document?document:void 0);if(!t)return Y(t);if(j.has(t))return j.get(t);let r=t.querySelector('meta[property="csp-nonce"]'),n=r&&r instanceof y(r).HTMLMetaElement&&(r.nonce||r.content)||Y(t)||void 0;return void 0!==n&&j.set(t,n),n}(e);r&&(t.nonce=r),t.textContent=`\n@layer {\n [${$}] {\n touch-action: pan-x pan-y pinch-zoom;\n }\n}\n `.trim(),e.head.prepend(t)},[_]),a(()=>{let e=H.current;return()=>{C||X(e.target??void 0);for(let t of e.disposables)t();e.disposables=[]}},[C]),{isPressed:v||N,pressProps:w(V,fe,{[$]:!0})}}function J(e){return"A"===e.tagName&&e.hasAttribute("href")}function Q(e,t){const{key:r,code:n}=e,o=t,i=o.getAttribute("role");return!("Enter"!==r&&" "!==r&&"Spacebar"!==r&&"Space"!==n||o instanceof y(o).HTMLInputElement&&!ie(o,r)||o instanceof y(o).HTMLTextAreaElement||o.isContentEditable||("link"===i||!i&&J(o))&&"Enter"!==r)}function Z(e,t){const r=e.changedTouches;for(let n=0;n<r.length;n++){const e=r[n];if(e.identifier===t)return e}return null}function ee(e,t){let r=0,n=0;return t.targetTouches&&1===t.targetTouches.length&&(r=t.targetTouches[0].clientX,n=t.targetTouches[0].clientY),{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:n}}function te(e,t){let r=t.clientX,n=t.clientY;return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:n,key:t.key}}function re(e,t){let r=t.getBoundingClientRect(),n=function(e){let t=0,r=0;return void 0!==e.width?t=e.width/2:void 0!==e.radiusX&&(t=e.radiusX),void 0!==e.height?r=e.height/2:void 0!==e.radiusY&&(r=e.radiusY),{top:e.clientY-r,right:e.clientX+t,bottom:e.clientY+r,left:e.clientX-t}}(e);return i=n,!((o=r).left>i.right||i.left>o.right||o.top>i.bottom||i.top>o.bottom);var o,i}function ne(e,t){return e instanceof HTMLInputElement?!ie(e,t):function(e){return!(e instanceof HTMLInputElement||(e instanceof HTMLButtonElement?"submit"===e.type||"reset"===e.type:J(e)))}(e)}const oe=/* @__PURE__ */new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function ie(e,t){return"checkbox"===e.type||"radio"===e.type?" "===t:oe.has(e.type)}const se={activeMenuId:null,setActiveMenu:e=>{se.activeMenuId=e},getActiveMenu:()=>se.activeMenuId},ae=(e,t,r,n)=>{const o=()=>{const e=n.current;if(e){const t=(e=>{const t=Array.from(document.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')),r=t.indexOf(e);return-1!==r&&r<t.length-1?t[r+1]:t[0]})(e);r(),setTimeout(()=>{t&&t.focus()},10)}else r()},i=()=>e.current?Array.from(e.current.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')):[];return{handleMenuKeyDown:e=>{if("Escape"===e.key)return e.preventDefault(),r(),void(n.current&&n.current.focus());if("Tab"===e.key&&t)return e.preventDefault(),void o();((e,t)=>{if(0===t.length)return;const r=document.activeElement,n=t.indexOf(r);"ArrowDown"===e.key?(e.preventDefault(),t[n<t.length-1?n+1:0].focus()):"ArrowUp"===e.key?(e.preventDefault(),t[n>0?n-1:t.length-1].focus()):"Home"===e.key?(e.preventDefault(),t[0].focus()):"End"===e.key&&(e.preventDefault(),t[t.length-1].focus())})(e,i())},getFocusableElements:i}},ue=l(function({children:e,...t},s){const a=r.Children.only(e),u=function(e){const t=n(null),r=n(void 0),s=o(t=>{if("function"==typeof e){const r=e,n=r(t);return()=>{"function"==typeof n?n():r(null)}}if(e)return e.current=t,()=>{e.current=null}},[e]);return i(()=>({get current(){return t.current},set current(e){t.current=e,r.current&&(r.current(),r.current=void 0),null!=e&&(r.current=s(e))}}),[s])}(s),l={...t,...a.props},{buttonProps:c}=function(e,t){let r,{elementType:n="button",isDisabled:o,onPress:i,onPressStart:s,onPressEnd:a,onPressUp:u,onPressChange:l,preventFocusOnPress:c,allowFocusWhenDisabled:p,onClick:d,href:g,target:v,rel:f,type:m="button"}=e;r="button"===n?{type:m,disabled:o,form:e.form,formAction:e.formAction,formEncType:e.formEncType,formMethod:e.formMethod,formNoValidate:e.formNoValidate,formTarget:e.formTarget,name:e.name,value:e.value}:{role:"button",href:"a"!==n||o?void 0:g,target:"a"===n?v:void 0,type:"input"===n?m:void 0,disabled:"input"===n?o:void 0,"aria-disabled":o&&"input"!==n?o:void 0,rel:"a"===n?f:void 0};let{pressProps:y,isPressed:T}=z({onPressStart:s,onPressEnd:a,onPressChange:l,onPress:i,onPressUp:u,onClick:d,isDisabled:o,preventFocusOnPress:c,ref:t}),{focusableProps:E}=x(e,t);p&&(E.tabIndex=o?-1:E.tabIndex);let h=w(E,y,C(e,{labelable:!0}));return{isPressed:T,buttonProps:w(r,h,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],"aria-current":e["aria-current"],"aria-disabled":e["aria-disabled"]})}}(l,u),d=a.type!==p&&a.type!==g?c:l;return r.cloneElement(a,{...d,ref:u})}),le=({label:o,"aria-label":i,isDisabled:u=!1,placement:l="bottom start",buttonEmphasis:g="tertiary",buttonStyleVariant:v="neutral",buttonOpenVariant:f=v,alignToElementId:m,shouldFlip:y=!0,openOnHoverAndFocus:T=!1,allowTabOut:E=!0,closeOnHover:h=!0,children:P,iconStartProps:b,iconEndProps:M,onOpenChange:k})=>{const O=`menu-${c()}`,K=n(null),S=n(null),w=n(null),{isOpen:I,setIsOpen:L,preventFocusOpen:A,setPreventFocusOpen:D,openedViaKeyboard:x,setOpenedViaKeyboard:C,closeMenu:F,openMenu:N,toggleMenu:U}=((e,t)=>{const r=n(!1),[o,i]=s(!1),[u,l]=s(!1),[c,p]=s(!1),d=()=>{se.setActiveMenu(null),i(!1),l(!0),setTimeout(()=>{l(!1)},300)},g=(t=!1)=>{se.getActiveMenu()&&se.getActiveMenu()!==e&&document.dispatchEvent(new CustomEvent("menu:closeAll",{detail:{exceptMenuId:e}})),se.setActiveMenu(e),i(!0),p(t)};return a(()=>{t&&r.current&&t(o)},[o]),a(()=>{r.current=!0},[]),{isOpen:o,setIsOpen:i,preventFocusOpen:u,setPreventFocusOpen:l,openedViaKeyboard:c,setOpenedViaKeyboard:p,closeMenu:d,openMenu:g,toggleMenu:()=>{if(o)d();else{const e="BUTTON"===document.activeElement?.tagName;g(e)}}}})(O,k),{handleMenuKeyDown:H,getFocusableElements:B}=ae(w,E,F,K);((e,t,r,n,o,i,s,u,l,c)=>{a(()=>{if(!e||t)return;let r=null,i=!1;const a=()=>{r&&(clearTimeout(r),r=null)},p=()=>{const e=o.current,t=s.current;if(!e)return;const n=e.matches(":hover"),a=t?.matches(":hover")||!1;n||a||!i||(i=!1,r=setTimeout(d,300))},d=()=>{se.getActiveMenu()===n&&c()},g=()=>{setTimeout(p,50)},v=()=>{a(),i||(i=!0,u||(r=setTimeout(()=>{l(!1)},300)))},f=()=>{g()},m=()=>{a(),i=!0},y=()=>{g()},T=o.current,E=s.current;return T&&(T.addEventListener("mouseenter",v),T.addEventListener("mouseleave",f)),u&&E&&(E.addEventListener("mouseenter",m),E.addEventListener("mouseleave",y)),()=>{T&&(T.removeEventListener("mouseenter",v),T.removeEventListener("mouseleave",f)),E&&(E.removeEventListener("mouseenter",m),E.removeEventListener("mouseleave",y)),a()}},[e,t,n,u,l,c,o,s]),a(()=>{if(!e||t)return;const s=o.current;if(!s)return;let a=null,u=!1;const p=()=>{r||(a&&clearTimeout(a),u=!0,a=setTimeout(()=>{const e=document.activeElement===s&&document.activeElement!==document.body;l(e),setTimeout(()=>{u=!1},500)},300))},d=e=>{if(u)return;a&&clearTimeout(a);const t=i.current,r=e.relatedTarget;t&&!t.contains(r)&&(a=setTimeout(()=>{se.getActiveMenu()===n&&c()},200))};return s.addEventListener("focus",p),s.addEventListener("blur",d),()=>{s.removeEventListener("focus",p),s.removeEventListener("blur",d),a&&clearTimeout(a)}},[e,t,r,n,l,c,i,o])})(T,u,A,O,K,S,w,I,N,F),((e,t,r,n,o,i)=>{a(()=>{if(!t||!r||n)return;let o=null;const s=()=>{o&&(clearTimeout(o),o=null)},a=()=>{s(),o=setTimeout(()=>{i()},200)},u=()=>{s()},l=e.current;return l&&(l.addEventListener("mouseenter",u),l.addEventListener("mouseleave",a)),()=>{l&&(l.removeEventListener("mouseenter",u),l.removeEventListener("mouseleave",a)),s()}},[t,r,n,o,i,e])})(w,I,h,T,O,F),((e,t,r,n,o)=>{a(()=>{if(!r)return;const n=r=>{const n=r.target,i=t.current,s=e.current,a=i?.contains(n)&&!s?.contains(n);s&&s.contains(n)?n.closest('[data-menu-close="true"]')&&o():a||o()};return document.addEventListener("click",n,!0),()=>{document.removeEventListener("click",n,!0)}},[r,n,o,e,t])})(w,S,I,O,F);const X=I?f:v;a(()=>{const e=e=>{const{exceptMenuId:t}=e.detail||{};t&&t===O||I&&L(!1)};return document.addEventListener("menu:closeAll",e),()=>{document.removeEventListener("menu:closeAll",e)}},[O,I,L]),a(()=>{const e=se.getActiveMenu()===O;e!==I&&L(e)},[O,I,L]),a(()=>{if(I&&x&&w.current){const e=B();e.length>0&&setTimeout(()=>{e[0].focus()},50)}},[I,x,B]),a(()=>{I||C(!1)},[I,C]);const Y={isOpen:I,open:()=>N(),close:F,toggle:()=>U(),setOpen:e=>{e?N():F()}},j={ref:K,"aria-haspopup":!0,"aria-expanded":I,onPress:()=>{D(!1);const e=document.activeElement===K.current;C(e),U()},onKeyDown:e=>{"Escape"===e.key&&I?(e.preventDefault(),F(),D(!0),setTimeout(()=>{D(!1)},300)):"ArrowDown"!==e.key||I||(e.preventDefault(),N(!0))}},q=r.Children.toArray(P);let G=P,R=/* @__PURE__ */t(p,{emphasis:g,styleVariant:X,isDisabled:u,iconStartProps:b,iconEndProps:M,...j,children:o});const W=q.findIndex(e=>e?.type===ue),$=q[W];return r.isValidElement($)&&(R=r.cloneElement($,j),G=q.filter((e,t)=>t!==W)),/* @__PURE__ */e("div",{className:_,ref:S,children:[R,I&&/* @__PURE__ */t(d,{state:Y,triggerRef:(()=>{if(m){const e=document.getElementById(m);if(e)return{current:e}}return K})(),hasArrow:!1,placement:l,shouldFlip:y,isNonModal:!0,allowTabOut:E,autoFocus:x,children:/* @__PURE__ */t("div",{className:V,ref:w,onKeyDown:H,role:"menu","aria-label":i||o,tabIndex:-1,children:G})})]})};le.Trigger=ue;export{le as Menu,ue as Trigger,le as default};
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import r,{useState as n,useRef as o,useCallback as s,useMemo as i,useEffect as a,useContext as l,forwardRef as u,useId as c}from"react";import{Button as p}from"../Button/Button.js";import{Popover as d}from"../Popover/Popover.js";import{IconButton as g}from"../IconButton/IconButton.js";import{$ as v,a as m,b as f,c as y,d as T,e as E,f as h,g as P,h as b,i as M,j as k,k as O,l as K,m as S,n as w,o as I,p as L,q as A,r as D,s as x,t as C}from"../../useGlobalListeners-CGYK0FZ8.js";import{flushSync as F}from"react-dom";import{$ as _}from"../../useObjectRef-DIiuqtNU.js";import '../../assets/Menu.css';const V="_menuContainer_qw7ps_1",N="_menuContent_qw7ps_6";let U="default",H="",B=/* @__PURE__ */new WeakMap;function X(e){if(v()){if("default"===U){const t=m(e);H=t.documentElement.style.webkitUserSelect,t.documentElement.style.webkitUserSelect="none"}U="disabled"}else if(e instanceof HTMLElement||e instanceof SVGElement){let t="userSelect"in e.style?"userSelect":"webkitUserSelect";B.set(e,e.style[t]),e.style[t]="none"}}function Y(e){if(v()){if("disabled"!==U)return;U="restoring",setTimeout(()=>{f(()=>{if("restoring"===U){const t=m(e);"none"===t.documentElement.style.webkitUserSelect&&(t.documentElement.style.webkitUserSelect=H||""),H="",U="default"}})},300)}else if((e instanceof HTMLElement||e instanceof SVGElement)&&e&&B.has(e)){let t=B.get(e),r="userSelect"in e.style?"userSelect":"webkitUserSelect";"none"===e.style[r]&&(e.style[r]=t),""===e.getAttribute("style")&&e.removeAttribute("style"),B.delete(e)}}function j(e){let t=e?.defaultView;return t?.__webpack_nonce__||globalThis.__webpack_nonce__||void 0}let q=/* @__PURE__ */new WeakMap;const G=r.createContext({register:()=>{}});G.displayName="PressResponderContext";class R{#e;constructor(e,t,r,n){this.#e=!0;let o=n?.target??r.currentTarget;const s=o?.getBoundingClientRect();let i,a,l=0,u=null;null!=r.clientX&&null!=r.clientY&&(a=r.clientX,u=r.clientY),s&&(null!=a&&null!=u?(i=a-s.left,l=u-s.top):(i=s.width/2,l=s.height/2)),this.type=e,this.pointerType=t,this.target=r.currentTarget,this.shiftKey=r.shiftKey,this.metaKey=r.metaKey,this.ctrlKey=r.ctrlKey,this.altKey=r.altKey,this.x=i,this.y=l,this.key=r.key}continuePropagation(){this.#e=!1}get shouldStopPropagation(){return this.#e}}const $=/* @__PURE__ */Symbol("linkClicked"),W="react-aria-pressable-style",z="data-react-aria-pressable";function J(e){let{onPress:t,onPressChange:r,onPressStart:u,onPressEnd:c,onPressUp:p,onClick:d,isDisabled:g,isPressed:v,preventFocusOnPress:f,shouldCancelOnPointerExit:x,allowTextSelectionOnPress:C,ref:_,...V}=function(e){let t=l(G);if(t){let{register:r,ref:n,...o}=t;e=w(o,e),r()}return I(t,e.ref),e}(e),[N,U]=n(!1),H=o({isPressed:!1,ignoreEmulatedMouseEvents:!1,didFirePressStart:!1,isTriggeringEvent:!1,activePointerId:null,target:null,isOverTarget:!1,pointerType:null,disposables:[]}),{addGlobalListener:B,removeAllGlobalListeners:J}=T(),se=s((e,t)=>{let n=H.current;if(g||n.didFirePressStart)return!1;let o=!0;if(n.isTriggeringEvent=!0,u){let r=new R("pressstart",t,e);u(r),o=r.shouldStopPropagation}return r&&r(!0),n.isTriggeringEvent=!1,n.didFirePressStart=!0,U(!0),o},[g,u,r]),ie=s((e,n,o=!0)=>{let s=H.current;if(!s.didFirePressStart)return!1;s.didFirePressStart=!1,s.isTriggeringEvent=!0;let i=!0;if(c){let t=new R("pressend",n,e);c(t),i=t.shouldStopPropagation}if(r&&r(!1),U(!1),t&&o&&!g){let r=new R("press",n,e);t(r),i&&=r.shouldStopPropagation}return s.isTriggeringEvent=!1,i},[g,c,r,t]),ae=E(ie),le=s((e,t)=>{let r=H.current;if(g)return!1;if(p){r.isTriggeringEvent=!0;let n=new R("pressup",t,e);return p(n),r.isTriggeringEvent=!1,n.shouldStopPropagation}return!0},[g,p]),ue=E(le),ce=s(e=>{let t=H.current;if(t.isPressed&&t.target){t.didFirePressStart&&null!=t.pointerType&&ie(re(t.target,e),t.pointerType,!1),t.isPressed=!1,t.isOverTarget=!1,t.activePointerId=null,t.pointerType=null,J(),C||Y(t.target);for(let e of t.disposables)e();t.disposables=[]}},[C,J,ie]),pe=E(ce),de=s(e=>{x&&ce(e)},[x,ce]),ge=s(e=>{g||d?.(e)},[g,d]),ve=s((e,t)=>{if(!g&&d){let r=new MouseEvent("click",e);h(r,t),d(P(r))}},[g,d]),me=i(()=>{let e=H.current,t={onKeyDown(t){if(Z(t.nativeEvent,t.currentTarget)&&b(t.currentTarget,M(t))){oe(M(t),t.key)&&t.preventDefault();let n=!0;e.isPressed||t.repeat||(e.target=t.currentTarget,e.isPressed=!0,e.pointerType="keyboard",n=se(t,"keyboard"));let o=t.currentTarget,s=t=>{Z(t,o)&&!t.repeat&&b(o,M(t))&&e.target&&ue(re(e.target,t),"keyboard")};B(m(t.currentTarget),"keyup",A(s,r),!0),n&&t.stopPropagation(),t.metaKey&&D()&&e.metaKeyEvents?.set(t.key,t.nativeEvent)}else"Meta"===t.key&&(e.metaKeyEvents=/* @__PURE__ */new Map)},onClick(t){if((!t||b(t.currentTarget,M(t)))&&t&&0===t.button&&!e.isTriggeringEvent&&!L.isOpening){let r=!0;if(g&&t.preventDefault(),e.ignoreEmulatedMouseEvents||e.isPressed||"virtual"!==e.pointerType&&!S(t.nativeEvent)){if(e.isPressed&&"keyboard"!==e.pointerType){let n=e.pointerType||t.nativeEvent.pointerType||"virtual",o=ue(re(t.currentTarget,t),n),s=ae(re(t.currentTarget,t),n,!0);r=o&&s,e.isOverTarget=!1,ge(t),pe(t)}}else{let e=se(t,"virtual"),n=ue(t,"virtual"),o=ae(t,"virtual");ge(t),r=e&&n&&o}e.ignoreEmulatedMouseEvents=!1,r&&t.stopPropagation()}}},r=t=>{if(e.isPressed&&e.target&&Z(t,e.target)){oe(M(t),t.key)&&t.preventDefault();let r=M(t),n=b(e.target,r);ae(re(e.target,t),"keyboard",n),n&&ve(t,e.target),J(),"Enter"!==t.key&&Q(e.target)&&b(e.target,r)&&!t[$]&&(t[$]=!0,L(e.target,t,!1)),e.isPressed=!1,e.metaKeyEvents?.delete(t.key)}else if("Meta"===t.key&&e.metaKeyEvents?.size){let t=e.metaKeyEvents;e.metaKeyEvents=void 0;for(let r of t.values())e.target?.dispatchEvent(new KeyboardEvent("keyup",r))}};if("undefined"!=typeof PointerEvent){t.onPointerDown=t=>{if(0!==t.button||!b(t.currentTarget,M(t)))return;if(k(t.nativeEvent))return void(e.pointerType="virtual");e.pointerType=t.pointerType;let o=!0;if(!e.isPressed){e.isPressed=!0,e.isOverTarget=!0,e.activePointerId=t.pointerId,e.target=t.currentTarget,C||X(e.target),o=se(t,e.pointerType);let s=M(t);"releasePointerCapture"in s&&("hasPointerCapture"in s?s.hasPointerCapture(t.pointerId)&&s.releasePointerCapture(t.pointerId):s.releasePointerCapture(t.pointerId)),B(m(t.currentTarget),"pointerup",r,!1),B(m(t.currentTarget),"pointercancel",n,!1)}o&&t.stopPropagation()},t.onMouseDown=t=>{if(b(t.currentTarget,M(t))&&0===t.button){if(f){let r=O(t.target);r&&e.disposables.push(r)}t.stopPropagation()}},t.onPointerUp=t=>{b(t.currentTarget,M(t))&&"virtual"!==e.pointerType&&(0!==t.button||e.isPressed||ue(t,e.pointerType||t.pointerType))},t.onPointerEnter=t=>{t.pointerId===e.activePointerId&&e.target&&!e.isOverTarget&&null!=e.pointerType&&(e.isOverTarget=!0,se(re(e.target,t),e.pointerType))},t.onPointerLeave=t=>{t.pointerId===e.activePointerId&&e.target&&e.isOverTarget&&null!=e.pointerType&&(e.isOverTarget=!1,ae(re(e.target,t),e.pointerType,!1),de(t))};let r=t=>{if(t.pointerId===e.activePointerId&&e.isPressed&&0===t.button&&e.target){if(b(e.target,M(t))&&null!=e.pointerType){let r=!1,n=setTimeout(()=>{e.isPressed&&e.target instanceof HTMLElement&&(r?pe(t):(K(e.target),e.target.click()))},80);B(t.currentTarget,"click",()=>r=!0,!0),e.disposables.push(()=>clearTimeout(n))}else pe(t);e.isOverTarget=!1}},n=e=>{pe(e)};t.onDragStart=e=>{b(e.currentTarget,M(e))&&pe(e)}}else if("test"===process.env.NODE_ENV){t.onMouseDown=t=>{if(0!==t.button||!b(t.currentTarget,M(t)))return;if(e.ignoreEmulatedMouseEvents)return void t.stopPropagation();if(e.isPressed=!0,e.isOverTarget=!0,e.target=t.currentTarget,e.pointerType=S(t.nativeEvent)?"virtual":"mouse",F(()=>se(t,e.pointerType))&&t.stopPropagation(),f){let r=O(t.target);r&&e.disposables.push(r)}B(m(t.currentTarget),"mouseup",r,!1)},t.onMouseEnter=t=>{if(!b(t.currentTarget,M(t)))return;let r=!0;e.isPressed&&!e.ignoreEmulatedMouseEvents&&null!=e.pointerType&&(e.isOverTarget=!0,r=se(t,e.pointerType)),r&&t.stopPropagation()},t.onMouseLeave=t=>{if(!b(t.currentTarget,M(t)))return;let r=!0;e.isPressed&&!e.ignoreEmulatedMouseEvents&&null!=e.pointerType&&(e.isOverTarget=!1,r=ae(t,e.pointerType,!1),de(t)),r&&t.stopPropagation()},t.onMouseUp=t=>{b(t.currentTarget,M(t))&&(e.ignoreEmulatedMouseEvents||0!==t.button||e.isPressed||ue(t,e.pointerType||"mouse"))};let r=t=>{0===t.button&&(e.ignoreEmulatedMouseEvents?e.ignoreEmulatedMouseEvents=!1:(e.target&&b(e.target,M(t))&&null!=e.pointerType||pe(t),e.isOverTarget=!1))};t.onTouchStart=t=>{if(!b(t.currentTarget,M(t)))return;let r=function(e){const{targetTouches:t}=e;return t.length>0?t[0]:null}(t.nativeEvent);r&&(e.activePointerId=r.identifier,e.ignoreEmulatedMouseEvents=!0,e.isOverTarget=!0,e.isPressed=!0,e.target=t.currentTarget,e.pointerType="touch",C||X(e.target),se(te(e.target,t),e.pointerType)&&t.stopPropagation(),B(y(t.currentTarget),"scroll",n,!0))},t.onTouchMove=t=>{if(!b(t.currentTarget,M(t)))return;if(!e.isPressed)return void t.stopPropagation();let r=ee(t.nativeEvent,e.activePointerId),n=!0;r&&ne(r,t.currentTarget)?e.isOverTarget||null==e.pointerType||(e.isOverTarget=!0,n=se(te(e.target,t),e.pointerType)):e.isOverTarget&&null!=e.pointerType&&(e.isOverTarget=!1,n=ae(te(e.target,t),e.pointerType,!1),de(te(e.target,t))),n&&t.stopPropagation()},t.onTouchEnd=t=>{if(!b(t.currentTarget,M(t)))return;if(!e.isPressed)return void t.stopPropagation();let r=ee(t.nativeEvent,e.activePointerId),n=!0;r&&ne(r,t.currentTarget)&&null!=e.pointerType?(ue(te(e.target,t),e.pointerType),n=ae(te(e.target,t),e.pointerType),ve(t.nativeEvent,e.target)):e.isOverTarget&&null!=e.pointerType&&(n=ae(te(e.target,t),e.pointerType,!1)),n&&t.stopPropagation(),e.isPressed=!1,e.activePointerId=null,e.isOverTarget=!1,e.ignoreEmulatedMouseEvents=!0,e.target&&!C&&Y(e.target),J()},t.onTouchCancel=t=>{b(t.currentTarget,M(t))&&(t.stopPropagation(),e.isPressed&&pe(te(e.target,t)))};let n=t=>{e.isPressed&&b(M(t),e.target)&&pe({currentTarget:e.target,shiftKey:!1,ctrlKey:!1,metaKey:!1,altKey:!1})};t.onDragStart=e=>{b(e.currentTarget,M(e))&&pe(e)}}return t},[B,g,f,J,C,de,se,ge,ve]);return a(()=>{if(!_||"test"===process.env.NODE_ENV)return;const e=m(_.current);if(!e||!e.head||e.getElementById(W))return;const t=e.createElement("style");t.id=W;let r=function(e){let t=e??("undefined"!=typeof document?document:void 0);if(!t)return j(t);if(q.has(t))return q.get(t);let r=t.querySelector('meta[property="csp-nonce"]'),n=r&&r instanceof y(r).HTMLMetaElement&&(r.nonce||r.content)||j(t)||void 0;return void 0!==n&&q.set(t,n),n}(e);r&&(t.nonce=r),t.textContent=`\n@layer {\n [${z}] {\n touch-action: pan-x pan-y pinch-zoom;\n }\n}\n `.trim(),e.head.prepend(t)},[_]),a(()=>{let e=H.current;return()=>{C||Y(e.target??void 0);for(let t of e.disposables)t();e.disposables=[]}},[C]),{isPressed:v||N,pressProps:w(V,me,{[z]:!0})}}function Q(e){return"A"===e.tagName&&e.hasAttribute("href")}function Z(e,t){const{key:r,code:n}=e,o=t,s=o.getAttribute("role");return!("Enter"!==r&&" "!==r&&"Spacebar"!==r&&"Space"!==n||o instanceof y(o).HTMLInputElement&&!ie(o,r)||o instanceof y(o).HTMLTextAreaElement||o.isContentEditable||("link"===s||!s&&Q(o))&&"Enter"!==r)}function ee(e,t){const r=e.changedTouches;for(let n=0;n<r.length;n++){const e=r[n];if(e.identifier===t)return e}return null}function te(e,t){let r=0,n=0;return t.targetTouches&&1===t.targetTouches.length&&(r=t.targetTouches[0].clientX,n=t.targetTouches[0].clientY),{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:n}}function re(e,t){let r=t.clientX,n=t.clientY;return{currentTarget:e,shiftKey:t.shiftKey,ctrlKey:t.ctrlKey,metaKey:t.metaKey,altKey:t.altKey,clientX:r,clientY:n,key:t.key}}function ne(e,t){let r=t.getBoundingClientRect(),n=function(e){let t=0,r=0;return void 0!==e.width?t=e.width/2:void 0!==e.radiusX&&(t=e.radiusX),void 0!==e.height?r=e.height/2:void 0!==e.radiusY&&(r=e.radiusY),{top:e.clientY-r,right:e.clientX+t,bottom:e.clientY+r,left:e.clientX-t}}(e);return s=n,!((o=r).left>s.right||s.left>o.right||o.top>s.bottom||s.top>o.bottom);var o,s}function oe(e,t){return e instanceof HTMLInputElement?!ie(e,t):function(e){return!(e instanceof HTMLInputElement||(e instanceof HTMLButtonElement?"submit"===e.type||"reset"===e.type:Q(e)))}(e)}const se=/* @__PURE__ */new Set(["checkbox","radio","range","color","file","image","button","submit","reset"]);function ie(e,t){return"checkbox"===e.type||"radio"===e.type?" "===t:se.has(e.type)}const ae={activeMenuId:null,setActiveMenu:e=>{ae.activeMenuId=e},getActiveMenu:()=>ae.activeMenuId},le=(e,t,r,n)=>{const o=()=>{const e=n.current;if(e){const t=(e=>{const t=Array.from(document.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')),r=t.indexOf(e);return-1!==r&&r<t.length-1?t[r+1]:t[0]})(e);r(),setTimeout(()=>{t&&t.focus()},10)}else r()},s=()=>e.current?Array.from(e.current.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])')):[];return{handleMenuKeyDown:e=>{if("Escape"===e.key)return e.preventDefault(),r(),void(n.current&&n.current.focus());if("Tab"===e.key&&t)return e.preventDefault(),void o();((e,t)=>{if(0===t.length)return;const r=document.activeElement,n=t.indexOf(r);"ArrowDown"===e.key?(e.preventDefault(),t[n<t.length-1?n+1:0].focus()):"ArrowUp"===e.key?(e.preventDefault(),t[n>0?n-1:t.length-1].focus()):"Home"===e.key?(e.preventDefault(),t[0].focus()):"End"===e.key&&(e.preventDefault(),t[t.length-1].focus())})(e,s())},getFocusableElements:s}},ue=u(function({children:e,...t},n){const o=r.Children.only(e),s=_(n),i={...t,...o.props},{buttonProps:a}=function(e,t){let r,{elementType:n="button",isDisabled:o,onPress:s,onPressStart:i,onPressEnd:a,onPressUp:l,onPressChange:u,preventFocusOnPress:c,allowFocusWhenDisabled:p,onClick:d,href:g,target:v,rel:m,type:f="button"}=e;r="button"===n?{type:f,disabled:o,form:e.form,formAction:e.formAction,formEncType:e.formEncType,formMethod:e.formMethod,formNoValidate:e.formNoValidate,formTarget:e.formTarget,name:e.name,value:e.value}:{role:"button",href:"a"!==n||o?void 0:g,target:"a"===n?v:void 0,type:"input"===n?f:void 0,disabled:"input"===n?o:void 0,"aria-disabled":o&&"input"!==n?o:void 0,rel:"a"===n?m:void 0};let{pressProps:y,isPressed:T}=J({onPressStart:i,onPressEnd:a,onPressChange:u,onPress:s,onPressUp:l,onClick:d,isDisabled:o,preventFocusOnPress:c,ref:t}),{focusableProps:E}=x(e,t);p&&(E.tabIndex=o?-1:E.tabIndex);let h=w(E,y,C(e,{labelable:!0}));return{isPressed:T,buttonProps:w(r,h,{"aria-haspopup":e["aria-haspopup"],"aria-expanded":e["aria-expanded"],"aria-controls":e["aria-controls"],"aria-pressed":e["aria-pressed"],"aria-current":e["aria-current"],"aria-disabled":e["aria-disabled"]})}}(i,s),l=o.type!==p&&o.type!==g?a:i;return r.cloneElement(o,{...l,ref:s})}),ce=({label:s,"aria-label":i,isDisabled:l=!1,placement:u="bottom start",buttonEmphasis:g="tertiary",buttonStyleVariant:v="neutral",buttonOpenVariant:m=v,alignToElementId:f,shouldFlip:y=!0,openOnHoverAndFocus:T=!1,allowTabOut:E=!0,closeOnHover:h=!0,children:P,iconStartProps:b,iconEndProps:M,onOpenChange:k})=>{const O=`menu-${c()}`,K=o(null),S=o(null),w=o(null),{isOpen:I,setIsOpen:L,preventFocusOpen:A,setPreventFocusOpen:D,openedViaKeyboard:x,setOpenedViaKeyboard:C,closeMenu:F,openMenu:_,toggleMenu:U}=((e,t)=>{const r=o(!1),[s,i]=n(!1),[l,u]=n(!1),[c,p]=n(!1),d=()=>{ae.setActiveMenu(null),i(!1),u(!0),setTimeout(()=>{u(!1)},300)},g=(t=!1)=>{ae.getActiveMenu()&&ae.getActiveMenu()!==e&&document.dispatchEvent(new CustomEvent("menu:closeAll",{detail:{exceptMenuId:e}})),ae.setActiveMenu(e),i(!0),p(t)};return a(()=>{t&&r.current&&t(s)},[s]),a(()=>{r.current=!0},[]),{isOpen:s,setIsOpen:i,preventFocusOpen:l,setPreventFocusOpen:u,openedViaKeyboard:c,setOpenedViaKeyboard:p,closeMenu:d,openMenu:g,toggleMenu:()=>{if(s)d();else{const e="BUTTON"===document.activeElement?.tagName;g(e)}}}})(O,k),{handleMenuKeyDown:H,getFocusableElements:B}=le(w,E,F,K);((e,t,r,n,o,s,i,l,u,c)=>{a(()=>{if(!e||t)return;let r=null,s=!1;const a=()=>{r&&(clearTimeout(r),r=null)},p=()=>{const e=o.current,t=i.current;if(!e)return;const n=e.matches(":hover"),a=t?.matches(":hover")||!1;n||a||!s||(s=!1,r=setTimeout(d,300))},d=()=>{ae.getActiveMenu()===n&&c()},g=()=>{setTimeout(p,50)},v=()=>{a(),s||(s=!0,l||(r=setTimeout(()=>{u(!1)},300)))},m=()=>{g()},f=()=>{a(),s=!0},y=()=>{g()},T=o.current,E=i.current;return T&&(T.addEventListener("mouseenter",v),T.addEventListener("mouseleave",m)),l&&E&&(E.addEventListener("mouseenter",f),E.addEventListener("mouseleave",y)),()=>{T&&(T.removeEventListener("mouseenter",v),T.removeEventListener("mouseleave",m)),E&&(E.removeEventListener("mouseenter",f),E.removeEventListener("mouseleave",y)),a()}},[e,t,n,l,u,c,o,i]),a(()=>{if(!e||t)return;const i=o.current;if(!i)return;let a=null,l=!1;const p=()=>{r||(a&&clearTimeout(a),l=!0,a=setTimeout(()=>{const e=document.activeElement===i&&document.activeElement!==document.body;u(e),setTimeout(()=>{l=!1},500)},300))},d=e=>{if(l)return;a&&clearTimeout(a);const t=s.current,r=e.relatedTarget;t&&!t.contains(r)&&(a=setTimeout(()=>{ae.getActiveMenu()===n&&c()},200))};return i.addEventListener("focus",p),i.addEventListener("blur",d),()=>{i.removeEventListener("focus",p),i.removeEventListener("blur",d),a&&clearTimeout(a)}},[e,t,r,n,u,c,s,o])})(T,l,A,O,K,S,w,I,_,F),((e,t,r,n,o,s)=>{a(()=>{if(!t||!r||n)return;let o=null;const i=()=>{o&&(clearTimeout(o),o=null)},a=()=>{i(),o=setTimeout(()=>{s()},200)},l=()=>{i()},u=e.current;return u&&(u.addEventListener("mouseenter",l),u.addEventListener("mouseleave",a)),()=>{u&&(u.removeEventListener("mouseenter",l),u.removeEventListener("mouseleave",a)),i()}},[t,r,n,o,s,e])})(w,I,h,T,O,F),((e,t,r,n,o)=>{a(()=>{if(!r)return;const n=r=>{const n=r.target,s=t.current,i=e.current,a=s?.contains(n)&&!i?.contains(n);i&&i.contains(n)?n.closest('[data-menu-close="true"]')&&o():a||o()};return document.addEventListener("click",n,!0),()=>{document.removeEventListener("click",n,!0)}},[r,n,o,e,t])})(w,S,I,O,F);const X=I?m:v;a(()=>{const e=e=>{const{exceptMenuId:t}=e.detail||{};t&&t===O||I&&L(!1)};return document.addEventListener("menu:closeAll",e),()=>{document.removeEventListener("menu:closeAll",e)}},[O,I,L]),a(()=>{const e=ae.getActiveMenu()===O;e!==I&&L(e)},[O,I,L]),a(()=>{if(I&&x&&w.current){const e=B();e.length>0&&setTimeout(()=>{e[0].focus()},50)}},[I,x,B]),a(()=>{I||C(!1)},[I,C]);const Y={isOpen:I,open:()=>_(),close:F,toggle:()=>U(),setOpen:e=>{e?_():F()}},j={ref:K,"aria-haspopup":!0,"aria-expanded":I,onPress:()=>{D(!1);const e=document.activeElement===K.current;C(e),U()},onKeyDown:e=>{"Escape"===e.key&&I?(e.preventDefault(),F(),D(!0),setTimeout(()=>{D(!1)},300)):"ArrowDown"!==e.key||I||(e.preventDefault(),_(!0))}},q=r.Children.toArray(P);let G=P,R=/* @__PURE__ */t(p,{emphasis:g,styleVariant:X,isDisabled:l,iconStartProps:b,iconEndProps:M,...j,children:s});const $=q.findIndex(e=>e?.type===ue),W=q[$];return r.isValidElement(W)&&(R=r.cloneElement(W,j),G=q.filter((e,t)=>t!==$)),/* @__PURE__ */e("div",{className:V,ref:S,children:[R,I&&/* @__PURE__ */t(d,{state:Y,triggerRef:(()=>{if(f){const e=document.getElementById(f);if(e)return{current:e}}return K})(),hasArrow:!1,placement:u,shouldFlip:y,isNonModal:!0,allowTabOut:E,autoFocus:x,children:/* @__PURE__ */t("div",{className:N,ref:w,onKeyDown:H,role:"menu","aria-label":i||s,tabIndex:-1,children:G})})]})};ce.Trigger=ue;export{ce as Menu,ue as Trigger,ce as default};
|
|
2
2
|
//# sourceMappingURL=Menu.js.map
|