@robin-ux/native 0.1.0

package/.eslintrc.js

@@ -0,0 +1,5 @@
+module.exports = {
+  root: true,
+  extends: ['universe/native', 'universe/web'],
+  ignorePatterns: ['build'],
+};

package/README.md

@@ -0,0 +1,35 @@
+# robin-ux-native
+
+Native components for android and iOS
+
+# API documentation
+
+- [Documentation for the latest stable release](https://docs.expo.dev/versions/latest/sdk/robin-ux-native/)
+- [Documentation for the main branch](https://docs.expo.dev/versions/unversioned/sdk/robin-ux-native/)
+
+# Installation in managed Expo projects
+
+For [managed](https://docs.expo.dev/archive/managed-vs-bare/) Expo projects, please follow the installation instructions in the [API documentation for the latest stable release](#api-documentation). If you follow the link and there is no documentation available then this library is not yet usable within managed projects — it is likely to be included in an upcoming Expo SDK release.
+
+# Installation in bare React Native projects
+
+For bare React Native projects, you must ensure that you have [installed and configured the `expo` package](https://docs.expo.dev/bare/installing-expo-modules/) before continuing.
+
+### Add the package to your npm dependencies
+
+```
+npm install robin-ux-native
+```
+
+### Configure for Android
+
+
+
+
+### Configure for iOS
+
+Run `npx pod-install` after installing the npm package.
+
+# Contributing
+
+Contributions are very welcome! Please refer to guidelines described in the [contributing guide]( https://github.com/expo/expo#contributing).

package/android/build.gradle

@@ -0,0 +1,43 @@
+apply plugin: 'com.android.library'
+
+group = 'expo.modules.robinuxnative'
+version = '0.1.0'
+
+def expoModulesCorePlugin = new File(project(":expo-modules-core").projectDir.absolutePath, "ExpoModulesCorePlugin.gradle")
+apply from: expoModulesCorePlugin
+applyKotlinExpoModulesCorePlugin()
+useCoreDependencies()
+useExpoPublishing()
+
+// If you want to use the managed Android SDK versions from expo-modules-core, set this to true.
+// The Android SDK versions will be bumped from time to time in SDK releases and may introduce breaking changes in your module code.
+// Most of the time, you may like to manage the Android SDK versions yourself.
+def useManagedAndroidSdkVersions = false
+if (useManagedAndroidSdkVersions) {
+  useDefaultAndroidSdkVersions()
+} else {
+  buildscript {
+    // Simple helper that allows the root project to override versions declared by this library.
+    ext.safeExtGet = { prop, fallback ->
+      rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
+    }
+  }
+  project.android {
+    compileSdkVersion safeExtGet("compileSdkVersion", 36)
+    defaultConfig {
+      minSdkVersion safeExtGet("minSdkVersion", 24)
+      targetSdkVersion safeExtGet("targetSdkVersion", 36)
+    }
+  }
+}
+
+android {
+  namespace "expo.modules.robinuxnative"
+  defaultConfig {
+    versionCode 1
+    versionName "0.1.0"
+  }
+  lintOptions {
+    abortOnError false
+  }
+}

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,2 @@
+<manifest>
+</manifest>

package/android/src/main/java/expo/modules/robinuxnative/RobinUxNativeModule.kt

@@ -0,0 +1,50 @@
+package expo.modules.robinuxnative
+
+import expo.modules.kotlin.modules.Module
+import expo.modules.kotlin.modules.ModuleDefinition
+import java.net.URL
+
+class RobinUxNativeModule : Module() {
+  // Each module class must implement the definition function. The definition consists of components
+  // that describes the module's functionality and behavior.
+  // See https://docs.expo.dev/modules/module-api for more details about available components.
+  override fun definition() = ModuleDefinition {
+    // Sets the name of the module that JavaScript code will use to refer to the module. Takes a string as an argument.
+    // Can be inferred from module's class name, but it's recommended to set it explicitly for clarity.
+    // The module will be accessible from `requireNativeModule('RobinUxNative')` in JavaScript.
+    Name("RobinUxNative")
+
+    // Defines constant property on the module.
+    Constant("PI") {
+      Math.PI
+    }
+
+    // Defines event names that the module can send to JavaScript.
+    Events("onChange")
+
+    // Defines a JavaScript synchronous function that runs the native code on the JavaScript thread.
+    Function("hello") {
+      "Hello world! 👋"
+    }
+
+    // Defines a JavaScript function that always returns a Promise and whose native code
+    // is by default dispatched on the different thread than the JavaScript runtime runs on.
+    AsyncFunction("setValueAsync") { value: String ->
+      // Send an event to JavaScript.
+      sendEvent("onChange", mapOf(
+        "value" to value
+      ))
+    }
+
+    // Enables the module to be used as a native view. Definition components that are accepted as part of
+    // the view definition: Prop, Events.
+    View(RobinUxNativeView::class) {
+      // Defines a setter for the `url` prop.
+      Prop("url") { view: RobinUxNativeView, url: URL ->
+        view.webView.loadUrl(url.toString())
+      }
+      // Defines an event that the view can send to JavaScript.
+      Events("onLoad")
+    }
+  }
+}

package/android/src/main/java/expo/modules/robinuxnative/RobinUxNativeView.kt

@@ -0,0 +1,30 @@
+package expo.modules.robinuxnative
+
+import android.content.Context
+import android.webkit.WebView
+import android.webkit.WebViewClient
+import expo.modules.kotlin.AppContext
+import expo.modules.kotlin.viewevent.EventDispatcher
+import expo.modules.kotlin.views.ExpoView
+
+class RobinUxNativeView(context: Context, appContext: AppContext) : ExpoView(context, appContext) {
+  // Creates and initializes an event dispatcher for the `onLoad` event.
+  // The name of the event is inferred from the value and needs to match the event name defined in the module.
+  private val onLoad by EventDispatcher()
+
+  // Defines a WebView that will be used as the root subview.
+  internal val webView = WebView(context).apply {
+    layoutParams = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)
+    webViewClient = object : WebViewClient() {
+      override fun onPageFinished(view: WebView, url: String) {
+        // Sends an event to JavaScript. Triggers a callback defined on the view component in JavaScript.
+        onLoad(mapOf("url" to url))
+      }
+    }
+  }
+
+  init {
+    // Adds the WebView to the view hierarchy.
+    addView(webView)
+  }
+}

package/build/RobinUxNative.types.d.ts

@@ -0,0 +1,18 @@
+import type { StyleProp, ViewStyle } from 'react-native';
+export type OnLoadEventPayload = {
+    url: string;
+};
+export type RobinUxNativeModuleEvents = {
+    onChange: (params: ChangeEventPayload) => void;
+};
+export type ChangeEventPayload = {
+    value: string;
+};
+export type RobinUxNativeViewProps = {
+    url: string;
+    onLoad: (event: {
+        nativeEvent: OnLoadEventPayload;
+    }) => void;
+    style?: StyleProp<ViewStyle>;
+};
+//# sourceMappingURL=RobinUxNative.types.d.ts.map

package/build/RobinUxNative.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNative.types.d.ts","sourceRoot":"","sources":["../src/RobinUxNative.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,MAAM,MAAM,kBAAkB,GAAG;IAC/B,GAAG,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG;IACtC,QAAQ,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,CAAC,KAAK,EAAE;QAAE,WAAW,EAAE,kBAAkB,CAAA;KAAE,KAAK,IAAI,CAAC;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B,CAAC"}

package/build/RobinUxNative.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=RobinUxNative.types.js.map

package/build/RobinUxNative.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNative.types.js","sourceRoot":"","sources":["../src/RobinUxNative.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { StyleProp, ViewStyle } from 'react-native';\n\nexport type OnLoadEventPayload = {\n  url: string;\n};\n\nexport type RobinUxNativeModuleEvents = {\n  onChange: (params: ChangeEventPayload) => void;\n};\n\nexport type ChangeEventPayload = {\n  value: string;\n};\n\nexport type RobinUxNativeViewProps = {\n  url: string;\n  onLoad: (event: { nativeEvent: OnLoadEventPayload }) => void;\n  style?: StyleProp<ViewStyle>;\n};\n"]}

package/build/RobinUxNativeModule.d.ts

@@ -0,0 +1,10 @@
+import { NativeModule } from 'expo';
+import { RobinUxNativeModuleEvents } from './RobinUxNative.types';
+declare class RobinUxNativeModule extends NativeModule<RobinUxNativeModuleEvents> {
+    PI: number;
+    hello(): string;
+    setValueAsync(value: string): Promise<void>;
+}
+declare const _default: RobinUxNativeModule;
+export default _default;
+//# sourceMappingURL=RobinUxNativeModule.d.ts.map

package/build/RobinUxNativeModule.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeModule.d.ts","sourceRoot":"","sources":["../src/RobinUxNativeModule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAuB,MAAM,MAAM,CAAC;AAEzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,OAAO,mBAAoB,SAAQ,YAAY,CAAC,yBAAyB,CAAC;IAC/E,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,IAAI,MAAM;IACf,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;CAC5C;;AAGD,wBAAyE"}

package/build/RobinUxNativeModule.js

@@ -0,0 +1,4 @@
+import { requireNativeModule } from 'expo';
+// This call loads the native module object from the JSI.
+export default requireNativeModule('RobinUxNative');
+//# sourceMappingURL=RobinUxNativeModule.js.map

package/build/RobinUxNativeModule.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeModule.js","sourceRoot":"","sources":["../src/RobinUxNativeModule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,mBAAmB,EAAE,MAAM,MAAM,CAAC;AAUzD,yDAAyD;AACzD,eAAe,mBAAmB,CAAsB,eAAe,CAAC,CAAC","sourcesContent":["import { NativeModule, requireNativeModule } from 'expo';\n\nimport { RobinUxNativeModuleEvents } from './RobinUxNative.types';\n\ndeclare class RobinUxNativeModule extends NativeModule<RobinUxNativeModuleEvents> {\n  PI: number;\n  hello(): string;\n  setValueAsync(value: string): Promise<void>;\n}\n\n// This call loads the native module object from the JSI.\nexport default requireNativeModule<RobinUxNativeModule>('RobinUxNative');\n"]}

package/build/RobinUxNativeModule.web.d.ts

@@ -0,0 +1,10 @@
+import { NativeModule } from 'expo';
+import { RobinUxNativeModuleEvents } from './RobinUxNative.types';
+declare class RobinUxNativeModule extends NativeModule<RobinUxNativeModuleEvents> {
+    PI: number;
+    setValueAsync(value: string): Promise<void>;
+    hello(): string;
+}
+declare const _default: typeof RobinUxNativeModule;
+export default _default;
+//# sourceMappingURL=RobinUxNativeModule.web.d.ts.map

package/build/RobinUxNativeModule.web.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeModule.web.d.ts","sourceRoot":"","sources":["../src/RobinUxNativeModule.web.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,YAAY,EAAE,MAAM,MAAM,CAAC;AAEvD,OAAO,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAElE,cAAM,mBAAoB,SAAQ,YAAY,CAAC,yBAAyB,CAAC;IACvE,EAAE,SAAW;IACP,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAGjD,KAAK;CAGN;;AAED,wBAA6E"}

package/build/RobinUxNativeModule.web.js

@@ -0,0 +1,12 @@
+import { registerWebModule, NativeModule } from 'expo';
+class RobinUxNativeModule extends NativeModule {
+    PI = Math.PI;
+    async setValueAsync(value) {
+        this.emit('onChange', { value });
+    }
+    hello() {
+        return 'Hello world! 👋';
+    }
+}
+export default registerWebModule(RobinUxNativeModule, 'RobinUxNativeModule');
+//# sourceMappingURL=RobinUxNativeModule.web.js.map

package/build/RobinUxNativeModule.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeModule.web.js","sourceRoot":"","sources":["../src/RobinUxNativeModule.web.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,MAAM,CAAC;AAIvD,MAAM,mBAAoB,SAAQ,YAAuC;IACvE,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;IACb,KAAK,CAAC,aAAa,CAAC,KAAa;QAC/B,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IACnC,CAAC;IACD,KAAK;QACH,OAAO,iBAAiB,CAAC;IAC3B,CAAC;CACF;AAED,eAAe,iBAAiB,CAAC,mBAAmB,EAAE,qBAAqB,CAAC,CAAC","sourcesContent":["import { registerWebModule, NativeModule } from 'expo';\n\nimport { RobinUxNativeModuleEvents } from './RobinUxNative.types';\n\nclass RobinUxNativeModule extends NativeModule<RobinUxNativeModuleEvents> {\n  PI = Math.PI;\n  async setValueAsync(value: string): Promise<void> {\n    this.emit('onChange', { value });\n  }\n  hello() {\n    return 'Hello world! 👋';\n  }\n}\n\nexport default registerWebModule(RobinUxNativeModule, 'RobinUxNativeModule');\n"]}

package/build/RobinUxNativeView.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { RobinUxNativeViewProps } from './RobinUxNative.types';
+export default function RobinUxNativeView(props: RobinUxNativeViewProps): React.JSX.Element;
+//# sourceMappingURL=RobinUxNativeView.d.ts.map

package/build/RobinUxNativeView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeView.d.ts","sourceRoot":"","sources":["../src/RobinUxNativeView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAK/D,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,qBAEtE"}

package/build/RobinUxNativeView.js

@@ -0,0 +1,7 @@
+import { requireNativeView } from 'expo';
+import * as React from 'react';
+const NativeView = requireNativeView('RobinUxNative');
+export default function RobinUxNativeView(props) {
+    return <NativeView {...props}/>;
+}
+//# sourceMappingURL=RobinUxNativeView.js.map

package/build/RobinUxNativeView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeView.js","sourceRoot":"","sources":["../src/RobinUxNativeView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,MAAM,CAAC;AACzC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,UAAU,GACd,iBAAiB,CAAC,eAAe,CAAC,CAAC;AAErC,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAA6B;IACrE,OAAO,CAAC,UAAU,CAAC,IAAI,KAAK,CAAC,EAAG,CAAC;AACnC,CAAC","sourcesContent":["import { requireNativeView } from 'expo';\nimport * as React from 'react';\n\nimport { RobinUxNativeViewProps } from './RobinUxNative.types';\n\nconst NativeView: React.ComponentType<RobinUxNativeViewProps> =\n  requireNativeView('RobinUxNative');\n\nexport default function RobinUxNativeView(props: RobinUxNativeViewProps) {\n  return <NativeView {...props} />;\n}\n"]}

package/build/RobinUxNativeView.web.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { RobinUxNativeViewProps } from './RobinUxNative.types';
+export default function RobinUxNativeView(props: RobinUxNativeViewProps): React.JSX.Element;
+//# sourceMappingURL=RobinUxNativeView.web.d.ts.map

package/build/RobinUxNativeView.web.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeView.web.d.ts","sourceRoot":"","sources":["../src/RobinUxNativeView.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,qBAUtE"}

package/build/RobinUxNativeView.web.js

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export default function RobinUxNativeView(props) {
+    return (<div>
+      <iframe style={{ flex: 1 }} src={props.url} onLoad={() => props.onLoad({ nativeEvent: { url: props.url } })}/>
+    </div>);
+}
+//# sourceMappingURL=RobinUxNativeView.web.js.map

package/build/RobinUxNativeView.web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RobinUxNativeView.web.js","sourceRoot":"","sources":["../src/RobinUxNativeView.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,KAA6B;IACrE,OAAO,CACL,CAAC,GAAG,CACF;MAAA,CAAC,MAAM,CACL,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,CACnB,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CACf,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,WAAW,EAAE,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,EAEpE;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC","sourcesContent":["import * as React from 'react';\n\nimport { RobinUxNativeViewProps } from './RobinUxNative.types';\n\nexport default function RobinUxNativeView(props: RobinUxNativeViewProps) {\n  return (\n    <div>\n      <iframe\n        style={{ flex: 1 }}\n        src={props.url}\n        onLoad={() => props.onLoad({ nativeEvent: { url: props.url } })}\n      />\n    </div>\n  );\n}\n"]}

package/build/components/Badge.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+export type BadgeStatus = 'active' | 'archived' | 'draft' | string;
+export interface BadgeProps {
+    /** Status or label to display */
+    status: BadgeStatus;
+    /** Badge size */
+    size?: 'sm' | 'md';
+    /** Custom container style */
+    style?: StyleProp<ViewStyle>;
+    /** Custom color override */
+    customColor?: {
+        background: string;
+        text: string;
+        border: string;
+    };
+}
+/**
+ * Badge component for displaying status or labels.
+ *
+ * @example
+ * ```tsx
+ * <Badge status="active" />
+ * <Badge status="draft" size="sm" />
+ * <Badge
+ *   status="Custom"
+ *   customColor={{
+ *     background: '#e0f2fe',
+ *     text: '#0369a1',
+ *     border: '#7dd3fc',
+ *   }}
+ * />
+ * ```
+ */
+export declare function Badge({ status, size, style, customColor }: BadgeProps): React.JSX.Element;
+//# sourceMappingURL=Badge.d.ts.map

package/build/components/Badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAQ,SAAS,EAAE,MAAM,cAAc,CAAC;AAK1D,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,CAAC;AAEnE,MAAM,WAAW,UAAU;IACzB,iCAAiC;IACjC,MAAM,EAAE,WAAW,CAAC;IACpB,iBAAiB;IACjB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,6BAA6B;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,4BAA4B;IAC5B,WAAW,CAAC,EAAE;QACZ,UAAU,EAAE,MAAM,CAAC;QACnB,IAAI,EAAE,MAAM,CAAC;QACb,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,KAAK,CAAC,EAAE,MAAM,EAAE,IAAW,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,UAAU,qBA4D5E"}

package/build/components/Badge.js

@@ -0,0 +1,78 @@
+import React from 'react';
+import { View } from 'react-native';
+import { useThemeSafe } from '../theme';
+import { borderRadius, spacing, useThemedStyles } from '../utils/styles';
+import { Text } from './Text';
+/**
+ * Badge component for displaying status or labels.
+ *
+ * @example
+ * ```tsx
+ * <Badge status="active" />
+ * <Badge status="draft" size="sm" />
+ * <Badge
+ *   status="Custom"
+ *   customColor={{
+ *     background: '#e0f2fe',
+ *     text: '#0369a1',
+ *     border: '#7dd3fc',
+ *   }}
+ * />
+ * ```
+ */
+export function Badge({ status, size = 'md', style, customColor }) {
+    const { colors } = useThemeSafe();
+    // Default status colors
+    const getStatusColors = () => {
+        if (customColor)
+            return customColor;
+        switch (status) {
+            case 'active':
+                return {
+                    background: colors.success + '15', // 15% opacity
+                    text: colors.success,
+                    border: colors.success + '30', // 30% opacity
+                };
+            case 'archived':
+                return {
+                    background: colors.foregroundTertiary + '15',
+                    text: colors.foregroundTertiary,
+                    border: colors.foregroundTertiary + '30',
+                };
+            case 'draft':
+                return {
+                    background: colors.warning + '15',
+                    text: colors.warning,
+                    border: colors.warning + '30',
+                };
+            default:
+                return {
+                    background: colors.muted,
+                    text: colors.foregroundSecondary,
+                    border: colors.border,
+                };
+        }
+    };
+    const statusColors = getStatusColors();
+    const styles = useThemedStyles(() => ({
+        badge: {
+            backgroundColor: statusColors.background,
+            borderWidth: 1,
+            borderColor: statusColors.border,
+            borderRadius: borderRadius.full,
+            paddingHorizontal: size === 'sm' ? spacing.sm : spacing.md,
+            paddingVertical: size === 'sm' ? spacing.xs : spacing.sm,
+            alignSelf: 'flex-start',
+        },
+        text: {
+            color: statusColors.text,
+            fontSize: size === 'sm' ? 10 : 12,
+            fontWeight: '600',
+            textTransform: 'capitalize',
+        },
+    }));
+    return (<View style={[styles.badge, style]}>
+      <Text style={styles.text}>{status}</Text>
+    </View>);
+}
+//# sourceMappingURL=Badge.js.map

package/build/components/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAa,IAAI,EAAa,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAmB9B;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,UAAU,KAAK,CAAC,EAAE,MAAM,EAAE,IAAI,GAAG,IAAI,EAAE,KAAK,EAAE,WAAW,EAAc;IAC3E,MAAM,EAAE,MAAM,EAAE,GAAG,YAAY,EAAE,CAAC;IAElC,wBAAwB;IACxB,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,IAAI,WAAW;YAAE,OAAO,WAAW,CAAC;QAEpC,QAAQ,MAAM,EAAE,CAAC;YACf,KAAK,QAAQ;gBACX,OAAO;oBACL,UAAU,EAAE,MAAM,CAAC,OAAO,GAAG,IAAI,EAAE,cAAc;oBACjD,IAAI,EAAE,MAAM,CAAC,OAAO;oBACpB,MAAM,EAAE,MAAM,CAAC,OAAO,GAAG,IAAI,EAAE,cAAc;iBAC9C,CAAC;YACJ,KAAK,UAAU;gBACb,OAAO;oBACL,UAAU,EAAE,MAAM,CAAC,kBAAkB,GAAG,IAAI;oBAC5C,IAAI,EAAE,MAAM,CAAC,kBAAkB;oBAC/B,MAAM,EAAE,MAAM,CAAC,kBAAkB,GAAG,IAAI;iBACzC,CAAC;YACJ,KAAK,OAAO;gBACV,OAAO;oBACL,UAAU,EAAE,MAAM,CAAC,OAAO,GAAG,IAAI;oBACjC,IAAI,EAAE,MAAM,CAAC,OAAO;oBACpB,MAAM,EAAE,MAAM,CAAC,OAAO,GAAG,IAAI;iBAC9B,CAAC;YACJ;gBACE,OAAO;oBACL,UAAU,EAAE,MAAM,CAAC,KAAK;oBACxB,IAAI,EAAE,MAAM,CAAC,mBAAmB;oBAChC,MAAM,EAAE,MAAM,CAAC,MAAM;iBACtB,CAAC;QACN,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,MAAM,MAAM,GAAG,eAAe,CAAC,GAAG,EAAE,CAAC,CAAC;QACpC,KAAK,EAAE;YACL,eAAe,EAAE,YAAY,CAAC,UAAU;YACxC,WAAW,EAAE,CAAC;YACd,WAAW,EAAE,YAAY,CAAC,MAAM;YAChC,YAAY,EAAE,YAAY,CAAC,IAAI;YAC/B,iBAAiB,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE;YAC1D,eAAe,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,EAAE;YACxD,SAAS,EAAE,YAAqB;SACjC;QACD,IAAI,EAAE;YACJ,KAAK,EAAE,YAAY,CAAC,IAAI;YACxB,QAAQ,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;YACjC,UAAU,EAAE,KAAc;YAC1B,aAAa,EAAE,YAAqB;SACrC;KACF,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CACjC;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,CAC1C;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC","sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\nimport { useThemeSafe } from '../theme';\nimport { borderRadius, spacing, useThemedStyles } from '../utils/styles';\nimport { Text } from './Text';\n\nexport type BadgeStatus = 'active' | 'archived' | 'draft' | string;\n\nexport interface BadgeProps {\n  /** Status or label to display */\n  status: BadgeStatus;\n  /** Badge size */\n  size?: 'sm' | 'md';\n  /** Custom container style */\n  style?: StyleProp<ViewStyle>;\n  /** Custom color override */\n  customColor?: {\n    background: string;\n    text: string;\n    border: string;\n  };\n}\n\n/**\n * Badge component for displaying status or labels.\n *\n * @example\n * ```tsx\n * <Badge status=\"active\" />\n * <Badge status=\"draft\" size=\"sm\" />\n * <Badge\n *   status=\"Custom\"\n *   customColor={{\n *     background: '#e0f2fe',\n *     text: '#0369a1',\n *     border: '#7dd3fc',\n *   }}\n * />\n * ```\n */\nexport function Badge({ status, size = 'md', style, customColor }: BadgeProps) {\n  const { colors } = useThemeSafe();\n\n  // Default status colors\n  const getStatusColors = () => {\n    if (customColor) return customColor;\n\n    switch (status) {\n      case 'active':\n        return {\n          background: colors.success + '15', // 15% opacity\n          text: colors.success,\n          border: colors.success + '30', // 30% opacity\n        };\n      case 'archived':\n        return {\n          background: colors.foregroundTertiary + '15',\n          text: colors.foregroundTertiary,\n          border: colors.foregroundTertiary + '30',\n        };\n      case 'draft':\n        return {\n          background: colors.warning + '15',\n          text: colors.warning,\n          border: colors.warning + '30',\n        };\n      default:\n        return {\n          background: colors.muted,\n          text: colors.foregroundSecondary,\n          border: colors.border,\n        };\n    }\n  };\n\n  const statusColors = getStatusColors();\n\n  const styles = useThemedStyles(() => ({\n    badge: {\n      backgroundColor: statusColors.background,\n      borderWidth: 1,\n      borderColor: statusColors.border,\n      borderRadius: borderRadius.full,\n      paddingHorizontal: size === 'sm' ? spacing.sm : spacing.md,\n      paddingVertical: size === 'sm' ? spacing.xs : spacing.sm,\n      alignSelf: 'flex-start' as const,\n    },\n    text: {\n      color: statusColors.text,\n      fontSize: size === 'sm' ? 10 : 12,\n      fontWeight: '600' as const,\n      textTransform: 'capitalize' as const,\n    },\n  }));\n\n  return (\n    <View style={[styles.badge, style]}>\n      <Text style={styles.text}>{status}</Text>\n    </View>\n  );\n}\n"]}

package/build/components/Button.d.ts

@@ -0,0 +1,43 @@
+import { Ionicons } from "@expo/vector-icons";
+import React from "react";
+import { TouchableOpacityProps, View } from "react-native";
+export type ButtonVariant = "primary" | "secondary" | "ghost" | "destructive";
+export type ButtonSize = "sm" | "md" | "lg";
+export interface ButtonProps extends Omit<TouchableOpacityProps, "style"> {
+    /** Button visual variant */
+    variant?: ButtonVariant;
+    /** Button size */
+    size?: ButtonSize;
+    /** Show loading spinner */
+    loading?: boolean;
+    /** Disable button interactions */
+    disabled?: boolean;
+    /** Icon name from Ionicons */
+    icon?: keyof typeof Ionicons.glyphMap;
+    /** Icon position relative to children */
+    iconPosition?: "left" | "right";
+    /** Button content */
+    children?: React.ReactNode;
+    /** Custom style */
+    style?: TouchableOpacityProps["style"];
+    /** Ref to the button view */
+    ref?: React.RefObject<View | null>;
+}
+/**
+ * Button component with variants, sizes, and icon support.
+ *
+ * @example
+ * ```tsx
+ * <Button variant="primary" onPress={handlePress}>
+ *   Submit
+ * </Button>
+ *
+ * <Button variant="secondary" icon="add" size="sm">
+ *   Add Item
+ * </Button>
+ *
+ * <Button variant="ghost" icon="settings" />
+ * ```
+ */
+export declare function Button({ variant, size, loading, disabled, icon, iconPosition, children, style, ref, ...props }: ButtonProps): React.JSX.Element;
+//# sourceMappingURL=Button.d.ts.map

package/build/components/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAmD,qBAAqB,EAAE,IAAI,EAAa,MAAM,cAAc,CAAC;AAKvH,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,aAAa,CAAC;AAC9E,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,qBAAqB,EAAE,OAAO,CAAC;IACrE,4BAA4B;IAC5B,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,kBAAkB;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8BAA8B;IAC9B,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAC,QAAQ,CAAC;IACtC,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,qBAAqB;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,mBAAmB;IACnB,KAAK,CAAC,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAC;IACvC,6BAA6B;IAC7B,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC;CACtC;AASD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,MAAM,CAAC,EAAE,OAAmB,EAAE,IAAW,EAAE,OAAe,EAAE,QAAgB,EAAE,IAAI,EAAE,YAAqB,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,qBAsGvK"}

package/build/components/Button.js

@@ -0,0 +1,120 @@
+import { Ionicons } from "@expo/vector-icons";
+import React from "react";
+import { ActivityIndicator, StyleSheet, TouchableOpacity, View } from "react-native";
+import { useThemeSafe } from "../theme";
+import { borderRadius, spacing } from "../utils/styles";
+import { Text } from "./Text";
+/**
+ * Button component with variants, sizes, and icon support.
+ *
+ * @example
+ * ```tsx
+ * <Button variant="primary" onPress={handlePress}>
+ *   Submit
+ * </Button>
+ *
+ * <Button variant="secondary" icon="add" size="sm">
+ *   Add Item
+ * </Button>
+ *
+ * <Button variant="ghost" icon="settings" />
+ * ```
+ */
+export function Button({ variant = "primary", size = "md", loading = false, disabled = false, icon, iconPosition = "left", children, style, ref, ...props }) {
+    const { colors } = useThemeSafe();
+    const isDisabled = disabled || loading;
+    // Size configurations
+    const sizeConfigs = {
+        sm: {
+            paddingVertical: spacing.sm,
+            paddingHorizontal: spacing.md,
+            fontSize: 14,
+            iconSize: 16,
+        },
+        md: {
+            paddingVertical: 14,
+            paddingHorizontal: spacing.lg,
+            fontSize: 16,
+            iconSize: 20,
+        },
+        lg: {
+            paddingVertical: 18,
+            paddingHorizontal: spacing.xl,
+            fontSize: 18,
+            iconSize: 24,
+        },
+    };
+    const sizeConfig = sizeConfigs[size];
+    // Variant styles
+    const variantStyles = {
+        primary: {
+            backgroundColor: isDisabled ? colors.primaryLight : colors.primary,
+            textColor: colors.background,
+        },
+        secondary: {
+            backgroundColor: isDisabled ? colors.muted : colors.backgroundSecondary,
+            textColor: colors.foreground,
+        },
+        ghost: {
+            backgroundColor: "transparent",
+            textColor: colors.foreground,
+        },
+        destructive: {
+            backgroundColor: isDisabled ? colors.muted : colors.destructive,
+            textColor: colors.destructiveForeground,
+        },
+    };
+    const currentVariant = variantStyles[variant];
+    const buttonStyle = [
+        styles.button,
+        {
+            backgroundColor: currentVariant.backgroundColor,
+            paddingVertical: sizeConfig.paddingVertical,
+            paddingHorizontal: sizeConfig.paddingHorizontal,
+            opacity: isDisabled ? 0.5 : 1,
+        },
+        style,
+    ];
+    const renderContent = () => {
+        if (loading) {
+            return <ActivityIndicator size="small" color={currentVariant.textColor}/>;
+        }
+        const iconElement = icon ? (<Ionicons name={icon} size={sizeConfig.iconSize} color={currentVariant.textColor} style={children && iconPosition === "left" ? styles.iconLeft : children && iconPosition === "right" ? styles.iconRight : undefined}/>) : null;
+        if (!children) {
+            return iconElement;
+        }
+        return (<View style={styles.content}>
+                {iconPosition === "left" && iconElement}
+                <Text style={{
+                color: currentVariant.textColor,
+                fontSize: sizeConfig.fontSize,
+                fontWeight: "600",
+            }}>
+                    {children}
+                </Text>
+                {iconPosition === "right" && iconElement}
+            </View>);
+    };
+    return (<TouchableOpacity style={buttonStyle} disabled={isDisabled} activeOpacity={0.7} ref={ref} {...props}>
+            {renderContent()}
+        </TouchableOpacity>);
+}
+const styles = StyleSheet.create({
+    button: {
+        borderRadius: borderRadius.full,
+        alignItems: "center",
+        justifyContent: "center",
+    },
+    content: {
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "center",
+    },
+    iconLeft: {
+        marginRight: spacing.sm,
+    },
+    iconRight: {
+        marginLeft: spacing.sm,
+    },
+});
+//# sourceMappingURL=Button.js.map

package/build/components/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Ionicons } from \"@expo/vector-icons\";\nimport React from \"react\";\nimport { ActivityIndicator, StyleSheet, TouchableOpacity, TouchableOpacityProps, View, ViewStyle } from \"react-native\";\nimport { useThemeSafe } from \"../theme\";\nimport { borderRadius, spacing } from \"../utils/styles\";\nimport { Text } from \"./Text\";\n\nexport type ButtonVariant = \"primary\" | \"secondary\" | \"ghost\" | \"destructive\";\nexport type ButtonSize = \"sm\" | \"md\" | \"lg\";\n\nexport interface ButtonProps extends Omit<TouchableOpacityProps, \"style\"> {\n    /** Button visual variant */\n    variant?: ButtonVariant;\n    /** Button size */\n    size?: ButtonSize;\n    /** Show loading spinner */\n    loading?: boolean;\n    /** Disable button interactions */\n    disabled?: boolean;\n    /** Icon name from Ionicons */\n    icon?: keyof typeof Ionicons.glyphMap;\n    /** Icon position relative to children */\n    iconPosition?: \"left\" | \"right\";\n    /** Button content */\n    children?: React.ReactNode;\n    /** Custom style */\n    style?: TouchableOpacityProps[\"style\"];\n    /** Ref to the button view */\n    ref?: React.RefObject<View | null>;\n}\n\ninterface SizeConfig {\n    paddingVertical: number;\n    paddingHorizontal: number;\n    fontSize: number;\n    iconSize: number;\n}\n\n/**\n * Button component with variants, sizes, and icon support.\n *\n * @example\n * ```tsx\n * <Button variant=\"primary\" onPress={handlePress}>\n *   Submit\n * </Button>\n *\n * <Button variant=\"secondary\" icon=\"add\" size=\"sm\">\n *   Add Item\n * </Button>\n *\n * <Button variant=\"ghost\" icon=\"settings\" />\n * ```\n */\nexport function Button({ variant = \"primary\", size = \"md\", loading = false, disabled = false, icon, iconPosition = \"left\", children, style, ref, ...props }: ButtonProps) {\n    const { colors } = useThemeSafe();\n\n    const isDisabled = disabled || loading;\n\n    // Size configurations\n    const sizeConfigs: Record<ButtonSize, SizeConfig> = {\n        sm: {\n            paddingVertical: spacing.sm,\n            paddingHorizontal: spacing.md,\n            fontSize: 14,\n            iconSize: 16,\n        },\n        md: {\n            paddingVertical: 14,\n            paddingHorizontal: spacing.lg,\n            fontSize: 16,\n            iconSize: 20,\n        },\n        lg: {\n            paddingVertical: 18,\n            paddingHorizontal: spacing.xl,\n            fontSize: 18,\n            iconSize: 24,\n        },\n    };\n\n    const sizeConfig = sizeConfigs[size];\n\n    // Variant styles\n    const variantStyles: Record<ButtonVariant, { backgroundColor: string; textColor: string }> = {\n        primary: {\n            backgroundColor: isDisabled ? colors.primaryLight : colors.primary,\n            textColor: colors.background,\n        },\n        secondary: {\n            backgroundColor: isDisabled ? colors.muted : colors.backgroundSecondary,\n            textColor: colors.foreground,\n        },\n        ghost: {\n            backgroundColor: \"transparent\",\n            textColor: colors.foreground,\n        },\n        destructive: {\n            backgroundColor: isDisabled ? colors.muted : colors.destructive,\n            textColor: colors.destructiveForeground,\n        },\n    };\n\n    const currentVariant = variantStyles[variant];\n\n    const buttonStyle: ViewStyle[] = [\n        styles.button,\n        {\n            backgroundColor: currentVariant.backgroundColor,\n            paddingVertical: sizeConfig.paddingVertical,\n            paddingHorizontal: sizeConfig.paddingHorizontal,\n            opacity: isDisabled ? 0.5 : 1,\n        },\n        style as ViewStyle,\n    ];\n\n    const renderContent = () => {\n        if (loading) {\n            return <ActivityIndicator size=\"small\" color={currentVariant.textColor} />;\n        }\n\n        const iconElement = icon ? (\n            <Ionicons\n                name={icon}\n                size={sizeConfig.iconSize}\n                color={currentVariant.textColor}\n                style={children && iconPosition === \"left\" ? styles.iconLeft : children && iconPosition === \"right\" ? styles.iconRight : undefined}\n            />\n        ) : null;\n\n        if (!children) {\n            return iconElement;\n        }\n\n        return (\n            <View style={styles.content}>\n                {iconPosition === \"left\" && iconElement}\n                <Text\n                    style={{\n                        color: currentVariant.textColor,\n                        fontSize: sizeConfig.fontSize,\n                        fontWeight: \"600\",\n                    }}\n                >\n                    {children}\n                </Text>\n                {iconPosition === \"right\" && iconElement}\n            </View>\n        );\n    };\n\n    return (\n        <TouchableOpacity style={buttonStyle} disabled={isDisabled} activeOpacity={0.7} ref={ref} {...props}>\n            {renderContent()}\n        </TouchableOpacity>\n    );\n}\n\nconst styles = StyleSheet.create({\n    button: {\n        borderRadius: borderRadius.full,\n        alignItems: \"center\",\n        justifyContent: \"center\",\n    },\n    content: {\n        flexDirection: \"row\",\n        alignItems: \"center\",\n        justifyContent: \"center\",\n    },\n    iconLeft: {\n        marginRight: spacing.sm,\n    },\n    iconRight: {\n        marginLeft: spacing.sm,\n    },\n});\n"]}