@bacon-pos/ui 0.8.0 → 0.10.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 (158) hide show
  1. package/lib/commonjs/components/EmptyState/EmptyState.js +88 -0
  2. package/lib/commonjs/components/EmptyState/EmptyState.js.map +1 -0
  3. package/lib/commonjs/components/EmptyState/EmptyState.stories.js +46 -0
  4. package/lib/commonjs/components/EmptyState/EmptyState.stories.js.map +1 -0
  5. package/lib/commonjs/components/EmptyState/EmptyState.test.js +40 -0
  6. package/lib/commonjs/components/EmptyState/EmptyState.test.js.map +1 -0
  7. package/lib/commonjs/components/EmptyState/index.js +13 -0
  8. package/lib/commonjs/components/EmptyState/index.js.map +1 -0
  9. package/lib/commonjs/components/Icon/icons.generated.js +1 -0
  10. package/lib/commonjs/components/Icon/icons.generated.js.map +1 -1
  11. package/lib/commonjs/components/ProgressBar/ProgressBar.js +114 -0
  12. package/lib/commonjs/components/ProgressBar/ProgressBar.js.map +1 -0
  13. package/lib/commonjs/components/ProgressBar/ProgressBar.stories.js +93 -0
  14. package/lib/commonjs/components/ProgressBar/ProgressBar.stories.js.map +1 -0
  15. package/lib/commonjs/components/ProgressBar/ProgressBar.test.js +70 -0
  16. package/lib/commonjs/components/ProgressBar/ProgressBar.test.js.map +1 -0
  17. package/lib/commonjs/components/ProgressBar/index.js +13 -0
  18. package/lib/commonjs/components/ProgressBar/index.js.map +1 -0
  19. package/lib/commonjs/components/Sidebar/Sidebar.js +264 -0
  20. package/lib/commonjs/components/Sidebar/Sidebar.js.map +1 -0
  21. package/lib/commonjs/components/Sidebar/Sidebar.stories.js +229 -0
  22. package/lib/commonjs/components/Sidebar/Sidebar.stories.js.map +1 -0
  23. package/lib/commonjs/components/Sidebar/Sidebar.test.js +131 -0
  24. package/lib/commonjs/components/Sidebar/Sidebar.test.js.map +1 -0
  25. package/lib/commonjs/components/Sidebar/index.js +13 -0
  26. package/lib/commonjs/components/Sidebar/index.js.map +1 -0
  27. package/lib/commonjs/components/Table/DataTable.js +149 -0
  28. package/lib/commonjs/components/Table/DataTable.js.map +1 -0
  29. package/lib/commonjs/components/Table/DataTable.stories.js +214 -0
  30. package/lib/commonjs/components/Table/DataTable.stories.js.map +1 -0
  31. package/lib/commonjs/components/Table/DataTable.test.js +143 -0
  32. package/lib/commonjs/components/Table/DataTable.test.js.map +1 -0
  33. package/lib/commonjs/components/Table/Table.js +520 -0
  34. package/lib/commonjs/components/Table/Table.js.map +1 -0
  35. package/lib/commonjs/components/Table/Table.stories.js +385 -0
  36. package/lib/commonjs/components/Table/Table.stories.js.map +1 -0
  37. package/lib/commonjs/components/Table/Table.test.js +278 -0
  38. package/lib/commonjs/components/Table/Table.test.js.map +1 -0
  39. package/lib/commonjs/components/Table/index.js +20 -0
  40. package/lib/commonjs/components/Table/index.js.map +1 -0
  41. package/lib/commonjs/components/brand/BaconLogo.js +29 -0
  42. package/lib/commonjs/components/brand/BaconLogo.js.map +1 -0
  43. package/lib/commonjs/components/brand/index.js +7 -0
  44. package/lib/commonjs/components/brand/index.js.map +1 -1
  45. package/lib/commonjs/components/index.js +60 -16
  46. package/lib/commonjs/components/index.js.map +1 -1
  47. package/lib/module/components/EmptyState/EmptyState.js +84 -0
  48. package/lib/module/components/EmptyState/EmptyState.js.map +1 -0
  49. package/lib/module/components/EmptyState/EmptyState.stories.js +42 -0
  50. package/lib/module/components/EmptyState/EmptyState.stories.js.map +1 -0
  51. package/lib/module/components/EmptyState/EmptyState.test.js +40 -0
  52. package/lib/module/components/EmptyState/EmptyState.test.js.map +1 -0
  53. package/lib/module/components/EmptyState/index.js +4 -0
  54. package/lib/module/components/EmptyState/index.js.map +1 -0
  55. package/lib/module/components/Icon/icons.generated.js +1 -0
  56. package/lib/module/components/Icon/icons.generated.js.map +1 -1
  57. package/lib/module/components/ProgressBar/ProgressBar.js +110 -0
  58. package/lib/module/components/ProgressBar/ProgressBar.js.map +1 -0
  59. package/lib/module/components/ProgressBar/ProgressBar.stories.js +89 -0
  60. package/lib/module/components/ProgressBar/ProgressBar.stories.js.map +1 -0
  61. package/lib/module/components/ProgressBar/ProgressBar.test.js +70 -0
  62. package/lib/module/components/ProgressBar/ProgressBar.test.js.map +1 -0
  63. package/lib/module/components/ProgressBar/index.js +4 -0
  64. package/lib/module/components/ProgressBar/index.js.map +1 -0
  65. package/lib/module/components/Sidebar/Sidebar.js +260 -0
  66. package/lib/module/components/Sidebar/Sidebar.js.map +1 -0
  67. package/lib/module/components/Sidebar/Sidebar.stories.js +225 -0
  68. package/lib/module/components/Sidebar/Sidebar.stories.js.map +1 -0
  69. package/lib/module/components/Sidebar/Sidebar.test.js +131 -0
  70. package/lib/module/components/Sidebar/Sidebar.test.js.map +1 -0
  71. package/lib/module/components/Sidebar/index.js +4 -0
  72. package/lib/module/components/Sidebar/index.js.map +1 -0
  73. package/lib/module/components/Table/DataTable.js +145 -0
  74. package/lib/module/components/Table/DataTable.js.map +1 -0
  75. package/lib/module/components/Table/DataTable.stories.js +210 -0
  76. package/lib/module/components/Table/DataTable.stories.js.map +1 -0
  77. package/lib/module/components/Table/DataTable.test.js +143 -0
  78. package/lib/module/components/Table/DataTable.test.js.map +1 -0
  79. package/lib/module/components/Table/Table.js +516 -0
  80. package/lib/module/components/Table/Table.js.map +1 -0
  81. package/lib/module/components/Table/Table.stories.js +381 -0
  82. package/lib/module/components/Table/Table.stories.js.map +1 -0
  83. package/lib/module/components/Table/Table.test.js +278 -0
  84. package/lib/module/components/Table/Table.test.js.map +1 -0
  85. package/lib/module/components/Table/index.js +5 -0
  86. package/lib/module/components/Table/index.js.map +1 -0
  87. package/lib/module/components/brand/BaconLogo.js +25 -0
  88. package/lib/module/components/brand/BaconLogo.js.map +1 -0
  89. package/lib/module/components/brand/index.js +1 -0
  90. package/lib/module/components/brand/index.js.map +1 -1
  91. package/lib/module/components/index.js +4 -0
  92. package/lib/module/components/index.js.map +1 -1
  93. package/lib/typescript/commonjs/components/EmptyState/EmptyState.d.ts +30 -0
  94. package/lib/typescript/commonjs/components/EmptyState/EmptyState.d.ts.map +1 -0
  95. package/lib/typescript/commonjs/components/EmptyState/index.d.ts +3 -0
  96. package/lib/typescript/commonjs/components/EmptyState/index.d.ts.map +1 -0
  97. package/lib/typescript/commonjs/components/Icon/icons.generated.d.ts +1 -0
  98. package/lib/typescript/commonjs/components/Icon/icons.generated.d.ts.map +1 -1
  99. package/lib/typescript/commonjs/components/ProgressBar/ProgressBar.d.ts +37 -0
  100. package/lib/typescript/commonjs/components/ProgressBar/ProgressBar.d.ts.map +1 -0
  101. package/lib/typescript/commonjs/components/ProgressBar/index.d.ts +3 -0
  102. package/lib/typescript/commonjs/components/ProgressBar/index.d.ts.map +1 -0
  103. package/lib/typescript/commonjs/components/Sidebar/Sidebar.d.ts +57 -0
  104. package/lib/typescript/commonjs/components/Sidebar/Sidebar.d.ts.map +1 -0
  105. package/lib/typescript/commonjs/components/Sidebar/index.d.ts +3 -0
  106. package/lib/typescript/commonjs/components/Sidebar/index.d.ts.map +1 -0
  107. package/lib/typescript/commonjs/components/Table/DataTable.d.ts +53 -0
  108. package/lib/typescript/commonjs/components/Table/DataTable.d.ts.map +1 -0
  109. package/lib/typescript/commonjs/components/Table/Table.d.ts +85 -0
  110. package/lib/typescript/commonjs/components/Table/Table.d.ts.map +1 -0
  111. package/lib/typescript/commonjs/components/Table/index.d.ts +5 -0
  112. package/lib/typescript/commonjs/components/Table/index.d.ts.map +1 -0
  113. package/lib/typescript/commonjs/components/brand/BaconLogo.d.ts +13 -0
  114. package/lib/typescript/commonjs/components/brand/BaconLogo.d.ts.map +1 -0
  115. package/lib/typescript/commonjs/components/brand/index.d.ts +1 -0
  116. package/lib/typescript/commonjs/components/brand/index.d.ts.map +1 -1
  117. package/lib/typescript/commonjs/components/index.d.ts +4 -0
  118. package/lib/typescript/commonjs/components/index.d.ts.map +1 -1
  119. package/lib/typescript/module/components/EmptyState/EmptyState.d.ts +30 -0
  120. package/lib/typescript/module/components/EmptyState/EmptyState.d.ts.map +1 -0
  121. package/lib/typescript/module/components/EmptyState/index.d.ts +3 -0
  122. package/lib/typescript/module/components/EmptyState/index.d.ts.map +1 -0
  123. package/lib/typescript/module/components/Icon/icons.generated.d.ts +1 -0
  124. package/lib/typescript/module/components/Icon/icons.generated.d.ts.map +1 -1
  125. package/lib/typescript/module/components/ProgressBar/ProgressBar.d.ts +37 -0
  126. package/lib/typescript/module/components/ProgressBar/ProgressBar.d.ts.map +1 -0
  127. package/lib/typescript/module/components/ProgressBar/index.d.ts +3 -0
  128. package/lib/typescript/module/components/ProgressBar/index.d.ts.map +1 -0
  129. package/lib/typescript/module/components/Sidebar/Sidebar.d.ts +57 -0
  130. package/lib/typescript/module/components/Sidebar/Sidebar.d.ts.map +1 -0
  131. package/lib/typescript/module/components/Sidebar/index.d.ts +3 -0
  132. package/lib/typescript/module/components/Sidebar/index.d.ts.map +1 -0
  133. package/lib/typescript/module/components/Table/DataTable.d.ts +53 -0
  134. package/lib/typescript/module/components/Table/DataTable.d.ts.map +1 -0
  135. package/lib/typescript/module/components/Table/Table.d.ts +85 -0
  136. package/lib/typescript/module/components/Table/Table.d.ts.map +1 -0
  137. package/lib/typescript/module/components/Table/index.d.ts +5 -0
  138. package/lib/typescript/module/components/Table/index.d.ts.map +1 -0
  139. package/lib/typescript/module/components/brand/BaconLogo.d.ts +13 -0
  140. package/lib/typescript/module/components/brand/BaconLogo.d.ts.map +1 -0
  141. package/lib/typescript/module/components/brand/index.d.ts +1 -0
  142. package/lib/typescript/module/components/brand/index.d.ts.map +1 -1
  143. package/lib/typescript/module/components/index.d.ts +4 -0
  144. package/lib/typescript/module/components/index.d.ts.map +1 -1
  145. package/package.json +1 -1
  146. package/src/components/EmptyState/EmptyState.tsx +91 -0
  147. package/src/components/EmptyState/index.ts +2 -0
  148. package/src/components/Icon/icons.generated.ts +1 -0
  149. package/src/components/ProgressBar/ProgressBar.tsx +135 -0
  150. package/src/components/ProgressBar/index.ts +2 -0
  151. package/src/components/Sidebar/Sidebar.tsx +320 -0
  152. package/src/components/Sidebar/index.ts +2 -0
  153. package/src/components/Table/DataTable.tsx +173 -0
  154. package/src/components/Table/Table.tsx +556 -0
  155. package/src/components/Table/index.ts +10 -0
  156. package/src/components/brand/BaconLogo.tsx +25 -0
  157. package/src/components/brand/index.ts +1 -0
  158. package/src/components/index.ts +4 -0
