@codeandmoney/soelma 0.0.0-dev.2 → 0.0.0-dev.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,9 +2,10 @@ import { StyleSheet } from "react-native";
2
2
  import { resetUsing } from "../dependencyUsage";
3
3
  import { getDependenciesKeys, subscribe, useForceUpdate } from "./utils";
4
4
 
5
- export function createUseStylesWithoutTheme(getStyles) {
5
+ export function createUseStylesWithoutTheme(getStyles, configVariants) {
6
6
  const scope = {
7
7
  style: null,
8
+ variants: null,
8
9
  forceUpdate: [],
9
10
  unsubscribe: () => {},
10
11
  };
@@ -28,10 +29,16 @@ export function createUseStylesWithoutTheme(getStyles) {
28
29
 
29
30
  initStyle();
30
31
 
31
- function useStyles() {
32
+ function useStyles(variants) {
32
33
  useForceUpdate(scope);
33
34
 
34
- return scope.style;
35
+ const requestedVarians = {};
36
+ for (const key in variants) {
37
+ const value = configVariants[key][variants[key]];
38
+ Object.assign(requestedVarians, value);
39
+ }
40
+
41
+ return { ...scope.style, ...StyleSheet.create({ variants: requestedVarians}) };
35
42
  }
36
43
 
37
44
  return useStyles;
@@ -1,7 +1,33 @@
1
1
  import { StyleSheet } from "react-native";
2
2
  import { DefaultTheme } from "../DefaultTheme";
3
3
 
4
+ // export function makeUseStyles<
5
+ // Theme extends DefaultTheme,
6
+ // T extends StyleSheet.NamedStyles<T> | StyleSheet.NamedStyles<any>,
7
+ // V extends Record<
8
+ // string,
9
+ // StyleSheet.NamedStyles<T> | StyleSheet.NamedStyles<any>
10
+ // >,
11
+ // >(
12
+ // getStyles: (theme: Theme) => T | StyleSheet.NamedStyles<T>,
13
+ // variants: V,
14
+ // ): () => T;
15
+
4
16
  export function makeUseStyles<
5
17
  Theme extends DefaultTheme,
6
18
  T extends StyleSheet.NamedStyles<T> | StyleSheet.NamedStyles<any>,
7
- >(getStyles: (theme: Theme) => T | StyleSheet.NamedStyles<T>): () => T;
19
+ V extends Record<string, StyleSheet.NamedStyles<any>>,
20
+ >(
21
+ getStyles: (theme: Theme) => T | StyleSheet.NamedStyles<T>,
22
+ variants: V,
23
+ ): <Variants extends { [Key in keyof V]: keyof V[Key] }>(
24
+ variants?: Partial<Variants>,
25
+ ) => T & {
26
+ variants: {
27
+ [VKey in keyof Variants]: VKey extends keyof V
28
+ ? V[VKey][Variants[VKey]]
29
+ : never;
30
+ }[keyof Variants];
31
+ } {
32
+ return ((variants: any) => {}) as any;
33
+ }
@@ -1,11 +1,11 @@
1
1
  import { createUseStylesWithoutTheme } from "./createUseStylesWithoutTheme";
2
2
  import { createUseStylesTheme } from "./createUseStylesTheme";
3
3
 
4
- export function makeUseStyles(getStyles) {
4
+ export function makeUseStyles(getStyles, variants) {
5
5
  const hasThemeDependency = getStyles.length === 1;
6
6
 
7
7
  if (!hasThemeDependency) {
8
- return createUseStylesWithoutTheme(getStyles);
8
+ return createUseStylesWithoutTheme(getStyles, variants);
9
9
  }
10
10
 
11
11
  return createUseStylesTheme(getStyles);
File without changes
@@ -0,0 +1,39 @@
1
+ "use strict";
2
+ // import { StyleSheet } from "react-native";
3
+ // import { DefaultTheme } from "../DefaultTheme";
4
+ // // // Source - https://stackoverflow.com/a/50375286
5
+ // // // Posted by jcalz, modified by community. See post 'Timeline' for change history
6
+ // // // Retrieved 2026-01-07, License - CC BY-SA 4.0
7
+ // // type UnionToIntersection<U> = (U extends any ? (x: U) => void : never) extends (
8
+ // // x: infer I,
9
+ // // ) => void
10
+ // // ? I
11
+ // // : never;
12
+ // export function makeUseStyles<
13
+ // Theme extends DefaultTheme,
14
+ // T extends StyleSheet.NamedStyles<T> | StyleSheet.NamedStyles<any>,
15
+ // V extends Record<string, StyleSheet.NamedStyles<any>>,
16
+ // >(
17
+ // getStyles: (theme: Theme) => T | StyleSheet.NamedStyles<T>,
18
+ // variants: V,
19
+ // ): <Variants extends { [Key in keyof V]: keyof V[Key] }>(
20
+ // variants?: Partial<Variants>,
21
+ // ) => T & {
22
+ // variants: {
23
+ // [VKey in keyof Variants]: VKey extends keyof V
24
+ // ? V[VKey][Variants[VKey]]
25
+ // : never;
26
+ // }[keyof Variants];
27
+ // } {
28
+ // return ((variants: any) => {}) as any;
29
+ // }
30
+ // const useStyles = makeUseStyles(() => ({ some: { alignContent: "center" } }), {
31
+ // other: {
32
+ // one: { alignContent: "flex-end", fontStyle: "italic", fontFamily: "Inter" },
33
+ // two: { alignContent: "flex-end" },
34
+ // },
35
+ // more: {
36
+ // lol: { color: "red", width: 123 },
37
+ // },
38
+ // });
39
+ // const res = useStyles({ more: "lol"});
@@ -0,0 +1,43 @@
1
+ // import { StyleSheet } from "react-native";
2
+ // import { DefaultTheme } from "../DefaultTheme";
3
+
4
+ // // // Source - https://stackoverflow.com/a/50375286
5
+ // // // Posted by jcalz, modified by community. See post 'Timeline' for change history
6
+ // // // Retrieved 2026-01-07, License - CC BY-SA 4.0
7
+
8
+ // // type UnionToIntersection<U> = (U extends any ? (x: U) => void : never) extends (
9
+ // // x: infer I,
10
+ // // ) => void
11
+ // // ? I
12
+ // // : never;
13
+
14
+ // export function makeUseStyles<
15
+ // Theme extends DefaultTheme,
16
+ // T extends StyleSheet.NamedStyles<T> | StyleSheet.NamedStyles<any>,
17
+ // V extends Record<string, StyleSheet.NamedStyles<any>>,
18
+ // >(
19
+ // getStyles: (theme: Theme) => T | StyleSheet.NamedStyles<T>,
20
+ // variants: V,
21
+ // ): <Variants extends { [Key in keyof V]: keyof V[Key] }>(
22
+ // variants?: Partial<Variants>,
23
+ // ) => T & {
24
+ // variants: {
25
+ // [VKey in keyof Variants]: VKey extends keyof V
26
+ // ? V[VKey][Variants[VKey]]
27
+ // : never;
28
+ // }[keyof Variants];
29
+ // } {
30
+ // return ((variants: any) => {}) as any;
31
+ // }
32
+
33
+ // const useStyles = makeUseStyles(() => ({ some: { alignContent: "center" } }), {
34
+ // other: {
35
+ // one: { alignContent: "flex-end", fontStyle: "italic", fontFamily: "Inter" },
36
+ // two: { alignContent: "flex-end" },
37
+ // },
38
+ // more: {
39
+ // lol: { color: "red", width: 123 },
40
+ // },
41
+ // });
42
+
43
+ // const res = useStyles({ more: "lol"});
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "access": "public"
5
5
  },
6
- "version": "0.0.0-dev.2",
6
+ "version": "0.0.0-dev.5",
7
7
  "private": false,
8
8
  "main": "index.js",
9
9
  "types": "index.d.ts",
@@ -1,8 +1,3 @@
1
1
  export declare const state: {
2
- insets: {
3
- top: number;
4
- left: number;
5
- bottom: number;
6
- right: number;
7
- };
2
+ insets: import("react-native-safe-area-context").EdgeInsets;
8
3
  };