@swan-io/lake 2.1.4 → 2.2.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/lake",
-  "version": "2.1.4",
+  "version": "2.2.1",
   "engines": {
     "node": ">=18.0.0",
     "yarn": "^1.22.0"
@@ -31,25 +31,25 @@
     "@swan-io/chicane": "^1.4.0",
     "dayjs": "^1.11.8",
     "polished": "^4.2.2",
-    "prism-react-renderer": "^2.0.4",
+    "prism-react-renderer": "^2.0.5",
     "react": "^18.2.0",
     "react-atomic-state": "^1.2.7",
     "react-dom": "^18.2.0",
-    "react-native-web": "^0.19.4",
+    "react-native-web": "^0.19.5",
     "react-popper": "^2.3.0",
     "react-ux-form": "^1.3.0",
     "rifm": "^0.12.1",
     "ts-dedent": "^2.2.0",
-    "ts-pattern": "^4.3.0",
-    "urql": "^4.0.3",
+    "ts-pattern": "^5.0.1",
+    "urql": "^4.0.4",
     "uuid": "^9.0.0"
   },
   "devDependencies": {
-    "@types/react": "^18.2.8",
-    "@types/react-dom": "^18.2.4",
+    "@types/react": "^18.2.12",
+    "@types/react-dom": "^18.2.5",
     "@types/react-native": "^0.72.2",
-    "@types/uuid": "^9.0.1",
+    "@types/uuid": "^9.0.2",
     "jsdom": "^22.1.0",
-    "type-fest": "^3.11.1"
+    "type-fest": "^3.12.0"
   }
 }

package/src/assets/fonts/RobotoMono.css

@@ -0,0 +1,7 @@
+@font-face {
+  font-family: "Roboto Mono";
+  font-style: normal;
+  font-weight: 400;
+  font-display: block;
+  src: url("RobotoMono-Regular.ttf") format("truetype");
+}

package/src/assets/main.css

