@ledgerhq/lumen-ui-rnative 0.0.55 → 0.0.57-0

package/dist/src/lib/Components/TileButton/TileButton.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isTextChildren } from '@ledgerhq/lumen-utils-shared';
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { useStyleSheet } from '../../../styles';
+import { Pressable, Text } from '../Utility';
+const ICON_SIZE = 20;
+const useRootStyles = ({ isFull }) => {
+    return useStyleSheet((t) => ({
+        root: {
+            width: isFull ? t.sizes.full : 'auto',
+        },
+    }), [isFull]);
+};
+const useStyles = ({ disabled, pressed, isFull, }) => {
+    return useStyleSheet((t) => ({
+        container: StyleSheet.flatten([
+            {
+                flexDirection: 'column',
+                alignItems: 'center',
+                justifyContent: 'center',
+                gap: t.spacings.s8,
+                padding: t.spacings.s12,
+                borderRadius: t.borderRadius.md,
+                backgroundColor: t.colors.bg.muted,
+            },
+            isFull && { width: t.sizes.full },
+            pressed && !disabled && { backgroundColor: t.colors.bg.mutedPressed },
+            disabled && { backgroundColor: t.colors.bg.disabled },
+        ]),
+        label: StyleSheet.flatten([
+            t.typographies.body2SemiBold,
+            {
+                textAlign: 'center',
+                color: disabled ? t.colors.text.disabled : t.colors.text.base,
+            },
+        ]),
+        icon: {
+            flexShrink: 0,
+            color: disabled ? t.colors.text.disabled : t.colors.text.base,
+        },
+    }), [disabled, pressed, isFull]);
+};
+/**
+ * A compact button component displaying an icon above a label in a vertical layout.
+ * Ideal for grids, toolbars, or quick action menus.
+ *
+ * @see {@link https://ldls.vercel.app/?path=/docs/react-native_action-tilebutton--docs Storybook}
+ *
+ * @example
+ * import { TileButton } from '@ledgerhq/lumen-ui-rnative';
+ * import { Settings } from '@ledgerhq/lumen-ui-rnative/symbols';
+ *
+ * <TileButton icon={Settings} onPress={() => console.log('pressed')}>
+ *   Settings
+ * </TileButton>
+ */
+export const TileButton = React.forwardRef(({ lx, style, icon: IconProp, children, disabled = false, isFull = false, numberOfLines = 2, ...props }, ref) => {
+    const rootStyles = useRootStyles({ isFull });
+    return (_jsx(Pressable, { ref: ref, lx: lx, style: StyleSheet.flatten([style, rootStyles.root]), disabled: disabled, accessibilityRole: 'button', accessibilityState: { disabled }, ...props, children: ({ pressed }) => (_jsx(TileButtonContent, { disabled: disabled, pressed: pressed, isFull: isFull, IconProp: IconProp, numberOfLines: numberOfLines, children: children })) }));
+});
+const TileButtonContent = ({ disabled, pressed, isFull, IconProp, numberOfLines, children, }) => {
+    const styles = useStyles({ disabled, pressed, isFull });
+    return (_jsxs(View, { style: styles.container, testID: 'tile-button-content', children: [_jsx(IconProp, { size: ICON_SIZE, style: styles.icon }), isTextChildren(children) ? (_jsx(Text, { style: styles.label, numberOfLines: numberOfLines, children: children })) : (children)] }));
+};
+TileButton.displayName = 'TileButton';

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

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/react-native-web-vite';
+import { TileButton } from './TileButton';
+declare const meta: Meta<typeof TileButton>;
+export default meta;
+type Story = StoryObj<typeof TileButton>;
+export declare const Base: Story;
+export declare const DisabledShowcase: Story;
+export declare const IconsShowcase: Story;
+export declare const GridLayout: Story;
+export declare const WidthShowcase: Story;
+export declare const TruncationShowcase: Story;
+//# sourceMappingURL=TileButton.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TileButton.stories.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/TileButton/TileButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAGvE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAY1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAajC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAEzC,eAAO,MAAM,IAAI,EAAE,KAalB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAW9B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAiB3B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAoCxB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAmB3B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAUhC,CAAC"}

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

