@impulse-ui-native/primitives 4.0.0 → 5.0.0

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.
Files changed (71) hide show
  1. package/README.md +62 -20
  2. package/dist/components/atoms/avatar.d.mts +1 -1
  3. package/dist/components/atoms/avatar.js +14 -30
  4. package/dist/components/atoms/avatar.js.map +1 -1
  5. package/dist/components/atoms/badge/root.d.mts +1 -1
  6. package/dist/components/atoms/badge/root.js +25 -38
  7. package/dist/components/atoms/badge/root.js.map +1 -1
  8. package/dist/components/atoms/button.d.mts +1 -1
  9. package/dist/components/atoms/button.js +2 -20
  10. package/dist/components/atoms/button.js.map +1 -1
  11. package/dist/components/atoms/circular-progress.js +2 -2
  12. package/dist/components/atoms/circular-progress.js.map +1 -1
  13. package/dist/components/atoms/divider.d.mts +1 -1
  14. package/dist/components/atoms/divider.js +18 -14
  15. package/dist/components/atoms/divider.js.map +1 -1
  16. package/dist/components/atoms/icon-button.d.mts +1 -1
  17. package/dist/components/atoms/icon-button.js +1 -11
  18. package/dist/components/atoms/icon-button.js.map +1 -1
  19. package/dist/components/atoms/progress.d.mts +1 -1
  20. package/dist/components/atoms/progress.js +0 -28
  21. package/dist/components/atoms/progress.js.map +1 -1
  22. package/dist/components/atoms/spinner.d.mts +1 -1
  23. package/dist/components/atoms/spinner.js +8 -29
  24. package/dist/components/atoms/spinner.js.map +1 -1
  25. package/dist/components/atoms/typography.js +25 -1
  26. package/dist/components/atoms/typography.js.map +1 -1
  27. package/dist/components/card/card.d.mts +1 -1
  28. package/dist/components/card/pressable.d.mts +1 -1
  29. package/dist/components/card/pressable.js +2 -20
  30. package/dist/components/card/pressable.js.map +1 -1
  31. package/dist/components/index.d.mts +2 -0
  32. package/dist/components/index.js +1 -0
  33. package/dist/components/index.js.map +1 -1
  34. package/dist/components/list/content.d.mts +11 -0
  35. package/dist/components/list/content.js +27 -0
  36. package/dist/components/list/content.js.map +1 -0
  37. package/dist/components/list/index.d.mts +8 -0
  38. package/dist/components/list/index.js +5 -0
  39. package/dist/components/list/index.js.map +1 -0
  40. package/dist/components/list/item.d.mts +11 -0
  41. package/dist/components/list/item.js +32 -0
  42. package/dist/components/list/item.js.map +1 -0
  43. package/dist/components/list/leading.d.mts +11 -0
  44. package/dist/components/list/leading.js +32 -0
  45. package/dist/components/list/leading.js.map +1 -0
  46. package/dist/components/list/list.d.mts +18 -0
  47. package/dist/components/list/list.js +18 -0
  48. package/dist/components/list/list.js.map +1 -0
  49. package/dist/components/list/pressable.d.mts +11 -0
  50. package/dist/components/list/pressable.js +37 -0
  51. package/dist/components/list/pressable.js.map +1 -0
  52. package/dist/components/list/root.d.mts +11 -0
  53. package/dist/components/list/root.js +33 -0
  54. package/dist/components/list/root.js.map +1 -0
  55. package/dist/components/list/trailing.d.mts +11 -0
  56. package/dist/components/list/trailing.js +32 -0
  57. package/dist/components/list/trailing.js.map +1 -0
  58. package/dist/hocs/create-preset.hoc.d.mts +1 -1
  59. package/dist/hocs/create-preset.hoc.js +23 -8
  60. package/dist/hocs/create-preset.hoc.js.map +1 -1
  61. package/dist/hooks/use-indeterminate-progress-animation.hook.js +3 -24
  62. package/dist/hooks/use-indeterminate-progress-animation.hook.js.map +1 -1
  63. package/dist/index.d.mts +2 -0
  64. package/dist/types/avatar.types.d.mts +1 -1
  65. package/dist/types/index.d.mts +1 -0
  66. package/dist/types/index.js +1 -0
  67. package/dist/types/index.js.map +1 -1
  68. package/dist/types/list.types.d.mts +21 -0
  69. package/dist/types/list.types.js +1 -0
  70. package/dist/types/list.types.js.map +1 -0
  71. package/package.json +5 -5