@@ -323,6 +323,7 @@ body {
     sans-serif;
   --font-family-card-font: "Inter Card", monospace;
   --font-family-code: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
+  --font-family-iban: "Roboto Mono", monospace;
 
   --heading-color: var(--color-gray-900);
   --heading-line-height: 1.25;

package/src/components/Breadcrumbs.js

@@ -209,8 +209,8 @@ const SHOULD_OPEN = new Set(["Open", "ForcedOpen", "OpenFromFocus"]);
 const SHOULD_LOCK_FOCUS = new Set(["ForcedOpen"]);
 const BreadcrumbsDropdownItems = ({ crumbs }) => {
     const [openingStatus, dispatch] = useReducer((state, action) => {
-        const input = [action, state];
-        return match(input)
+        return match([action, state])
+            .returnType()
             .with(["ForceToggle", "Closed"], ["ForceToggle", "Open"], ["ForceToggle", "ForcedClosed"], () => "ForcedOpen")
             .with(["ForceToggle", "OpenFromFocus"], ["ForceToggle", "ForcedOpen"], () => "ForcedClosed")
             .with(["ForceClose", P._], () => "ForcedClosed")

package/src/components/FixedListViewCells.js

@@ -94,6 +94,7 @@ export const SimpleHeaderCell = ({ text, sort, justifyContent = "flex-start", on
     const sortActive = isNotNullish(sort) && isNotNullish(onPress);
     return (_jsx(Pressable, { onPress: () => {
             onPress?.(match(sort)
+                .returnType()
                 .with("Desc", () => "Asc")
                 .with("Asc", () => "Desc")
                 .otherwise(() => "Desc"));

package/src/components/LakeLabel.js

@@ -41,6 +41,7 @@ export const LakeLabel = ({ label, optionalLabel, extra, readOnly = false, color
         }
     }, [id]);
     return (_jsxs(Box, { style: [styles.container, style], direction: "row", alignItems: "center", justifyContent: "spaceBetween", children: [_jsxs(View, { style: commonStyles.fill, ref: containerRef, children: [_jsxs(Box, { direction: "row", justifyContent: "spaceBetween", alignItems: "center", children: [_jsxs(Box, { direction: "row", style: styles.shrink, children: [type === "form" || type === "formSmall" || type === "radioGroup" ? (_jsxs(Label, { onClick: onClick, htmlFor: id, style: [styles.label, readOnly && { color: readOnlyColor }], children: [label, optionalLabel != null ? (_jsxs(_Fragment, { children: [" - ", _jsx(LakeText, { color: colors.gray[400], style: styles.optionalLabel, children: optionalLabel })] })) : null] })) : (_jsxs(LakeText, { variant: "medium", color: readOnlyColor, id: id, children: [label, optionalLabel != null ? (_jsxs(_Fragment, { children: [" - ", _jsx(LakeText, { color: colors.gray[400], style: styles.optionalLabel, children: optionalLabel })] })) : null] })), isNotNullish(extra) && extra()] }), isNotNullish(help) && (_jsxs(_Fragment, { children: [_jsx(Space, { width: 16 }), help] }))] }), _jsx(Space, { height: match(type)
+                            .returnType()
                             .with("formSmall", "viewSmall", () => 4)
                             .with("form", "view", () => 8)
                             .with("radioGroup", () => 12)

package/src/components/Pressable.d.ts

@@ -132,7 +132,7 @@ export declare const PressableText: FC<{
     "aria-rowspan"?: number | undefined;
     "aria-setsize"?: number | undefined;
     "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
-    children?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactFragment | import("react").ReactPortal | ((state: PressableStateCallbackType) => ReactNode) | null | undefined;
+    children?: string | number | boolean | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | import("react").ReactPortal | ((state: PressableStateCallbackType) => ReactNode) | null | undefined;
     delayLongPress?: number | undefined;
     delayPressIn?: number | undefined;
     delayPressOut?: number | undefined;

package/src/components/TabView.js

@@ -22,7 +22,6 @@ const styles = StyleSheet.create({
     container: {
         borderBottomWidth: 1,
         borderBottomColor: colors.gray[100],
-        backgroundColor: backgroundColor.default,
         zIndex: 10,
     },
     link: {
@@ -117,6 +116,7 @@ const styles = StyleSheet.create({
         backgroundColor: colors.gray[100],
     },
     sticky: {
+        backgroundColor: backgroundColor.default,
         position: "sticky",
         top: -1,
     },
@@ -140,8 +140,8 @@ const SHOULD_OPEN = new Set(["Open", "ForcedOpen", "OpenFromFocus"]);
 const SHOULD_LOCK_FOCUS = new Set(["ForcedOpen"]);
 const DropdownItems = forwardRef(({ tabs, otherLabel, currentUrl }, ref) => {
     const [openingStatus, dispatch] = useReducer((state, action) => {
-        const input = [action, state];
-        return match(input)
+        return match([action, state])
+            .returnType()
             .with(["ForceToggle", "Closed"], ["ForceToggle", "Open"], ["ForceToggle", "ForcedClosed"], () => "ForcedOpen")
             .with(["ForceToggle", "OpenFromFocus"], ["ForceToggle", "ForcedOpen"], () => "ForcedClosed")
             .with(["ForceClose", P.any], () => "ForcedClosed")

package/src/components/ToastStack.js

@@ -56,6 +56,7 @@ const styles = StyleSheet.create({
 const Toast = memo(({ variant, uid, title, description, progress, onClose }) => {
     const progressBarRef = useRef(null);
     const colorVariation = match(variant)
+        .returnType()
         .with("success", () => "positive")
         .with("error", () => "negative")
         .with("info", () => "shakespear")

package/src/constants/design.d.ts

@@ -120,6 +120,7 @@ export declare const fonts: {
     primary: string;
     card: string;
     code: string;
+    iban: string;
 };
 export type Fonts = keyof typeof fonts;
 export type Animation = {

package/src/constants/design.js

@@ -432,6 +432,7 @@ export const fonts = {
     primary: "var(--font-family-primary)",
     card: "var( --font-family-card-font)",
     code: "var(--font-family-code)",
+    iban: "var(--font-family-iban)",
 };
 const easeInOutQuad = "cubic-bezier(0.45, 0, 0.55, 1)";
 const fadeAndSlideInFromTop = StyleSheet.create({

package/src/utils/file.js

@@ -2,6 +2,7 @@ import { match } from "ts-pattern";
 export const getIconNameFromFilename = (filename) => {
     const ext = filename.split(".").pop()?.toLowerCase();
     return match(ext)
+        .returnType()
         .with("png", () => "lake-document-png")
         .with("xls", () => "lake-document-xls")
         .with("pdf", () => "lake-document-pdf")