@ledgerhq/lumen-ui-rnative 0.1.7 → 0.1.9

package/dist/module/lib/Components/Divider/Divider.js

@@ -0,0 +1,50 @@
+"use strict";
+
+import { Box } from "../Utility/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * A simple divider component for separating content sections.
+ *
+ * The Divider renders a horizontal or vertical line to create visual separation
+ * between content areas. It uses design system tokens for consistent styling.
+ *
+ * @see {@link https://ldls.vercel.app/?path=/docs/layout-divider--docs Storybook}
+ *
+ * @example
+ * // Horizontal divider (default)
+ * <Divider />
+ *
+ * @example
+ * // Vertical divider
+ * <Divider orientation="vertical" />
+ *
+ * @example
+ * // With custom styling using lx props
+ * <Divider lx={{ marginVertical: 's16' }} />
+ */
+export const Divider = ({
+  lx = {},
+  orientation = 'horizontal',
+  ref,
+  ...props
+}) => {
+  return /*#__PURE__*/_jsx(Box, {
+    ref: ref,
+    accessibilityRole: "none",
+    lx: {
+      ...(orientation === 'horizontal' ? {
+        alignSelf: 'stretch',
+        borderTopWidth: 's1',
+        borderTopColor: 'mutedSubtle'
+      } : {
+        alignSelf: 'stretch',
+        borderLeftWidth: 's1',
+        borderLeftColor: 'mutedSubtle'
+      }),
+      ...lx
+    },
+    ...props
+  });
+};
+Divider.displayName = 'Divider';
+//# sourceMappingURL=Divider.js.map

package/dist/module/lib/Components/Divider/Divider.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Box","jsx","_jsx","Divider","lx","orientation","ref","props","accessibilityRole","alignSelf","borderTopWidth","borderTopColor","borderLeftWidth","borderLeftColor","displayName"],"sourceRoot":"../../../../../src","sources":["lib/Components/Divider/Divider.tsx"],"mappings":";;AAAA,SAASA,GAAG,QAAQ,qBAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,OAAO,GAAGA,CAAC;EACtBC,EAAE,GAAG,CAAC,CAAC;EACPC,WAAW,GAAG,YAAY;EAC1BC,GAAG;EACH,GAAGC;AACS,CAAC,KAAK;EAClB,oBACEL,IAAA,CAACF,GAAG;IACFM,GAAG,EAAEA,GAAI;IACTE,iBAAiB,EAAC,MAAM;IACxBJ,EAAE,EAAE;MACF,IAAIC,WAAW,KAAK,YAAY,GAC5B;QACEI,SAAS,EAAE,SAAS;QACpBC,cAAc,EAAE,IAAI;QACpBC,cAAc,EAAE;MAClB,CAAC,GACD;QACEF,SAAS,EAAE,SAAS;QACpBG,eAAe,EAAE,IAAI;QACrBC,eAAe,EAAE;MACnB,CAAC,CAAC;MACN,GAAGT;IACL,CAAE;IAAA,GACEG;EAAK,CACV,CAAC;AAEN,CAAC;AAEDJ,OAAO,CAACW,WAAW,GAAG,SAAS","ignoreList":[]}

package/dist/module/lib/Components/Divider/Divider.mdx

@@ -0,0 +1,151 @@
+import { Meta, Canvas, Controls } from '@storybook/addon-docs/blocks';
+import * as DividerStories from './Divider.stories';
+import { Divider } from './Divider';
+import {
+  CustomTabs,
+  Tab,
+} from '../../../../.storybook/components';
+import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
+
+<Meta title='Layout/Divider' of={DividerStories} />
+
+# ➖ Divider
+
+<CustomTabs>
+  <Tab label="Overview ">
+
+## Introduction
+
+The Divider component provides a simple, semantic way to visually separate content sections in your interface. It creates a horizontal or vertical line that helps organize information and improve content hierarchy.
+
+> View in [Figma](https://www.figma.com/design/JxaLVMTWirCpU0rsbZ30k7/2.-Components-Library?node-id=285-5969&m=dev).
+
+> ⚠️ **Note on Web Preview:** The Storybook preview below may display visual inconsistencies as certain React Native APIs cannot be fully translated to web environments. For the complete native experience, please refer to the component on an actual iOS or Android device.
+
+## Anatomy
+
+<Canvas of={DividerStories.Base} />
+
+The Divider is a simple component consisting of a single line that uses design system tokens for consistent styling.
+
+## Properties
+
+### Overview
+
+<Canvas of={DividerStories.Base} />
+<Controls of={DividerStories.Base} />
+
+### Orientation
+
+Dividers support both horizontal and vertical orientations to accommodate different layout needs:
+
+- `horizontal` (default): Creates a horizontal line spanning the full width of its container
+- `vertical`: Creates a vertical line with a height determined by its container or custom styling via `lx` props
+
+<Canvas of={DividerStories.OrientationShowcase} />
+
+## Usage Examples
+
+### In Lists
+
+A common use case is separating list items or sections within a card:
+
+<Canvas of={DividerStories.InList} />
+
+## Responsive Layout
+
+Dividers automatically adapt to their container's dimensions. For horizontal dividers, they span the full width. For vertical dividers, set an explicit height using the `lx` prop.
+
+## Accessibility
+
+The Divider component uses `accessibilityRole='none'` as it's purely decorative and doesn't require accessibility announcements.
+
+</Tab>
+
+  <Tab label="Implementation">
+
+## Installation
+
+```bash
+npm install @ledgerhq/lumen-ui-rnative
+```
+
+> **Note**: `@ledgerhq/lumen-design-core` and other peer dependencies (`react-native`, etc.) are required. See our Setup Guide for complete installation.
+
+## Basic Usage
+
+```tsx
+import { Divider } from '@ledgerhq/lumen-ui-rnative';
+
+function MyComponent() {
+  return (
+    <Box>
+      <Text>Content above the divider</Text>
+      <Divider />
+      <Text>Content below the divider</Text>
+    </Box>
+  );
+}
+```
+
+### Vertical Divider
+
+For vertical separation between content:
+
+```tsx
+import { Divider, Box, Text } from '@ledgerhq/lumen-ui-rnative';
+
+function MyComponent() {
+  return (
+    <Box lx={{ flexDirection: 'row', alignItems: 'center', gap: 's16' }}>
+      <Text>Left content</Text>
+      <Divider orientation='vertical' lx={{ height: 's48' }} />
+      <Text>Right content</Text>
+    </Box>
+  );
+}
+```
+
+Note: For vertical dividers, you typically need to set an explicit height using the `lx` prop.
+
+### In List Components
+
+Dividers are perfect for separating items in lists, menus, or cards:
+
+```tsx
+import { Divider, Box, Text } from '@ledgerhq/lumen-ui-rnative';
+
+function MyList() {
+  return (
+    <Box
+      lx={{
+        borderRadius: 'lg',
+        borderWidth: 's1',
+        borderColor: 'muted',
+      }}
+    >
+      <Box lx={{ padding: 's16' }}>
+        <Text>Item 1</Text>
+      </Box>
+      <Divider />
+      <Box lx={{ padding: 's16' }}>
+        <Text>Item 2</Text>
+      </Box>
+      <Divider />
+      <Box lx={{ padding: 's16' }}>
+        <Text>Item 3</Text>
+      </Box>
+    </Box>
+  );
+}
+```
+
+<CommonRulesDoAndDont />
+
+## Performance Considerations
+
+The Divider component is extremely lightweight with minimal performance impact. It renders a simple `Box` component with border styling, making it suitable for use in FlatLists and ScrollViews with many items.
+
+</Tab>
+</CustomTabs>
+

package/dist/module/lib/Components/Divider/Divider.stories.js

@@ -0,0 +1,200 @@
+"use strict";
+
+import { Box } from "../Utility/Box/index.js";
+import { Text } from "../Utility/Text/index.js";
+import { Divider } from "./Divider.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const meta = {
+  component: Divider,
+  title: 'Layout/Divider',
+  parameters: {
+    actions: {
+      disable: true
+    }
+  }
+};
+export default meta;
+export const Base = {
+  args: {
+    orientation: 'horizontal'
+  },
+  render: args => {
+    const isVertical = args.orientation === 'vertical';
+    return /*#__PURE__*/_jsxs(Box, {
+      lx: isVertical ? {
+        flexDirection: 'row',
+        alignItems: 'center',
+        gap: 's16'
+      } : {
+        width: 'full',
+        gap: 's16'
+      },
+      children: [/*#__PURE__*/_jsx(Text, {
+        typography: "body2",
+        lx: {
+          color: 'base'
+        },
+        children: isVertical ? 'Left content' : 'Content above'
+      }), /*#__PURE__*/_jsx(Divider, {
+        ...args,
+        lx: isVertical ? {
+          height: 's48'
+        } : undefined
+      }), /*#__PURE__*/_jsx(Text, {
+        typography: "body2",
+        lx: {
+          color: 'base'
+        },
+        children: isVertical ? 'Right content' : 'Content below'
+      })]
+    });
+  }
+};
+export const OrientationShowcase = {
+  render: () => /*#__PURE__*/_jsxs(Box, {
+    lx: {
+      gap: 's32'
+    },
+    children: [/*#__PURE__*/_jsxs(Box, {
+      lx: {
+        gap: 's8'
+      },
+      children: [/*#__PURE__*/_jsx(Text, {
+        typography: "body3",
+        lx: {
+          color: 'muted'
+        },
+        children: "Horizontal (default)"
+      }), /*#__PURE__*/_jsxs(Box, {
+        lx: {
+          width: 'full',
+          gap: 's16'
+        },
+        children: [/*#__PURE__*/_jsx(Text, {
+          typography: "body2",
+          lx: {
+            color: 'base'
+          },
+          children: "Content above"
+        }), /*#__PURE__*/_jsx(Divider, {
+          orientation: "horizontal"
+        }), /*#__PURE__*/_jsx(Text, {
+          typography: "body2",
+          lx: {
+            color: 'base'
+          },
+          children: "Content below"
+        })]
+      })]
+    }), /*#__PURE__*/_jsxs(Box, {
+      lx: {
+        gap: 's8'
+      },
+      children: [/*#__PURE__*/_jsx(Text, {
+        typography: "body3",
+        lx: {
+          color: 'muted'
+        },
+        children: "Vertical"
+      }), /*#__PURE__*/_jsxs(Box, {
+        lx: {
+          flexDirection: 'row',
+          alignItems: 'center',
+          gap: 's16'
+        },
+        children: [/*#__PURE__*/_jsx(Text, {
+          typography: "body2",
+          lx: {
+            color: 'base'
+          },
+          children: "Left content"
+        }), /*#__PURE__*/_jsx(Divider, {
+          orientation: "vertical",
+          lx: {
+            height: 's48'
+          }
+        }), /*#__PURE__*/_jsx(Text, {
+          typography: "body2",
+          lx: {
+            color: 'base'
+          },
+          children: "Right content"
+        })]
+      })]
+    })]
+  })
+};
+export const InList = {
+  render: () => /*#__PURE__*/_jsxs(Box, {
+    lx: {
+      width: 'full',
+      maxWidth: 's400',
+      backgroundColor: 'canvas',
+      borderRadius: 'lg',
+      borderWidth: 's1',
+      borderColor: 'muted'
+    },
+    children: [/*#__PURE__*/_jsxs(Box, {
+      lx: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        padding: 's16'
+      },
+      children: [/*#__PURE__*/_jsx(Text, {
+        typography: "body2",
+        lx: {
+          color: 'base'
+        },
+        children: "Item 1"
+      }), /*#__PURE__*/_jsx(Text, {
+        typography: "body3",
+        lx: {
+          color: 'muted'
+        },
+        children: "$100"
+      })]
+    }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsxs(Box, {
+      lx: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        padding: 's16'
+      },
+      children: [/*#__PURE__*/_jsx(Text, {
+        typography: "body2",
+        lx: {
+          color: 'base'
+        },
+        children: "Item 2"
+      }), /*#__PURE__*/_jsx(Text, {
+        typography: "body3",
+        lx: {
+          color: 'muted'
+        },
+        children: "$200"
+      })]
+    }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsxs(Box, {
+      lx: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+        alignItems: 'center',
+        padding: 's16'
+      },
+      children: [/*#__PURE__*/_jsx(Text, {
+        typography: "body2",
+        lx: {
+          color: 'base'
+        },
+        children: "Item 3"
+      }), /*#__PURE__*/_jsx(Text, {
+        typography: "body3",
+        lx: {
+          color: 'muted'
+        },
+        children: "$300"
+      })]
+    })]
+  })
+};
+//# sourceMappingURL=Divider.stories.js.map

