@yahoo/uds 3.46.0 → 3.46.2
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/{Box-DCfVWPEa.d.cts → Box-BFRDyWaq.d.cts} +1 -1
- package/dist/{Box-DIxPS_Eb.d.cts → Box-CVbnF3KY.d.cts} +1 -1
- package/dist/{Box-BBZ3X-K8.d.ts → Box-KZ1-_3Y1.d.ts} +1 -1
- package/dist/{Box-BiOhwq4x.d.ts → Box-MHJ0-0M3.d.ts} +1 -1
- package/dist/{Pressable-DEJTaCX7.d.ts → Pressable-BCKijzW4.d.ts} +1 -1
- package/dist/{Pressable-01KD6JSM.d.cts → Pressable-DM2L9PzA.d.cts} +1 -1
- package/dist/{Pressable-DcVYn2Mr.d.ts → Pressable-DVLHV--n.d.ts} +1 -1
- package/dist/{Pressable-DDeoEy6N.d.cts → Pressable-GdByxoJg.d.cts} +1 -1
- package/dist/{Text-D8r6CSeV.d.ts → Text-774Va3iq.d.ts} +3 -52
- package/dist/{Text-YXARg6JI.d.ts → Text-Bq5NiVYm.d.cts} +3 -52
- package/dist/{Text-B3RX9wWS.d.cts → Text-C58YvnSu.d.cts} +3 -52
- package/dist/{Text-DHrq15W_.d.cts → Text-IGbWWF7a.d.ts} +3 -52
- package/dist/{VStack-COPzfesz.d.ts → VStack-4KrkGBKP.d.ts} +2 -2
- package/dist/{VStack-C0KNZJ7o.d.cts → VStack-AyF9g6Xi.d.cts} +2 -2
- package/dist/{VStack-M-9LUirX.d.ts → VStack-CppUZHJL.d.ts} +2 -2
- package/dist/{VStack-CB6Togey.d.cts → VStack-UmkAYRN1.d.cts} +2 -2
- package/dist/chunk-53CIH36M.js +1 -0
- package/dist/chunk-H2XDX4D2.cjs +1 -0
- package/dist/chunk-HPXOQ4QK.js +1 -0
- package/dist/chunk-W7AQRGI5.cjs +1 -0
- package/dist/client/Menu.cjs +1 -2
- package/dist/client/Menu.d.cts +4 -4
- package/dist/client/Menu.d.ts +4 -4
- package/dist/client/Menu.js +2 -2
- package/dist/client/index.cjs +1 -1
- package/dist/client/index.d.cts +111 -19
- package/dist/client/index.d.ts +111 -19
- package/dist/client/index.js +1 -1
- package/dist/defaultTokensConfig.d.cts +2 -2
- package/dist/defaultTokensConfig.d.ts +2 -2
- package/dist/experimental/client/SwitchV2.cjs +0 -1
- package/dist/experimental/client/SwitchV2.d.cts +1 -1
- package/dist/experimental/client/SwitchV2.d.ts +1 -1
- package/dist/{index-CEO-Oqm3.d.cts → index-BnkxCwiE.d.cts} +1 -1
- package/dist/{index-DMyjlCBk.d.ts → index-BtKE9zn1.d.ts} +1 -1
- package/dist/{index-Dcbgq7R0.d.ts → index-DPrPpHqT.d.ts} +1 -1
- package/dist/{index-BkNyc_q0.d.cts → index-cZ0qEwcJ.d.cts} +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.cts +9 -28
- package/dist/index.d.ts +9 -28
- package/dist/index.js +1 -1
- package/dist/metafile-cjs.json +1 -1
- package/dist/metafile-esm.json +1 -1
- package/dist/tailwind/plugin.d.cts +1 -1
- package/dist/tailwind/plugin.d.ts +1 -1
- package/dist/tailwind/purger.cjs +1 -1
- package/dist/tailwind/purger.js +1 -1
- package/dist/tailwind/utils.d.cts +1 -1
- package/dist/tailwind/utils.d.ts +1 -1
- package/dist/tokens/automation/configs.d.cts +2 -2
- package/dist/tokens/automation/configs.d.ts +2 -2
- package/dist/tokens/automation/properties.d.cts +2 -2
- package/dist/tokens/automation/properties.d.ts +2 -2
- package/dist/tokens/index.d.cts +4 -4
- package/dist/tokens/index.d.ts +4 -4
- package/dist/tokens/parseTokens.d.cts +1 -1
- package/dist/tokens/parseTokens.d.ts +1 -1
- package/dist/{types-1nwPbFUc.d.cts → types-D6kYghpa.d.cts} +1 -1
- package/dist/{types-1nwPbFUc.d.ts → types-D6kYghpa.d.ts} +1 -1
- package/dist/{types-C5YKqOg3.d.cts → types-Da_DnBJy.d.cts} +1 -1
- package/dist/{types-C5YKqOg3.d.ts → types-Da_DnBJy.d.ts} +1 -1
- package/package.json +1 -1
- package/dist/chunk-2VXJ6ZXC.js +0 -1
- package/dist/chunk-6KI6LPDE.cjs +0 -1
- package/dist/chunk-I4FBYECY.cjs +0 -1
- package/dist/chunk-YFLJTZBO.js +0 -1
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { b as UniversalBoxProps } from './types-Da_DnBJy.cjs';
|
3
3
|
|
4
4
|
type DivProps = React.HTMLAttributes<HTMLDivElement>;
|
5
5
|
interface BoxProps extends UniversalBoxProps, DivProps {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { b as UniversalBoxProps } from './types-D6kYghpa.cjs';
|
3
3
|
|
4
4
|
type DivProps = React.HTMLAttributes<HTMLDivElement>;
|
5
5
|
interface BoxProps extends UniversalBoxProps, DivProps {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { b as UniversalBoxProps } from './types-D6kYghpa.js';
|
3
3
|
|
4
4
|
type DivProps = React.HTMLAttributes<HTMLDivElement>;
|
5
5
|
interface BoxProps extends UniversalBoxProps, DivProps {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { b as UniversalBoxProps } from './types-Da_DnBJy.js';
|
3
3
|
|
4
4
|
type DivProps = React.HTMLAttributes<HTMLDivElement>;
|
5
5
|
interface BoxProps extends UniversalBoxProps, DivProps {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { a as UniversalPressableProps } from './types-D6kYghpa.js';
|
3
3
|
|
4
4
|
type HtmlButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'name'>;
|
5
5
|
interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { a as UniversalPressableProps } from './types-D6kYghpa.cjs';
|
3
3
|
|
4
4
|
type HtmlButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'name'>;
|
5
5
|
interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { a as UniversalPressableProps } from './types-Da_DnBJy.js';
|
3
3
|
|
4
4
|
type HtmlButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'name'>;
|
5
5
|
interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
2
|
+
import { a as UniversalPressableProps } from './types-Da_DnBJy.cjs';
|
3
3
|
|
4
4
|
type HtmlButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'name'>;
|
5
5
|
interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
|
@@ -1,55 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import { HTMLMotionProps } from 'motion/react';
|
5
|
-
import { B as BoxProps } from './Box-BBZ3X-K8.js';
|
6
|
-
|
7
|
-
type HtmlInputProps = React.InputHTMLAttributes<HTMLInputElement> & HTMLMotionProps<'input'>;
|
8
|
-
type NativeInputProps = Omit<HtmlInputProps, 'height' | 'size' | 'width' | 'color' | 'required'>;
|
9
|
-
type DataAttributes = {
|
10
|
-
[name: `data-${string}`]: string;
|
11
|
-
};
|
12
|
-
interface InputProps extends NativeInputProps, UniversalInputProps {
|
13
|
-
/** The type of the input element. Reduced set of options from the HTML input type attribute.
|
14
|
-
* @default 'text'
|
15
|
-
*/
|
16
|
-
type?: Exclude<NativeInputProps['type'], 'button' | 'checkbox' | 'color' | 'file' | 'radio' | 'range' | 'reset' | 'submit' | 'search'>;
|
17
|
-
/** Props to be passed into various slots within the component. */
|
18
|
-
slotProps?: {
|
19
|
-
input?: Partial<InputHTMLAttributes<HTMLInputElement> & DataAttributes>;
|
20
|
-
inputWrapper?: Partial<BoxProps & DataAttributes>;
|
21
|
-
startIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
22
|
-
endIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
23
|
-
};
|
24
|
-
}
|
25
|
-
/**
|
26
|
-
* **📦 An input that allows users to enter text and collect data.**
|
27
|
-
*
|
28
|
-
* @componentType Client component
|
29
|
-
*
|
30
|
-
* @description
|
31
|
-
* An input field is a component that takes text typed into it. It can also serve as a way to display a selection and trigger a dropdown menu. Inputs are interactive elements that users can click, tap, or otherwise engage with to collect data and open dropdowns, or both.
|
32
|
-
*
|
33
|
-
* @see
|
34
|
-
* Check out the {@link https://uds.build/docs/components/input Input Docs} for more info
|
35
|
-
*
|
36
|
-
* @usage
|
37
|
-
* - Forms: For collecting data like names, emails, passwords, etc. (e.g., sign-up, login, or contact forms).
|
38
|
-
* - Search Bars: Allowing users to enter search queries to find content.
|
39
|
-
* - Filters/Settings: When users need to specify preferences, like selecting a date or adjusting a number value.
|
40
|
-
* - Feedback/Comments: Letting users leave reviews, comments, or feedback.
|
41
|
-
*
|
42
|
-
* @example
|
43
|
-
* ```tsx
|
44
|
-
* 'use client';
|
45
|
-
* import { Input } from "@yahoo/uds";
|
46
|
-
*
|
47
|
-
* <Input label="Name" placeholder="Enter your name" required />
|
48
|
-
*```
|
49
|
-
*
|
50
|
-
* @related [Checkbox](https://uds.build/docs/components/checkbox), [Radio](https://uds.build/docs/components/radio).
|
51
|
-
**/
|
52
|
-
declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
|
2
|
+
import { Ref } from 'react';
|
3
|
+
import { U as UniversalTextProps } from './types-D6kYghpa.js';
|
53
4
|
|
54
5
|
type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
|
55
6
|
type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
|
@@ -134,4 +85,4 @@ declare const Text: react.ForwardRefExoticComponent<(Omit<{
|
|
134
85
|
color?: ColorWithInherit;
|
135
86
|
} & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & Omit<UniversalTextProps, "color" | "variant">, "ref">) & react.RefAttributes<HTMLElement>>;
|
136
87
|
|
137
|
-
export {
|
88
|
+
export { Text as T, type TextProps as a };
|
@@ -1,55 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import { HTMLMotionProps } from 'motion/react';
|
5
|
-
import { B as BoxProps } from './Box-BiOhwq4x.js';
|
6
|
-
|
7
|
-
type HtmlInputProps = React.InputHTMLAttributes<HTMLInputElement> & HTMLMotionProps<'input'>;
|
8
|
-
type NativeInputProps = Omit<HtmlInputProps, 'height' | 'size' | 'width' | 'color' | 'required'>;
|
9
|
-
type DataAttributes = {
|
10
|
-
[name: `data-${string}`]: string;
|
11
|
-
};
|
12
|
-
interface InputProps extends NativeInputProps, UniversalInputProps {
|
13
|
-
/** The type of the input element. Reduced set of options from the HTML input type attribute.
|
14
|
-
* @default 'text'
|
15
|
-
*/
|
16
|
-
type?: Exclude<NativeInputProps['type'], 'button' | 'checkbox' | 'color' | 'file' | 'radio' | 'range' | 'reset' | 'submit' | 'search'>;
|
17
|
-
/** Props to be passed into various slots within the component. */
|
18
|
-
slotProps?: {
|
19
|
-
input?: Partial<InputHTMLAttributes<HTMLInputElement> & DataAttributes>;
|
20
|
-
inputWrapper?: Partial<BoxProps & DataAttributes>;
|
21
|
-
startIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
22
|
-
endIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
23
|
-
};
|
24
|
-
}
|
25
|
-
/**
|
26
|
-
* **📦 An input that allows users to enter text and collect data.**
|
27
|
-
*
|
28
|
-
* @componentType Client component
|
29
|
-
*
|
30
|
-
* @description
|
31
|
-
* An input field is a component that takes text typed into it. It can also serve as a way to display a selection and trigger a dropdown menu. Inputs are interactive elements that users can click, tap, or otherwise engage with to collect data and open dropdowns, or both.
|
32
|
-
*
|
33
|
-
* @see
|
34
|
-
* Check out the {@link https://uds.build/docs/components/input Input Docs} for more info
|
35
|
-
*
|
36
|
-
* @usage
|
37
|
-
* - Forms: For collecting data like names, emails, passwords, etc. (e.g., sign-up, login, or contact forms).
|
38
|
-
* - Search Bars: Allowing users to enter search queries to find content.
|
39
|
-
* - Filters/Settings: When users need to specify preferences, like selecting a date or adjusting a number value.
|
40
|
-
* - Feedback/Comments: Letting users leave reviews, comments, or feedback.
|
41
|
-
*
|
42
|
-
* @example
|
43
|
-
* ```tsx
|
44
|
-
* 'use client';
|
45
|
-
* import { Input } from "@yahoo/uds";
|
46
|
-
*
|
47
|
-
* <Input label="Name" placeholder="Enter your name" required />
|
48
|
-
*```
|
49
|
-
*
|
50
|
-
* @related [Checkbox](https://uds.build/docs/components/checkbox), [Radio](https://uds.build/docs/components/radio).
|
51
|
-
**/
|
52
|
-
declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
|
2
|
+
import { Ref } from 'react';
|
3
|
+
import { U as UniversalTextProps } from './types-Da_DnBJy.cjs';
|
53
4
|
|
54
5
|
type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
|
55
6
|
type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
|
@@ -134,4 +85,4 @@ declare const Text: react.ForwardRefExoticComponent<(Omit<{
|
|
134
85
|
color?: ColorWithInherit;
|
135
86
|
} & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & Omit<UniversalTextProps, "color" | "variant">, "ref">) & react.RefAttributes<HTMLElement>>;
|
136
87
|
|
137
|
-
export {
|
88
|
+
export { Text as T, type TextProps as a };
|
@@ -1,55 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import { HTMLMotionProps } from 'motion/react';
|
5
|
-
import { B as BoxProps } from './Box-DCfVWPEa.cjs';
|
6
|
-
|
7
|
-
type HtmlInputProps = React.InputHTMLAttributes<HTMLInputElement> & HTMLMotionProps<'input'>;
|
8
|
-
type NativeInputProps = Omit<HtmlInputProps, 'height' | 'size' | 'width' | 'color' | 'required'>;
|
9
|
-
type DataAttributes = {
|
10
|
-
[name: `data-${string}`]: string;
|
11
|
-
};
|
12
|
-
interface InputProps extends NativeInputProps, UniversalInputProps {
|
13
|
-
/** The type of the input element. Reduced set of options from the HTML input type attribute.
|
14
|
-
* @default 'text'
|
15
|
-
*/
|
16
|
-
type?: Exclude<NativeInputProps['type'], 'button' | 'checkbox' | 'color' | 'file' | 'radio' | 'range' | 'reset' | 'submit' | 'search'>;
|
17
|
-
/** Props to be passed into various slots within the component. */
|
18
|
-
slotProps?: {
|
19
|
-
input?: Partial<InputHTMLAttributes<HTMLInputElement> & DataAttributes>;
|
20
|
-
inputWrapper?: Partial<BoxProps & DataAttributes>;
|
21
|
-
startIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
22
|
-
endIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
23
|
-
};
|
24
|
-
}
|
25
|
-
/**
|
26
|
-
* **📦 An input that allows users to enter text and collect data.**
|
27
|
-
*
|
28
|
-
* @componentType Client component
|
29
|
-
*
|
30
|
-
* @description
|
31
|
-
* An input field is a component that takes text typed into it. It can also serve as a way to display a selection and trigger a dropdown menu. Inputs are interactive elements that users can click, tap, or otherwise engage with to collect data and open dropdowns, or both.
|
32
|
-
*
|
33
|
-
* @see
|
34
|
-
* Check out the {@link https://uds.build/docs/components/input Input Docs} for more info
|
35
|
-
*
|
36
|
-
* @usage
|
37
|
-
* - Forms: For collecting data like names, emails, passwords, etc. (e.g., sign-up, login, or contact forms).
|
38
|
-
* - Search Bars: Allowing users to enter search queries to find content.
|
39
|
-
* - Filters/Settings: When users need to specify preferences, like selecting a date or adjusting a number value.
|
40
|
-
* - Feedback/Comments: Letting users leave reviews, comments, or feedback.
|
41
|
-
*
|
42
|
-
* @example
|
43
|
-
* ```tsx
|
44
|
-
* 'use client';
|
45
|
-
* import { Input } from "@yahoo/uds";
|
46
|
-
*
|
47
|
-
* <Input label="Name" placeholder="Enter your name" required />
|
48
|
-
*```
|
49
|
-
*
|
50
|
-
* @related [Checkbox](https://uds.build/docs/components/checkbox), [Radio](https://uds.build/docs/components/radio).
|
51
|
-
**/
|
52
|
-
declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
|
2
|
+
import { Ref } from 'react';
|
3
|
+
import { U as UniversalTextProps } from './types-D6kYghpa.cjs';
|
53
4
|
|
54
5
|
type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
|
55
6
|
type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
|
@@ -134,4 +85,4 @@ declare const Text: react.ForwardRefExoticComponent<(Omit<{
|
|
134
85
|
color?: ColorWithInherit;
|
135
86
|
} & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & Omit<UniversalTextProps, "color" | "variant">, "ref">) & react.RefAttributes<HTMLElement>>;
|
136
87
|
|
137
|
-
export {
|
88
|
+
export { Text as T, type TextProps as a };
|
@@ -1,55 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import { HTMLMotionProps } from 'motion/react';
|
5
|
-
import { B as BoxProps } from './Box-DIxPS_Eb.cjs';
|
6
|
-
|
7
|
-
type HtmlInputProps = React.InputHTMLAttributes<HTMLInputElement> & HTMLMotionProps<'input'>;
|
8
|
-
type NativeInputProps = Omit<HtmlInputProps, 'height' | 'size' | 'width' | 'color' | 'required'>;
|
9
|
-
type DataAttributes = {
|
10
|
-
[name: `data-${string}`]: string;
|
11
|
-
};
|
12
|
-
interface InputProps extends NativeInputProps, UniversalInputProps {
|
13
|
-
/** The type of the input element. Reduced set of options from the HTML input type attribute.
|
14
|
-
* @default 'text'
|
15
|
-
*/
|
16
|
-
type?: Exclude<NativeInputProps['type'], 'button' | 'checkbox' | 'color' | 'file' | 'radio' | 'range' | 'reset' | 'submit' | 'search'>;
|
17
|
-
/** Props to be passed into various slots within the component. */
|
18
|
-
slotProps?: {
|
19
|
-
input?: Partial<InputHTMLAttributes<HTMLInputElement> & DataAttributes>;
|
20
|
-
inputWrapper?: Partial<BoxProps & DataAttributes>;
|
21
|
-
startIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
22
|
-
endIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
|
23
|
-
};
|
24
|
-
}
|
25
|
-
/**
|
26
|
-
* **📦 An input that allows users to enter text and collect data.**
|
27
|
-
*
|
28
|
-
* @componentType Client component
|
29
|
-
*
|
30
|
-
* @description
|
31
|
-
* An input field is a component that takes text typed into it. It can also serve as a way to display a selection and trigger a dropdown menu. Inputs are interactive elements that users can click, tap, or otherwise engage with to collect data and open dropdowns, or both.
|
32
|
-
*
|
33
|
-
* @see
|
34
|
-
* Check out the {@link https://uds.build/docs/components/input Input Docs} for more info
|
35
|
-
*
|
36
|
-
* @usage
|
37
|
-
* - Forms: For collecting data like names, emails, passwords, etc. (e.g., sign-up, login, or contact forms).
|
38
|
-
* - Search Bars: Allowing users to enter search queries to find content.
|
39
|
-
* - Filters/Settings: When users need to specify preferences, like selecting a date or adjusting a number value.
|
40
|
-
* - Feedback/Comments: Letting users leave reviews, comments, or feedback.
|
41
|
-
*
|
42
|
-
* @example
|
43
|
-
* ```tsx
|
44
|
-
* 'use client';
|
45
|
-
* import { Input } from "@yahoo/uds";
|
46
|
-
*
|
47
|
-
* <Input label="Name" placeholder="Enter your name" required />
|
48
|
-
*```
|
49
|
-
*
|
50
|
-
* @related [Checkbox](https://uds.build/docs/components/checkbox), [Radio](https://uds.build/docs/components/radio).
|
51
|
-
**/
|
52
|
-
declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
|
2
|
+
import { Ref } from 'react';
|
3
|
+
import { U as UniversalTextProps } from './types-Da_DnBJy.js';
|
53
4
|
|
54
5
|
type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
|
55
6
|
type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
|
@@ -134,4 +85,4 @@ declare const Text: react.ForwardRefExoticComponent<(Omit<{
|
|
134
85
|
color?: ColorWithInherit;
|
135
86
|
} & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & Omit<UniversalTextProps, "color" | "variant">, "ref">) & react.RefAttributes<HTMLElement>>;
|
136
87
|
|
137
|
-
export {
|
88
|
+
export { Text as T, type TextProps as a };
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import { B as BoxProps, D as DivProps } from './Box-
|
2
|
+
import { n as UniversalStackProps, o as UniversalDividerProps } from './types-D6kYghpa.js';
|
3
|
+
import { B as BoxProps, D as DivProps } from './Box-KZ1-_3Y1.js';
|
4
4
|
|
5
5
|
interface DividerCoreProps extends Omit<BoxProps, 'color' | 'borderColor' | 'borderWidth'>, Omit<UniversalStackProps, 'separator' | 'asChild'>, Omit<UniversalDividerProps, 'variant'> {
|
6
6
|
layerClassNames?: {
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import { B as BoxProps, D as DivProps } from './Box-
|
2
|
+
import { n as UniversalStackProps, o as UniversalDividerProps } from './types-D6kYghpa.cjs';
|
3
|
+
import { B as BoxProps, D as DivProps } from './Box-CVbnF3KY.cjs';
|
4
4
|
|
5
5
|
interface DividerCoreProps extends Omit<BoxProps, 'color' | 'borderColor' | 'borderWidth'>, Omit<UniversalStackProps, 'separator' | 'asChild'>, Omit<UniversalDividerProps, 'variant'> {
|
6
6
|
layerClassNames?: {
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import { B as BoxProps, D as DivProps } from './Box-
|
2
|
+
import { n as UniversalStackProps, o as UniversalDividerProps } from './types-Da_DnBJy.js';
|
3
|
+
import { B as BoxProps, D as DivProps } from './Box-MHJ0-0M3.js';
|
4
4
|
|
5
5
|
interface DividerCoreProps extends Omit<BoxProps, 'color' | 'borderColor' | 'borderWidth'>, Omit<UniversalStackProps, 'separator' | 'asChild'>, Omit<UniversalDividerProps, 'variant'> {
|
6
6
|
layerClassNames?: {
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import * as react from 'react';
|
2
|
-
import {
|
3
|
-
import { B as BoxProps, D as DivProps } from './Box-
|
2
|
+
import { n as UniversalStackProps, o as UniversalDividerProps } from './types-Da_DnBJy.cjs';
|
3
|
+
import { B as BoxProps, D as DivProps } from './Box-BFRDyWaq.cjs';
|
4
4
|
|
5
5
|
interface DividerCoreProps extends Omit<BoxProps, 'color' | 'borderColor' | 'borderWidth'>, Omit<UniversalStackProps, 'separator' | 'asChild'>, Omit<UniversalDividerProps, 'variant'> {
|
6
6
|
layerClassNames?: {
|
@@ -0,0 +1 @@
|
|
1
|
+
import{getStyles as o}from"./chunk-PMXAH4FA.js";import{jsx as r}from"react/jsx-runtime";/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */function t({width:t,height:e,src:i,alt:d,contentFit:a,backgroundColor:n,borderRadius:l,borderTopStartRadius:s,borderTopEndRadius:f,borderBottomStartRadius:p,borderBottomEndRadius:b,borderColor:c,borderStartColor:g,borderEndColor:h,borderTopColor:m,borderBottomColor:u,borderWidth:C,borderVerticalWidth:S,borderHorizontalWidth:W,borderStartWidth:x,borderEndWidth:B,borderTopWidth:w,borderBottomWidth:E,alignContent:T,alignItems:R,alignSelf:H,flex:v,flexDirection:z,flexGrow:G,flexShrink:V,flexWrap:k,justifyContent:y,flexBasis:j,display:F,overflow:X,overflowX:A,overflowY:D,position:I,spacing:Y,spacingHorizontal:M,spacingVertical:N,spacingBottom:P,spacingEnd:q,spacingStart:J,spacingTop:K,offset:L,offsetVertical:O,offsetHorizontal:Q,offsetBottom:U,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro,...to}){const eo=o({contentFit:a,backgroundColor:n,borderRadius:l,borderTopStartRadius:s,borderTopEndRadius:f,borderBottomStartRadius:p,borderBottomEndRadius:b,borderColor:c,borderStartColor:g,borderEndColor:h,borderTopColor:m,borderBottomColor:u,borderWidth:C,borderVerticalWidth:S,borderHorizontalWidth:W,borderStartWidth:x,borderEndWidth:B,borderTopWidth:w,borderBottomWidth:E,alignContent:T,alignItems:R,alignSelf:H,flex:v,flexDirection:z,flexGrow:G,flexShrink:V,flexWrap:k,justifyContent:y,flexBasis:j,display:F,overflow:X,overflowX:A,overflowY:D,position:I,spacing:Y,spacingHorizontal:M,spacingVertical:N,spacingBottom:P,spacingEnd:q,spacingStart:J,spacingTop:K,offset:L,offsetVertical:O,offsetHorizontal:Q,offsetBottom:U,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro});return r("img",{src:i,alt:d,className:eo,style:{width:t,height:e},...to})}export{t as Image};
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";var o=require("./chunk-3VUEFW4X.cjs"),r=require("react/jsx-runtime");/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */exports.Image=function({width:t,height:e,src:i,alt:d,contentFit:a,backgroundColor:n,borderRadius:s,borderTopStartRadius:l,borderTopEndRadius:f,borderBottomStartRadius:c,borderBottomEndRadius:p,borderColor:b,borderStartColor:g,borderEndColor:h,borderTopColor:u,borderBottomColor:m,borderWidth:S,borderVerticalWidth:W,borderHorizontalWidth:C,borderStartWidth:x,borderEndWidth:B,borderTopWidth:E,borderBottomWidth:w,alignContent:T,alignItems:R,alignSelf:v,flex:V,flexDirection:y,flexGrow:z,flexShrink:G,flexWrap:H,justifyContent:j,flexBasis:k,display:F,overflow:I,overflowX:X,overflowY:q,position:D,spacing:Y,spacingHorizontal:N,spacingVertical:U,spacingBottom:A,spacingEnd:J,spacingStart:K,spacingTop:L,offset:M,offsetVertical:O,offsetHorizontal:P,offsetBottom:Q,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro,...to}){const eo=o.getStyles({contentFit:a,backgroundColor:n,borderRadius:s,borderTopStartRadius:l,borderTopEndRadius:f,borderBottomStartRadius:c,borderBottomEndRadius:p,borderColor:b,borderStartColor:g,borderEndColor:h,borderTopColor:u,borderBottomColor:m,borderWidth:S,borderVerticalWidth:W,borderHorizontalWidth:C,borderStartWidth:x,borderEndWidth:B,borderTopWidth:E,borderBottomWidth:w,alignContent:T,alignItems:R,alignSelf:v,flex:V,flexDirection:y,flexGrow:z,flexShrink:G,flexWrap:H,justifyContent:j,flexBasis:k,display:F,overflow:I,overflowX:X,overflowY:q,position:D,spacing:Y,spacingHorizontal:N,spacingVertical:U,spacingBottom:A,spacingEnd:J,spacingStart:K,spacingTop:L,offset:M,offsetVertical:O,offsetHorizontal:P,offsetBottom:Q,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro});return r.jsx("img",{src:i,alt:d,className:eo,style:{width:t,height:e},...to})};
|
@@ -0,0 +1 @@
|
|
1
|
+
import{getStyles as o}from"./chunk-7IYNK6VF.js";import{jsx as r}from"react/jsx-runtime";/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */function t({width:t,height:e,src:i,alt:d,contentFit:a,backgroundColor:n,borderRadius:l,borderTopStartRadius:s,borderTopEndRadius:f,borderBottomStartRadius:p,borderBottomEndRadius:b,borderColor:c,borderStartColor:g,borderEndColor:h,borderTopColor:m,borderBottomColor:u,borderWidth:C,borderVerticalWidth:S,borderHorizontalWidth:W,borderStartWidth:x,borderEndWidth:B,borderTopWidth:w,borderBottomWidth:E,alignContent:T,alignItems:R,alignSelf:V,flex:v,flexDirection:z,flexGrow:G,flexShrink:H,flexWrap:k,justifyContent:y,flexBasis:j,display:F,overflow:I,overflowX:Y,overflowY:D,position:N,spacing:X,spacingHorizontal:K,spacingVertical:q,spacingBottom:A,spacingEnd:J,spacingStart:L,spacingTop:M,offset:O,offsetVertical:P,offsetHorizontal:Q,offsetBottom:U,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro,...to}){const eo=o({contentFit:a,backgroundColor:n,borderRadius:l,borderTopStartRadius:s,borderTopEndRadius:f,borderBottomStartRadius:p,borderBottomEndRadius:b,borderColor:c,borderStartColor:g,borderEndColor:h,borderTopColor:m,borderBottomColor:u,borderWidth:C,borderVerticalWidth:S,borderHorizontalWidth:W,borderStartWidth:x,borderEndWidth:B,borderTopWidth:w,borderBottomWidth:E,alignContent:T,alignItems:R,alignSelf:V,flex:v,flexDirection:z,flexGrow:G,flexShrink:H,flexWrap:k,justifyContent:y,flexBasis:j,display:F,overflow:I,overflowX:Y,overflowY:D,position:N,spacing:X,spacingHorizontal:K,spacingVertical:q,spacingBottom:A,spacingEnd:J,spacingStart:L,spacingTop:M,offset:O,offsetVertical:P,offsetHorizontal:Q,offsetBottom:U,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro});return r("img",{src:i,alt:d,className:eo,style:{width:t,height:e},...to})}export{t as Image};
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";var o=require("./chunk-JD7PX7BB.cjs"),r=require("react/jsx-runtime");/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */exports.Image=function({width:t,height:e,src:i,alt:d,contentFit:a,backgroundColor:n,borderRadius:s,borderTopStartRadius:l,borderTopEndRadius:f,borderBottomStartRadius:c,borderBottomEndRadius:p,borderColor:b,borderStartColor:g,borderEndColor:h,borderTopColor:u,borderBottomColor:m,borderWidth:S,borderVerticalWidth:B,borderHorizontalWidth:C,borderStartWidth:W,borderEndWidth:x,borderTopWidth:w,borderBottomWidth:E,alignContent:T,alignItems:R,alignSelf:v,flex:y,flexDirection:z,flexGrow:G,flexShrink:H,flexWrap:V,justifyContent:j,flexBasis:k,display:D,overflow:I,overflowX:X,overflowY:q,position:F,spacing:Y,spacingHorizontal:J,spacingVertical:N,spacingBottom:P,spacingEnd:A,spacingStart:K,spacingTop:L,offset:M,offsetVertical:O,offsetHorizontal:Q,offsetBottom:U,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro,...to}){const eo=o.getStyles({contentFit:a,backgroundColor:n,borderRadius:s,borderTopStartRadius:l,borderTopEndRadius:f,borderBottomStartRadius:c,borderBottomEndRadius:p,borderColor:b,borderStartColor:g,borderEndColor:h,borderTopColor:u,borderBottomColor:m,borderWidth:S,borderVerticalWidth:B,borderHorizontalWidth:C,borderStartWidth:W,borderEndWidth:x,borderTopWidth:w,borderBottomWidth:E,alignContent:T,alignItems:R,alignSelf:v,flex:y,flexDirection:z,flexGrow:G,flexShrink:H,flexWrap:V,justifyContent:j,flexBasis:k,display:D,overflow:I,overflowX:X,overflowY:q,position:F,spacing:Y,spacingHorizontal:J,spacingVertical:N,spacingBottom:P,spacingEnd:A,spacingStart:K,spacingTop:L,offset:M,offsetVertical:O,offsetHorizontal:Q,offsetBottom:U,offsetEnd:Z,offsetStart:$,offsetTop:_,columnGap:oo,rowGap:ro});return r.jsx("img",{src:i,alt:d,className:eo,style:{width:t,height:e},...to})};
|
package/dist/client/Menu.cjs
CHANGED
@@ -1,3 +1,2 @@
|
|
1
1
|
"use client";
|
2
|
-
"use strict";var e=require("../chunk-GMQZWDKV.cjs"),r=require("../chunk-H5RFGJT6.cjs"),t=require("../chunk-IWTF6VT4.cjs"),a=require("../chunk-TWH2EAVG.cjs"),d=require("../chunk-3VUEFW4X.cjs"),s=require("../chunk-QLXJH36U.cjs"),n=require("@ariakit/react/menu"),i=require("react"),c=require("use-sync-external-store/shim/index.js"),o=require("@yahoo/uds/fixtures"),u=require("motion/react"),l=require("react/jsx-runtime"),x=require("@ariakit/react");function m(e){return e&&e.__esModule?e:{default:e}}function p(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}}),r.default=e,Object.freeze(r)}var f=p(i),b=m(c);function h(e){return e}function _(e,r){const t=e.__unstableInternals;return function(e,r){if(!e)throw new Error(r)}(t,"Invalid store"),t[r]}var{useSyncExternalStore:v}=b.default;function g(e,r=h){const t=f.useCallback(r=>e?function(e,...r){if(e)return _(e,"subscribe")(...r)}(e,null,r):()=>{},[e]),a=()=>{const t="string"==typeof r?r:null,a="function"==typeof r?r:null,d=null==e?void 0:e.getState();if(a)return a(d);/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
|
3
|
-
var s,n;if(d&&(t&&(s=d,n=t,"function"==typeof Object.hasOwn?Object.hasOwn(s,n):Object.prototype.hasOwnProperty.call(s,n))))return d[t]};return v(t,a,a)}var I=u.m.create(t.VStack),y=5,S=.97,w={top:{x:0,y:y},bottom:{x:0,y:-5},left:{x:y,y:0},right:{x:-5,y:0}},C=e=>i.useMemo(()=>((e="bottom")=>{const[r="top"]=e?.split("-");return{closed:{...w[r],opacity:0,scale:S},open:{y:0,x:0,opacity:1,scale:1}}})(e),[e]),j=i.forwardRef(function({gap:e,spacing:r,spacingBottom:t,spacingEnd:a,spacingStart:s,spacingTop:c,gutter:x="1",backgroundColor:m="primary",borderRadius:p="md",borderColor:f,borderWidth:b="thin",overflow:h,dropShadow:_="lg",className:v,sameWidth:y,focusable:S,children:w,portalElement:j,portal:k=!0,disableAutoBorderRadius:N,...M},V){const E=n.useMenuContext(),R=g(E,"open"),O=g(E,"mounted"),P=g(E,"currentPlacement"),T=g(E,"placement"),[q,z]=i.useState(P),[A,D]=i.useState(P);i.useEffect(()=>{T!==A&&D(T)},[T]),i.useEffect(()=>{P!==A&&D(P)},[P]),i.useEffect(()=>{O&&A!==q&&z(A)},[O,A,q]);const H=i.useMemo(()=>R&&O?"open":"closed",[R,O]),B=i.useMemo(()=>R?_:"none",[R,_]),W=C(A),F=(({borderRadius:e,spacing:r})=>{if(void 0===r||"0"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))]";case"sm":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))]";case"md":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))]";case"lg":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))]"}if("px"===r||"0.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_2px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))]"}if("1"===r||"1.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_4px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_4px)]"}if("2"===r||"2.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_8px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_8px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_8px)]"}if("3"===r||"3.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))]";case"md":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-md)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-md)_-_6px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))] [&>*:last-child]:rounded-b-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))]"}if("4"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_16px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_16px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))]"}switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))] [&>*:last-child]:rounded-b-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))]"}})({borderRadius:p,spacing:r}),G=i.useMemo(()=>o.spacingMap[x],[x]);return l.jsx(u.AnimatePresence,{initial:!1,children:l.jsx(n.Menu,{gutter:G,sameWidth:y,focusable:S,store:E,ref:V,portalElement:j,portal:k,...M,render:l.jsx(I,{backgroundColor:m,gap:e,spacing:r,spacingBottom:t,spacingEnd:a,spacingStart:s,spacingTop:c,borderRadius:p,borderColor:f,borderWidth:b,overflow:h,animate:H,variants:W,dropShadow:B,className:d.cx("uds-menu-content","transition-shadow","duration-200","ease-in-out","min-w-60","max-w-lg","max-h-96","overflow-auto","uds-ring","z-10","group",!N&&F,v),children:w})})})}),k=i.forwardRef(function({role:r="separator",contentPosition:t="start",gap:a="4",children:s,spacingVertical:n=(s?"2":"0"),spacingHorizontal:i=(s?"4":"0"),className:c,...o},u){const x={root:d.getStyles({menuDividerVariantRoot:"default",className:c}),text:d.getStyles({menuDividerVariantText:"default"}),line:d.getStyles({menuDividerVariantLine:"default"})};return l.jsx(e.DividerInternal,{ref:u,role:r,variant:"inherit",contentPosition:t,gap:a,spacingVertical:n,spacingHorizontal:i,className:x.root,layerClassNames:x,...o,children:s})});k.displayName="MenuDivider";var N={};s.__export(N,{Content:()=>j,Divider:()=>k,Item:()=>R,ItemCheckbox:()=>O,Provider:()=>q,Trigger:()=>z,useMenuContext:()=>n.useMenuContext,useMenuStore:()=>n.useMenuStore,useStoreState:()=>x.useStoreState});var M="uds-menu-item",V={visible:{scale:1,opacity:1},hidden:{scale:.7,opacity:0}},E=i.forwardRef(function({spacing:e="0",spacingBottom:a,spacingEnd:s,spacingHorizontal:n="4",spacingStart:c,spacingTop:o,spacingVertical:x="3.5",columnGap:m="2",className:p,children:f,endIcon:b,startIcon:h,hideEndIcon:_,active:v,disabled:g,as:I,name:y,alignItems:S="center",justifyContent:w="space-between",layerClassNames:C,slots:j,rootProps:k,...N},E){const R=i.Children.count(f)>1,O=(({active:e,disabled:r,className:t})=>d.cx(M,"flex","focus-visible:text-brand","focus-visible:bg-brand-secondary","focus-visible:z-10","uds-ring","!-outline-offset-2",e&&["[&:not([aria-checked])]:cursor-default"],r&&"opacity-25 cursor-not-allowed","duration-20 transition-[font-variation-settings] ease-in-out","z-0",t))({active:v,disabled:g,className:p}),P=d.getStyles({className:d.cx(`${M}-content truncate`,C?.text),textAlign:"start",...R&&{columnGap:m,display:"flex",alignItems:"center",width:"full",justifyContent:"space-between"}}),T=i.useMemo(()=>({root:d.getStyles({menuSizeRoot:"default",flexDirection:"row",spacing:e,spacingBottom:a,spacingEnd:s,spacingHorizontal:n,spacingStart:c,spacingTop:o,spacingVertical:x,columnGap:m,alignItems:S,justifyContent:w,className:d.cx(O,C?.root)}),startIcon:d.getStyles({menuSizeStartIcon:"default",className:C?.startIcon}),endIcon:d.getStyles({menuSizeEndIcon:"default",className:C?.endIcon})}),[S,m,w,C?.endIcon,C?.root,C?.startIcon,O,e,a,s,n,c,o,x]),q=j?.root??(e=>l.jsx(r.Pressable,{...e,...N}));return l.jsxs(I,{ref:E,name:y??"",...k,render:q,disabled:g,className:T.root,children:[l.jsxs(t.HStack,{gap:m,alignItems:"center",width:"full",children:[l.jsx(u.AnimatePresence,{initial:!1,children:h&&l.jsx(u.m.span,{variants:V,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-start-icon",children:l.jsx(d.IconSlot,{icon:h,className:T.startIcon,iconProps:{size:"sm",variant:v?"fill":"outline",color:"current"}})})}),l.jsx("span",{className:P,children:f})]}),l.jsx(u.AnimatePresence,{initial:!1,mode:"popLayout",children:!_&&b&&l.jsx(u.m.span,{variants:V,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-end-icon",children:l.jsx(d.IconSlot,{icon:b,className:T.endIcon,iconProps:{size:"sm",variant:v?"fill":"outline",color:"current"}})})})]})});E.displayName="MenuItemBase";var R=i.forwardRef(function({active:e,hideOnClick:r,...t},a){const s={root:d.getStyles({menuItemVariantRoot:"default",menuItemVariantActiveRoot:e?"on":"off"}),text:d.getStyles({menuItemVariantText:"default",menuItemVariantActiveText:e?"on":"off"}),startIcon:d.getStyles({menuItemVariantIcon:"default",menuItemVariantActiveIcon:e?"on":"off"})};return l.jsx(E,{ref:a,as:n.MenuItem,active:e,layerClassNames:s,rootProps:{hideOnClick:r},...t})});R.displayName="MenuItem";var O=i.forwardRef(function({name:e,endIcon:t=r.e,checked:a,defaultChecked:s,hideOnClick:c,className:o,...u},m){const p=e,f=i.useRef(!1),b=n.useMenuContext(),h=x.useStoreState(b);i.useEffect(()=>{!f.current&&void 0!==s&&b&&(b.setValues(e=>({...e,[p]:s})),f.current=!0)},[b,s,p]);const _=i.useMemo(()=>{if(void 0!==a)return a;if(h?.items?.length){const e=h?.items.find(e=>e.element?.name===p);if(e?.element)return e.element.checked}const e=h?.values[p];return"boolean"==typeof e?e:s??!1},[h?.items,h?.values,p,a,s]),v=i.useCallback(e=>{void 0===a&&b?.setValues(r=>({...r,[p]:e.target.checked}))},[p,b,a]),g={root:d.getStyles({menuItemCheckboxVariantRoot:"default",menuItemCheckboxVariantActiveRoot:_?"on":"off"}),text:d.getStyles({menuItemCheckboxVariantText:"default",menuItemCheckboxVariantActiveText:_?"on":"off"}),startIcon:d.getStyles({menuItemCheckboxVariantStartIcon:"default",menuItemCheckboxVariantActiveStartIcon:_?"on":"off"}),endIcon:d.getStyles({menuItemCheckboxVariantEndIcon:"default",menuItemCheckboxVariantActiveEndIcon:_?"on":"off"})};return l.jsx(E,{ref:m,as:n.MenuItemCheckbox,hideEndIcon:!_,endIcon:t,active:_,className:d.cx("uds-menu-item-checkbox",o),layerClassNames:g,name:e,rootProps:{onChange:v,defaultChecked:s,checked:void 0!==a?a:void 0,hideOnClick:c},...u})});O.displayName="MenuItemCheckbox";var P=()=>{if("undefined"==typeof document)return!1;return"rtl"===getComputedStyle(document.documentElement).direction},T=e=>{const[r,t]=i.useState(P);return i.useEffect(()=>{if(e?.explicit)return void t(e.explicit);const r=(e=>{const r=new MutationObserver(r=>{r.some(e=>"attributes"===e.type&&"dir"===e.attributeName)&&e()});return r.observe(document.documentElement,{attributes:!0,attributeFilter:["dir"]}),r})(()=>{t(P())});return()=>r.disconnect()},[e?.explicit]),r},q=function({placement:e="bottom",rtl:r,...t}){const d=T({explicit:r}),s=((e,r)=>{const t=r?.rtl;if("start"===e)return t?"right":"left";if("end"===e)return t?"left":"right";if(e?.includes("-")){const[r,a]=e.split("-");if(!("start"!==r&&"end"!==r||"top"!==a&&"bottom"!==a))return`${"start"===r?t?"right":"left":t?"left":"right"}-${"bottom"===a?"end":"start"}`;if("top"===r||"bottom"===r)return`${r}-${"start"===a?t?"end":"start":t?"start":"end"}`}return e})(e,{rtl:d});return l.jsx(a.SpringMotionConfig,{children:l.jsx(n.MenuProvider,{placement:s,rtl:d,...t})})},z=i.forwardRef(function({asChild:e,children:r,className:t,...a},s){const c=i.useRef(null),o=e?{render:l.jsx(d.Box,{asChild:!0,ref:c,className:"uds-ring h-fit w-fit",children:r})}:{children:r},u=i.useCallback(()=>{const e=c.current?.firstChild;e instanceof HTMLElement&&"function"==typeof e.focus&&e.focus()},[c]);return l.jsx(n.MenuButton,{onFocus:u,onFocusVisible:u,ref:s,className:d.cx("uds-menu-trigger",t),...o,...a})});exports.Menu=N;
|
2
|
+
"use strict";var e=require("../chunk-GMQZWDKV.cjs"),r=require("../chunk-H5RFGJT6.cjs"),t=require("../chunk-IWTF6VT4.cjs"),a=require("../chunk-TWH2EAVG.cjs"),d=require("../chunk-3VUEFW4X.cjs"),s=require("../chunk-QLXJH36U.cjs"),n=require("@ariakit/react/menu"),i=require("react"),c=require("use-sync-external-store/shim/index.js"),o=require("@yahoo/uds/fixtures"),u=require("motion/react"),l=require("react/jsx-runtime"),x=require("@ariakit/react");function m(e){return e&&e.__esModule?e:{default:e}}function p(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}}),r.default=e,Object.freeze(r)}var f=p(i),b=m(c),h={};function _(e){return e}function v(e,r){const t=e.__unstableInternals;return function(e,r){if(!e)throw new Error(r)}(t,"Invalid store"),t[r]}s.__export(h,{Content:()=>k,Divider:()=>N,Item:()=>R,ItemCheckbox:()=>O,Provider:()=>q,Trigger:()=>z,useMenuContext:()=>n.useMenuContext,useMenuStore:()=>n.useMenuStore,useStoreState:()=>x.useStoreState});var{useSyncExternalStore:g}=b.default;function I(e,r=_){const t=f.useCallback(r=>e?function(e,...r){if(e)return v(e,"subscribe")(...r)}(e,null,r):()=>{},[e]),a=()=>{const t="string"==typeof r?r:null,a="function"==typeof r?r:null,d=null==e?void 0:e.getState();if(a)return a(d);var s,n;if(d&&(t&&(s=d,n=t,"function"==typeof Object.hasOwn?Object.hasOwn(s,n):Object.prototype.hasOwnProperty.call(s,n))))return d[t]};return g(t,a,a)}var y=u.m.create(t.VStack),S=5,w=.97,C={top:{x:0,y:S},bottom:{x:0,y:-5},left:{x:S,y:0},right:{x:-5,y:0}},j=e=>i.useMemo(()=>((e="bottom")=>{const[r="top"]=e?.split("-");return{closed:{...C[r],opacity:0,scale:w},open:{y:0,x:0,opacity:1,scale:1}}})(e),[e]),k=i.forwardRef(function({gap:e,spacing:r,spacingBottom:t,spacingEnd:a,spacingStart:s,spacingTop:c,gutter:x="1",backgroundColor:m="primary",borderRadius:p="md",borderColor:f,borderWidth:b="thin",overflow:h,dropShadow:_="lg",className:v,sameWidth:g,focusable:S,children:w,portalElement:C,portal:k=!0,disableAutoBorderRadius:N,...M},V){const E=n.useMenuContext(),R=I(E,"open"),O=I(E,"mounted"),P=I(E,"currentPlacement"),T=I(E,"placement"),[q,z]=i.useState(P),[A,D]=i.useState(P);i.useEffect(()=>{T!==A&&D(T)},[T]),i.useEffect(()=>{P!==A&&D(P)},[P]),i.useEffect(()=>{O&&A!==q&&z(A)},[O,A,q]);const H=i.useMemo(()=>R&&O?"open":"closed",[R,O]),B=i.useMemo(()=>R?_:"none",[R,_]),W=j(A),F=(({borderRadius:e,spacing:r})=>{if(void 0===r||"0"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))]";case"sm":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))]";case"md":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))]";case"lg":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))]"}if("px"===r||"0.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_2px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))]"}if("1"===r||"1.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_4px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_4px)]"}if("2"===r||"2.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_8px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_8px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_8px)]"}if("3"===r||"3.5"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))]";case"md":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-md)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-md)_-_6px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))] [&>*:last-child]:rounded-b-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))]"}if("4"===r)switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_16px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_16px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))]"}switch(e){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))] [&>*:last-child]:rounded-b-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))]"}})({borderRadius:p,spacing:r}),G=i.useMemo(()=>o.spacingMap[x],[x]);return l.jsx(u.AnimatePresence,{initial:!1,children:l.jsx(n.Menu,{gutter:G,sameWidth:g,focusable:S,store:E,ref:V,portalElement:C,portal:k,...M,render:l.jsx(y,{backgroundColor:m,gap:e,spacing:r,spacingBottom:t,spacingEnd:a,spacingStart:s,spacingTop:c,borderRadius:p,borderColor:f,borderWidth:b,overflow:h,animate:H,variants:W,dropShadow:B,className:d.cx("uds-menu-content","transition-shadow","duration-200","ease-in-out","min-w-60","max-w-lg","max-h-96","overflow-auto","uds-ring","z-10","group",!N&&F,v),children:w})})})}),N=i.forwardRef(function({role:r="separator",contentPosition:t="start",gap:a="4",children:s,spacingVertical:n=(s?"2":"0"),spacingHorizontal:i=(s?"4":"0"),className:c,...o},u){const x={root:d.getStyles({menuDividerVariantRoot:"default",className:c}),text:d.getStyles({menuDividerVariantText:"default"}),line:d.getStyles({menuDividerVariantLine:"default"})};return l.jsx(e.DividerInternal,{ref:u,role:r,variant:"inherit",contentPosition:t,gap:a,spacingVertical:n,spacingHorizontal:i,className:x.root,layerClassNames:x,...o,children:s})});N.displayName="MenuDivider";var M="uds-menu-item",V={visible:{scale:1,opacity:1},hidden:{scale:.7,opacity:0}},E=i.forwardRef(function({spacing:e="0",spacingBottom:a,spacingEnd:s,spacingHorizontal:n="4",spacingStart:c,spacingTop:o,spacingVertical:x="3.5",columnGap:m="2",className:p,children:f,endIcon:b,startIcon:h,hideEndIcon:_,active:v,disabled:g,as:I,name:y,alignItems:S="center",justifyContent:w="space-between",layerClassNames:C,slots:j,rootProps:k,...N},E){const R=i.Children.count(f)>1,O=(({active:e,disabled:r,className:t})=>d.cx(M,"flex","focus-visible:text-brand","focus-visible:bg-brand-secondary","focus-visible:z-10","uds-ring","!-outline-offset-2",e&&["[&:not([aria-checked])]:cursor-default"],r&&"opacity-25 cursor-not-allowed","duration-20 transition-[font-variation-settings] ease-in-out","z-0",t))({active:v,disabled:g,className:p}),P=d.getStyles({className:d.cx(`${M}-content truncate`,C?.text),textAlign:"start",...R&&{columnGap:m,display:"flex",alignItems:"center",width:"full",justifyContent:"space-between"}}),T=i.useMemo(()=>({root:d.getStyles({menuSizeRoot:"default",flexDirection:"row",spacing:e,spacingBottom:a,spacingEnd:s,spacingHorizontal:n,spacingStart:c,spacingTop:o,spacingVertical:x,columnGap:m,alignItems:S,justifyContent:w,className:d.cx(O,C?.root)}),startIcon:d.getStyles({menuSizeStartIcon:"default",className:C?.startIcon}),endIcon:d.getStyles({menuSizeEndIcon:"default",className:C?.endIcon})}),[S,m,w,C?.endIcon,C?.root,C?.startIcon,O,e,a,s,n,c,o,x]),q=j?.root??(e=>l.jsx(r.Pressable,{...e,...N}));return l.jsxs(I,{ref:E,name:y??"",...k,render:q,disabled:g,className:T.root,children:[l.jsxs(t.HStack,{gap:m,alignItems:"center",width:"full",children:[l.jsx(u.AnimatePresence,{initial:!1,children:h&&l.jsx(u.m.span,{variants:V,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-start-icon",children:l.jsx(d.IconSlot,{icon:h,className:T.startIcon,iconProps:{size:"sm",variant:v?"fill":"outline",color:"current"}})})}),l.jsx("span",{className:P,children:f})]}),l.jsx(u.AnimatePresence,{initial:!1,mode:"popLayout",children:!_&&b&&l.jsx(u.m.span,{variants:V,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-end-icon",children:l.jsx(d.IconSlot,{icon:b,className:T.endIcon,iconProps:{size:"sm",variant:v?"fill":"outline",color:"current"}})})})]})});E.displayName="MenuItemBase";var R=i.forwardRef(function({active:e,hideOnClick:r,...t},a){const s={root:d.getStyles({menuItemVariantRoot:"default",menuItemVariantActiveRoot:e?"on":"off"}),text:d.getStyles({menuItemVariantText:"default",menuItemVariantActiveText:e?"on":"off"}),startIcon:d.getStyles({menuItemVariantIcon:"default",menuItemVariantActiveIcon:e?"on":"off"})};return l.jsx(E,{ref:a,as:n.MenuItem,active:e,layerClassNames:s,rootProps:{hideOnClick:r},...t})});R.displayName="MenuItem";var O=i.forwardRef(function({name:e,endIcon:t=r.e,checked:a,defaultChecked:s,hideOnClick:c,className:o,...u},m){const p=e,f=i.useRef(!1),b=n.useMenuContext(),h=x.useStoreState(b);i.useEffect(()=>{!f.current&&void 0!==s&&b&&(b.setValues(e=>({...e,[p]:s})),f.current=!0)},[b,s,p]);const _=i.useMemo(()=>{if(void 0!==a)return a;if(h?.items?.length){const e=h?.items.find(e=>e.element?.name===p);if(e?.element)return e.element.checked}const e=h?.values[p];return"boolean"==typeof e?e:s??!1},[h?.items,h?.values,p,a,s]),v=i.useCallback(e=>{void 0===a&&b?.setValues(r=>({...r,[p]:e.target.checked}))},[p,b,a]),g={root:d.getStyles({menuItemCheckboxVariantRoot:"default",menuItemCheckboxVariantActiveRoot:_?"on":"off"}),text:d.getStyles({menuItemCheckboxVariantText:"default",menuItemCheckboxVariantActiveText:_?"on":"off"}),startIcon:d.getStyles({menuItemCheckboxVariantStartIcon:"default",menuItemCheckboxVariantActiveStartIcon:_?"on":"off"}),endIcon:d.getStyles({menuItemCheckboxVariantEndIcon:"default",menuItemCheckboxVariantActiveEndIcon:_?"on":"off"})};return l.jsx(E,{ref:m,as:n.MenuItemCheckbox,hideEndIcon:!_,endIcon:t,active:_,className:d.cx("uds-menu-item-checkbox",o),layerClassNames:g,name:e,rootProps:{onChange:v,defaultChecked:s,checked:void 0!==a?a:void 0,hideOnClick:c},...u})});O.displayName="MenuItemCheckbox";var P=()=>{if("undefined"==typeof document)return!1;return"rtl"===getComputedStyle(document.documentElement).direction},T=e=>{const[r,t]=i.useState(P);return i.useEffect(()=>{if(e?.explicit)return void t(e.explicit);const r=(e=>{const r=new MutationObserver(r=>{r.some(e=>"attributes"===e.type&&"dir"===e.attributeName)&&e()});return r.observe(document.documentElement,{attributes:!0,attributeFilter:["dir"]}),r})(()=>{t(P())});return()=>r.disconnect()},[e?.explicit]),r},q=function({placement:e="bottom",rtl:r,...t}){const d=T({explicit:r}),s=((e,r)=>{const t=r?.rtl;if("start"===e)return t?"right":"left";if("end"===e)return t?"left":"right";if(e?.includes("-")){const[r,a]=e.split("-");if(!("start"!==r&&"end"!==r||"top"!==a&&"bottom"!==a))return`${"start"===r?t?"right":"left":t?"left":"right"}-${"bottom"===a?"end":"start"}`;if("top"===r||"bottom"===r)return`${r}-${"start"===a?t?"end":"start":t?"start":"end"}`}return e})(e,{rtl:d});return l.jsx(a.SpringMotionConfig,{children:l.jsx(n.MenuProvider,{placement:s,rtl:d,...t})})},z=i.forwardRef(function({asChild:e,children:r,className:t,...a},s){const c=i.useRef(null),o=e?{render:l.jsx(d.Box,{asChild:!0,ref:c,className:"uds-ring h-fit w-fit",children:r})}:{children:r},u=i.useCallback(()=>{const e=c.current?.firstChild;e instanceof HTMLElement&&"function"==typeof e.focus&&e.focus()},[c]);return l.jsx(n.MenuButton,{onFocus:u,onFocusVisible:u,ref:s,className:d.cx("uds-menu-trigger",t),...o,...a})});exports.Menu=h;
|
package/dist/client/Menu.d.cts
CHANGED
@@ -1,11 +1,11 @@
|
|
1
1
|
import * as react from 'react';
|
2
2
|
import { AriaRole, HTMLAttributes, PropsWithChildren } from 'react';
|
3
3
|
import { MenuProps, MenuItemProps as MenuItemProps$1, MenuItemCheckboxProps as MenuItemCheckboxProps$1, MenuProviderProps as MenuProviderProps$1, MenuButtonProps, useMenuContext, useMenuStore } from '@ariakit/react/menu';
|
4
|
-
import {
|
5
|
-
import { V as VStackProps, D as DividerProps } from '../VStack-
|
6
|
-
import { P as PressableProps } from '../Pressable-
|
4
|
+
import { t as SpacingAlias, u as UniversalMenuItemProps } from '../types-Da_DnBJy.cjs';
|
5
|
+
import { V as VStackProps, D as DividerProps } from '../VStack-UmkAYRN1.cjs';
|
6
|
+
import { P as PressableProps } from '../Pressable-GdByxoJg.cjs';
|
7
7
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
8
|
-
import { B as BoxProps } from '../Box-
|
8
|
+
import { B as BoxProps } from '../Box-BFRDyWaq.cjs';
|
9
9
|
import { useStoreState } from '@ariakit/react';
|
10
10
|
import '@yahoo/uds-icons/types';
|
11
11
|
import 'motion/react';
|
package/dist/client/Menu.d.ts
CHANGED
@@ -1,11 +1,11 @@
|
|
1
1
|
import * as react from 'react';
|
2
2
|
import { AriaRole, HTMLAttributes, PropsWithChildren } from 'react';
|
3
3
|
import { MenuProps, MenuItemProps as MenuItemProps$1, MenuItemCheckboxProps as MenuItemCheckboxProps$1, MenuProviderProps as MenuProviderProps$1, MenuButtonProps, useMenuContext, useMenuStore } from '@ariakit/react/menu';
|
4
|
-
import {
|
5
|
-
import { V as VStackProps, D as DividerProps } from '../VStack-
|
6
|
-
import { P as PressableProps } from '../Pressable-
|
4
|
+
import { t as SpacingAlias, u as UniversalMenuItemProps } from '../types-Da_DnBJy.js';
|
5
|
+
import { V as VStackProps, D as DividerProps } from '../VStack-CppUZHJL.js';
|
6
|
+
import { P as PressableProps } from '../Pressable-DVLHV--n.js';
|
7
7
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
8
|
-
import { B as BoxProps } from '../Box-
|
8
|
+
import { B as BoxProps } from '../Box-MHJ0-0M3.js';
|
9
9
|
import { useStoreState } from '@ariakit/react';
|
10
10
|
import '@yahoo/uds-icons/types';
|
11
11
|
import 'motion/react';
|
package/dist/client/Menu.js
CHANGED
@@ -1,3 +1,3 @@
|
|
1
1
|
"use client";
|
2
|
-
import{DividerInternal as r}from"../chunk-5VROETXJ.js";import{e,Pressable as a}from"../chunk-GGW73ECI.js";import{VStack as d,HStack as t}from"../chunk-WFWWC766.js";import{SpringMotionConfig as s}from"../chunk-EFOWTGKI.js";import{cx as i,getStyles as n,IconSlot as c,Box as o}from"../chunk-PMXAH4FA.js";import{__export as u}from"../chunk-GF4A6TFM.js";import{
|
3
|
-
var s,i;if(t&&(a&&(s=t,i=a,"function"==typeof Object.hasOwn?Object.hasOwn(s,i):Object.prototype.hasOwnProperty.call(s,i))))return t[a]};return A(a,d,d)}var R=S.create(d),W=5,F=.97,G={top:{x:0,y:W},bottom:{x:0,y:-5},left:{x:W,y:0},right:{x:-5,y:0}},B=r=>w(()=>((r="bottom")=>{const[e="top"]=r?.split("-");return{closed:{...G[e],opacity:0,scale:F},open:{y:0,x:0,opacity:1,scale:1}}})(r),[r]),D=v(function({gap:r,spacing:e,spacingBottom:a,spacingEnd:d,spacingStart:t,spacingTop:s,gutter:n="1",backgroundColor:c="primary",borderRadius:o="md",borderColor:u,borderWidth:x="thin",overflow:p,dropShadow:h="lg",className:b,sameWidth:f,focusable:_,children:v,portalElement:y,portal:C=!0,disableAutoBorderRadius:k,...N},S){const M=l(),T=P(M,"open"),O=P(M,"mounted"),z=P(M,"currentPlacement"),A=P(M,"placement"),[W,F]=g(z),[G,D]=g(z);I(()=>{A!==G&&D(A)},[A]),I(()=>{z!==G&&D(z)},[z]),I(()=>{O&&G!==W&&F(G)},[O,G,W]);const H=w(()=>T&&O?"open":"closed",[T,O]),$=w(()=>T?h:"none",[T,h]),L=B(G),X=(({borderRadius:r,spacing:e})=>{if(void 0===e||"0"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))]";case"sm":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))]";case"md":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))]";case"lg":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))]"}if("px"===e||"0.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_2px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))]"}if("1"===e||"1.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_4px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_4px)]"}if("2"===e||"2.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_8px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_8px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_8px)]"}if("3"===e||"3.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))]";case"md":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-md)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-md)_-_6px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))] [&>*:last-child]:rounded-b-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))]"}if("4"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_16px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_16px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))]"}switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))] [&>*:last-child]:rounded-b-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))]"}})({borderRadius:o,spacing:e}),J=w(()=>V[n],[n]);return j(E,{initial:!1,children:j(m,{gutter:J,sameWidth:f,focusable:_,store:M,ref:S,portalElement:y,portal:C,...N,render:j(R,{backgroundColor:c,gap:r,spacing:e,spacingBottom:a,spacingEnd:d,spacingStart:t,spacingTop:s,borderRadius:o,borderColor:u,borderWidth:x,overflow:p,animate:H,variants:L,dropShadow:$,className:i("uds-menu-content","transition-shadow","duration-200","ease-in-out","min-w-60","max-w-lg","max-h-96","overflow-auto","uds-ring","z-10","group",!k&&X,b),children:v})})})}),H=v(function({role:e="separator",contentPosition:a="start",gap:d="4",children:t,spacingVertical:s=(t?"2":"0"),spacingHorizontal:i=(t?"4":"0"),className:c,...o},u){const l={root:n({menuDividerVariantRoot:"default",className:c}),text:n({menuDividerVariantText:"default"}),line:n({menuDividerVariantLine:"default"})};return j(r,{ref:u,role:e,variant:"inherit",contentPosition:a,gap:d,spacingVertical:s,spacingHorizontal:i,className:l.root,layerClassNames:l,...o,children:t})});H.displayName="MenuDivider";var $={};u($,{Content:()=>D,Divider:()=>H,Item:()=>K,ItemCheckbox:()=>q,Provider:()=>Y,Trigger:()=>Z,useMenuContext:()=>l,useMenuStore:()=>x,useStoreState:()=>T});var L="uds-menu-item",X={visible:{scale:1,opacity:1},hidden:{scale:.7,opacity:0}},J=v(function({spacing:r="0",spacingBottom:e,spacingEnd:d,spacingHorizontal:s="4",spacingStart:o,spacingTop:u,spacingVertical:l="3.5",columnGap:m="2",className:x,children:p,endIcon:h,startIcon:b,hideEndIcon:f,active:_,disabled:v,as:g,name:I,alignItems:C="center",justifyContent:k="space-between",layerClassNames:N,slots:V,rootProps:T,...O},z){const A=y.count(p)>1,P=(({active:r,disabled:e,className:a})=>i(L,"flex","focus-visible:text-brand","focus-visible:bg-brand-secondary","focus-visible:z-10","uds-ring","!-outline-offset-2",r&&["[&:not([aria-checked])]:cursor-default"],e&&"opacity-25 cursor-not-allowed","duration-20 transition-[font-variation-settings] ease-in-out","z-0",a))({active:_,disabled:v,className:x}),R=n({className:i(`${L}-content truncate`,N?.text),textAlign:"start",...A&&{columnGap:m,display:"flex",alignItems:"center",width:"full",justifyContent:"space-between"}}),W=w(()=>({root:n({menuSizeRoot:"default",flexDirection:"row",spacing:r,spacingBottom:e,spacingEnd:d,spacingHorizontal:s,spacingStart:o,spacingTop:u,spacingVertical:l,columnGap:m,alignItems:C,justifyContent:k,className:i(P,N?.root)}),startIcon:n({menuSizeStartIcon:"default",className:N?.startIcon}),endIcon:n({menuSizeEndIcon:"default",className:N?.endIcon})}),[C,m,k,N?.endIcon,N?.root,N?.startIcon,P,r,e,d,s,o,u,l]);return M(g,{ref:z,name:I??"",...T,render:V?.root??(r=>j(a,{...r,...O})),disabled:v,className:W.root,children:[M(t,{gap:m,alignItems:"center",width:"full",children:[j(E,{initial:!1,children:b&&j(S.span,{variants:X,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-start-icon",children:j(c,{icon:b,className:W.startIcon,iconProps:{size:"sm",variant:_?"fill":"outline",color:"current"}})})}),j("span",{className:R,children:p})]}),j(E,{initial:!1,mode:"popLayout",children:!f&&h&&j(S.span,{variants:X,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-end-icon",children:j(c,{icon:h,className:W.endIcon,iconProps:{size:"sm",variant:_?"fill":"outline",color:"current"}})})})]})});J.displayName="MenuItemBase";var K=v(function({active:r,hideOnClick:e,...a},d){const t={root:n({menuItemVariantRoot:"default",menuItemVariantActiveRoot:r?"on":"off"}),text:n({menuItemVariantText:"default",menuItemVariantActiveText:r?"on":"off"}),startIcon:n({menuItemVariantIcon:"default",menuItemVariantActiveIcon:r?"on":"off"})};return j(J,{ref:d,as:p,active:r,layerClassNames:t,rootProps:{hideOnClick:e},...a})});K.displayName="MenuItem";var q=v(function({name:r,endIcon:a=e,checked:d,defaultChecked:t,hideOnClick:s,className:c,...o},u){const m=r,x=C(!1),p=l(),b=T(p);I(()=>{!x.current&&void 0!==t&&p&&(p.setValues(r=>({...r,[m]:t})),x.current=!0)},[p,t,m]);const f=w(()=>{if(void 0!==d)return d;if(b?.items?.length){const r=b?.items.find(r=>r.element?.name===m);if(r?.element)return r.element.checked}const r=b?.values[m];return"boolean"==typeof r?r:t??!1},[b?.items,b?.values,m,d,t]),_=k(r=>{void 0===d&&p?.setValues(e=>({...e,[m]:r.target.checked}))},[m,p,d]),v={root:n({menuItemCheckboxVariantRoot:"default",menuItemCheckboxVariantActiveRoot:f?"on":"off"}),text:n({menuItemCheckboxVariantText:"default",menuItemCheckboxVariantActiveText:f?"on":"off"}),startIcon:n({menuItemCheckboxVariantStartIcon:"default",menuItemCheckboxVariantActiveStartIcon:f?"on":"off"}),endIcon:n({menuItemCheckboxVariantEndIcon:"default",menuItemCheckboxVariantActiveEndIcon:f?"on":"off"})};return j(J,{ref:u,as:h,hideEndIcon:!f,endIcon:a,active:f,className:i("uds-menu-item-checkbox",c),layerClassNames:v,name:r,rootProps:{onChange:_,defaultChecked:t,checked:void 0!==d?d:void 0,hideOnClick:s},...o})});q.displayName="MenuItemCheckbox";var Q=()=>{if("undefined"==typeof document)return!1;return"rtl"===getComputedStyle(document.documentElement).direction},U=r=>{const[e,a]=g(Q);return I(()=>{if(r?.explicit)return void a(r.explicit);const e=(r=>{const e=new MutationObserver(e=>{e.some(r=>"attributes"===r.type&&"dir"===r.attributeName)&&r()});return e.observe(document.documentElement,{attributes:!0,attributeFilter:["dir"]}),e})(()=>{a(Q())});return()=>e.disconnect()},[r?.explicit]),e},Y=function({placement:r="bottom",rtl:e,...a}){const d=U({explicit:e}),t=((r,e)=>{const a=e?.rtl;if("start"===r)return a?"right":"left";if("end"===r)return a?"left":"right";if(r?.includes("-")){const[e,d]=r.split("-");if(!("start"!==e&&"end"!==e||"top"!==d&&"bottom"!==d))return`${"start"===e?a?"right":"left":a?"left":"right"}-${"bottom"===d?"end":"start"}`;if("top"===e||"bottom"===e)return`${e}-${"start"===d?a?"end":"start":a?"start":"end"}`}return r})(r,{rtl:d});return j(s,{children:j(b,{placement:t,rtl:d,...a})})},Z=v(function({asChild:r,children:e,className:a,...d},t){const s=C(null),n=r?{render:j(o,{asChild:!0,ref:s,className:"uds-ring h-fit w-fit",children:e})}:{children:e},c=k(()=>{const r=s.current?.firstChild;r instanceof HTMLElement&&"function"==typeof r.focus&&r.focus()},[s]);return j(f,{onFocus:c,onFocusVisible:c,ref:t,className:i("uds-menu-trigger",a),...n,...d})});export{$ as Menu};
|
2
|
+
import{DividerInternal as r}from"../chunk-5VROETXJ.js";import{e,Pressable as a}from"../chunk-GGW73ECI.js";import{VStack as d,HStack as t}from"../chunk-WFWWC766.js";import{SpringMotionConfig as s}from"../chunk-EFOWTGKI.js";import{cx as i,getStyles as n,IconSlot as c,Box as o}from"../chunk-PMXAH4FA.js";import{__export as u}from"../chunk-GF4A6TFM.js";import{useMenuStore as l,useMenuContext as m,Menu as x,MenuItem as p,MenuItemCheckbox as h,MenuProvider as b,MenuButton as f}from"@ariakit/react/menu";import*as _ from"react";import{forwardRef as v,useState as g,useEffect as I,useMemo as w,Children as y,useRef as C,useCallback as k}from"react";import N from"use-sync-external-store/shim/index.js";import{spacingMap as V}from"@yahoo/uds/fixtures";import{m as S,AnimatePresence as E}from"motion/react";import{jsx as j,jsxs as M}from"react/jsx-runtime";import{useStoreState as T}from"@ariakit/react";/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
|
3
|
+
var O={};function z(r){return r}function A(r,e){const a=r.__unstableInternals;return function(r,e){if(!r)throw new Error(e)}(a,"Invalid store"),a[e]}u(O,{Content:()=>H,Divider:()=>$,Item:()=>K,ItemCheckbox:()=>q,Provider:()=>Y,Trigger:()=>Z,useMenuContext:()=>m,useMenuStore:()=>l,useStoreState:()=>T});var{useSyncExternalStore:P}=N;function R(r,e=z){const a=_.useCallback(e=>r?function(r,...e){if(r)return A(r,"subscribe")(...e)}(r,null,e):()=>{},[r]),d=()=>{const a="string"==typeof e?e:null,d="function"==typeof e?e:null,t=null==r?void 0:r.getState();if(d)return d(t);var s,i;if(t&&(a&&(s=t,i=a,"function"==typeof Object.hasOwn?Object.hasOwn(s,i):Object.prototype.hasOwnProperty.call(s,i))))return t[a]};return P(a,d,d)}var W=S.create(d),F=5,G=.97,B={top:{x:0,y:F},bottom:{x:0,y:-5},left:{x:F,y:0},right:{x:-5,y:0}},D=r=>w(()=>((r="bottom")=>{const[e="top"]=r?.split("-");return{closed:{...B[e],opacity:0,scale:G},open:{y:0,x:0,opacity:1,scale:1}}})(r),[r]),H=v(function({gap:r,spacing:e,spacingBottom:a,spacingEnd:d,spacingStart:t,spacingTop:s,gutter:n="1",backgroundColor:c="primary",borderRadius:o="md",borderColor:u,borderWidth:l="thin",overflow:p,dropShadow:h="lg",className:b,sameWidth:f,focusable:_,children:v,portalElement:y,portal:C=!0,disableAutoBorderRadius:k,...N},S){const M=m(),T=R(M,"open"),O=R(M,"mounted"),z=R(M,"currentPlacement"),A=R(M,"placement"),[P,F]=g(z),[G,B]=g(z);I(()=>{A!==G&&B(A)},[A]),I(()=>{z!==G&&B(z)},[z]),I(()=>{O&&G!==P&&F(G)},[O,G,P]);const H=w(()=>T&&O?"open":"closed",[T,O]),$=w(()=>T?h:"none",[T,h]),L=D(G),X=(({borderRadius:r,spacing:e})=>{if(void 0===e||"0"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xs)_-_var(--uds-border-width-thin))]";case"sm":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-sm)_-_var(--uds-border-width-thin))]";case"md":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-md)_-_var(--uds-border-width-thin))]";case"lg":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-lg)_-_var(--uds-border-width-thin))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_var(--uds-border-width-thin))]"}if("px"===e||"0.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_2px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_2px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_2px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_2px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xl)_-_2px))]"}if("1"===e||"1.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_4px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_4px)]"}if("2"===e||"2.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_8px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_8px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_8px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-lg)_-_8px))]";case"xl":return"[&>*:first-child]:rounded-t-[calc(var(--uds-border-radius-xl)_-_8px)] [&>*:last-child]:rounded-b-[calc(var(--uds-border-radius-xl)_-_8px)]"}if("3"===e||"3.5"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-xs)_-_6px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-sm)_-_6px))]";case"md":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-md)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-md)_-_6px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_6px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))] [&>*:last-child]:rounded-b-[min(20px,calc(var(--uds-border-radius-xl)_-_6px))]"}if("4"===e)switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_16px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_16px))]";case"md":return"[&>*:first-child]:rounded-t-[max(4px,calc(var(--uds-border-radius-md)_-_16px))] [&>*:last-child]:rounded-b-[max(4px,calc(var(--uds-border-radius-md)_-_16px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-lg)_-_16px))]";case"xl":return"[&>*:first-child]:rounded-t-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))] [&>*:last-child]:rounded-b-[max(6px,calc(var(--uds-border-radius-xl)_-_16px))]"}switch(r){case"xs":return"[&>*:first-child]:rounded-t-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))] [&>*:last-child]:rounded-b-[max(1px,calc(var(--uds-border-radius-xs)_-_4px))]";case"sm":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-sm)_-_4px))]";case"md":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-md)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-md)_-_4px))]";case"lg":return"[&>*:first-child]:rounded-t-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))] [&>*:last-child]:rounded-b-[max(2px,calc(var(--uds-border-radius-lg)_-_4px))]";case"xl":return"[&>*:first-child]:rounded-t-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))] [&>*:last-child]:rounded-b-[min(18px,calc(var(--uds-border-radius-xl)_-_4px))]"}})({borderRadius:o,spacing:e}),J=w(()=>V[n],[n]);return j(E,{initial:!1,children:j(x,{gutter:J,sameWidth:f,focusable:_,store:M,ref:S,portalElement:y,portal:C,...N,render:j(W,{backgroundColor:c,gap:r,spacing:e,spacingBottom:a,spacingEnd:d,spacingStart:t,spacingTop:s,borderRadius:o,borderColor:u,borderWidth:l,overflow:p,animate:H,variants:L,dropShadow:$,className:i("uds-menu-content","transition-shadow","duration-200","ease-in-out","min-w-60","max-w-lg","max-h-96","overflow-auto","uds-ring","z-10","group",!k&&X,b),children:v})})})}),$=v(function({role:e="separator",contentPosition:a="start",gap:d="4",children:t,spacingVertical:s=(t?"2":"0"),spacingHorizontal:i=(t?"4":"0"),className:c,...o},u){const l={root:n({menuDividerVariantRoot:"default",className:c}),text:n({menuDividerVariantText:"default"}),line:n({menuDividerVariantLine:"default"})};return j(r,{ref:u,role:e,variant:"inherit",contentPosition:a,gap:d,spacingVertical:s,spacingHorizontal:i,className:l.root,layerClassNames:l,...o,children:t})});$.displayName="MenuDivider";var L="uds-menu-item",X={visible:{scale:1,opacity:1},hidden:{scale:.7,opacity:0}},J=v(function({spacing:r="0",spacingBottom:e,spacingEnd:d,spacingHorizontal:s="4",spacingStart:o,spacingTop:u,spacingVertical:l="3.5",columnGap:m="2",className:x,children:p,endIcon:h,startIcon:b,hideEndIcon:f,active:_,disabled:v,as:g,name:I,alignItems:C="center",justifyContent:k="space-between",layerClassNames:N,slots:V,rootProps:T,...O},z){const A=y.count(p)>1,P=(({active:r,disabled:e,className:a})=>i(L,"flex","focus-visible:text-brand","focus-visible:bg-brand-secondary","focus-visible:z-10","uds-ring","!-outline-offset-2",r&&["[&:not([aria-checked])]:cursor-default"],e&&"opacity-25 cursor-not-allowed","duration-20 transition-[font-variation-settings] ease-in-out","z-0",a))({active:_,disabled:v,className:x}),R=n({className:i(`${L}-content truncate`,N?.text),textAlign:"start",...A&&{columnGap:m,display:"flex",alignItems:"center",width:"full",justifyContent:"space-between"}}),W=w(()=>({root:n({menuSizeRoot:"default",flexDirection:"row",spacing:r,spacingBottom:e,spacingEnd:d,spacingHorizontal:s,spacingStart:o,spacingTop:u,spacingVertical:l,columnGap:m,alignItems:C,justifyContent:k,className:i(P,N?.root)}),startIcon:n({menuSizeStartIcon:"default",className:N?.startIcon}),endIcon:n({menuSizeEndIcon:"default",className:N?.endIcon})}),[C,m,k,N?.endIcon,N?.root,N?.startIcon,P,r,e,d,s,o,u,l]);return M(g,{ref:z,name:I??"",...T,render:V?.root??(r=>j(a,{...r,...O})),disabled:v,className:W.root,children:[M(t,{gap:m,alignItems:"center",width:"full",children:[j(E,{initial:!1,children:b&&j(S.span,{variants:X,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-start-icon",children:j(c,{icon:b,className:W.startIcon,iconProps:{size:"sm",variant:_?"fill":"outline",color:"current"}})})}),j("span",{className:R,children:p})]}),j(E,{initial:!1,mode:"popLayout",children:!f&&h&&j(S.span,{variants:X,initial:"hidden",animate:"visible",exit:"hidden",className:"uds-end-icon",children:j(c,{icon:h,className:W.endIcon,iconProps:{size:"sm",variant:_?"fill":"outline",color:"current"}})})})]})});J.displayName="MenuItemBase";var K=v(function({active:r,hideOnClick:e,...a},d){const t={root:n({menuItemVariantRoot:"default",menuItemVariantActiveRoot:r?"on":"off"}),text:n({menuItemVariantText:"default",menuItemVariantActiveText:r?"on":"off"}),startIcon:n({menuItemVariantIcon:"default",menuItemVariantActiveIcon:r?"on":"off"})};return j(J,{ref:d,as:p,active:r,layerClassNames:t,rootProps:{hideOnClick:e},...a})});K.displayName="MenuItem";var q=v(function({name:r,endIcon:a=e,checked:d,defaultChecked:t,hideOnClick:s,className:c,...o},u){const l=r,x=C(!1),p=m(),b=T(p);I(()=>{!x.current&&void 0!==t&&p&&(p.setValues(r=>({...r,[l]:t})),x.current=!0)},[p,t,l]);const f=w(()=>{if(void 0!==d)return d;if(b?.items?.length){const r=b?.items.find(r=>r.element?.name===l);if(r?.element)return r.element.checked}const r=b?.values[l];return"boolean"==typeof r?r:t??!1},[b?.items,b?.values,l,d,t]),_=k(r=>{void 0===d&&p?.setValues(e=>({...e,[l]:r.target.checked}))},[l,p,d]),v={root:n({menuItemCheckboxVariantRoot:"default",menuItemCheckboxVariantActiveRoot:f?"on":"off"}),text:n({menuItemCheckboxVariantText:"default",menuItemCheckboxVariantActiveText:f?"on":"off"}),startIcon:n({menuItemCheckboxVariantStartIcon:"default",menuItemCheckboxVariantActiveStartIcon:f?"on":"off"}),endIcon:n({menuItemCheckboxVariantEndIcon:"default",menuItemCheckboxVariantActiveEndIcon:f?"on":"off"})};return j(J,{ref:u,as:h,hideEndIcon:!f,endIcon:a,active:f,className:i("uds-menu-item-checkbox",c),layerClassNames:v,name:r,rootProps:{onChange:_,defaultChecked:t,checked:void 0!==d?d:void 0,hideOnClick:s},...o})});q.displayName="MenuItemCheckbox";var Q=()=>{if("undefined"==typeof document)return!1;return"rtl"===getComputedStyle(document.documentElement).direction},U=r=>{const[e,a]=g(Q);return I(()=>{if(r?.explicit)return void a(r.explicit);const e=(r=>{const e=new MutationObserver(e=>{e.some(r=>"attributes"===r.type&&"dir"===r.attributeName)&&r()});return e.observe(document.documentElement,{attributes:!0,attributeFilter:["dir"]}),e})(()=>{a(Q())});return()=>e.disconnect()},[r?.explicit]),e},Y=function({placement:r="bottom",rtl:e,...a}){const d=U({explicit:e}),t=((r,e)=>{const a=e?.rtl;if("start"===r)return a?"right":"left";if("end"===r)return a?"left":"right";if(r?.includes("-")){const[e,d]=r.split("-");if(!("start"!==e&&"end"!==e||"top"!==d&&"bottom"!==d))return`${"start"===e?a?"right":"left":a?"left":"right"}-${"bottom"===d?"end":"start"}`;if("top"===e||"bottom"===e)return`${e}-${"start"===d?a?"end":"start":a?"start":"end"}`}return r})(r,{rtl:d});return j(s,{children:j(b,{placement:t,rtl:d,...a})})},Z=v(function({asChild:r,children:e,className:a,...d},t){const s=C(null),n=r?{render:j(o,{asChild:!0,ref:s,className:"uds-ring h-fit w-fit",children:e})}:{children:e},c=k(()=>{const r=s.current?.firstChild;r instanceof HTMLElement&&"function"==typeof r.focus&&r.focus()},[s]);return j(f,{onFocus:c,onFocusVisible:c,ref:t,className:i("uds-menu-trigger",a),...n,...d})});export{O as Menu};
|