@@ -0,0 +1,63 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { Settings, Plus, User, Apps, Home, Bell, Cart } from '../../Symbols';
+import { TileButton } from './TileButton';
+const iconOptions = {
+    Settings,
+    Plus,
+    User,
+    Apps,
+    Home,
+    Bell,
+    Cart,
+};
+const meta = {
+    component: TileButton,
+    title: 'Action/TileButton',
+    argTypes: {
+        icon: {
+            options: Object.keys(iconOptions),
+            mapping: iconOptions,
+            control: { type: 'select' },
+        },
+        onPress: {
+            action: 'pressed',
+        },
+    },
+};
+export default meta;
+export const Base = {
+    args: {
+        icon: Settings,
+        children: 'Settings',
+    },
+    render: (args) => _jsx(TileButton, { ...args }),
+    parameters: {
+        docs: {
+            source: {
+                code: `<TileButton icon={Settings} onPress={() => {}}>Settings</TileButton>`,
+            },
+        },
+    },
+};
+export const DisabledShowcase = {
+    render: (args) => (_jsxs(View, { style: { flexDirection: 'row', gap: 16 }, children: [_jsx(TileButton, { icon: Settings, onPress: args.onPress, children: "Enabled" }), _jsx(TileButton, { icon: Settings, onPress: args.onPress, disabled: true, children: "Disabled" })] })),
+};
+export const IconsShowcase = {
+    render: (args) => (_jsxs(View, { style: { flexDirection: 'row', gap: 16 }, children: [_jsx(TileButton, { icon: Settings, onPress: args.onPress, children: "Settings" }), _jsx(TileButton, { icon: User, onPress: args.onPress, children: "Profile" }), _jsx(TileButton, { icon: Plus, onPress: args.onPress, children: "Add" }), _jsx(TileButton, { icon: Apps, onPress: args.onPress, children: "Apps" })] })),
+};
+export const GridLayout = {
+    render: (args) => (_jsxs(View, { style: { width: 343, gap: 8 }, children: [_jsxs(View, { style: { flexDirection: 'row', gap: 8 }, children: [_jsx(View, { style: { flex: 1 }, children: _jsx(TileButton, { icon: Plus, isFull: true, onPress: args.onPress, children: "Buy" }) }), _jsx(View, { style: { flex: 1 }, children: _jsx(TileButton, { icon: Settings, isFull: true, onPress: args.onPress, children: "Settings" }) })] }), _jsxs(View, { style: { flexDirection: 'row', gap: 8 }, children: [_jsx(View, { style: { flex: 1 }, children: _jsx(TileButton, { icon: User, isFull: true, onPress: args.onPress, children: "Profile" }) }), _jsx(View, { style: { flex: 1 }, children: _jsx(TileButton, { icon: Apps, isFull: true, onPress: args.onPress, children: "Apps" }) }), _jsx(View, { style: { flex: 1 }, children: _jsx(TileButton, { icon: Home, isFull: true, onPress: args.onPress, children: "Home" }) })] })] })),
+};
+export const WidthShowcase = {
+    render: (args) => (_jsxs(View, { style: {
+            width: 320,
+            gap: 8,
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'flex-start',
+        }, children: [_jsx(TileButton, { icon: Settings, onPress: args.onPress, children: "Default width" }), _jsx(TileButton, { icon: Settings, isFull: true, onPress: args.onPress, children: "Full width (isFull)" })] })),
+};
+export const TruncationShowcase = {
+    render: (args) => (_jsx(View, { style: { flexDirection: 'row', gap: 16 }, children: _jsx(View, { style: { width: 80 }, children: _jsx(TileButton, { icon: Settings, isFull: true, onPress: args.onPress, children: "Very long label text" }) }) })),
+};

package/dist/src/lib/Components/TileButton/index.d.ts

@@ -0,0 +1,3 @@
+export * from './TileButton';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/lib/Components/TileButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/TileButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}