@@ -0,0 +1,110 @@
1
+ "use strict";
2
+
3
+ import { useEffect, useRef } from 'react';
4
+ import { Animated, Easing, View } from 'react-native';
5
+ import { useTheme } from "../../theme/index.js";
6
+ import { Text } from "../Text/Text.js";
7
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
8
+ const clamp01 = n => n < 0 ? 0 : n > 1 ? 1 : n;
9
+
10
+ /**
11
+ * Determinate progress bar — the Figma "Loader". Drive it with a `progress`
12
+ * (0–1) prop from whatever is loading; the fill animates to match. A supporting
13
+ * row underneath shows a customizable `label` (default "Downloading...") on the
14
+ * left and the percentage on the right. Colors, height and width are tokens/props.
15
+ */
16
+ export function ProgressBar({
17
+ progress,
18
+ label = 'Downloading...',
19
+ showSupporting = true,
20
+ showValue = true,
21
+ formatValue,
22
+ height = 32,
23
+ width,
24
+ color,
25
+ trackColor,
26
+ borderColor,
27
+ animated = true,
28
+ style,
29
+ accessibilityLabel
30
+ }) {
31
+ const theme = useTheme();
32
+ const value = clamp01(progress);
33
+ const percent = Math.round(value * 100);
34
+ const anim = useRef(new Animated.Value(value)).current;
35
+ useEffect(() => {
36
+ if (animated) {
37
+ Animated.timing(anim, {
38
+ toValue: value,
39
+ duration: 240,
40
+ easing: Easing.out(Easing.ease),
41
+ useNativeDriver: false // width can't use the native driver
42
+ }).start();
43
+ } else {
44
+ anim.setValue(value);
45
+ }
46
+ }, [value, animated, anim]);
47
+ const fillWidth = anim.interpolate({
48
+ inputRange: [0, 1],
49
+ outputRange: ['0%', '100%'],
50
+ extrapolate: 'clamp'
51
+ });
52
+ const inset = 2.5;
53
+ return /*#__PURE__*/_jsxs(View, {
54
+ style: [{
55
+ gap: 12,
56
+ width: width ?? undefined,
57
+ alignSelf: width != null ? 'flex-start' : 'stretch'
58
+ }, style],
59
+ accessibilityRole: "progressbar",
60
+ accessibilityLabel: accessibilityLabel ?? label,
61
+ accessibilityValue: {
62
+ min: 0,
63
+ max: 100,
64
+ now: percent
65
+ },
66
+ children: [/*#__PURE__*/_jsx(View, {
67
+ style: {
68
+ height,
69
+ borderRadius: height / 2,
70
+ borderWidth: 1.5,
71
+ borderColor: borderColor ?? theme.colors.border.default,
72
+ backgroundColor: trackColor ?? theme.colors.background.subtle,
73
+ padding: inset,
74
+ justifyContent: 'center',
75
+ overflow: 'hidden'
76
+ },
77
+ children: /*#__PURE__*/_jsx(Animated.View, {
78
+ style: {
79
+ width: fillWidth,
80
+ height: '100%',
81
+ borderRadius: height / 2,
82
+ backgroundColor: color ?? theme.colors.action.primary
83
+ }
84
+ })
85
+ }), showSupporting ? /*#__PURE__*/_jsxs(View, {
86
+ style: {
87
+ flexDirection: 'row',
88
+ alignItems: 'center',
89
+ justifyContent: 'space-between',
90
+ paddingHorizontal: 8,
91
+ gap: 8
92
+ },
93
+ children: [/*#__PURE__*/_jsx(Text, {
94
+ variant: "bodyLarge",
95
+ color: "secondary",
96
+ numberOfLines: 1,
97
+ style: {
98
+ flexShrink: 1
99
+ },
100
+ children: label
101
+ }), showValue ? /*#__PURE__*/_jsx(Text, {
102
+ variant: "bodyLarge",
103
+ color: "secondary",
104
+ numberOfLines: 1,
105
+ children: formatValue ? formatValue(value) : `${percent}%`
106
+ }) : null]
107
+ }) : null]
108
+ });
109
+ }
110
+ //# sourceMappingURL=ProgressBar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useEffect","useRef","Animated","Easing","View","useTheme","Text","jsx","_jsx","jsxs","_jsxs","clamp01","n","ProgressBar","progress","label","showSupporting","showValue","formatValue","height","width","color","trackColor","borderColor","animated","style","accessibilityLabel","theme","value","percent","Math","round","anim","Value","current","timing","toValue","duration","easing","out","ease","useNativeDriver","start","setValue","fillWidth","interpolate","inputRange","outputRange","extrapolate","inset","gap","undefined","alignSelf","accessibilityRole","accessibilityValue","min","max","now","children","borderRadius","borderWidth","colors","border","default","backgroundColor","background","subtle","padding","justifyContent","overflow","action","primary","flexDirection","alignItems","paddingHorizontal","variant","numberOfLines","flexShrink"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/ProgressBar/ProgressBar.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,89 @@
1
+ "use strict";
2
+
3
+ import { useEffect, useState } from 'react';
4
+ import { View } from 'react-native';
5
+ import { ProgressBar } from "./ProgressBar.js";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ const meta = {
8
+ title: 'Components/ProgressBar',
9
+ component: ProgressBar
10
+ };
11
+ export default meta;
12
+ /** Static progress (Figma "Loader"). */
13
+ export const Default = {
14
+ render: () => /*#__PURE__*/_jsx(View, {
15
+ style: {
16
+ padding: 24,
17
+ width: 520
18
+ },
19
+ children: /*#__PURE__*/_jsx(ProgressBar, {
20
+ progress: 0.47
21
+ })
22
+ })
23
+ };
24
+
25
+ /** Live download — progress driven by a prop. */
26
+ export const Downloading = {
27
+ render: () => {
28
+ const [progress, setProgress] = useState(0);
29
+ useEffect(() => {
30
+ const id = setInterval(() => {
31
+ setProgress(p => p >= 1 ? 0 : Math.min(1, p + 0.07));
32
+ }, 500);
33
+ return () => clearInterval(id);
34
+ }, []);
35
+ return /*#__PURE__*/_jsx(View, {
36
+ style: {
37
+ padding: 24,
38
+ width: 520
39
+ },
40
+ children: /*#__PURE__*/_jsx(ProgressBar, {
41
+ progress: progress
42
+ })
43
+ });
44
+ }
45
+ };
46
+
47
+ /** Custom label. */
48
+ export const CustomLabel = {
49
+ render: () => /*#__PURE__*/_jsx(View, {
50
+ style: {
51
+ padding: 24,
52
+ width: 520
53
+ },
54
+ children: /*#__PURE__*/_jsx(ProgressBar, {
55
+ progress: 0.8,
56
+ label: "Uploading receipt\u2026"
57
+ })
58
+ })
59
+ };
60
+
61
+ /** Bar only — no supporting row. */
62
+ export const BarOnly = {
63
+ render: () => /*#__PURE__*/_jsx(View, {
64
+ style: {
65
+ padding: 24,
66
+ width: 520
67
+ },
68
+ children: /*#__PURE__*/_jsx(ProgressBar, {
69
+ progress: 0.35,
70
+ showSupporting: false
71
+ })
72
+ })
73
+ };
74
+
75
+ /** Custom format on the right (e.g. counts). */
76
+ export const CustomValue = {
77
+ render: () => /*#__PURE__*/_jsx(View, {
78
+ style: {
79
+ padding: 24,
80
+ width: 520
81
+ },
82
+ children: /*#__PURE__*/_jsx(ProgressBar, {
83
+ progress: 0.6,
84
+ label: "Syncing orders",
85
+ formatValue: p => `${Math.round(p * 120)}/120`
86
+ })
87
+ })
88
+ };
89
+ //# sourceMappingURL=ProgressBar.stories.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useEffect","useState","View","ProgressBar","jsx","_jsx","meta","title","component","Default","render","style","padding","width","children","progress","Downloading","setProgress","id","setInterval","p","Math","min","clearInterval","CustomLabel","label","BarOnly","showSupporting","CustomValue","formatValue","round"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/ProgressBar/ProgressBar.stories.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE3C,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,WAAW,QAAQ,kBAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE5C,MAAMC,IAAI,GAAG;EACXC,KAAK,EAAE,wBAAwB;EAC/BC,SAAS,EAAEL;AACb,CAAoC;AAEpC,eAAeG,IAAI;AAGnB;AACA,OAAO,MAAMG,OAAc,GAAG;EAC5BC,MAAM,EAAEA,CAAA,kBACNL,IAAA,CAACH,IAAI;IAACS,KAAK,EAAE;MAAEC,OAAO,EAAE,EAAE;MAAEC,KAAK,EAAE;IAAI,CAAE;IAAAC,QAAA,eACvCT,IAAA,CAACF,WAAW;MAACY,QAAQ,EAAE;IAAK,CAAE;EAAC,CAC3B;AAEV,CAAC;;AAED;AACA,OAAO,MAAMC,WAAkB,GAAG;EAChCN,MAAM,EAAEA,CAAA,KAAM;IACZ,MAAM,CAACK,QAAQ,EAAEE,WAAW,CAAC,GAAGhB,QAAQ,CAAC,CAAC,CAAC;IAC3CD,SAAS,CAAC,MAAM;MACd,MAAMkB,EAAE,GAAGC,WAAW,CAAC,MAAM;QAC3BF,WAAW,CAAEG,CAAC,IAAMA,CAAC,IAAI,CAAC,GAAG,CAAC,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEF,CAAC,GAAG,IAAI,CAAE,CAAC;MAC1D,CAAC,EAAE,GAAG,CAAC;MACP,OAAO,MAAMG,aAAa,CAACL,EAAE,CAAC;IAChC,CAAC,EAAE,EAAE,CAAC;IACN,oBACEb,IAAA,CAACH,IAAI;MAACS,KAAK,EAAE;QAAEC,OAAO,EAAE,EAAE;QAAEC,KAAK,EAAE;MAAI,CAAE;MAAAC,QAAA,eACvCT,IAAA,CAACF,WAAW;QAACY,QAAQ,EAAEA;MAAS,CAAE;IAAC,CAC/B,CAAC;EAEX;AACF,CAAC;;AAED;AACA,OAAO,MAAMS,WAAkB,GAAG;EAChCd,MAAM,EAAEA,CAAA,kBACNL,IAAA,CAACH,IAAI;IAACS,KAAK,EAAE;MAAEC,OAAO,EAAE,EAAE;MAAEC,KAAK,EAAE;IAAI,CAAE;IAAAC,QAAA,eACvCT,IAAA,CAACF,WAAW;MAACY,QAAQ,EAAE,GAAI;MAACU,KAAK,EAAC;IAAoB,CAAE;EAAC,CACrD;AAEV,CAAC;;AAED;AACA,OAAO,MAAMC,OAAc,GAAG;EAC5BhB,MAAM,EAAEA,CAAA,kBACNL,IAAA,CAACH,IAAI;IAACS,KAAK,EAAE;MAAEC,OAAO,EAAE,EAAE;MAAEC,KAAK,EAAE;IAAI,CAAE;IAAAC,QAAA,eACvCT,IAAA,CAACF,WAAW;MAACY,QAAQ,EAAE,IAAK;MAACY,cAAc,EAAE;IAAM,CAAE;EAAC,CAClD;AAEV,CAAC;;AAED;AACA,OAAO,MAAMC,WAAkB,GAAG;EAChClB,MAAM,EAAEA,CAAA,kBACNL,IAAA,CAACH,IAAI;IAACS,KAAK,EAAE;MAAEC,OAAO,EAAE,EAAE;MAAEC,KAAK,EAAE;IAAI,CAAE;IAAAC,QAAA,eACvCT,IAAA,CAACF,WAAW;MACVY,QAAQ,EAAE,GAAI;MACdU,KAAK,EAAC,gBAAgB;MACtBI,WAAW,EAAGT,CAAC,IAAK,GAAGC,IAAI,CAACS,KAAK,CAACV,CAAC,GAAG,GAAG,CAAC;IAAO,CAClD;EAAC,CACE;AAEV,CAAC","ignoreList":[]}
@@ -0,0 +1,70 @@
1
+ "use strict";
2
+
3
+ import { render, screen } from '@testing-library/react-native';
4
+ import { ThemeProvider } from "../../theme/index.js";
5
+ import { ProgressBar } from "./ProgressBar.js";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ function wrap(ui) {
8
+ return render(/*#__PURE__*/_jsx(ThemeProvider, {
9
+ children: ui
10
+ }));
11
+ }
12
+ describe('ProgressBar', () => {
13
+ it('shows the default label and the rounded percentage', () => {
14
+ wrap(/*#__PURE__*/_jsx(ProgressBar, {
15
+ progress: 0.47
16
+ }));
17
+ expect(screen.getByText('Downloading...')).toBeTruthy();
18
+ expect(screen.getByText('47%')).toBeTruthy();
19
+ });
20
+ it('uses a custom label', () => {
21
+ wrap(/*#__PURE__*/_jsx(ProgressBar, {
22
+ progress: 0.5,
23
+ label: "Uploading\u2026"
24
+ }));
25
+ expect(screen.getByText('Uploading…')).toBeTruthy();
26
+ expect(screen.queryByText('Downloading...')).toBeNull();
27
+ });
28
+ it('clamps progress to 0–100', () => {
29
+ const {
30
+ rerender
31
+ } = wrap(/*#__PURE__*/_jsx(ProgressBar, {
32
+ progress: 1.8
33
+ }));
34
+ expect(screen.getByText('100%')).toBeTruthy();
35
+ rerender(/*#__PURE__*/_jsx(ThemeProvider, {
36
+ children: /*#__PURE__*/_jsx(ProgressBar, {
37
+ progress: -0.5
38
+ })
39
+ }));
40
+ expect(screen.getByText('0%')).toBeTruthy();
41
+ });
42
+ it('supports a custom value formatter', () => {
43
+ wrap(/*#__PURE__*/_jsx(ProgressBar, {
44
+ progress: 0.5,
45
+ formatValue: p => `${Math.round(p * 120)}/120`
46
+ }));
47
+ expect(screen.getByText('60/120')).toBeTruthy();
48
+ });
49
+ it('hides the supporting row when showSupporting is false', () => {
50
+ wrap(/*#__PURE__*/_jsx(ProgressBar, {
51
+ progress: 0.5,
52
+ showSupporting: false
53
+ }));
54
+ expect(screen.queryByText('Downloading...')).toBeNull();
55
+ expect(screen.queryByText('50%')).toBeNull();
56
+ });
57
+ it('exposes the progress value for accessibility', () => {
58
+ wrap(/*#__PURE__*/_jsx(ProgressBar, {
59
+ progress: 0.3,
60
+ accessibilityLabel: "Download"
61
+ }));
62
+ const bar = screen.getByLabelText('Download');
63
+ expect(bar.props.accessibilityValue).toEqual({
64
+ min: 0,
65
+ max: 100,
66
+ now: 30
67
+ });
68
+ });
69
+ });
70
+ //# sourceMappingURL=ProgressBar.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["render","screen","ThemeProvider","ProgressBar","jsx","_jsx","wrap","ui","children","describe","it","progress","expect","getByText","toBeTruthy","label","queryByText","toBeNull","rerender","formatValue","p","Math","round","showSupporting","accessibilityLabel","bar","getByLabelText","props","accessibilityValue","toEqual","min","max","now"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/ProgressBar/ProgressBar.test.tsx"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+
3
+ export { ProgressBar } from "./ProgressBar.js";
4
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["ProgressBar"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/ProgressBar/index.ts"],"mappings":";;AAAA,SAASA,WAAW,QAAQ,kBAAe","ignoreList":[]}
@@ -0,0 +1,260 @@
1
+ "use strict";
2
+
3
+ import { useEffect, useRef, useState } from 'react';
4
+ import { Animated, Easing, Pressable, View } from 'react-native';
5
+ import { useTheme } from "../../theme/index.js";
6
+ import { BaconLogo } from "../brand/BaconLogo.js";
7
+ import { Icon } from "../Icon/Icon.js";
8
+ import { IconButton } from "../IconButton/IconButton.js";
9
+ import { Text } from "../Text/Text.js";
10
+ import { ScrollArea } from "../_internal/ScrollArea.js";
11
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
12
+ const ITEM_HEIGHT = 74;
13
+ const ITEM_GAP = 16;
14
+ const PADDING = 24;
15
+ const TOGGLE_SIZE = 40; // IconButton size "sm"
16
+
17
+ function SidebarButton({
18
+ item,
19
+ active,
20
+ collapsed,
21
+ onPress
22
+ }) {
23
+ const theme = useTheme();
24
+ const [hovered, setHovered] = useState(false);
25
+ const disabled = item.disabled;
26
+ const backgroundColor = active ? theme.colors.action.secondary : hovered && !disabled ? theme.colors.background.muted : 'transparent';
27
+ const contentColor = active ? theme.colors.action.secondaryForeground : theme.colors.text.secondary;
28
+ const iconColor = active ? theme.colors.action.secondaryForeground : 'secondary';
29
+ const iconName = active && item.activeIcon ? item.activeIcon : item.icon;
30
+ const initial = item.label.trim().charAt(0).toUpperCase();
31
+
32
+ // Leading slot is always a fixed 24×24 box (flexShrink: 0) so the icon never
33
+ // shrinks next to a long label and labels stay aligned with or without an icon.
34
+ // No icon → reserve the space when expanded; show the initial when collapsed.
35
+ const leadingBox = {
36
+ width: 24,
37
+ height: 24,
38
+ flexShrink: 0,
39
+ alignItems: 'center',
40
+ justifyContent: 'center'
41
+ };
42
+ const leading = /*#__PURE__*/_jsx(View, {
43
+ style: leadingBox,
44
+ children: iconName ? /*#__PURE__*/_jsx(Icon, {
45
+ name: iconName,
46
+ size: 24,
47
+ color: iconColor
48
+ }) : collapsed ? /*#__PURE__*/_jsx(Text, {
49
+ variant: "bodyLarge",
50
+ weight: "medium",
51
+ color: contentColor,
52
+ children: initial
53
+ }) : null
54
+ });
55
+ return /*#__PURE__*/_jsxs(Pressable, {
56
+ onPress: disabled ? undefined : onPress,
57
+ onHoverIn: () => setHovered(true),
58
+ onHoverOut: () => setHovered(false),
59
+ disabled: disabled,
60
+ accessibilityRole: "tab",
61
+ accessibilityState: {
62
+ selected: active,
63
+ disabled
64
+ },
65
+ accessibilityLabel: item.label,
66
+ style: {
67
+ flexDirection: 'row',
68
+ alignItems: 'center',
69
+ justifyContent: collapsed ? 'center' : 'flex-start',
70
+ gap: 10,
71
+ height: ITEM_HEIGHT,
72
+ paddingHorizontal: PADDING,
73
+ borderRadius: theme.radii.pill,
74
+ borderWidth: active ? 1 : 0,
75
+ borderColor: active ? theme.colors.border.default : 'transparent',
76
+ backgroundColor,
77
+ opacity: disabled ? 0.5 : 1
78
+ },
79
+ children: [leading, !collapsed ? /*#__PURE__*/_jsx(Text, {
80
+ variant: "bodyLarge",
81
+ weight: "medium",
82
+ color: contentColor,
83
+ numberOfLines: 1,
84
+ ellipsizeMode: "tail",
85
+ style: {
86
+ flexShrink: 1,
87
+ minWidth: 0
88
+ },
89
+ children: item.label
90
+ }) : null]
91
+ });
92
+ }
93
+
94
+ /**
95
+ * Sidebar — the app's main navigation drawer (Figma "Sidebar"). Expands/collapses
96
+ * between a labelled and an icon-only rail (animated width). The logo defaults to
97
+ * the Bacon mark (override via `logo`); an optional `footer` shows supporting text
98
+ * at the bottom. Items are dynamic buttons (icon + label via props); the list
99
+ * scrolls with an elegant auto-hiding indicator when it overflows, leaving the
100
+ * footer pinned. Buttons have hover and active states to mark the current section.
101
+ */
102
+ export function Sidebar({
103
+ items = [],
104
+ activeKey,
105
+ defaultActiveKey,
106
+ onChange,
107
+ collapsed: collapsedProp,
108
+ defaultCollapsed = false,
109
+ onCollapsedChange,
110
+ showToggle = true,
111
+ logo,
112
+ footer,
113
+ expandedWidth = 284,
114
+ collapsedWidth = 122,
115
+ scrollbarColor,
116
+ style
117
+ }) {
118
+ const theme = useTheme();
119
+ const activeControlled = activeKey !== undefined;
120
+ const [activeInternal, setActiveInternal] = useState(defaultActiveKey);
121
+ const active = activeControlled ? activeKey : activeInternal;
122
+ const collapseControlled = collapsedProp !== undefined;
123
+ const [collapsedInternal, setCollapsedInternal] = useState(defaultCollapsed);
124
+ const collapsed = collapseControlled ? collapsedProp : collapsedInternal;
125
+ const width = useRef(new Animated.Value(collapsed ? collapsedWidth : expandedWidth)).current;
126
+ // `visualCollapsed` drives the layout (labels, alignment, footer). It lags on
127
+ // collapse — labels stay mounted (clipped by overflow) until the width finishes
128
+ // shrinking — and leads on expand, so both directions animate without a jump.
129
+ const [visualCollapsed, setVisualCollapsed] = useState(collapsed);
130
+ useEffect(() => {
131
+ if (!collapsed) setVisualCollapsed(false);
132
+ const anim = Animated.timing(width, {
133
+ toValue: collapsed ? collapsedWidth : expandedWidth,
134
+ duration: 220,
135
+ easing: Easing.out(Easing.ease),
136
+ useNativeDriver: false // width
137
+ });
138
+ anim.start(({
139
+ finished
140
+ }) => {
141
+ if (finished && collapsed) setVisualCollapsed(true);
142
+ });
143
+ return () => anim.stop();
144
+ }, [collapsed, collapsedWidth, expandedWidth, width]);
145
+
146
+ // The toggle arrow spins in place (0° → 180°) instead of moving, so collapsing
147
+ // never nudges it. Driven by intent (`collapsed`), in sync with the width.
148
+ const arrowRot = useRef(new Animated.Value(collapsed ? 1 : 0)).current;
149
+ useEffect(() => {
150
+ const anim = Animated.timing(arrowRot, {
151
+ toValue: collapsed ? 1 : 0,
152
+ duration: 220,
153
+ easing: Easing.out(Easing.ease),
154
+ useNativeDriver: true
155
+ });
156
+ anim.start();
157
+ return () => anim.stop();
158
+ }, [collapsed, arrowRot]);
159
+ const arrowRotate = arrowRot.interpolate({
160
+ inputRange: [0, 1],
161
+ outputRange: ['0deg', '180deg']
162
+ });
163
+
164
+ // Glide the toggle from flush-left (expanded) to centered on the icon axis
165
+ // (collapsed), tracking the width so it never jumps.
166
+ const toggleTranslateX = width.interpolate({
167
+ inputRange: [collapsedWidth, expandedWidth],
168
+ outputRange: [Math.max(0, (collapsedWidth - 2 * PADDING - TOGGLE_SIZE) / 2), 0],
169
+ extrapolate: 'clamp'
170
+ });
171
+ const selectItem = item => {
172
+ if (!activeControlled) setActiveInternal(item.key);
173
+ item.onPress?.();
174
+ onChange?.(item.key);
175
+ };
176
+ const toggleCollapsed = () => {
177
+ const next = !collapsed;
178
+ if (!collapseControlled) setCollapsedInternal(next);
179
+ onCollapsedChange?.(next);
180
+ };
181
+ const logoNode = logo ?? /*#__PURE__*/_jsx(BaconLogo, {
182
+ height: visualCollapsed ? 36 : 40
183
+ });
184
+ const toggle = showToggle ? /*#__PURE__*/_jsx(Animated.View, {
185
+ style: {
186
+ transform: [{
187
+ translateX: toggleTranslateX
188
+ }]
189
+ },
190
+ children: /*#__PURE__*/_jsx(Animated.View, {
191
+ style: {
192
+ transform: [{
193
+ rotate: arrowRotate
194
+ }]
195
+ },
196
+ children: /*#__PURE__*/_jsx(IconButton, {
197
+ icon: "arrow-left",
198
+ accessibilityLabel: collapsed ? 'Expand sidebar' : 'Collapse sidebar',
199
+ variant: "ghost",
200
+ size: "sm",
201
+ onPress: toggleCollapsed
202
+ })
203
+ })
204
+ }) : null;
205
+ return /*#__PURE__*/_jsxs(Animated.View, {
206
+ style: [{
207
+ width,
208
+ height: '100%',
209
+ backgroundColor: theme.colors.background.default,
210
+ paddingTop: 48,
211
+ paddingBottom: PADDING,
212
+ paddingHorizontal: PADDING,
213
+ overflow: 'hidden'
214
+ }, style],
215
+ children: [/*#__PURE__*/_jsx(View, {
216
+ style: {
217
+ minHeight: 56,
218
+ alignItems: visualCollapsed ? 'center' : 'flex-start',
219
+ justifyContent: 'center'
220
+ },
221
+ children: logoNode
222
+ }), /*#__PURE__*/_jsx(ScrollArea, {
223
+ style: {
224
+ flex: 1,
225
+ marginTop: 32
226
+ },
227
+ indicatorColor: scrollbarColor ?? theme.colors.border.strong,
228
+ contentContainerStyle: {
229
+ gap: ITEM_GAP,
230
+ paddingBottom: 8
231
+ },
232
+ children: items.map(item => /*#__PURE__*/_jsx(SidebarButton, {
233
+ item: item,
234
+ active: item.key === active,
235
+ collapsed: visualCollapsed,
236
+ onPress: () => selectItem(item)
237
+ }, item.key))
238
+ }), /*#__PURE__*/_jsxs(View, {
239
+ style: {
240
+ marginTop: 28,
241
+ gap: 16
242
+ },
243
+ children: [footer && !visualCollapsed ? /*#__PURE__*/_jsx(Text, {
244
+ variant: "bodySmall",
245
+ color: "tertiary",
246
+ numberOfLines: 1,
247
+ style: {
248
+ marginLeft: 8
249
+ },
250
+ children: footer
251
+ }) : null, toggle ? /*#__PURE__*/_jsx(View, {
252
+ style: {
253
+ alignItems: 'flex-start'
254
+ },
255
+ children: toggle
256
+ }) : null]
257
+ })]
258
+ });
259
+ }
260
+ //# sourceMappingURL=Sidebar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useEffect","useRef","useState","Animated","Easing","Pressable","View","useTheme","BaconLogo","Icon","IconButton","Text","ScrollArea","jsx","_jsx","jsxs","_jsxs","ITEM_HEIGHT","ITEM_GAP","PADDING","TOGGLE_SIZE","SidebarButton","item","active","collapsed","onPress","theme","hovered","setHovered","disabled","backgroundColor","colors","action","secondary","background","muted","contentColor","secondaryForeground","text","iconColor","iconName","activeIcon","icon","initial","label","trim","charAt","toUpperCase","leadingBox","width","height","flexShrink","alignItems","justifyContent","leading","style","children","name","size","color","variant","weight","undefined","onHoverIn","onHoverOut","accessibilityRole","accessibilityState","selected","accessibilityLabel","flexDirection","gap","paddingHorizontal","borderRadius","radii","pill","borderWidth","borderColor","border","default","opacity","numberOfLines","ellipsizeMode","minWidth","Sidebar","items","activeKey","defaultActiveKey","onChange","collapsedProp","defaultCollapsed","onCollapsedChange","showToggle","logo","footer","expandedWidth","collapsedWidth","scrollbarColor","activeControlled","activeInternal","setActiveInternal","collapseControlled","collapsedInternal","setCollapsedInternal","Value","current","visualCollapsed","setVisualCollapsed","anim","timing","toValue","duration","easing","out","ease","useNativeDriver","start","finished","stop","arrowRot","arrowRotate","interpolate","inputRange","outputRange","toggleTranslateX","Math","max","extrapolate","selectItem","key","toggleCollapsed","next","logoNode","toggle","transform","translateX","rotate","paddingTop","paddingBottom","overflow","minHeight","flex","marginTop","indicatorColor","strong","contentContainerStyle","map","marginLeft"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/Sidebar/Sidebar.tsx"],"mappings":"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","ignoreList":[]}