@metamask/design-system-react 0.20.0 → 0.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +14 -1
- package/dist/components/AvatarGroup/AvatarGroup.cjs +18 -13
- package/dist/components/AvatarGroup/AvatarGroup.cjs.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.constants.cjs +16 -17
- package/dist/components/AvatarGroup/AvatarGroup.constants.cjs.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.constants.d.cts +1 -2
- package/dist/components/AvatarGroup/AvatarGroup.constants.d.cts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.constants.d.mts +1 -2
- package/dist/components/AvatarGroup/AvatarGroup.constants.d.mts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.constants.mjs +1 -2
- package/dist/components/AvatarGroup/AvatarGroup.constants.mjs.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.d.cts +8 -21
- package/dist/components/AvatarGroup/AvatarGroup.d.cts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.d.mts +8 -21
- package/dist/components/AvatarGroup/AvatarGroup.d.mts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.mjs +9 -4
- package/dist/components/AvatarGroup/AvatarGroup.mjs.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.cjs.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.d.cts +7 -24
- package/dist/components/AvatarGroup/AvatarGroup.types.d.cts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.d.mts +7 -24
- package/dist/components/AvatarGroup/AvatarGroup.types.d.mts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.mjs.map +1 -1
- package/dist/components/AvatarGroup/index.cjs +3 -3
- package/dist/components/AvatarGroup/index.cjs.map +1 -1
- package/dist/components/AvatarGroup/index.d.cts +1 -1
- package/dist/components/AvatarGroup/index.d.cts.map +1 -1
- package/dist/components/AvatarGroup/index.d.mts +1 -1
- package/dist/components/AvatarGroup/index.d.mts.map +1 -1
- package/dist/components/AvatarGroup/index.mjs +1 -1
- package/dist/components/AvatarGroup/index.mjs.map +1 -1
- package/dist/components/Icon/icons/Merge.cjs +32 -0
- package/dist/components/Icon/icons/Merge.cjs.map +1 -0
- package/dist/components/Icon/icons/Merge.d.cts +4 -0
- package/dist/components/Icon/icons/Merge.d.cts.map +1 -0
- package/dist/components/Icon/icons/Merge.d.mts +4 -0
- package/dist/components/Icon/icons/Merge.d.mts.map +1 -0
- package/dist/components/Icon/icons/Merge.mjs +7 -0
- package/dist/components/Icon/icons/Merge.mjs.map +1 -0
- package/dist/components/Icon/icons/index.cjs +2 -0
- package/dist/components/Icon/icons/index.cjs.map +1 -1
- package/dist/components/Icon/icons/index.d.cts +1 -0
- package/dist/components/Icon/icons/index.d.cts.map +1 -1
- package/dist/components/Icon/icons/index.d.mts +1 -0
- package/dist/components/Icon/icons/index.d.mts.map +1 -1
- package/dist/components/Icon/icons/index.mjs +2 -0
- package/dist/components/Icon/icons/index.mjs.map +1 -1
- package/dist/components/Input/Input.cjs +4 -3
- package/dist/components/Input/Input.cjs.map +1 -1
- package/dist/components/Input/Input.d.cts +1 -5
- package/dist/components/Input/Input.d.cts.map +1 -1
- package/dist/components/Input/Input.d.mts +1 -5
- package/dist/components/Input/Input.d.mts.map +1 -1
- package/dist/components/Input/Input.mjs +4 -3
- package/dist/components/Input/Input.mjs.map +1 -1
- package/dist/components/Input/Input.types.cjs.map +1 -1
- package/dist/components/Input/Input.types.d.cts +2 -20
- package/dist/components/Input/Input.types.d.cts.map +1 -1
- package/dist/components/Input/Input.types.d.mts +2 -20
- package/dist/components/Input/Input.types.d.mts.map +1 -1
- package/dist/components/Input/Input.types.mjs.map +1 -1
- package/dist/components/ModalBody/ModalBody.cjs +32 -0
- package/dist/components/ModalBody/ModalBody.cjs.map +1 -0
- package/dist/components/ModalBody/ModalBody.d.cts +4 -0
- package/dist/components/ModalBody/ModalBody.d.cts.map +1 -0
- package/dist/components/ModalBody/ModalBody.d.mts +4 -0
- package/dist/components/ModalBody/ModalBody.d.mts.map +1 -0
- package/dist/components/ModalBody/ModalBody.mjs +13 -0
- package/dist/components/ModalBody/ModalBody.mjs.map +1 -0
- package/dist/components/ModalBody/ModalBody.types.cjs +3 -0
- package/dist/components/ModalBody/ModalBody.types.cjs.map +1 -0
- package/dist/components/ModalBody/ModalBody.types.d.cts +13 -0
- package/dist/components/ModalBody/ModalBody.types.d.cts.map +1 -0
- package/dist/components/ModalBody/ModalBody.types.d.mts +13 -0
- package/dist/components/ModalBody/ModalBody.types.d.mts.map +1 -0
- package/dist/components/ModalBody/ModalBody.types.mjs +2 -0
- package/dist/components/ModalBody/ModalBody.types.mjs.map +1 -0
- package/dist/components/ModalBody/index.cjs +6 -0
- package/dist/components/ModalBody/index.cjs.map +1 -0
- package/dist/components/ModalBody/index.d.cts +3 -0
- package/dist/components/ModalBody/index.d.cts.map +1 -0
- package/dist/components/ModalBody/index.d.mts +3 -0
- package/dist/components/ModalBody/index.d.mts.map +1 -0
- package/dist/components/ModalBody/index.mjs +2 -0
- package/dist/components/ModalBody/index.mjs.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.cjs +56 -0
- package/dist/components/ModalFocus/ModalFocus.cjs.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.d.cts +4 -0
- package/dist/components/ModalFocus/ModalFocus.d.cts.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.d.mts +4 -0
- package/dist/components/ModalFocus/ModalFocus.d.mts.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.mjs +34 -0
- package/dist/components/ModalFocus/ModalFocus.mjs.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.types.cjs +3 -0
- package/dist/components/ModalFocus/ModalFocus.types.cjs.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.types.d.cts +36 -0
- package/dist/components/ModalFocus/ModalFocus.types.d.cts.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.types.d.mts +36 -0
- package/dist/components/ModalFocus/ModalFocus.types.d.mts.map +1 -0
- package/dist/components/ModalFocus/ModalFocus.types.mjs +2 -0
- package/dist/components/ModalFocus/ModalFocus.types.mjs.map +1 -0
- package/dist/components/ModalFocus/index.cjs +6 -0
- package/dist/components/ModalFocus/index.cjs.map +1 -0
- package/dist/components/ModalFocus/index.d.cts +3 -0
- package/dist/components/ModalFocus/index.d.cts.map +1 -0
- package/dist/components/ModalFocus/index.d.mts +3 -0
- package/dist/components/ModalFocus/index.d.mts.map +1 -0
- package/dist/components/ModalFocus/index.mjs +2 -0
- package/dist/components/ModalFocus/index.mjs.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.cjs +44 -0
- package/dist/components/ModalFooter/ModalFooter.cjs.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.d.cts +4 -0
- package/dist/components/ModalFooter/ModalFooter.d.cts.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.d.mts +4 -0
- package/dist/components/ModalFooter/ModalFooter.d.mts.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.mjs +25 -0
- package/dist/components/ModalFooter/ModalFooter.mjs.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.types.cjs +14 -0
- package/dist/components/ModalFooter/ModalFooter.types.cjs.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.types.d.cts +63 -0
- package/dist/components/ModalFooter/ModalFooter.types.d.cts.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.types.d.mts +63 -0
- package/dist/components/ModalFooter/ModalFooter.types.d.mts.map +1 -0
- package/dist/components/ModalFooter/ModalFooter.types.mjs +11 -0
- package/dist/components/ModalFooter/ModalFooter.types.mjs.map +1 -0
- package/dist/components/ModalFooter/index.cjs +8 -0
- package/dist/components/ModalFooter/index.cjs.map +1 -0
- package/dist/components/ModalFooter/index.d.cts +4 -0
- package/dist/components/ModalFooter/index.d.cts.map +1 -0
- package/dist/components/ModalFooter/index.d.mts +4 -0
- package/dist/components/ModalFooter/index.d.mts.map +1 -0
- package/dist/components/ModalFooter/index.mjs +3 -0
- package/dist/components/ModalFooter/index.mjs.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.cjs +32 -0
- package/dist/components/ModalOverlay/ModalOverlay.cjs.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.d.cts +4 -0
- package/dist/components/ModalOverlay/ModalOverlay.d.cts.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.d.mts +4 -0
- package/dist/components/ModalOverlay/ModalOverlay.d.mts.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.mjs +13 -0
- package/dist/components/ModalOverlay/ModalOverlay.mjs.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.cjs +3 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.cjs.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.d.cts +9 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.d.cts.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.d.mts +9 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.d.mts.map +1 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.mjs +2 -0
- package/dist/components/ModalOverlay/ModalOverlay.types.mjs.map +1 -0
- package/dist/components/ModalOverlay/index.cjs +6 -0
- package/dist/components/ModalOverlay/index.cjs.map +1 -0
- package/dist/components/ModalOverlay/index.d.cts +3 -0
- package/dist/components/ModalOverlay/index.d.cts.map +1 -0
- package/dist/components/ModalOverlay/index.d.mts +3 -0
- package/dist/components/ModalOverlay/index.d.mts.map +1 -0
- package/dist/components/ModalOverlay/index.mjs +2 -0
- package/dist/components/ModalOverlay/index.mjs.map +1 -0
- package/dist/components/index.cjs +10 -1
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.d.cts +8 -0
- package/dist/components/index.d.cts.map +1 -1
- package/dist/components/index.d.mts +8 -0
- package/dist/components/index.d.mts.map +1 -1
- package/dist/components/index.mjs +4 -0
- package/dist/components/index.mjs.map +1 -1
- package/dist/types/index.cjs +3 -15
- package/dist/types/index.cjs.map +1 -1
- package/dist/types/index.d.cts +0 -10
- package/dist/types/index.d.cts.map +1 -1
- package/dist/types/index.d.mts +0 -10
- package/dist/types/index.d.mts.map +1 -1
- package/dist/types/index.mjs +0 -11
- package/dist/types/index.mjs.map +1 -1
- package/package.json +5 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yEAA6D;AAC7D,+CAA0C;AAE1C,uDAA+C;AAC/C,+DAGgC;AAInB,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,WAAW,GAAG,kCAAW,CAAC,MAAM,EAChC,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,IAAA,kBAAO,EAC7B,8EAA8E,EAC9E,
|
|
1
|
+
{"version":3,"file":"Input.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,yEAA6D;AAC7D,+CAA0C;AAE1C,uDAA+C;AAC/C,+DAGgC;AAInB,QAAA,KAAK,GAAG,IAAA,kBAAU,EAC7B,CACE,EACE,WAAW,GAAG,kCAAW,CAAC,MAAM,EAChC,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,qBAAqB,GAAG,KAAK,EAC7B,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,IAAA,kBAAO,EAC7B,8EAA8E,EAC9E,oBAAoB,EACpB,CAAC,qBAAqB;QACpB,iDAAiD,EACnD,8BAA8B,EAC9B,kDAAiC,CAAC,WAAW,CAAC,EAC9C,mDAAkC,CAAC,WAAW,CAAC,EAC/C,CAAC,qBAAqB,IAAI,UAAU,IAAI,+BAA+B,EACvE,SAAS,CACV,CAAC;IAEF,OAAO,CACL,yCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,KAAK,KACR,IAAI,EACR,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,GACpB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import { TextVariant } from '@metamask/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE,\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n textVariant = TextVariant.BodyMd,\n isDisabled = false,\n isReadOnly = false,\n isStateStylesDisabled = false,\n className,\n style,\n ...rest\n },\n ref,\n ) => {\n const mergedClassName = twMerge(\n 'w-full rounded border bg-default text-default outline-none transition-colors',\n 'border-transparent',\n !isStateStylesDisabled &&\n 'focus:border-primary-default focus:outline-none',\n 'placeholder:text-alternative',\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[textVariant],\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant],\n !isStateStylesDisabled && isDisabled && 'cursor-not-allowed opacity-50',\n className,\n );\n\n return (\n <input\n ref={ref}\n className={mergedClassName}\n style={style}\n {...rest}\n disabled={isDisabled}\n readOnly={isReadOnly}\n />\n );\n },\n);\n\nInput.displayName = 'Input';\n"]}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
import { TextVariant } from "@metamask/design-system-shared";
|
|
2
1
|
import React from "react";
|
|
3
|
-
export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "disabled" | "readOnly"> & {
|
|
4
|
-
textVariant?: TextVariant | undefined;
|
|
5
|
-
isDisabled?: boolean | undefined;
|
|
6
|
-
isReadonly?: boolean | undefined;
|
|
2
|
+
export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "value" | "disabled" | "readOnly" | "defaultValue"> & import("@metamask/design-system-shared").InputPropsShared & {
|
|
7
3
|
className?: string | undefined;
|
|
8
4
|
style?: React.CSSProperties | undefined;
|
|
9
5
|
} & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Input.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,cAAc;AAU1C,eAAO,MAAM,KAAK;;;0CAoCjB,CAAC"}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
import { TextVariant } from "@metamask/design-system-shared";
|
|
2
1
|
import React from "react";
|
|
3
|
-
export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "disabled" | "readOnly"> & {
|
|
4
|
-
textVariant?: TextVariant | undefined;
|
|
5
|
-
isDisabled?: boolean | undefined;
|
|
6
|
-
isReadonly?: boolean | undefined;
|
|
2
|
+
export declare const Input: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "value" | "disabled" | "readOnly" | "defaultValue"> & import("@metamask/design-system-shared").InputPropsShared & {
|
|
7
3
|
className?: string | undefined;
|
|
8
4
|
style?: React.CSSProperties | undefined;
|
|
9
5
|
} & React.RefAttributes<HTMLInputElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Input.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAqB,cAAc;AAU1C,eAAO,MAAM,KAAK;;;0CAoCjB,CAAC"}
|
|
@@ -9,9 +9,10 @@ import $React, { forwardRef } from "react";
|
|
|
9
9
|
const React = $importDefault($React);
|
|
10
10
|
import { twMerge } from "../../utils/tw-merge.mjs";
|
|
11
11
|
import { TWCLASSMAP_TEXT_VARIANT_FONTSTYLE, TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT } from "../Text/Text.constants.mjs";
|
|
12
|
-
export const Input = forwardRef(({ textVariant = TextVariant.BodyMd, isDisabled = false,
|
|
13
|
-
const mergedClassName = twMerge('w-full rounded border bg-default text-default outline-none transition-colors', 'border-transparent
|
|
14
|
-
|
|
12
|
+
export const Input = forwardRef(({ textVariant = TextVariant.BodyMd, isDisabled = false, isReadOnly = false, isStateStylesDisabled = false, className, style, ...rest }, ref) => {
|
|
13
|
+
const mergedClassName = twMerge('w-full rounded border bg-default text-default outline-none transition-colors', 'border-transparent', !isStateStylesDisabled &&
|
|
14
|
+
'focus:border-primary-default focus:outline-none', 'placeholder:text-alternative', TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[textVariant], TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant], !isStateStylesDisabled && isDisabled && 'cursor-not-allowed opacity-50', className);
|
|
15
|
+
return (React.createElement("input", { ref: ref, className: mergedClassName, style: style, ...rest, disabled: isDisabled, readOnly: isReadOnly }));
|
|
15
16
|
});
|
|
16
17
|
Input.displayName = 'Input';
|
|
17
18
|
//# sourceMappingURL=Input.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,uCAAuC;AAC7D,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EACL,iCAAiC,EACjC,kCAAkC,EACnC,mCAA+B;AAIhC,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EACE,WAAW,GAAG,WAAW,CAAC,MAAM,EAChC,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,OAAO,CAC7B,8EAA8E,EAC9E,
|
|
1
|
+
{"version":3,"file":"Input.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,WAAW,EAAE,uCAAuC;AAC7D,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EACL,iCAAiC,EACjC,kCAAkC,EACnC,mCAA+B;AAIhC,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EACE,WAAW,GAAG,WAAW,CAAC,MAAM,EAChC,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,qBAAqB,GAAG,KAAK,EAC7B,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EACD,GAAG,EACH,EAAE;IACF,MAAM,eAAe,GAAG,OAAO,CAC7B,8EAA8E,EAC9E,oBAAoB,EACpB,CAAC,qBAAqB;QACpB,iDAAiD,EACnD,8BAA8B,EAC9B,iCAAiC,CAAC,WAAW,CAAC,EAC9C,kCAAkC,CAAC,WAAW,CAAC,EAC/C,CAAC,qBAAqB,IAAI,UAAU,IAAI,+BAA+B,EACvE,SAAS,CACV,CAAC;IAEF,OAAO,CACL,+BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,KAAK,KACR,IAAI,EACR,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,GACpB,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC","sourcesContent":["import { TextVariant } from '@metamask/design-system-shared';\nimport React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport {\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE,\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT,\n} from '../Text/Text.constants';\n\nimport type { InputProps } from './Input.types';\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n (\n {\n textVariant = TextVariant.BodyMd,\n isDisabled = false,\n isReadOnly = false,\n isStateStylesDisabled = false,\n className,\n style,\n ...rest\n },\n ref,\n ) => {\n const mergedClassName = twMerge(\n 'w-full rounded border bg-default text-default outline-none transition-colors',\n 'border-transparent',\n !isStateStylesDisabled &&\n 'focus:border-primary-default focus:outline-none',\n 'placeholder:text-alternative',\n TWCLASSMAP_TEXT_VARIANT_FONTSTYLE[textVariant],\n TWCLASSMAP_TEXT_VARIANT_FONTWEIGHT[textVariant],\n !isStateStylesDisabled && isDisabled && 'cursor-not-allowed opacity-50',\n className,\n );\n\n return (\n <input\n ref={ref}\n className={mergedClassName}\n style={style}\n {...rest}\n disabled={isDisabled}\n readOnly={isReadOnly}\n />\n );\n },\n);\n\nInput.displayName = 'Input';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"Input.types.cjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { InputPropsShared } from '@metamask/design-system-shared';\nimport type { ComponentPropsWithoutRef } from 'react';\n\nexport type InputProps = Omit<\n ComponentPropsWithoutRef<'input'>,\n 'defaultValue' | 'disabled' | 'readOnly' | 'value'\n> &\n InputPropsShared & {\n /**\n * Optional prop for additional CSS classes.\n */\n className?: string;\n /**\n * Optional inline styles.\n */\n style?: React.CSSProperties;\n };\n"]}
|
|
@@ -1,24 +1,6 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { InputPropsShared } from "@metamask/design-system-shared";
|
|
2
2
|
import type { ComponentPropsWithoutRef } from "react";
|
|
3
|
-
export type InputProps = Omit<ComponentPropsWithoutRef<'input'>, 'disabled' | 'readOnly'> & {
|
|
4
|
-
/**
|
|
5
|
-
* Optional enum to select between Typography variants.
|
|
6
|
-
*
|
|
7
|
-
* @default TextVariant.BodyMd
|
|
8
|
-
*/
|
|
9
|
-
textVariant?: TextVariant;
|
|
10
|
-
/**
|
|
11
|
-
* Optional boolean to disable Input.
|
|
12
|
-
*
|
|
13
|
-
* @default false
|
|
14
|
-
*/
|
|
15
|
-
isDisabled?: boolean;
|
|
16
|
-
/**
|
|
17
|
-
* Optional boolean to show readonly input.
|
|
18
|
-
*
|
|
19
|
-
* @default false
|
|
20
|
-
*/
|
|
21
|
-
isReadonly?: boolean;
|
|
3
|
+
export type InputProps = Omit<ComponentPropsWithoutRef<'input'>, 'defaultValue' | 'disabled' | 'readOnly' | 'value'> & InputPropsShared & {
|
|
22
4
|
/**
|
|
23
5
|
* Optional prop for additional CSS classes.
|
|
24
6
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Input.types.d.cts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,uCAAuC;AACvE,OAAO,KAAK,EAAE,wBAAwB,EAAE,cAAc;AAEtD,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,wBAAwB,CAAC,OAAO,CAAC,EACjC,cAAc,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CACnD,GACC,gBAAgB,GAAG;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}
|
|
@@ -1,24 +1,6 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { InputPropsShared } from "@metamask/design-system-shared";
|
|
2
2
|
import type { ComponentPropsWithoutRef } from "react";
|
|
3
|
-
export type InputProps = Omit<ComponentPropsWithoutRef<'input'>, 'disabled' | 'readOnly'> & {
|
|
4
|
-
/**
|
|
5
|
-
* Optional enum to select between Typography variants.
|
|
6
|
-
*
|
|
7
|
-
* @default TextVariant.BodyMd
|
|
8
|
-
*/
|
|
9
|
-
textVariant?: TextVariant;
|
|
10
|
-
/**
|
|
11
|
-
* Optional boolean to disable Input.
|
|
12
|
-
*
|
|
13
|
-
* @default false
|
|
14
|
-
*/
|
|
15
|
-
isDisabled?: boolean;
|
|
16
|
-
/**
|
|
17
|
-
* Optional boolean to show readonly input.
|
|
18
|
-
*
|
|
19
|
-
* @default false
|
|
20
|
-
*/
|
|
21
|
-
isReadonly?: boolean;
|
|
3
|
+
export type InputProps = Omit<ComponentPropsWithoutRef<'input'>, 'defaultValue' | 'disabled' | 'readOnly' | 'value'> & InputPropsShared & {
|
|
22
4
|
/**
|
|
23
5
|
* Optional prop for additional CSS classes.
|
|
24
6
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"Input.types.d.mts","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,uCAAuC;AACvE,OAAO,KAAK,EAAE,wBAAwB,EAAE,cAAc;AAEtD,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,wBAAwB,CAAC,OAAO,CAAC,EACjC,cAAc,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CACnD,GACC,gBAAgB,GAAG;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.types.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"Input.types.mjs","sourceRoot":"","sources":["../../../src/components/Input/Input.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { InputPropsShared } from '@metamask/design-system-shared';\nimport type { ComponentPropsWithoutRef } from 'react';\n\nexport type InputProps = Omit<\n ComponentPropsWithoutRef<'input'>,\n 'defaultValue' | 'disabled' | 'readOnly' | 'value'\n> &\n InputPropsShared & {\n /**\n * Optional prop for additional CSS classes.\n */\n className?: string;\n /**\n * Optional inline styles.\n */\n style?: React.CSSProperties;\n };\n"]}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
exports.ModalBody = void 0;
|
|
27
|
+
const react_1 = __importStar(require("react"));
|
|
28
|
+
const tw_merge_1 = require("../../utils/tw-merge.cjs");
|
|
29
|
+
const Box_1 = require("../Box/index.cjs");
|
|
30
|
+
exports.ModalBody = (0, react_1.forwardRef)(({ className, children, tabIndex = 0, ...props }, ref) => (react_1.default.createElement(Box_1.Box, { ref: ref, paddingHorizontal: 4, tabIndex: tabIndex, className: (0, tw_merge_1.twMerge)('relative max-h-full overflow-y-auto', className), ...props }, children)));
|
|
31
|
+
exports.ModalBody.displayName = 'ModalBody';
|
|
32
|
+
//# sourceMappingURL=ModalBody.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.cjs","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,uDAA+C;AAC/C,0CAA6B;AAIhB,QAAA,SAAS,GAAG,IAAA,kBAAU,EACjC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,GAAG,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACxD,8BAAC,SAAG,IACF,GAAG,EAAE,GAAG,EACR,iBAAiB,EAAE,CAAC,EACpB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,IAAA,kBAAO,EAAC,qCAAqC,EAAE,SAAS,CAAC,KAChE,KAAK,IAER,QAAQ,CACL,CACP,CACF,CAAC;AAEF,iBAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Box } from '../Box';\n\nimport type { ModalBodyProps } from './ModalBody.types';\n\nexport const ModalBody = forwardRef<HTMLDivElement, ModalBodyProps>(\n ({ className, children, tabIndex = 0, ...props }, ref) => (\n <Box\n ref={ref}\n paddingHorizontal={4}\n tabIndex={tabIndex}\n className={twMerge('relative max-h-full overflow-y-auto', className)}\n {...props}\n >\n {children}\n </Box>\n ),\n);\n\nModalBody.displayName = 'ModalBody';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.d.cts","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS,oGAYrB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.d.mts","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,cAAc;AAK1C,OAAO,KAAK,EAAE,cAAc,EAAE,8BAA0B;AAExD,eAAO,MAAM,SAAS,oGAYrB,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
function $importDefault(module) {
|
|
2
|
+
if (module?.__esModule) {
|
|
3
|
+
return module.default;
|
|
4
|
+
}
|
|
5
|
+
return module;
|
|
6
|
+
}
|
|
7
|
+
import $React, { forwardRef } from "react";
|
|
8
|
+
const React = $importDefault($React);
|
|
9
|
+
import { twMerge } from "../../utils/tw-merge.mjs";
|
|
10
|
+
import { Box } from "../Box/index.mjs";
|
|
11
|
+
export const ModalBody = forwardRef(({ className, children, tabIndex = 0, ...props }, ref) => (React.createElement(Box, { ref: ref, paddingHorizontal: 4, tabIndex: tabIndex, className: twMerge('relative max-h-full overflow-y-auto', className), ...props }, children)));
|
|
12
|
+
ModalBody.displayName = 'ModalBody';
|
|
13
|
+
//# sourceMappingURL=ModalBody.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.mjs","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,UAAU,EAAE,cAAc;;AAE1C,OAAO,EAAE,OAAO,EAAE,iCAA6B;AAC/C,OAAO,EAAE,GAAG,EAAE,yBAAe;AAI7B,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,GAAG,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACxD,oBAAC,GAAG,IACF,GAAG,EAAE,GAAG,EACR,iBAAiB,EAAE,CAAC,EACpB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,OAAO,CAAC,qCAAqC,EAAE,SAAS,CAAC,KAChE,KAAK,IAER,QAAQ,CACL,CACP,CACF,CAAC;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC","sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { twMerge } from '../../utils/tw-merge';\nimport { Box } from '../Box';\n\nimport type { ModalBodyProps } from './ModalBody.types';\n\nexport const ModalBody = forwardRef<HTMLDivElement, ModalBodyProps>(\n ({ className, children, tabIndex = 0, ...props }, ref) => (\n <Box\n ref={ref}\n paddingHorizontal={4}\n tabIndex={tabIndex}\n className={twMerge('relative max-h-full overflow-y-auto', className)}\n {...props}\n >\n {children}\n </Box>\n ),\n);\n\nModalBody.displayName = 'ModalBody';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.types.cjs","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nexport type ModalBodyProps = ComponentProps<'div'> & {\n /**\n * The content of the ModalBody.\n */\n children?: ReactNode;\n /**\n * Optional prop for additional CSS classes to be applied to the ModalBody component.\n * These classes will be merged with the component's default classes using twMerge.\n */\n className?: string;\n};\n"]}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { ComponentProps, ReactNode } from "react";
|
|
2
|
+
export type ModalBodyProps = ComponentProps<'div'> & {
|
|
3
|
+
/**
|
|
4
|
+
* The content of the ModalBody.
|
|
5
|
+
*/
|
|
6
|
+
children?: ReactNode;
|
|
7
|
+
/**
|
|
8
|
+
* Optional prop for additional CSS classes to be applied to the ModalBody component.
|
|
9
|
+
* These classes will be merged with the component's default classes using twMerge.
|
|
10
|
+
*/
|
|
11
|
+
className?: string;
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=ModalBody.types.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.types.d.cts","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,cAAc;AAEvD,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACnD;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { ComponentProps, ReactNode } from "react";
|
|
2
|
+
export type ModalBodyProps = ComponentProps<'div'> & {
|
|
3
|
+
/**
|
|
4
|
+
* The content of the ModalBody.
|
|
5
|
+
*/
|
|
6
|
+
children?: ReactNode;
|
|
7
|
+
/**
|
|
8
|
+
* Optional prop for additional CSS classes to be applied to the ModalBody component.
|
|
9
|
+
* These classes will be merged with the component's default classes using twMerge.
|
|
10
|
+
*/
|
|
11
|
+
className?: string;
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=ModalBody.types.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.types.d.mts","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,cAAc;AAEvD,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACnD;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalBody.types.mjs","sourceRoot":"","sources":["../../../src/components/ModalBody/ModalBody.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ReactNode } from 'react';\n\nexport type ModalBodyProps = ComponentProps<'div'> & {\n /**\n * The content of the ModalBody.\n */\n children?: ReactNode;\n /**\n * Optional prop for additional CSS classes to be applied to the ModalBody component.\n * These classes will be merged with the component's default classes using twMerge.\n */\n className?: string;\n};\n"]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ModalBody = void 0;
|
|
4
|
+
var ModalBody_1 = require("./ModalBody.cjs");
|
|
5
|
+
Object.defineProperty(exports, "ModalBody", { enumerable: true, get: function () { return ModalBody_1.ModalBody; } });
|
|
6
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ModalBody/index.ts"],"names":[],"mappings":";;;AAAA,6CAAwC;AAA/B,sGAAA,SAAS,OAAA","sourcesContent":["export { ModalBody } from './ModalBody';\nexport type { ModalBodyProps } from './ModalBody.types';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ModalBody/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,wBAAoB;AACxC,YAAY,EAAE,cAAc,EAAE,8BAA0B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.mts","sourceRoot":"","sources":["../../../src/components/ModalBody/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,wBAAoB;AACxC,YAAY,EAAE,cAAc,EAAE,8BAA0B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.mjs","sourceRoot":"","sources":["../../../src/components/ModalBody/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,wBAAoB","sourcesContent":["export { ModalBody } from './ModalBody';\nexport type { ModalBodyProps } from './ModalBody.types';\n"]}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
+
};
|
|
28
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
+
exports.ModalFocus = void 0;
|
|
30
|
+
const react_1 = __importStar(require("react"));
|
|
31
|
+
const react_focus_lock_1 = __importDefault(require("react-focus-lock"));
|
|
32
|
+
/**
|
|
33
|
+
* Based on the ModalFocusScope component from chakra-ui:
|
|
34
|
+
* https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/modal/src/modal-focus.tsx
|
|
35
|
+
*/
|
|
36
|
+
// `react-focus-lock` ships dual ESM/CJS builds; depending on the consumer's
|
|
37
|
+
// bundler interop, the default export can land as either the component itself
|
|
38
|
+
// or wrapped under `.default`. This picks whichever one is callable.
|
|
39
|
+
const FocusTrap =
|
|
40
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
41
|
+
react_focus_lock_1.default.default ?? react_focus_lock_1.default;
|
|
42
|
+
const ModalFocus = ({ initialFocusRef, finalFocusRef, restoreFocus, children, autoFocus, ...props }) => {
|
|
43
|
+
const onActivation = (0, react_1.useCallback)(() => {
|
|
44
|
+
if (initialFocusRef?.current) {
|
|
45
|
+
initialFocusRef.current.focus();
|
|
46
|
+
}
|
|
47
|
+
}, [initialFocusRef]);
|
|
48
|
+
const onDeactivation = (0, react_1.useCallback)(() => {
|
|
49
|
+
finalFocusRef?.current?.focus();
|
|
50
|
+
}, [finalFocusRef]);
|
|
51
|
+
const returnFocus = restoreFocus && !finalFocusRef;
|
|
52
|
+
return (react_1.default.createElement(FocusTrap, { autoFocus: autoFocus, onActivation: onActivation, onDeactivation: onDeactivation, returnFocus: returnFocus, ...props }, children));
|
|
53
|
+
};
|
|
54
|
+
exports.ModalFocus = ModalFocus;
|
|
55
|
+
exports.ModalFocus.displayName = 'ModalFocus';
|
|
56
|
+
//# sourceMappingURL=ModalFocus.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.cjs","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA2C;AAC3C,wEAA8C;AAI9C;;;GAGG;AAEH,4EAA4E;AAC5E,8EAA8E;AAC9E,qEAAqE;AACrE,MAAM,SAAS;AACb,8DAA8D;AAC7D,0BAAsB,CAAC,OAAO,IAAI,0BAAc,CAAC;AAE7C,MAAM,UAAU,GAA8B,CAAC,EACpD,eAAe,EACf,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,YAAY,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACpC,IAAI,eAAe,EAAE,OAAO,EAAE;YAC5B,eAAe,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SACjC;IACH,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,MAAM,cAAc,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACtC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IAClC,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,WAAW,GAAG,YAAY,IAAI,CAAC,aAAa,CAAC;IAEnD,OAAO,CACL,8BAAC,SAAS,IACR,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,KACpB,KAAK,IAER,QAAQ,CACC,CACb,CAAC;AACJ,CAAC,CAAC;AA/BW,QAAA,UAAU,cA+BrB;AAEF,kBAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { useCallback } from 'react';\nimport ReactFocusLock from 'react-focus-lock';\n\nimport type { ModalFocusProps } from './ModalFocus.types';\n\n/**\n * Based on the ModalFocusScope component from chakra-ui:\n * https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/modal/src/modal-focus.tsx\n */\n\n// `react-focus-lock` ships dual ESM/CJS builds; depending on the consumer's\n// bundler interop, the default export can land as either the component itself\n// or wrapped under `.default`. This picks whichever one is callable.\nconst FocusTrap: typeof ReactFocusLock =\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (ReactFocusLock as any).default ?? ReactFocusLock;\n\nexport const ModalFocus: React.FC<ModalFocusProps> = ({\n initialFocusRef,\n finalFocusRef,\n restoreFocus,\n children,\n autoFocus,\n ...props\n}) => {\n const onActivation = useCallback(() => {\n if (initialFocusRef?.current) {\n initialFocusRef.current.focus();\n }\n }, [initialFocusRef]);\n\n const onDeactivation = useCallback(() => {\n finalFocusRef?.current?.focus();\n }, [finalFocusRef]);\n\n const returnFocus = restoreFocus && !finalFocusRef;\n\n return (\n <FocusTrap\n autoFocus={autoFocus}\n onActivation={onActivation}\n onDeactivation={onDeactivation}\n returnFocus={returnFocus}\n {...props}\n >\n {children}\n </FocusTrap>\n );\n};\n\nModalFocus.displayName = 'ModalFocus';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.d.cts","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,cAAc;AAG3C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAc1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA+BhD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.d.mts","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,cAAc;AAG3C,OAAO,KAAK,EAAE,eAAe,EAAE,+BAA2B;AAc1D,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA+BhD,CAAC"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
function $importDefault(module) {
|
|
2
|
+
if (module?.__esModule) {
|
|
3
|
+
return module.default;
|
|
4
|
+
}
|
|
5
|
+
return module;
|
|
6
|
+
}
|
|
7
|
+
import $React, { useCallback } from "react";
|
|
8
|
+
const React = $importDefault($React);
|
|
9
|
+
import $ReactFocusLock from "react-focus-lock";
|
|
10
|
+
const ReactFocusLock = $importDefault($ReactFocusLock);
|
|
11
|
+
/**
|
|
12
|
+
* Based on the ModalFocusScope component from chakra-ui:
|
|
13
|
+
* https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/modal/src/modal-focus.tsx
|
|
14
|
+
*/
|
|
15
|
+
// `react-focus-lock` ships dual ESM/CJS builds; depending on the consumer's
|
|
16
|
+
// bundler interop, the default export can land as either the component itself
|
|
17
|
+
// or wrapped under `.default`. This picks whichever one is callable.
|
|
18
|
+
const FocusTrap =
|
|
19
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
20
|
+
ReactFocusLock.default ?? ReactFocusLock;
|
|
21
|
+
export const ModalFocus = ({ initialFocusRef, finalFocusRef, restoreFocus, children, autoFocus, ...props }) => {
|
|
22
|
+
const onActivation = useCallback(() => {
|
|
23
|
+
if (initialFocusRef?.current) {
|
|
24
|
+
initialFocusRef.current.focus();
|
|
25
|
+
}
|
|
26
|
+
}, [initialFocusRef]);
|
|
27
|
+
const onDeactivation = useCallback(() => {
|
|
28
|
+
finalFocusRef?.current?.focus();
|
|
29
|
+
}, [finalFocusRef]);
|
|
30
|
+
const returnFocus = restoreFocus && !finalFocusRef;
|
|
31
|
+
return (React.createElement(FocusTrap, { autoFocus: autoFocus, onActivation: onActivation, onDeactivation: onDeactivation, returnFocus: returnFocus, ...props }, children));
|
|
32
|
+
};
|
|
33
|
+
ModalFocus.displayName = 'ModalFocus';
|
|
34
|
+
//# sourceMappingURL=ModalFocus.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.mjs","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.tsx"],"names":[],"mappings":";;;;;;AAAA,OAAO,QAAO,EAAE,WAAW,EAAE,cAAc;;AAC3C,OAAO,eAAc,yBAAyB;;AAI9C;;;GAGG;AAEH,4EAA4E;AAC5E,8EAA8E;AAC9E,qEAAqE;AACrE,MAAM,SAAS;AACb,8DAA8D;AAC7D,cAAsB,CAAC,OAAO,IAAI,cAAc,CAAC;AAEpD,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EACpD,eAAe,EACf,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QACpC,IAAI,eAAe,EAAE,OAAO,EAAE;YAC5B,eAAe,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SACjC;IACH,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE;QACtC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;IAClC,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,WAAW,GAAG,YAAY,IAAI,CAAC,aAAa,CAAC;IAEnD,OAAO,CACL,oBAAC,SAAS,IACR,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,KACpB,KAAK,IAER,QAAQ,CACC,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC","sourcesContent":["import React, { useCallback } from 'react';\nimport ReactFocusLock from 'react-focus-lock';\n\nimport type { ModalFocusProps } from './ModalFocus.types';\n\n/**\n * Based on the ModalFocusScope component from chakra-ui:\n * https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/modal/src/modal-focus.tsx\n */\n\n// `react-focus-lock` ships dual ESM/CJS builds; depending on the consumer's\n// bundler interop, the default export can land as either the component itself\n// or wrapped under `.default`. This picks whichever one is callable.\nconst FocusTrap: typeof ReactFocusLock =\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (ReactFocusLock as any).default ?? ReactFocusLock;\n\nexport const ModalFocus: React.FC<ModalFocusProps> = ({\n initialFocusRef,\n finalFocusRef,\n restoreFocus,\n children,\n autoFocus,\n ...props\n}) => {\n const onActivation = useCallback(() => {\n if (initialFocusRef?.current) {\n initialFocusRef.current.focus();\n }\n }, [initialFocusRef]);\n\n const onDeactivation = useCallback(() => {\n finalFocusRef?.current?.focus();\n }, [finalFocusRef]);\n\n const returnFocus = restoreFocus && !finalFocusRef;\n\n return (\n <FocusTrap\n autoFocus={autoFocus}\n onActivation={onActivation}\n onDeactivation={onDeactivation}\n returnFocus={returnFocus}\n {...props}\n >\n {children}\n </FocusTrap>\n );\n};\n\nModalFocus.displayName = 'ModalFocus';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.types.cjs","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode, RefObject } from 'react';\n\nexport type FocusableElement = {\n focus(options?: FocusOptions): void;\n};\n\nexport type ModalFocusProps = {\n /**\n * The `ref` of the element to receive focus initially.\n */\n initialFocusRef?: RefObject<FocusableElement>;\n /**\n * The `ref` of the element to return focus to when `ModalFocus`\n * unmounts.\n */\n finalFocusRef?: RefObject<FocusableElement>;\n /**\n * If `true`, focus will be restored to the element that\n * triggered the `ModalFocus` once it unmounts.\n *\n * Ignored when `finalFocusRef` is provided.\n *\n * @default false\n */\n restoreFocus?: boolean;\n /**\n * The node to lock focus to.\n */\n children: ReactNode;\n /**\n * If `true`, the first focusable element within `children`\n * will be auto-focused once `ModalFocus` mounts.\n *\n * @default true\n */\n autoFocus?: boolean;\n};\n"]}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import type { ReactNode, RefObject } from "react";
|
|
2
|
+
export type FocusableElement = {
|
|
3
|
+
focus(options?: FocusOptions): void;
|
|
4
|
+
};
|
|
5
|
+
export type ModalFocusProps = {
|
|
6
|
+
/**
|
|
7
|
+
* The `ref` of the element to receive focus initially.
|
|
8
|
+
*/
|
|
9
|
+
initialFocusRef?: RefObject<FocusableElement>;
|
|
10
|
+
/**
|
|
11
|
+
* The `ref` of the element to return focus to when `ModalFocus`
|
|
12
|
+
* unmounts.
|
|
13
|
+
*/
|
|
14
|
+
finalFocusRef?: RefObject<FocusableElement>;
|
|
15
|
+
/**
|
|
16
|
+
* If `true`, focus will be restored to the element that
|
|
17
|
+
* triggered the `ModalFocus` once it unmounts.
|
|
18
|
+
*
|
|
19
|
+
* Ignored when `finalFocusRef` is provided.
|
|
20
|
+
*
|
|
21
|
+
* @default false
|
|
22
|
+
*/
|
|
23
|
+
restoreFocus?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* The node to lock focus to.
|
|
26
|
+
*/
|
|
27
|
+
children: ReactNode;
|
|
28
|
+
/**
|
|
29
|
+
* If `true`, the first focusable element within `children`
|
|
30
|
+
* will be auto-focused once `ModalFocus` mounts.
|
|
31
|
+
*
|
|
32
|
+
* @default true
|
|
33
|
+
*/
|
|
34
|
+
autoFocus?: boolean;
|
|
35
|
+
};
|
|
36
|
+
//# sourceMappingURL=ModalFocus.types.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.types.d.cts","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,cAAc;AAElD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC9C;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import type { ReactNode, RefObject } from "react";
|
|
2
|
+
export type FocusableElement = {
|
|
3
|
+
focus(options?: FocusOptions): void;
|
|
4
|
+
};
|
|
5
|
+
export type ModalFocusProps = {
|
|
6
|
+
/**
|
|
7
|
+
* The `ref` of the element to receive focus initially.
|
|
8
|
+
*/
|
|
9
|
+
initialFocusRef?: RefObject<FocusableElement>;
|
|
10
|
+
/**
|
|
11
|
+
* The `ref` of the element to return focus to when `ModalFocus`
|
|
12
|
+
* unmounts.
|
|
13
|
+
*/
|
|
14
|
+
finalFocusRef?: RefObject<FocusableElement>;
|
|
15
|
+
/**
|
|
16
|
+
* If `true`, focus will be restored to the element that
|
|
17
|
+
* triggered the `ModalFocus` once it unmounts.
|
|
18
|
+
*
|
|
19
|
+
* Ignored when `finalFocusRef` is provided.
|
|
20
|
+
*
|
|
21
|
+
* @default false
|
|
22
|
+
*/
|
|
23
|
+
restoreFocus?: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* The node to lock focus to.
|
|
26
|
+
*/
|
|
27
|
+
children: ReactNode;
|
|
28
|
+
/**
|
|
29
|
+
* If `true`, the first focusable element within `children`
|
|
30
|
+
* will be auto-focused once `ModalFocus` mounts.
|
|
31
|
+
*
|
|
32
|
+
* @default true
|
|
33
|
+
*/
|
|
34
|
+
autoFocus?: boolean;
|
|
35
|
+
};
|
|
36
|
+
//# sourceMappingURL=ModalFocus.types.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.types.d.mts","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,cAAc;AAElD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B;;OAEG;IACH,eAAe,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC9C;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ModalFocus.types.mjs","sourceRoot":"","sources":["../../../src/components/ModalFocus/ModalFocus.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode, RefObject } from 'react';\n\nexport type FocusableElement = {\n focus(options?: FocusOptions): void;\n};\n\nexport type ModalFocusProps = {\n /**\n * The `ref` of the element to receive focus initially.\n */\n initialFocusRef?: RefObject<FocusableElement>;\n /**\n * The `ref` of the element to return focus to when `ModalFocus`\n * unmounts.\n */\n finalFocusRef?: RefObject<FocusableElement>;\n /**\n * If `true`, focus will be restored to the element that\n * triggered the `ModalFocus` once it unmounts.\n *\n * Ignored when `finalFocusRef` is provided.\n *\n * @default false\n */\n restoreFocus?: boolean;\n /**\n * The node to lock focus to.\n */\n children: ReactNode;\n /**\n * If `true`, the first focusable element within `children`\n * will be auto-focused once `ModalFocus` mounts.\n *\n * @default true\n */\n autoFocus?: boolean;\n};\n"]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.ModalFocus = void 0;
|
|
4
|
+
var ModalFocus_1 = require("./ModalFocus.cjs");
|
|
5
|
+
Object.defineProperty(exports, "ModalFocus", { enumerable: true, get: function () { return ModalFocus_1.ModalFocus; } });
|
|
6
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sourceRoot":"","sources":["../../../src/components/ModalFocus/index.ts"],"names":[],"mappings":";;;AAAA,+CAA0C;AAAjC,wGAAA,UAAU,OAAA","sourcesContent":["export { ModalFocus } from './ModalFocus';\nexport type { FocusableElement, ModalFocusProps } from './ModalFocus.types';\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/ModalFocus/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,yBAAqB;AAC1C,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,+BAA2B"}
|