@@ -9,7 +9,6 @@ import {
9
9
  import { Pressable } from "./pressable";
10
10
  import { Spinner } from "./spinner";
11
11
  const IconButton = memo(function IconButton2({
12
- accessibilityState,
13
12
  size = "medium",
14
13
  variant = "filled",
15
14
  disabled,
@@ -24,14 +23,6 @@ const IconButton = memo(function IconButton2({
24
23
  [size, variant, disabled, loading]
25
24
  );
26
25
  const interactionDisabled = disabled === true || loading;
27
- const resolvedAccessibilityState = useMemo(
28
- () => ({
29
- ...accessibilityState,
30
- busy: loading,
31
- disabled: interactionDisabled
32
- }),
33
- [accessibilityState, interactionDisabled, loading]
34
- );
35
26
  const iconButtonStyles = useMemo(
36
27
  () => [styles.button, style],
37
28
  [styles.button, style]
@@ -40,10 +31,9 @@ const IconButton = memo(function IconButton2({
40
31
  Pressable,
41
32
  {
42
33
  ...props,
43
- accessibilityState: resolvedAccessibilityState,
44
34
  disabled: interactionDisabled,
45
35
  style: iconButtonStyles,
46
- children: loading ? /* @__PURE__ */ jsx(Spinner, { accessible: false, color: styles.icon.color, size }) : /* @__PURE__ */ jsx(Icon, { size, icon, color: styles.icon.color })
36
+ children: loading ? /* @__PURE__ */ jsx(Spinner, { color: styles.icon.color, size }) : /* @__PURE__ */ jsx(Icon, { size, icon, color: styles.icon.color })
47
37
  }
48
38
  );
49
39
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/atoms/icon-button.tsx"],"sourcesContent":["import type { AccessibilityState } from \"react-native\";\nimport { memo, PropsWithChildren, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport { Icon } from \"@impulse-ui-native/icon/components/icon\";\nimport {\n AppTheme,\n getActionStateTokens,\n useThemedStyles,\n} from \"@impulse-ui-native/theme\";\n\nimport { IconButtonProps, IconButtonThemeProps } from \"../../types\";\nimport { Pressable } from \"./pressable\";\nimport { Spinner } from \"./spinner\";\n\nexport const IconButton = memo(function IconButton({\n accessibilityState,\n size = \"medium\",\n variant = \"filled\",\n disabled,\n loading = false,\n style,\n icon,\n ...props\n}: PropsWithChildren<IconButtonProps>) {\n const styles = useThemedStyles(\n themedStyles,\n { size, variant, disabled, loading },\n [size, variant, disabled, loading],\n );\n\n const interactionDisabled = disabled === true || loading;\n\n const resolvedAccessibilityState = useMemo<AccessibilityState>(\n () => ({\n ...accessibilityState,\n busy: loading,\n disabled: interactionDisabled,\n }),\n [accessibilityState, interactionDisabled, loading],\n );\n\n const iconButtonStyles = useMemo(\n () => [styles.button, style],\n [styles.button, style],\n );\n\n return (\n <Pressable\n {...props}\n accessibilityState={resolvedAccessibilityState}\n disabled={interactionDisabled}\n style={iconButtonStyles}\n >\n {loading ? (\n <Spinner accessible={false} color={styles.icon.color} size={size} />\n ) : (\n <Icon size={size} icon={icon} color={styles.icon.color} />\n )}\n </Pressable>\n );\n});\n\nfunction themedStyles(theme: AppTheme, props: IconButtonThemeProps) {\n const { size, variant, disabled, loading } = props;\n\n const iconButtonTokens = theme.components.iconButton;\n const sizeTokens = iconButtonTokens.sizes[size];\n const appearanceTokens = getActionStateTokens(\n iconButtonTokens.variants[variant],\n { disabled, loading },\n );\n\n return StyleSheet.create({\n button: {\n alignItems: \"center\",\n justifyContent: \"center\",\n\n height: sizeTokens.size,\n width: sizeTokens.size,\n padding: sizeTokens.padding,\n\n borderWidth: iconButtonTokens.borderWidth,\n borderRadius: iconButtonTokens.borderRadius,\n\n borderColor: appearanceTokens.borderColor,\n backgroundColor: appearanceTokens.backgroundColor,\n },\n\n icon: {\n color: appearanceTokens.color,\n },\n });\n}\n"],"mappings":"AAuDQ;AAtDR,SAAS,MAAyB,eAAe;AACjD,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AACrB;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AAGP,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AAEjB,MAAM,aAAa,KAAK,SAASA,YAAW;AAAA,EACjD;AAAA,EACA,OAAO;AAAA,EACP,UAAU;AAAA,EACV;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuC;AACrC,QAAM,SAAS;AAAA,IACb;AAAA,IACA,EAAE,MAAM,SAAS,UAAU,QAAQ;AAAA,IACnC,CAAC,MAAM,SAAS,UAAU,OAAO;AAAA,EACnC;AAEA,QAAM,sBAAsB,aAAa,QAAQ;AAEjD,QAAM,6BAA6B;AAAA,IACjC,OAAO;AAAA,MACL,GAAG;AAAA,MACH,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,oBAAoB,qBAAqB,OAAO;AAAA,EACnD;AAEA,QAAM,mBAAmB;AAAA,IACvB,MAAM,CAAC,OAAO,QAAQ,KAAK;AAAA,IAC3B,CAAC,OAAO,QAAQ,KAAK;AAAA,EACvB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,oBAAoB;AAAA,MACpB,UAAU;AAAA,MACV,OAAO;AAAA,MAEN,oBACC,oBAAC,WAAQ,YAAY,OAAO,OAAO,OAAO,KAAK,OAAO,MAAY,IAElE,oBAAC,QAAK,MAAY,MAAY,OAAO,OAAO,KAAK,OAAO;AAAA;AAAA,EAE5D;AAEJ,CAAC;AAED,SAAS,aAAa,OAAiB,OAA6B;AAClE,QAAM,EAAE,MAAM,SAAS,UAAU,QAAQ,IAAI;AAE7C,QAAM,mBAAmB,MAAM,WAAW;AAC1C,QAAM,aAAa,iBAAiB,MAAM,IAAI;AAC9C,QAAM,mBAAmB;AAAA,IACvB,iBAAiB,SAAS,OAAO;AAAA,IACjC,EAAE,UAAU,QAAQ;AAAA,EACtB;AAEA,SAAO,WAAW,OAAO;AAAA,IACvB,QAAQ;AAAA,MACN,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAEhB,QAAQ,WAAW;AAAA,MACnB,OAAO,WAAW;AAAA,MAClB,SAAS,WAAW;AAAA,MAEpB,aAAa,iBAAiB;AAAA,MAC9B,cAAc,iBAAiB;AAAA,MAE/B,aAAa,iBAAiB;AAAA,MAC9B,iBAAiB,iBAAiB;AAAA,IACpC;AAAA,IAEA,MAAM;AAAA,MACJ,OAAO,iBAAiB;AAAA,IAC1B;AAAA,EACF,CAAC;AACH;","names":["IconButton"]}
1
+ {"version":3,"sources":["../../../src/components/atoms/icon-button.tsx"],"sourcesContent":["import { memo, PropsWithChildren, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport { Icon } from \"@impulse-ui-native/icon/components/icon\";\nimport {\n AppTheme,\n getActionStateTokens,\n useThemedStyles,\n} from \"@impulse-ui-native/theme\";\n\nimport { IconButtonProps, IconButtonThemeProps } from \"../../types\";\nimport { Pressable } from \"./pressable\";\nimport { Spinner } from \"./spinner\";\n\nexport const IconButton = memo(function IconButton({\n size = \"medium\",\n variant = \"filled\",\n disabled,\n loading = false,\n style,\n icon,\n ...props\n}: PropsWithChildren<IconButtonProps>) {\n const styles = useThemedStyles(\n themedStyles,\n { size, variant, disabled, loading },\n [size, variant, disabled, loading],\n );\n\n const interactionDisabled = disabled === true || loading;\n\n const iconButtonStyles = useMemo(\n () => [styles.button, style],\n [styles.button, style],\n );\n\n return (\n <Pressable\n {...props}\n disabled={interactionDisabled}\n style={iconButtonStyles}\n >\n {loading ? (\n <Spinner color={styles.icon.color} size={size} />\n ) : (\n <Icon size={size} icon={icon} color={styles.icon.color} />\n )}\n </Pressable>\n );\n});\n\nfunction themedStyles(theme: AppTheme, props: IconButtonThemeProps) {\n const { size, variant, disabled, loading } = props;\n\n const iconButtonTokens = theme.components.iconButton;\n const sizeTokens = iconButtonTokens.sizes[size];\n const appearanceTokens = getActionStateTokens(\n iconButtonTokens.variants[variant],\n { disabled, loading },\n );\n\n return StyleSheet.create({\n button: {\n alignItems: \"center\",\n justifyContent: \"center\",\n\n height: sizeTokens.size,\n width: sizeTokens.size,\n padding: sizeTokens.padding,\n\n borderWidth: iconButtonTokens.borderWidth,\n borderRadius: iconButtonTokens.borderRadius,\n\n borderColor: appearanceTokens.borderColor,\n backgroundColor: appearanceTokens.backgroundColor,\n },\n\n icon: {\n color: appearanceTokens.color,\n },\n });\n}\n"],"mappings":"AA2CQ;AA3CR,SAAS,MAAyB,eAAe;AACjD,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AACrB;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AAGP,SAAS,iBAAiB;AAC1B,SAAS,eAAe;AAEjB,MAAM,aAAa,KAAK,SAASA,YAAW;AAAA,EACjD,OAAO;AAAA,EACP,UAAU;AAAA,EACV;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuC;AACrC,QAAM,SAAS;AAAA,IACb;AAAA,IACA,EAAE,MAAM,SAAS,UAAU,QAAQ;AAAA,IACnC,CAAC,MAAM,SAAS,UAAU,OAAO;AAAA,EACnC;AAEA,QAAM,sBAAsB,aAAa,QAAQ;AAEjD,QAAM,mBAAmB;AAAA,IACvB,MAAM,CAAC,OAAO,QAAQ,KAAK;AAAA,IAC3B,CAAC,OAAO,QAAQ,KAAK;AAAA,EACvB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU;AAAA,MACV,OAAO;AAAA,MAEN,oBACC,oBAAC,WAAQ,OAAO,OAAO,KAAK,OAAO,MAAY,IAE/C,oBAAC,QAAK,MAAY,MAAY,OAAO,OAAO,KAAK,OAAO;AAAA;AAAA,EAE5D;AAEJ,CAAC;AAED,SAAS,aAAa,OAAiB,OAA6B;AAClE,QAAM,EAAE,MAAM,SAAS,UAAU,QAAQ,IAAI;AAE7C,QAAM,mBAAmB,MAAM,WAAW;AAC1C,QAAM,aAAa,iBAAiB,MAAM,IAAI;AAC9C,QAAM,mBAAmB;AAAA,IACvB,iBAAiB,SAAS,OAAO;AAAA,IACjC,EAAE,UAAU,QAAQ;AAAA,EACtB;AAEA,SAAO,WAAW,OAAO;AAAA,IACvB,QAAQ;AAAA,MACN,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAEhB,QAAQ,WAAW;AAAA,MACnB,OAAO,WAAW;AAAA,MAClB,SAAS,WAAW;AAAA,MAEpB,aAAa,iBAAiB;AAAA,MAC9B,cAAc,iBAAiB;AAAA,MAE/B,aAAa,iBAAiB;AAAA,MAC9B,iBAAiB,iBAAiB;AAAA,IACpC;AAAA,IAEA,MAAM;AAAA,MACJ,OAAO,iBAAiB;AAAA,IAC1B;AAAA,EACF,CAAC;AACH;","names":["IconButton"]}
@@ -4,6 +4,6 @@ import { ProgressProps } from '../../types/progress.types.mjs';
4
4
  import 'react-native';
5
5
  import '@impulse-ui-native/theme';
6
6
 
7
- declare const Progress: react.MemoExoticComponent<({ accessibilityRole, accessibilityState, accessibilityValue, accessible, color, max, min, size, tone, trackColor, value, variant, ...props }: ProgressProps) => react_jsx_runtime.JSX.Element>;
7
+ declare const Progress: react.MemoExoticComponent<({ color, max, min, size, tone, trackColor, value, variant, ...props }: ProgressProps) => react_jsx_runtime.JSX.Element>;
8
8
 
9
9
  export { Progress };
@@ -5,10 +5,6 @@ import { normalizeProgressValue } from "../../utils/progress.utils";
5
5
  import { CircularProgress } from "./circular-progress";
6
6
  import { LinearProgress } from "./linear-progress";
7
7
  const Progress = memo(function Progress2({
8
- accessibilityRole = "progressbar",
9
- accessibilityState,
10
- accessibilityValue,
11
- accessible = true,
12
8
  color,
13
9
  max = 100,
14
10
  min = 0,
@@ -27,29 +23,9 @@ const Progress = memo(function Progress2({
27
23
  [max, min, value]
28
24
  );
29
25
  const indeterminate = normalized.value === void 0;
30
- const resolvedAccessibilityState = useMemo(
31
- () => ({
32
- ...accessibilityState,
33
- busy: indeterminate ? true : accessibilityState?.busy
34
- }),
35
- [accessibilityState, indeterminate]
36
- );
37
- const resolvedAccessibilityValue = useMemo(
38
- () => ({
39
- ...accessibilityValue,
40
- max: indeterminate ? void 0 : normalized.max,
41
- min: indeterminate ? void 0 : normalized.min,
42
- now: indeterminate ? void 0 : normalized.value
43
- }),
44
- [accessibilityValue, indeterminate, normalized]
45
- );
46
26
  const commonProps = useMemo(
47
27
  () => ({
48
28
  ...props,
49
- accessibilityRole,
50
- accessibilityState: resolvedAccessibilityState,
51
- accessibilityValue: resolvedAccessibilityValue,
52
- accessible,
53
29
  animationDuration: tokens.animationDuration,
54
30
  fraction: normalized.fraction,
55
31
  indicatorColor: color ?? colorTokens.indicatorColor,
@@ -57,16 +33,12 @@ const Progress = memo(function Progress2({
57
33
  trackColor: trackColor ?? colorTokens.trackColor
58
34
  }),
59
35
  [
60
- accessibilityRole,
61
- accessible,
62
36
  color,
63
37
  colorTokens.indicatorColor,
64
38
  colorTokens.trackColor,
65
39
  indeterminate,
66
40
  normalized.fraction,
67
41
  props,
68
- resolvedAccessibilityState,
69
- resolvedAccessibilityValue,
70
42
  tokens.animationDuration,
71
43
  trackColor
72
44
  ]
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/atoms/progress.tsx"],"sourcesContent":["import type { AccessibilityState, AccessibilityValue } from \"react-native\";\nimport { memo, useMemo } from \"react\";\n\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport type { ProgressProps } from \"../../types\";\nimport { normalizeProgressValue } from \"../../utils/progress.utils\";\nimport { CircularProgress } from \"./circular-progress\";\nimport { LinearProgress } from \"./linear-progress\";\n\nexport const Progress = memo(function Progress({\n accessibilityRole = \"progressbar\",\n accessibilityState,\n accessibilityValue,\n accessible = true,\n color,\n max = 100,\n min = 0,\n size = \"medium\",\n tone = \"primary\",\n trackColor,\n value,\n variant = \"linear\",\n ...props\n}: ProgressProps) {\n const tokens = useComponentsTokens().progress;\n const sizeTokens = tokens.sizes[size];\n const colorTokens = tokens.colors[tone];\n const normalized = useMemo(\n () => normalizeProgressValue(value, min, max),\n [max, min, value],\n );\n const indeterminate = normalized.value === undefined;\n\n const resolvedAccessibilityState = useMemo<AccessibilityState>(\n () => ({\n ...accessibilityState,\n busy: indeterminate ? true : accessibilityState?.busy,\n }),\n [accessibilityState, indeterminate],\n );\n\n const resolvedAccessibilityValue = useMemo<AccessibilityValue>(\n () => ({\n ...accessibilityValue,\n max: indeterminate ? undefined : normalized.max,\n min: indeterminate ? undefined : normalized.min,\n now: indeterminate ? undefined : normalized.value,\n }),\n [accessibilityValue, indeterminate, normalized],\n );\n\n const commonProps = useMemo(\n () => ({\n ...props,\n accessibilityRole,\n accessibilityState: resolvedAccessibilityState,\n accessibilityValue: resolvedAccessibilityValue,\n accessible,\n animationDuration: tokens.animationDuration,\n fraction: normalized.fraction,\n indicatorColor: color ?? colorTokens.indicatorColor,\n indeterminate,\n trackColor: trackColor ?? colorTokens.trackColor,\n }),\n [\n accessibilityRole,\n accessible,\n color,\n colorTokens.indicatorColor,\n colorTokens.trackColor,\n indeterminate,\n normalized.fraction,\n props,\n resolvedAccessibilityState,\n resolvedAccessibilityValue,\n tokens.animationDuration,\n trackColor,\n ],\n );\n\n return variant === \"circular\" ? (\n <CircularProgress\n {...commonProps}\n strokeWidth={sizeTokens.circularStrokeWidth}\n width={sizeTokens.circularSize}\n />\n ) : (\n <LinearProgress\n {...commonProps}\n borderRadius={tokens.borderRadius}\n indeterminateWidth={tokens.indeterminateLinearWidth}\n trackHeight={sizeTokens.linearHeight}\n />\n );\n});\n"],"mappings":"AAkFI;AAjFJ,SAAS,MAAM,eAAe;AAE9B,SAAS,2BAA2B;AAGpC,SAAS,8BAA8B;AACvC,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAExB,MAAM,WAAW,KAAK,SAASA,UAAS;AAAA,EAC7C,oBAAoB;AAAA,EACpB;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAAkB;AAChB,QAAM,SAAS,oBAAoB,EAAE;AACrC,QAAM,aAAa,OAAO,MAAM,IAAI;AACpC,QAAM,cAAc,OAAO,OAAO,IAAI;AACtC,QAAM,aAAa;AAAA,IACjB,MAAM,uBAAuB,OAAO,KAAK,GAAG;AAAA,IAC5C,CAAC,KAAK,KAAK,KAAK;AAAA,EAClB;AACA,QAAM,gBAAgB,WAAW,UAAU;AAE3C,QAAM,6BAA6B;AAAA,IACjC,OAAO;AAAA,MACL,GAAG;AAAA,MACH,MAAM,gBAAgB,OAAO,oBAAoB;AAAA,IACnD;AAAA,IACA,CAAC,oBAAoB,aAAa;AAAA,EACpC;AAEA,QAAM,6BAA6B;AAAA,IACjC,OAAO;AAAA,MACL,GAAG;AAAA,MACH,KAAK,gBAAgB,SAAY,WAAW;AAAA,MAC5C,KAAK,gBAAgB,SAAY,WAAW;AAAA,MAC5C,KAAK,gBAAgB,SAAY,WAAW;AAAA,IAC9C;AAAA,IACA,CAAC,oBAAoB,eAAe,UAAU;AAAA,EAChD;AAEA,QAAM,cAAc;AAAA,IAClB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA,oBAAoB;AAAA,MACpB,oBAAoB;AAAA,MACpB;AAAA,MACA,mBAAmB,OAAO;AAAA,MAC1B,UAAU,WAAW;AAAA,MACrB,gBAAgB,SAAS,YAAY;AAAA,MACrC;AAAA,MACA,YAAY,cAAc,YAAY;AAAA,IACxC;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,IACF;AAAA,EACF;AAEA,SAAO,YAAY,aACjB;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,aAAa,WAAW;AAAA,MACxB,OAAO,WAAW;AAAA;AAAA,EACpB,IAEA;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,cAAc,OAAO;AAAA,MACrB,oBAAoB,OAAO;AAAA,MAC3B,aAAa,WAAW;AAAA;AAAA,EAC1B;AAEJ,CAAC;","names":["Progress"]}
1
+ {"version":3,"sources":["../../../src/components/atoms/progress.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\n\nimport { useComponentsTokens } from \"@impulse-ui-native/theme\";\n\nimport type { ProgressProps } from \"../../types\";\nimport { normalizeProgressValue } from \"../../utils/progress.utils\";\nimport { CircularProgress } from \"./circular-progress\";\nimport { LinearProgress } from \"./linear-progress\";\n\nexport const Progress = memo(function Progress({\n color,\n max = 100,\n min = 0,\n size = \"medium\",\n tone = \"primary\",\n trackColor,\n value,\n variant = \"linear\",\n ...props\n}: ProgressProps) {\n const tokens = useComponentsTokens().progress;\n const sizeTokens = tokens.sizes[size];\n const colorTokens = tokens.colors[tone];\n const normalized = useMemo(\n () => normalizeProgressValue(value, min, max),\n [max, min, value],\n );\n const indeterminate = normalized.value === undefined;\n\n const commonProps = useMemo(\n () => ({\n ...props,\n animationDuration: tokens.animationDuration,\n fraction: normalized.fraction,\n indicatorColor: color ?? colorTokens.indicatorColor,\n indeterminate,\n trackColor: trackColor ?? colorTokens.trackColor,\n }),\n [\n color,\n colorTokens.indicatorColor,\n colorTokens.trackColor,\n indeterminate,\n normalized.fraction,\n props,\n tokens.animationDuration,\n trackColor,\n ],\n );\n\n return variant === \"circular\" ? (\n <CircularProgress\n {...commonProps}\n strokeWidth={sizeTokens.circularStrokeWidth}\n width={sizeTokens.circularSize}\n />\n ) : (\n <LinearProgress\n {...commonProps}\n borderRadius={tokens.borderRadius}\n indeterminateWidth={tokens.indeterminateLinearWidth}\n trackHeight={sizeTokens.linearHeight}\n />\n );\n});\n"],"mappings":"AAmDI;AAnDJ,SAAS,MAAM,eAAe;AAE9B,SAAS,2BAA2B;AAGpC,SAAS,8BAA8B;AACvC,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAExB,MAAM,WAAW,KAAK,SAASA,UAAS;AAAA,EAC7C;AAAA,EACA,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,GAAkB;AAChB,QAAM,SAAS,oBAAoB,EAAE;AACrC,QAAM,aAAa,OAAO,MAAM,IAAI;AACpC,QAAM,cAAc,OAAO,OAAO,IAAI;AACtC,QAAM,aAAa;AAAA,IACjB,MAAM,uBAAuB,OAAO,KAAK,GAAG;AAAA,IAC5C,CAAC,KAAK,KAAK,KAAK;AAAA,EAClB;AACA,QAAM,gBAAgB,WAAW,UAAU;AAE3C,QAAM,cAAc;AAAA,IAClB,OAAO;AAAA,MACL,GAAG;AAAA,MACH,mBAAmB,OAAO;AAAA,MAC1B,UAAU,WAAW;AAAA,MACrB,gBAAgB,SAAS,YAAY;AAAA,MACrC;AAAA,MACA,YAAY,cAAc,YAAY;AAAA,IACxC;AAAA,IACA;AAAA,MACE;AAAA,MACA,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ;AAAA,MACA,WAAW;AAAA,MACX;AAAA,MACA,OAAO;AAAA,MACP;AAAA,IACF;AAAA,EACF;AAEA,SAAO,YAAY,aACjB;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,aAAa,WAAW;AAAA,MACxB,OAAO,WAAW;AAAA;AAAA,EACpB,IAEA;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,cAAc,OAAO;AAAA,MACrB,oBAAoB,OAAO;AAAA,MAC3B,aAAa,WAAW;AAAA;AAAA,EAC1B;AAEJ,CAAC;","names":["Progress"]}
@@ -4,6 +4,6 @@ import { SpinnerProps } from '../../types/spinner.types.mjs';
4
4
  import 'react-native';
5
5
  import '@impulse-ui-native/theme';
6
6
 
7
- declare const Spinner: react.MemoExoticComponent<({ accessibilityRole, accessibilityState, accessible, animating, color, hidesWhenStopped, size, style, tone, ...props }: SpinnerProps) => react_jsx_runtime.JSX.Element>;
7
+ declare const Spinner: react.MemoExoticComponent<({ animating, color, hidesWhenStopped, size, style, tone, ...props }: SpinnerProps) => react_jsx_runtime.JSX.Element>;
8
8
 
9
9
  export { Spinner };
@@ -3,9 +3,6 @@ import { memo, useMemo } from "react";
3
3
  import { ActivityIndicator, StyleSheet, View } from "react-native";
4
4
  import { useThemedStyles } from "@impulse-ui-native/theme";
5
5
  const Spinner = memo(function Spinner2({
6
- accessibilityRole = "progressbar",
7
- accessibilityState,
8
- accessible = true,
9
6
  animating = true,
10
7
  color,
11
8
  hidesWhenStopped,
@@ -19,38 +16,20 @@ const Spinner = memo(function Spinner2({
19
16
  size,
20
17
  tone
21
18
  ]);
22
- const resolvedAccessibilityState = useMemo(
23
- () => ({
24
- ...accessibilityState,
25
- busy: animating
26
- }),
27
- [accessibilityState, animating]
28
- );
29
19
  const containerStyle = useMemo(
30
20
  () => [styles.container, style],
31
21
  [style, styles.container]
32
22
  );
33
- return /* @__PURE__ */ jsx(
34
- View,
23
+ return /* @__PURE__ */ jsx(View, { ...props, style: containerStyle, children: /* @__PURE__ */ jsx(
24
+ ActivityIndicator,
35
25
  {
36
- ...props,
37
- accessibilityRole,
38
- accessibilityState: resolvedAccessibilityState,
39
- accessible,
40
- style: containerStyle,
41
- children: /* @__PURE__ */ jsx(
42
- ActivityIndicator,
43
- {
44
- accessible: false,
45
- animating,
46
- color: styles.indicator.color,
47
- hidesWhenStopped,
48
- size: "small",
49
- style: styles.indicator
50
- }
51
- )
26
+ animating,
27
+ color: styles.indicator.color,
28
+ hidesWhenStopped,
29
+ size: "small",
30
+ style: styles.indicator
52
31
  }
53
- );
32
+ ) });
54
33
  });
55
34
  function themedStyles(theme, props) {
56
35
  const { color, size, tone } = props;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/atoms/spinner.tsx"],"sourcesContent":["import type { AccessibilityState } from \"react-native\";\nimport { memo, useMemo } from \"react\";\nimport { ActivityIndicator, StyleSheet, View } from \"react-native\";\n\nimport type { AppTheme } from \"@impulse-ui-native/theme\";\nimport { useThemedStyles } from \"@impulse-ui-native/theme\";\n\nimport type { SpinnerProps } from \"../../types\";\n\nexport const Spinner = memo(function Spinner({\n accessibilityRole = \"progressbar\",\n accessibilityState,\n accessible = true,\n animating = true,\n color,\n hidesWhenStopped,\n size = \"medium\",\n style,\n tone = \"primary\",\n ...props\n}: SpinnerProps) {\n const styles = useThemedStyles(themedStyles, { color, size, tone }, [\n color,\n size,\n tone,\n ]);\n\n const resolvedAccessibilityState = useMemo<AccessibilityState>(\n () => ({\n ...accessibilityState,\n busy: animating,\n }),\n [accessibilityState, animating],\n );\n\n const containerStyle = useMemo(\n () => [styles.container, style],\n [style, styles.container],\n );\n\n return (\n <View\n {...props}\n accessibilityRole={accessibilityRole}\n accessibilityState={resolvedAccessibilityState}\n accessible={accessible}\n style={containerStyle}\n >\n <ActivityIndicator\n accessible={false}\n animating={animating}\n color={styles.indicator.color}\n hidesWhenStopped={hidesWhenStopped}\n size=\"small\"\n style={styles.indicator}\n />\n </View>\n );\n});\n\ninterface SpinnerThemeProps {\n color: SpinnerProps[\"color\"];\n size: NonNullable<SpinnerProps[\"size\"]>;\n tone: NonNullable<SpinnerProps[\"tone\"]>;\n}\n\nfunction themedStyles(theme: AppTheme, props: SpinnerThemeProps) {\n const { color, size, tone } = props;\n const spinnerTokens = theme.components.spinner;\n const resolvedSize = spinnerTokens.sizes[size];\n\n return StyleSheet.create({\n container: {\n alignItems: \"center\",\n height: resolvedSize,\n justifyContent: \"center\",\n width: resolvedSize,\n },\n indicator: {\n color: color ?? spinnerTokens.colors[tone],\n transform: [{ scale: resolvedSize / spinnerTokens.baseSize }],\n },\n });\n}\n"],"mappings":"AAgDM;AA/CN,SAAS,MAAM,eAAe;AAC9B,SAAS,mBAAmB,YAAY,YAAY;AAGpD,SAAS,uBAAuB;AAIzB,MAAM,UAAU,KAAK,SAASA,SAAQ;AAAA,EAC3C,oBAAoB;AAAA,EACpB;AAAA,EACA,aAAa;AAAA,EACb,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GAAiB;AACf,QAAM,SAAS,gBAAgB,cAAc,EAAE,OAAO,MAAM,KAAK,GAAG;AAAA,IAClE;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,6BAA6B;AAAA,IACjC,OAAO;AAAA,MACL,GAAG;AAAA,MACH,MAAM;AAAA,IACR;AAAA,IACA,CAAC,oBAAoB,SAAS;AAAA,EAChC;AAEA,QAAM,iBAAiB;AAAA,IACrB,MAAM,CAAC,OAAO,WAAW,KAAK;AAAA,IAC9B,CAAC,OAAO,OAAO,SAAS;AAAA,EAC1B;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,oBAAoB;AAAA,MACpB;AAAA,MACA,OAAO;AAAA,MAEP;AAAA,QAAC;AAAA;AAAA,UACC,YAAY;AAAA,UACZ;AAAA,UACA,OAAO,OAAO,UAAU;AAAA,UACxB;AAAA,UACA,MAAK;AAAA,UACL,OAAO,OAAO;AAAA;AAAA,MAChB;AAAA;AAAA,EACF;AAEJ,CAAC;AAQD,SAAS,aAAa,OAAiB,OAA0B;AAC/D,QAAM,EAAE,OAAO,MAAM,KAAK,IAAI;AAC9B,QAAM,gBAAgB,MAAM,WAAW;AACvC,QAAM,eAAe,cAAc,MAAM,IAAI;AAE7C,SAAO,WAAW,OAAO;AAAA,IACvB,WAAW;AAAA,MACT,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,gBAAgB;AAAA,MAChB,OAAO;AAAA,IACT;AAAA,IACA,WAAW;AAAA,MACT,OAAO,SAAS,cAAc,OAAO,IAAI;AAAA,MACzC,WAAW,CAAC,EAAE,OAAO,eAAe,cAAc,SAAS,CAAC;AAAA,IAC9D;AAAA,EACF,CAAC;AACH;","names":["Spinner"]}
1
+ {"version":3,"sources":["../../../src/components/atoms/spinner.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\nimport { ActivityIndicator, StyleSheet, View } from \"react-native\";\n\nimport type { AppTheme } from \"@impulse-ui-native/theme\";\nimport { useThemedStyles } from \"@impulse-ui-native/theme\";\n\nimport type { SpinnerProps } from \"../../types\";\n\nexport const Spinner = memo(function Spinner({\n animating = true,\n color,\n hidesWhenStopped,\n size = \"medium\",\n style,\n tone = \"primary\",\n ...props\n}: SpinnerProps) {\n const styles = useThemedStyles(themedStyles, { color, size, tone }, [\n color,\n size,\n tone,\n ]);\n\n const containerStyle = useMemo(\n () => [styles.container, style],\n [style, styles.container],\n );\n\n return (\n <View {...props} style={containerStyle}>\n <ActivityIndicator\n animating={animating}\n color={styles.indicator.color}\n hidesWhenStopped={hidesWhenStopped}\n size=\"small\"\n style={styles.indicator}\n />\n </View>\n );\n});\n\ninterface SpinnerThemeProps {\n color: SpinnerProps[\"color\"];\n size: NonNullable<SpinnerProps[\"size\"]>;\n tone: NonNullable<SpinnerProps[\"tone\"]>;\n}\n\nfunction themedStyles(theme: AppTheme, props: SpinnerThemeProps) {\n const { color, size, tone } = props;\n const spinnerTokens = theme.components.spinner;\n const resolvedSize = spinnerTokens.sizes[size];\n\n return StyleSheet.create({\n container: {\n alignItems: \"center\",\n height: resolvedSize,\n justifyContent: \"center\",\n width: resolvedSize,\n },\n indicator: {\n color: color ?? spinnerTokens.colors[tone],\n transform: [{ scale: resolvedSize / spinnerTokens.baseSize }],\n },\n });\n}\n"],"mappings":"AA8BM;AA9BN,SAAS,MAAM,eAAe;AAC9B,SAAS,mBAAmB,YAAY,YAAY;AAGpD,SAAS,uBAAuB;AAIzB,MAAM,UAAU,KAAK,SAASA,SAAQ;AAAA,EAC3C,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GAAiB;AACf,QAAM,SAAS,gBAAgB,cAAc,EAAE,OAAO,MAAM,KAAK,GAAG;AAAA,IAClE;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,iBAAiB;AAAA,IACrB,MAAM,CAAC,OAAO,WAAW,KAAK;AAAA,IAC9B,CAAC,OAAO,OAAO,SAAS;AAAA,EAC1B;AAEA,SACE,oBAAC,QAAM,GAAG,OAAO,OAAO,gBACtB;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,OAAO,UAAU;AAAA,MACxB;AAAA,MACA,MAAK;AAAA,MACL,OAAO,OAAO;AAAA;AAAA,EAChB,GACF;AAEJ,CAAC;AAQD,SAAS,aAAa,OAAiB,OAA0B;AAC/D,QAAM,EAAE,OAAO,MAAM,KAAK,IAAI;AAC9B,QAAM,gBAAgB,MAAM,WAAW;AACvC,QAAM,eAAe,cAAc,MAAM,IAAI;AAE7C,SAAO,WAAW,OAAO;AAAA,IACvB,WAAW;AAAA,MACT,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,gBAAgB;AAAA,MAChB,OAAO;AAAA,IACT;AAAA,IACA,WAAW;AAAA,MACT,OAAO,SAAS,cAAc,OAAO,IAAI;AAAA,MACzC,WAAW,CAAC,EAAE,OAAO,eAAe,cAAc,SAAS,CAAC;AAAA,IAC9D;AAAA,EACF,CAAC;AACH;","names":["Spinner"]}
@@ -1,11 +1,15 @@
1
1
  import { createPreset } from "../../hocs";
2
2
  const Typography = {
3
3
  Master: createPreset(
4
- (theme) => ({ fontWeight: theme.fontWeight.regular }),
4
+ (theme) => ({
5
+ color: theme.colors.text.primary,
6
+ fontWeight: theme.fontWeight.regular
7
+ }),
5
8
  "Master"
6
9
  ),
7
10
  DisplayLarge: createPreset(
8
11
  (theme) => ({
12
+ color: theme.colors.text.primary,
9
13
  fontWeight: theme.fontWeight.bold,
10
14
  fontSize: theme.fontSize.colossal,
11
15
  lineHeight: theme.lineHeight.colossal
@@ -14,6 +18,7 @@ const Typography = {
14
18
  ),
15
19
  DisplayMedium: createPreset(
16
20
  (theme) => ({
21
+ color: theme.colors.text.primary,
17
22
  fontWeight: theme.fontWeight.bold,
18
23
  fontSize: theme.fontSize.giant,
19
24
  lineHeight: theme.lineHeight.giant
@@ -22,6 +27,7 @@ const Typography = {
22
27
  ),
23
28
  DisplaySmall: createPreset(
24
29
  (theme) => ({
30
+ color: theme.colors.text.primary,
25
31
  fontWeight: theme.fontWeight.semiBold,
26
32
  fontSize: theme.fontSize.huge,
27
33
  lineHeight: theme.lineHeight.huge
@@ -30,6 +36,7 @@ const Typography = {
30
36
  ),
31
37
  Title1: createPreset(
32
38
  (theme) => ({
39
+ color: theme.colors.text.primary,
33
40
  fontWeight: theme.fontWeight.bold,
34
41
  fontSize: theme.fontSize.xxxl,
35
42
  lineHeight: theme.lineHeight.xxxl
@@ -38,6 +45,7 @@ const Typography = {
38
45
  ),
39
46
  Title2: createPreset(
40
47
  (theme) => ({
48
+ color: theme.colors.text.primary,
41
49
  fontWeight: theme.fontWeight.bold,
42
50
  fontSize: theme.fontSize.xxl,
43
51
  lineHeight: theme.lineHeight.xxl
@@ -46,6 +54,7 @@ const Typography = {
46
54
  ),
47
55
  Title3: createPreset(
48
56
  (theme) => ({
57
+ color: theme.colors.text.primary,
49
58
  fontWeight: theme.fontWeight.semiBold,
50
59
  fontSize: theme.fontSize.xl,
51
60
  lineHeight: theme.lineHeight.xl
@@ -54,6 +63,7 @@ const Typography = {
54
63
  ),
55
64
  Title4: createPreset(
56
65
  (theme) => ({
66
+ color: theme.colors.text.primary,
57
67
  fontWeight: theme.fontWeight.semiBold,
58
68
  fontSize: theme.fontSize.lg,
59
69
  lineHeight: theme.lineHeight.lg
@@ -62,6 +72,7 @@ const Typography = {
62
72
  ),
63
73
  Title5: createPreset(
64
74
  (theme) => ({
75
+ color: theme.colors.text.primary,
65
76
  fontWeight: theme.fontWeight.semiBold,
66
77
  fontSize: theme.fontSize.md,
67
78
  lineHeight: theme.lineHeight.md
@@ -70,6 +81,7 @@ const Typography = {
70
81
  ),
71
82
  Title6: createPreset(
72
83
  (theme) => ({
84
+ color: theme.colors.text.primary,
73
85
  fontWeight: theme.fontWeight.semiBold,
74
86
  fontSize: theme.fontSize.sm,
75
87
  lineHeight: theme.lineHeight.sm
@@ -78,6 +90,7 @@ const Typography = {
78
90
  ),
79
91
  Subtitle1: createPreset(
80
92
  (theme) => ({
93
+ color: theme.colors.text.secondary,
81
94
  fontWeight: theme.fontWeight.medium,
82
95
  fontSize: theme.fontSize.md,
83
96
  lineHeight: theme.lineHeight.lg
@@ -86,6 +99,7 @@ const Typography = {
86
99
  ),
87
100
  Subtitle2: createPreset(
88
101
  (theme) => ({
102
+ color: theme.colors.text.secondary,
89
103
  fontWeight: theme.fontWeight.regular,
90
104
  fontSize: theme.fontSize.sm,
91
105
  lineHeight: theme.lineHeight.sm
@@ -94,6 +108,7 @@ const Typography = {
94
108
  ),
95
109
  BodyLarge: createPreset(
96
110
  (theme) => ({
111
+ color: theme.colors.text.primary,
97
112
  fontWeight: theme.fontWeight.regular,
98
113
  fontSize: theme.fontSize.md,
99
114
  lineHeight: theme.lineHeight.lg
@@ -102,6 +117,7 @@ const Typography = {
102
117
  ),
103
118
  Body: createPreset(
104
119
  (theme) => ({
120
+ color: theme.colors.text.primary,
105
121
  fontWeight: theme.fontWeight.regular,
106
122
  fontSize: theme.fontSize.sm,
107
123
  lineHeight: theme.lineHeight.sm
@@ -110,6 +126,7 @@ const Typography = {
110
126
  ),
111
127
  BodySmall: createPreset(
112
128
  (theme) => ({
129
+ color: theme.colors.text.secondary,
113
130
  fontWeight: theme.fontWeight.regular,
114
131
  fontSize: theme.fontSize.xsm,
115
132
  lineHeight: theme.lineHeight.xsm
@@ -118,6 +135,7 @@ const Typography = {
118
135
  ),
119
136
  Caption: createPreset(
120
137
  (theme) => ({
138
+ color: theme.colors.text.secondary,
121
139
  fontWeight: theme.fontWeight.regular,
122
140
  fontSize: theme.fontSize.xs,
123
141
  lineHeight: theme.lineHeight.xs
@@ -126,6 +144,7 @@ const Typography = {
126
144
  ),
127
145
  Label: createPreset(
128
146
  (theme) => ({
147
+ color: theme.colors.text.primary,
129
148
  fontWeight: theme.fontWeight.medium,
130
149
  fontSize: theme.fontSize.xsm,
131
150
  lineHeight: theme.lineHeight.xsm
@@ -134,6 +153,7 @@ const Typography = {
134
153
  ),
135
154
  Overline: createPreset(
136
155
  (theme) => ({
156
+ color: theme.colors.text.secondary,
137
157
  fontWeight: theme.fontWeight.semiBold,
138
158
  fontSize: theme.fontSize.xs,
139
159
  lineHeight: theme.lineHeight.xs,
@@ -144,6 +164,7 @@ const Typography = {
144
164
  ),
145
165
  Helper: createPreset(
146
166
  (theme) => ({
167
+ color: theme.colors.text.secondary,
147
168
  fontWeight: theme.fontWeight.regular,
148
169
  fontSize: theme.fontSize.xsm,
149
170
  lineHeight: theme.lineHeight.xsm
@@ -152,6 +173,7 @@ const Typography = {
152
173
  ),
153
174
  Code: createPreset(
154
175
  (theme) => ({
176
+ color: theme.colors.text.primary,
155
177
  fontFamily: "monospace",
156
178
  fontSize: theme.fontSize.xsm,
157
179
  lineHeight: theme.lineHeight.xsm
@@ -160,6 +182,7 @@ const Typography = {
160
182
  ),
161
183
  Quote: createPreset(
162
184
  (theme) => ({
185
+ color: theme.colors.text.primary,
163
186
  fontWeight: theme.fontWeight.regular,
164
187
  fontSize: theme.fontSize.md,
165
188
  lineHeight: theme.lineHeight.lg,
@@ -169,6 +192,7 @@ const Typography = {
169
192
  ),
170
193
  Eyebrow: createPreset(
171
194
  (theme) => ({
195
+ color: theme.colors.text.secondary,
172
196
  fontWeight: theme.fontWeight.medium,
173
197
  fontSize: theme.fontSize.xs,
174
198
  lineHeight: theme.lineHeight.xs,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/atoms/typography.tsx"],"sourcesContent":["import { createPreset } from \"../../hocs\";\n\nexport const Typography = {\n Master: createPreset(\n (theme) => ({ fontWeight: theme.fontWeight.regular }),\n \"Master\",\n ),\n\n DisplayLarge: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.colossal,\n lineHeight: theme.lineHeight.colossal,\n }),\n \"DisplayLarge\",\n ),\n\n DisplayMedium: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.giant,\n lineHeight: theme.lineHeight.giant,\n }),\n \"DisplayMedium\",\n ),\n\n DisplaySmall: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.huge,\n lineHeight: theme.lineHeight.huge,\n }),\n \"DisplaySmall\",\n ),\n\n Title1: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.xxxl,\n lineHeight: theme.lineHeight.xxxl,\n }),\n \"Title1\",\n ),\n\n Title2: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.xxl,\n lineHeight: theme.lineHeight.xxl,\n }),\n \"Title2\",\n ),\n\n Title3: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.xl,\n lineHeight: theme.lineHeight.xl,\n }),\n \"Title3\",\n ),\n\n Title4: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.lg,\n lineHeight: theme.lineHeight.lg,\n }),\n \"Title4\",\n ),\n\n Title5: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.md,\n }),\n \"Title5\",\n ),\n\n Title6: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.sm,\n lineHeight: theme.lineHeight.sm,\n }),\n \"Title6\",\n ),\n\n Subtitle1: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.medium,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.lg,\n }),\n \"Subtitle1\",\n ),\n\n Subtitle2: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.sm,\n lineHeight: theme.lineHeight.sm,\n }),\n \"Subtitle2\",\n ),\n\n BodyLarge: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.lg,\n }),\n \"BodyLarge\",\n ),\n\n Body: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.sm,\n lineHeight: theme.lineHeight.sm,\n }),\n \"Body\",\n ),\n\n BodySmall: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"BodySmall\",\n ),\n\n Caption: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.xs,\n lineHeight: theme.lineHeight.xs,\n }),\n \"Caption\",\n ),\n\n Label: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.medium,\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"Label\",\n ),\n\n Overline: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.xs,\n lineHeight: theme.lineHeight.xs,\n textTransform: \"uppercase\",\n letterSpacing: theme.letterSpacing.ultraWide,\n }),\n \"Overline\",\n ),\n\n Helper: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"Helper\",\n ),\n\n Code: createPreset(\n (theme) => ({\n fontFamily: \"monospace\",\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"Code\",\n ),\n\n Quote: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.lg,\n fontStyle: \"italic\",\n }),\n \"Quote\",\n ),\n\n Eyebrow: createPreset(\n (theme) => ({\n fontWeight: theme.fontWeight.medium,\n fontSize: theme.fontSize.xs,\n lineHeight: theme.lineHeight.xs,\n textTransform: \"uppercase\",\n letterSpacing: theme.letterSpacing.ultraWide,\n }),\n \"Eyebrow\",\n ),\n};\n\nexport type TypographyComponent = (typeof Typography)[keyof typeof Typography];\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../src/components/atoms/typography.tsx"],"sourcesContent":["import { createPreset } from \"../../hocs\";\n\nexport const Typography = {\n Master: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.regular,\n }),\n \"Master\",\n ),\n\n DisplayLarge: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.colossal,\n lineHeight: theme.lineHeight.colossal,\n }),\n \"DisplayLarge\",\n ),\n\n DisplayMedium: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.giant,\n lineHeight: theme.lineHeight.giant,\n }),\n \"DisplayMedium\",\n ),\n\n DisplaySmall: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.huge,\n lineHeight: theme.lineHeight.huge,\n }),\n \"DisplaySmall\",\n ),\n\n Title1: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.xxxl,\n lineHeight: theme.lineHeight.xxxl,\n }),\n \"Title1\",\n ),\n\n Title2: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.bold,\n fontSize: theme.fontSize.xxl,\n lineHeight: theme.lineHeight.xxl,\n }),\n \"Title2\",\n ),\n\n Title3: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.xl,\n lineHeight: theme.lineHeight.xl,\n }),\n \"Title3\",\n ),\n\n Title4: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.lg,\n lineHeight: theme.lineHeight.lg,\n }),\n \"Title4\",\n ),\n\n Title5: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.md,\n }),\n \"Title5\",\n ),\n\n Title6: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.sm,\n lineHeight: theme.lineHeight.sm,\n }),\n \"Title6\",\n ),\n\n Subtitle1: createPreset(\n (theme) => ({\n color: theme.colors.text.secondary,\n fontWeight: theme.fontWeight.medium,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.lg,\n }),\n \"Subtitle1\",\n ),\n\n Subtitle2: createPreset(\n (theme) => ({\n color: theme.colors.text.secondary,\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.sm,\n lineHeight: theme.lineHeight.sm,\n }),\n \"Subtitle2\",\n ),\n\n BodyLarge: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.lg,\n }),\n \"BodyLarge\",\n ),\n\n Body: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.sm,\n lineHeight: theme.lineHeight.sm,\n }),\n \"Body\",\n ),\n\n BodySmall: createPreset(\n (theme) => ({\n color: theme.colors.text.secondary,\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"BodySmall\",\n ),\n\n Caption: createPreset(\n (theme) => ({\n color: theme.colors.text.secondary,\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.xs,\n lineHeight: theme.lineHeight.xs,\n }),\n \"Caption\",\n ),\n\n Label: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.medium,\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"Label\",\n ),\n\n Overline: createPreset(\n (theme) => ({\n color: theme.colors.text.secondary,\n fontWeight: theme.fontWeight.semiBold,\n fontSize: theme.fontSize.xs,\n lineHeight: theme.lineHeight.xs,\n textTransform: \"uppercase\",\n letterSpacing: theme.letterSpacing.ultraWide,\n }),\n \"Overline\",\n ),\n\n Helper: createPreset(\n (theme) => ({\n color: theme.colors.text.secondary,\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"Helper\",\n ),\n\n Code: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontFamily: \"monospace\",\n fontSize: theme.fontSize.xsm,\n lineHeight: theme.lineHeight.xsm,\n }),\n \"Code\",\n ),\n\n Quote: createPreset(\n (theme) => ({\n color: theme.colors.text.primary,\n fontWeight: theme.fontWeight.regular,\n fontSize: theme.fontSize.md,\n lineHeight: theme.lineHeight.lg,\n fontStyle: \"italic\",\n }),\n \"Quote\",\n ),\n\n Eyebrow: createPreset(\n (theme) => ({\n color: theme.colors.text.secondary,\n fontWeight: theme.fontWeight.medium,\n fontSize: theme.fontSize.xs,\n lineHeight: theme.lineHeight.xs,\n textTransform: \"uppercase\",\n letterSpacing: theme.letterSpacing.ultraWide,\n }),\n \"Eyebrow\",\n ),\n};\n\nexport type TypographyComponent = (typeof Typography)[keyof typeof Typography];\n"],"mappings":"AAAA,SAAS,oBAAoB;AAEtB,MAAM,aAAa;AAAA,EACxB,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,cAAc;AAAA,IACZ,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,eAAe;AAAA,IACb,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,cAAc;AAAA,IACZ,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,MAAM;AAAA,IACJ,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,SAAS;AAAA,IACP,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,OAAO;AAAA,IACL,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,eAAe;AAAA,MACf,eAAe,MAAM,cAAc;AAAA,IACrC;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,MAAM;AAAA,IACJ,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY;AAAA,MACZ,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,OAAO;AAAA,IACL,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,WAAW;AAAA,IACb;AAAA,IACA;AAAA,EACF;AAAA,EAEA,SAAS;AAAA,IACP,CAAC,WAAW;AAAA,MACV,OAAO,MAAM,OAAO,KAAK;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,eAAe;AAAA,MACf,eAAe,MAAM,cAAc;AAAA,IACrC;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
@@ -7,7 +7,7 @@ import '../../types/view.types.mjs';
7
7
 
8
8
  declare const Card: {
9
9
  Root: react.MemoExoticComponent<({ style, ...props }: CardRootProps) => react_jsx_runtime.JSX.Element>;
10
- Pressable: react.MemoExoticComponent<({ accessibilityRole, accessibilityState, disabled, style, ...props }: CardPressableProps) => react_jsx_runtime.JSX.Element>;
10
+ Pressable: react.MemoExoticComponent<({ disabled, style, ...props }: CardPressableProps) => react_jsx_runtime.JSX.Element>;
11
11
  Header: react.MemoExoticComponent<({ style, ...props }: CardHeaderProps) => react_jsx_runtime.JSX.Element>;
12
12
  Content: react.MemoExoticComponent<({ style, ...props }: CardContentProps) => react_jsx_runtime.JSX.Element>;
13
13
  Footer: react.MemoExoticComponent<({ style, ...props }: CardFooterProps) => react_jsx_runtime.JSX.Element>;
@@ -5,6 +5,6 @@ import 'react-native';
5
5
  import '@impulse-ui-native/theme';
6
6
  import '../../types/view.types.mjs';
7
7
 
8
- declare const CardPressable: react.MemoExoticComponent<({ accessibilityRole, accessibilityState, disabled, style, ...props }: CardPressableProps) => react_jsx_runtime.JSX.Element>;
8
+ declare const CardPressable: react.MemoExoticComponent<({ disabled, style, ...props }: CardPressableProps) => react_jsx_runtime.JSX.Element>;
9
9
 
10
10
  export { CardPressable };
@@ -1,25 +1,16 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
- import { memo, useCallback, useMemo } from "react";
2
+ import { memo, useCallback } from "react";
3
3
  import { StyleSheet } from "react-native";
4
4
  import { useStyleProps, useThemedStyles } from "@impulse-ui-native/theme";
5
5
  import { Pressable } from "../atoms/pressable";
6
6
  import { cardRootStyles } from "./root.styles";
7
7
  const CardPressable = memo(function CardPressable2({
8
- accessibilityRole = "button",
9
- accessibilityState,
10
8
  disabled,
11
9
  style,
12
10
  ...props
13
11
  }) {
14
12
  const styles = useThemedStyles(cardRootStyles);
15
13
  const extractedStyleProps = useStyleProps(props);
16
- const resolvedAccessibilityState = useMemo(
17
- () => ({
18
- ...accessibilityState,
19
- disabled: disabled === true
20
- }),
21
- [accessibilityState, disabled]
22
- );
23
14
  const rootStyle = useCallback(
24
15
  (state) => StyleSheet.flatten([
25
16
  styles.root,
@@ -28,16 +19,7 @@ const CardPressable = memo(function CardPressable2({
28
19
  ]),
29
20
  [extractedStyleProps, style, styles.root]
30
21
  );
31
- return /* @__PURE__ */ jsx(
32
- Pressable,
33
- {
34
- ...props,
35
- accessibilityRole,
36
- accessibilityState: resolvedAccessibilityState,
37
- disabled: disabled === true,
38
- style: rootStyle
39
- }
40
- );
22
+ return /* @__PURE__ */ jsx(Pressable, { ...props, disabled: disabled === true, style: rootStyle });
41
23
  });
42
24
  export {
43
25
  CardPressable
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/card/pressable.tsx"],"sourcesContent":["import type {\n AccessibilityState,\n PressableStateCallbackType,\n StyleProp,\n ViewStyle,\n} from \"react-native\";\nimport { memo, useCallback, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport { useStyleProps, useThemedStyles } from \"@impulse-ui-native/theme\";\n\nimport type { CardPressableProps } from \"../../types\";\nimport { Pressable } from \"../atoms/pressable\";\nimport { cardRootStyles } from \"./root.styles\";\n\nexport const CardPressable = memo(function CardPressable({\n accessibilityRole = \"button\",\n accessibilityState,\n disabled,\n style,\n ...props\n}: CardPressableProps) {\n const styles = useThemedStyles(cardRootStyles);\n const extractedStyleProps = useStyleProps(props);\n\n const resolvedAccessibilityState = useMemo<AccessibilityState>(\n () => ({\n ...accessibilityState,\n disabled: disabled === true,\n }),\n [accessibilityState, disabled],\n );\n\n const rootStyle = useCallback(\n (state: PressableStateCallbackType): StyleProp<ViewStyle> =>\n StyleSheet.flatten([\n styles.root,\n extractedStyleProps,\n typeof style === \"function\" ? style(state) : style,\n ]),\n [extractedStyleProps, style, styles.root],\n );\n\n return (\n <Pressable\n {...props}\n accessibilityRole={accessibilityRole}\n accessibilityState={resolvedAccessibilityState}\n disabled={disabled === true}\n style={rootStyle}\n />\n );\n});\n"],"mappings":"AA4CI;AAtCJ,SAAS,MAAM,aAAa,eAAe;AAC3C,SAAS,kBAAkB;AAE3B,SAAS,eAAe,uBAAuB;AAG/C,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAExB,MAAM,gBAAgB,KAAK,SAASA,eAAc;AAAA,EACvD,oBAAoB;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,SAAS,gBAAgB,cAAc;AAC7C,QAAM,sBAAsB,cAAc,KAAK;AAE/C,QAAM,6BAA6B;AAAA,IACjC,OAAO;AAAA,MACL,GAAG;AAAA,MACH,UAAU,aAAa;AAAA,IACzB;AAAA,IACA,CAAC,oBAAoB,QAAQ;AAAA,EAC/B;AAEA,QAAM,YAAY;AAAA,IAChB,CAAC,UACC,WAAW,QAAQ;AAAA,MACjB,OAAO;AAAA,MACP;AAAA,MACA,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;AAAA,IAC/C,CAAC;AAAA,IACH,CAAC,qBAAqB,OAAO,OAAO,IAAI;AAAA,EAC1C;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,oBAAoB;AAAA,MACpB,UAAU,aAAa;AAAA,MACvB,OAAO;AAAA;AAAA,EACT;AAEJ,CAAC;","names":["CardPressable"]}
1
+ {"version":3,"sources":["../../../src/components/card/pressable.tsx"],"sourcesContent":["import type {\n PressableStateCallbackType,\n StyleProp,\n ViewStyle,\n} from \"react-native\";\nimport { memo, useCallback, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport { useStyleProps, useThemedStyles } from \"@impulse-ui-native/theme\";\n\nimport type { CardPressableProps } from \"../../types\";\nimport { Pressable } from \"../atoms/pressable\";\nimport { cardRootStyles } from \"./root.styles\";\n\nexport const CardPressable = memo(function CardPressable({\n disabled,\n style,\n ...props\n}: CardPressableProps) {\n const styles = useThemedStyles(cardRootStyles);\n const extractedStyleProps = useStyleProps(props);\n\n const rootStyle = useCallback(\n (state: PressableStateCallbackType): StyleProp<ViewStyle> =>\n StyleSheet.flatten([\n styles.root,\n extractedStyleProps,\n typeof style === \"function\" ? style(state) : style,\n ]),\n [extractedStyleProps, style, styles.root],\n );\n\n return (\n <Pressable {...props} disabled={disabled === true} style={rootStyle} />\n );\n});\n"],"mappings":"AAiCI;AA5BJ,SAAS,MAAM,mBAA4B;AAC3C,SAAS,kBAAkB;AAE3B,SAAS,eAAe,uBAAuB;AAG/C,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAExB,MAAM,gBAAgB,KAAK,SAASA,eAAc;AAAA,EACvD;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,SAAS,gBAAgB,cAAc;AAC7C,QAAM,sBAAsB,cAAc,KAAK;AAE/C,QAAM,YAAY;AAAA,IAChB,CAAC,UACC,WAAW,QAAQ;AAAA,MACjB,OAAO;AAAA,MACP;AAAA,MACA,OAAO,UAAU,aAAa,MAAM,KAAK,IAAI;AAAA,IAC/C,CAAC;AAAA,IACH,CAAC,qBAAqB,OAAO,OAAO,IAAI;AAAA,EAC1C;AAEA,SACE,oBAAC,aAAW,GAAG,OAAO,UAAU,aAAa,MAAM,OAAO,WAAW;AAEzE,CAAC;","names":["CardPressable"]}
@@ -13,6 +13,7 @@ export { Tag } from './atoms/tag.mjs';
13
13
  export { Card } from './card/card.mjs';
14
14
  export { Control } from './controls/control.mjs';
15
15
  export { useControlContext } from './controls/provider.mjs';
16
+ export { List } from './list/list.mjs';
16
17
  import 'react';
17
18
  import 'react/jsx-runtime';
18
19
  import '../types/avatar.types.mjs';
@@ -32,3 +33,4 @@ import '../types/icon-button.types.mjs';
32
33
  import '../types/progress.types.mjs';
33
34
  import '../types/tag.types.mjs';
34
35
  import '../types/card.types.mjs';
36
+ import '../types/list.types.mjs';
@@ -1,4 +1,5 @@
1
1
  export * from "./atoms";
2
2
  export * from "./card";
3
3
  export * from "./controls";
4
+ export * from "./list";
4
5
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from \"./atoms\";\nexport * from \"./card\";\nexport * from \"./controls\";\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
1
+ {"version":3,"sources":["../../src/components/index.ts"],"sourcesContent":["export * from \"./atoms\";\nexport * from \"./card\";\nexport * from \"./controls\";\n\nexport * from \"./list\";\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AAEd,cAAc;","names":[]}
@@ -0,0 +1,11 @@
1
+ import * as react from 'react';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+ import { ListContentProps } from '../../types/list.types.mjs';
4
+ import '../../types/button.types.mjs';
5
+ import 'react-native';
6
+ import '@impulse-ui-native/theme';
7
+ import '../../types/view.types.mjs';
8
+
9
+ declare const ListContent: react.MemoExoticComponent<({ style, ...props }: ListContentProps) => react_jsx_runtime.JSX.Element>;
10
+
11
+ export { ListContent };
@@ -0,0 +1,27 @@
1
+ import { jsx } from "react/jsx-runtime";
2
+ import { memo, useMemo } from "react";
3
+ import { StyleSheet } from "react-native";
4
+ import { useStyleProps, useThemedStyles } from "@impulse-ui-native/theme";
5
+ import { View } from "../atoms/view";
6
+ const ListContent = memo(function ListContent2({
7
+ style,
8
+ ...props
9
+ }) {
10
+ const extractedStyleProps = useStyleProps(props);
11
+ const styles = useThemedStyles(themedStyles);
12
+ const composedStyle = useMemo(
13
+ () => [styles.part, extractedStyleProps, style],
14
+ [styles.part, extractedStyleProps, style]
15
+ );
16
+ return /* @__PURE__ */ jsx(View, { ...props, style: composedStyle });
17
+ });
18
+ function themedStyles(theme) {
19
+ const tokens = theme.components.list;
20
+ return StyleSheet.create({
21
+ part: { flex: 1, minWidth: 0, gap: tokens.content.gap }
22
+ });
23
+ }
24
+ export {
25
+ ListContent
26
+ };
27
+ //# sourceMappingURL=content.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/list/content.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport type { AppTheme } from \"@impulse-ui-native/theme\";\nimport { useStyleProps, useThemedStyles } from \"@impulse-ui-native/theme\";\n\nimport type { ListContentProps } from \"../../types\";\nimport { View } from \"../atoms/view\";\n\nexport const ListContent = memo(function ListContent({\n style,\n ...props\n}: ListContentProps) {\n const extractedStyleProps = useStyleProps(props);\n const styles = useThemedStyles(themedStyles);\n const composedStyle = useMemo(\n () => [styles.part, extractedStyleProps, style],\n [styles.part, extractedStyleProps, style],\n );\n return <View {...props} style={composedStyle} />;\n});\nfunction themedStyles(theme: AppTheme) {\n const tokens = theme.components.list;\n return StyleSheet.create({\n part: { flex: 1, minWidth: 0, gap: tokens.content.gap },\n });\n}\n"],"mappings":"AAmBS;AAnBT,SAAS,MAAM,eAAe;AAC9B,SAAS,kBAAkB;AAG3B,SAAS,eAAe,uBAAuB;AAG/C,SAAS,YAAY;AAEd,MAAM,cAAc,KAAK,SAASA,aAAY;AAAA,EACnD;AAAA,EACA,GAAG;AACL,GAAqB;AACnB,QAAM,sBAAsB,cAAc,KAAK;AAC/C,QAAM,SAAS,gBAAgB,YAAY;AAC3C,QAAM,gBAAgB;AAAA,IACpB,MAAM,CAAC,OAAO,MAAM,qBAAqB,KAAK;AAAA,IAC9C,CAAC,OAAO,MAAM,qBAAqB,KAAK;AAAA,EAC1C;AACA,SAAO,oBAAC,QAAM,GAAG,OAAO,OAAO,eAAe;AAChD,CAAC;AACD,SAAS,aAAa,OAAiB;AACrC,QAAM,SAAS,MAAM,WAAW;AAChC,SAAO,WAAW,OAAO;AAAA,IACvB,MAAM,EAAE,MAAM,GAAG,UAAU,GAAG,KAAK,OAAO,QAAQ,IAAI;AAAA,EACxD,CAAC;AACH;","names":["ListContent"]}
@@ -0,0 +1,8 @@
1
+ export { List } from './list.mjs';
2
+ import 'react';
3
+ import 'react/jsx-runtime';
4
+ import '../../types/list.types.mjs';
5
+ import '../../types/button.types.mjs';
6
+ import 'react-native';
7
+ import '@impulse-ui-native/theme';
8
+ import '../../types/view.types.mjs';
@@ -0,0 +1,5 @@
1
+ import { List } from "./list";
2
+ export {
3
+ List
4
+ };
5
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/list/index.ts"],"sourcesContent":["export { List } from \"./list\";\n"],"mappings":"AAAA,SAAS,YAAY;","names":[]}
@@ -0,0 +1,11 @@
1
+ import * as react from 'react';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+ import { ListItemProps } from '../../types/list.types.mjs';
4
+ import '../../types/button.types.mjs';
5
+ import 'react-native';
6
+ import '@impulse-ui-native/theme';
7
+ import '../../types/view.types.mjs';
8
+
9
+ declare const ListItem: react.MemoExoticComponent<({ style, ...props }: ListItemProps) => react_jsx_runtime.JSX.Element>;
10
+
11
+ export { ListItem };