package/dist/module/lib/Components/Divider/Divider.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Box","Text","Divider","jsx","_jsx","jsxs","_jsxs","meta","component","title","parameters","actions","disable","Base","args","orientation","render","isVertical","lx","flexDirection","alignItems","gap","width","children","typography","color","height","undefined","OrientationShowcase","InList","maxWidth","backgroundColor","borderRadius","borderWidth","borderColor","justifyContent","padding"],"sourceRoot":"../../../../../src","sources":["lib/Components/Divider/Divider.stories.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/lib/Components/Divider/Divider.test.js

@@ -0,0 +1,102 @@
+"use strict";
+
+import { describe, it, expect } from '@jest/globals';
+import { ledgerLiveThemes } from '@ledgerhq/lumen-design-core';
+import { render } from '@testing-library/react-native';
+import React from 'react';
+import { ThemeProvider } from "../ThemeProvider/ThemeProvider.js";
+import { Divider } from "./Divider.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const {
+  colors
+} = ledgerLiveThemes.dark;
+const TestWrapper = ({
+  children
+}) => /*#__PURE__*/_jsx(ThemeProvider, {
+  themes: ledgerLiveThemes,
+  colorScheme: "dark",
+  locale: "en",
+  children: children
+});
+describe('Divider Component', () => {
+  it('should render with horizontal orientation by default', () => {
+    const {
+      getByTestId
+    } = render(/*#__PURE__*/_jsx(TestWrapper, {
+      children: /*#__PURE__*/_jsx(Divider, {
+        testID: "divider"
+      })
+    }));
+    const divider = getByTestId('divider');
+    expect(divider).toBeTruthy();
+    const style = divider.props.style;
+    // Style might be an array or object after flattening
+    const flatStyle = Array.isArray(style) ? Object.assign({}, ...style) : style;
+    expect(flatStyle.borderTopWidth).toBe(1);
+    expect(flatStyle.borderTopColor).toBe(colors.border.mutedSubtle);
+  });
+  it('should render with vertical orientation', () => {
+    const {
+      getByTestId
+    } = render(/*#__PURE__*/_jsx(TestWrapper, {
+      children: /*#__PURE__*/_jsx(Divider, {
+        testID: "divider",
+        orientation: "vertical"
+      })
+    }));
+    const divider = getByTestId('divider');
+    const style = divider.props.style;
+    // Style might be an array or object after flattening
+    const flatStyle = Array.isArray(style) ? Object.assign({}, ...style) : style;
+    expect(flatStyle.borderLeftWidth).toBe(1);
+    expect(flatStyle.borderLeftColor).toBe(colors.border.mutedSubtle);
+  });
+  it('should apply custom lx props', () => {
+    const {
+      getByTestId
+    } = render(/*#__PURE__*/_jsx(TestWrapper, {
+      children: /*#__PURE__*/_jsx(Divider, {
+        testID: "divider",
+        lx: {
+          marginVertical: 's16'
+        }
+      })
+    }));
+    const divider = getByTestId('divider');
+    const style = divider.props.style;
+    const flatStyle = Array.isArray(style) ? Object.assign({}, ...style) : style;
+    expect(flatStyle.marginVertical).toBe(16);
+  });
+  it('should pass through additional props', () => {
+    const {
+      getByTestId
+    } = render(/*#__PURE__*/_jsx(TestWrapper, {
+      children: /*#__PURE__*/_jsx(Divider, {
+        testID: "custom-divider"
+      })
+    }));
+    const divider = getByTestId('custom-divider');
+    expect(divider).toBeTruthy();
+  });
+  it('should handle style merging with lx props', () => {
+    const {
+      getByTestId
+    } = render(/*#__PURE__*/_jsx(TestWrapper, {
+      children: /*#__PURE__*/_jsx(Divider, {
+        testID: "divider",
+        lx: {
+          marginTop: 's8'
+        },
+        style: {
+          opacity: 0.5
+        }
+      })
+    }));
+    const divider = getByTestId('divider');
+    const style = divider.props.style;
+    const flatStyle = Array.isArray(style) ? Object.assign({}, ...style) : style;
+    expect(flatStyle.marginTop).toBe(8);
+    expect(flatStyle.opacity).toBe(0.5);
+  });
+});
+//# sourceMappingURL=Divider.test.js.map

