@ledgerhq/lumen-ui-rnative 0.1.4 → 0.1.6

package/dist/src/lib/Components/Button/Button.stories.js

@@ -1,143 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { Plus, Settings } from '../../Symbols';
-import { Box, Text } from '../Utility';
-import { Button } from './Button';
-const meta = {
-    component: Button,
-    title: 'Action/Button',
-    parameters: {
-        docs: {
-            source: {
-                language: 'tsx',
-                format: true,
-                type: 'code',
-            },
-        },
-    },
-    argTypes: {
-        appearance: {
-            control: 'select',
-            icon: {
-                control: 'select',
-                description: 'Optional icon component to display',
-                options: ['None', 'Plus', 'Settings'],
-                mapping: {
-                    None: undefined,
-                    Plus: Plus,
-                    Settings: Settings,
-                },
-            },
-        },
-    },
-};
-export default meta;
-export const Base = {
-    args: {
-        appearance: 'base',
-        children: 'Base Button',
-    },
-    render: (args) => _jsx(Button, { ...args }),
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<Button appearance="base">
-  Base Button
-</Button>
-`,
-            },
-        },
-    },
-};
-export const IconText = {
-    args: {
-        appearance: 'base',
-        children: 'Add Item',
-        icon: Plus,
-    },
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<Button
-  appearance="base"
-  icon={Plus}
->
-  Add Item
-</Button>
-`,
-            },
-        },
-    },
-};
-export const Loading = {
-    args: {
-        appearance: 'base',
-        children: 'Loading...',
-        loading: true,
-    },
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<Button
-  appearance="base"
-  loading
->
-  Loading...
-</Button>
-`,
-            },
-        },
-    },
-};
-export const AppearanceShowcase = {
-    render: () => {
-        const appearances = [
-            { name: 'Accent', appearance: 'accent' },
-            { name: 'Base', appearance: 'base' },
-            { name: 'Gray', appearance: 'gray' },
-            { name: 'Transparent', appearance: 'transparent' },
-            { name: 'No Background', appearance: 'no-background' },
-            { name: 'Red', appearance: 'red' },
-        ];
-        return (_jsx(Box, { lx: { flexDirection: 'row', gap: 's16', padding: 's8' }, children: appearances.map(({ name, appearance }) => (_jsx(Button, { appearance: appearance, children: name }, appearance))) }));
-    },
-};
-export const ContentTypesShowcase = {
-    render: () => (_jsxs(Box, { lx: { flexDirection: 'row', alignItems: 'center', gap: 's4' }, children: [_jsx(Button, { appearance: 'base', children: "Text Only" }), _jsx(Button, { appearance: 'base', icon: Plus, children: "With Icon" })] })),
-};
-export const SizesShowcase = {
-    render: () => (_jsxs(Box, { lx: { flexDirection: 'row', alignItems: 'center', gap: 's4' }, children: [_jsx(Button, { appearance: 'base', size: 'sm', children: "Small" }), _jsx(Button, { appearance: 'base', size: 'md', children: "Medium" }), _jsx(Button, { appearance: 'base', size: 'lg', icon: Settings, children: "Large" })] })),
-};
-export const StatesShowcase = {
-    render: () => (_jsxs(Box, { lx: { flexDirection: 'row', alignItems: 'center', gap: 's4' }, children: [_jsx(Button, { appearance: 'base', children: "Default" }), _jsx(Button, { appearance: 'base', disabled: true, children: "Disabled" }), _jsx(Button, { appearance: 'base', loading: true, children: "Loading" }), _jsx(Button, { appearance: 'base', loading: true, disabled: true, children: "Loading" })] })),
-};
-export const ResponsiveLayout = {
-    render: () => (_jsxs(Box, { lx: {
-            flexDirection: 'column',
-            gap: 's8',
-            padding: 's8',
-            alignItems: 'flex-start',
-        }, children: [_jsx(Button, { appearance: 'base', children: "Short" }), _jsx(Button, { appearance: 'base', children: "Medium length button" }), _jsx(Button, { appearance: 'base', icon: Plus, children: "This is a longer button text to show dynamic width" })] })),
-};
-export const LabelTruncate = {
-    render: () => (_jsxs(Box, { children: [_jsx(Text, { typography: 'body4SemiBold', lx: { color: 'muted' }, children: "This container has a fixed width." }), _jsx(Box, { lx: { width: 's400', padding: 's16' }, children: _jsx(Button, { icon: Plus, children: "This Base button has a fixed width container that should fit the content width." }) })] })),
-};
-export const InteractiveLoadingStates = {
-    render: () => {
-        const [states, setStates] = React.useState({
-            text: 'idle',
-            withIcon: 'idle',
-            iconOnly: 'idle',
-        });
-        const handleClick = async (key) => {
-            setStates((prev) => ({ ...prev, [key]: 'loading' }));
-            await new Promise((resolve) => setTimeout(resolve, 2000));
-            setStates((prev) => ({ ...prev, [key]: 'red' }));
-            setTimeout(() => setStates((prev) => ({ ...prev, [key]: 'idle' })), 2000);
-        };
-        return (_jsxs(Box, { lx: { flexDirection: 'row', alignItems: 'center', gap: 's4' }, children: [_jsx(Button, { appearance: 'red', loading: states.text === 'loading', onPress: () => handleClick('text'), children: states.text === 'red' ? 'Error!' : 'Text Only' }), _jsx(Button, { appearance: 'base', loading: states.withIcon === 'loading', onPress: () => handleClick('withIcon'), icon: Settings, children: states.withIcon === 'red' ? 'Settings Error!' : 'With Icon' })] }));
-    },
-};

package/dist/src/lib/Components/CardButton/CardButton.stories.d.ts

@@ -1,16 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-native-web-vite';
-import { CardButton } from './CardButton';
-declare const meta: Meta<typeof CardButton>;
-export default meta;
-type Story = StoryObj<typeof CardButton>;
-export declare const Base: Story;
-export declare const WithIcon: Story;
-export declare const WithDescription: Story;
-export declare const WithoutChevron: Story;
-export declare const FullFeatures: Story;
-export declare const NaturalWidth: Story;
-export declare const AppearanceShowcase: Story;
-export declare const ContentVariations: Story;
-export declare const StatesShowcase: Story;
-export declare const ResponsiveLayout: Story;
-//# sourceMappingURL=CardButton.stories.d.ts.map

package/dist/src/lib/Components/CardButton/CardButton.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CardButton.stories.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/CardButton/CardButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAGvE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CA6CjC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAGzC,eAAO,MAAM,IAAI,EAAE,KAkBlB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAmBtB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAmB7B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAmB5B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAqB1B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KA+B1B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KA+BhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAsC/B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAsC5B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAkC9B,CAAC"}

package/dist/src/lib/Components/CardButton/CardButton.stories.js

@@ -1,208 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Settings, Plus, Coins, CreditCard, Bank } from '../../Symbols';
-import { Box, Text } from '../Utility';
-import { CardButton } from './CardButton';
-const meta = {
-    component: CardButton,
-    title: 'Action/CardButton',
-    parameters: {
-        docs: {
-            source: {
-                language: 'tsx',
-                format: true,
-                type: 'code',
-            },
-        },
-    },
-    argTypes: {
-        appearance: {
-            control: 'select',
-            options: ['base', 'outline'],
-            description: 'The visual style appearance of the card button',
-        },
-        title: {
-            control: 'text',
-            description: 'The main title text for the card button',
-        },
-        description: {
-            control: 'text',
-            description: 'Optional description text displayed below the title',
-        },
-        icon: {
-            control: 'select',
-            description: 'Optional icon component to display',
-            options: ['None', 'Plus', 'Settings'],
-            mapping: {
-                None: undefined,
-                Plus: Plus,
-                Settings: Settings,
-            },
-        },
-        hideChevron: {
-            control: 'boolean',
-            description: 'Whether to hide the chevron right icon on the right side',
-        },
-        disabled: {
-            control: 'boolean',
-            description: 'Whether the card button is disabled',
-        },
-    },
-};
-export default meta;
-export const Base = {
-    args: {
-        appearance: 'base',
-        title: 'Basic Card Button',
-    },
-    render: (args) => _jsx(CardButton, { ...args }),
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<CardButton
-  appearance="base"
-  title="Basic Card Button"
-/>
-`,
-            },
-        },
-    },
-};
-export const WithIcon = {
-    args: {
-        appearance: 'base',
-        title: 'Settings',
-        icon: Settings,
-    },
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<CardButton
-  appearance="base"
-  title="Settings"
-  icon={Settings}
-/>
-`,
-            },
-        },
-    },
-};
-export const WithDescription = {
-    args: {
-        appearance: 'base',
-        title: 'Payment Method',
-        description: 'Add or manage your payment options',
-    },
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<CardButton
-  appearance="base"
-  title="Payment Method"
-  description="Add or manage your payment options"
-/>
-`,
-            },
-        },
-    },
-};
-export const WithoutChevron = {
-    args: {
-        appearance: 'base',
-        title: 'Navigate Forward',
-        hideChevron: true,
-    },
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<CardButton
-  appearance="base"
-  title="Navigate Forward"
-  hideChevron
-/>
-`,
-            },
-        },
-    },
-};
-export const FullFeatures = {
-    args: {
-        appearance: 'base',
-        title: 'Account Settings',
-        description: 'Manage your account preferences and security',
-        icon: Settings,
-    },
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<CardButton
-  appearance="base"
-  title="Account Settings"
-  description="Manage your account preferences and security"
-  icon={Settings}
-/>
-`,
-            },
-        },
-    },
-};
-export const NaturalWidth = {
-    render: () => (_jsxs(Box, { lx: { backgroundColor: 'mutedPressed', padding: 's16' }, children: [_jsx(Text, { typography: 'body4SemiBold', lx: { color: 'muted', marginBottom: 's16' }, children: "CardButton naturally flows to fill parent container width" }), _jsx(CardButton, { appearance: 'base', title: 'Natural Width Example', description: 'This card button demonstrates how it flows naturally to fill the full width of its parent container without any max-width constraints', icon: CreditCard })] })),
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<CardButton
-  appearance="base"
-  title="Natural Width Example"
-  description="This card button demonstrates how it flows naturally to fill the full width of its parent container without any max-width constraints"
-  icon={CreditCard}
-/>
-`,
-            },
-        },
-    },
-};
-export const AppearanceShowcase = {
-    render: () => {
-        const appearances = [
-            { name: 'Base', appearance: 'base' },
-            { name: 'Outline', appearance: 'outline' },
-        ];
-        return (_jsx(Box, { lx: {
-                flexDirection: 'column',
-                gap: 's16',
-                padding: 's8',
-                maxWidth: 's400',
-            }, children: appearances.map(({ name, appearance }) => (_jsx(CardButton, { appearance: appearance, title: `${name} Appearance`, description: 'This demonstrates the appearance variation', icon: Coins }, appearance))) }));
-    },
-};
-export const ContentVariations = {
-    render: () => (_jsxs(Box, { lx: {
-            flexDirection: 'column',
-            gap: 's16',
-            padding: 's8',
-            maxWidth: 's400',
-        }, children: [_jsx(CardButton, { appearance: 'base', title: 'With Description', description: 'This card has a description below the title', hideChevron: true }), _jsx(CardButton, { appearance: 'base', title: 'Icon and Description', description: 'This card has both an icon and description', icon: Settings, hideChevron: true }), _jsx(CardButton, { appearance: 'base', title: 'Description and Chevron', description: 'This card has description and chevron' }), _jsx(CardButton, { appearance: 'base', title: 'Complete Card', description: 'This card has all optional features', icon: CreditCard }), _jsx(CardButton, { appearance: 'base', title: 'With Icon', icon: Plus, hideChevron: true }), _jsx(CardButton, { appearance: 'base', title: 'With Chevron' })] })),
-};
-export const StatesShowcase = {
-    render: () => (_jsxs(Box, { lx: {
-            flexDirection: 'column',
-            gap: 's16',
-            padding: 's8',
-            maxWidth: 's400',
-        }, children: [_jsx(CardButton, { appearance: 'base', title: 'Base Default', description: 'This is the normal interactive state', icon: Settings }), _jsx(CardButton, { appearance: 'base', title: 'Base Disabled', description: 'This card button is disabled', icon: Settings, disabled: true }), _jsx(CardButton, { appearance: 'outline', title: 'Outline Default', description: 'This is the outline appearance', icon: Bank }), _jsx(CardButton, { appearance: 'outline', title: 'Outline Disabled', description: 'This is the disabled outline appearance', icon: Bank, disabled: true })] })),
-};
-export const ResponsiveLayout = {
-    render: () => (_jsxs(Box, { lx: {
-            width: 's320',
-            flexDirection: 'column',
-            gap: 's16',
-            backgroundColor: 'mutedPressed',
-            padding: 's16',
-        }, children: [_jsx(Text, { typography: 'body4SemiBold', lx: { color: 'muted' }, children: "Container: 320px wide" }), _jsx(CardButton, { appearance: 'base', title: 'Short Title', description: 'Short description', icon: Plus }), _jsx(CardButton, { appearance: 'base', title: 'Full Width', description: 'Short description', icon: Plus }), _jsx(CardButton, { appearance: 'base', title: 'Longer Title That Might Overflow When Container is Smaller', description: 'This is a longer description that demonstrates how the card handles longer content within its constraints', icon: Settings })] })),
-};

package/dist/src/lib/Components/Checkbox/Checkbox.stories.d.ts

@@ -1,14 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-native-web-vite';
-import { Checkbox } from './Checkbox';
-declare const meta: Meta<typeof Checkbox>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-/**
- * The base checkbox in its normal state.
- */
-export declare const Base: Story;
-/**
- * Interactive example showing all states.
- */
-export declare const AllStates: Story;
-//# sourceMappingURL=Checkbox.stories.d.ts.map

package/dist/src/lib/Components/Checkbox/Checkbox.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAEvE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAsC/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC;;GAEG;AACH,eAAO,MAAM,IAAI,EAAE,KAkBlB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,KAwCvB,CAAC"}

package/dist/src/lib/Components/Checkbox/Checkbox.stories.js

@@ -1,72 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text } from '../Utility';
-import { Checkbox } from './Checkbox';
-const meta = {
-    title: 'Selection/Checkbox',
-    component: Checkbox,
-    parameters: {
-        layout: 'fullscreen',
-        docs: {
-            source: {
-                language: 'tsx',
-                format: true,
-                type: 'code',
-            },
-        },
-    },
-    args: {
-        label: 'Checkbox',
-    },
-    argTypes: {
-        checked: {
-            control: 'boolean',
-            description: 'The controlled checked state of the checkbox',
-        },
-        defaultChecked: {
-            control: 'boolean',
-            description: 'The default checked state (uncontrolled)',
-        },
-        disabled: {
-            control: 'boolean',
-            description: 'If true, the checkbox is disabled',
-        },
-        onCheckedChange: {
-            action: 'checked changed',
-            description: 'Callback function called when the checked state changes',
-        },
-        label: {
-            control: 'text',
-            description: 'The label text of the checkbox',
-        },
-    },
-};
-export default meta;
-/**
- * The base checkbox in its normal state.
- */
-export const Base = {
-    render: (args) => {
-        return (_jsx(Box, { style: {
-                flex: 1,
-                minHeight: 96,
-                alignItems: 'center',
-                justifyContent: 'center',
-                padding: 24,
-            }, children: _jsx(Box, { style: { width: '100%', maxWidth: 400 }, children: _jsx(Checkbox, { ...args }) }) }));
-    },
-};
-/**
- * Interactive example showing all states.
- */
-export const AllStates = {
-    render: () => (_jsx(Box, { style: {
-            flex: 1,
-            minHeight: 96,
-            alignItems: 'center',
-            justifyContent: 'center',
-            padding: 24,
-        }, children: _jsx(Box, { style: { width: '100%', maxWidth: 400 }, children: _jsxs(Box, { style: {
-                    flexDirection: 'row',
-                    gap: 48,
-                }, children: [_jsxs(Box, { style: { gap: 16 }, children: [_jsx(Text, { typography: 'heading5', children: "Enabled" }), _jsxs(Box, { style: { gap: 8 }, children: [_jsx(Checkbox, { label: 'Unchecked', accessibilityLabel: 'Unchecked', defaultChecked: false }), _jsx(Checkbox, { label: 'Checked', defaultChecked: true })] })] }), _jsxs(Box, { style: { gap: 16 }, children: [_jsx(Text, { typography: 'heading5', children: "Disabled" }), _jsxs(Box, { style: { gap: 8 }, children: [_jsx(Checkbox, { label: 'Unchecked', disabled: true, defaultChecked: false }), _jsx(Checkbox, { label: 'Checked', disabled: true, defaultChecked: true })] })] })] }) }) })),
-};

package/dist/src/lib/Components/ContentBanner/ContentBanner.stories.d.ts

@@ -1,11 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-native-web-vite';
-import { ContentBanner } from './ContentBanner';
-declare const meta: Meta<typeof ContentBanner>;
-export default meta;
-type Story = StoryObj<typeof ContentBanner>;
-export declare const Base: Story;
-export declare const WithClose: Story;
-export declare const ContentVariationsShowcase: Story;
-export declare const WithStepper: Story;
-export declare const ResponsiveLayout: Story;
-//# sourceMappingURL=ContentBanner.stories.d.ts.map

package/dist/src/lib/Components/ContentBanner/ContentBanner.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ContentBanner.stories.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/ContentBanner/ContentBanner.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAOvE,OAAO,EACL,aAAa,EAId,MAAM,iBAAiB,CAAC;AAEzB,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,aAAa,CA6BpC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAE5C,eAAO,MAAM,IAAI,EAAE,KAkClB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAiCvB,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAoDvC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAczB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAoC9B,CAAC"}

package/dist/src/lib/Components/ContentBanner/ContentBanner.stories.js

@@ -1,91 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { Settings, Wallet } from '../../Symbols';
-import { Button } from '../Button';
-import { Spot } from '../Spot';
-import { Stepper } from '../Stepper';
-import { Box, Text } from '../Utility';
-import { ContentBanner, ContentBannerContent, ContentBannerDescription, ContentBannerTitle, } from './ContentBanner';
-const meta = {
-    component: ContentBanner,
-    title: 'Communication/ContentBanner',
-    parameters: {
-        docs: {
-            source: {
-                language: 'tsx',
-                format: true,
-                type: 'code',
-            },
-        },
-    },
-    argTypes: {
-        onClose: {
-            control: 'select',
-            description: 'Close action callback',
-            options: ['With Close', 'None'],
-            mapping: {
-                'With Close': () => {
-                    console.log('Close clicked');
-                },
-                None: undefined,
-            },
-        },
-        closeAccessibilityLabel: {
-            control: 'text',
-            description: 'Accessibility label for the close button',
-        },
-    },
-};
-export default meta;
-export const Base = {
-    args: {
-        closeAccessibilityLabel: 'Close content banner',
-    },
-    render: (args) => (_jsx(Box, { lx: { maxWidth: 's400' }, children: _jsxs(ContentBanner, { ...args, children: [_jsx(Spot, { appearance: 'icon', icon: Settings, size: 48 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "Content Banner" }), _jsx(ContentBannerDescription, { children: "This is a description for the content banner." })] })] }) })),
-    parameters: {
-        docs: {
-            source: {
-                code: `
-<ContentBanner>
-  <Spot appearance="icon" icon={Settings} size={48} />
-  <ContentBannerContent>
-    <ContentBannerTitle>Content Banner</ContentBannerTitle>
-    <ContentBannerDescription>
-      This is a description for the content banner.
-    </ContentBannerDescription>
-  </ContentBannerContent>
-</ContentBanner>
-`,
-            },
-        },
-    },
-};
-export const WithClose = {
-    render: () => {
-        const [visible, setVisible] = React.useState(true);
-        if (!visible) {
-            return (_jsx(Button, { appearance: 'transparent', size: 'sm', onPress: () => setVisible(true), children: "Show banner again" }));
-        }
-        return (_jsx(Box, { lx: { maxWidth: 's400' }, children: _jsxs(ContentBanner, { onClose: () => setVisible(false), closeAccessibilityLabel: 'Close content banner', children: [_jsx(Spot, { appearance: 'icon', icon: Settings, size: 48 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "Dismissible Banner" }), _jsx(ContentBannerDescription, { children: "Press the close button to dismiss this banner." })] })] }) }));
-    },
-};
-export const ContentVariationsShowcase = {
-    render: () => (_jsxs(Box, { lx: {
-            flexDirection: 'column',
-            maxWidth: 's400',
-            gap: 's16',
-            padding: 's8',
-        }, children: [_jsxs(ContentBanner, { children: [_jsx(Spot, { appearance: 'icon', icon: Settings, size: 48 }), _jsx(ContentBannerContent, { children: _jsx(ContentBannerTitle, { children: "Title Only" }) })] }), _jsxs(ContentBanner, { children: [_jsx(Spot, { appearance: 'icon', icon: Wallet, size: 48 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "Title with Description" }), _jsx(ContentBannerDescription, { children: "This is a description for the content banner." })] })] }), _jsxs(ContentBanner, { onClose: () => console.log('close'), children: [_jsx(Spot, { appearance: 'icon', icon: Wallet, size: 48 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "With Close Button" }), _jsx(ContentBannerDescription, { children: "A content banner with a leading icon and close button." })] })] }), _jsxs(ContentBanner, { onClose: () => console.log('close'), children: [_jsx(Spot, { appearance: 'icon', icon: Settings, size: 48 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "Longer Title That Demonstrates Clamping Behavior With a Long Description" }), _jsx(ContentBannerDescription, { children: "This is a longer description that demonstrates how the content banner handles overflow. It should be clamped at two lines." })] })] })] })),
-};
-export const WithStepper = {
-    render: () => (_jsx(Box, { lx: { maxWidth: 's400' }, children: _jsxs(ContentBanner, { onClose: () => console.log('close'), children: [_jsx(Stepper, { currentStep: 2, totalSteps: 4 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "Setup your wallet" }), _jsx(ContentBannerDescription, { children: "Complete all steps to secure your wallet." })] })] }) })),
-};
-export const ResponsiveLayout = {
-    render: () => (_jsxs(Box, { lx: {
-            width: 's400',
-            flexDirection: 'column',
-            gap: 's16',
-            backgroundColor: 'mutedPressed',
-            padding: 's16',
-        }, children: [_jsx(Text, { typography: 'body4SemiBold', lx: { color: 'muted' }, children: "Container with a fixed width" }), _jsxs(ContentBanner, { children: [_jsx(Spot, { appearance: 'icon', icon: Settings, size: 48 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "Short Title" }), _jsx(ContentBannerDescription, { children: "Short description" })] })] }), _jsxs(ContentBanner, { onClose: () => console.log('close'), children: [_jsx(Spot, { appearance: 'icon', icon: Wallet, size: 48 }), _jsxs(ContentBannerContent, { children: [_jsx(ContentBannerTitle, { children: "Longer Title That Might Overflow When Container is Smaller" }), _jsx(ContentBannerDescription, { children: "This is a longer description that demonstrates how the content banner handles longer content within its constraints. It should be clamped at two lines with an ellipsis." })] })] })] })),
-};

package/dist/src/lib/Components/Divider/Divider.stories.d.ts

@@ -1,9 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-native-web-vite';
-import { Divider } from './Divider';
-declare const meta: Meta<typeof Divider>;
-export default meta;
-type Story = StoryObj<typeof Divider>;
-export declare const Base: Story;
-export declare const OrientationShowcase: Story;
-export declare const InList: Story;
-//# sourceMappingURL=Divider.stories.d.ts.map

package/dist/src/lib/Components/Divider/Divider.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Divider.stories.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Divider/Divider.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAGvE,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAM9B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAC;AAEtC,eAAO,MAAM,IAAI,EAAE,KAwBlB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAkCjC,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KA6DpB,CAAC"}

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

@@ -1,51 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box } from '../Utility/Box';
-import { Text } from '../Utility/Text';
-import { Divider } from './Divider';
-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 (_jsxs(Box, { lx: isVertical
-                ? { flexDirection: 'row', alignItems: 'center', gap: 's16' }
-                : { width: 'full', gap: 's16' }, children: [_jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: isVertical ? 'Left content' : 'Content above' }), _jsx(Divider, { ...args, lx: isVertical ? { height: 's48' } : undefined }), _jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: isVertical ? 'Right content' : 'Content below' })] }));
-    },
-};
-export const OrientationShowcase = {
-    render: () => (_jsxs(Box, { lx: { gap: 's32' }, children: [_jsxs(Box, { lx: { gap: 's8' }, children: [_jsx(Text, { typography: 'body3', lx: { color: 'muted' }, children: "Horizontal (default)" }), _jsxs(Box, { lx: { width: 'full', gap: 's16' }, children: [_jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: "Content above" }), _jsx(Divider, { orientation: 'horizontal' }), _jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: "Content below" })] })] }), _jsxs(Box, { lx: { gap: 's8' }, children: [_jsx(Text, { typography: 'body3', lx: { color: 'muted' }, children: "Vertical" }), _jsxs(Box, { lx: { flexDirection: 'row', alignItems: 'center', gap: 's16' }, children: [_jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: "Left content" }), _jsx(Divider, { orientation: 'vertical', lx: { height: 's48' } }), _jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: "Right content" })] })] })] })),
-};
-export const InList = {
-    render: () => (_jsxs(Box, { lx: {
-            width: 'full',
-            maxWidth: 's400',
-            backgroundColor: 'canvas',
-            borderRadius: 'lg',
-            borderWidth: 's1',
-            borderColor: 'muted',
-        }, children: [_jsxs(Box, { lx: {
-                    flexDirection: 'row',
-                    justifyContent: 'space-between',
-                    alignItems: 'center',
-                    padding: 's16',
-                }, children: [_jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: "Item 1" }), _jsx(Text, { typography: 'body3', lx: { color: 'muted' }, children: "$100" })] }), _jsx(Divider, {}), _jsxs(Box, { lx: {
-                    flexDirection: 'row',
-                    justifyContent: 'space-between',
-                    alignItems: 'center',
-                    padding: 's16',
-                }, children: [_jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: "Item 2" }), _jsx(Text, { typography: 'body3', lx: { color: 'muted' }, children: "$200" })] }), _jsx(Divider, {}), _jsxs(Box, { lx: {
-                    flexDirection: 'row',
-                    justifyContent: 'space-between',
-                    alignItems: 'center',
-                    padding: 's16',
-                }, children: [_jsx(Text, { typography: 'body2', lx: { color: 'base' }, children: "Item 3" }), _jsx(Text, { typography: 'body3', lx: { color: 'muted' }, children: "$300" })] })] })),
-};

package/dist/src/lib/Components/Icon/Icon.stories.d.ts

@@ -1,15 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-native-web-vite';
-import * as Icons from '../../Symbols';
-import type { IconSize } from './types';
-declare const meta: Meta;
-export default meta;
-type IconName = keyof typeof Icons;
-type IconStoryProps = {
-    size: IconSize;
-    name: IconName;
-    color?: string;
-};
-export declare const Icon: StoryObj<IconStoryProps>;
-export declare const IconSizes: StoryObj;
-export declare const Gallery: StoryObj;
-//# sourceMappingURL=Icon.stories.d.ts.map

package/dist/src/lib/Components/Icon/Icon.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Icon.stories.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Icon/Icon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAGvE,OAAO,KAAK,KAAK,MAAM,eAAe,CAAC;AAGvC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAExC,QAAA,MAAM,IAAI,EAAE,IAEX,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,KAAK,QAAQ,GAAG,MAAM,OAAO,KAAK,CAAC;AAGnC,KAAK,cAAc,GAAG;IACpB,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAoEF,eAAO,MAAM,IAAI,EAAE,QAAQ,CAAC,cAAc,CA4CzC,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,QA0CvB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,QA+ErB,CAAC"}