package/dist/src/lib/Components/TileButton/index.js

@@ -0,0 +1,2 @@
+export * from './TileButton';
+export * from './types';

package/dist/src/lib/Components/TileButton/types.d.ts

@@ -0,0 +1,35 @@
+import { ComponentType, ReactNode } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import { StyledPressableProps } from '../../../styles';
+import { IconSize } from '../Icon';
+export type TileButtonProps = {
+    /**
+     * The icon component to render above the label.
+     * Will be rendered at 20px size.
+     */
+    icon: ComponentType<{
+        size?: IconSize;
+        style?: StyleProp<ViewStyle>;
+    }>;
+    /**
+     * The content of the button (label text).
+     */
+    children: ReactNode;
+    /**
+     * Whether the button is disabled.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * If true, the button expands to full width of its container.
+     * @default false
+     */
+    isFull?: boolean;
+    /**
+     * Maximum number of lines for the label text.
+     * Text will be truncated with ellipsis if it exceeds this limit.
+     * @default 2
+     */
+    numberOfLines?: number;
+} & Omit<StyledPressableProps, 'children'>;
+//# sourceMappingURL=types.d.ts.map

package/dist/src/lib/Components/TileButton/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/TileButton/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnC,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,IAAI,EAAE,aAAa,CAAC;QAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;QAAC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;KAAE,CAAC,CAAC;IACvE;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,GAAG,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC"}

package/dist/src/lib/Components/TileButton/types.js

@@ -0,0 +1 @@
+export {};

package/dist/src/lib/Components/Tooltip/GlobalTooltipContext.d.ts

@@ -44,6 +44,6 @@ type GlobalTooltipProviderProps = {
  *   );
  * }
  */
