@swan-io/lake 2.0.1 → 2.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/lake",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "engines": {
     "node": ">=14.0.0",
     "yarn": "^1.20.0"
@@ -27,11 +27,11 @@
   "license": "MIT",
   "dependencies": {
     "@popperjs/core": "^2.11.7",
-    "@swan-io/boxed": "^1.0.1",
-    "@swan-io/chicane": "^1.3.4",
+    "@swan-io/boxed": "^1.0.2",
+    "@swan-io/chicane": "^1.4.0",
     "dayjs": "^1.11.7",
     "polished": "^4.2.2",
-    "prism-react-renderer": "^1.3.5",
+    "prism-react-renderer": "^2.0.4",
     "react": "^18.2.0",
     "react-atomic-state": "^1.2.7",
     "react-dom": "^18.2.0",
@@ -45,11 +45,11 @@
     "uuid": "^9.0.0"
   },
   "devDependencies": {
-    "@types/react": "^18.2.6",
+    "@types/react": "^18.2.7",
     "@types/react-dom": "^18.2.4",
-    "@types/react-native": "^0.71.6",
+    "@types/react-native": "^0.72.1",
     "@types/uuid": "^9.0.1",
     "jsdom": "^22.0.0",
-    "type-fest": "^3.10.0"
+    "type-fest": "^3.11.0"
   }
 }

package/src/components/AutoWidthImage.d.ts

