1 files changed, 0 insertions, 136 deletions
diff --git a/alpinejs/packages/docs/src/en/globals/alpine-data.md b/alpinejs/packages/docs/src/en/globals/alpine-data.md
deleted file mode 100644
index 77246a5..0000000
--- a/alpinejs/packages/docs/src/en/globals/alpine-data.md
+++ /dev/null
@@ -1,136 +0,0 @@
----
-order: 1
-title: data()
----
-
-# `Alpine.data`
-
-`Alpine.data(...)` provides a way to re-use `x-data` contexts within your application.
-
-Here's a contrived `dropdown` component for example:
-
-```alpine
-<div x-data="dropdown">
-    <button @click="toggle">...</button>
-
-    <div x-show="open">...</div>
-</div>
-
-<script>
-    document.addEventListener('alpine:init', () => {
-        Alpine.data('dropdown', () => ({
-            open: false,
-
-            toggle() {
-                this.open = ! this.open
-            }
-        }))
-    })
-</script>
-```
-
-As you can see we've extracted the properties and methods we would usually define directly inside `x-data` into a separate Alpine component object.
-
-<a name="registering-from-a-bundle"></a>
-## Registering from a bundle
-
-If you've chosen to use a build step for your Alpine code, you should register your components in the following way:
-
-```js
-import Alpine from `alpinejs`
-import dropdown from './dropdown.js'
-
-Alpine.data('dropdown', dropdown)
-
-Alpine.start()
-```
-
-This assumes you have a file called `dropdown.js` with the following contents:
-
-```js
-export default () => ({
-    open: false,
-
-    toggle() {
-        this.open = ! this.open
-    }
-})
-```
-
-<a name="initial-parameters"></a>
-## Initial parameters
-
-In addition to referencing `Alpine.data` providers by their name plainly (like `x-data="dropdown"`), you can also reference them as functions (`x-data="dropdown()"`). By calling them as functions directly, you can pass in additional parameters to be used when creating the initial data object like so:
-
-```alpine
-<div x-data="dropdown(true)">
-```
-```js
-Alpine.data('dropdown', (initialOpenState = false) => ({
-    open: initialOpenState
-}))
-```
-
-Now, you can re-use the `dropdown` object, but provide it with different parameters as you need to.
-
-<a name="init-functions"></a>
-## Init functions
-
-If your component contains an `init()` method, Alpine will automatically execute it before it renders the component. For example:
-
-```js
-Alpine.data('dropdown', () => ({
-    init() {
-        // This code will be executed before Alpine
-        // initializes the rest of the component.
-    }
-}))
-```
-
-<a name="using-magic-properties"></a>
-## Using magic properties
-
-If you want to access magic methods or properties from a component object, you can do so using the `this` context:
-
-```js
-Alpine.data('dropdown', () => ({
-    open: false,
-
-    init() {
-        this.$watch('open', () => {...})
-    }
-}))
-```
-
-<a name="encapsulating-directives-with-x-bind"></a>
-## Encapsulating directives with `x-bind`
-
-If you wish to re-use more than just the data object of a component, you can encapsulate entire Alpine template directives using `x-bind`.
-
-The following is an example of extracting the templating details of our previous dropdown component using `x-bind`:
-
-```alpine
-<div x-data="dropdown">
-    <button x-bind="trigger"></button>
-
-    <div x-bind="dialogue"></div>
-</div>
-```
-
-```js
-Alpine.data('dropdown', () => ({
-    open: false,
-
-    trigger: {
-        ['@click']() {
-            this.open = ! this.open
-        },
-    },
-
-    dialogue: {
-        ['x-show']() {
-            return this.open
-        },
-    },
-}))
-```