-export declare const GlobalTooltipProvider: React.FC<GlobalTooltipProviderProps>;
+export declare const GlobalTooltipProvider: ({ children, }: GlobalTooltipProviderProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=GlobalTooltipContext.d.ts.map

package/dist/src/lib/Components/Tooltip/GlobalTooltipContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalTooltipContext.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Tooltip/GlobalTooltipContext.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAKZ,SAAS,EACV,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,KAAK,oCAAoC,GAAG;IAC1C,cAAc,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC,CAAC;IACpE,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,MAAM,IAAI,CAAC,CAAC;CACpD,CAAC;AAOF,eAAO,MAAM,2BAA2B;;;yHAA+B,CAAC;AAExE;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,QAAO;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACzC,WAAW,EAAE,MAAM,IAAI,CAAC;CAgBzB,CAAC;AAEF,KAAK,0BAA0B,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAgDtE,CAAC"}
+{"version":3,"file":"GlobalTooltipContext.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Tooltip/GlobalTooltipContext.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAKZ,SAAS,EACV,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,WAAW,GAAG;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,SAAS,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,KAAK,oCAAoC,GAAG;IAC1C,cAAc,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC,CAAC;IACpE,cAAc,EAAE,KAAK,CAAC,gBAAgB,CAAC,MAAM,IAAI,CAAC,CAAC;CACpD,CAAC;AAOF,eAAO,MAAM,2BAA2B;;;yHAA+B,CAAC;AAExE;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,QAAO;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACzC,WAAW,EAAE,MAAM,IAAI,CAAC;CAgBzB,CAAC;AAEF,KAAK,0BAA0B,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,qBAAqB,kBAE/B,0BAA0B,4CA8C5B,CAAC"}

package/dist/src/lib/Components/Tooltip/Tooltip.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { TooltipProps, TooltipTriggerProps, TooltipContentProps } from './types';
 /**
  * The root component that manages a specific tooltip's state.
@@ -25,7 +24,10 @@ import type { TooltipProps, TooltipTriggerProps, TooltipContentProps } from './t
  *   );
  * }
  */
-export declare const Tooltip: React.FC<TooltipProps>;
+export declare const Tooltip: {
+    ({ children, onOpenChange }: TooltipProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
 /**
  * The trigger element that opens the tooltip when pressed.
  *
@@ -34,6 +36,12 @@ export declare const Tooltip: React.FC<TooltipProps>;
  *   <Button>Help</Button>
  * </TooltipTrigger>
  */
-export declare const TooltipTrigger: React.FC<TooltipTriggerProps>;
-export declare const TooltipContent: React.FC<TooltipContentProps>;
+export declare const TooltipTrigger: {
+    ({ children, asChild, style, ...props }: TooltipTriggerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export declare const TooltipContent: {
+    ({ title, content }: TooltipContentProps): null;
+    displayName: string;
+};
 //# sourceMappingURL=Tooltip.d.ts.map

package/dist/src/lib/Components/Tooltip/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAUvE,OAAO,KAAK,EACV,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAEjB;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA4B1C,CAAC;AAGF;;;;;;;GAOG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAmCxD,CAAC;AAGF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAiBxD,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Tooltip/Tooltip.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EACV,YAAY,EACZ,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAEjB;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,OAAO;iCAAgC,YAAY;;CA4B/D,CAAC;AAGF;;;;;;;GAOG;AACH,eAAO,MAAM,cAAc;6CAKxB,mBAAmB;;CA8BrB,CAAC;AAGF,eAAO,MAAM,cAAc;yBAAwB,mBAAmB;;CAcrE,CAAC"}

package/dist/src/lib/Components/Tooltip/Tooltip.js

@@ -76,7 +76,7 @@ export const TooltipTrigger = ({ children, asChild = false, style, ...props }) =
     return (_jsx(Comp, { ...props, style: style, onPress: handlePress, children: children }));
 };
 TooltipTrigger.displayName = 'TooltipTrigger';
-export const TooltipContent = ({ title, content, }) => {
+export const TooltipContent = ({ title, content }) => {
     const { setContentData } = useTooltipSafeContext({
         consumerName: 'TooltipContent',
         contextRequired: true,

package/dist/src/lib/Components/Tooltip/TooltipContext.d.ts

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import { ReactNode } from 'react';
 export type TooltipContentData = {
     title?: string;
     content?: ReactNode;
@@ -26,6 +26,6 @@ type TooltipContextProviderProps = {
  * Internal context provider for an individual Tooltip component.
  * This is used automatically by the Tooltip component.
  */
-export declare const TooltipContextProvider: React.FC<TooltipContextProviderProps>;
+export declare const TooltipContextProvider: ({ tooltipId, open, setOpen, contentData, setContentData, children, }: TooltipContextProviderProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=TooltipContext.d.ts.map

package/dist/src/lib/Components/Tooltip/TooltipContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipContext.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Tooltip/TooltipContext.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACvC,cAAc,EAAE,CAAC,IAAI,EAAE,kBAAkB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3D,CAAC;AAKF,eAAO,MAAM,qBAAqB;;;uFAAyB,CAAC;AAE5D,KAAK,2BAA2B,GAAG;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACvC,cAAc,EAAE,CAAC,IAAI,EAAE,kBAAkB,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAqBxE,CAAC"}
+{"version":3,"file":"TooltipContext.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Tooltip/TooltipContext.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACvC,cAAc,EAAE,CAAC,IAAI,EAAE,kBAAkB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3D,CAAC;AAKF,eAAO,MAAM,qBAAqB;;;uFAAyB,CAAC;AAE5D,KAAK,2BAA2B,GAAG;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,WAAW,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACvC,cAAc,EAAE,CAAC,IAAI,EAAE,kBAAkB,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,sBAAsB,yEAOhC,2BAA2B,4CAc7B,CAAC"}

package/dist/src/lib/Components/Utility/Box/Box.d.ts

@@ -1,4 +1,3 @@
-import { View } from 'react-native';
 /**
  * Box - A layout primitive component with token-constrained style props.
  *
@@ -33,7 +32,5 @@ import { View } from 'react-native';
  * <Box lx={{ marginTop: 's4' }} style={{ width: 127 }} />
  * ```
  */
-export declare const Box: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
-    lx?: import("../../../../styles").LumenViewStyle;
-} & import("react-native").ViewProps & import("react").RefAttributes<View>>>;
+export declare const Box: import("react").MemoExoticComponent<({ lx, ref, style, ...props }: import("../../../../styles").StyledViewProps) => import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=Box.d.ts.map

package/dist/src/lib/Components/Utility/Box/Box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Box/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAGpC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,GAAG;;4EAAyB,CAAC"}
+{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Box/Box.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,GAAG,8JAAyB,CAAC"}

package/dist/src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.d.ts

@@ -1,5 +1,4 @@
-import type { View } from 'react-native';
-import type { LinearGradientDirection } from './types';
+import type { LinearGradientProps } from './types';
 /**
  * LinearGradient - A container component that renders a linear gradient background.
  *
@@ -22,11 +21,5 @@ import type { LinearGradientDirection } from './types';
  *   lx={{ height: 's200', borderRadius: 'lg' }}
  * />
  */
-export declare const LinearGradient: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
-    stops: import("../gradient.types").GradientStop[];
-    children?: import("react").ReactNode;
-    direction?: LinearGradientDirection | number;
-} & {
-    lx?: import("../../../../../styles").LumenViewStyle;
-} & import("react-native").ViewProps & import("react").RefAttributes<View>>>;
+export declare const LinearGradient: import("react").MemoExoticComponent<({ direction, stops, children, lx, ref, ...props }: LinearGradientProps) => import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=LinearGradient.d.ts.map

package/dist/src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LinearGradient.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAUzC,OAAO,KAAK,EAEV,uBAAuB,EAExB,MAAM,SAAS,CAAC;AAwCjB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,cAAc;;;;;;4EA8C1B,CAAC"}
+{"version":3,"file":"LinearGradient.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAGV,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAwCjB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,cAAc,0FAQtB,mBAAmB,6CA2CvB,CAAC"}

package/dist/src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, memo, useId, useMemo } from 'react';
+import { memo, useId, useMemo } from 'react';
 import { StyleSheet } from 'react-native';
 import Svg, { Defs, LinearGradient as SvgLinearGradient, Rect, Stop, } from 'react-native-svg';
 import { useTheme } from '../../../../../styles';
@@ -60,7 +60,7 @@ const styles = StyleSheet.create({
  *   lx={{ height: 's200', borderRadius: 'lg' }}
  * />
  */
-export const LinearGradient = memo(forwardRef(({ direction = 'to-bottom', stops, children, lx = {}, ...props }, ref) => {
+export const LinearGradient = memo(({ direction = 'to-bottom', stops, children, lx = {}, ref, ...props }) => {
     const gradientId = useId();
     const { theme } = useTheme();
     const coordinates = useMemo(() => {
@@ -71,5 +71,5 @@ export const LinearGradient = memo(forwardRef(({ direction = 'to-bottom', stops,
     }, [direction]);
     const processedStops = useMemo(() => processGradientStops(stops, theme.colors.bg), [stops, theme.colors.bg]);
     return (_jsxs(Box, { ref: ref, lx: { overflow: 'hidden', ...lx }, ...props, children: [_jsxs(Svg, { style: styles.gradient, preserveAspectRatio: 'none', children: [_jsx(Defs, { children: _jsx(SvgLinearGradient, { id: gradientId, ...coordinates, children: processedStops.map((stop, index) => (_jsx(Stop, { offset: `${stop.offset * 100}%`, stopColor: stop.color, stopOpacity: stop.opacity }, index))) }) }), _jsx(Rect, { x: '0', y: '0', width: '100%', height: '100%', fill: `url(#${gradientId})` })] }), children] }));
-}));
+});
 LinearGradient.displayName = 'LinearGradient';

package/dist/src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.d.ts

@@ -1,4 +1,4 @@
-import type { View } from 'react-native';
+import type { RadialGradientProps } from './types';
 /**
  * RadialGradient - A container component that renders a radial gradient background.
  *
@@ -21,11 +21,5 @@ import type { View } from 'react-native';
  * />
  * ```
  */
-export declare const RadialGradient: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
-    stops: import("../gradient.types").GradientStop[];
-    children?: import("react").ReactNode;
-    center?: import("./types").RadialGradientCenter;
-} & {
-    lx?: import("../../../../../styles").LumenViewStyle;
-} & import("react-native").ViewProps & import("react").RefAttributes<View>>>;
+export declare const RadialGradient: import("react").MemoExoticComponent<({ center, stops, children, lx, ref, ...props }: RadialGradientProps) => import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=RadialGradient.d.ts.map

package/dist/src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadialGradient.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAsBzC;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,cAAc;;;;;;4EAqD1B,CAAC"}
+{"version":3,"file":"RadialGradient.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAYnD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,cAAc,uFAQtB,mBAAmB,6CAkDvB,CAAC"}

package/dist/src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, memo, useId, useMemo } from 'react';
+import { memo, useId, useMemo } from 'react';
 import { StyleSheet } from 'react-native';
 import Svg, { Defs, RadialGradient as SvgRadialGradient, Rect, Stop, } from 'react-native-svg';
 import { useTheme } from '../../../../../styles';
@@ -35,7 +35,7 @@ const styles = StyleSheet.create({
  * />
  * ```
  */
-export const RadialGradient = memo(forwardRef(({ center = DEFAULT_CENTER, stops, children, lx = {}, ...props }, ref) => {
+export const RadialGradient = memo(({ center = DEFAULT_CENTER, stops, children, lx = {}, ref, ...props }) => {
     const gradientId = useId();
     const { theme } = useTheme();
     const processedStops = useMemo(() => {
@@ -48,5 +48,5 @@ export const RadialGradient = memo(forwardRef(({ center = DEFAULT_CENTER, stops,
         };
     }, [center]);
     return (_jsxs(Box, { ref: ref, lx: { overflow: 'hidden', ...lx }, ...props, children: [_jsxs(Svg, { style: styles.gradient, preserveAspectRatio: 'none', children: [_jsx(Defs, { children: _jsx(SvgRadialGradient, { id: gradientId, cx: centerCoordinates.cx, cy: centerCoordinates.cy, rx: '50%', ry: '50%', fx: centerCoordinates.cx, fy: centerCoordinates.cy, children: processedStops.map((stop, index) => (_jsx(Stop, { offset: `${stop.offset * 100}%`, stopColor: stop.color, stopOpacity: stop.opacity }, index))) }) }), _jsx(Rect, { x: '0', y: '0', width: '100%', height: '100%', fill: `url(#${gradientId})` })] }), children] }));
-}));
+});
 RadialGradient.displayName = 'RadialGradient';

package/dist/src/lib/Components/Utility/Gradient/utils/resolveGradientColor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"resolveGradientColor.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Utility/Gradient/utils/resolveGradientColor.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,KAAK,EAAwB,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5E,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC;AAI7D;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,GAC/B,OAAO,MAAM,EACb,UAAU,gBAAgB,KACzB,MAMF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,GAC/B,OAAO,YAAY,EAAE,EACrB,UAAU,gBAAgB,KACzB,KAAK,CAAC;IACP,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB,CAuBA,CAAC"}
+{"version":3,"file":"resolveGradientColor.d.ts","sourceRoot":"","sources":["../../../../../../../src/lib/Components/Utility/Gradient/utils/resolveGradientColor.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,KAAK,EAAwB,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE5E,KAAK,gBAAgB,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC;AAI7D;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,UACxB,MAAM,YACH,gBAAgB,KACzB,MAMF,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,UACxB,YAAY,EAAE,YACX,gBAAgB,KACzB,KAAK,CAAC;IACP,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB,CAuBA,CAAC"}

package/dist/src/lib/Components/Utility/Pressable/Pressable.d.ts

@@ -28,9 +28,5 @@
  * </Pressable>
  * ```
  */
-export declare const Pressable: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
-    lx?: import("../../../../styles").LumenViewStyle;
-} & Omit<import("react-native").PressableProps, "style"> & {
-    style?: import("../../../../styles").PressableStyleItem;
-} & import("react").RefAttributes<import("react-native").View>>>;
+export declare const Pressable: import("react").MemoExoticComponent<({ lx, ref, style, ...props }: import("../../../../styles").StyledPressableProps) => import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=Pressable.d.ts.map

package/dist/src/lib/Components/Utility/Pressable/Pressable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pressable.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Pressable/Pressable.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,SAAS;;;;gEAAqC,CAAC"}
+{"version":3,"file":"Pressable.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Pressable/Pressable.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,SAAS,mKAAqC,CAAC"}

package/dist/src/lib/Components/Utility/Text/Text.d.ts

@@ -1,4 +1,3 @@
-import { Text as RNText } from 'react-native';
 /**
  * Text - A typography component with typography support and token-constrained style props.
  *
@@ -32,8 +31,5 @@ import { Text as RNText } from 'react-native';
  * />
  * ```
  */
-export declare const Text: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
-    lx?: import("../../../../styles").LumenTextStyle;
-    typography?: keyof import("../../../../styles").LumenStyleSheetTheme["typographies"];
-} & import("react-native").TextProps & import("react").RefAttributes<RNText>>>;
+export declare const Text: import("react").MemoExoticComponent<({ typography, lx, ref, style, ...props }: import("../../../../styles").StyledTextProps) => import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=Text.d.ts.map

package/dist/src/lib/Components/Utility/Text/Text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Text/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,MAAM,EAAE,MAAM,cAAc,CAAC;AAG9C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,IAAI;;uBAJW,iEAIf;8EAA+B,CAAC"}
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Text/Text.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAO,MAAM,IAAI,0KAA2B,CAAC"}

package/dist/src/lib/Components/Utility/Text/Text.stories.d.ts

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

package/dist/src/lib/Components/Utility/Text/Text.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Text.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Text/Text.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAY3B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,IAAI,EAAE,KAiBlB,CAAC"}
+{"version":3,"file":"Text.stories.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/Components/Utility/Text/Text.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAEvE,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,SAAS,CAYzB,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;AAEjC,eAAO,MAAM,IAAI,EAAE,KAiBlB,CAAC"}

package/dist/src/lib/Components/Wrap/Wrap.d.ts

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import { WrapProps } from './types';
-export declare const Wrap: FC<WrapProps>;
+export declare const Wrap: ({ if: condition, with: wrapper, children }: WrapProps) => import("react").ReactNode;
 //# sourceMappingURL=Wrap.d.ts.map

package/dist/src/lib/Components/Wrap/Wrap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Wrap.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Wrap/Wrap.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAC3B,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,eAAO,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAM9B,CAAC"}
+{"version":3,"file":"Wrap.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Wrap/Wrap.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEpC,eAAO,MAAM,IAAI,+CAAgD,SAAS,8BAEzE,CAAC"}

package/dist/src/lib/Components/Wrap/Wrap.js

@@ -1,3 +1,3 @@
-export const Wrap = ({ if: condition, with: wrapper, children, }) => {
+export const Wrap = ({ if: condition, with: wrapper, children }) => {
     return condition ? wrapper(children) : children;
 };

package/dist/src/lib/Components/Wrap/types.d.ts

@@ -1,6 +1,6 @@
-import { PropsWithChildren, ReactNode } from 'react';
+import { PropsWithChildren, ReactNode, ReactElement } from 'react';
 export type WrapProps = PropsWithChildren & {
     if: boolean;
-    with: (children: ReactNode) => JSX.Element;
+    with: (children: ReactNode) => ReactElement;
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/src/lib/Components/Wrap/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Wrap/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD,MAAM,MAAM,SAAS,GAAG,iBAAiB,GAAG;IAC1C,EAAE,EAAE,OAAO,CAAC;IACZ,IAAI,EAAE,CAAC,QAAQ,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC;CAC5C,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/lib/Components/Wrap/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAEnE,MAAM,MAAM,SAAS,GAAG,iBAAiB,GAAG;IAC1C,EAAE,EAAE,OAAO,CAAC;IACZ,IAAI,EAAE,CAAC,QAAQ,EAAE,SAAS,KAAK,YAAY,CAAC;CAC7C,CAAC"}

package/dist/src/lib/Components/index.d.ts

@@ -20,5 +20,6 @@ export * from './Utility';
 export * from './TextInput';
 export * from './ThemeProvider';
 export * from './Tile';
+export * from './TileButton';
 export * from './Tooltip';
 //# sourceMappingURL=index.d.ts.map

package/dist/src/lib/Components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC"}

package/dist/src/lib/Components/index.js

@@ -20,4 +20,5 @@ export * from './Utility';
 export * from './TextInput';
 export * from './ThemeProvider';
 export * from './Tile';
+export * from './TileButton';
 export * from './Tooltip';

package/dist/src/lib/StyleSystem/index.d.ts

@@ -0,0 +1,2 @@
+export * from './lx';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/lib/StyleSystem/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/StyleSystem/index.ts"],"names":[],"mappings":"AAAA,cAAc,MAAM,CAAC"}

package/dist/src/lib/StyleSystem/index.js

@@ -0,0 +1 @@
+export * from './lx';

package/dist/src/lib/StyleSystem/lx/BorderRadius/BorderRadiusTable.d.ts

@@ -0,0 +1,2 @@
+export declare const BorderRadiusTable: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BorderRadiusTable.d.ts.map

package/dist/src/lib/StyleSystem/lx/BorderRadius/BorderRadiusTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BorderRadiusTable.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/StyleSystem/lx/BorderRadius/BorderRadiusTable.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB,+CAgD7B,CAAC"}

package/dist/src/lib/StyleSystem/lx/BorderRadius/BorderRadiusTable.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { resolveTheme, getSampleAccentColor } from '../';
+export const BorderRadiusTable = () => {
+    const borderRadius = resolveTheme().borderRadius;
+    const cells = Object.entries(borderRadius);
+    const accentColor = getSampleAccentColor();
+    const formatCSSToken = (key) => {
+        return `--border-radius-${key}`;
+    };
+    return (_jsxs("table", { style: { width: '100%' }, children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: "Name" }), _jsx("th", { children: "Theme object" }), _jsx("th", { children: "Value" }), _jsx("th", { children: "Sample" })] }) }), _jsx("tbody", { children: cells.map(([key, value], i) => (_jsxs("tr", { children: [_jsx("td", { children: _jsx("code", { children: formatCSSToken(key) }) }), _jsx("td", { children: _jsx("code", { children: `theme.borderRadius.${key}` }) }), _jsx("td", { children: _jsx("code", { children: `${value}px` }) }), _jsx("td", { children: _jsx(View, { style: { paddingVertical: 12 }, children: _jsx(View, { style: {
+                                        width: 64,
+                                        height: 64,
+                                        backgroundColor: accentColor,
+                                        borderRadius: value,
+                                    } }) }) })] }, i))) })] }));
+};

package/dist/src/lib/StyleSystem/lx/BorderRadius/index.d.ts

@@ -0,0 +1,2 @@
+export { BorderRadiusTable } from './BorderRadiusTable';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/lib/StyleSystem/lx/BorderRadius/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/StyleSystem/lx/BorderRadius/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/src/lib/StyleSystem/lx/BorderRadius/index.js

@@ -0,0 +1 @@
+export { BorderRadiusTable } from './BorderRadiusTable';

package/dist/src/lib/StyleSystem/lx/BorderWidth/BorderWidthTable.d.ts

@@ -0,0 +1,2 @@
+export declare const BorderWidthTable: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BorderWidthTable.d.ts.map

package/dist/src/lib/StyleSystem/lx/BorderWidth/BorderWidthTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BorderWidthTable.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/StyleSystem/lx/BorderWidth/BorderWidthTable.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,gBAAgB,+CAgD5B,CAAC"}