@apple-pie/slice-native 0.1.3 → 0.1.6

package/dist/types/native/src/components/SliceTextInput/_types.d.ts

@@ -0,0 +1,36 @@
+import type { TextInputProps } from 'react-native';
+import type { BaseAnimationBuilder, LayoutAnimationFunction } from 'react-native-reanimated';
+export interface SliceTextInputProps extends TextInputProps {
+    /**
+     * emits directive focus event
+     */
+    didFocus?: (focused: boolean) => void;
+    /**
+     * enables applying animations when the input layout changes using reanimated layout functions
+     */
+    layout?: typeof BaseAnimationBuilder | BaseAnimationBuilder | LayoutAnimationFunction;
+    /**
+     * When true, blur clears the input and calls onChangeText with an empty string. Default: false.
+     */
+    blurClears?: boolean;
+    /**
+     * Adds a slice icon to the start of the input field
+     */
+    icon?: string;
+    /**
+     * Optionally define the icon color
+     */
+    iconColor?: string;
+    /**
+     * Optionally define the icon size
+     */
+    iconSize?: number;
+    /**
+     * Optionally hide icon when input is focused - default = true
+     */
+    hideIconOnFocus?: boolean;
+    /**
+     * Expose a way to set focus on input from external events
+     */
+    focused?: boolean;
+}

package/dist/types/native/src/components/SliceTextInput/index.d.ts

@@ -0,0 +1,2 @@
+export { SliceTextInput } from './SliceTextInput';
+export type { SliceTextInputProps } from './_types';

package/dist/types/native/src/components/index.d.ts

@@ -0,0 +1,8 @@
+export { SliceIcon, SliceIcons } from './SliceIcon';
+export type { IconProps, SliceIconProps } from './SliceIcon';
+export { StyledText } from './SliceText';
+export type { StyledTextProps } from './SliceText';
+export { SliceButton } from './SliceButton';
+export type { SliceButtonProps } from './SliceButton';
+export { SliceTextInput } from './SliceTextInput';
+export type { SliceTextInputProps } from './SliceTextInput';

package/dist/types/native/src/hooks/index.d.ts

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

package/dist/types/native/src/hooks/useCreateThemedStyles/index.d.ts

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

package/dist/types/native/src/hooks/useCreateThemedStyles/useCreateThemedStyles.d.ts

@@ -0,0 +1,7 @@
+import type { ImageStyle, TextStyle, ViewStyle } from 'react-native';
+import type { SliceNativeTheme } from '../../theme';
+/** Resolve native styles using the current provider theme. Keep the factory stable
+ * (outside the component, or with useCallback) to reuse styles across renders. */
+export declare function useCreateThemedStyles<T extends {
+    [K in keyof T]: ViewStyle | TextStyle | ImageStyle;
+}>(styles: (theme: SliceNativeTheme) => T): T;

package/dist/types/native/src/providers/SliceThemeProvider.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode } from 'react';
+import { type SliceNativeTheme } from '../theme';
+export type ThemePreference = 'system' | 'light' | 'dark';
+export type ThemeContextValue = {
+    theme: SliceNativeTheme;
+    mode: 'light' | 'dark';
+    preference: ThemePreference;
+    setPreference?: (preference: ThemePreference) => void;
+};
+export declare function SliceThemeProvider({ preference, onPreferenceChange, children, }: {
+    preference?: ThemePreference;
+    onPreferenceChange?: (preference: ThemePreference) => void;
+    children: ReactNode;
+}): import("react").JSX.Element;
+export declare function useSliceContext(): ThemeContextValue;
+export declare function useSliceTheme(): SliceNativeTheme;

package/dist/types/native/src/providers/index.d.ts

@@ -0,0 +1,2 @@
+export { SliceThemeProvider, useSliceTheme, useSliceContext } from './SliceThemeProvider';
+export type { ThemePreference, ThemeContextValue } from './SliceThemeProvider';

package/dist/types/native/{theme → src/theme}/index.d.ts

@@ -1,9 +1,9 @@
 import type { TextStyle, ViewStyle } from 'react-native';
