Update the docs to reflect our change to a 7-day trial (#251)

Author: mellson

blog/2022-10-18-stately-studio-1-0/index.mdx

@@ -14,7 +14,7 @@ We’re excited to announce the release of Stately Studio 1.0! 🚀 Our mission
 
 ## Thank you for your support!
 
-Earlier this year, we released [the first beta of Stately Editor & Stately Registry](/blog/2022-2-6-stately-editor-public-beta/index.mdx) (together called the Stately Studio). We also released [Stately Viz](https://stately.ai/viz), a visualizer for XState machines, and the [XState VS Code extension](https://marketplace.visualstudio.com/items?itemName=statelyai.stately-vscode). Since then, over 10,000 of you have tried our tools out, creating and sharing tens of thousands of machines (we don’t know the exact number because machines built with the extension are always private!) 
+Earlier this year, we released [the first beta of Stately Editor & Stately Registry](/blog/2022-2-6-stately-editor-public-beta/index.mdx) (together called the Stately Studio). We also released [Stately Viz](https://stately.ai/viz), a visualizer for XState machines, and the [XState VS Code extension](https://marketplace.visualstudio.com/items?itemName=statelyai.stately-vscode). Since then, over 10,000 of you have tried our tools out, creating and sharing tens of thousands of machines (we don’t know the exact number because machines built with the extension are always private!)
 
 Thank you for giving our tools a go and for all the valuable feedback you’ve given us; we’ve been blown away by the response. We’re listening and continuing to improve the Stately Studio. As always, you can [create and upvote feature requests on our Canny roadmap](https://feedback.stately.ai).
 
@@ -32,7 +32,7 @@ Teams (previously known as Systems) are available on [our new Pro subscription](
 
 ## Machine visibility and roles
 
-Machines may contain business logic you don’t want to share with the world; that’s why we’ve introduced **visibility** and **roles**. You can set a machine to be *private*, *public*, or *unlisted*. Private machines are only visible to you and your teammates. Public machines are visible to everyone, and [discoverable through search](https://stately.ai/registry/discover). Unlisted machines are only visible to those with the link, as they don’t appear in search results.
+Machines may contain business logic you don’t want to share with the world; that’s why we’ve introduced **visibility** and **roles**. You can set a machine to be _private_, _public_, or _unlisted_. Private machines are only visible to you and your teammates. Public machines are visible to everyone, and [discoverable through search](https://stately.ai/registry/discover). Unlisted machines are only visible to those with the link, as they don’t appear in search results.
 
 ![Share menu in the Stately Studio with an option to copy link, and set the project to either public, unlisted, or private. The private option is selected and Permissions text under the option states that this project is only visible to you and your team.](studio-1-0-visibility.png)
 
@@ -42,7 +42,7 @@ Private/unlisted machines and team roles are available on [our new Pro subscript
 
 ## Editor redesign
 
-You might have noticed a refreshed redesign of the editor. The editor view is now more project-centric, allowing you to switch between machines with a single click. And we’ve improved the layout of states to give you more space to create and rearrange states. 
+You might have noticed a refreshed redesign of the editor. The editor view is now more project-centric, allowing you to switch between machines with a single click. And we’ve improved the layout of states to give you more space to create and rearrange states.
 
 ![Simulate view in the Stately Studio showing a video player machine. In the mini state of the machine, there’s an image of a video player embedded in the description. There’s a popover menu showing the simulation event log. There’s a drawer icon in the top left showing where the tree view is hidden away. A breadcrumb in the header shows this machine is in the Stately team and Learn Stately studio project. The current tab in the top navigation is Simulate, but Edit is also available.](studio-1-0-simulate.png)
 
@@ -60,7 +60,7 @@ You asked, and we listened (we’re currently in the listening state). We’ve a
 - CodeSandbox
 - StackBlitz
 - SVG, PNG, PDF
-- And others 
+- And others
 
 [Request your favorite export options on our Canny roadmap](https://feedback.stately.ai).
 
@@ -79,10 +79,10 @@ We have so many things planned for the future:
 
 ## Try out the Studio
 
-All our new Pro features are available with a 30-day free trial you can try with your whole team. Upgrade today using the Upgrade button in [the Stately Studio](https://stately.ai/editor) or Sign in with GitHub to create a new account.
+All our new Pro features are available with a 7-day free trial you can try with your whole team. Upgrade today using the Upgrade button in [the Stately Studio](https://stately.ai/editor) or Sign in with GitHub to create a new account.
 
 ![The Upgrade button has an orange border and is located in the top right of the Studio navigation, between the Export machine icon and the user avatar.](studio-1-0-upgrade.png)
 
 If you’re a Product Hunt fan, you can also [find Stately Studio 1.0 on Product Hunt](https://www.producthunt.com/posts/stately-studio-1-0).
 
-Have any questions? Join us in [our office hours live stream this Friday](https://www.youtube.com/watch?v=JcT7iJOPFjE), where we’ll answer your questions and give you more demos.
+Have any questions? Join us in [our office hours live stream this Friday](https://www.youtube.com/watch?v=JcT7iJOPFjE), where we’ll answer your questions and give you more demos.

blog/2023-03-09-import-all-machines-from-github-repo/index.mdx

@@ -1,11 +1,11 @@
 ---
-title: "Import all machines from your GitHub repo"
+title: 'Import all machines from your GitHub repo'
 description: Learn about a new pro feature in the Stately Studio; importing all your machines from a GitHub repo.
 tags: [stately, studio, integration, github]
 authors: [laura]
 image: /blog/2023-03-09-import-all-machines-from-github-repo.png
 slug: 2023-03-09-import-all-machines-from-github-repo
-date:  2023-03-09
+date: 2023-03-09
 ---
 
 Last month, Anders showed you how you could [import a machine from GitHub by changing the GitHub URL in the browser’s address bar](/blog/2023-02-06-github-import-machines/index.mdx). We’ve added more to our GitHub integration. Our [Pro](https://stately.ai/pricing) users can now import all the machines from a repository into a Stately Studio project with the **Import from GitHub** button.
@@ -26,8 +26,8 @@ If you’ve been working with state machines in XState or using the [XState VS C
 
 Importing a machine with **Import from GitHub** or importing a machine with a GitHub URL will prompt you to **Allow integration** to give our GitHub integration access to your GitHub repositories. You will only be prompted if you have not yet given the GitHub integration access on your current device.
 
-Currently, the **Import from GitHub** feature imports all machines from the *default branch* in your GitHub repository. If you want to import machines from a different branch or a pull request, we recommend [importing each machine from a GitHub URL](/blog/2023-02-06-github-import-machines/index.mdx).
+Currently, the **Import from GitHub** feature imports all machines from the _default branch_ in your GitHub repository. If you want to import machines from a different branch or a pull request, we recommend [importing each machine from a GitHub URL](/blog/2023-02-06-github-import-machines/index.mdx).
 
 ## Try our Pro plan to import from GitHub
 
-Import from GitHub is one of the [Pro features](https://stately.ai/docs/studio-pro-plan) of the Stately Studio. We offer a **30-day free trial** on the [Stately Studio Pro account](https://stately.ai/pricing) so you can explore how our Pro features work for you and your team today!
+Import from GitHub is one of the [Pro features](https://stately.ai/docs/studio-pro-plan) of the Stately Studio. We offer a **7-day free trial** on the [Stately Studio Pro account](https://stately.ai/pricing) so you can explore how our Pro features work for you and your team today!

blog/2023-05-02-track-changes-as-you-work-with-version-history/index.mdx

@@ -1,7 +1,17 @@
 ---
 title: Track changes as you work with Version History
 description: Version History is one of our most recent Pro features in Stately Studio. You can track changes to your work as you go.
-tags: [versions, stately, studio, tutorial, editor, announcement, modeling, statechart]
+tags:
+  [
+    versions,
+    stately,
+    studio,
+    tutorial,
+    editor,
+    announcement,
+    modeling,
+    statechart,
+  ]
 authors: [kevin]
 image: /blog/2023-05-02-track-changes-as-you-work-with-version-history.png
 slug: 2023-05-02-version-history
@@ -87,4 +97,4 @@ Saving versions of machines is a significant step in a larger effort to make the
 
 ## Try it out
 
-Version history is included with the [Pro subscription](https://stately.ai/pricing) to Stately Studio. If you’re not a Pro subscriber yet, you can still get started today with versioning your work by getting a 30-day free trial!
+Version history is included with the [Pro subscription](https://stately.ai/pricing) to Stately Studio. If you’re not a Pro subscriber yet, you can still get started today with versioning your work by getting a 7-day free trial!

blog/2023-05-04-everything-new-since-stately-studio-1-0/index.mdx

@@ -1,11 +1,22 @@
 ---
-title: "Everything new since Stately Studio 1.0!"
+title: 'Everything new since Stately Studio 1.0!'
 description: It’s been more than six months since the release of Stately Studio 1.0, and we’ve been busy working on Stately Studio and XState. Here are some of the highlights.
-tags: [stately, studio, version histroy, live simulation mode, import, github, xstate, extension, docs]
+tags:
+  [
+    stately,
+    studio,
+    version histroy,
+    live simulation mode,
+    import,
+    github,
+    xstate,
+    extension,
+    docs,
+  ]
 authors: [laura]
 image: /blog/2023-05-04-everything-new-since-stately-studio-1-0.png
 slug: everything-new-since-stately-studio-1-0
-date: "2023-05-04"
+date: '2023-05-04'
 ---
 
 It’s been more than six months since the release of Stately Studio 1.0, and we’ve been busy working on Stately Studio and XState. Here are some of the highlights:
@@ -16,7 +27,7 @@ It’s been more than six months since the release of Stately Studio 1.0, and we
 
 We’ve added [Version History](https://stately.ai/blog/2023-05-02-version-history) to Stately Studio, so you can easily track the changes made to your machines over time, whether you want to align your machines with versions in your codebase or record milestones for your machine. Version History is the first of our new features exclusively for [Pro users](https://stately.ai/docs/studio-pro-plan).
 
-[Try out all these features with our 30-day free trial →](https://stately.ai/pricing)
+[Try out all these features with our 7-day free trial →](https://stately.ai/pricing)
 
 ![Version History panel opened from the toolbox showing a current version selected and three older versions.](2023-05-04-version-history.png)
 
@@ -78,7 +89,7 @@ You can now quickly move machines between projects from the machines list menu.
 
 Finally, we’re happy to announce that we’ve extended our pro features to all team members for their own projects, not just projects worked on as part of your team. Everyone with a seat on your team can now take advantage of new and upcoming features, including Import from GitHub, Version History, and Live Simulation Mode.
 
-[Try all of Stately Studio’s Pro features with our 30-day free trial →](https://stately.ai/pricing)
+[Try all of Stately Studio’s Pro features with our 7-day free trial →](https://stately.ai/pricing)
 
 ## More coming very soon
 

blog/2023-05-18-explain-your-machines-with-annotations/index.mdx

@@ -27,6 +27,6 @@ _You can now also [embed your machines anywhere `iframe`s are supported](https:/
 
 Annotations are not exported when you [export your machine as code](https://stately.ai/docs/export-as-code), so you can add as many as you like without affecting your codebase!
 
-Annotations are particularly useful when you’re sharing machines with your teams. [Teams](https://stately.ai/docs/teams) are a pro feature of Stately Studio, where you can share and collaborate on your app logic. We offer a **30-day free trial** on the [Stately Studio Pro account](https://stately.ai/pricing) so you can explore how our Pro features work for you and your team.
+Annotations are particularly useful when you’re sharing machines with your teams. [Teams](https://stately.ai/docs/teams) are a pro feature of Stately Studio, where you can share and collaborate on your app logic. We offer a **7-day free trial** on the [Stately Studio Pro account](https://stately.ai/pricing) so you can explore how our Pro features work for you and your team.
 
 We hope annotations make sharing a link to your machine even easier without additional supporting information or explanation. Try them out today and see how they can enhance your workflow!

blog/2023-06-14-supercharge-the-canvas/index.mdx

@@ -173,7 +173,7 @@ Set a color by selecting a state or transition and choosing the one you want fro
   </p>
 </video>
 
-Colors are just for Pro subscribers. So if you haven’t signed up yet, [try it out with a free 30-day trial](https://stately.ai/pricing)!
+Colors are just for Pro subscribers. So if you haven’t signed up yet, [try it out with a free 7-day trial](https://stately.ai/pricing)!
 
 ## Try out Stately now
 

blog/2023-07-24-improving-your-flows-with-color/index.mdx

@@ -14,7 +14,8 @@ As part of our recent colossal release, we’ve launched a new feature for pro u
   <ThemedImage
     alt="State machine showing how to choose colors from the color palette, and the colors for default (grey in darkmode, white in lightmode), pink, purple, red, orange, yellow, green, and blue states and transitions."
     sources={{
-      light: '/blog/2023-07-24-improving-your-flows-with-color/choosing-colors.png',
+      light:
+        '/blog/2023-07-24-improving-your-flows-with-color/choosing-colors.png',
       dark: '/blog/2023-07-24-improving-your-flows-with-color/choosing-colors-dm.png',
     }}
   />
@@ -34,21 +35,30 @@ Many folks requested colors for their state machines, not just because colors ma
 
 One common use is to connect color to a meaning, such as making error states red and success states green. You could set transition colors to identify a common target, shared source, or group states and transitions meaningfully for your team.
 
-<EmbedMachine name="Editor page machine" embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=8b2c257c-2060-45a5-bdb1-e91b7f5c9318" />
+<EmbedMachine
+  name="Editor page machine"
+  embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=8b2c257c-2060-45a5-bdb1-e91b7f5c9318"
+/>
 
 The machine above uses yellow for user events, purple for system events, and red for errors.
 
 ### Organize flows into regions with distinct colors
 
 Some other ways to use color are to use different colors to highlight different user personas or stories or mark popular paths through your app based on usage data.
 
-<EmbedMachine name="" embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=35d9c021-9b00-4c6f-85c9-1f2fece5d0c5" />
+<EmbedMachine
+  name=""
+  embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=35d9c021-9b00-4c6f-85c9-1f2fece5d0c5"
+/>
 
 ### Use color for fun!
 
 Or maybe you want to use color for fun. You can use color to decorate your flows to fit your brand or decorate your states and transitions.
 
-<EmbedMachine name="Traffic light machine" embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=e35f9079-722e-4812-8103-e63ada46456f" />
+<EmbedMachine
+  name="Traffic light machine"
+  embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=e35f9079-722e-4812-8103-e63ada46456f"
+/>
 
 ## How to use colors in your flows
 
@@ -66,12 +76,14 @@ If you want to explain your color coding, we’ve had success using an annotatio
   />
 </p>
 
-
 When using colors to convey information, it is essential to keep accessibility in mind. Not everyone perceives color the same way, and as many as 8% of men and 0.5% of women are color blind. Ensure your statecharts are inclusive by using color to emphasize or decorate your machines, and [do not use color as the only way to convey information](https://www.w3.org/WAI/WCAG21/Understanding/use-of-color.html).
 
 To make your colored machines more accessible, add the color or symbolic name as a tag on your states and transitions, or include them in their descriptions.
 
-<EmbedMachine name="Expense machine" embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=9a62b8b1-b5a3-4b15-a5ed-acfe5f65da80" />
+<EmbedMachine
+  name="Expense machine"
+  embedURL="https://stately.ai/registry/editor/embed/7b5d60dc-94b0-4a1e-9ade-ea644b8cc35f?machineId=9a62b8b1-b5a3-4b15-a5ed-acfe5f65da80"
+/>
 
 Colors are a powerful feature that helps you improve your statecharts' organization, clarity, and user-friendliness. To learn more about using Colors, check out our [documentation](/docs/colors).
 
@@ -92,4 +104,4 @@ Colors is one of many Pro features we've recently added to Stately. Our current
 
 And we've got many more coming soon! Want to suggest a feature? Leave a feature request on our feedback board or upvote other features we should prioritize.
 
-Want to try the Pro plan? You can get a 30-day free trial when you [join from our website](/pricing) or [upgrade](/docs/upgrade) from [the editor](https://state.new).
+Want to try the Pro plan? You can get a 7-day free trial when you [join from our website](/pricing) or [upgrade](/docs/upgrade) from [the editor](https://state.new).

blog/2023-09-01-generate-flow/index.mdx

@@ -20,4 +20,4 @@ There are so many reasons you might want to generate your flows, including:
 - You want an example of a state machine for a particular flow
 - You’re new and want to get an idea of how you can model state machines
 
-With 1000 calls a month, and a [free 30-day Pro trial](https://stately.ai/pricing), get ready to create state machines in no time!
+With 1000 calls a month, and a [free 7-day Pro trial](https://stately.ai/pricing), get ready to create state machines in no time!

blog/2023-09-01-lock-machines/index.mdx

@@ -22,6 +22,6 @@ Locked machines have a Locked status displayed in the editor’s top bar. If you
 
 If somebody else is viewing or editing the machine when it is locked, their changes will not be saved, and they will be notified that the machine is now locked.
 
-[**Try all our Pro features free on our 30 day trial**](https://stately.ai/pricing).
+[**Try all our Pro features free on our 7-day trial**](https://stately.ai/pricing).
 
 [Read more about locking machines in our docs](https://stately.ai/docs/lock-machines).

docs/actors.mdx

@@ -281,7 +281,7 @@ promiseActor.start();
 
 ### Transition function logic (`fromTransition(...)`) {#fromtransition}
 
-Transition actor logic is described by a [transition function](migration.mdx#use-actor-logic-creators-for-invokesrc-instead-of-functions), similar to a [reducer](fromTransition). Transition functions take the current `state` and received `event` object as arguments, and return the next state. Actors created from transition logic (“transition actors”) can:
+Transition actor logic is described by a [transition function](migration.mdx#use-actor-logic-creators-for-invokesrc-instead-of-functions), similar to a [reducer](cheatsheet#creating-transition-logic). Transition functions take the current `state` and received `event` object as arguments, and return the next state. Actors created from transition logic (“transition actors”) can:
 
 - Receive events
 - Emit snapshots of its state
@@ -430,17 +430,17 @@ const machine = createMachine({
           return () => {
             /* cleanup function */
           };
-        })
+        }),
       },
       // highlight-start
       on: {
         error: {
-          actions: ({ event }) => console.error(event.data)
-        }
-      }
+          actions: ({ event }) => console.error(event.data),
+        },
+      },
       // highlight-end
-    }
-  }
+    },
+  },
 });
 ```