package/dist/module/lib/Components/Divider/Divider.test.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["describe","it","expect","ledgerLiveThemes","render","React","ThemeProvider","Divider","jsx","_jsx","colors","dark","TestWrapper","children","themes","colorScheme","locale","getByTestId","testID","divider","toBeTruthy","style","props","flatStyle","Array","isArray","Object","assign","borderTopWidth","toBe","borderTopColor","border","mutedSubtle","orientation","borderLeftWidth","borderLeftColor","lx","marginVertical","marginTop","opacity"],"sourceRoot":"../../../../../src","sources":["lib/Components/Divider/Divider.test.tsx"],"mappings":"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","ignoreList":[]}

package/dist/module/lib/Components/Divider/index.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export { Divider } from "./Divider.js";
+//# sourceMappingURL=index.js.map

package/dist/module/lib/Components/Divider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Divider"],"sourceRoot":"../../../../../src","sources":["lib/Components/Divider/index.ts"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,cAAW","ignoreList":[]}

package/dist/module/lib/Components/Divider/types.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=types.js.map

package/dist/module/lib/Components/Divider/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../../src","sources":["lib/Components/Divider/types.ts"],"mappings":"","ignoreList":[]}

package/dist/module/lib/Components/Icon/Icon.js

@@ -0,0 +1,63 @@
+"use strict";
+
+import { useMemo } from 'react';
+import { Svg } from 'react-native-svg';
+import { useResolveTextStyle, useTheme } from "../../../styles/index.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const iconSizeMap = {
+  12: 's12',
+  16: 's16',
+  20: 's20',
+  24: 's24',
+  32: 's32',
+  40: 's40',
+  48: 's48',
+  56: 's56'
+};
+const useStyles = (lx, size, color) => {
+  const {
+    theme
+  } = useTheme();
+  const resolvedStyle = useResolveTextStyle({
+    ...(lx || {}),
+    color: color || lx?.color
+  });
+  return useMemo(() => {
+    return {
+      container: {
+        ...resolvedStyle,
+        width: theme.icon.width[iconSizeMap[size]],
+        height: theme.icon.height[iconSizeMap[size]],
+        strokeWidth: theme.icon.borderWidth[iconSizeMap[size]]
+      },
+      color: resolvedStyle.color || theme.colors.text.base
+    };
+  }, [size, theme, resolvedStyle]);
+};
+export const Icon = ({
+  size = 24,
+  color,
+  lx = {},
+  children,
+  viewBox,
+  ref,
+  ...props
+}) => {
+  const styles = useStyles(lx, size, color);
+  return /*#__PURE__*/_jsx(Svg, {
+    ref: ref,
+    width: styles.container.width,
+    height: styles.container.height,
+    strokeWidth: styles.container.strokeWidth,
+    viewBox: viewBox,
+    color: styles.color,
+    fill: "none",
+    style: {
+      pointerEvents: 'none'
+    },
+    ...props,
+    children: children
+  });
+};
+Icon.displayName = 'Icon';
+//# sourceMappingURL=Icon.js.map