-import { light, coreColors as webCore } from '../../src/theme/colors/colors';
-import { corners } from '../../src/theme/corners/corners';
-import { elevations } from '../../src/theme/elevations/elevations';
-import { spacing } from '../../src/theme/spacing/spacing';
-import { type as webType } from '../../src/theme/type/type';
+import { light, coreColors as webCore } from '../../../src/theme/colors/colors';
+import { corners } from '../../../src/theme/corners/corners';
+import { elevations } from '../../../src/theme/elevations/elevations';
+import { spacing } from '../../../src/theme/spacing/spacing';
+import { type as webType } from '../../../src/theme/type/type';
 export { corners, spacing, elevations };
 export type NativeTypography = Record<keyof typeof webType, TextStyle>;
 type ShadowKey = 'surface-shadow-soft' | 'surface-shadow-strong';

package/dist/types/native/src/utils/index.d.ts

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

package/dist/types/native/src/utils/typography/index.d.ts

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

package/dist/types/native/src/utils/typography/typography.d.ts

@@ -0,0 +1,7 @@
+import type { TextStyle } from 'react-native';
+/**
+ * Simple utility to take text style and returns a defined line height factor
+ * Since there is no relative/percent in native, looks for the fontsize and
+ * derives an absolute line height from the font size
+ */
+export declare function lineHeightTextStyle(styles: TextStyle, lineHeightFactor?: number): TextStyle;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@apple-pie/slice-native",
-	"version": "0.1.3",
+	"version": "0.1.6",
 	"description": "React Native icons and design tokens for Slice",
 	"author": "Uris Dacosta",
 	"license": "ISC",
@@ -18,19 +18,47 @@
 		},
 		"./package.json": "./package.json",
 		"./theme": {
-			"types": "./dist/types/native/theme/index.d.ts",
+			"types": "./dist/types/native/src/theme/index.d.ts",
 			"react-native": "./dist/esm/theme.mjs",
 			"import": "./dist/esm/theme.mjs",
 			"require": "./dist/cjs/theme.js"
+		},
+		"./components": {
+			"types": "./dist/types/native/src/components/index.d.ts",
+			"react-native": "./dist/esm/components.mjs",
+			"import": "./dist/esm/components.mjs",
+			"require": "./dist/cjs/components.js"
+		},
+		"./hooks": {
+			"types": "./dist/types/native/src/hooks/index.d.ts",
+			"react-native": "./dist/esm/hooks.mjs",
+			"import": "./dist/esm/hooks.mjs",
+			"require": "./dist/cjs/hooks.js"
+		},
+		"./providers": {
+			"types": "./dist/types/native/src/providers/index.d.ts",
+			"react-native": "./dist/esm/providers.mjs",
+			"import": "./dist/esm/providers.mjs",
+			"require": "./dist/cjs/providers.js"
+		},
+		"./utils": {
+			"types": "./dist/types/native/src/utils/index.d.ts",
+			"react-native": "./dist/esm/utils.mjs",
+			"import": "./dist/esm/utils.mjs",
+			"require": "./dist/cjs/utils.js"
 		}
 	},
 	"files": ["dist"],
 	"sideEffects": false,
 	"scripts": {
 		"test": "vitest run --config vitest.config.mts",
+		"test:package": "npm run build && node scripts/check-package.mjs",
+		"coverage": "vitest run --config vitest.config.mts --coverage",
 		"lint": "biome format --write . && biome check . && npm run typecheck",
 		"lint:ci": "biome ci . && npm run typecheck",
 		"build": "npm run generate && node scripts/build.mjs",
+		"pack:tarball": "node scripts/pack.mjs",
+		"pack": "node scripts/pack.mjs",
 		"prepack": "npm run build",
 		"generate": "node scripts/generate-icons.mjs",
 		"typecheck": "tsc --noEmit -p tsconfig.json"
@@ -47,6 +75,7 @@
 	"peerDependencies": {
 		"react": "^18.0.0 || ^19.0.0",
 		"react-native": ">=0.80.0 <1.0.0",
-		"react-native-svg": "^15.0.0"
+		"react-native-svg": "^15.0.0",
+		"react-native-reanimated": "^4.0.0"
 	}
 }

package/dist/types/native/components/Icon/NativeIcon.d.ts

@@ -1,2 +0,0 @@
-import type { IconProps } from './_types';
-export declare const NativeIcon: import("react").MemoExoticComponent<(props: IconProps) => import("react").JSX.Element | null>;

package/dist/types/native/components/Icon/index.d.ts

@@ -1,3 +0,0 @@
-export { NativeIcon, NativeIcon as Icon } from './NativeIcon';
-export type { IconProps } from './_types';
-export { SliceIcons } from './icons';