@@ -19,10 +19,17 @@ export declare const AutoWidthImage: import("react").MemoExoticComponent<import(
     borderBottomRightRadius?: number | undefined;
     resizeMode?: import("react-native").ImageResizeMode | undefined;
     resizeMethod?: "auto" | "resize" | "scale" | undefined;
+    src?: string | undefined;
+    srcSet?: string | undefined;
     loadingIndicatorSource?: import("react-native").ImageURISource | undefined;
     testID?: string | undefined;
     nativeID?: string | undefined;
     alt?: string | undefined;
+    height?: number | undefined;
+    width?: number | undefined;
+    crossOrigin?: "anonymous" | "use-credentials" | undefined;
+    tintColor?: import("react-native").ColorValue | undefined;
+    referrerPolicy?: "no-referrer" | "no-referrer-when-downgrade" | "origin" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url" | undefined;
     blurRadius?: number | undefined;
     capInsets?: import("react-native").Insets | undefined;
     onProgress?: ((event: import("react-native").NativeSyntheticEvent<import("react-native").ImageProgressEventDataIOS>) => void) | undefined;
@@ -55,12 +62,14 @@ export declare const AutoWidthImage: import("react").MemoExoticComponent<import(
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;

package/src/components/FixedListViewCells.js

@@ -108,9 +108,7 @@ export const SimpleHeaderCell = ({ text, sort, justifyContent = "flex-start", on
 export const ColorPatchCell = ({ isHovered, alternativeText, color, }) => {
     return isHovered ? (_jsx(View, { style: [styles.colorPatch, { backgroundColor: colors[color].primary }], children: isNotNullish(alternativeText) ? (_jsx(LakeText, { style: styles.alternativeText, children: alternativeText })) : null })) : null;
 };
-export const SimpleTitleCell = ({ isHighlighted = false, text, }) => (_jsx(View, { style: styles.cell, children: _jsx(LakeText, { numberOfLines: 1, color: colors.gray[900], variant: "medium", ...(isHighlighted && {
-            color: colors.current.primary,
-        }), children: text }) }));
+export const SimpleTitleCell = ({ isHighlighted = false, text, }) => (_jsx(View, { style: styles.cell, children: _jsx(LakeText, { numberOfLines: 1, color: isHighlighted ? colors.current.primary : colors.gray[900], style: styles.regularText, variant: "medium", children: text }) }));
 export const SimpleRegularTextCell = ({ variant = "regular", text, textAlign = "left", }) => {
     return (_jsx(View, { style: styles.cell, children: _jsx(LakeText, { align: textAlign, color: colors.gray[900], style: styles.regularText, variant: variant, children: text }) }));
 };

package/src/components/Form.d.ts

@@ -82,12 +82,14 @@ export declare const Form: import("react").MemoExoticComponent<import("react").F
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;

package/src/components/Heading.d.ts

@@ -72,8 +72,10 @@ export declare const Heading: import("react").ForwardRefExoticComponent<{
     hrefAttrs?: import("react-native").HrefAttrs | undefined;
     lang?: string | undefined;
     adjustsFontSizeToFit?: boolean | undefined;
+    dynamicTypeRamp?: "body" | "caption2" | "caption1" | "footnote" | "subheadline" | "callout" | "headline" | "title3" | "title2" | "title1" | "largeTitle" | undefined;
     minimumFontScale?: number | undefined;
     suppressHighlighting?: boolean | undefined;
+    lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined;
     disabled?: boolean | undefined;
     selectable?: boolean | undefined;
     selectionColor?: import("react-native").ColorValue | undefined;
@@ -107,12 +109,14 @@ export declare const Heading: import("react").ForwardRefExoticComponent<{
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;

package/src/components/LakeHeading.d.ts

@@ -21,8 +21,10 @@ export declare const LakeHeading: import("react").ForwardRefExoticComponent<{
     hrefAttrs?: import("react-native").HrefAttrs | undefined;
     lang?: string | undefined;
     adjustsFontSizeToFit?: boolean | undefined;
+    dynamicTypeRamp?: "body" | "caption2" | "caption1" | "footnote" | "subheadline" | "callout" | "headline" | "title3" | "title2" | "title1" | "largeTitle" | undefined;
     minimumFontScale?: number | undefined;
     suppressHighlighting?: boolean | undefined;
+    lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined;
     disabled?: boolean | undefined;
     selectable?: boolean | undefined;
     selectionColor?: import("react-native").ColorValue | undefined;
@@ -56,12 +58,14 @@ export declare const LakeHeading: import("react").ForwardRefExoticComponent<{
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;

package/src/components/LakeTextInput.d.ts

@@ -27,7 +27,6 @@ export type LakeTextInputProps = Except<TextInputProps, "editable" | "keyboardTy
 export declare const LakeTextInput: import("react").ForwardRefExoticComponent<{
     allowFontScaling?: boolean | undefined;
     autoCapitalize?: "none" | "sentences" | "words" | "characters" | undefined;
-    autoComplete?: "off" | "name" | "email" | "tel" | "url" | "additional-name" | "address-line1" | "address-line2" | "birthdate-day" | "birthdate-full" | "birthdate-month" | "birthdate-year" | "cc-csc" | "cc-exp" | "cc-exp-day" | "cc-exp-month" | "cc-exp-year" | "cc-number" | "country" | "current-password" | "family-name" | "gender" | "given-name" | "honorific-prefix" | "honorific-suffix" | "name-family" | "name-given" | "name-middle" | "name-middle-initial" | "name-prefix" | "name-suffix" | "new-password" | "nickname" | "one-time-code" | "organization" | "organization-title" | "password" | "password-new" | "postal-address" | "postal-address-country" | "postal-address-extended" | "postal-address-extended-postal-code" | "postal-address-locality" | "postal-address-region" | "postal-code" | "street-address" | "sms-otp" | "tel-country-code" | "tel-national" | "tel-device" | "username" | "username-new" | undefined;
     autoCorrect?: boolean | undefined;
     autoFocus?: boolean | undefined;
     blurOnSubmit?: boolean | undefined;
@@ -68,6 +67,7 @@ export declare const LakeTextInput: import("react").ForwardRefExoticComponent<{
     role?: import("react-native").WebRole | undefined;
     lang?: string | undefined;
     initialValue?: string | undefined;
+    autoComplete?: "off" | "name" | "email" | "tel" | "url" | "additional-name" | "address-level1" | "address-level2" | "address-level3" | "address-level4" | "address-line1" | "address-line2" | "address-line3" | "bday" | "bday-day" | "bday-month" | "bday-year" | "cc-additional-name" | "cc-csc" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-family-name" | "cc-given-name" | "cc-name" | "cc-number" | "cc-type" | "country" | "country-name" | "current-password" | "family-name" | "given-name" | "honorific-prefix" | "honorific-suffix" | "impp" | "language" | "new-password" | "nickname" | "on" | "one-time-code" | "organization" | "organization-title" | "postal-code" | "sex" | "street-address" | "tel-area-code" | "tel-country-code" | "tel-extension" | "tel-local" | "tel-national" | "transaction-amount" | "transaction-currency" | "username" | undefined;
     enterKeyHint?: "enter" | "search" | "done" | "go" | "next" | "send" | "previous" | undefined;
     rows?: number | undefined;
     readOnly?: boolean | undefined;
@@ -150,12 +150,14 @@ export declare const LakeTextInput: import("react").ForwardRefExoticComponent<{
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;
@@ -197,8 +199,9 @@ export declare const LakeTextInput: import("react").ForwardRefExoticComponent<{
     rejectResponderTermination?: boolean | null | undefined;
     selectionState?: import("react-native").DocumentSelectionState | undefined;
     spellCheck?: boolean | undefined;
-    textContentType?: "none" | "location" | "name" | "nickname" | "password" | "username" | "URL" | "addressCity" | "addressCityAndState" | "addressState" | "countryName" | "creditCardNumber" | "emailAddress" | "familyName" | "fullStreetAddress" | "givenName" | "jobTitle" | "middleName" | "namePrefix" | "nameSuffix" | "organizationName" | "postalCode" | "streetAddressLine1" | "streetAddressLine2" | "sublocality" | "telephoneNumber" | "newPassword" | "oneTimeCode" | undefined;
+    textContentType?: "none" | "location" | "name" | "nickname" | "username" | "URL" | "addressCity" | "addressCityAndState" | "addressState" | "countryName" | "creditCardNumber" | "emailAddress" | "familyName" | "fullStreetAddress" | "givenName" | "jobTitle" | "middleName" | "namePrefix" | "nameSuffix" | "organizationName" | "postalCode" | "streetAddressLine1" | "streetAddressLine2" | "sublocality" | "telephoneNumber" | "password" | "newPassword" | "oneTimeCode" | undefined;
     scrollEnabled?: boolean | undefined;
+    lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined;
     cursorColor?: import("react-native").ColorValue | null | undefined;
     importantForAutofill?: "auto" | "yes" | "no" | "noExcludeDescendants" | "yesExcludeDescendants" | undefined;
     disableFullscreenUI?: boolean | undefined;

package/src/components/LakeTooltip.d.ts

@@ -12,6 +12,7 @@ type Props = {
     width?: number;
     togglableOnFocus?: boolean;
     containerStyle?: ViewStyle;
+    disabled?: boolean;
 };
 type TooltipRef = {
     show: () => void;

package/src/components/LakeTooltip.js

@@ -5,7 +5,7 @@ import { usePopper } from "react-popper";
 import { match } from "ts-pattern";
 import { colors, shadows } from "../constants/design";
 import { useHover } from "../hooks/useHover";
-import { isNullish } from "../utils/nullish";
+import { isNotNullish } from "../utils/nullish";
 import { getRootElement, matchReferenceWidthModifier } from "../utils/popper";
 import { Icon } from "./Icon";
 import { LakeText } from "./LakeText";
@@ -83,7 +83,7 @@ const styles = StyleSheet.create({
 });
 const isReactText = (node) => ["string", "number"].includes(typeof node);
 const MAX_WIDTH = "calc(100vw - 20px)";
-export const LakeTooltip = memo(forwardRef(({ children, content, describedBy, matchReferenceWidth = false, hideArrow = false, onHide, onShow, placement, width, togglableOnFocus = false, containerStyle, }, forwardedRef) => {
+export const LakeTooltip = memo(forwardRef(({ children, content, describedBy, matchReferenceWidth = false, hideArrow = false, onHide, onShow, placement, width, togglableOnFocus = false, containerStyle, disabled = false, }, forwardedRef) => {
     const referenceRef = useRef(null);
     const rootElement = getRootElement(referenceRef.current);
     const [popperElement, setPopperElement] = useState(null);
@@ -157,7 +157,7 @@ export const LakeTooltip = memo(forwardRef(({ children, content, describedBy, ma
         void update?.();
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [content]);
-    return (_jsxs(_Fragment, { children: [_jsx(View, { ref: referenceRef, style: containerStyle, children: children }), isNullish(rootElement) || !visible ? null : (_jsx(Portal, { container: rootElement, children: _jsx("div", { ref: setPopperElement, style: { ...popperStyles.popper, maxWidth: MAX_WIDTH }, ...attributes.popper, role: "tooltip", "aria-describedby": describedBy, children: _jsxs(View, { style: [
+    return (_jsxs(_Fragment, { children: [_jsx(View, { ref: referenceRef, style: containerStyle, children: children }), isNotNullish(rootElement) && visible && !disabled && (_jsx(Portal, { container: rootElement, children: _jsx("div", { ref: setPopperElement, style: { ...popperStyles.popper, maxWidth: MAX_WIDTH }, ...attributes.popper, role: "tooltip", "aria-describedby": describedBy, children: _jsxs(View, { style: [
                             styles.base,
                             state?.placement === "top" && styles.baseTop,
                             state?.placement === "bottom" && styles.baseBottom,

package/src/components/Link.d.ts

@@ -31,8 +31,10 @@ export declare const Link: import("react").MemoExoticComponent<import("react").F
     href?: string | undefined;
     lang?: string | undefined;
     adjustsFontSizeToFit?: boolean | undefined;
+    dynamicTypeRamp?: "body" | "caption2" | "caption1" | "footnote" | "subheadline" | "callout" | "headline" | "title3" | "title2" | "title1" | "largeTitle" | undefined;
     minimumFontScale?: number | undefined;
     suppressHighlighting?: boolean | undefined;
+    lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined;
     selectable?: boolean | undefined;
     selectionColor?: import("react-native").ColorValue | undefined;
     textBreakStrategy?: "simple" | "highQuality" | "balanced" | undefined;
@@ -65,12 +67,14 @@ export declare const Link: import("react").MemoExoticComponent<import("react").F
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;

package/src/components/Pressable.d.ts

@@ -56,8 +56,10 @@ export declare const PressableText: FC<{
     hrefAttrs?: import("react-native").HrefAttrs | undefined;
     lang?: string | undefined;
     adjustsFontSizeToFit?: boolean | undefined;
+    dynamicTypeRamp?: "body" | "caption2" | "caption1" | "footnote" | "subheadline" | "callout" | "headline" | "title3" | "title2" | "title1" | "largeTitle" | undefined;
     minimumFontScale?: number | undefined;
     suppressHighlighting?: boolean | undefined;
+    lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined;
     selectable?: boolean | undefined;
     selectionColor?: import("react-native").ColorValue | undefined;
     textBreakStrategy?: "simple" | "highQuality" | "balanced" | undefined;
@@ -90,12 +92,14 @@ export declare const PressableText: FC<{
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;
@@ -154,7 +158,6 @@ export declare const PressableText: FC<{
 export declare const PressableTextInput: FC<{
     allowFontScaling?: boolean | undefined;
     autoCapitalize?: "none" | "sentences" | "words" | "characters" | undefined;
-    autoComplete?: "off" | "name" | "email" | "tel" | "url" | "additional-name" | "address-line1" | "address-line2" | "birthdate-day" | "birthdate-full" | "birthdate-month" | "birthdate-year" | "cc-csc" | "cc-exp" | "cc-exp-day" | "cc-exp-month" | "cc-exp-year" | "cc-number" | "country" | "current-password" | "family-name" | "gender" | "given-name" | "honorific-prefix" | "honorific-suffix" | "name-family" | "name-given" | "name-middle" | "name-middle-initial" | "name-prefix" | "name-suffix" | "new-password" | "nickname" | "one-time-code" | "organization" | "organization-title" | "password" | "password-new" | "postal-address" | "postal-address-country" | "postal-address-extended" | "postal-address-extended-postal-code" | "postal-address-locality" | "postal-address-region" | "postal-code" | "street-address" | "sms-otp" | "tel-country-code" | "tel-national" | "tel-device" | "username" | "username-new" | undefined;
     autoCorrect?: boolean | undefined;
     autoFocus?: boolean | undefined;
     blurOnSubmit?: boolean | undefined;
@@ -191,6 +194,7 @@ export declare const PressableTextInput: FC<{
     role?: import("react-native").WebRole | undefined;
     lang?: string | undefined;
     initialValue?: string | undefined;
+    autoComplete?: "off" | "name" | "email" | "tel" | "url" | "additional-name" | "address-level1" | "address-level2" | "address-level3" | "address-level4" | "address-line1" | "address-line2" | "address-line3" | "bday" | "bday-day" | "bday-month" | "bday-year" | "cc-additional-name" | "cc-csc" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-family-name" | "cc-given-name" | "cc-name" | "cc-number" | "cc-type" | "country" | "country-name" | "current-password" | "family-name" | "given-name" | "honorific-prefix" | "honorific-suffix" | "impp" | "language" | "new-password" | "nickname" | "on" | "one-time-code" | "organization" | "organization-title" | "postal-code" | "sex" | "street-address" | "tel-area-code" | "tel-country-code" | "tel-extension" | "tel-local" | "tel-national" | "transaction-amount" | "transaction-currency" | "username" | undefined;
     enterKeyHint?: "enter" | "search" | "done" | "go" | "next" | "send" | "previous" | undefined;
     rows?: number | undefined;
     readOnly?: boolean | undefined;
@@ -270,12 +274,14 @@ export declare const PressableTextInput: FC<{
     'aria-live'?: "polite" | "assertive" | "off" | undefined;
     'aria-modal'?: boolean | undefined;
     accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
+    accessibilityLabelledBy?: string | string[] | undefined;
     accessibilityElementsHidden?: boolean | undefined;
     accessibilityViewIsModal?: boolean | undefined;
     onAccessibilityEscape?: (() => void) | undefined;
     onAccessibilityTap?: (() => void) | undefined;
     onMagicTap?: (() => void) | undefined;
     accessibilityIgnoresInvertColors?: boolean | undefined;
+    accessibilityLanguage?: string | undefined;
     tabIndex?: 0 | -1 | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: boolean | undefined;
@@ -317,8 +323,9 @@ export declare const PressableTextInput: FC<{
     rejectResponderTermination?: boolean | null | undefined;
     selectionState?: import("react-native").DocumentSelectionState | undefined;
     spellCheck?: boolean | undefined;
-    textContentType?: "none" | "location" | "name" | "nickname" | "password" | "username" | "URL" | "addressCity" | "addressCityAndState" | "addressState" | "countryName" | "creditCardNumber" | "emailAddress" | "familyName" | "fullStreetAddress" | "givenName" | "jobTitle" | "middleName" | "namePrefix" | "nameSuffix" | "organizationName" | "postalCode" | "streetAddressLine1" | "streetAddressLine2" | "sublocality" | "telephoneNumber" | "newPassword" | "oneTimeCode" | undefined;
+    textContentType?: "none" | "location" | "name" | "nickname" | "username" | "URL" | "addressCity" | "addressCityAndState" | "addressState" | "countryName" | "creditCardNumber" | "emailAddress" | "familyName" | "fullStreetAddress" | "givenName" | "jobTitle" | "middleName" | "namePrefix" | "nameSuffix" | "organizationName" | "postalCode" | "streetAddressLine1" | "streetAddressLine2" | "sublocality" | "telephoneNumber" | "password" | "newPassword" | "oneTimeCode" | undefined;
     scrollEnabled?: boolean | undefined;
+    lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined;
     cursorColor?: import("react-native").ColorValue | null | undefined;
     importantForAutofill?: "auto" | "yes" | "no" | "noExcludeDescendants" | "yesExcludeDescendants" | undefined;
     disableFullscreenUI?: boolean | undefined;

package/src/components/QuickActions.d.ts

@@ -9,6 +9,8 @@ export type QuickAction = {
 };
 type Props = {
     actions: QuickAction[];
+    tooltipDisabled?: boolean;
+    tooltipText?: string;
 };
-export declare const QuickActions: ({ actions }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const QuickActions: ({ actions, tooltipDisabled, tooltipText }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/src/components/QuickActions.js

@@ -1,8 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ActivityIndicator, StyleSheet, View } from "react-native";
 import { colors, spacings } from "../constants/design";
+import { isNullishOrEmpty } from "../utils/nullish";
 import { Icon } from "./Icon";
 import { LakeText } from "./LakeText";
+import { LakeTooltip } from "./LakeTooltip";
 import { Pressable } from "./Pressable";
 import { Space } from "./Space";
 const styles = StyleSheet.create({
@@ -24,15 +26,21 @@ const styles = StyleSheet.create({
         paddingHorizontal: spacings[12],
         flexBasis: "30%",
     },
+    disabled: {
+        alignItems: "center",
+        paddingHorizontal: spacings[12],
+        flexBasis: "30%",
+        opacity: 0.4,
+    },
     label: {
         lineHeight: 16,
     },
 });
-export const QuickActions = ({ actions }) => {
-    return (_jsx(View, { style: styles.container, children: actions.map((action, index) => (_jsxs(Pressable, { onPress: action.onPress, style: styles.action, disabled: action.isLoading === true, children: [_jsx(View, { style: [
-                        styles.icon,
-                        action.backgroundColor != null
-                            ? { backgroundColor: action.backgroundColor, borderColor: action.backgroundColor }
-                            : null,
-                    ], children: action.isLoading === true ? (_jsx(ActivityIndicator, { color: action.color ?? colors.gray[300], size: 16 })) : (_jsx(Icon, { name: action.icon, size: 16, color: action.color ?? colors.gray[300] })) }), _jsx(Space, { height: 8 }), _jsx(LakeText, { variant: "smallRegular", align: "center", style: styles.label, children: action.label })] }, index))) }));
+export const QuickActions = ({ actions, tooltipDisabled = false, tooltipText }) => {
+    return (_jsx(View, { style: styles.container, children: actions.map((action, index) => (_jsx(LakeTooltip, { content: tooltipText, placement: "top", disabled: tooltipDisabled || isNullishOrEmpty(tooltipText), children: _jsxs(Pressable, { onPress: action.onPress, style: tooltipDisabled ? styles.action : styles.disabled, disabled: action.isLoading === true || !tooltipDisabled, children: [_jsx(View, { style: [
+                            styles.icon,
+                            action.backgroundColor != null
+                                ? { backgroundColor: action.backgroundColor, borderColor: action.backgroundColor }
+                                : null,
+                        ], children: action.isLoading === true ? (_jsx(ActivityIndicator, { color: action.color ?? colors.gray[300], size: 16 })) : (_jsx(Icon, { name: action.icon, size: 16, color: action.color ?? colors.gray[300] })) }), _jsx(Space, { height: 8 }), _jsx(LakeText, { variant: "smallRegular", align: "center", style: styles.label, children: action.label })] }, index) }, index))) }));
 };

package/src/utils/__tests__/rifm.test.js

@@ -20,15 +20,15 @@ test('it respects accept: "alpha" param', async () => {
         return (_jsx(Rifm, { ...props, value: value, onChange: setValue, children: ({ value, onChange }) => _jsx("input", { type: "text", value: value, onChange: onChange }) }));
     };
     const utils = render(_jsx(Test, {}));
-    const input = await utils.findByRole("textbox");
+    const input = (await utils.findByRole("textbox"));
     typeInInput(input, "test");
-    expect(input).toHaveValue("te st/");
+    expect(input.value).toBe("te st/");
     clearInput(input);
     typeInInput(input, "1234");
-    expect(input).toHaveValue("");
+    expect(input.value).toBe("");
     clearInput(input);
     typeInInput(input, "te34");
-    expect(input).toHaveValue("te ");
+    expect(input.value).toBe("te ");
     clearInput(input);
 });
 test('it respects accept: "numeric" param', async () => {
@@ -42,15 +42,15 @@ test('it respects accept: "numeric" param', async () => {
         return (_jsx(Rifm, { ...props, value: value, onChange: setValue, children: ({ value, onChange }) => _jsx("input", { type: "text", value: value, onChange: onChange }) }));
     };
     const utils = render(_jsx(Test, {}));
-    const input = await utils.findByRole("textbox");
+    const input = (await utils.findByRole("textbox"));
     typeInInput(input, "test");
-    expect(input).toHaveValue("");
+    expect(input.value).toBe("");
     clearInput(input);
     typeInInput(input, "1234");
-    expect(input).toHaveValue("12 34/");
+    expect(input.value).toBe("12 34/");
     clearInput(input);
     typeInInput(input, "te34");
-    expect(input).toHaveValue("34 ");
+    expect(input.value).toBe("34 ");
     clearInput(input);
 });
 test('it respects accept: "alphanumeric" param', async () => {
@@ -64,18 +64,18 @@ test('it respects accept: "alphanumeric" param', async () => {
         return (_jsx(Rifm, { ...props, value: value, onChange: setValue, children: ({ value, onChange }) => _jsx("input", { type: "text", value: value, onChange: onChange }) }));
     };
     const utils = render(_jsx(Test, {}));
-    const input = await utils.findByRole("textbox");
+    const input = (await utils.findByRole("textbox"));
     typeInInput(input, "test");
-    expect(input).toHaveValue("te st/");
+    expect(input.value).toBe("te st/");
     clearInput(input);
     typeInInput(input, "1234");
-    expect(input).toHaveValue("12 34/");
+    expect(input.value).toBe("12 34/");
     clearInput(input);
     typeInInput(input, "te34");
-    expect(input).toHaveValue("te 34/");
+    expect(input.value).toBe("te 34/");
     clearInput(input);
     typeInInput(input, "t__4");
-    expect(input).toHaveValue("t4 ");
+    expect(input.value).toBe("t4 ");
     clearInput(input);
 });
 test("it appends characters at given indexes", async () => {
@@ -89,15 +89,15 @@ test("it appends characters at given indexes", async () => {
         return (_jsx(Rifm, { ...props, value: value, onChange: setValue, children: ({ value, onChange }) => _jsx("input", { type: "text", value: value, onChange: onChange }) }));
     };
     const utils = render(_jsx(Test, {}));
-    const input = await utils.findByRole("textbox");
+    const input = (await utils.findByRole("textbox"));
     typeInInput(input, "12");
-    expect(input).toHaveValue("12 ");
+    expect(input.value).toBe("12 ");
     clearInput(input);
     typeInInput(input, "1234");
-    expect(input).toHaveValue("12 34/");
+    expect(input.value).toBe("12 34/");
     clearInput(input);
     typeInInput(input, "123456");
-    expect(input).toHaveValue("12 34/56");
+    expect(input.value).toBe("12 34/56");
     clearInput(input);
 });
 test("it truncates the formatted text to the maximum length", async () => {
@@ -111,14 +111,14 @@ test("it truncates the formatted text to the maximum length", async () => {
         return (_jsx(Rifm, { ...props, value: value, onChange: setValue, children: ({ value, onChange }) => _jsx("input", { type: "text", value: value, onChange: onChange }) }));
     };
     const utils = render(_jsx(Test, {}));
-    const input = await utils.findByRole("textbox");
+    const input = (await utils.findByRole("textbox"));
     typeInInput(input, "1234");
-    expect(input).toHaveValue("12 34/");
+    expect(input.value).toBe("12 34/");
     clearInput(input);
     typeInInput(input, "123456");
-    expect(input).toHaveValue("12 34/56");
+    expect(input.value).toBe("12 34/56");
     clearInput(input);
     typeInInput(input, "12345678");
-    expect(input).toHaveValue("12 34/56");
+    expect(input.value).toBe("12 34/56");
     clearInput(input);
 });