package/dist/module/lib/Components/Icon/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useMemo","Svg","useResolveTextStyle","useTheme","jsx","_jsx","iconSizeMap","useStyles","lx","size","color","theme","resolvedStyle","container","width","icon","height","strokeWidth","borderWidth","colors","text","base","Icon","children","viewBox","ref","props","styles","fill","style","pointerEvents","displayName"],"sourceRoot":"../../../../../src","sources":["lib/Components/Icon/Icon.tsx"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SAASC,mBAAmB,EAAEC,QAAQ,QAAQ,0BAAiB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAIhE,MAAMC,WAAW,GAAG;EAClB,EAAE,EAAE,KAAK;EACT,EAAE,EAAE,KAAK;EACT,EAAE,EAAE,KAAK;EACT,EAAE,EAAE,KAAK;EACT,EAAE,EAAE,KAAK;EACT,EAAE,EAAE,KAAK;EACT,EAAE,EAAE,KAAK;EACT,EAAE,EAAE;AACN,CAAU;AAEV,MAAMC,SAAS,GAAGA,CAChBC,EAAmB,EACnBC,IAAc,EACdC,KAAyB,KACtB;EACH,MAAM;IAAEC;EAAM,CAAC,GAAGR,QAAQ,CAAC,CAAC;EAE5B,MAAMS,aAAa,GAAGV,mBAAmB,CAAC;IACxC,IAAIM,EAAE,IAAI,CAAC,CAAC,CAAC;IACbE,KAAK,EAAEA,KAAK,IAAIF,EAAE,EAAEE;EACtB,CAAC,CAAC;EAEF,OAAOV,OAAO,CAAC,MAAM;IACnB,OAAO;MACLa,SAAS,EAAE;QACT,GAAGD,aAAa;QAChBE,KAAK,EAAEH,KAAK,CAACI,IAAI,CAACD,KAAK,CAACR,WAAW,CAACG,IAAI,CAAC,CAAC;QAC1CO,MAAM,EAAEL,KAAK,CAACI,IAAI,CAACC,MAAM,CAACV,WAAW,CAACG,IAAI,CAAC,CAAC;QAC5CQ,WAAW,EAAEN,KAAK,CAACI,IAAI,CAACG,WAAW,CAACZ,WAAW,CAACG,IAAI,CAAC;MACvD,CAAC;MACDC,KAAK,EAAEE,aAAa,CAACF,KAAK,IAAIC,KAAK,CAACQ,MAAM,CAACC,IAAI,CAACC;IAClD,CAAC;EACH,CAAC,EAAE,CAACZ,IAAI,EAAEE,KAAK,EAAEC,aAAa,CAAC,CAAC;AAClC,CAAC;AAED,OAAO,MAAMU,IAAI,GAAGA,CAAC;EACnBb,IAAI,GAAG,EAAE;EACTC,KAAK;EACLF,EAAE,GAAG,CAAC,CAAC;EACPe,QAAQ;EACRC,OAAO;EACPC,GAAG;EACH,GAAGC;AACM,CAAC,KAAK;EACf,MAAMC,MAAM,GAAGpB,SAAS,CAACC,EAAE,EAAEC,IAAI,EAAEC,KAAK,CAAC;EAEzC,oBACEL,IAAA,CAACJ,GAAG;IACFwB,GAAG,EAAEA,GAAI;IACTX,KAAK,EAAEa,MAAM,CAACd,SAAS,CAACC,KAAM;IAC9BE,MAAM,EAAEW,MAAM,CAACd,SAAS,CAACG,MAAO;IAChCC,WAAW,EAAEU,MAAM,CAACd,SAAS,CAACI,WAAY;IAC1CO,OAAO,EAAEA,OAAQ;IACjBd,KAAK,EAAEiB,MAAM,CAACjB,KAAM;IACpBkB,IAAI,EAAC,MAAM;IACXC,KAAK,EAAE;MAAEC,aAAa,EAAE;IAAO,CAAE;IAAA,GAC7BJ,KAAK;IAAAH,QAAA,EAERA;EAAQ,CACN,CAAC;AAEV,CAAC;AAEDD,IAAI,CAACS,WAAW,GAAG,MAAM","ignoreList":[]}