Small improvements

Author: erwinheldy

src/docs/code/basic.html.txt

@@ -1,8 +1,5 @@
-<input type="text" class="form-control example" value="html,css,js">
-<input type="text" class="form-control example" placeholder="Add a tag then press comma or Enter" />
+<input type="text" class="form-control" value="html,css,js" id="example-basic">
 
 <script>
-  document.querySelectorAll('.example').forEach((input) => {
-    UseBootstrapTag(input)
-  })
+  UseBootstrapTag(document.getElementById('example-basic'))
 </script>

src/docs/code/max.html.txt

@@ -1,5 +1,5 @@
 <!-- Using data-ub-tag-max attribute: -->
-<input type="text" class="form-control" placeholder="Enter tags (max 3)" data-ub-tag-max="3" id="example-max" />
+<input type="text" class="form-control" placeholder="Enter tags (max 3)" data-ub-tag-max="3" id="example-max">
 
 <script>
   UseBootstrapTag(document.getElementById('example-max'))

src/docs/code/methods.html.txt

@@ -1,4 +1,4 @@
-<input type="text" class="form-control" value="html,css,js" id="example-methods" />
+<input type="text" class="form-control" value="html,css,js" id="example-methods">
 <button class="btn btn-sm btn-success" type="button" id="addValue-string">addValue('react')</button>
 <button class="btn btn-sm btn-success" type="button" id="addValue-string-with-separator">addValue('vue,svelte')</button>
 <button class="btn btn-sm btn-success" type="button" id="addValue-array">addValue(['solid', 'qwik'])</button>

src/docs/code/onblur.html.txt

@@ -0,0 +1,6 @@
+<!-- Using data-ub-tag-no-input-onblur attribute: -->
+<input type="text" class="form-control" data-ub-tag-no-input-onblur id="example-no-input-onblur">
+
+<script>
+  UseBootstrapTag(document.getElementById('example-no-input-onblur'))
+</script>

src/docs/code/placeholder.html.txt

@@ -0,0 +1,5 @@
+<input type="text" class="form-control" placeholder="Add a tag then press comma or Enter" id="example-placeholder">
+
+<script>
+  UseBootstrapTag(document.getElementById('example-placeholder'))
+</script>

src/docs/code/validation.html.txt

@@ -1,6 +1,6 @@
 <form class="needs-validation vstack gap-3" novalidate>
   <div>
-    <input type="text" class="form-control example-validation" name="tags" placeholder="Add a tag" required id="example-validation" />
+    <input type="text" class="form-control example-validation" name="tags" placeholder="Add a tag" required id="example-validation">
     <div class="invalid-feedback">This field is required.</div>
     <div class="valid-feedback">Looks good!</div>
   </div>
@@ -10,11 +10,11 @@
 <!-- Server side: just add "is-invalid" or "is-valid" -->
 <div class="vstack gap-3">
   <div>
-    <input type="text" class="form-control example-validation is-invalid" placeholder="Add a tag" />
+    <input type="text" class="form-control example-validation is-invalid" placeholder="Add a tag">
     <div class="invalid-feedback">This field is required.</div>
   </div>
   <div>
-    <input type="text" class="form-control example-validation is-valid" placeholder="Add a tag" value="use,bootstrap,tag" />
+    <input type="text" class="form-control example-validation is-valid" placeholder="Add a tag" value="use,bootstrap,tag">
     <div class="valid-feedback">Looks good!</div>
   </div>
 </div>

vite.config.lib.ts

@@ -21,7 +21,7 @@ export default defineConfig({
     dts({
       include: pkg.source,
       insertTypesEntry: true,
-      afterBuild: () => rename('dist/use-bootstrap-tag.d.ts', pkg.types),
+      afterBuild: () => rename(`dist/${pkg.name}.d.ts`, pkg.types),
     }),
   ],
 })