Adding updated content in typing effect element

elements/tooltip.json

@@ -0,0 +1,15 @@
+{
+    "data" : {
+        "tooltipVisible" : "A boolean value that will show or hide the tooltip.",
+        "tooltipText": "The text inside the tooltip.",
+        "tooltipArrow" : "A boolean value that indicates whether or not to show the tooltip arrow.",
+        "tooltipPosition" : "The position to display the tooltip. This value can be 'top', 'right', 'bottom', or 'left'."
+    },
+    "alert_notification" : {
+        "title" : "Create a Tooltip Plugin",
+        "description" : "This specific element would be easier to re-use in your applications if it were converted into its own plugin. Here's a guide that will show you how to <a href=\"/pines/docs/alpine-plugin\" class=\"underline\">convert this element into it's own plugin</a>."
+    },
+    "additional" : {
+        "description" : "<p>Each tab button needs to contain the following attributes <strong>:id=\"$id(tabId)\" @click=\"tabButtonClicked($el)\"</strong>. Each button will sequentially show or hide any content element with the following attributes <strong>:id=\"$id(tabId + '-content')\" x-show=\"tabContentActive($el)\"</strong>. See example one below for a simple demo of this functionality.</p>"
+    }
+}

elements/typing-effect.html

@@ -4,10 +4,10 @@
         textArray : ['Alpine JS is Amazing', 'It is Truly Awesome!', 'You Have to Try It!'],
         textIndex: 0,
         charIndex: 0,
-        pauseEnd: 1500,
-        cursorSpeed: 550,
-        pauseStart: 20,
         typeSpeed: 110,
+        cursorSpeed: 550,
+        pauseEnd: 1500,
+        pauseStart: 20,
         direction: 'forward',
     }" 
     x-init="$nextTick(() => {

elements/typing-effect.json

@@ -0,0 +1,17 @@
+{
+    "data" : {
+        "text" : "This is the variable that contains the current string being displayed.",
+        "textArray": "An array of strings to be typed on the screen.",
+        "textIndex" : "This variable is used to keep track of which string in the textArray is currently being displayed.",
+        "charIndex" : "This is used to keep track of the current character index that is being typed onto the screen.",
+        "typeSpeed" : "In milliseconds, this is the speed that each character will be typed onto the screen.",
+        "cursorSpeed" : "In milliseconds, this is the speed that the cursor will blink on and off.",
+        "pauseEnd" : "In milliseconds, this is the time that the typing will pause after the string has been typed onto the screen.",
+        "pauseStart" : "In milliseconds, this is the time that the typing will pause before each new string begins typing onto the screen.",
+        "direction" : "This is the direction that the typing will occur. The options are 'forward' or 'backward'."
+    },
+    "alert_notification" : {
+        "title" : "Typing Effect Tutorial",
+        "description" : "If you want to learn more about how this functions, you may be interested in our extensive tutorial on how to <a href=\"https://devdojo.com/tnylea/create-a-typing-effect-in-alpinejs\" target=\"_blank\" class=\"underline\">Create a Typing Effect in AlpineJS</a>."
+    }
+}