@jobber/components-native 0.116.11 → 0.117.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.
package/README.md CHANGED
@@ -32,6 +32,28 @@ export function MyComponent() {
32
32
  }
33
33
  ```
34
34
 
35
+ ## Unstyled primitives
36
+
37
+ For advanced/experimental use, Atlantis exposes selected
38
+ [RN Primitives](https://rnprimitives.com/toast/) through
39
+ `@jobber/components-native/unstyledPrimitives`. Prefer styled Atlantis
40
+ components when possible, and reach out to UXF for guidance and support.
41
+
42
+ ```tsx
43
+ import { Toast } from "@jobber/components-native/unstyledPrimitives";
44
+
45
+ <Toast.Root open={open} onOpenChange={setOpen}>
46
+ <Toast.Title>Saved</Toast.Title>
47
+ <Toast.Description>Your changes were saved.</Toast.Description>
48
+ </Toast.Root>;
49
+ ```
50
+
51
+ The `Toast` namespace exposes the upstream components and types, including
52
+ `Root`, `Title`, `Description`, `Action`, and `Close`. Atlantis manages the
53
+ dependency version, so product repos do not need to install
54
+ `@rn-primitives/toast` directly. Product teams own styling, positioning, timing,
55
+ and composition; this export does not provide a toast manager or queue.
56
+
35
57
  ## Setting up with Jest
36
58
 
37
59
  In order to make `@jobber/components-native` work with Jest, you may need to
@@ -262,6 +262,17 @@ function App() {
262
262
  }
263
263
  ```
264
264
 
265
+ ### Active breakpoint (Web Only)
266
+
267
+ On web, `AtlantisThemeContextProvider` also provides the active breakpoint that
268
+ [`useBreakpoints`](/hooks/useBreakpoints) and
269
+ [`useResponsiveValue`](/hooks/useResponsiveValue) read, so apps don't add a
270
+ `BreakpointProvider` themselves. It subscribes to the viewport once, however
271
+ many components use the hooks.
272
+
273
+ Nested providers reuse the breakpoint from the outer provider instead of
274
+ subscribing again.
275
+
265
276
  ### Creating themed styles with buildThemedStyles (Mobile Only)
266
277
 
267
278
  The `buildThemedStyles` utility is available to help create themed StyleSheets
@@ -9,6 +9,10 @@ We have 3 different ways to deal with responsive breakpoints in our components.
9
9
  components responsive depending on the size of its container rather than the
10
10
  browser.
11
11
 
12
+ Use [`useBreakpoints`](/hooks/useBreakpoints) to read the active breakpoint in
13
+ JS, and [`useResponsiveValue`](/hooks/useResponsiveValue) to choose a value per
14
+ breakpoint. Both use the same breakpoint values as the CSS variables.
15
+
12
16
  ## CSS variables
13
17
 
14
18
  We have 5 CSS breakpoints that you can choose from when styling your components.
package/dist/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jobber/components-native",
3
- "version": "0.116.11",
3
+ "version": "0.117.0",
4
4
  "license": "MIT",
5
5
  "description": "React Native implementation of Atlantis",
6
6
  "author": "The Frends",
@@ -17,6 +17,10 @@
17
17
  "types": "./dist/types/src/primitives/index.d.ts",
18
18
  "default": "./dist/src/primitives/index.js"
19
19
  },
20
+ "./unstyledPrimitives": {
21
+ "types": "./dist/types/src/unstyledPrimitives/index.d.ts",
22
+ "default": "./dist/src/unstyledPrimitives/index.js"
23
+ },
20
24
  "./meta.json": "./dist/src/utils/meta/meta.json",
21
25
  "./dist/src/utils/meta/meta.json": "./dist/src/utils/meta/meta.json",
22
26
  "./package.json": "./package.json"
@@ -53,6 +57,7 @@
53
57
  "@react-native-picker/picker": "^2.4.10",
54
58
  "@rn-primitives/portal": "^1.4.0",
55
59
  "@rn-primitives/select": "^1.4.0",
60
+ "@rn-primitives/toast": "^1.5.2",
56
61
  "autolinker": "^4.0.0",
57
62
  "deepmerge": "^4.2.2",
58
63
  "lodash": "^4.18.1",
@@ -67,7 +72,7 @@
67
72
  "@babel/runtime": "^7.29.2",
68
73
  "@gorhom/bottom-sheet": "^5.2.8",
69
74
  "@jobber/design": "0.124.0",
70
- "@jobber/hooks": "2.21.4",
75
+ "@jobber/hooks": "2.22.0",
71
76
  "@react-native-community/datetimepicker": "^8.4.5",
72
77
  "@react-native/babel-preset": "^0.82.1",
73
78
  "@storybook/addon-a11y": "10.3.5",
@@ -118,5 +123,5 @@
118
123
  "react-native-screens": ">=4.18.0",
119
124
  "react-native-svg": ">=12.0.0"
120
125
  },
121
- "gitHead": "b8df45944a9fe1a98b5ca5d0b872169d37f5ed4a"
126
+ "gitHead": "27ecbc65e3a2f1d43207a2e3fc0e754bac273be2"
122
127
  }
@@ -0,0 +1,11 @@
1
+ /**
2
+ * Unstyled RN Primitives for advanced/experimental use when Atlantis does not
3
+ * provide the component or API a product needs. Prefer styled Atlantis components
4
+ * when possible, and reach out to UXF for guidance and support.
5
+ *
6
+ * Atlantis manages the dependency version; consumers own styling, positioning,
7
+ * timing, and composition. These exports preserve the upstream API.
8
+ *
9
+ * RN Primitives docs: https://rnprimitives.com/toast/
10
+ */
11
+ export * as Toast from "@rn-primitives/toast";